@enact/limestone 1.3.0 → 1.9.3

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 (163) 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 +4 -2
  7. package/Alert/Alert.js +4 -1
  8. package/Alert/Alert.module.css +36 -0
  9. package/BodyText/BodyText.d.ts +5 -4
  10. package/BodyText/BodyText.module.css +7 -7
  11. package/Button/Button.d.ts +17 -12
  12. package/Button/Button.js +1 -1
  13. package/Button/Button.module.css +195 -268
  14. package/CHANGELOG.md +220 -0
  15. package/Card/Card.d.ts +36 -8
  16. package/Card/Card.js +157 -20
  17. package/Card/Card.module.css +277 -58
  18. package/Card/tests/Card-specs.js +30 -0
  19. package/Checkbox/Checkbox.d.ts +8 -7
  20. package/Checkbox/Checkbox.js +3 -1
  21. package/Checkbox/Checkbox.module.css +213 -120
  22. package/Checkbox/tests/Checkbox-specs.js +1 -1
  23. package/CheckboxItem/CheckboxItem.d.ts +22 -7
  24. package/CheckboxItem/CheckboxItem.js +69 -4
  25. package/Chips/Chip.js +60 -7
  26. package/Chips/Chip.module.css +3 -3
  27. package/Chips/Chips.js +26 -12
  28. package/Chips/Chips.module.css +1 -1
  29. package/Chips/tests/Chip-specs.js +19 -9
  30. package/Chips/tests/Chips-specs.js +19 -19
  31. package/ContextualMenuDecorator/ContextualMenuDecorator.d.ts +4 -5
  32. package/ContextualPopupDecorator/ContextualPopup.module.css +34 -34
  33. package/ContextualPopupDecorator/ContextualPopupDecorator.js +557 -549
  34. package/DatePicker/DatePicker.d.ts +4 -5
  35. package/DayPicker/DayPicker.d.ts +8 -7
  36. package/Dropdown/Dropdown.d.ts +11 -13
  37. package/Dropdown/Dropdown.module.css +9 -9
  38. package/Dropdown/DropdownList.js +16 -11
  39. package/FixedPopupPanels/FixedPopupPanels.d.ts +4 -2
  40. package/FixedPopupPanels/FixedPopupPanels.module.css +18 -18
  41. package/FlexiblePopupPanels/FlexiblePopupPanels.module.css +23 -23
  42. package/FormCheckboxItem/FormCheckboxItem.d.ts +5 -4
  43. package/Heading/Heading.d.ts +8 -7
  44. package/Heading/Heading.module.css +5 -5
  45. package/Icon/Icon.d.ts +14 -4
  46. package/Icon/Icon.js +48 -2
  47. package/Icon/Icon.module.css +1 -1
  48. package/Icon/IconList.js +25 -1
  49. package/IconItem/IconItem.d.ts +13 -12
  50. package/IconItem/IconItem.js +15 -0
  51. package/IconItem/IconItem.module.css +107 -1
  52. package/Image/Image.d.ts +5 -4
  53. package/ImageItem/ImageItem.d.ts +11 -10
  54. package/ImageItem/ImageItem.js +37 -31
  55. package/ImageItem/ImageItem.module.css +30 -30
  56. package/ImageItem/tests/ImageItem-specs.js +3 -10
  57. package/Input/Input.js +9 -2
  58. package/Input/Input.module.css +37 -8
  59. package/Input/InputField.js +5 -1
  60. package/Input/InputField.module.css +17 -2
  61. package/Input/InputFieldSpotlightDecorator.js +213 -229
  62. package/Input/index.d.ts +15 -18
  63. package/Input/tests/InputField-specs.js +21 -0
  64. package/Item/Item.d.ts +16 -9
  65. package/Item/Item.js +20 -2
  66. package/Item/Item.module.css +1 -1
  67. package/KeyGuide/KeyGuide.d.ts +8 -7
  68. package/KeyGuide/KeyGuide.module.css +25 -1
  69. package/Marquee/Marquee.d.ts +2 -4
  70. package/MediaOverlay/MediaOverlay.d.ts +12 -11
  71. package/MediaOverlay/MediaOverlay.js +43 -21
  72. package/MediaOverlay/MediaOverlay.module.css +114 -15
  73. package/MediaPlayer/MediaControls.js +195 -13
  74. package/MediaPlayer/MediaControls.module.css +3 -2
  75. package/MediaPlayer/MediaSlider.module.css +7 -20
  76. package/MediaPlayer/index.d.ts +59 -7
  77. package/PageViews/PageViews.js +165 -80
  78. package/PageViews/PageViewsRouter.js +9 -0
  79. package/PageViews/tests/PageViews-specs.js +84 -0
  80. package/Panels/Header.js +48 -30
  81. package/Panels/Header.module.css +83 -31
  82. package/Panels/Panel.module.css +1 -1
  83. package/Panels/index.d.ts +7 -8
  84. package/Picker/Picker.d.ts +4 -5
  85. package/Picker/Picker.module.css +2 -2
  86. package/Popup/Popup.js +242 -240
  87. package/Popup/Popup.module.css +24 -24
  88. package/PopupTabLayout/PopupTabLayout.d.ts +5 -7
  89. package/PopupTabLayout/PopupTabLayout.js +15 -9
  90. package/PopupTabLayout/PopupTabLayout.module.css +53 -16
  91. package/PopupTabLayout/PopupTabLayoutStateContext.js +8 -0
  92. package/ProgressBar/ProgressBar.d.ts +5 -4
  93. package/ProgressBar/ProgressBarTooltip.module.css +12 -12
  94. package/ProgressButton/ProgressButton.d.ts +4 -5
  95. package/QuickGuidePanels/QuickGuidePanels.module.css +2 -2
  96. package/RadioItem/RadioItem.d.ts +18 -5
  97. package/RadioItem/RadioItem.js +67 -2
  98. package/RadioItem/RadioItem.module.css +36 -36
  99. package/RangePicker/RangePicker.module.css +2 -2
  100. package/Scroller/EditableWrapper.js +11 -4
  101. package/Scroller/Scroller.d.ts +20 -16
  102. package/Scroller/Scroller.js +9 -3
  103. package/Scroller/Scroller.module.css +4 -4
  104. package/Slider/Slider.d.ts +16 -14
  105. package/Slider/Slider.js +37 -4
  106. package/Slider/Slider.module.css +314 -91
  107. package/Slider/tests/Slider-specs.js +2 -1
  108. package/Spinner/Spinner.d.ts +5 -4
  109. package/Spinner/Spinner.module.css +9 -9
  110. package/Steps/Steps.d.ts +5 -4
  111. package/Steps/Steps.js +9 -5
  112. package/Switch/Switch.d.ts +8 -7
  113. package/Switch/Switch.module.css +100 -13
  114. package/SwitchItem/SwitchItem.d.ts +9 -6
  115. package/TabLayout/RefocusDecorator.js +15 -9
  116. package/TabLayout/TabGroup.js +3 -2
  117. package/TabLayout/TabGroup.module.css +2 -2
  118. package/TabLayout/TabLayout.d.ts +6 -0
  119. package/TabLayout/TabLayout.js +11 -1
  120. package/TabLayout/TabLayout.module.css +18 -0
  121. package/TabLayout/tests/TabLayout-specs.js +52 -0
  122. package/ThemeDecorator/ThemeDecorator.d.ts +9 -10
  123. package/ThemeDecorator/fontGenerator.js +1 -1
  124. package/ThemeDecorator/screenTypes.json +1 -0
  125. package/TimePicker/TimePicker.module.css +1 -1
  126. package/TooltipDecorator/Tooltip.module.css +1 -2
  127. package/TooltipDecorator/tests/util-specs.js +12 -0
  128. package/TooltipDecorator/useTooltip.js +1 -1
  129. package/TooltipDecorator/util.js +18 -11
  130. package/VideoPlayer/Feedback.js +3 -0
  131. package/VideoPlayer/Feedback.module.css +5 -9
  132. package/VideoPlayer/FeedbackIcons.js +1 -1
  133. package/VideoPlayer/FeedbackTooltip.module.css +55 -11
  134. package/VideoPlayer/VideoPlayer.d.ts +44 -18
  135. package/VideoPlayer/VideoPlayer.js +128 -23
  136. package/VideoPlayer/VideoPlayer.module.css +28 -11
  137. package/VirtualList/VirtualList.d.ts +9 -2
  138. package/VirtualList/VirtualList.js +31 -6
  139. package/VirtualList/tests/VirtualGridList-translate-specs.js +3 -0
  140. package/VirtualList/tests/VirtualList-specs.js +28 -1
  141. package/VirtualList/tests/VirtualList-translate-specs.js +4 -1
  142. package/WizardPanels/WizardPanels.module.css +2 -2
  143. package/WizardPanels/index.d.ts +4 -2
  144. package/fonts/Limestone_Icons.ttf +0 -0
  145. package/internal/$L/$L.js +3 -3
  146. package/internal/DateComponentPicker/DateComponentPicker.module.css +2 -2
  147. package/internal/DateTime/DateTime.module.css +1 -0
  148. package/internal/Panels/PanelsRouter.js +16 -5
  149. package/internal/Picker/Picker.module.css +2 -2
  150. package/internal/SharedStateDecorator/SharedStateDecorator.js +76 -99
  151. package/internal/validators/validators.js +21 -2
  152. package/package.json +14 -14
  153. package/styles/colors-highcontrast.less +9 -1
  154. package/styles/colors.less +11 -7
  155. package/styles/motion-mixins.less +66 -0
  156. package/styles/motions.less +78 -0
  157. package/styles/variables.less +176 -150
  158. package/useScroll/HoverToScroll.js +8 -5
  159. package/useScroll/ScrollbarTrack.module.css +8 -8
  160. package/useScroll/useEvent.js +7 -1
  161. package/useScroll/useScroll.js +2 -0
  162. package/useScroll/useScroll.module.css +6 -6
  163. package/.travis.yml +0 -40
