@redis-ui/components 42.7.0 → 43.0.2

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 (197) hide show
  1. package/dist/AutoCompleteSelect/AutoCompleteSelect.cjs +7 -1
  2. package/dist/AutoCompleteSelect/AutoCompleteSelect.js +7 -1
  3. package/dist/AutoCompleteSelect/hooks/useAutoCompleteSelect.cjs +7 -1
  4. package/dist/AutoCompleteSelect/hooks/useAutoCompleteSelect.d.ts +8 -1
  5. package/dist/AutoCompleteSelect/hooks/useAutoCompleteSelect.js +7 -1
  6. package/dist/BoxSelectionGroup/components/Item/components/BoxStateIndicator/BoxStateIndicator.cjs +8 -4
  7. package/dist/BoxSelectionGroup/components/Item/components/BoxStateIndicator/BoxStateIndicator.js +8 -4
  8. package/dist/BoxSelectionGroup/components/Item/components/Compose/Compose.style.cjs +18 -4
  9. package/dist/BoxSelectionGroup/components/Item/components/Compose/Compose.style.js +18 -4
  10. package/dist/BoxSelectionGroup/hooks/useBoxSelectionGroup.cjs +3 -1
  11. package/dist/BoxSelectionGroup/hooks/useBoxSelectionGroup.js +3 -1
  12. package/dist/Breadcrumbs/Breadcrumbs.cjs +51 -0
  13. package/dist/Breadcrumbs/Breadcrumbs.d.ts +10 -0
  14. package/dist/Breadcrumbs/Breadcrumbs.js +51 -0
  15. package/dist/Breadcrumbs/Breadcrumbs.types.d.ts +17 -0
  16. package/dist/Breadcrumbs/components/Compose/Compose.cjs +14 -0
  17. package/dist/Breadcrumbs/components/Compose/Compose.d.ts +3 -0
  18. package/dist/Breadcrumbs/components/Compose/Compose.js +14 -0
  19. package/dist/Breadcrumbs/components/Compose/Compose.style.cjs +10 -0
  20. package/dist/Breadcrumbs/components/Compose/Compose.style.d.ts +1 -0
  21. package/dist/Breadcrumbs/components/Compose/Compose.style.js +8 -0
  22. package/dist/Breadcrumbs/components/Compose/Compose.types.d.ts +5 -0
  23. package/dist/Breadcrumbs/components/Current/Current.cjs +13 -0
  24. package/dist/Breadcrumbs/components/Current/Current.d.ts +3 -0
  25. package/dist/Breadcrumbs/components/Current/Current.js +13 -0
  26. package/dist/Breadcrumbs/components/Current/Current.style.cjs +11 -0
  27. package/dist/Breadcrumbs/components/Current/Current.style.d.ts +1 -0
  28. package/dist/Breadcrumbs/components/Current/Current.style.js +9 -0
  29. package/dist/Breadcrumbs/components/Current/Current.types.d.ts +4 -0
  30. package/dist/Breadcrumbs/components/Item/Item.cjs +12 -0
  31. package/dist/Breadcrumbs/components/Item/Item.d.ts +3 -0
  32. package/dist/Breadcrumbs/components/Item/Item.js +12 -0
  33. package/dist/Breadcrumbs/components/Item/Item.style.cjs +11 -0
  34. package/dist/Breadcrumbs/components/Item/Item.style.d.ts +1 -0
  35. package/dist/Breadcrumbs/components/Item/Item.style.js +9 -0
  36. package/dist/Breadcrumbs/components/Item/Item.types.d.ts +2 -0
  37. package/dist/Breadcrumbs/components/Link/Link.cjs +52 -0
  38. package/dist/Breadcrumbs/components/Link/Link.d.ts +3 -0
  39. package/dist/Breadcrumbs/components/Link/Link.js +52 -0
  40. package/dist/Breadcrumbs/components/Link/Link.style.cjs +13 -0
  41. package/dist/Breadcrumbs/components/Link/Link.style.d.ts +1 -0
  42. package/dist/Breadcrumbs/components/Link/Link.style.js +11 -0
  43. package/dist/Breadcrumbs/components/Link/Link.types.d.ts +5 -0
  44. package/dist/Breadcrumbs/components/List/List.cjs +12 -0
  45. package/dist/Breadcrumbs/components/List/List.d.ts +3 -0
  46. package/dist/Breadcrumbs/components/List/List.js +12 -0
  47. package/dist/Breadcrumbs/components/List/List.style.cjs +11 -0
  48. package/dist/Breadcrumbs/components/List/List.style.d.ts +1 -0
  49. package/dist/Breadcrumbs/components/List/List.style.js +9 -0
  50. package/dist/Breadcrumbs/components/List/List.types.d.ts +2 -0
  51. package/dist/Breadcrumbs/components/Separator/Separator.cjs +13 -0
  52. package/dist/Breadcrumbs/components/Separator/Separator.d.ts +3 -0
  53. package/dist/Breadcrumbs/components/Separator/Separator.js +13 -0
  54. package/dist/Breadcrumbs/components/Separator/Separator.style.cjs +11 -0
  55. package/dist/Breadcrumbs/components/Separator/Separator.style.d.ts +1 -0
  56. package/dist/Breadcrumbs/components/Separator/Separator.style.js +9 -0
  57. package/dist/Breadcrumbs/components/Separator/Separator.types.d.ts +4 -0
  58. package/dist/Breadcrumbs/index.d.ts +5 -0
  59. package/dist/Button/Button.style.cjs +4 -1
  60. package/dist/Button/Button.style.js +4 -1
  61. package/dist/Button/Button.style.utils.cjs +16 -1
  62. package/dist/Button/Button.style.utils.js +16 -1
  63. package/dist/Button/Button.types.cjs +1 -1
  64. package/dist/Button/Button.types.d.ts +1 -1
  65. package/dist/Button/Button.types.js +1 -1
  66. package/dist/Button/CopyToClipboardButton/CopyToClipboardButton.cjs +59 -0
  67. package/dist/Button/CopyToClipboardButton/CopyToClipboardButton.d.ts +4 -0
  68. package/dist/Button/CopyToClipboardButton/CopyToClipboardButton.js +57 -0
  69. package/dist/Button/CopyToClipboardButton/CopyToClipboardButton.style.cjs +40 -0
  70. package/dist/Button/CopyToClipboardButton/CopyToClipboardButton.style.d.ts +8 -0
  71. package/dist/Button/CopyToClipboardButton/CopyToClipboardButton.style.js +38 -0
  72. package/dist/Button/CopyToClipboardButton/CopyToClipboardButton.types.d.ts +5 -0
  73. package/dist/Button/TextButton/TextButton.style.cjs +4 -1
  74. package/dist/Button/TextButton/TextButton.style.js +4 -1
  75. package/dist/Button/TextButton/TextButton.types.cjs +1 -1
  76. package/dist/Button/TextButton/TextButton.types.d.ts +1 -1
  77. package/dist/Button/TextButton/TextButton.types.js +1 -1
  78. package/dist/Button/index.d.ts +2 -0
  79. package/dist/Checkbox/components/Label/Label.style.cjs +15 -3
  80. package/dist/Checkbox/components/Label/Label.style.js +15 -3
  81. package/dist/Chip/components/CloseButton/CloseButton.cjs +3 -1
  82. package/dist/Chip/components/CloseButton/CloseButton.js +3 -1
  83. package/dist/Chip/components/Compose/Compose.style.cjs +4 -1
  84. package/dist/Chip/components/Compose/Compose.style.js +4 -1
  85. package/dist/Drawer/components/Description/Description.cjs +3 -1
  86. package/dist/Drawer/components/Description/Description.js +3 -1
  87. package/dist/Helpers/contexts/Popper/PopperCollisionBoundaryManager.cjs +3 -1
  88. package/dist/Helpers/contexts/Popper/PopperCollisionBoundaryManager.js +3 -1
  89. package/dist/Helpers/contexts/PrimitiveContextState.cjs +28 -16
  90. package/dist/Helpers/contexts/PrimitiveContextState.js +28 -16
  91. package/dist/Helpers/contexts/SharedId.context.cjs +9 -5
  92. package/dist/Helpers/contexts/SharedId.context.js +9 -5
  93. package/dist/Helpers/css.utils.cjs +18 -4
  94. package/dist/Helpers/css.utils.d.ts +15 -3
  95. package/dist/Helpers/css.utils.js +18 -4
  96. package/dist/Helpers/hooks/useScrollable.cjs +3 -1
  97. package/dist/Helpers/hooks/useScrollable.js +3 -1
  98. package/dist/Helpers/react.utils.cjs +6 -2
  99. package/dist/Helpers/react.utils.js +6 -2
  100. package/dist/Inputs/QuantityCounter/components/InputGroup/components/ValueLabel/ValueLabel.cjs +9 -5
  101. package/dist/Inputs/QuantityCounter/components/InputGroup/components/ValueLabel/ValueLabel.js +9 -5
  102. package/dist/Inputs/components/Compose/Compose.style.cjs +29 -6
  103. package/dist/Inputs/components/Compose/Compose.style.js +29 -6
  104. package/dist/Inputs/hooks/numericInput/numericInput.utils.cjs +12 -4
  105. package/dist/Inputs/hooks/numericInput/numericInput.utils.js +12 -4
  106. package/dist/Inputs/hooks/numericInput/useNumericInput.cjs +15 -3
  107. package/dist/Inputs/hooks/numericInput/useNumericInput.js +15 -3
  108. package/dist/Loader/Loader.cjs +1 -0
  109. package/dist/Loader/Loader.js +1 -0
  110. package/dist/Menu/components/Content/components/Item/Components/Compose/Compose.style.cjs +19 -4
  111. package/dist/Menu/components/Content/components/Item/Components/Compose/Compose.style.js +19 -4
  112. package/dist/Menu/components/Content/components/Label/components/Compose/Compose.style.cjs +4 -1
  113. package/dist/Menu/components/Content/components/Label/components/Compose/Compose.style.js +4 -1
  114. package/dist/Modal/components/Content/components/Compose/Compose.cjs +3 -1
  115. package/dist/Modal/components/Content/components/Compose/Compose.js +3 -1
  116. package/dist/Modal/components/Content/components/Description/Description.cjs +3 -1
  117. package/dist/Modal/components/Content/components/Description/Description.js +3 -1
  118. package/dist/MultiSelect/components/Compose/hooks/useMultiSelectContextApi.cjs +3 -1
  119. package/dist/MultiSelect/components/Compose/hooks/useMultiSelectContextApi.js +3 -1
  120. package/dist/MultiSelect/components/Trigger/components/MultiValue/MultiValue.cjs +3 -1
  121. package/dist/MultiSelect/components/Trigger/components/MultiValue/MultiValue.js +3 -1
  122. package/dist/Overflow/Overflow.cjs +3 -1
  123. package/dist/Overflow/Overflow.js +3 -1
  124. package/dist/Overflow/Overflow.utils.cjs +15 -6
  125. package/dist/Overflow/Overflow.utils.js +15 -6
  126. package/dist/Overflow/components/OverflowContainer/OverflowContainer.cjs +3 -1
  127. package/dist/Overflow/components/OverflowContainer/OverflowContainer.js +3 -1
  128. package/dist/Pagination/components/PageSizeSelect.cjs +3 -1
  129. package/dist/Pagination/components/PageSizeSelect.js +3 -1
  130. package/dist/Popover/components/Content/Content.cjs +3 -1
  131. package/dist/Popover/components/Content/Content.js +3 -1
  132. package/dist/Popover/components/Content/components/Footer/Footer.cjs +3 -1
  133. package/dist/Popover/components/Content/components/Footer/Footer.js +3 -1
  134. package/dist/RadioGroup/components/Item/components/Label/Label.style.cjs +15 -3
  135. package/dist/RadioGroup/components/Item/components/Label/Label.style.js +15 -3
  136. package/dist/ScreenReaderAnnounce/ScreenReaderAnnounce.cjs +3 -1
  137. package/dist/ScreenReaderAnnounce/ScreenReaderAnnounce.js +3 -1
  138. package/dist/Section/components/Header/components/CollapseButton/CollapseButton.cjs +3 -1
  139. package/dist/Section/components/Header/components/CollapseButton/CollapseButton.js +3 -1
  140. package/dist/Select/components/Content/components/Option/components/Compose/Compose.style.cjs +16 -4
  141. package/dist/Select/components/Content/components/Option/components/Compose/Compose.style.js +16 -4
  142. package/dist/Select/components/Content/components/OptionList/OptionList.cjs +6 -4
  143. package/dist/Select/components/Content/components/OptionList/OptionList.js +6 -4
  144. package/dist/Select/components/Content/components/OptionList/Virtual.cjs +9 -5
  145. package/dist/Select/components/Content/components/OptionList/Virtual.js +9 -5
  146. package/dist/Select/components/Context/hooks/useSearch.cjs +3 -1
  147. package/dist/Select/components/Context/hooks/useSearch.js +3 -1
  148. package/dist/Select/components/Trigger/components/Compose/Compose.style.cjs +33 -7
  149. package/dist/Select/components/Trigger/components/Compose/Compose.style.js +33 -7
  150. package/dist/SideBar/components/Item/Item.style.cjs +14 -3
  151. package/dist/SideBar/components/Item/Item.style.js +14 -3
  152. package/dist/Skeleton/components/Circle/Circle.cjs +1 -1
  153. package/dist/Skeleton/components/Circle/Circle.js +1 -1
  154. package/dist/Skeleton/components/Square/Square.cjs +1 -1
  155. package/dist/Skeleton/components/Square/Square.js +1 -1
  156. package/dist/Slider/components/Label/Compose/Compose.cjs +3 -1
  157. package/dist/Slider/components/Label/Compose/Compose.js +3 -1
  158. package/dist/Slider/components/Mark/Compose/Compose.cjs +3 -1
  159. package/dist/Slider/components/Mark/Compose/Compose.js +3 -1
  160. package/dist/Slider/hooks/useOffset.cjs +3 -1
  161. package/dist/Slider/hooks/useOffset.js +3 -1
  162. package/dist/Stepper/components/Step/components/Compose/Compose.cjs +3 -1
  163. package/dist/Stepper/components/Step/components/Compose/Compose.js +3 -1
  164. package/dist/Stepper/hooks/useStepperInteractive.cjs +12 -4
  165. package/dist/Stepper/hooks/useStepperInteractive.js +12 -4
  166. package/dist/Switch/components/Switcher/Switcher.cjs +3 -1
  167. package/dist/Switch/components/Switcher/Switcher.js +3 -1
  168. package/dist/Switch/components/Switcher/Switcher.style.cjs +31 -8
  169. package/dist/Switch/components/Switcher/Switcher.style.js +31 -8
  170. package/dist/Tabs/components/TabBar/components/Trigger/components/Marker/Marker.style.cjs +24 -5
  171. package/dist/Tabs/components/TabBar/components/Trigger/components/Marker/Marker.style.js +24 -5
  172. package/dist/Tabs/components/TabBar/components/Trigger/components/Tab/Tab.style.cjs +24 -5
  173. package/dist/Tabs/components/TabBar/components/Trigger/components/Tab/Tab.style.js +24 -5
  174. package/dist/ThemeModeSwitch/useThemeModeSwitch.cjs +6 -2
  175. package/dist/ThemeModeSwitch/useThemeModeSwitch.js +6 -2
  176. package/dist/Toast/core/content.helper.cjs +8 -4
  177. package/dist/Toast/core/content.helper.js +8 -4
  178. package/dist/Tooltip/components/Content/Content.cjs +3 -1
  179. package/dist/Tooltip/components/Content/Content.js +3 -1
  180. package/dist/TreeView/TreeView.cjs +3 -1
  181. package/dist/TreeView/TreeView.js +3 -1
  182. package/dist/TreeView/components/TreeItem/components/Compose/Compose.cjs +6 -4
  183. package/dist/TreeView/components/TreeItem/components/Compose/Compose.js +6 -4
  184. package/dist/Typography/Typography.types.cjs +4 -0
  185. package/dist/Typography/Typography.types.d.ts +2 -1
  186. package/dist/Typography/Typography.types.js +4 -0
  187. package/dist/index.cjs +6 -0
  188. package/dist/index.d.ts +1 -0
  189. package/dist/index.js +110 -104
  190. package/package.json +10 -9
  191. package/skills/redis-ui-components/SKILL.md +128 -0
  192. package/skills/redis-ui-components/references/Button.md +169 -0
  193. package/skills/redis-ui-components/references/FlexDivider.md +152 -0
  194. package/skills/redis-ui-components/references/FlexGroup.md +149 -0
  195. package/skills/redis-ui-components/references/FlexItem.md +58 -0
  196. package/skills/redis-ui-components/references/FlexSplit.md +37 -0
  197. package/skills/redis-ui-components/references/Select.md +517 -0
