@lumx/react 3.20.1-alpha.29 → 3.20.1-alpha.30

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 (183) hide show
  1. package/_internal/Button-4b67daa8.js +98 -0
  2. package/_internal/Button-4b67daa8.js.map +1 -0
  3. package/_internal/ButtonRoot-a70baf82.js +118 -0
  4. package/_internal/ButtonRoot-a70baf82.js.map +1 -0
  5. package/_internal/Chip-70af04b4.js +144 -0
  6. package/_internal/Chip-70af04b4.js.map +1 -0
  7. package/_internal/ClickAwayProvider-1204f237.js +95 -0
  8. package/_internal/ClickAwayProvider-1204f237.js.map +1 -0
  9. package/_internal/DisabledStateContext-ea04260d.js +29 -0
  10. package/_internal/DisabledStateContext-ea04260d.js.map +1 -0
  11. package/_internal/HeadingLevelProvider-ebdcb0c7.js +61 -0
  12. package/_internal/HeadingLevelProvider-ebdcb0c7.js.map +1 -0
  13. package/_internal/IconButton-8d61f5be.js +77 -0
  14. package/_internal/IconButton-8d61f5be.js.map +1 -0
  15. package/_internal/ImageCaption-db44ec9e.js +75 -0
  16. package/_internal/ImageCaption-db44ec9e.js.map +1 -0
  17. package/_internal/List-c75646f2.js +818 -0
  18. package/_internal/List-c75646f2.js.map +1 -0
  19. package/_internal/PopoverDialog-35b2d87d.js +657 -0
  20. package/_internal/PopoverDialog-35b2d87d.js.map +1 -0
  21. package/_internal/Portal-3f86608e.js +45 -0
  22. package/_internal/Portal-3f86608e.js.map +1 -0
  23. package/_internal/RawClickable-2c2b6a89.js +52 -0
  24. package/_internal/RawClickable-2c2b6a89.js.map +1 -0
  25. package/_internal/Slides-ce641b5f.js +679 -0
  26. package/_internal/Slides-ce641b5f.js.map +1 -0
  27. package/_internal/ThemeContext-3181f000.js +14 -0
  28. package/_internal/ThemeContext-3181f000.js.map +1 -0
  29. package/_internal/Thumbnail-02bd6869.js +314 -0
  30. package/_internal/Thumbnail-02bd6869.js.map +1 -0
  31. package/_internal/components/alert-dialog-a24330ed.js +166 -0
  32. package/_internal/components/alert-dialog-a24330ed.js.map +1 -0
  33. package/_internal/components/autocomplete-70749e51.js +262 -0
  34. package/_internal/components/autocomplete-70749e51.js.map +1 -0
  35. package/_internal/components/avatar-ed9f4869.js +84 -0
  36. package/_internal/components/avatar-ed9f4869.js.map +1 -0
  37. package/_internal/components/badge-ccf47147.js +82 -0
  38. package/_internal/components/badge-ccf47147.js.map +1 -0
  39. package/_internal/components/button-9f710830.js +48 -0
  40. package/_internal/components/button-9f710830.js.map +1 -0
  41. package/_internal/components/checkbox-8ab51ef9.js +142 -0
  42. package/_internal/components/checkbox-8ab51ef9.js.map +1 -0
  43. package/_internal/components/chip-19e40755.js +103 -0
  44. package/_internal/components/chip-19e40755.js.map +1 -0
  45. package/_internal/components/comment-block-bb6a0603.js +139 -0
  46. package/_internal/components/comment-block-bb6a0603.js.map +1 -0
  47. package/_internal/components/date-picker-e4209b01.js +2 -0
  48. package/_internal/components/date-picker-e4209b01.js.map +1 -0
  49. package/_internal/components/dialog-30336ccb.js +239 -0
  50. package/_internal/components/dialog-30336ccb.js.map +1 -0
  51. package/_internal/components/divider-0e93aa3d.js +51 -0
  52. package/_internal/components/divider-0e93aa3d.js.map +1 -0
  53. package/_internal/components/drag-handle-ba2e7e67.js +52 -0
  54. package/_internal/components/drag-handle-ba2e7e67.js.map +1 -0
  55. package/_internal/components/dropdown-d18122d7.js +148 -0
  56. package/_internal/components/dropdown-d18122d7.js.map +1 -0
  57. package/_internal/components/expansion-panel-0b263437.js +169 -0
  58. package/_internal/components/expansion-panel-0b263437.js.map +1 -0
  59. package/_internal/components/flag-8f9a498a.js +60 -0
  60. package/_internal/components/flag-8f9a498a.js.map +1 -0
  61. package/_internal/components/flex-box-15be92f6.js +57 -0
  62. package/_internal/components/flex-box-15be92f6.js.map +1 -0
  63. package/_internal/components/generic-block-5d843f1e.js +128 -0
  64. package/_internal/components/generic-block-5d843f1e.js.map +1 -0
  65. package/_internal/components/grid-8c08dc4b.js +105 -0
  66. package/_internal/components/grid-8c08dc4b.js.map +1 -0
  67. package/_internal/components/grid-column-85e305e7.js +59 -0
  68. package/_internal/components/grid-column-85e305e7.js.map +1 -0
  69. package/_internal/components/heading-7bfafd7d.js +54 -0
  70. package/_internal/components/heading-7bfafd7d.js.map +1 -0
  71. package/_internal/components/icon-ee15673b.js +103 -0
  72. package/_internal/components/icon-ee15673b.js.map +1 -0
  73. package/_internal/components/image-block-3479abda.js +111 -0
  74. package/_internal/components/image-block-3479abda.js.map +1 -0
  75. package/_internal/components/image-lightbox-1d7ca133.js +758 -0
  76. package/_internal/components/image-lightbox-1d7ca133.js.map +1 -0
  77. package/_internal/components/inline-list-5ba8bb0f.js +75 -0
  78. package/_internal/components/inline-list-5ba8bb0f.js.map +1 -0
  79. package/_internal/components/input-helper-2e4e49fd.js +72 -0
  80. package/_internal/components/input-helper-2e4e49fd.js.map +1 -0
  81. package/_internal/components/input-label-30d199c3.js +60 -0
  82. package/_internal/components/input-label-30d199c3.js.map +1 -0
  83. package/_internal/components/lightbox-c5f9afd0.js +156 -0
  84. package/_internal/components/lightbox-c5f9afd0.js.map +1 -0
  85. package/_internal/components/link-43ee103e.js +73 -0
  86. package/_internal/components/link-43ee103e.js.map +1 -0
  87. package/_internal/components/link-preview-db0ee2d6.js +118 -0
  88. package/_internal/components/link-preview-db0ee2d6.js.map +1 -0
  89. package/_internal/components/list-2f256244.js +72 -0
  90. package/_internal/components/list-2f256244.js.map +1 -0
  91. package/_internal/components/message-f7674e0e.js +101 -0
  92. package/_internal/components/message-f7674e0e.js.map +1 -0
  93. package/_internal/components/mosaic-3effd0cf.js +95 -0
  94. package/_internal/components/mosaic-3effd0cf.js.map +1 -0
  95. package/_internal/components/navigation-3a5dc270.js +227 -0
  96. package/_internal/components/navigation-3a5dc270.js.map +1 -0
  97. package/_internal/components/notification-098c5600.js +146 -0
  98. package/_internal/components/notification-098c5600.js.map +1 -0
  99. package/_internal/components/popover-dfcddda4.js +3 -0
  100. package/_internal/components/popover-dfcddda4.js.map +1 -0
  101. package/_internal/components/post-block-69797e4d.js +110 -0
  102. package/_internal/components/post-block-69797e4d.js.map +1 -0
  103. package/_internal/components/progress-44bb0301.js +183 -0
  104. package/_internal/components/progress-44bb0301.js.map +1 -0
  105. package/_internal/components/progress-tracker-e0981fcc.js +309 -0
  106. package/_internal/components/progress-tracker-e0981fcc.js.map +1 -0
  107. package/_internal/components/radio-button-929c7bee.js +150 -0
  108. package/_internal/components/radio-button-929c7bee.js.map +1 -0
  109. package/_internal/components/select-64bc72a0.js +458 -0
  110. package/_internal/components/select-64bc72a0.js.map +1 -0
  111. package/_internal/components/side-navigation-c610c689.js +166 -0
  112. package/_internal/components/side-navigation-c610c689.js.map +1 -0
  113. package/_internal/components/skeleton-1ea8c82a.js +167 -0
  114. package/_internal/components/skeleton-1ea8c82a.js.map +1 -0
  115. package/_internal/components/slider-78cfaa67.js +312 -0
  116. package/_internal/components/slider-78cfaa67.js.map +1 -0
  117. package/_internal/components/slideshow-d8a943a7.js +151 -0
  118. package/_internal/components/slideshow-d8a943a7.js.map +1 -0
  119. package/_internal/components/switch-25b65051.js +122 -0
  120. package/_internal/components/switch-25b65051.js.map +1 -0
  121. package/_internal/components/table-ec20c66c.js +296 -0
  122. package/_internal/components/table-ec20c66c.js.map +1 -0
  123. package/_internal/components/tabs-89c055bd.js +299 -0
  124. package/_internal/components/tabs-89c055bd.js.map +1 -0
  125. package/_internal/components/text-d04d0f1b.js +2 -0
  126. package/_internal/components/text-d04d0f1b.js.map +1 -0
  127. package/_internal/components/text-field-8f13957e.js +361 -0
  128. package/_internal/components/text-field-8f13957e.js.map +1 -0
  129. package/_internal/components/thumbnail-1255957f.js +42 -0
  130. package/_internal/components/thumbnail-1255957f.js.map +1 -0
  131. package/_internal/components/toolbar-e7c984e6.js +62 -0
  132. package/_internal/components/toolbar-e7c984e6.js.map +1 -0
  133. package/_internal/components/tooltip-dcb43bbe.js +328 -0
  134. package/_internal/components/tooltip-dcb43bbe.js.map +1 -0
  135. package/_internal/components/uploader-7ef4db39.js +154 -0
  136. package/_internal/components/uploader-7ef4db39.js.map +1 -0
  137. package/_internal/components/user-block-24d97650.js +145 -0
  138. package/_internal/components/user-block-24d97650.js.map +1 -0
  139. package/_internal/constants-43721918.js +2170 -0
  140. package/_internal/constants-43721918.js.map +1 -0
  141. package/_internal/constants-d0e3f49e.js +24 -0
  142. package/_internal/constants-d0e3f49e.js.map +1 -0
  143. package/_internal/context-9d1336a1.js +19 -0
  144. package/_internal/context-9d1336a1.js.map +1 -0
  145. package/_internal/forwardRef-8bce732e.js +9 -0
  146. package/_internal/forwardRef-8bce732e.js.map +1 -0
  147. package/_internal/getFocusableElements-230173a8.js +13 -0
  148. package/_internal/getFocusableElements-230173a8.js.map +1 -0
  149. package/_internal/index-25c9e8c2.js +118 -0
  150. package/_internal/index-25c9e8c2.js.map +1 -0
  151. package/_internal/index-25d2a45e.js +437 -0
  152. package/_internal/index-25d2a45e.js.map +1 -0
  153. package/_internal/isComponent-b9762ff1.js +18 -0
  154. package/_internal/isComponent-b9762ff1.js.map +1 -0
  155. package/_internal/isComponentType-e806b848.js +9 -0
  156. package/_internal/isComponentType-e806b848.js.map +1 -0
  157. package/_internal/mergeRefs-f0d7d6ea.js +30 -0
  158. package/_internal/mergeRefs-f0d7d6ea.js.map +1 -0
  159. package/_internal/state-db358714.js +130 -0
  160. package/_internal/state-db358714.js.map +1 -0
  161. package/_internal/useBooleanState-2a3d237c.js +12 -0
  162. package/_internal/useBooleanState-2a3d237c.js.map +1 -0
  163. package/_internal/useCallbackOnEscape-b956a85d.js +64 -0
  164. package/_internal/useCallbackOnEscape-b956a85d.js.map +1 -0
  165. package/_internal/useDisableBodyScroll-36bd7352.js +219 -0
  166. package/_internal/useDisableBodyScroll-36bd7352.js.map +1 -0
  167. package/_internal/useDisableStateProps-69e16b7c.js +36 -0
  168. package/_internal/useDisableStateProps-69e16b7c.js.map +1 -0
  169. package/_internal/useFocusTrap-2dbae79e.js +112 -0
  170. package/_internal/useFocusTrap-2dbae79e.js.map +1 -0
  171. package/_internal/useId-3a1facc0.js +18 -0
  172. package/_internal/useId-3a1facc0.js.map +1 -0
  173. package/_internal/useRovingTabIndex-7daf0f24.js +77 -0
  174. package/_internal/useRovingTabIndex-7daf0f24.js.map +1 -0
  175. package/_internal/useTransitionVisibility-321fdbfa.js +50 -0
  176. package/_internal/useTransitionVisibility-321fdbfa.js.map +1 -0
  177. package/_internal/wrapChildrenIconWithSpaces-50d705e6.js +20 -0
  178. package/_internal/wrapChildrenIconWithSpaces-50d705e6.js.map +1 -0
  179. package/index.js +63 -14033
  180. package/index.js.map +1 -1
  181. package/package.json +3 -3
  182. package/utils/index.js +3 -158
  183. package/utils/index.js.map +1 -1