package/styles/motions.less ADDED
@@ -0,0 +1,78 @@
1
+ @import "../styles/variables.less";
2
+
3
+ // Motion Tokens
4
+
5
+ /* ---------------------------------------
6
+ Animations
7
+ ------------------------------------------ */
8
+ :root {
9
+ /* Bounce
10
+ ------------------------------------------ */
11
+ --lime-bounce-motion: var(--lime-bounce-animation-name) var(--lime-bounce-motion-duration) var(--lime-bounce-motion-easing-function);
12
+ --lime-check-motion: var(--lime-check-animation-name) var(--lime-check-motion-duration) forwards;
13
+ }
14
+
15
+ /* ---------------------------------------
16
+ Animations properties
17
+ ------------------------------------------ */
18
+ :root {
19
+ /* ---------------------------------------
20
+ Durations
21
+ ------------------------------------------ */
22
+ --lime-motion-default-duration: 200ms;
23
+ --lime-motion-medium1-duration: 250ms;
24
+ --lime-motion-medium2-duration: 300ms;
25
+ --lime-motion-medium4-duration: 400ms;
26
+ --lime-motion-long2-duration: 500ms;
27
+ --lime-bounce-motion-duration: var(--lime-motion-medium2-duration);
28
+ --lime-check-motion-duration: var(--lime-motion-medium4-duration);
29
+ --lime-focus-in-motion-duration: var(--lime-motion-medium2-duration);
30
+ --lime-focus-out-motion-duration: var(--lime-motion-long2-duration);
31
+ --lime-press-motion-duration: var(--lime-motion-medium1-duration);
32
+ --lime-release-motion-duration: var(--lime-motion-medium2-duration);
33
+
34
+ /* ---------------------------------------
35
+ Easing functions
36
+ ------------------------------------------ */
37
+ --lime-default-motion-easing-function: ease-out;
38
+ --lime-EIO-motion-easing-function: cubic-bezier(0.2, 0.0, 0.05, 1.0);
39
+ --lime-EO-motion-easing-function: cubic-bezier(0.1, 0.6, 0.15, 1.0);
40
+ --lime-bounce-motion-easing-function: var(--lime-default-motion-easing-function);
41
+ --lime-focus-in-motion-easing-function: var(--lime-EIO-motion-easing-function);
42
+ --lime-focus-out-motion-easing-function: var(--lime-EO-motion-easing-function);
43
+ --lime-press-motion-easing-function: var(--lime-EIO-motion-easing-function);
44
+ --lime-release-motion-easing-function: var(--lime-EO-motion-easing-function);
45
+
46
+ /* ---------------------------------------
47
+ Keyframes names
48
+ ------------------------------------------ */
49
+ --lime-bounce-animation-name: bounce-motion;
50
+ --lime-check-animation-name: check-motion;
51
+
52
+ /* ---------------------------------------
53
+ Keyframes values
54
+ ------------------------------------------ */
55
+ --lime-bounce-motion-offset-default-value: 6px;
56
+ }
57
+
58
+ /* ---------------------------------------
59
+ Keyframes
60
+ ------------------------------------------ */
61
+
62
+ /* Bounce
63
+ ------------------------------------------ */
64
+ @keyframes bounce-motion {
65
+ @offset-value: var(--lime-bounce-motion-offset-value, --lime-bounce-motion-offset-default-value);
66
+
67
+ 0% {transform: translateX(0)}
68
+ 50% {transform: translateX(@offset-value)}
69
+ 80% {transform: translateX(~"calc(@{offset-value} / -2)")}
70
+ 100% {transform: translateX(0)}
71
+ }
72
+
73
+ /* Check
74
+ ------------------------------------------ */
75
+ @keyframes check-motion {
76
+ 0% {transform: translateX(0)}
77
+ 100% {transform: translateX(100%)}
78
+ }