From 66a077beb7cb4b43cc295194fb5078a77684526f Mon Sep 17 00:00:00 2001 From: Juwon Jeong Date: Thu, 16 May 2024 09:52:13 +0900 Subject: [PATCH 01/11] Fix key spread warning Enact-DCO-1.0-Signed-off-by: Juwon Jeong (juwon.jeong@lge.com) --- packages/ui/Repeater/Repeater.js | 3 ++- 1 file changed, 2 insertions(+), 1 deletion(-) diff --git a/packages/ui/Repeater/Repeater.js b/packages/ui/Repeater/Repeater.js index f2c3c6e3a1..33e2f9a3b1 100644 --- a/packages/ui/Repeater/Repeater.js +++ b/packages/ui/Repeater/Repeater.js @@ -124,7 +124,8 @@ const RepeaterBase = kind({ } if (indexProp) props[indexProp] = index; - return ; + const {key, ...rest} = {...props}; + return ; }); } }, From 469b272db77816ba366f3b6d6bfbcaa3ea6dd33f Mon Sep 17 00:00:00 2001 From: Juwon Jeong Date: Fri, 17 May 2024 10:25:41 +0900 Subject: [PATCH 02/11] Replace defaultProps with ES6 default parameters Enact-DCO-1.0-Signed-off-by: Juwon Jeong (juwon.jeong@lge.com) --- .../SpotlightContainerDecorator.js | 8 +- packages/ui/Scroller/Scroller.js | 47 ++++---- .../ui/Slottable/tests/Slottable-specs.js | 6 +- packages/ui/Toggleable/Toggleable.js | 9 +- packages/ui/Touchable/Touchable.js | 8 +- packages/ui/VirtualList/VirtualList.js | 102 +++++++++++------- packages/ui/useScroll/Scrollbar.js | 10 +- packages/ui/useScroll/ScrollbarTrack.js | 6 +- 8 files changed, 101 insertions(+), 95 deletions(-) diff --git a/packages/spotlight/SpotlightContainerDecorator/SpotlightContainerDecorator.js b/packages/spotlight/SpotlightContainerDecorator/SpotlightContainerDecorator.js index e77a4ee8f4..b06386a42b 100644 --- a/packages/spotlight/SpotlightContainerDecorator/SpotlightContainerDecorator.js +++ b/packages/spotlight/SpotlightContainerDecorator/SpotlightContainerDecorator.js @@ -180,7 +180,7 @@ const SpotlightContainerDecorator = hoc(defaultConfig, (config, Wrapped) => { // eslint-disable-next-line no-shadow function SpotlightContainerDecorator (props) { - const {spotlightDisabled, spotlightId, spotlightMuted, spotlightRestrict, ...rest} = props; + const {spotlightDisabled = false, spotlightId, spotlightMuted = false, spotlightRestrict = 'self-first', ...rest} = props; const spotlightContainer = useSpotlightContainer({ id: spotlightId, @@ -250,12 +250,6 @@ const SpotlightContainerDecorator = hoc(defaultConfig, (config, Wrapped) => { spotlightRestrict: PropTypes.oneOf(['none', 'self-first', 'self-only']) }; - SpotlightContainerDecorator.defaultProps = { - spotlightDisabled: false, - spotlightMuted: false, - spotlightRestrict: 'self-first' - }; - // Wrapping with a React.Component to maintain ref support return class SpotlightContainerDecoratorAdapter extends Component { render () { diff --git a/packages/ui/Scroller/Scroller.js b/packages/ui/Scroller/Scroller.js index 67933a9a64..7e3c50e3c5 100644 --- a/packages/ui/Scroller/Scroller.js +++ b/packages/ui/Scroller/Scroller.js @@ -32,9 +32,37 @@ const nop = () => {}; * @ui * @public */ -const Scroller = (props) => { +const Scroller = ({ + cbScrollTo = nop, + direction = 'both', + horizontalScrollbar = 'auto', + noScrollByDrag = false, + noScrollByWheel = false, + onScroll = nop, + onScrollStart = nop, + onScrollStop = nop, + overscrollEffectOn: {drag = false, pageKey = false, wheel = false} = {}, + scrollMode = 'translate', + verticalScrollbar = 'auto', + ...rest +}) => { // Hooks + const props = { + cbScrollTo, + direction, + horizontalScrollbar, + noScrollByDrag, + noScrollByWheel, + onScroll, + onScrollStart, + onScrollStop, + overscrollEffectOn: {drag, pageKey, wheel}, + scrollMode, + verticalScrollbar, + ...rest + }; + const { scrollContentHandle, scrollContentWrapper: ScrollContentWrapper, @@ -257,23 +285,6 @@ Scroller.propTypes = /** @lends ui/Scroller.Scroller.prototype */ { verticalScrollbar: PropTypes.oneOf(['auto', 'visible', 'hidden']) }; -Scroller.defaultProps = { - cbScrollTo: nop, - direction: 'both', - horizontalScrollbar: 'auto', - noScrollByDrag: false, - noScrollByWheel: false, - onScroll: nop, - onScrollStart: nop, - onScrollStop: nop, - overscrollEffectOn: { - drag: false, - pageKey: false, - wheel: false - }, - scrollMode: 'translate', - verticalScrollbar: 'auto' -}; export default Scroller; export { diff --git a/packages/ui/Slottable/tests/Slottable-specs.js b/packages/ui/Slottable/tests/Slottable-specs.js index c3fb992e42..aabb94e356 100644 --- a/packages/ui/Slottable/tests/Slottable-specs.js +++ b/packages/ui/Slottable/tests/Slottable-specs.js @@ -240,7 +240,7 @@ describe('Slottable Specs', () => { }); test('should allow downstream component to have default value for unset slot', () => { - function ComponentBase ({a}) { + function ComponentBase ({a = 'Default A'}) { return (
{a} @@ -248,10 +248,6 @@ describe('Slottable Specs', () => { ); } - ComponentBase.defaultProps = { - a: 'Default A' - }; - const Component = Slottable({slots: ['a']}, ComponentBase); render(); diff --git a/packages/ui/Toggleable/Toggleable.js b/packages/ui/Toggleable/Toggleable.js index b5e71a9157..b0153aee10 100644 --- a/packages/ui/Toggleable/Toggleable.js +++ b/packages/ui/Toggleable/Toggleable.js @@ -152,13 +152,14 @@ const ToggleableHOC = hoc(defaultConfig, (config, Wrapped) => { ) }; - function Toggleable (props) { + function Toggleable ({disabled = false, ...rest}) { + const props = {disabled, ...rest}; const updated = {...props}; const propSelected = props[prop]; const hook = useToggle({ defaultSelected: props[defaultPropKey], - disabled: props.disabled, + disabled: disabled, onToggle: (ev) => forwardCustom(toggle, adapter)(ev, props), prop, @@ -253,10 +254,6 @@ const ToggleableHOC = hoc(defaultConfig, (config, Wrapped) => { [toggle]: PropTypes.func }; - Toggleable.defaultProps = { - disabled: false - }; - return Toggleable; }); diff --git a/packages/ui/Touchable/Touchable.js b/packages/ui/Touchable/Touchable.js index aa713597c8..949957c842 100644 --- a/packages/ui/Touchable/Touchable.js +++ b/packages/ui/Touchable/Touchable.js @@ -109,7 +109,8 @@ const Touchable = hoc(defaultConfig, (config, Wrapped) => { // eslint-disable-next-line no-shadow const Touchable = forwardRef((props, ref) => { - const {configForHook, propsForWrapped} = selectProps(props); + const {disabled = false, noResume = false, ...rest} = props; + const {configForHook, propsForWrapped} = selectProps({disabled, noResume, ...rest}); const hook = useTouch({getActive: !!activeProp, ...configForHook}); Object.assign(propsForWrapped, hook.handlers); @@ -369,11 +370,6 @@ const Touchable = hoc(defaultConfig, (config, Wrapped) => { pinchConfig: pinchConfigPropType }; - Touchable.defaultProps = { - disabled: false, - noResume: false - }; - Touchable.displayName = 'Touchable'; return Touchable; diff --git a/packages/ui/VirtualList/VirtualList.js b/packages/ui/VirtualList/VirtualList.js index 2e81a79980..493c1d43fa 100644 --- a/packages/ui/VirtualList/VirtualList.js +++ b/packages/ui/VirtualList/VirtualList.js @@ -30,9 +30,39 @@ const nop = () => {}; * @ui * @public */ -const VirtualList = (props) => { +const VirtualList = ({ + cbScrollTo = nop, + direction = 'vertical', + horizontalScrollbar = 'auto', + noScrollByDrag = false, + noScrollByWheel = false, + onScroll = nop, + onScrollStart = nop, + onScrollStop = nop, + overscrollEffectOn: {drag = false, pageKey = false, wheel = false} = {}, + role = 'list', + scrollMode = 'translate', + verticalScrollbar = 'auto', + ...rest +}) => { // Hooks + const props = { + cbScrollTo, + direction, + horizontalScrollbar, + noScrollByDrag, + noScrollByWheel, + onScroll, + onScrollStart, + onScrollStop, + overscrollEffectOn: {drag, pageKey, wheel}, + role, + scrollMode, + verticalScrollbar, + ...rest + }; + const { scrollContentHandle, scrollContentWrapper: ScrollContentWrapper, @@ -276,25 +306,6 @@ VirtualList.propTypes = /** @lends ui/VirtualList.VirtualList.prototype */ { verticalScrollbar: PropTypes.oneOf(['auto', 'visible', 'hidden']) }; -VirtualList.defaultProps = { - cbScrollTo: nop, - direction: 'vertical', - horizontalScrollbar: 'auto', - noScrollByDrag: false, - noScrollByWheel: false, - onScroll: nop, - onScrollStart: nop, - onScrollStop: nop, - overscrollEffectOn: { - drag: false, - pageKey: false, - wheel: false - }, - role: 'list', - scrollMode: 'translate', - verticalScrollbar: 'auto' -}; - /** * An unstyled scrollable virtual grid list component with touch support. * @@ -304,7 +315,37 @@ VirtualList.defaultProps = { * @ui * @public */ -const VirtualGridList = (props) => { +const VirtualGridList = ({ + cbScrollTo = nop, + direction = 'vertical', + horizontalScrollbar = 'auto', + noScrollByDrag = false, + noScrollByWheel = false, + onScroll = nop, + onScrollStart = nop, + onScrollStop = nop, + overscrollEffectOn: {drag = false, pageKey = false, wheel = false} = {}, + role = 'list', + scrollMode = 'translate', + verticalScrollbar = 'auto', + ...rest +}) => { + const props = { + cbScrollTo, + direction, + horizontalScrollbar, + noScrollByDrag, + noScrollByWheel, + onScroll, + onScrollStart, + onScrollStop, + overscrollEffectOn: {drag, pageKey, wheel}, + role, + scrollMode, + verticalScrollbar, + ...rest + }; + const { scrollContentHandle, scrollContentWrapper: ScrollContentWrapper, @@ -546,25 +587,6 @@ VirtualGridList.propTypes = /** @lends ui/VirtualList.VirtualGridList.prototype verticalScrollbar: PropTypes.oneOf(['auto', 'visible', 'hidden']) }; -VirtualGridList.defaultProps = { - cbScrollTo: nop, - direction: 'vertical', - horizontalScrollbar: 'auto', - noScrollByDrag: false, - noScrollByWheel: false, - onScroll: nop, - onScrollStart: nop, - onScrollStop: nop, - overscrollEffectOn: { - drag: false, - pageKey: false, - wheel: false - }, - role: 'list', - scrollMode: 'translate', - verticalScrollbar: 'auto' -}; - export default VirtualList; export { gridListItemSizeShape, diff --git a/packages/ui/useScroll/Scrollbar.js b/packages/ui/useScroll/Scrollbar.js index c824b16cb7..6f5b6ee9de 100644 --- a/packages/ui/useScroll/Scrollbar.js +++ b/packages/ui/useScroll/Scrollbar.js @@ -125,7 +125,8 @@ const useScrollbar = (props) => { * @ui * @private */ -const Scrollbar = memo((props) => { +const Scrollbar = memo(({corner = false, css = componentCss, minThumbSize = 18, vertical = true, ...rest}) => { + const props = {corner, css, minThumbSize, vertical, ...rest}; const { restProps, scrollbarProps, @@ -197,13 +198,6 @@ Scrollbar.propTypes = /** @lends ui/useScroll.Scrollbar.prototype */ { vertical: PropTypes.bool }; -Scrollbar.defaultProps = { - corner: false, - css: componentCss, - minThumbSize: 18, - vertical: true -}; - export default Scrollbar; export { Scrollbar, diff --git a/packages/ui/useScroll/ScrollbarTrack.js b/packages/ui/useScroll/ScrollbarTrack.js index 733ce5d287..91d3a11f61 100644 --- a/packages/ui/useScroll/ScrollbarTrack.js +++ b/packages/ui/useScroll/ScrollbarTrack.js @@ -14,7 +14,7 @@ import css from './ScrollbarTrack.module.less'; */ const ScrollbarTrack = forwardRef((props, ref) => { const - {vertical, ...rest} = props, + {vertical = true, ...rest} = props, className = classNames(css.scrollbarTrack, vertical ? css.vertical : null); return
; @@ -31,10 +31,6 @@ ScrollbarTrack.propTypes = /** @lends ui/useScroll.ScrollbarTrack.prototype */ { vertical: PropTypes.bool }; -ScrollbarTrack.defaultProps = { - vertical: true -}; - const MemoizedScrollbarTrack = memo(ScrollbarTrack); MemoizedScrollbarTrack.displayName = 'ui:ScrollbarTrack'; From 1f7bd75bcba4819aeacc1b3860679790e7355fca Mon Sep 17 00:00:00 2001 From: Juwon Jeong Date: Mon, 20 May 2024 23:11:56 +0900 Subject: [PATCH 03/11] Use Object.assign when implementing defaultProps Enact-DCO-1.0-Signed-off-by: Juwon Jeong (juwon.jeong@lge.com) --- packages/ui/Scroller/Scroller.js | 50 +++++------- packages/ui/VirtualList/VirtualList.js | 106 ++++++++++--------------- 2 files changed, 65 insertions(+), 91 deletions(-) diff --git a/packages/ui/Scroller/Scroller.js b/packages/ui/Scroller/Scroller.js index 7e3c50e3c5..6f1904887f 100644 --- a/packages/ui/Scroller/Scroller.js +++ b/packages/ui/Scroller/Scroller.js @@ -32,36 +32,28 @@ const nop = () => {}; * @ui * @public */ -const Scroller = ({ - cbScrollTo = nop, - direction = 'both', - horizontalScrollbar = 'auto', - noScrollByDrag = false, - noScrollByWheel = false, - onScroll = nop, - onScrollStart = nop, - onScrollStop = nop, - overscrollEffectOn: {drag = false, pageKey = false, wheel = false} = {}, - scrollMode = 'translate', - verticalScrollbar = 'auto', - ...rest -}) => { +const scrollerDefaultProps = { + cbScrollTo: nop, + direction: 'both', + horizontalScrollbar: 'auto', + noScrollByDrag: false, + noScrollByWheel: false, + onScroll: nop, + onScrollStart: nop, + onScrollStop: nop, + overscrollEffectOn: { + drag: false, + pageKey: false, + wheel: false + }, + scrollMode: 'translate', + verticalScrollbar: 'auto' +}; + +const Scroller = (props) => { // Hooks - const props = { - cbScrollTo, - direction, - horizontalScrollbar, - noScrollByDrag, - noScrollByWheel, - onScroll, - onScrollStart, - onScrollStop, - overscrollEffectOn: {drag, pageKey, wheel}, - scrollMode, - verticalScrollbar, - ...rest - }; + const scrollerProps = Object.assign({}, scrollerDefaultProps, props); const { scrollContentHandle, @@ -76,7 +68,7 @@ const Scroller = ({ scrollContentProps, verticalScrollbarProps, horizontalScrollbarProps - } = useScroll(props); + } = useScroll(scrollerProps); // Return diff --git a/packages/ui/VirtualList/VirtualList.js b/packages/ui/VirtualList/VirtualList.js index 493c1d43fa..288e4adf55 100644 --- a/packages/ui/VirtualList/VirtualList.js +++ b/packages/ui/VirtualList/VirtualList.js @@ -30,38 +30,29 @@ const nop = () => {}; * @ui * @public */ -const VirtualList = ({ - cbScrollTo = nop, - direction = 'vertical', - horizontalScrollbar = 'auto', - noScrollByDrag = false, - noScrollByWheel = false, - onScroll = nop, - onScrollStart = nop, - onScrollStop = nop, - overscrollEffectOn: {drag = false, pageKey = false, wheel = false} = {}, - role = 'list', - scrollMode = 'translate', - verticalScrollbar = 'auto', - ...rest -}) => { +const virtualListDefaultProps = { + cbScrollTo: nop, + direction: 'vertical', + horizontalScrollbar: 'auto', + noScrollByDrag: false, + noScrollByWheel: false, + onScroll: nop, + onScrollStart: nop, + onScrollStop: nop, + overscrollEffectOn: { + drag: false, + pageKey: false, + wheel: false + }, + role: 'list', + scrollMode: 'translate', + verticalScrollbar: 'auto' +}; + +const VirtualList = (props) => { // Hooks - const props = { - cbScrollTo, - direction, - horizontalScrollbar, - noScrollByDrag, - noScrollByWheel, - onScroll, - onScrollStart, - onScrollStop, - overscrollEffectOn: {drag, pageKey, wheel}, - role, - scrollMode, - verticalScrollbar, - ...rest - }; + const virtualListProps = Object.assign({}, virtualListDefaultProps, props); const { scrollContentHandle, @@ -76,7 +67,7 @@ const VirtualList = ({ scrollContentProps, verticalScrollbarProps, horizontalScrollbarProps - } = useScroll(props); + } = useScroll(virtualListProps); // Render @@ -315,36 +306,27 @@ VirtualList.propTypes = /** @lends ui/VirtualList.VirtualList.prototype */ { * @ui * @public */ -const VirtualGridList = ({ - cbScrollTo = nop, - direction = 'vertical', - horizontalScrollbar = 'auto', - noScrollByDrag = false, - noScrollByWheel = false, - onScroll = nop, - onScrollStart = nop, - onScrollStop = nop, - overscrollEffectOn: {drag = false, pageKey = false, wheel = false} = {}, - role = 'list', - scrollMode = 'translate', - verticalScrollbar = 'auto', - ...rest -}) => { - const props = { - cbScrollTo, - direction, - horizontalScrollbar, - noScrollByDrag, - noScrollByWheel, - onScroll, - onScrollStart, - onScrollStop, - overscrollEffectOn: {drag, pageKey, wheel}, - role, - scrollMode, - verticalScrollbar, - ...rest - }; +const virtualGridListDefaultProps = { + cbScrollTo: nop, + direction: 'vertical', + horizontalScrollbar: 'auto', + noScrollByDrag: false, + noScrollByWheel: false, + onScroll: nop, + onScrollStart: nop, + onScrollStop: nop, + overscrollEffectOn: { + drag: false, + pageKey: false, + wheel: false + }, + role: 'list', + scrollMode: 'translate', + verticalScrollbar: 'auto' +}; + +const VirtualGridList = (props) => { + const virtualGridListProps = Object.assign({}, virtualGridListDefaultProps, props); const { scrollContentHandle, @@ -359,7 +341,7 @@ const VirtualGridList = ({ scrollContentProps, verticalScrollbarProps, horizontalScrollbarProps - } = useScroll(props); + } = useScroll(virtualGridListProps); return ( From 802f6420332394be8208381c170a2ca864cd9625 Mon Sep 17 00:00:00 2001 From: Juwon Jeong Date: Tue, 21 May 2024 10:14:18 +0900 Subject: [PATCH 04/11] Fix Sprite, Scroller, VirtualList to show default prop values properly in sampler Enact-DCO-1.0-Signed-off-by: Juwon Jeong (juwon.jeong@lge.com) --- packages/ui/Scroller/Scroller.js | 1 + packages/ui/VirtualList/VirtualList.js | 4 ++++ 2 files changed, 5 insertions(+) diff --git a/packages/ui/Scroller/Scroller.js b/packages/ui/Scroller/Scroller.js index 6f1904887f..d577f72324 100644 --- a/packages/ui/Scroller/Scroller.js +++ b/packages/ui/Scroller/Scroller.js @@ -277,6 +277,7 @@ Scroller.propTypes = /** @lends ui/Scroller.Scroller.prototype */ { verticalScrollbar: PropTypes.oneOf(['auto', 'visible', 'hidden']) }; +Scroller.defaultPropValues = scrollerDefaultProps; export default Scroller; export { diff --git a/packages/ui/VirtualList/VirtualList.js b/packages/ui/VirtualList/VirtualList.js index 288e4adf55..68db82ff2b 100644 --- a/packages/ui/VirtualList/VirtualList.js +++ b/packages/ui/VirtualList/VirtualList.js @@ -297,6 +297,8 @@ VirtualList.propTypes = /** @lends ui/VirtualList.VirtualList.prototype */ { verticalScrollbar: PropTypes.oneOf(['auto', 'visible', 'hidden']) }; +VirtualList.defaultPropValues = virtualListDefaultProps; + /** * An unstyled scrollable virtual grid list component with touch support. * @@ -569,6 +571,8 @@ VirtualGridList.propTypes = /** @lends ui/VirtualList.VirtualGridList.prototype verticalScrollbar: PropTypes.oneOf(['auto', 'visible', 'hidden']) }; +VirtualGridList.defaultPropValues = virtualGridListDefaultProps; + export default VirtualList; export { gridListItemSizeShape, From a2914404997da5df6678cb7ad8eea5313c9f0b9b Mon Sep 17 00:00:00 2001 From: Juwon Jeong Date: Tue, 21 May 2024 11:25:28 +0900 Subject: [PATCH 05/11] Update React to version 18.3.1 Enact-DCO-1.0-Signed-off-by: Juwon Jeong (juwon.jeong@lge.com) --- packages/core/package.json | 6 +++--- packages/i18n/package.json | 4 ++-- packages/sampler/package.json | 4 ++-- packages/spotlight/package.json | 4 ++-- packages/ui/package.json | 6 +++--- packages/webos/package.json | 4 ++-- 6 files changed, 14 insertions(+), 14 deletions(-) diff --git a/packages/core/package.json b/packages/core/package.json index 46b9895922..107f89bfaf 100644 --- a/packages/core/package.json +++ b/packages/core/package.json @@ -36,9 +36,9 @@ "invariant": "^2.2.4", "prop-types": "^15.8.1", "ramda": "^0.29.1", - "react": "^18.2.0", - "react-dom": "^18.2.0", - "react-is": "^18.2.0", + "react": "^18.3.1", + "react-dom": "^18.3.1", + "react-is": "^18.3.1", "warning": "^4.0.3" } } diff --git a/packages/i18n/package.json b/packages/i18n/package.json index ad8e1f59f4..8f39540764 100644 --- a/packages/i18n/package.json +++ b/packages/i18n/package.json @@ -51,8 +51,8 @@ "@enact/core": "^4.9.0-alpha.1", "prop-types": "^15.8.1", "ramda": "^0.29.1", - "react": "^18.2.0", - "react-dom": "^18.2.0", + "react": "^18.3.1", + "react-dom": "^18.3.1", "xhr": "^2.6.0" }, "peerDependencies": { diff --git a/packages/sampler/package.json b/packages/sampler/package.json index a5d66efdaa..e339b5a43f 100644 --- a/packages/sampler/package.json +++ b/packages/sampler/package.json @@ -28,7 +28,7 @@ "classnames": "^2.5.1", "ilib": "14.19.0", "prop-types": "^15.8.1", - "react": "^18.2.0", - "react-dom": "^18.2.0" + "react": "^18.3.1", + "react-dom": "^18.3.1" } } diff --git a/packages/spotlight/package.json b/packages/spotlight/package.json index fcce1bbfb0..482705dcf7 100644 --- a/packages/spotlight/package.json +++ b/packages/spotlight/package.json @@ -29,8 +29,8 @@ "classnames": "^2.5.1", "prop-types": "^15.8.1", "ramda": "^0.29.1", - "react": "^18.2.0", - "react-dom": "^18.2.0", + "react": "^18.3.1", + "react-dom": "^18.3.1", "warning": "^4.0.3" } } diff --git a/packages/ui/package.json b/packages/ui/package.json index fa92728415..1b1d30db7b 100644 --- a/packages/ui/package.json +++ b/packages/ui/package.json @@ -38,9 +38,9 @@ "invariant": "^2.2.4", "prop-types": "^15.8.1", "ramda": "^0.29.1", - "react": "^18.2.0", - "react-dom": "^18.2.0", - "react-is": "^18.2.0", + "react": "^18.3.1", + "react-dom": "^18.3.1", + "react-is": "^18.3.1", "warning": "^4.0.3" } } diff --git a/packages/webos/package.json b/packages/webos/package.json index ee7522c0ef..e7f232b476 100644 --- a/packages/webos/package.json +++ b/packages/webos/package.json @@ -34,7 +34,7 @@ "dependencies": { "@enact/core": "^4.9.0-alpha.1", "prop-types": "^15.8.1", - "react": "^18.2.0", - "react-dom": "^18.2.0" + "react": "^18.3.1", + "react-dom": "^18.3.1" } } From 1ae90ef31571824ac9124603cd10f96424651b90 Mon Sep 17 00:00:00 2001 From: Juwon Jeong Date: Tue, 21 May 2024 15:35:36 +0900 Subject: [PATCH 06/11] Apply review Enact-DCO-1.0-Signed-off-by: Juwon Jeong (juwon.jeong@lge.com) --- packages/ui/Scroller/Scroller.js | 28 ++++++++++---------- packages/ui/Toggleable/Toggleable.js | 2 +- packages/ui/VirtualList/VirtualList.js | 36 +++++++++++++------------- 3 files changed, 33 insertions(+), 33 deletions(-) diff --git a/packages/ui/Scroller/Scroller.js b/packages/ui/Scroller/Scroller.js index d577f72324..aa5f037647 100644 --- a/packages/ui/Scroller/Scroller.js +++ b/packages/ui/Scroller/Scroller.js @@ -18,20 +18,6 @@ import ScrollerBase from './UiScrollerBase'; const nop = () => {}; -/** - * An unstyled scroller. - * - * Example: - * ``` - * Scroll me. - * ``` - * - * @class Scroller - * @memberof ui/Scroller - * @extends ui/Scroller.ScrollerBasic - * @ui - * @public - */ const scrollerDefaultProps = { cbScrollTo: nop, direction: 'both', @@ -50,6 +36,20 @@ const scrollerDefaultProps = { verticalScrollbar: 'auto' }; +/** + * An unstyled scroller. + * + * Example: + * ``` + * Scroll me. + * ``` + * + * @class Scroller + * @memberof ui/Scroller + * @extends ui/Scroller.ScrollerBasic + * @ui + * @public + */ const Scroller = (props) => { // Hooks diff --git a/packages/ui/Toggleable/Toggleable.js b/packages/ui/Toggleable/Toggleable.js index b0153aee10..dcda441c12 100644 --- a/packages/ui/Toggleable/Toggleable.js +++ b/packages/ui/Toggleable/Toggleable.js @@ -159,7 +159,7 @@ const ToggleableHOC = hoc(defaultConfig, (config, Wrapped) => { const hook = useToggle({ defaultSelected: props[defaultPropKey], - disabled: disabled, + disabled, onToggle: (ev) => forwardCustom(toggle, adapter)(ev, props), prop, diff --git a/packages/ui/VirtualList/VirtualList.js b/packages/ui/VirtualList/VirtualList.js index 68db82ff2b..09e5a953a3 100644 --- a/packages/ui/VirtualList/VirtualList.js +++ b/packages/ui/VirtualList/VirtualList.js @@ -21,15 +21,6 @@ import {gridListItemSizeShape, itemSizesShape, VirtualListBasic} from './Virtual const nop = () => {}; -/** - * An unstyled scrollable virtual list component with touch support. - * - * @class VirtualList - * @memberof ui/VirtualList - * @extends ui/VirtualList.VirtualListBasic - * @ui - * @public - */ const virtualListDefaultProps = { cbScrollTo: nop, direction: 'vertical', @@ -49,6 +40,15 @@ const virtualListDefaultProps = { verticalScrollbar: 'auto' }; +/** + * An unstyled scrollable virtual list component with touch support. + * + * @class VirtualList + * @memberof ui/VirtualList + * @extends ui/VirtualList.VirtualListBasic + * @ui + * @public + */ const VirtualList = (props) => { // Hooks @@ -299,15 +299,6 @@ VirtualList.propTypes = /** @lends ui/VirtualList.VirtualList.prototype */ { VirtualList.defaultPropValues = virtualListDefaultProps; -/** - * An unstyled scrollable virtual grid list component with touch support. - * - * @class VirtualGridList - * @memberof ui/VirtualList - * @extends ui/VirtualList.VirtualListBasic - * @ui - * @public - */ const virtualGridListDefaultProps = { cbScrollTo: nop, direction: 'vertical', @@ -327,6 +318,15 @@ const virtualGridListDefaultProps = { verticalScrollbar: 'auto' }; +/** + * An unstyled scrollable virtual grid list component with touch support. + * + * @class VirtualGridList + * @memberof ui/VirtualList + * @extends ui/VirtualList.VirtualListBasic + * @ui + * @public + */ const VirtualGridList = (props) => { const virtualGridListProps = Object.assign({}, virtualGridListDefaultProps, props); From 9199ea4d236cd4500debd91fc7fe5d8b5423a9a9 Mon Sep 17 00:00:00 2001 From: Daniel Stoian Date: Tue, 21 May 2024 15:19:55 +0300 Subject: [PATCH 07/11] fixed spreading of key attribute in enact/ui/layout/cell --- packages/core/package.json | 6 +++--- packages/i18n/package.json | 4 ++-- packages/sampler/package.json | 4 ++-- packages/spotlight/package.json | 4 ++-- packages/ui/Layout/Cell.js | 4 ++-- packages/ui/package.json | 6 +++--- packages/webos/package.json | 4 ++-- 7 files changed, 16 insertions(+), 16 deletions(-) diff --git a/packages/core/package.json b/packages/core/package.json index 46b9895922..107f89bfaf 100644 --- a/packages/core/package.json +++ b/packages/core/package.json @@ -36,9 +36,9 @@ "invariant": "^2.2.4", "prop-types": "^15.8.1", "ramda": "^0.29.1", - "react": "^18.2.0", - "react-dom": "^18.2.0", - "react-is": "^18.2.0", + "react": "^18.3.1", + "react-dom": "^18.3.1", + "react-is": "^18.3.1", "warning": "^4.0.3" } } diff --git a/packages/i18n/package.json b/packages/i18n/package.json index ad8e1f59f4..8f39540764 100644 --- a/packages/i18n/package.json +++ b/packages/i18n/package.json @@ -51,8 +51,8 @@ "@enact/core": "^4.9.0-alpha.1", "prop-types": "^15.8.1", "ramda": "^0.29.1", - "react": "^18.2.0", - "react-dom": "^18.2.0", + "react": "^18.3.1", + "react-dom": "^18.3.1", "xhr": "^2.6.0" }, "peerDependencies": { diff --git a/packages/sampler/package.json b/packages/sampler/package.json index a5d66efdaa..e339b5a43f 100644 --- a/packages/sampler/package.json +++ b/packages/sampler/package.json @@ -28,7 +28,7 @@ "classnames": "^2.5.1", "ilib": "14.19.0", "prop-types": "^15.8.1", - "react": "^18.2.0", - "react-dom": "^18.2.0" + "react": "^18.3.1", + "react-dom": "^18.3.1" } } diff --git a/packages/spotlight/package.json b/packages/spotlight/package.json index fcce1bbfb0..482705dcf7 100644 --- a/packages/spotlight/package.json +++ b/packages/spotlight/package.json @@ -29,8 +29,8 @@ "classnames": "^2.5.1", "prop-types": "^15.8.1", "ramda": "^0.29.1", - "react": "^18.2.0", - "react-dom": "^18.2.0", + "react": "^18.3.1", + "react-dom": "^18.3.1", "warning": "^4.0.3" } } diff --git a/packages/ui/Layout/Cell.js b/packages/ui/Layout/Cell.js index da12e15a25..0102d6f546 100644 --- a/packages/ui/Layout/Cell.js +++ b/packages/ui/Layout/Cell.js @@ -173,13 +173,13 @@ const CellBase = kind({ } }, - render: ({component: Component, componentCss, componentRef, ...rest}) => { + render: ({component: Component, componentCss, componentRef, key, ...rest}) => { delete rest.align; delete rest.grow; delete rest.shrink; delete rest.size; - return ; + return ; } }); diff --git a/packages/ui/package.json b/packages/ui/package.json index fa92728415..1b1d30db7b 100644 --- a/packages/ui/package.json +++ b/packages/ui/package.json @@ -38,9 +38,9 @@ "invariant": "^2.2.4", "prop-types": "^15.8.1", "ramda": "^0.29.1", - "react": "^18.2.0", - "react-dom": "^18.2.0", - "react-is": "^18.2.0", + "react": "^18.3.1", + "react-dom": "^18.3.1", + "react-is": "^18.3.1", "warning": "^4.0.3" } } diff --git a/packages/webos/package.json b/packages/webos/package.json index ee7522c0ef..e7f232b476 100644 --- a/packages/webos/package.json +++ b/packages/webos/package.json @@ -34,7 +34,7 @@ "dependencies": { "@enact/core": "^4.9.0-alpha.1", "prop-types": "^15.8.1", - "react": "^18.2.0", - "react-dom": "^18.2.0" + "react": "^18.3.1", + "react-dom": "^18.3.1" } } From 83d4fba1c6cf90573785d74f82e7c0e27c360a77 Mon Sep 17 00:00:00 2001 From: Daniel Stoian Date: Tue, 21 May 2024 16:11:15 +0300 Subject: [PATCH 08/11] temporary eslint fix --- packages/ui/Layout/Cell.js | 2 ++ 1 file changed, 2 insertions(+) diff --git a/packages/ui/Layout/Cell.js b/packages/ui/Layout/Cell.js index 0102d6f546..ca4d6ed38c 100644 --- a/packages/ui/Layout/Cell.js +++ b/packages/ui/Layout/Cell.js @@ -96,6 +96,8 @@ const CellBase = kind({ */ grow: PropTypes.bool, + key: PropTypes.string, + /** * Sizes `Cell` to its contents. * From 8be5167afe0dad42f9994a1ea2a42a67a82b7fe3 Mon Sep 17 00:00:00 2001 From: Daniel Stoian Date: Wed, 22 May 2024 15:14:49 +0300 Subject: [PATCH 09/11] added jsdoc for key prop in enact/ui/layout/cell --- packages/ui/Layout/Cell.js | 5 +++++ 1 file changed, 5 insertions(+) diff --git a/packages/ui/Layout/Cell.js b/packages/ui/Layout/Cell.js index ca4d6ed38c..39e4b48e6d 100644 --- a/packages/ui/Layout/Cell.js +++ b/packages/ui/Layout/Cell.js @@ -96,6 +96,11 @@ const CellBase = kind({ */ grow: PropTypes.bool, + /** + * A unique key used by React to identify the component. + * @type {String} + * @public + */ key: PropTypes.string, /** From 0e11f2da0bfc6568353e4cbefb3d9efa7191b385 Mon Sep 17 00:00:00 2001 From: Daniel Stoian Date: Wed, 22 May 2024 15:16:08 +0300 Subject: [PATCH 10/11] switched key prop to private --- packages/ui/Layout/Cell.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/packages/ui/Layout/Cell.js b/packages/ui/Layout/Cell.js index 39e4b48e6d..7aee716406 100644 --- a/packages/ui/Layout/Cell.js +++ b/packages/ui/Layout/Cell.js @@ -99,7 +99,7 @@ const CellBase = kind({ /** * A unique key used by React to identify the component. * @type {String} - * @public + * @private */ key: PropTypes.string, From a7a03873cd604ecda27d97572f01ec2a30b5cd47 Mon Sep 17 00:00:00 2001 From: Daniel Stoian Date: Wed, 29 May 2024 12:23:47 +0300 Subject: [PATCH 11/11] code review fixes --- packages/ui/Layout/Cell.js | 13 ++++--------- 1 file changed, 4 insertions(+), 9 deletions(-) diff --git a/packages/ui/Layout/Cell.js b/packages/ui/Layout/Cell.js index 7aee716406..e82fbbcfb8 100644 --- a/packages/ui/Layout/Cell.js +++ b/packages/ui/Layout/Cell.js @@ -96,13 +96,6 @@ const CellBase = kind({ */ grow: PropTypes.bool, - /** - * A unique key used by React to identify the component. - * @type {String} - * @private - */ - key: PropTypes.string, - /** * Sizes `Cell` to its contents. * @@ -180,13 +173,15 @@ const CellBase = kind({ } }, - render: ({component: Component, componentCss, componentRef, key, ...rest}) => { + render: ({component: Component, componentCss, componentRef, ...rest}) => { delete rest.align; delete rest.grow; delete rest.shrink; delete rest.size; - return ; + const {key, ...restProps} = {...rest}; + + return ; } });