@@ -30,7 +30,9 @@ const Compose = ({
30
30
  state,
31
31
  index: stepIndex
32
32
  }), [state, stepIndex]);
33
- if (stepIndex < 0) return null;
33
+ if (stepIndex < 0) {
34
+ return null;
35
+ }
34
36
  const interactiveProps = getInteractiveStepProps({
35
37
  onStepChange,
36
38
  getIsStepInteractive,
@@ -12,7 +12,9 @@ function useStepperInteractive({
12
12
  }) {
13
13
  const isInteractive = !!onStepChange;
14
14
  const isStepInteractive = React.useCallback((stepIndex) => {
15
- if (!isInteractive) return false;
15
+ if (!isInteractive) {
16
+ return false;
17
+ }
16
18
  if (typeof getIsStepInteractive === "function") {
17
19
  return getIsStepInteractive(stepIndex);
18
20
  }
@@ -21,19 +23,25 @@ function useStepperInteractive({
21
23
  const handleKeyDown = isInteractive ? (event) => {
22
24
  const findNextInteractive = (from, to = totalSteps || 0) => {
23
25
  for (let i = from; i < to; i += 1) {
24
- if (isStepInteractive(i)) return i;
26
+ if (isStepInteractive(i)) {
27
+ return i;
28
+ }
25
29
  }
26
30
  return void 0;
27
31
  };
28
32
  const findPrevInteractive = (from, to = 0) => {
29
33
  for (let i = from; i >= to; i -= 1) {
30
- if (isStepInteractive(i)) return i;
34
+ if (isStepInteractive(i)) {
35
+ return i;
36
+ }
31
37
  }
32
38
  return void 0;
33
39
  };
34
40
  const handleChange = (next) => {
35
41
  event.preventDefault();
36
- if (next !== void 0) onStepChange(next);
42
+ if (next !== void 0) {
43
+ onStepChange(next);
44
+ }
37
45
  };
38
46
  const {
39
47
  key
@@ -10,7 +10,9 @@ function useStepperInteractive({
10
10
  }) {
11
11
  const isInteractive = !!onStepChange;
12
12
  const isStepInteractive = useCallback((stepIndex) => {
13
- if (!isInteractive) return false;
13
+ if (!isInteractive) {
14
+ return false;
15
+ }
14
16
  if (typeof getIsStepInteractive === "function") {
15
17
  return getIsStepInteractive(stepIndex);
16
18
  }
@@ -19,19 +21,25 @@ function useStepperInteractive({
19
21
  const handleKeyDown = isInteractive ? (event) => {
20
22
  const findNextInteractive = (from, to = totalSteps || 0) => {
21
23
  for (let i = from; i < to; i += 1) {
22
- if (isStepInteractive(i)) return i;
24
+ if (isStepInteractive(i)) {
25
+ return i;
26
+ }
23
27
  }
24
28
  return void 0;
25
29
  };
26
30
  const findPrevInteractive = (from, to = 0) => {
27
31
  for (let i = from; i >= to; i -= 1) {
28
- if (isStepInteractive(i)) return i;
32
+ if (isStepInteractive(i)) {
33
+ return i;
34
+ }
29
35
  }
30
36
  return void 0;
31
37
  };
32
38
  const handleChange = (next) => {
33
39
  event.preventDefault();
34
- if (next !== void 0) onStepChange(next);
40
+ if (next !== void 0) {
41
+ onStepChange(next);
42
+ }
35
43
  };
36
44
  const {
37
45
  key
@@ -48,7 +48,9 @@ const Switcher = Object.assign(({
48
48
  userCanChangeRef.current = false;
49
49
  };
50
50
  handleKeyDown = (e) => {
51
- if ((e.code === "Space" || e.code === "Enter") && !e.shiftKey && !e.ctrlKey && !e.altKey && !e.metaKey) userCanChangeRef.current = true;
51
+ if ((e.code === "Space" || e.code === "Enter") && !e.shiftKey && !e.ctrlKey && !e.altKey && !e.metaKey) {
52
+ userCanChangeRef.current = true;
53
+ }
52
54
  };
53
55
  }
54
56
  return jsxRuntime.jsxRuntimeExports.jsx(Switcher.Compose, {
@@ -46,7 +46,9 @@ const Switcher = Object.assign(({
46
46
  userCanChangeRef.current = false;
47
47
  };
48
48
  handleKeyDown = (e) => {
49
- if ((e.code === "Space" || e.code === "Enter") && !e.shiftKey && !e.ctrlKey && !e.altKey && !e.metaKey) userCanChangeRef.current = true;
49
+ if ((e.code === "Space" || e.code === "Enter") && !e.shiftKey && !e.ctrlKey && !e.altKey && !e.metaKey) {
50
+ userCanChangeRef.current = true;
51
+ }
50
52
  };
51
53
  }
52
54
  return jsxRuntimeExports.jsx(Switcher.Compose, {
@@ -16,30 +16,53 @@ const getSwitchStatesStyle = (theme, maps, {
16
16
  withCursor,
17
17
  selectorSuffix = ""
18
18
  }) => {
19
- if (!theme) return null;
20
- if (disabled) return _styled.css`
19
+ if (!theme) {
20
+ return null;
21
+ }
22
+ if (disabled) {
23
+ return _styled.css`
21
24
  &&${selectorSuffix} {
22
- ${css_utils.styleFromTokens(maps, theme.disabled)};
25
+ ${css_utils.styleFromTokens({
26
+ tokenMaps: maps,
27
+ tokens: theme.disabled
28
+ })};
23
29
  ${withCursor && `cursor: not-allowed`};
24
30
  }
25
31
  `;
26
- if (readOnly) return _styled.css`
32
+ }
33
+ if (readOnly) {
34
+ return _styled.css`
27
35
  &${selectorSuffix}, &:hover${selectorSuffix}, &:active${selectorSuffix} {
28
- ${css_utils.styleFromTokens(maps, theme.readonly)};
36
+ ${css_utils.styleFromTokens({
37
+ tokenMaps: maps,
38
+ tokens: theme.readonly
39
+ })};
29
40
  ${withCursor && `cursor: default`};
30
41
  }
31
42
  `;
43
+ }
32
44
  return _styled.css`
33
45
  &${selectorSuffix} {
34
- ${css_utils.styleFromTokens(maps, theme.normal)};
46
+ ${css_utils.styleFromTokens({
47
+ tokenMaps: maps,
48
+ tokens: theme.normal
49
+ })};
35
50
  }
36
51
 
37
52
  &:hover${selectorSuffix} {
38
- ${css_utils.styleFromTokens(maps, theme.hover, theme.normal)};
53
+ ${css_utils.styleFromTokens({
54
+ tokenMaps: maps,
55
+ tokens: theme.hover,
56
+ fallbackTokens: theme.normal
57
+ })};
39
58
  }
40
59
 
41
60
  &:active${selectorSuffix} {
42
- ${css_utils.styleFromTokens(maps, theme.active, theme.normal)};
61
+ ${css_utils.styleFromTokens({
62
+ tokenMaps: maps,
63
+ tokens: theme.active,
64
+ fallbackTokens: theme.normal
65
+ })};
43
66
  }
44
67
  `;
45
68
  };
@@ -12,30 +12,53 @@ const getSwitchStatesStyle = (theme, maps, {
12
12
  withCursor,
13
13
  selectorSuffix = ""
14
14
  }) => {
15
- if (!theme) return null;
16
- if (disabled) return css`
15
+ if (!theme) {
16
+ return null;
17
+ }
18
+ if (disabled) {
19
+ return css`
17
20
  &&${selectorSuffix} {
18
- ${styleFromTokens(maps, theme.disabled)};
21
+ ${styleFromTokens({
22
+ tokenMaps: maps,
23
+ tokens: theme.disabled
24
+ })};
19
25
  ${withCursor && `cursor: not-allowed`};
20
26
  }
21
27
  `;
22
- if (readOnly) return css`
28
+ }
29
+ if (readOnly) {
30
+ return css`
23
31
  &${selectorSuffix}, &:hover${selectorSuffix}, &:active${selectorSuffix} {
24
- ${styleFromTokens(maps, theme.readonly)};
32
+ ${styleFromTokens({
33
+ tokenMaps: maps,
34
+ tokens: theme.readonly
35
+ })};
25
36
  ${withCursor && `cursor: default`};
26
37
  }
27
38
  `;
39
+ }
28
40
  return css`
29
41
  &${selectorSuffix} {
30
- ${styleFromTokens(maps, theme.normal)};
42
+ ${styleFromTokens({
43
+ tokenMaps: maps,
44
+ tokens: theme.normal
45
+ })};
31
46
  }
32
47
 
33
48
  &:hover${selectorSuffix} {
34
- ${styleFromTokens(maps, theme.hover, theme.normal)};
49
+ ${styleFromTokens({
50
+ tokenMaps: maps,
51
+ tokens: theme.hover,
52
+ fallbackTokens: theme.normal
53
+ })};
35
54
  }
36
55
 
37
56
  &:active${selectorSuffix} {
38
- ${styleFromTokens(maps, theme.active, theme.normal)};
57
+ ${styleFromTokens({
58
+ tokenMaps: maps,
59
+ tokens: theme.active,
60
+ fallbackTokens: theme.normal
61
+ })};
39
62
  }
40
63
  `;
41
64
  };
@@ -17,23 +17,42 @@ const Marker = _styled__default.default.div.withConfig({
17
17
  } = theme.tabMarker;
18
18
  return _styled.css`
19
19
  & {
20
- ${css_utils.styleFromTokens(markerMaps, states.normal)}
20
+ ${css_utils.styleFromTokens({
21
+ tokenMaps: markerMaps,
22
+ tokens: states.normal
23
+ })}
21
24
  }
22
25
 
23
26
  ${Compose_style.TabsTriggerCompose}:hover :where(&&) {
24
- ${css_utils.styleFromTokens(markerMaps, states.hover, states.normal)}
27
+ ${css_utils.styleFromTokens({
28
+ tokenMaps: markerMaps,
29
+ tokens: states.hover,
30
+ fallbackTokens: states.normal
31
+ })}
25
32
  }
26
33
 
27
34
  ${Compose_style.TabsTriggerCompose}:focus-visible :where(&&) {
28
- ${css_utils.styleFromTokens(markerMaps, states.focus, states.normal)}
35
+ ${css_utils.styleFromTokens({
36
+ tokenMaps: markerMaps,
37
+ tokens: states.focus,
38
+ fallbackTokens: states.normal
39
+ })}
29
40
  }
30
41
 
31
42
  ${Compose_style.TabsTriggerCompose}[data-state='active'] :where(&&) {
32
- ${css_utils.styleFromTokens(markerMaps, states.active, states.normal)}
43
+ ${css_utils.styleFromTokens({
44
+ tokenMaps: markerMaps,
45
+ tokens: states.active,
46
+ fallbackTokens: states.normal
47
+ })}
33
48
  }
34
49
 
35
50
  ${Compose_style.TabsTriggerCompose}[data-disabled] :where(&&) {
36
- ${css_utils.styleFromTokens(markerMaps, states.disabled, states.normal)}
51
+ ${css_utils.styleFromTokens({
52
+ tokenMaps: markerMaps,
53
+ tokens: states.disabled,
54
+ fallbackTokens: states.normal
55
+ })}
37
56
  }
38
57
  `;
39
58
  });
@@ -13,23 +13,42 @@ const Marker = _styled.div.withConfig({
13
13
  } = theme.tabMarker;
14
14
  return css`
15
15
  & {
16
- ${styleFromTokens(markerMaps, states.normal)}
16
+ ${styleFromTokens({
17
+ tokenMaps: markerMaps,
18
+ tokens: states.normal
19
+ })}
17
20
  }
18
21
 
19
22
  ${TabsTriggerCompose}:hover :where(&&) {
20
- ${styleFromTokens(markerMaps, states.hover, states.normal)}
23
+ ${styleFromTokens({
24
+ tokenMaps: markerMaps,
25
+ tokens: states.hover,
26
+ fallbackTokens: states.normal
27
+ })}
21
28
  }
22
29
 
23
30
  ${TabsTriggerCompose}:focus-visible :where(&&) {
24
- ${styleFromTokens(markerMaps, states.focus, states.normal)}
31
+ ${styleFromTokens({
32
+ tokenMaps: markerMaps,
33
+ tokens: states.focus,
34
+ fallbackTokens: states.normal
35
+ })}
25
36
  }
26
37
 
27
38
  ${TabsTriggerCompose}[data-state='active'] :where(&&) {
28
- ${styleFromTokens(markerMaps, states.active, states.normal)}
39
+ ${styleFromTokens({
40
+ tokenMaps: markerMaps,
41
+ tokens: states.active,
42
+ fallbackTokens: states.normal
43
+ })}
29
44
  }
30
45
 
31
46
  ${TabsTriggerCompose}[data-disabled] :where(&&) {
32
- ${styleFromTokens(markerMaps, states.disabled, states.normal)}
47
+ ${styleFromTokens({
48
+ tokenMaps: markerMaps,
49
+ tokens: states.disabled,
50
+ fallbackTokens: states.normal
51
+ })}
33
52
  }
34
53
  `;
35
54
  });
@@ -18,24 +18,43 @@ const TabsTriggerTab = _styled__default.default.div.withConfig({
18
18
  } = tabsTheme.tab;
19
19
  return _styled.css`
20
20
  & {
21
- ${css_utils.styleFromTokens(tabMaps, states.normal)}
21
+ ${css_utils.styleFromTokens({
22
+ tokenMaps: tabMaps,
23
+ tokens: states.normal
24
+ })}
22
25
  }
23
26
 
24
27
  ${Compose_style.TabsTriggerCompose}:hover :where(&&) {
25
- ${css_utils.styleFromTokens(tabMaps, states.hover, states.normal)}
28
+ ${css_utils.styleFromTokens({
29
+ tokenMaps: tabMaps,
30
+ tokens: states.hover,
31
+ fallbackTokens: states.normal
32
+ })}
26
33
  }
27
34
 
28
35
  ${Compose_style.TabsTriggerCompose}:focus-visible :where(&&) {
29
- ${css_utils.styleFromTokens(tabMaps, states.focus, states.normal)}
36
+ ${css_utils.styleFromTokens({
37
+ tokenMaps: tabMaps,
38
+ tokens: states.focus,
39
+ fallbackTokens: states.normal
40
+ })}
30
41
  ${redisUiStyles.getFocusStyleProperties("0")};
31
42
  }
32
43
 
33
44
  ${Compose_style.TabsTriggerCompose}[data-state='active'] :where(&&) {
34
- ${css_utils.styleFromTokens(tabMaps, states.active, states.normal)}
45
+ ${css_utils.styleFromTokens({
46
+ tokenMaps: tabMaps,
47
+ tokens: states.active,
48
+ fallbackTokens: states.normal
49
+ })}
35
50
  }
36
51
 
37
52
  ${Compose_style.TabsTriggerCompose}[data-disabled] :where(&&) {
38
- ${css_utils.styleFromTokens(tabMaps, states.disabled, states.normal)}
53
+ ${css_utils.styleFromTokens({
54
+ tokenMaps: tabMaps,
55
+ tokens: states.disabled,
56
+ fallbackTokens: states.normal
57
+ })}
39
58
  }
40
59
  `;
41
60
  });
@@ -14,24 +14,43 @@ const TabsTriggerTab = _styled.div.withConfig({
14
14
  } = tabsTheme.tab;
15
15
  return css`
16
16
  & {
17
- ${styleFromTokens(tabMaps, states.normal)}
17
+ ${styleFromTokens({
18
+ tokenMaps: tabMaps,
19
+ tokens: states.normal
20
+ })}
18
21
  }
19
22
 
20
23
  ${TabsTriggerCompose}:hover :where(&&) {
21
- ${styleFromTokens(tabMaps, states.hover, states.normal)}
24
+ ${styleFromTokens({
25
+ tokenMaps: tabMaps,
26
+ tokens: states.hover,
27
+ fallbackTokens: states.normal
28
+ })}
22
29
  }
23
30
 
24
31
  ${TabsTriggerCompose}:focus-visible :where(&&) {
25
- ${styleFromTokens(tabMaps, states.focus, states.normal)}
32
+ ${styleFromTokens({
33
+ tokenMaps: tabMaps,
34
+ tokens: states.focus,
35
+ fallbackTokens: states.normal
36
+ })}
26
37
  ${getFocusStyleProperties("0")};
27
38
  }
28
39
 
29
40
  ${TabsTriggerCompose}[data-state='active'] :where(&&) {
30
- ${styleFromTokens(tabMaps, states.active, states.normal)}
41
+ ${styleFromTokens({
42
+ tokenMaps: tabMaps,
43
+ tokens: states.active,
44
+ fallbackTokens: states.normal
45
+ })}
31
46
  }
32
47
 
33
48
  ${TabsTriggerCompose}[data-disabled] :where(&&) {
34
- ${styleFromTokens(tabMaps, states.disabled, states.normal)}
49
+ ${styleFromTokens({
50
+ tokenMaps: tabMaps,
51
+ tokens: states.disabled,
52
+ fallbackTokens: states.normal
53
+ })}
35
54
  }
36
55
  `;
37
56
  });
@@ -17,11 +17,15 @@ function useThemeModeSwitch({
17
17
  const timerRef = React.useRef();
18
18
  React.useEffect(() => () => clearTimeout(timerRef.current), []);
19
19
  const applyThemeMode = (newThemeMode) => {
20
- if (!newThemeMode) return;
20
+ if (!newThemeMode) {
21
+ return;
22
+ }
21
23
  clearTimeout(timerRef.current);
22
24
  setLocalThemeMode(newThemeMode);
23
25
  timerRef.current = setTimeout(() => {
24
- if (setUserThemeMode(newThemeMode)) onThemeModeChange == null ? void 0 : onThemeModeChange(newThemeMode);
26
+ if (setUserThemeMode(newThemeMode)) {
27
+ onThemeModeChange == null ? void 0 : onThemeModeChange(newThemeMode);
28
+ }
25
29
  }, switchTimeoutMs);
26
30
  };
27
31
  const toggleThemeMode = () => {
@@ -15,11 +15,15 @@ function useThemeModeSwitch({
15
15
  const timerRef = useRef();
16
16
  useEffect(() => () => clearTimeout(timerRef.current), []);
17
17
  const applyThemeMode = (newThemeMode) => {
18
- if (!newThemeMode) return;
18
+ if (!newThemeMode) {
19
+ return;
20
+ }
19
21
  clearTimeout(timerRef.current);
20
22
  setLocalThemeMode(newThemeMode);
21
23
  timerRef.current = setTimeout(() => {
22
- if (setUserThemeMode(newThemeMode)) onThemeModeChange == null ? void 0 : onThemeModeChange(newThemeMode);
24
+ if (setUserThemeMode(newThemeMode)) {
25
+ onThemeModeChange == null ? void 0 : onThemeModeChange(newThemeMode);
26
+ }
23
27
  }, switchTimeoutMs);
24
28
  };
25
29
  const toggleThemeMode = () => {
@@ -5,10 +5,14 @@ const React = require("react");
5
5
  const Toast = require("../Toast.cjs");
6
6
  const context = require("./context.cjs");
7
7
  const renderContent = (content) => {
8
- if (typeof content === "string" || !content) return jsxRuntime.jsxRuntimeExports.jsx(Toast.default, {
9
- message: content
10
- });
11
- if (React.isValidElement(content)) return content;
8
+ if (typeof content === "string" || !content) {
9
+ return jsxRuntime.jsxRuntimeExports.jsx(Toast.default, {
10
+ message: content
11
+ });
12
+ }
13
+ if (React.isValidElement(content)) {
14
+ return content;
15
+ }
12
16
  return jsxRuntime.jsxRuntimeExports.jsx(Toast.default, {
13
17
  ...content
14
18
  });
@@ -3,10 +3,14 @@ import { isValidElement } from "react";
3
3
  import Toast from "../Toast.js";
4
4
  import { ToastContextProvider } from "./context.js";
5
5
  const renderContent = (content) => {
6
- if (typeof content === "string" || !content) return jsxRuntimeExports.jsx(Toast, {
7
- message: content
8
- });
9
- if (isValidElement(content)) return content;
6
+ if (typeof content === "string" || !content) {
7
+ return jsxRuntimeExports.jsx(Toast, {
8
+ message: content
9
+ });
10
+ }
11
+ if (isValidElement(content)) {
12
+ return content;
13
+ }
10
14
  return jsxRuntimeExports.jsx(Toast, {
11
15
  ...content
12
16
  });
@@ -7,7 +7,9 @@ const Content = Object.assign(({
7
7
  content,
8
8
  ...composeProps
9
9
  }) => {
10
- if (!content) return null;
10
+ if (!content) {
11
+ return null;
12
+ }
11
13
  return jsxRuntime.jsxRuntimeExports.jsx(Content.Compose, {
12
14
  ...composeProps,
13
15
  children: typeof content === "string" ? jsxRuntime.jsxRuntimeExports.jsx(Content.Text, {
@@ -5,7 +5,9 @@ const Content = Object.assign(({
5
5
  content,
6
6
  ...composeProps
7
7
  }) => {
8
- if (!content) return null;
8
+ if (!content) {
9
+ return null;
10
+ }
9
11
  return jsxRuntimeExports.jsx(Content.Compose, {
10
12
  ...composeProps,
11
13
  children: typeof content === "string" ? jsxRuntimeExports.jsx(Content.Text, {
@@ -24,7 +24,9 @@ const TreeView = Object.assign(({
24
24
  }
25
25
  }, [searchValue]);
26
26
  const renderNodes = (treeNodes) => {
27
- if (!treeNodes) return null;
27
+ if (!treeNodes) {
28
+ return null;
29
+ }
28
30
  return Object.keys(treeNodes).map((key) => {
29
31
  return jsxRuntime.jsxRuntimeExports.jsx(TreeView.Item, {
30
32
  ...treeNodes[key],
@@ -22,7 +22,9 @@ const TreeView = Object.assign(({
22
22
  }
23
23
  }, [searchValue]);
24
24
  const renderNodes = (treeNodes) => {
25
- if (!treeNodes) return null;
25
+ if (!treeNodes) {
26
+ return null;
27
+ }
26
28
  return Object.keys(treeNodes).map((key) => {
27
29
  return jsxRuntimeExports.jsx(TreeView.Item, {
28
30
  ...treeNodes[key],
@@ -27,10 +27,12 @@ const TreeItemCompose = ({
27
27
  setDescendants
28
28
  }), [isExpanded, checked, treeItemContext == null ? void 0 : treeItemContext.checked, descendants]);
29
29
  React.useEffect(() => {
30
- if (treeItemContext && generatedId) treeItemContext.setDescendants((prevDescendants) => ({
31
- ...prevDescendants,
32
- [generatedId]: checked
33
- }));
30
+ if (treeItemContext && generatedId) {
31
+ treeItemContext.setDescendants((prevDescendants) => ({
32
+ ...prevDescendants,
33
+ [generatedId]: checked
34
+ }));
35
+ }
34
36
  }, [generatedId, checked]);
35
37
  return jsxRuntime.jsxRuntimeExports.jsx(TreeItem_context.TreeItemContext.Provider, {
36
38
  value: contextValue,
@@ -23,10 +23,12 @@ const TreeItemCompose = ({
23
23
  setDescendants
24
24
  }), [isExpanded, checked, treeItemContext == null ? void 0 : treeItemContext.checked, descendants]);
25
25
  useEffect(() => {
26
- if (treeItemContext && generatedId) treeItemContext.setDescendants((prevDescendants) => ({
27
- ...prevDescendants,
28
- [generatedId]: checked
29
- }));
26
+ if (treeItemContext && generatedId) {
27
+ treeItemContext.setDescendants((prevDescendants) => ({
28
+ ...prevDescendants,
29
+ [generatedId]: checked
30
+ }));
31
+ }
30
32
  }, [generatedId, checked]);
31
33
  return jsxRuntimeExports.jsx(TreeItemContext.Provider, {
32
34
  value: contextValue,
@@ -0,0 +1,4 @@
1
+ "use strict";
2
+ Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
3
+ const typographyColors = ["primary", "secondary", "notice", "success", "attention", "danger", "upsell", "informative"];
4
+ exports.typographyColors = typographyColors;
@@ -1 +1,2 @@
1
- export type TypographyColor = 'primary' | 'secondary';
1
+ export declare const typographyColors: readonly ["primary", "secondary", "notice", "success", "attention", "danger", "upsell", "informative"];
2
+ export type TypographyColor = (typeof typographyColors)[number];
@@ -0,0 +1,4 @@
1
+ const typographyColors = ["primary", "secondary", "notice", "success", "attention", "danger", "upsell", "informative"];
2
+ export {
3
+ typographyColors
4
+ };
package/dist/index.cjs CHANGED
@@ -1095,6 +1095,7 @@ const Badge_style = require("./Badge/Badge.style.cjs");
1095
1095
  const Badge_types = require("./Badge/Badge.types.cjs");
1096
1096
  const Banner = require("./Banner/Banner.cjs");
1097
1097
  const Banner_types = require("./Banner/Banner.types.cjs");
1098
+ const Breadcrumbs = require("./Breadcrumbs/Breadcrumbs.cjs");
1098
1099
  const BoxSelectionGroup = require("./BoxSelectionGroup/BoxSelectionGroup.cjs");
1099
1100
  const MultiBoxSelectionGroup = require("./BoxSelectionGroup/MultiBoxSelectionGroup.cjs");
1100
1101
  const Button = require("./Button/Button.cjs");
@@ -1107,6 +1108,7 @@ const ActionIconButton = require("./Button/ActionIconButton/ActionIconButton.cjs
1107
1108
  const ActionIconButton_style = require("./Button/ActionIconButton/ActionIconButton.style.cjs");
1108
1109
  const ToggleButton = require("./Button/ToggleButton/ToggleButton.cjs");
1109
1110
  const ToggleButton_style = require("./Button/ToggleButton/ToggleButton.style.cjs");
1111
+ const CopyToClipboardButton = require("./Button/CopyToClipboardButton/CopyToClipboardButton.cjs");
1110
1112
  const Button_types = require("./Button/Button.types.cjs");
1111
1113
  const TextButton_types = require("./Button/TextButton/TextButton.types.cjs");
1112
1114
  const IconButton_types = require("./Button/IconButton/IconButton.types.cjs");
@@ -1189,6 +1191,7 @@ const TooltipCard = require("./Tooltip/components/TooltipCard/TooltipCard.cjs");
1189
1191
  const TreeView = require("./TreeView/TreeView.cjs");
1190
1192
  const Typography = require("./Typography/Typography.cjs");
1191
1193
  const useEllipsisTooltip = require("./Typography/hooks/useEllipsisTooltip.cjs");
1194
+ const Typography_types = require("./Typography/Typography.types.cjs");
1192
1195
  const ProgressBar = require("./ProgressBar/ProgressBar.cjs");
1193
1196
  const ProfileIcon = require("./ProfileIcon/ProfileIcon.cjs");
1194
1197
  const ProfileIcon_style = require("./ProfileIcon/ProfileIcon.style.cjs");
@@ -1202,6 +1205,7 @@ exports.BadgeStyles = Badge_style;
1202
1205
  exports.badgeVariants = Badge_types.badgeVariants;
1203
1206
  exports.Banner = Banner.default;
1204
1207
  exports.bannerVariants = Banner_types.bannerVariants;
1208
+ exports.Breadcrumbs = Breadcrumbs.default;
1205
1209
  exports.BoxSelectionGroup = BoxSelectionGroup.default;
1206
1210
  exports.MultiBoxSelectionGroup = MultiBoxSelectionGroup.default;
1207
1211
  exports.Button = Button.default;
@@ -1214,6 +1218,7 @@ exports.ActionIconButton = ActionIconButton.default;
1214
1218
  exports.ActionButtonWithIconStyles = ActionIconButton_style;
1215
1219
  exports.ToggleButton = ToggleButton.default;
1216
1220
  exports.ToggleButtonStyles = ToggleButton_style;
1221
+ exports.CopyToClipboardButton = CopyToClipboardButton.default;
1217
1222
  exports.buttonSizes = Button_types.buttonSizes;
1218
1223
  exports.buttonVariants = Button_types.buttonVariants;
1219
1224
  exports.textButtonVariants = TextButton_types.textButtonVariants;
@@ -1326,6 +1331,7 @@ exports.TooltipCard = TooltipCard.default;
1326
1331
  exports.TreeView = TreeView.default;
1327
1332
  exports.Typography = Typography.default;
1328
1333
  exports.useEllipsisTooltip = useEllipsisTooltip.useEllipsisTooltip;
1334
+ exports.typographyColors = Typography_types.typographyColors;
1329
1335
  exports.ProgressBar = ProgressBar.ProgressBar;
1330
1336
  exports.ProfileIcon = ProfileIcon.default;
1331
1337
  exports.ProfileIconStyles = ProfileIcon_style;