@@ -0,0 +1 @@
1
+ {"version":3,"file":"switch-25b65051.js","sources":["../../../src/components/switch/Switch.tsx"],"sourcesContent":["import { Children, InputHTMLAttributes, SyntheticEvent } from 'react';\n\nimport classNames from 'classnames';\n\nimport { Alignment, InputHelper, InputLabel, Theme } from '@lumx/react';\nimport { GenericProps, HasTheme } from '@lumx/react/utils/type';\nimport { getRootClassName, handleBasicClasses } from '@lumx/core/js/utils/className';\nimport { useId } from '@lumx/react/hooks/useId';\nimport { useTheme } from '@lumx/react/utils/theme/ThemeContext';\nimport { forwardRef } from '@lumx/react/utils/react/forwardRef';\nimport { useDisableStateProps } from '@lumx/react/utils/disabled/useDisableStateProps';\nimport { HasAriaDisabled } from '@lumx/react/utils/type/HasAriaDisabled';\n\n/**\n * Defines the props of the component.\n */\nexport interface SwitchProps extends GenericProps, HasTheme, HasAriaDisabled {\n /** Helper text. */\n helper?: string;\n /** Whether it is checked or not. */\n isChecked?: boolean;\n /** Whether the component is disabled or not. */\n isDisabled?: boolean;\n /** Native input name property. */\n name?: string;\n /** Position of the switch relative to the label. */\n position?: Extract<Alignment, 'right' | 'left'>;\n /** Native input value property. */\n value?: string;\n /** On change callback. */\n onChange?(isChecked: boolean, value?: string, name?: string, event?: SyntheticEvent): void;\n /** optional props for input */\n inputProps?: InputHTMLAttributes<HTMLInputElement>;\n /** Children */\n children?: React.ReactNode;\n}\n\n/**\n * Component display name.\n */\nconst COMPONENT_NAME = 'Switch';\n\n/**\n * Component default class name and class prefix.\n */\nconst CLASSNAME = getRootClassName(COMPONENT_NAME);\n\n/**\n * Component default props.\n */\nconst DEFAULT_PROPS: Partial<SwitchProps> = {\n position: Alignment.left,\n};\n\n/**\n * Switch component.\n *\n * @param props Component props.\n * @param ref Component ref.\n * @return React element.\n */\nexport const Switch = forwardRef<SwitchProps, HTMLDivElement>((props, ref) => {\n const { isAnyDisabled, disabledStateProps, otherProps } = useDisableStateProps(props);\n const defaultTheme = useTheme() || Theme.light;\n const {\n checked,\n children,\n className,\n helper,\n id,\n isChecked = checked,\n name,\n onChange,\n position = DEFAULT_PROPS.position,\n theme = defaultTheme,\n value,\n inputProps = {},\n ...forwardedProps\n } = otherProps;\n const generatedInputId = useId();\n const inputId = id || generatedInputId;\n const handleChange = (event: React.ChangeEvent<HTMLInputElement>) => {\n if (onChange) {\n onChange(!isChecked, value, name, event);\n }\n };\n\n return (\n <div\n ref={ref}\n {...forwardedProps}\n className={classNames(\n className,\n handleBasicClasses({\n prefix: CLASSNAME,\n isChecked,\n isDisabled: isAnyDisabled,\n position,\n theme,\n isUnchecked: !isChecked,\n }),\n )}\n >\n <div className={`${CLASSNAME}__input-wrapper`}>\n <input\n type=\"checkbox\"\n role=\"switch\"\n id={inputId}\n className={`${CLASSNAME}__input-native`}\n name={name}\n value={value}\n {...disabledStateProps}\n readOnly={inputProps.readOnly || isAnyDisabled}\n checked={isChecked}\n aria-checked={Boolean(isChecked)}\n onChange={handleChange}\n aria-describedby={helper ? `${inputId}-helper` : undefined}\n {...inputProps}\n />\n\n <div className={`${CLASSNAME}__input-placeholder`}>\n <div className={`${CLASSNAME}__input-background`} />\n <div className={`${CLASSNAME}__input-indicator`} />\n </div>\n </div>\n\n {Children.count(children) > 0 && (\n <div className={`${CLASSNAME}__content`}>\n <InputLabel htmlFor={inputId} theme={theme} className={`${CLASSNAME}__label`}>\n {children}\n </InputLabel>\n {helper && (\n <InputHelper id={`${inputId}-helper`} theme={theme} className={`${CLASSNAME}__helper`}>\n {helper}\n </InputHelper>\n )}\n </div>\n )}\n </div>\n );\n});\nSwitch.displayName = COMPONENT_NAME;\nSwitch.className = CLASSNAME;\nSwitch.defaultProps = DEFAULT_PROPS;\n"],"names":["COMPONENT_NAME","CLASSNAME","getRootClassName","DEFAULT_PROPS","position","Alignment","left","Switch","forwardRef","props","ref","isAnyDisabled","disabledStateProps","otherProps","useDisableStateProps","defaultTheme","useTheme","Theme","light","checked","children","className","helper","id","isChecked","name","onChange","theme","value","inputProps","forwardedProps","generatedInputId","useId","inputId","handleChange","event","_jsxs","classNames","handleBasicClasses","prefix","isDisabled","isUnchecked","_jsx","type","role","readOnly","Boolean","undefined","Children","count","InputLabel","htmlFor","InputHelper","displayName","defaultProps"],"mappings":"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"}
@@ -0,0 +1,296 @@
1
+ import classNames from 'classnames';
2
+ import { getRootClassName, handleBasicClasses } from '@lumx/core/js/utils/className';
3
+ import { u as useTheme } from '../ThemeContext-3181f000.js';
4
+ import { f as forwardRef } from '../forwardRef-8bce732e.js';
5
+ import { jsx, jsxs, Fragment } from 'react/jsx-runtime';
6
+ import { Theme, Size } from '@lumx/core/js/constants';
7
+ import { mdiArrowDown } from '@lumx/icons/esm/arrow-down';
8
+ import { mdiArrowUp } from '@lumx/icons/esm/arrow-up';
9
+ import { Icon } from './icon-ee15673b.js';
10
+ import { u as useDisableStateProps } from '../useDisableStateProps-69e16b7c.js';
11
+
12
+ /**
13
+ * Component display name.
14
+ */
15
+ const COMPONENT_NAME$4 = 'Table';
16
+
17
+ /**
18
+ * Component default class name and class prefix.
19
+ */
20
+ const CLASSNAME$4 = getRootClassName(COMPONENT_NAME$4);
21
+
22
+ /**
23
+ * Component default props.
24
+ */
25
+ const DEFAULT_PROPS$3 = {};
26
+
27
+ /**
28
+ * Table component.
29
+ *
30
+ * @param props Component props.
31
+ * @param ref Component ref.
32
+ * @return React element.
33
+ */
34
+ const Table = forwardRef((props, ref) => {
35
+ const defaultTheme = useTheme() || Theme.light;
36
+ const {
37
+ children,
38
+ className,
39
+ hasBefore,
40
+ hasDividers,
41
+ theme = defaultTheme,
42
+ ...forwardedProps
43
+ } = props;
44
+ return /*#__PURE__*/jsx("table", {
45
+ ref: ref,
46
+ ...forwardedProps,
47
+ className: classNames(className, handleBasicClasses({
48
+ prefix: CLASSNAME$4,
49
+ hasBefore,
50
+ hasDividers,
51
+ theme
52
+ })),
53
+ children: children
54
+ });
55
+ });
56
+ Table.displayName = COMPONENT_NAME$4;
57
+ Table.className = CLASSNAME$4;
58
+ Table.defaultProps = DEFAULT_PROPS$3;
59
+
60
+ /**
61
+ * Component display name.
62
+ */
63
+ const COMPONENT_NAME$3 = 'TableBody';
64
+
65
+ /**
66
+ * Component default class name and class prefix.
67
+ */
68
+ const CLASSNAME$3 = getRootClassName(COMPONENT_NAME$3, true);
69
+
70
+ /**
71
+ * TableBody component.
72
+ *
73
+ * @param props Component props.
74
+ * @param ref Component ref.
75
+ * @return React element.
76
+ */
77
+ const TableBody = forwardRef((props, ref) => {
78
+ const {
79
+ children,
80
+ className,
81
+ ...forwardedProps
82
+ } = props;
83
+ return /*#__PURE__*/jsx("tbody", {
84
+ ref: ref,
85
+ ...forwardedProps,
86
+ className: classNames(className, CLASSNAME$3),
87
+ children: children
88
+ });
89
+ });
90
+ TableBody.displayName = COMPONENT_NAME$3;
91
+ TableBody.className = CLASSNAME$3;
92
+
93
+ const ThOrder = {
94
+ asc: 'asc',
95
+ desc: 'desc'
96
+ };
97
+ /**
98
+ * Table cell variants.
99
+ */
100
+ const TableCellVariant = {
101
+ body: 'body',
102
+ head: 'head'
103
+ };
104
+
105
+ /**
106
+ * Defines the props of the component.
107
+ */
108
+
109
+ /**
110
+ * Component display name.
111
+ */
112
+ const COMPONENT_NAME$2 = 'TableCell';
113
+
114
+ /**
115
+ * Component default class name and class prefix.
116
+ */
117
+ const CLASSNAME$2 = getRootClassName(COMPONENT_NAME$2, true);
118
+
119
+ /**
120
+ * Component default props.
121
+ */
122
+ const DEFAULT_PROPS$2 = {
123
+ variant: TableCellVariant.body
124
+ };
125
+
126
+ /**
127
+ * TableCell component.
128
+ *
129
+ * @param props Component props.
130
+ * @param ref Component ref.
131
+ * @return React element.
132
+ */
133
+ const TableCell = forwardRef((props, ref) => {
134
+ const {
135
+ children,
136
+ className,
137
+ icon,
138
+ isSortable,
139
+ onHeaderClick,
140
+ sortOrder,
141
+ variant = DEFAULT_PROPS$2.variant,
142
+ ...forwardedProps
143
+ } = props;
144
+
145
+ // Use button if clickable
146
+ const Wrapper = onHeaderClick ? 'button' : 'div';
147
+ const wrapperProps = Wrapper === 'button' ? {
148
+ type: 'button',
149
+ onClick: onHeaderClick
150
+ } : undefined;
151
+
152
+ // ARIA sort
153
+ let ariaSort;
154
+ if (isSortable) {
155
+ ariaSort = 'none';
156
+ if (sortOrder === ThOrder.asc) ariaSort = 'ascending';
157
+ if (sortOrder === ThOrder.desc) ariaSort = 'descending';
158
+ }
159
+ return /*#__PURE__*/jsxs(Fragment, {
160
+ children: [variant === TableCellVariant.head && /*#__PURE__*/jsx("th", {
161
+ ref: ref,
162
+ ...forwardedProps,
163
+ className: classNames(handleBasicClasses({
164
+ prefix: CLASSNAME$2,
165
+ isSortable,
166
+ isSorted: isSortable && !!sortOrder
167
+ }), className, `${CLASSNAME$2}--head`),
168
+ "aria-sort": ariaSort,
169
+ children: /*#__PURE__*/jsxs(Wrapper, {
170
+ className: `${CLASSNAME$2}-wrapper`,
171
+ ...wrapperProps,
172
+ children: [icon && !isSortable && /*#__PURE__*/jsx(Icon, {
173
+ className: `${CLASSNAME$2}-icon`,
174
+ icon: icon,
175
+ size: Size.xxs
176
+ }), isSortable && sortOrder === ThOrder.asc && /*#__PURE__*/jsx(Icon, {
177
+ className: `${CLASSNAME$2}-icon`,
178
+ icon: mdiArrowUp,
179
+ size: Size.xxs
180
+ }), isSortable && sortOrder === ThOrder.desc && /*#__PURE__*/jsx(Icon, {
181
+ className: `${CLASSNAME$2}-icon`,
182
+ icon: mdiArrowDown,
183
+ size: Size.xxs
184
+ }), /*#__PURE__*/jsx("div", {
185
+ className: `${CLASSNAME$2}-content`,
186
+ children: children
187
+ })]
188
+ })
189
+ }), variant === TableCellVariant.body && /*#__PURE__*/jsx("td", {
190
+ ...forwardedProps,
191
+ className: classNames(className, CLASSNAME$2, `${CLASSNAME$2}--body`),
192
+ children: /*#__PURE__*/jsx("div", {
193
+ className: `${CLASSNAME$2}-content`,
194
+ children: children
195
+ })
196
+ })]
197
+ });
198
+ });
199
+ TableCell.displayName = COMPONENT_NAME$2;
200
+ TableCell.className = CLASSNAME$2;
201
+ TableCell.defaultProps = DEFAULT_PROPS$2;
202
+
203
+ /**
204
+ * Component display name.
205
+ */
206
+ const COMPONENT_NAME$1 = 'TableHeader';
207
+
208
+ /**
209
+ * Component default class name and class prefix.
210
+ */
211
+ const CLASSNAME$1 = getRootClassName(COMPONENT_NAME$1, true);
212
+
213
+ /**
214
+ * Component default props.
215
+ */
216
+ const DEFAULT_PROPS$1 = {};
217
+
218
+ /**
219
+ * TableHeader component.
220
+ *
221
+ * @param props Component props.
222
+ * @param ref Component ref.
223
+ * @return React element.
224
+ */
225
+ const TableHeader = forwardRef((props, ref) => {
226
+ const {
227
+ children,
228
+ className,
229
+ ...forwardedProps
230
+ } = props;
231
+ return /*#__PURE__*/jsx("thead", {
232
+ ref: ref,
233
+ ...forwardedProps,
234
+ className: classNames(className, CLASSNAME$1),
235
+ children: children
236
+ });
237
+ });
238
+ TableHeader.displayName = COMPONENT_NAME$1;
239
+ TableHeader.className = CLASSNAME$1;
240
+ TableHeader.defaultProps = DEFAULT_PROPS$1;
241
+
242
+ /**
243
+ * Component display name.
244
+ */
245
+ const COMPONENT_NAME = 'TableRow';
246
+
247
+ /**
248
+ * Component default class name and class prefix.
249
+ */
250
+ const CLASSNAME = getRootClassName(COMPONENT_NAME, true);
251
+
252
+ /**
253
+ * Component default props.
254
+ */
255
+ const DEFAULT_PROPS = {};
256
+
257
+ /**
258
+ * TableRow component.
259
+ *
260
+ * @param props Component props.
261
+ * @param ref Component ref.
262
+ * @return React element.
263
+ */
264
+ const TableRow = forwardRef((props, ref) => {
265
+ const {
266
+ isAnyDisabled,
267
+ disabledStateProps,
268
+ otherProps
269
+ } = useDisableStateProps(props);
270
+ const {
271
+ children,
272
+ className,
273
+ isClickable,
274
+ isSelected,
275
+ ...forwardedProps
276
+ } = otherProps;
277
+ return /*#__PURE__*/jsx("tr", {
278
+ ref: ref,
279
+ tabIndex: isClickable && !disabledStateProps.disabled ? 0 : -1,
280
+ ...forwardedProps,
281
+ className: classNames(className, handleBasicClasses({
282
+ isClickable: isClickable && !isAnyDisabled,
283
+ isDisabled: isAnyDisabled,
284
+ isSelected: isSelected && !isAnyDisabled,
285
+ prefix: CLASSNAME
286
+ })),
287
+ "aria-disabled": isAnyDisabled,
288
+ children: children
289
+ });
290
+ });
291
+ TableRow.displayName = COMPONENT_NAME;
292
+ TableRow.className = CLASSNAME;
293
+ TableRow.defaultProps = DEFAULT_PROPS;
294
+
295
+ export { Table, TableBody, TableCell, TableCellVariant, TableHeader, TableRow, ThOrder };
296
+ //# sourceMappingURL=table-ec20c66c.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"table-ec20c66c.js","sources":["../../../src/components/table/Table.tsx","../../../src/components/table/TableBody.tsx","../../../src/components/table/TableCell.tsx","../../../src/components/table/TableHeader.tsx","../../../src/components/table/TableRow.tsx"],"sourcesContent":["import classNames from 'classnames';\n\nimport { Theme } from '@lumx/react';\nimport { GenericProps, HasTheme } from '@lumx/react/utils/type';\nimport { getRootClassName, handleBasicClasses } from '@lumx/core/js/utils/className';\nimport { useTheme } from '@lumx/react/utils/theme/ThemeContext';\nimport { forwardRef } from '@lumx/react/utils/react/forwardRef';\n\n/**\n * Defines the props of the component.\n */\nexport interface TableProps extends GenericProps, HasTheme {\n /** Whether the table has checkbox or thumbnail on first cell or not. */\n hasBefore?: boolean;\n /** Whether the table has dividers or not. */\n hasDividers?: boolean;\n /** Children */\n children?: React.ReactNode;\n}\n\n/**\n * Component display name.\n */\nconst COMPONENT_NAME = 'Table';\n\n/**\n * Component default class name and class prefix.\n */\nconst CLASSNAME = getRootClassName(COMPONENT_NAME);\n\n/**\n * Component default props.\n */\nconst DEFAULT_PROPS: Partial<TableProps> = {};\n\n/**\n * Table component.\n *\n * @param props Component props.\n * @param ref Component ref.\n * @return React element.\n */\nexport const Table = forwardRef<TableProps, HTMLTableElement>((props, ref) => {\n const defaultTheme = useTheme() || Theme.light;\n const { children, className, hasBefore, hasDividers, theme = defaultTheme, ...forwardedProps } = props;\n\n return (\n <table\n ref={ref}\n {...forwardedProps}\n className={classNames(className, handleBasicClasses({ prefix: CLASSNAME, hasBefore, hasDividers, theme }))}\n >\n {children}\n </table>\n );\n});\nTable.displayName = COMPONENT_NAME;\nTable.className = CLASSNAME;\nTable.defaultProps = DEFAULT_PROPS;\n","import classNames from 'classnames';\n\nimport { GenericProps } from '@lumx/react/utils/type';\nimport { getRootClassName } from '@lumx/core/js/utils/className';\nimport { forwardRef } from '@lumx/react/utils/react/forwardRef';\n\n/**\n * Defines the props of the component.\n */\nexport interface TableBodyProps extends GenericProps {\n /** Children */\n children?: React.ReactNode;\n}\n\n/**\n * Component display name.\n */\nconst COMPONENT_NAME = 'TableBody';\n\n/**\n * Component default class name and class prefix.\n */\nconst CLASSNAME = getRootClassName(COMPONENT_NAME, true);\n\n/**\n * TableBody component.\n *\n * @param props Component props.\n * @param ref Component ref.\n * @return React element.\n */\nexport const TableBody = forwardRef<TableBodyProps, HTMLTableSectionElement>((props, ref) => {\n const { children, className, ...forwardedProps } = props;\n\n return (\n <tbody ref={ref} {...forwardedProps} className={classNames(className, CLASSNAME)}>\n {children}\n </tbody>\n );\n});\nTableBody.displayName = COMPONENT_NAME;\nTableBody.className = CLASSNAME;\n","import classNames from 'classnames';\n\nimport { mdiArrowDown } from '@lumx/icons/esm/arrow-down';\nimport { mdiArrowUp } from '@lumx/icons/esm/arrow-up';\nimport { Icon, Size } from '@lumx/react';\nimport { GenericProps, ValueOf } from '@lumx/react/utils/type';\nimport { getRootClassName, handleBasicClasses } from '@lumx/core/js/utils/className';\nimport { forwardRef } from '@lumx/react/utils/react/forwardRef';\n\n/**\n * Table head cell sort order.\n */\nexport const ThOrder = { asc: 'asc', desc: 'desc' } as const;\nexport type ThOrder = ValueOf<typeof ThOrder>;\n\n/**\n * Table cell variants.\n */\nexport const TableCellVariant = { body: 'body', head: 'head' } as const;\nexport type TableCellVariant = ValueOf<typeof TableCellVariant>;\n\n/**\n * Defines the props of the component.\n */\nexport interface TableCellProps extends GenericProps {\n /** Icon (SVG path).(thead only). */\n icon?: string;\n /** Whether the column is sortable or not (thead only). */\n isSortable?: boolean;\n /** Sort order displayed as icon (sortable thead only). */\n sortOrder?: ThOrder;\n /** Variant. */\n variant?: TableCellVariant;\n /** On header cell click callback. */\n onHeaderClick?(): void;\n /** Children */\n children?: React.ReactNode;\n}\n\n/**\n * Component display name.\n */\nconst COMPONENT_NAME = 'TableCell';\n\n/**\n * Component default class name and class prefix.\n */\nconst CLASSNAME = getRootClassName(COMPONENT_NAME, true);\n\n/**\n * Component default props.\n */\nconst DEFAULT_PROPS: Partial<TableCellProps> = {\n variant: TableCellVariant.body,\n};\n\n/**\n * TableCell component.\n *\n * @param props Component props.\n * @param ref Component ref.\n * @return React element.\n */\nexport const TableCell = forwardRef<TableCellProps, HTMLTableCellElement>((props, ref) => {\n const {\n children,\n className,\n icon,\n isSortable,\n onHeaderClick,\n sortOrder,\n variant = DEFAULT_PROPS.variant,\n ...forwardedProps\n } = props;\n\n // Use button if clickable\n const Wrapper = onHeaderClick ? 'button' : 'div';\n const wrapperProps = Wrapper === 'button' ? ({ type: 'button', onClick: onHeaderClick } as const) : undefined;\n\n // ARIA sort\n let ariaSort: 'ascending' | 'descending' | 'none' | undefined;\n if (isSortable) {\n ariaSort = 'none';\n if (sortOrder === ThOrder.asc) ariaSort = 'ascending';\n if (sortOrder === ThOrder.desc) ariaSort = 'descending';\n }\n\n return (\n <>\n {variant === TableCellVariant.head && (\n <th\n ref={ref}\n {...forwardedProps}\n className={classNames(\n handleBasicClasses({\n prefix: CLASSNAME,\n isSortable,\n isSorted: isSortable && !!sortOrder,\n }),\n className,\n `${CLASSNAME}--head`,\n )}\n aria-sort={ariaSort}\n >\n <Wrapper className={`${CLASSNAME}-wrapper`} {...wrapperProps}>\n {icon && !isSortable && <Icon className={`${CLASSNAME}-icon`} icon={icon} size={Size.xxs} />}\n\n {isSortable && sortOrder === ThOrder.asc && (\n <Icon className={`${CLASSNAME}-icon`} icon={mdiArrowUp} size={Size.xxs} />\n )}\n\n {isSortable && sortOrder === ThOrder.desc && (\n <Icon className={`${CLASSNAME}-icon`} icon={mdiArrowDown} size={Size.xxs} />\n )}\n\n <div className={`${CLASSNAME}-content`}>{children}</div>\n </Wrapper>\n </th>\n )}\n\n {variant === TableCellVariant.body && (\n <td {...forwardedProps} className={classNames(className, CLASSNAME, `${CLASSNAME}--body`)}>\n <div className={`${CLASSNAME}-content`}>{children}</div>\n </td>\n )}\n </>\n );\n});\nTableCell.displayName = COMPONENT_NAME;\nTableCell.className = CLASSNAME;\nTableCell.defaultProps = DEFAULT_PROPS;\n","import classNames from 'classnames';\n\nimport { GenericProps } from '@lumx/react/utils/type';\nimport { getRootClassName } from '@lumx/core/js/utils/className';\nimport { forwardRef } from '@lumx/react/utils/react/forwardRef';\n\n/**\n * Defines the props of the component.\n */\nexport interface TableHeaderProps extends GenericProps {\n /** Children */\n children?: React.ReactNode;\n}\n\n/**\n * Component display name.\n */\nconst COMPONENT_NAME = 'TableHeader';\n\n/**\n * Component default class name and class prefix.\n */\nconst CLASSNAME = getRootClassName(COMPONENT_NAME, true);\n\n/**\n * Component default props.\n */\nconst DEFAULT_PROPS: Partial<TableHeaderProps> = {};\n\n/**\n * TableHeader component.\n *\n * @param props Component props.\n * @param ref Component ref.\n * @return React element.\n */\nexport const TableHeader = forwardRef<TableHeaderProps, HTMLTableSectionElement>((props, ref) => {\n const { children, className, ...forwardedProps } = props;\n\n return (\n <thead ref={ref} {...forwardedProps} className={classNames(className, CLASSNAME)}>\n {children}\n </thead>\n );\n});\nTableHeader.displayName = COMPONENT_NAME;\nTableHeader.className = CLASSNAME;\nTableHeader.defaultProps = DEFAULT_PROPS;\n","import classNames from 'classnames';\n\nimport { GenericProps } from '@lumx/react/utils/type';\nimport { getRootClassName, handleBasicClasses } from '@lumx/core/js/utils/className';\nimport { forwardRef } from '@lumx/react/utils/react/forwardRef';\nimport { useDisableStateProps } from '@lumx/react/utils/disabled/useDisableStateProps';\n\n/**\n * Defines the props of the component.\n */\nexport interface TableRowProps extends GenericProps {\n /** Whether the component is clickable or not. */\n isClickable?: boolean;\n /** Whether the component is disabled or not. */\n isDisabled?: boolean;\n /** Whether the component is selected or not. */\n isSelected?: boolean;\n /** Children */\n children?: React.ReactNode;\n}\n\n/**\n * Component display name.\n */\nconst COMPONENT_NAME = 'TableRow';\n\n/**\n * Component default class name and class prefix.\n */\nconst CLASSNAME = getRootClassName(COMPONENT_NAME, true);\n\n/**\n * Component default props.\n */\nconst DEFAULT_PROPS: Partial<TableRowProps> = {};\n\n/**\n * TableRow component.\n *\n * @param props Component props.\n * @param ref Component ref.\n * @return React element.\n */\nexport const TableRow = forwardRef<TableRowProps, HTMLTableRowElement>((props, ref) => {\n const { isAnyDisabled, disabledStateProps, otherProps } = useDisableStateProps(props);\n const { children, className, isClickable, isSelected, ...forwardedProps } = otherProps;\n\n return (\n <tr\n ref={ref}\n tabIndex={isClickable && !disabledStateProps.disabled ? 0 : -1}\n {...forwardedProps}\n className={classNames(\n className,\n handleBasicClasses({\n isClickable: isClickable && !isAnyDisabled,\n isDisabled: isAnyDisabled,\n isSelected: isSelected && !isAnyDisabled,\n prefix: CLASSNAME,\n }),\n )}\n aria-disabled={isAnyDisabled}\n >\n {children}\n </tr>\n );\n});\n\nTableRow.displayName = COMPONENT_NAME;\nTableRow.className = CLASSNAME;\nTableRow.defaultProps = DEFAULT_PROPS;\n"],"names":["COMPONENT_NAME","CLASSNAME","getRootClassName","DEFAULT_PROPS","Table","forwardRef","props","ref","defaultTheme","useTheme","Theme","light","children","className","hasBefore","hasDividers","theme","forwardedProps","_jsx","classNames","handleBasicClasses","prefix","displayName","defaultProps","TableBody","ThOrder","asc","desc","TableCellVariant","body","head","variant","TableCell","icon","isSortable","onHeaderClick","sortOrder","Wrapper","wrapperProps","type","onClick","undefined","ariaSort","_jsxs","_Fragment","isSorted","Icon","size","Size","xxs","mdiArrowUp","mdiArrowDown","TableHeader","TableRow","isAnyDisabled","disabledStateProps","otherProps","useDisableStateProps","isClickable","isSelected","tabIndex","disabled","isDisabled"],"mappings":"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"}
@@ -0,0 +1,299 @@
1
+ import ReactDOM from 'react-dom';
2
+ import React__default, { useReducer, useEffect, useCallback } from 'react';
3
+ import { I as INIT_STATE, r as reducer, T as TabProviderContext, a as useTabProviderContext } from '../state-db358714.js';
4
+ import { jsx, jsxs } from 'react/jsx-runtime';
5
+ import classNames from 'classnames';
6
+ import '../constants-d0e3f49e.js';
7
+ import { handleBasicClasses } from '@lumx/core/js/utils/className';
8
+ import { m as mergeRefs } from '../mergeRefs-f0d7d6ea.js';
9
+ import { f as forwardRef } from '../forwardRef-8bce732e.js';
10
+ import { u as useTheme } from '../ThemeContext-3181f000.js';
11
+ import { u as useRovingTabIndex } from '../useRovingTabIndex-7daf0f24.js';
12
+ import { Alignment, Theme, CSS_PREFIX, Size } from '@lumx/core/js/constants';
13
+ import { u as useDisableStateProps } from '../useDisableStateProps-69e16b7c.js';
14
+ import { Icon } from './icon-ee15673b.js';
15
+ import { T as Text } from '../index-25c9e8c2.js';
16
+
17
+ const DEFAULT_PROPS$3 = {
18
+ isLazy: INIT_STATE.isLazy,
19
+ shouldActivateOnFocus: INIT_STATE.shouldActivateOnFocus
20
+ };
21
+
22
+ /**
23
+ * This component provides a context in which tabs can be defined and linked to their tab panel.
24
+ *
25
+ * It does not produce any markup so you can wrap it around any React elements and then split the TabList and TabPanel
26
+ * components in the react tree.
27
+ *
28
+ * @param props React component props.
29
+ * @return React element.
30
+ */
31
+ const TabProvider = props => {
32
+ const {
33
+ children,
34
+ onChange,
35
+ ...propState
36
+ } = props;
37
+ const [state, dispatch] = useReducer(reducer, INIT_STATE);
38
+
39
+ // On prop state change => dispatch update.
40
+ useEffect(() => {
41
+ dispatch({
42
+ type: 'update',
43
+ payload: {
44
+ ...DEFAULT_PROPS$3,
45
+ ...propState
46
+ }
47
+ });
48
+ },
49
+ // eslint-disable-next-line react-hooks/exhaustive-deps
50
+ [dispatch, ...Object.values(propState)]);
51
+
52
+ // On active tab index state change => send update to the onChange.
53
+ useEffect(() => {
54
+ if (state === INIT_STATE || !onChange || propState.activeTabIndex === state.activeTabIndex) {
55
+ return;
56
+ }
57
+
58
+ // Escape rendering/useEffect context
59
+ queueMicrotask(() => {
60
+ // Wait for React to commit last state changes (avoid looping state update)
61
+ ReactDOM.flushSync(() => {
62
+ onChange(state.activeTabIndex);
63
+ });
64
+ });
65
+ },
66
+ // eslint-disable-next-line react-hooks/exhaustive-deps
67
+ [onChange, state.activeTabIndex]);
68
+ return /*#__PURE__*/jsx(TabProviderContext.Provider, {
69
+ value: [state, dispatch],
70
+ children: children
71
+ });
72
+ };
73
+ TabProvider.defaultProps = DEFAULT_PROPS$3;
74
+
75
+ let TabListLayout = /*#__PURE__*/function (TabListLayout) {
76
+ TabListLayout["clustered"] = "clustered";
77
+ TabListLayout["fixed"] = "fixed";
78
+ return TabListLayout;
79
+ }({});
80
+
81
+ /**
82
+ * Defines the props of the component.
83
+ */
84
+
85
+ /**
86
+ * Component display name.
87
+ */
88
+ const COMPONENT_NAME$2 = 'TabList';
89
+
90
+ /**
91
+ * Component default class name and class prefix.
92
+ */
93
+ const CLASSNAME$2 = `${CSS_PREFIX}-tabs`;
94
+
95
+ /**
96
+ * Component default props.
97
+ */
98
+ const DEFAULT_PROPS$2 = {
99
+ layout: TabListLayout.fixed,
100
+ position: Alignment.left
101
+ };
102
+
103
+ /**
104
+ * TabList component.
105
+ *
106
+ * Implements WAI-ARIA `tablist` role {@see https://www.w3.org/TR/wai-aria-practices-1.1/examples/tabs/tabs-1/tabs.html#rps_label}
107
+ *
108
+ * @param props Component props.
109
+ * @param ref Component ref.
110
+ * @return React element.
111
+ */
112
+ const TabList = forwardRef((props, ref) => {
113
+ const defaultTheme = useTheme() || Theme.light;
114
+ const {
115
+ 'aria-label': ariaLabel,
116
+ children,
117
+ className,
118
+ layout = DEFAULT_PROPS$2.layout,
119
+ position = DEFAULT_PROPS$2.position,
120
+ theme = defaultTheme,
121
+ ...forwardedProps
122
+ } = props;
123
+ const tabListRef = React__default.useRef(null);
124
+ useRovingTabIndex({
125
+ parentRef: tabListRef,
126
+ elementSelector: '[role="tab"]',
127
+ keepTabIndex: false,
128
+ extraDependencies: [children]
129
+ });
130
+ return /*#__PURE__*/jsx("div", {
131
+ ref: mergeRefs(ref, tabListRef),
132
+ ...forwardedProps,
133
+ className: classNames(className, handleBasicClasses({
134
+ prefix: CLASSNAME$2,
135
+ layout,
136
+ position,
137
+ theme
138
+ })),
139
+ children: /*#__PURE__*/jsx("div", {
140
+ className: `${CLASSNAME$2}__links`,
141
+ role: "tablist",
142
+ "aria-label": ariaLabel,
143
+ children: children
144
+ })
145
+ });
146
+ });
147
+ TabList.displayName = COMPONENT_NAME$2;
148
+ TabList.className = CLASSNAME$2;
149
+ TabList.defaultProps = DEFAULT_PROPS$2;
150
+
151
+ /**
152
+ * Component display name.
153
+ */
154
+ const COMPONENT_NAME$1 = 'Tab';
155
+
156
+ /**
157
+ * Component default class name and class prefix.
158
+ */
159
+ const CLASSNAME$1 = `${CSS_PREFIX}-tabs__link`;
160
+
161
+ /**
162
+ * Component default props.
163
+ */
164
+ const DEFAULT_PROPS$1 = {};
165
+
166
+ /**
167
+ * Tab component.
168
+ *
169
+ * Implements WAI-ARIA `tab` role {@see https://www.w3.org/TR/wai-aria-practices-1.1/examples/tabs/tabs-1/tabs.html#rps_label}
170
+ *
171
+ * @param props Component props.
172
+ * @param ref Component ref.
173
+ * @return React element.
174
+ */
175
+ const Tab = forwardRef((props, ref) => {
176
+ const {
177
+ isAnyDisabled,
178
+ otherProps
179
+ } = useDisableStateProps(props);
180
+ const {
181
+ className,
182
+ icon,
183
+ iconProps = {},
184
+ id,
185
+ isActive: propIsActive,
186
+ label,
187
+ onFocus,
188
+ onKeyPress,
189
+ tabIndex = -1,
190
+ ...forwardedProps
191
+ } = otherProps;
192
+ const state = useTabProviderContext('tab', id);
193
+ const isActive = propIsActive || state?.isActive;
194
+ const changeToCurrentTab = useCallback(() => {
195
+ if (isAnyDisabled) {
196
+ return;
197
+ }
198
+ state?.changeToTab();
199
+ }, [isAnyDisabled, state]);
200
+ const handleFocus = useCallback(event => {
201
+ onFocus?.(event);
202
+ if (state?.shouldActivateOnFocus) {
203
+ changeToCurrentTab();
204
+ }
205
+ }, [changeToCurrentTab, onFocus, state?.shouldActivateOnFocus]);
206
+ const handleKeyPress = useCallback(event => {
207
+ onKeyPress?.(event);
208
+ if (event.key !== 'Enter' || isAnyDisabled) {
209
+ return;
210
+ }
211
+ changeToCurrentTab();
212
+ }, [changeToCurrentTab, isAnyDisabled, onKeyPress]);
213
+ return /*#__PURE__*/jsxs("button", {
214
+ ref: ref,
215
+ ...forwardedProps,
216
+ type: "button",
217
+ id: state?.tabId,
218
+ className: classNames(className, handleBasicClasses({
219
+ prefix: CLASSNAME$1,
220
+ isActive,
221
+ isDisabled: isAnyDisabled
222
+ })),
223
+ onClick: changeToCurrentTab,
224
+ onKeyPress: handleKeyPress,
225
+ onFocus: handleFocus,
226
+ role: "tab",
227
+ tabIndex: isActive ? 0 : tabIndex,
228
+ "aria-disabled": isAnyDisabled,
229
+ "aria-selected": isActive,
230
+ "aria-controls": state?.tabPanelId,
231
+ children: [icon && /*#__PURE__*/jsx(Icon, {
232
+ icon: icon,
233
+ size: Size.xs,
234
+ ...iconProps
235
+ }), label && /*#__PURE__*/jsx(Text, {
236
+ as: "span",
237
+ truncate: true,
238
+ children: label
239
+ })]
240
+ });
241
+ });
242
+ Tab.displayName = COMPONENT_NAME$1;
243
+ Tab.className = CLASSNAME$1;
244
+ Tab.defaultProps = DEFAULT_PROPS$1;
245
+
246
+ /**
247
+ * Component display name.
248
+ */
249
+ const COMPONENT_NAME = 'TabPanel';
250
+
251
+ /**
252
+ * Component default class name and class prefix.
253
+ */
254
+ const CLASSNAME = `${CSS_PREFIX}-tab-panel`;
255
+
256
+ /**
257
+ * Component default props.
258
+ */
259
+ const DEFAULT_PROPS = {};
260
+
261
+ /**
262
+ * TabPanel component.
263
+ *
264
+ * Implements WAI-ARIA `tabpanel` role {@see https://www.w3.org/TR/wai-aria-practices-1.1/examples/tabs/tabs-1/tabs.html#rps_label}
265
+ *
266
+ * @param props Component props.
267
+ * @param ref Component ref.
268
+ * @return React element.
269
+ */
270
+ const TabPanel = forwardRef((props, ref) => {
271
+ const {
272
+ children,
273
+ id,
274
+ className,
275
+ isActive: propIsActive,
276
+ ...forwardedProps
277
+ } = props;
278
+ const state = useTabProviderContext('tabPanel', id);
279
+ const isActive = propIsActive || state?.isActive;
280
+ return /*#__PURE__*/jsx("div", {
281
+ ref: ref,
282
+ ...forwardedProps,
283
+ id: state?.tabPanelId,
284
+ className: classNames(className, handleBasicClasses({
285
+ prefix: CLASSNAME,
286
+ isActive
287
+ })),
288
+ role: "tabpanel",
289
+ tabIndex: isActive ? 0 : -1,
290
+ "aria-labelledby": state?.tabId,
291
+ children: (!state?.isLazy || isActive) && children
292
+ });
293
+ });
294
+ TabPanel.displayName = COMPONENT_NAME;
295
+ TabPanel.className = CLASSNAME;
296
+ TabPanel.defaultProps = DEFAULT_PROPS;
297
+
298
+ export { Tab, TabList, TabListLayout, TabPanel, TabProvider };
299
+ //# sourceMappingURL=tabs-89c055bd.js.map