3.0.0-rc.1 release

Author: enact-bot

CHANGELOG.md

@@ -2,6 +2,17 @@
 
 The following is a curated list of changes in the Enact agate module, newest changes on the top.
 
+## [3.0.0-rc.1] - 2025-05-29
+
+### Changed
+
+- Component selectors from ui-tests views to work with `webdriverio` version 9
+- `isDisplayed` method to work with `webdriverio` version 9
+
+### Fixed
+
+- `agate/IncrementSlider` and `agate/Slider` vertical knob alignment in Electro skin.
+
 ## [3.0.0-alpha.3] - 2025-01-22
 
 - Updated `React` dependency to version `19.0.0`

DropManager/DropManager.js

@@ -356,7 +356,7 @@ const DropManager = hoc(defaultConfig, (configHoc, Wrapped) => {
 			}
 
 			return (
-				<DropManagerContext.Provider
+				<DropManagerContext
 					value={{
 						arrangement,
 						arranging: this.state.dragging,
@@ -368,7 +368,7 @@ const DropManager = hoc(defaultConfig, (configHoc, Wrapped) => {
 						className={classnames(className, css.dropManager, (arrangeable ? css.arrangeable : ''), {dragging: this.state.dragging})}
 						// draggable="true"
 					/>
-				</DropManagerContext.Provider>
+				</DropManagerContext>
 			);
 		}
 	};
@@ -428,14 +428,14 @@ const Draggable = (Wrapped) => kind({
 			<DropManagerContext.Consumer>
 				{({arrangement, arrangeable}) => {
 					return (
-						<DraggableContainerContext.Provider value={{containerShape}}>
+						<DraggableContainerContext value={{containerShape}}>
 							<Wrapped
 								{...rest}
 								draggable={arrangeable && draggable}
 								data-slot={draggable ? (arrangement && (arrangement[name] || arrangement[slot]) || (name || slot)) : null}
 								data-slot-name={slot}
 							/>
-						</DraggableContainerContext.Provider>
+						</DraggableContainerContext>
 					);
 				}}
 			</DropManagerContext.Consumer>

IncrementSlider/IncrementSlider.module.less

@@ -102,6 +102,7 @@
 				order: 2;
 				margin: @agate-incrementslider-vertical-slider-margin;
 				padding: @agate-incrementslider-vertical-slider-padding;
+				transform: @agate-incrementslider-bg-transform-vertical;
 
 				&::before {
 					border-radius: @agate-incrementslider-border-radius;

Item/Item.js

@@ -114,7 +114,6 @@ const ItemContent = kind({
 		}
 	},
 
-	// eslint-disable-next-line enact/prop-types
 	render: ({centered, content, css, marqueeOn, label, labelPosition, orientation, styler, ...rest}) => {
 
 		if (!label) {

Panels/SharedStateDecorator.js

@@ -137,9 +137,9 @@ const SharedStateDecorator = hoc(defaultConfig, (config, Wrapped) => {
 			delete props.noSharedState;
 
 			return (
-				<SharedState.Provider value={this.sharedState}>
+				<SharedState value={this.sharedState}>
 					<Wrapped {...props} />
-				</SharedState.Provider>
+				</SharedState>
 			);
 		}
 	};

README.md

@@ -33,7 +33,7 @@ Alright, chill. We built several apps based on Agate that you can check out at t
 
 Unless otherwise specified, all content, including all source code files and documentation files in this repository are:
 
-Copyright (c) 2012-2024 LG Electronics
+Copyright (c) 2012-2025 LG Electronics
 
 Unless otherwise specified or set forth in the NOTICE file, all content, including all source code files and documentation files in this repository are: Licensed under the Apache License, Version 2.0 (the "License"); you may not use this content except in compliance with the License. You may obtain a copy of the License at
 

Scroller/Scroller.js

@@ -83,7 +83,7 @@ let Scroller = (props) => {
 
 	// Render
 	return (
-		<ResizeContext.Provider {...resizeContextProps}>
+		<ResizeContext {...resizeContextProps}>
 			<div {...scrollContainerProps}>
 				<div {...scrollInnerContainerProps}>
 					<ScrollContentWrapper {...scrollContentWrapperProps}>
@@ -93,7 +93,7 @@ let Scroller = (props) => {
 				</div>
 				{isHorizontalScrollbarVisible ? <Scrollbar {...horizontalScrollbarProps} /> : null}
 			</div>
-		</ResizeContext.Provider>
+		</ResizeContext>
 	);
 };
 

Slider/Slider.module.less

@@ -136,6 +136,10 @@
 			.knob {
 				bottom: ~"calc(var(--ui-slider-proportion-end-knob) * 100%)";
 				top: auto;
+
+				&::before {
+					transform: @agate-slider-knob-transform-vertical;
+				}
 			}
 		}
 
@@ -199,6 +203,12 @@
 					width: @agate-slider-active-knob-width;
 					border-radius: @agate-slider-active-knob-border-radius;
 				}
+
+				&.vertical {
+					.knob::before {
+						transform: @agate-slider-active-knob-transform-vertical;
+					}
+				}
 			}
 
 			:global(.spotlight-input-touch) &.pressed {

SliderButton/SliderButton.js

@@ -69,7 +69,6 @@ const SliderKnob = kind({
 	},
 	render: ({...rest}) => {
 		delete rest.value;
-		// eslint-disable-next-line enact/prop-types
 		delete rest.tooltipComponent;
 		return (
 			<div
@@ -112,9 +111,7 @@ const SliderProgress = kind({
 		className: 'track'
 	},
 	render: ({children, css, values, ...rest}) => {
-		// eslint-disable-next-line enact/prop-types
 		delete rest.progressAnchor;
-		// eslint-disable-next-line enact/prop-types
 		delete rest.backgroundProgress;
 		return (
 			<Row {...rest} align="center">

ThemeDecorator/ThemeDecorator.js

@@ -335,10 +335,10 @@ const ThemeDecorator = hoc(defaultConfig, (config, Wrapped) => {
 			);
 
 			return (
-				<ThemeContext.Provider value={{accent, highlight}}>
+				<ThemeContext value={{accent, highlight}}>
 					{customSkin ? <CustomizableSkinStyle className={customizableSkinClassName} accent={accent} highlight={highlight} /> : null}
 					<App {...rest} accent={accent} highlight={highlight} className={allClassNames} />
-				</ThemeContext.Provider>
+				</ThemeContext>
 			);
 		}
 	};