@enact/limestone 1.3.0 → 1.10.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (200) hide show
  1. package/.github/workflows/ci-branch.yml +21 -0
  2. package/.github/workflows/ci-pull-request.yml +16 -0
  3. package/.github/workflows/ci-reusable.yml +73 -0
  4. package/ActionGuide/ActionGuide.d.ts +5 -4
  5. package/ActionGuide/ActionGuide.module.css +1 -1
  6. package/Alert/Alert.d.ts +13 -2
  7. package/Alert/Alert.js +39 -5
  8. package/Alert/Alert.module.css +48 -1
  9. package/Alert/tests/Alert-specs.js +91 -0
  10. package/BodyText/BodyText.d.ts +5 -4
  11. package/BodyText/BodyText.module.css +7 -7
  12. package/Button/Button.d.ts +17 -12
  13. package/Button/Button.js +1 -1
  14. package/Button/Button.module.css +195 -268
  15. package/Button/tests/Button-specs.js +26 -0
  16. package/CHANGELOG.md +254 -0
  17. package/Card/Card.d.ts +40 -12
  18. package/Card/Card.js +164 -28
  19. package/Card/Card.module.css +277 -58
  20. package/Card/tests/Card-specs.js +67 -3
  21. package/Checkbox/Checkbox.d.ts +8 -7
  22. package/Checkbox/Checkbox.js +3 -1
  23. package/Checkbox/Checkbox.module.css +213 -120
  24. package/Checkbox/tests/Checkbox-specs.js +1 -1
  25. package/CheckboxItem/CheckboxItem.d.ts +22 -7
  26. package/CheckboxItem/CheckboxItem.js +71 -4
  27. package/Chips/Chip.js +72 -13
  28. package/Chips/Chip.module.css +3 -3
  29. package/Chips/Chips.js +37 -17
  30. package/Chips/Chips.module.css +1 -1
  31. package/Chips/tests/Chip-specs.js +43 -13
  32. package/Chips/tests/Chips-specs.js +31 -21
  33. package/ColorPicker/ColorPicker.js +27 -25
  34. package/ContextualMenuDecorator/ContextualMenuDecorator.d.ts +4 -5
  35. package/ContextualPopupDecorator/ContextualPopup.module.css +34 -34
  36. package/ContextualPopupDecorator/ContextualPopupDecorator.js +567 -549
  37. package/DatePicker/DatePicker.d.ts +4 -5
  38. package/DayPicker/DayPicker.d.ts +8 -7
  39. package/DayPicker/DaySelectorDecorator.js +12 -7
  40. package/Dropdown/Dropdown.d.ts +11 -13
  41. package/Dropdown/Dropdown.module.css +13 -9
  42. package/Dropdown/DropdownList.js +80 -54
  43. package/FixedPopupPanels/FixedPopupPanels.d.ts +4 -2
  44. package/FixedPopupPanels/FixedPopupPanels.module.css +18 -18
  45. package/FlexiblePopupPanels/FlexiblePopupPanels.module.css +23 -23
  46. package/FlexiblePopupPanels/useNavButtonFocus.js +7 -10
  47. package/FormCheckboxItem/FormCheckboxItem.d.ts +5 -4
  48. package/Heading/Heading.d.ts +9 -8
  49. package/Heading/Heading.js +2 -2
  50. package/Heading/Heading.module.css +5 -5
  51. package/Icon/Icon.d.ts +15 -4
  52. package/Icon/Icon.js +49 -2
  53. package/Icon/Icon.module.css +1 -1
  54. package/Icon/IconList.js +27 -1
  55. package/IconItem/IconItem.d.ts +13 -12
  56. package/IconItem/IconItem.js +15 -0
  57. package/IconItem/IconItem.module.css +107 -1
  58. package/IconItem/tests/IconItem-specs.js +30 -1
  59. package/Image/Image.d.ts +5 -4
  60. package/Image/Image.js +6 -4
  61. package/ImageItem/ImageItem.d.ts +11 -10
  62. package/ImageItem/ImageItem.js +37 -31
  63. package/ImageItem/ImageItem.module.css +30 -30
  64. package/ImageItem/tests/ImageItem-specs.js +3 -10
  65. package/Input/Input.js +21 -3
  66. package/Input/Input.module.css +37 -8
  67. package/Input/InputField.js +79 -24
  68. package/Input/InputField.module.css +273 -41
  69. package/Input/InputFieldDecoratorIcon.js +1 -0
  70. package/Input/InputFieldSpotlightDecorator.js +257 -228
  71. package/Input/index.d.ts +120 -111
  72. package/Input/tests/Input-specs.js +26 -0
  73. package/Input/tests/InputField-specs.js +170 -3
  74. package/Input/tests/InputPopup-specs.js +1 -1
  75. package/Item/Item.d.ts +16 -9
  76. package/Item/Item.js +20 -2
  77. package/Item/Item.module.css +1 -1
  78. package/KeyGuide/KeyGuide.d.ts +8 -7
  79. package/KeyGuide/KeyGuide.js +29 -27
  80. package/KeyGuide/KeyGuide.module.css +25 -1
  81. package/Marquee/Marquee.d.ts +2 -4
  82. package/MediaOverlay/MediaOverlay.d.ts +12 -11
  83. package/MediaOverlay/MediaOverlay.js +43 -21
  84. package/MediaOverlay/MediaOverlay.module.css +114 -15
  85. package/MediaOverlay/tests/MediaOverlay-specs.js +29 -0
  86. package/MediaPlayer/MediaControls.js +195 -13
  87. package/MediaPlayer/MediaControls.module.css +3 -2
  88. package/MediaPlayer/MediaSlider.module.css +7 -20
  89. package/MediaPlayer/index.d.ts +59 -7
  90. package/MediaPlayer/tests/util-specs.js +4 -1
  91. package/PageViews/PageViews.js +232 -82
  92. package/PageViews/PageViews.module.css +3 -0
  93. package/PageViews/PageViewsRouter.js +100 -42
  94. package/PageViews/tests/PageViews-specs.js +171 -0
  95. package/Panels/Header.js +54 -34
  96. package/Panels/Header.module.css +83 -31
  97. package/Panels/Panel.module.css +1 -1
  98. package/Panels/index.d.ts +7 -8
  99. package/Picker/Picker.d.ts +4 -5
  100. package/Picker/Picker.module.css +2 -2
  101. package/Popup/Popup.js +245 -242
  102. package/Popup/Popup.module.css +24 -24
  103. package/PopupTabLayout/PopupTabLayout.d.ts +5 -7
  104. package/PopupTabLayout/PopupTabLayout.js +26 -18
  105. package/PopupTabLayout/PopupTabLayout.module.css +53 -16
  106. package/PopupTabLayout/PopupTabLayoutStateContext.js +8 -0
  107. package/ProgressBar/ProgressBar.d.ts +5 -4
  108. package/ProgressBar/ProgressBarTooltip.module.css +12 -12
  109. package/ProgressButton/ProgressButton.d.ts +4 -5
  110. package/QuickGuidePanels/QuickGuidePanels.module.css +2 -2
  111. package/RadioItem/RadioItem.d.ts +18 -5
  112. package/RadioItem/RadioItem.js +69 -2
  113. package/RadioItem/RadioItem.module.css +36 -36
  114. package/RangePicker/RangePicker.module.css +2 -2
  115. package/Scroller/EditableWrapper.js +28 -18
  116. package/Scroller/Scroller.d.ts +20 -16
  117. package/Scroller/Scroller.js +20 -13
  118. package/Scroller/Scroller.module.css +4 -4
  119. package/Scroller/useThemeScroller.js +3 -3
  120. package/Slider/Slider.d.ts +20 -14
  121. package/Slider/Slider.js +71 -14
  122. package/Slider/Slider.module.css +464 -91
  123. package/Slider/SliderBehaviorDecorator.js +16 -14
  124. package/Slider/tests/Slider-specs.js +53 -1
  125. package/Slider/utils.js +23 -7
  126. package/Spinner/Spinner.d.ts +5 -4
  127. package/Spinner/Spinner.js +10 -8
  128. package/Spinner/Spinner.module.css +9 -9
  129. package/Steps/Steps.d.ts +5 -4
  130. package/Steps/Steps.js +9 -5
  131. package/Switch/Switch.d.ts +8 -7
  132. package/Switch/Switch.module.css +100 -13
  133. package/SwitchItem/SwitchItem.d.ts +9 -6
  134. package/TabLayout/RefocusDecorator.js +26 -18
  135. package/TabLayout/TabGroup.js +3 -2
  136. package/TabLayout/TabGroup.module.css +2 -2
  137. package/TabLayout/TabLayout.d.ts +6 -0
  138. package/TabLayout/TabLayout.js +11 -1
  139. package/TabLayout/TabLayout.module.css +18 -0
  140. package/TabLayout/tests/TabGroup-specs.js +1 -1
  141. package/TabLayout/tests/TabLayout-specs.js +52 -0
  142. package/ThemeDecorator/AccessibilityDecorator.js +12 -11
  143. package/ThemeDecorator/I18nFontDecorator.js +6 -4
  144. package/ThemeDecorator/ThemeDecorator.d.ts +16 -10
  145. package/ThemeDecorator/ThemeDecorator.js +24 -9
  146. package/ThemeDecorator/fontGenerator.js +1 -1
  147. package/ThemeDecorator/screenTypes.json +1 -0
  148. package/TimePicker/TimePicker.module.css +1 -1
  149. package/TimePicker/TimePickerBase.js +5 -3
  150. package/TooltipDecorator/Tooltip.module.css +1 -2
  151. package/TooltipDecorator/TooltipDecorator.js +12 -7
  152. package/TooltipDecorator/tests/useTooltip-specs.js +5 -2
  153. package/TooltipDecorator/tests/util-specs.js +12 -0
  154. package/TooltipDecorator/useTooltip.js +1 -1
  155. package/TooltipDecorator/util.js +18 -11
  156. package/VideoPlayer/Feedback.js +3 -0
  157. package/VideoPlayer/Feedback.module.css +5 -9
  158. package/VideoPlayer/FeedbackIcons.js +1 -1
  159. package/VideoPlayer/FeedbackTooltip.module.css +55 -11
  160. package/VideoPlayer/VideoPlayer.d.ts +44 -18
  161. package/VideoPlayer/VideoPlayer.js +153 -47
  162. package/VideoPlayer/VideoPlayer.module.css +28 -11
  163. package/VirtualList/VirtualList.d.ts +9 -2
  164. package/VirtualList/VirtualList.js +51 -24
  165. package/VirtualList/tests/VirtualGridList-translate-specs.js +3 -0
  166. package/VirtualList/tests/VirtualList-specs.js +28 -1
  167. package/VirtualList/tests/VirtualList-translate-specs.js +4 -1
  168. package/VirtualList/useSpotlight.js +1 -1
  169. package/WizardPanels/WizardPanels.module.css +2 -2
  170. package/WizardPanels/index.d.ts +4 -2
  171. package/fonts/Limestone_Icons.ttf +0 -0
  172. package/internal/$L/$L.js +3 -3
  173. package/internal/AsyncRenderChildren/AsyncRenderChildren.js +9 -5
  174. package/internal/AsyncRenderChildren/tests/AsyncRenderChildren-specs.js +4 -1
  175. package/internal/DateComponentPicker/DateComponentPicker.module.css +2 -2
  176. package/internal/DateTime/DateTime.module.css +1 -0
  177. package/internal/DateTime/DateTimeDecorator.js +5 -4
  178. package/internal/Panels/PanelsRouter.js +48 -31
  179. package/internal/Panels/useAutoFocus.js +10 -6
  180. package/internal/Panels/useFocusOnTransition.js +4 -3
  181. package/internal/Picker/Picker.js +7 -5
  182. package/internal/Picker/Picker.module.css +2 -2
  183. package/internal/Picker/SpottablePicker.js +15 -13
  184. package/internal/SharedStateDecorator/SharedStateDecorator.js +78 -99
  185. package/internal/validators/validators.js +21 -2
  186. package/package.json +18 -15
  187. package/styles/colors-highcontrast.less +9 -1
  188. package/styles/colors.less +12 -7
  189. package/styles/motion-mixins.less +66 -0
  190. package/styles/motions.less +78 -0
  191. package/styles/variables.less +176 -150
  192. package/useScroll/HoverToScroll.js +23 -17
  193. package/useScroll/Scrollbar.js +14 -10
  194. package/useScroll/ScrollbarPlaceholder.js +3 -5
  195. package/useScroll/ScrollbarTrack.js +7 -5
  196. package/useScroll/ScrollbarTrack.module.css +8 -8
  197. package/useScroll/useEvent.js +14 -3
  198. package/useScroll/useScroll.js +12 -2
  199. package/useScroll/useScroll.module.css +6 -6
  200. package/.travis.yml +0 -40
@@ -6,12 +6,13 @@ Object.defineProperty(exports, "__esModule", {
6
6
  exports["default"] = exports.VirtualList = exports.VirtualGridList = void 0;
7
7
  var _util = require("@enact/core/util");
8
8
  var _I18nDecorator = require("@enact/i18n/I18nDecorator");
9
+ var _spotlight = _interopRequireDefault(require("@enact/spotlight"));
9
10
  var _SpotlightContainerDecorator = _interopRequireDefault(require("@enact/spotlight/SpotlightContainerDecorator"));
10
11
  var _Resizable = require("@enact/ui/Resizable");
11
- var _VirtualList = require("@enact/ui/VirtualList");
12
+ var _VirtualList2 = require("@enact/ui/VirtualList");
12
13
  var _classnames = _interopRequireDefault(require("classnames"));
13
14
  var _propTypes = _interopRequireDefault(require("prop-types"));
14
- var _warning = _interopRequireDefault(require("warning"));
15
+ var _validators = require("../internal/validators");
15
16
  var _useScroll3 = _interopRequireDefault(require("../useScroll"));
16
17
  var _HoverToScroll = _interopRequireDefault(require("../useScroll/HoverToScroll"));
17
18
  var _Scrollbar = _interopRequireDefault(require("../useScroll/Scrollbar"));
@@ -19,9 +20,9 @@ var _Skinnable = _interopRequireDefault(require("../Skinnable"));
19
20
  var _useThemeVirtualList = require("./useThemeVirtualList");
20
21
  var _VirtualListModule = _interopRequireDefault(require("./VirtualList.module.css"));
21
22
  var _jsxRuntime = require("react/jsx-runtime");
22
- var _excluded = ["itemSize", "hoverToScroll"],
23
+ var _excluded = ["continue5WayHold", "itemSize", "hoverToScroll"],
23
24
  _excluded2 = ["className"],
24
- _excluded3 = ["hoverToScroll"],
25
+ _excluded3 = ["continue5WayHold", "hoverToScroll"],
25
26
  _excluded4 = ["className"];
26
27
  /**
27
28
  * Provides Limestone-themed virtual list components and behaviors.
@@ -42,6 +43,7 @@ var nop = function nop() {};
42
43
  var virtualListDefaultProps = {
43
44
  'data-spotlight-container-disabled': false,
44
45
  cbScrollTo: nop,
46
+ continue5WayHold: false,
45
47
  direction: 'vertical',
46
48
  horizontalScrollbar: 'auto',
47
49
  noAffordance: false,
@@ -73,8 +75,9 @@ var virtualListDefaultProps = {
73
75
  * @ui
74
76
  * @public
75
77
  */
76
- var VirtualList = exports.VirtualList = function VirtualList(props) {
78
+ var _VirtualList = exports.VirtualList = function VirtualList(props) {
77
79
  var virtualListProps = (0, _util.setDefaultProps)(props, virtualListDefaultProps);
80
+ (0, _util.checkPropTypes)(_VirtualList, virtualListProps);
78
81
  if (typeof ENACT_PACK_NO_ANIMATION !== 'undefined' && ENACT_PACK_NO_ANIMATION) {
79
82
  virtualListProps.overscrollEffectOn = {
80
83
  arrowKey: false,
@@ -84,16 +87,20 @@ var VirtualList = exports.VirtualList = function VirtualList(props) {
84
87
  wheel: false
85
88
  };
86
89
  }
87
- var itemSize = virtualListProps.itemSize,
90
+ var continue5WayHold = virtualListProps.continue5WayHold,
91
+ itemSize = virtualListProps.itemSize,
88
92
  hoverToScroll = virtualListProps.hoverToScroll,
89
93
  rest = _objectWithoutProperties(virtualListProps, _excluded);
94
+ _spotlight["default"].set(props.id, {
95
+ continue5WayHold: continue5WayHold
96
+ });
90
97
  var itemSizeProps = itemSize && itemSize.minSize ? {
91
98
  itemSize: itemSize.minSize,
92
99
  itemSizes: itemSize.size
93
100
  } : {
94
101
  itemSize: itemSize
95
102
  };
96
- process.env.NODE_ENV !== "production" ? (0, _warning["default"])(!itemSizeProps.itemSizes || !rest.cbScrollTo, 'VirtualList with `minSize` in `itemSize` prop does not support `cbScrollTo` prop') : void 0;
103
+ process.env.NODE_ENV !== "production" ? (0, _validators.warning)(itemSizeProps.itemSizes && rest.cbScrollTo !== nop, 'VirtualList with `minSize` in `itemSize` prop does not support `cbScrollTo` prop') : void 0;
97
104
 
98
105
  // Hooks
99
106
 
@@ -119,14 +126,14 @@ var VirtualList = exports.VirtualList = function VirtualList(props) {
119
126
  }));
120
127
  return /*#__PURE__*/(0, _jsxRuntime.jsx)(_Resizable.ResizeContext, _objectSpread(_objectSpread({}, resizeContextProps), {}, {
121
128
  children: /*#__PURE__*/(0, _jsxRuntime.jsxs)(ScrollContentWrapper, _objectSpread(_objectSpread(_objectSpread({}, themeScrollContainerProps), scrollContentWrapperRest), {}, {
122
- children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_VirtualList.VirtualListBasic, _objectSpread(_objectSpread({}, themeScrollContentProps), {}, {
129
+ children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_VirtualList2.VirtualListBasic, _objectSpread(_objectSpread({}, themeScrollContentProps), {}, {
123
130
  ref: scrollContentHandle
124
131
  })), isVerticalScrollbarVisible ? /*#__PURE__*/(0, _jsxRuntime.jsx)(_Scrollbar["default"], _objectSpread({}, verticalScrollbarProps)) : null, isHorizontalScrollbarVisible ? /*#__PURE__*/(0, _jsxRuntime.jsx)(_Scrollbar["default"], _objectSpread({}, horizontalScrollbarProps)) : null, hoverToScroll ? /*#__PURE__*/(0, _jsxRuntime.jsx)(_HoverToScroll["default"], _objectSpread({}, hoverToScrollProps)) : null]
125
132
  }))
126
133
  }));
127
134
  };
128
- VirtualList.displayName = 'VirtualList';
129
- VirtualList.propTypes = /** @lends limestone/VirtualList.VirtualList.prototype */{
135
+ _VirtualList.displayName = 'VirtualList';
136
+ _VirtualList.propTypes = /** @lends limestone/VirtualList.VirtualList.prototype */{
130
137
  /**
131
138
  * Size of an item for the VirtualList; valid value is a number generally.
132
139
  * For different item size, value is an object that has `minSize`
@@ -143,7 +150,7 @@ VirtualList.propTypes = /** @lends limestone/VirtualList.VirtualList.prototype *
143
150
  * @required
144
151
  * @public
145
152
  */
146
- itemSize: _propTypes["default"].oneOfType([_propTypes["default"].number, _VirtualList.itemSizesShape]).isRequired,
153
+ itemSize: _propTypes["default"].oneOfType([_propTypes["default"].number, _VirtualList2.itemSizesShape]).isRequired,
147
154
  /**
148
155
  * A callback function that receives a reference to the `scrollTo` feature.
149
156
  *
@@ -175,6 +182,13 @@ VirtualList.propTypes = /** @lends limestone/VirtualList.VirtualList.prototype *
175
182
  * @public
176
183
  */
177
184
  cbScrollTo: _propTypes["default"].func,
185
+ /**
186
+ * When this value is `true`, scrolling in a VirtualList with holding a 5-way key continues to outer Scoller.
187
+ *
188
+ * @type {Boolean}
189
+ * @public
190
+ */
191
+ continue5WayHold: _propTypes["default"].bool,
178
192
  /**
179
193
  * This is set to `true` by SpotlightContainerDecorator
180
194
  *
@@ -480,17 +494,18 @@ VirtualList.propTypes = /** @lends limestone/VirtualList.VirtualList.prototype *
480
494
  */
481
495
  wrap: _propTypes["default"].oneOfType([_propTypes["default"].bool, _propTypes["default"].oneOf(['noAnimation'])])
482
496
  };
483
- exports.VirtualList = VirtualList = (0, _Skinnable["default"])((0, _SpotlightContainerDecorator["default"])({
497
+ exports.VirtualList = _VirtualList = (0, _Skinnable["default"])((0, _SpotlightContainerDecorator["default"])({
484
498
  overflow: true,
485
499
  preserveId: true,
486
500
  restrict: 'self-first'
487
501
  }, (0, _I18nDecorator.I18nContextDecorator)({
488
502
  rtlProp: 'rtl'
489
- }, VirtualList)));
490
- VirtualList.defaultPropValues = virtualListDefaultProps;
503
+ }, _VirtualList)));
504
+ _VirtualList.defaultPropValues = virtualListDefaultProps;
491
505
  var virtualGridListDefaultProps = {
492
506
  'data-spotlight-container-disabled': false,
493
507
  cbScrollTo: nop,
508
+ continue5WayHold: false,
494
509
  direction: 'vertical',
495
510
  horizontalScrollbar: 'auto',
496
511
  noAffordance: false,
@@ -522,8 +537,9 @@ var virtualGridListDefaultProps = {
522
537
  * @ui
523
538
  * @public
524
539
  */
525
- var VirtualGridList = exports.VirtualGridList = function VirtualGridList(props) {
540
+ var _VirtualGridList = exports.VirtualGridList = function VirtualGridList(props) {
526
541
  var virtualGridListProps = (0, _util.setDefaultProps)(props, virtualGridListDefaultProps);
542
+ (0, _util.checkPropTypes)(_VirtualGridList, virtualGridListProps);
527
543
  if (typeof ENACT_PACK_NO_ANIMATION !== 'undefined' && ENACT_PACK_NO_ANIMATION) {
528
544
  virtualGridListProps.overscrollEffectOn = {
529
545
  arrowKey: false,
@@ -533,8 +549,12 @@ var VirtualGridList = exports.VirtualGridList = function VirtualGridList(props)
533
549
  wheel: false
534
550
  };
535
551
  }
536
- var hoverToScroll = virtualGridListProps.hoverToScroll,
552
+ var continue5WayHold = virtualGridListProps.continue5WayHold,
553
+ hoverToScroll = virtualGridListProps.hoverToScroll,
537
554
  rest = _objectWithoutProperties(virtualGridListProps, _excluded3);
555
+ _spotlight["default"].set(props.id, {
556
+ continue5WayHold: continue5WayHold
557
+ });
538
558
  var _useScroll2 = (0, _useScroll3["default"])(rest),
539
559
  ScrollContentWrapper = _useScroll2.scrollContentWrapper,
540
560
  scrollContentHandle = _useScroll2.scrollContentHandle,
@@ -554,14 +574,14 @@ var VirtualGridList = exports.VirtualGridList = function VirtualGridList(props)
554
574
  }));
555
575
  return /*#__PURE__*/(0, _jsxRuntime.jsx)(_Resizable.ResizeContext, _objectSpread(_objectSpread({}, resizeContextProps), {}, {
556
576
  children: /*#__PURE__*/(0, _jsxRuntime.jsxs)(ScrollContentWrapper, _objectSpread(_objectSpread(_objectSpread({}, scrollContainerProps), scrollContentWrapperRest), {}, {
557
- children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_VirtualList.VirtualListBasic, _objectSpread(_objectSpread({}, themeScrollContentProps), {}, {
577
+ children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_VirtualList2.VirtualListBasic, _objectSpread(_objectSpread({}, themeScrollContentProps), {}, {
558
578
  ref: scrollContentHandle
559
579
  })), isVerticalScrollbarVisible ? /*#__PURE__*/(0, _jsxRuntime.jsx)(_Scrollbar["default"], _objectSpread({}, verticalScrollbarProps)) : null, isHorizontalScrollbarVisible ? /*#__PURE__*/(0, _jsxRuntime.jsx)(_Scrollbar["default"], _objectSpread({}, horizontalScrollbarProps)) : null, hoverToScroll ? /*#__PURE__*/(0, _jsxRuntime.jsx)(_HoverToScroll["default"], _objectSpread({}, hoverToScrollProps)) : null]
560
580
  }))
561
581
  }));
562
582
  };
563
- VirtualGridList.displayName = 'VirtualGridList';
564
- VirtualGridList.propTypes = /** @lends limestone/VirtualList.VirtualGridList.prototype */{
583
+ _VirtualGridList.displayName = 'VirtualGridList';
584
+ _VirtualGridList.propTypes = /** @lends limestone/VirtualList.VirtualGridList.prototype */{
565
585
  /**
566
586
  * Size of an item for the VirtualGridList; valid value is an object that has `minWidth`
567
587
  * and `minHeight` as properties.
@@ -580,7 +600,7 @@ VirtualGridList.propTypes = /** @lends limestone/VirtualList.VirtualGridList.pro
580
600
  * @required
581
601
  * @public
582
602
  */
583
- itemSize: _VirtualList.gridListItemSizeShape.isRequired,
603
+ itemSize: _VirtualList2.gridListItemSizeShape.isRequired,
584
604
  /**
585
605
  * A callback function that receives a reference to the `scrollTo` feature.
586
606
  *
@@ -612,6 +632,13 @@ VirtualGridList.propTypes = /** @lends limestone/VirtualList.VirtualGridList.pro
612
632
  * @public
613
633
  */
614
634
  cbScrollTo: _propTypes["default"].func,
635
+ /**
636
+ * When this value is `true`, scrolling in a VirtualGridList with holding a 5-way key continues to outer Scroller.
637
+ *
638
+ * @type {Boolean}
639
+ * @public
640
+ */
641
+ continue5WayHold: _propTypes["default"].bool,
615
642
  /**
616
643
  * This is set to `true` by SpotlightContainerDecorator
617
644
  *
@@ -920,12 +947,12 @@ VirtualGridList.propTypes = /** @lends limestone/VirtualList.VirtualGridList.pro
920
947
  */
921
948
  wrap: _propTypes["default"].oneOfType([_propTypes["default"].bool, _propTypes["default"].oneOf(['noAnimation'])])
922
949
  };
923
- exports.VirtualGridList = VirtualGridList = (0, _Skinnable["default"])((0, _SpotlightContainerDecorator["default"])({
950
+ exports.VirtualGridList = _VirtualGridList = (0, _Skinnable["default"])((0, _SpotlightContainerDecorator["default"])({
924
951
  overflow: true,
925
952
  preserveId: true,
926
953
  restrict: 'self-first'
927
954
  }, (0, _I18nDecorator.I18nContextDecorator)({
928
955
  rtlProp: 'rtl'
929
- }, VirtualGridList)));
930
- VirtualGridList.defaultPropValues = virtualGridListDefaultProps;
931
- var _default = exports["default"] = VirtualList;
956
+ }, _VirtualGridList)));
957
+ _VirtualGridList.defaultPropValues = virtualGridListDefaultProps;
958
+ var _default = exports["default"] = _VirtualList;
@@ -530,6 +530,9 @@ describe('VirtualGridList with translate \'scrollMode\'', function () {
530
530
  expect(startScrollTop).toBe(0);
531
531
  expect(onScrollStartCount).toBe(1);
532
532
  expect(resultScrollTop).toBe(0);
533
+ (0, _react.act)(function () {
534
+ return jest.advanceTimersByTime(200);
535
+ });
533
536
  var listRoot = _react.screen.getByRole('list').parentElement;
534
537
  expect(listRoot).toHaveStyle({
535
538
  '--scroll-overscroll-translate-vertical': 'translateY(0px)'
@@ -162,7 +162,7 @@ describe('VirtualList', function () {
162
162
  });
163
163
  describe('ScrollTo', function () {
164
164
  test('should warn if both \'minSize\' in \'itemSize\' prop and \'cbScrollTo\' prop are given', function () {
165
- var consoleSpy = jest.spyOn(console, 'error').mockImplementation(function () {});
165
+ var consoleSpy = jest.spyOn(console, 'warn').mockImplementation(function () {});
166
166
  var variableItemSize = {
167
167
  minSize: itemSize,
168
168
  size: [100, 200, 300, 400, 100, 200, 300, 400, 100, 200]
@@ -179,6 +179,33 @@ describe('VirtualList', function () {
179
179
  expect(consoleSpy).toHaveBeenCalled();
180
180
  expect(consoleSpy.mock.calls[0][0]).toBe(expectedErrorMsg);
181
181
  });
182
+ test('should not warn if \'minSize\' in \'itemSize\' prop is given without \'cbScrollTo\' prop', function () {
183
+ var consoleSpy = jest.spyOn(console, 'warn').mockImplementation(function () {});
184
+ var variableItemSize = {
185
+ minSize: itemSize,
186
+ size: [100, 200, 300, 400, 100, 200, 300, 400, 100, 200]
187
+ };
188
+ (0, _react.render)(/*#__PURE__*/(0, _jsxRuntime.jsx)(_VirtualList["default"], {
189
+ clientSize: clientSize,
190
+ dataSize: 10,
191
+ itemRenderer: renderItem,
192
+ itemSize: variableItemSize,
193
+ scrollMode: "translate"
194
+ }));
195
+ expect(consoleSpy).not.toHaveBeenCalled();
196
+ });
197
+ test('should not warn if \'cbScrollTo\' prop is given without \'minSize\' in \'itemSize\' prop', function () {
198
+ var consoleSpy = jest.spyOn(console, 'warn').mockImplementation(function () {});
199
+ (0, _react.render)(/*#__PURE__*/(0, _jsxRuntime.jsx)(_VirtualList["default"], {
200
+ cbScrollTo: function cbScrollTo() {},
201
+ clientSize: clientSize,
202
+ dataSize: 10,
203
+ itemRenderer: renderItem,
204
+ itemSize: itemSize,
205
+ scrollMode: "translate"
206
+ }));
207
+ expect(consoleSpy).not.toHaveBeenCalled();
208
+ });
182
209
  });
183
210
  describe('Adding an item', function () {
184
211
  test('should render an added item named \'Password 0\' as the first item', function (done) {
@@ -397,7 +397,7 @@ describe('VirtualList with translate \'scrollMode\'', function () {
397
397
  });
398
398
  });
399
399
  test('should warn if both \'minSize\' in \'itemSize\' prop and \'cbScrollTo\' prop are given', function () {
400
- var consoleSpy = jest.spyOn(console, 'error').mockImplementation(function () {});
400
+ var consoleSpy = jest.spyOn(console, 'warn').mockImplementation(function () {});
401
401
  var variableItemSize = {
402
402
  minSize: itemSize,
403
403
  size: [100, 200, 300, 400, 100, 200, 300, 400, 100, 200]
@@ -523,6 +523,9 @@ describe('VirtualList with translate \'scrollMode\'', function () {
523
523
  expect(startScrollTop).toBe(0);
524
524
  expect(onScrollStartCount).toBe(1);
525
525
  expect(resultScrollTop).toBe(0);
526
+ (0, _react.act)(function () {
527
+ return jest.advanceTimersByTime(200);
528
+ });
526
529
  var listRoot = _react.screen.getByRole('list').parentElement;
527
530
  expect(listRoot).toHaveStyle({
528
531
  '--scroll-overscroll-translate-vertical': 'translateY(0px)'
@@ -113,7 +113,7 @@ var useSpotlightRestore = exports.useSpotlightRestore = function useSpotlightRes
113
113
  mutableRef.current.restoreLastFocused = false;
114
114
 
115
115
  // try to focus the last focused item
116
- spottable.current.isScrolledByJump = true;
116
+ spottable.current.isScrolledByJump = true; // eslint-disable-line react-hooks/immutability
117
117
  var foundLastFocused = focusByIndex(mutableRef.current.preservedIndex, mutableRef.current.lastSpotlightDirection);
118
118
  spottable.current.isScrolledByJump = false;
119
119
 
@@ -4,10 +4,10 @@
4
4
  .wizardPanels .steps {
5
5
  height: 1.25rem;
6
6
  line-height: 1.25rem;
7
- margin-top: calc( var(--primitive-spacing-84) * -1);
7
+ margin-top: calc(var(--primitive-spacing-84) * -1);
8
8
  }
9
9
  .wizardPanels .content {
10
- margin: var(--primitive-spacing-60) 4.75rem;
10
+ margin: var(--primitive-spacing-60) NaNrem - NaNrem - var(--primitive-spacing-36)));
11
11
  }
12
12
  .wizardPanels .footer {
13
13
  text-align: center;
@@ -6,8 +6,10 @@ import * as React from "react";
6
6
  type Omit<T, K extends keyof T> = Pick<T, Exclude<keyof T, K>>;
7
7
  type Merge<M, N> = Omit<M, Extract<keyof M, keyof N>> & N;
8
8
 
9
- export interface WizardPanelsProps
10
- extends Merge<WizardPanelsBaseProps, ui_Changeable_ChangeableProps> {
9
+ export interface WizardPanelsProps extends Merge<
10
+ WizardPanelsBaseProps,
11
+ ui_Changeable_ChangeableProps
12
+ > {
11
13
  /**
12
14
  * Called when the back button is pressed.
13
15
  *
Binary file
package/internal/$L/$L.js CHANGED
@@ -15,7 +15,7 @@ function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbol
15
15
  function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
16
16
  function _defineProperty(e, r, t) { return (r = _toPropertyKey(r)) in e ? Object.defineProperty(e, r, { value: t, enumerable: !0, configurable: !0, writable: !0 }) : e[r] = t, e; }
17
17
  function _toPropertyKey(t) { var i = _toPrimitive(t, "string"); return "symbol" == typeof i ? i : i + ""; }
18
- function _toPrimitive(t, r) { if ("object" != typeof t || !t) return t; var e = t[Symbol.toPrimitive]; if (void 0 !== e) { var i = e.call(t, r || "default"); if ("object" != typeof i) return i; throw new TypeError("@@toPrimitive must return a primitive value."); } return ("string" === r ? String : Number)(t); } /* global ILIB_SANDSTONE_PATH */
18
+ function _toPrimitive(t, r) { if ("object" != typeof t || !t) return t; var e = t[Symbol.toPrimitive]; if (void 0 !== e) { var i = e.call(t, r || "default"); if ("object" != typeof i) return i; throw new TypeError("@@toPrimitive must return a primitive value."); } return ("string" === r ? String : Number)(t); } /* global ILIB_LIMESTONE_PATH */
19
19
  // The ilib.ResBundle for the active locale used by $L
20
20
  var resBundle;
21
21
 
@@ -37,8 +37,8 @@ function getResBundle() {
37
37
  */
38
38
  function createResBundle(options) {
39
39
  var opts = options;
40
- if (typeof ILIB_SANDSTONE_PATH !== 'undefined') {
41
- opts.basePath = ILIB_SANDSTONE_PATH;
40
+ if (typeof ILIB_LIMESTONE_PATH !== 'undefined') {
41
+ opts.basePath = ILIB_LIMESTONE_PATH;
42
42
  }
43
43
  if (!opts.onLoad) return;
44
44
 
@@ -5,6 +5,7 @@ Object.defineProperty(exports, "__esModule", {
5
5
  });
6
6
  exports.AsyncRenderChildren = AsyncRenderChildren;
7
7
  exports["default"] = void 0;
8
+ var _util = require("@enact/core/util");
8
9
  var _propTypes = _interopRequireDefault(require("prop-types"));
9
10
  var _react = require("react");
10
11
  function _interopRequireDefault(e) { return e && e.__esModule ? e : { "default": e }; }
@@ -27,11 +28,14 @@ var delayToRenderChildren = 600;
27
28
  * @ui
28
29
  * @private
29
30
  */
30
- function AsyncRenderChildren(_ref) {
31
- var children = _ref.children,
32
- _ref$fallback = _ref.fallback,
33
- fallback = _ref$fallback === void 0 ? '' : _ref$fallback,
34
- index = _ref.index;
31
+ function AsyncRenderChildren(props) {
32
+ var asyncRenderChildrenProps = (0, _util.setDefaultProps)(props, {
33
+ fallback: ''
34
+ });
35
+ (0, _util.checkPropTypes)(AsyncRenderChildren, asyncRenderChildrenProps);
36
+ var children = asyncRenderChildrenProps.children,
37
+ fallback = asyncRenderChildrenProps.fallback,
38
+ index = asyncRenderChildrenProps.index;
35
39
  var _useState = (0, _react.useState)(index),
36
40
  _useState2 = _slicedToArray(_useState, 2),
37
41
  prevIndex = _useState2[0],
@@ -2,6 +2,7 @@
2
2
 
3
3
  require("@testing-library/jest-dom");
4
4
  var _react = require("@testing-library/react");
5
+ var _react2 = require("react");
5
6
  var _AsyncRenderChildren = _interopRequireDefault(require("../AsyncRenderChildren"));
6
7
  var _jsxRuntime = require("react/jsx-runtime");
7
8
  function _interopRequireDefault(e) { return e && e.__esModule ? e : { "default": e }; }
@@ -12,7 +13,9 @@ function _toPropertyKey(t) { var i = _toPrimitive(t, "string"); return "symbol"
12
13
  function _toPrimitive(t, r) { if ("object" != typeof t || !t) return t; var e = t[Symbol.toPrimitive]; if (void 0 !== e) { var i = e.call(t, r || "default"); if ("object" != typeof i) return i; throw new TypeError("@@toPrimitive must return a primitive value."); } return ("string" === r ? String : Number)(t); }
13
14
  var data = {};
14
15
  var Component = function Component(props) {
15
- data = props;
16
+ (0, _react2.useEffect)(function () {
17
+ data = props;
18
+ }, [props]);
16
19
  return /*#__PURE__*/(0, _jsxRuntime.jsx)(_AsyncRenderChildren["default"], _objectSpread({}, props));
17
20
  };
18
21
  describe('AsyncRenderChildren', function () {
@@ -1,7 +1,7 @@
1
1
  .dateComponentPicker {
2
2
  display: inline-block;
3
3
  text-align: center;
4
- margin: 0 0.5rem;
4
+ margin: 0 var(--primitive-spacing-24);
5
5
  vertical-align: inherit;
6
6
  }
7
7
  .dateComponentPicker .label {
@@ -20,7 +20,7 @@
20
20
  :global(.enact-locale-non-latin) .dateComponentPicker .label {
21
21
  font-family: "Limestone";
22
22
  font-weight: var(--primitive-font-weight-light);
23
- font-size: 1.125rem;
23
+ font-size: var(--primitive-font-size-54);
24
24
  font-style: normal;
25
25
  }
26
26
  :global(.enact-locale-km) .dateComponentPicker .label {
@@ -2,6 +2,7 @@
2
2
  display: inline-block;
3
3
  }
4
4
  .dateTime .heading {
5
+ font-size: var(--primitive-font-size-66);
5
6
  margin: 0 0 var(--primitive-spacing-132);
6
7
  border-bottom: none;
7
8
  }
@@ -71,7 +71,8 @@ var DateTimeDecorator = exports.DateTimeDecorator = (0, _hoc["default"])(functio
71
71
  });
72
72
 
73
73
  // eslint-disable-next-line no-shadow
74
- var DateTimeDecorator = function DateTimeDecorator(props) {
74
+ var _DateTimeDecorator = function DateTimeDecorator(props) {
75
+ (0, _util.checkPropTypes)(_DateTimeDecorator, props);
75
76
  var newValue = toTime(props.value);
76
77
  var _useState = (0, _react.useState)(null),
77
78
  _useState2 = _slicedToArray(_useState, 2),
@@ -214,8 +215,8 @@ var DateTimeDecorator = exports.DateTimeDecorator = (0, _hoc["default"])(functio
214
215
  value: finalValue
215
216
  }));
216
217
  };
217
- DateTimeDecorator.displayName = 'DateTimeDecorator';
218
- DateTimeDecorator.propTypes = /** @lends limestone/internal/DateTimeDecorator.DateTimeDecorator.prototype */{
218
+ _DateTimeDecorator.displayName = 'DateTimeDecorator';
219
+ _DateTimeDecorator.propTypes = /** @lends limestone/internal/DateTimeDecorator.DateTimeDecorator.prototype */{
219
220
  /**
220
221
  * The current locale as a
221
222
  * {@link https://tools.ietf.org/html/rfc5646|BCP 47 language tag}.
@@ -263,6 +264,6 @@ var DateTimeDecorator = exports.DateTimeDecorator = (0, _hoc["default"])(functio
263
264
  return (0, _I18nDecorator.I18nContextDecorator)({
264
265
  rtlProp: 'rtl',
265
266
  localeProp: 'locale'
266
- }, (0, _Changeable["default"])(DateTimeDecorator));
267
+ }, (0, _Changeable["default"])(_DateTimeDecorator));
267
268
  });
268
269
  var _default = exports["default"] = DateTimeDecorator;
@@ -4,16 +4,17 @@ Object.defineProperty(exports, "__esModule", {
4
4
  value: true
5
5
  });
6
6
  exports["default"] = exports.PanelsRouter = exports.PanelsContext = void 0;
7
- var _react = require("react");
8
7
  var _hoc = _interopRequireDefault(require("@enact/core/hoc"));
9
8
  var _propTypes = _interopRequireDefault(require("@enact/core/internal/prop-types"));
10
9
  var _useChainRefs = _interopRequireDefault(require("@enact/core/useChainRefs"));
10
+ var _util = require("@enact/core/util");
11
11
  var _propTypes2 = _interopRequireDefault(require("prop-types"));
12
+ var _react = require("react");
12
13
  var _useAutoFocus = _interopRequireDefault(require("./useAutoFocus"));
13
14
  var _useFocusOnTransition2 = _interopRequireDefault(require("./useFocusOnTransition"));
14
15
  var _useToggleRole2 = _interopRequireDefault(require("./useToggleRole"));
15
16
  var _jsxRuntime = require("react/jsx-runtime");
16
- var _excluded = ["children", "componentRef", "data-spotlight-id", "index", "onTransition", "onWillTransition", "rtl", "subtitle", "title"],
17
+ var _excluded = ["autoFocus", "children", "componentRef", "data-spotlight-id", "index", "onTransition", "onWillTransition", "rtl", "subtitle", "title"],
17
18
  _excluded2 = ["onWillTransition"];
18
19
  function _interopRequireDefault(e) { return e && e.__esModule ? e : { "default": e }; }
19
20
  function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
@@ -36,18 +37,20 @@ var PanelsContext = exports.PanelsContext = /*#__PURE__*/(0, _react.createContex
36
37
  function useReverseTransition() {
37
38
  var index = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : -1;
38
39
  var rtl = arguments.length > 1 ? arguments[1] : undefined;
39
- var prevIndex = (0, _react.useRef)(index);
40
- var reverse = (0, _react.useRef)(rtl);
40
+ var prevIndex = (0, _util.usePrevious)(index);
41
+
41
42
  // If the index was changed, the panel transition occurs on the next cycle by `Panel`
42
- var prev = {
43
- reverseTransition: reverse.current,
44
- prevIndex: prevIndex.current
45
- };
46
- if (prevIndex.current !== index) {
47
- reverse.current = rtl ? index > prevIndex.current : index < prevIndex.current;
48
- prevIndex.current = index;
43
+ if (prevIndex !== index) {
44
+ var reverse = rtl ? index > prevIndex : index < prevIndex;
45
+ return {
46
+ reverseTransition: reverse,
47
+ prevIndex: index
48
+ };
49
49
  }
50
- return prev;
50
+ return {
51
+ reverseTransition: rtl,
52
+ prevIndex: index
53
+ };
51
54
  }
52
55
  var defaultConfig = {
53
56
  type: 'wizard'
@@ -66,20 +69,25 @@ var defaultConfig = {
66
69
  * @private
67
70
  */
68
71
  var PanelsRouter = exports.PanelsRouter = (0, _hoc["default"])(defaultConfig, function (config, Wrapped) {
69
- var PanelsProvider = function PanelsProvider(_ref) {
70
- var children = _ref.children,
71
- componentRef = _ref.componentRef,
72
- spotlightId = _ref['data-spotlight-id'],
73
- _ref$index = _ref.index,
74
- index = _ref$index === void 0 ? 0 : _ref$index,
75
- onTransition = _ref.onTransition,
76
- onWillTransition = _ref.onWillTransition,
77
- rtl = _ref.rtl,
78
- _ref$subtitle = _ref.subtitle,
79
- subtitle = _ref$subtitle === void 0 ? '' : _ref$subtitle,
80
- _ref$title = _ref.title,
81
- title = _ref$title === void 0 ? '' : _ref$title,
82
- rest = _objectWithoutProperties(_ref, _excluded);
72
+ var _PanelsProvider = function PanelsProvider(props) {
73
+ var panelsProviderProps = (0, _util.setDefaultProps)(props, {
74
+ autoFocus: 'default-element',
75
+ index: 0,
76
+ subtitle: '',
77
+ title: ''
78
+ });
79
+ (0, _util.checkPropTypes)(_PanelsProvider, panelsProviderProps);
80
+ var autoFocus = panelsProviderProps.autoFocus,
81
+ children = panelsProviderProps.children,
82
+ componentRef = panelsProviderProps.componentRef,
83
+ spotlightId = panelsProviderProps['data-spotlight-id'],
84
+ index = panelsProviderProps.index,
85
+ onTransition = panelsProviderProps.onTransition,
86
+ onWillTransition = panelsProviderProps.onWillTransition,
87
+ rtl = panelsProviderProps.rtl,
88
+ subtitle = panelsProviderProps.subtitle,
89
+ title = panelsProviderProps.title,
90
+ rest = _objectWithoutProperties(panelsProviderProps, _excluded);
83
91
  var _useState = (0, _react.useState)(null),
84
92
  _useState2 = _slicedToArray(_useState, 2),
85
93
  panel = _useState2[0],
@@ -87,11 +95,11 @@ var PanelsRouter = exports.PanelsRouter = (0, _hoc["default"])(defaultConfig, fu
87
95
  var _useToggleRole = (0, _useToggleRole2["default"])(),
88
96
  a11yRef = _useToggleRole.ref,
89
97
  a11yOnWillTransition = _useToggleRole.onWillTransition;
90
- var autoFocus = (0, _useAutoFocus["default"])({
91
- autoFocus: 'default-element',
98
+ var autoFocusRef = (0, _useAutoFocus["default"])({
99
+ autoFocus: autoFocus,
92
100
  hideChildren: panel == null
93
101
  });
94
- var ref = (0, _useChainRefs["default"])(autoFocus, a11yRef, componentRef);
102
+ var ref = (0, _useChainRefs["default"])(autoFocusRef, a11yRef, componentRef);
95
103
  var _useReverseTransition = useReverseTransition(index, rtl),
96
104
  reverseTransition = _useReverseTransition.reverseTransition,
97
105
  prevIndex = _useReverseTransition.prevIndex;
@@ -138,7 +146,16 @@ var PanelsRouter = exports.PanelsRouter = (0, _hoc["default"])(defaultConfig, fu
138
146
  }))]
139
147
  });
140
148
  };
141
- PanelsProvider.propTypes = /** @lends limestone/internal/Panels.PanelsRouter.prototype */{
149
+ _PanelsProvider.propTypes = /** @lends limestone/internal/Panels.PanelsRouter.prototype */{
150
+ /**
151
+ * Sets the strategy used to automatically focus an element within the Panels upon render.
152
+ * When set to 'none', focus is not set only on the first render.
153
+ *
154
+ * @type {('default-element'|'last-focused'|'none'|String)}
155
+ * @default 'default-element'
156
+ * @private
157
+ */
158
+ autoFocus: _propTypes2["default"].string,
142
159
  /**
143
160
  * Obtains a reference to the root node.
144
161
  *
@@ -218,6 +235,6 @@ var PanelsRouter = exports.PanelsRouter = (0, _hoc["default"])(defaultConfig, fu
218
235
  */
219
236
  title: _propTypes2["default"].string
220
237
  };
221
- return PanelsProvider;
238
+ return _PanelsProvider;
222
239
  });
223
240
  var _default = exports["default"] = PanelsRouter;
@@ -8,6 +8,7 @@ exports.useAutoFocus = useAutoFocus;
8
8
  var _hoc = _interopRequireDefault(require("@enact/core/hoc"));
9
9
  var _propTypes = _interopRequireDefault(require("@enact/core/internal/prop-types"));
10
10
  var _useChainRefs = _interopRequireDefault(require("@enact/core/useChainRefs"));
11
+ var _util = require("@enact/core/util");
11
12
  var _spotlight = _interopRequireDefault(require("@enact/spotlight"));
12
13
  var _propTypes2 = _interopRequireDefault(require("prop-types"));
13
14
  var _react = require("react");
@@ -69,12 +70,15 @@ function useAutoFocus(_ref) {
69
70
  }
70
71
  var AutoFocusDecorator = exports.AutoFocusDecorator = (0, _hoc["default"])(function (config, Wrapped) {
71
72
  // eslint-disable-next-line no-shadow
72
- function AutoFocusDecorator(_ref2) {
73
- var _ref2$autoFocus = _ref2.autoFocus,
74
- autoFocus = _ref2$autoFocus === void 0 ? 'last-focused' : _ref2$autoFocus,
75
- componentRef = _ref2.componentRef,
76
- hideChildren = _ref2.hideChildren,
77
- rest = _objectWithoutProperties(_ref2, _excluded);
73
+ function AutoFocusDecorator(props) {
74
+ var autoFocusDecoratorProps = (0, _util.setDefaultProps)(props, {
75
+ autoFocus: 'last-focused'
76
+ });
77
+ (0, _util.checkPropTypes)(AutoFocusDecorator, autoFocusDecoratorProps);
78
+ var autoFocus = autoFocusDecoratorProps.autoFocus,
79
+ componentRef = autoFocusDecoratorProps.componentRef,
80
+ hideChildren = autoFocusDecoratorProps.hideChildren,
81
+ rest = _objectWithoutProperties(autoFocusDecoratorProps, _excluded);
78
82
  var hook = useAutoFocus({
79
83
  autoFocus: autoFocus,
80
84
  hideChildren: hideChildren
@@ -33,10 +33,11 @@ var transitionHandlers = {
33
33
  })
34
34
  };
35
35
  function useFocusOnTransition(config) {
36
- var _useRef = (0, _react.useRef)({
36
+ var current = (0, _react.useMemo)(function () {
37
+ return {
37
38
  timerId: null
38
- }),
39
- current = _useRef.current;
39
+ };
40
+ }, []);
40
41
  var handlers = (0, _useHandlers["default"])(transitionHandlers, config, {
41
42
  current: current
42
43
  });