npm - @yamada-ui/react - Versions diffs - 2.3.0-next-20260412065941 → 2.3.0-next-20260412094821 - Mend

@yamada-ui/react 2.3.0-next-20260412065941 → 2.3.0-next-20260412094821

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 (253) hide show

package/dist/cjs/components/segmented-control/segmented-control.cjs CHANGED Viewed

@@ -68,12 +68,12 @@ const SegmentedControlRoot = withProvider(({ children, items = [], orientation:
 		})
 	});
 }, "root", { transferProps: ["orientation"] })();
-const SegmentedControlItem = withContext(({ children, indicatorProps, ...rest }) => {
+const SegmentedControlItem = withContext(({ children, suppressHydrationWarning, indicatorProps, ...rest }) => {
 	const { checked, getInputProps, getLabelProps } = require_use_segmented_control.useSegmentedControlItem(rest);
 	return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(require_factory.styled.label, {
-		...getLabelProps(),
+		...getLabelProps({ suppressHydrationWarning }),
 		children: [
-			/* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_factory.styled.input, { ...getInputProps() }),
+			/* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_factory.styled.input, { ...getInputProps({ suppressHydrationWarning }) }),
 			/* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_factory.styled.span, { children }),
 			checked ? /* @__PURE__ */ (0, react_jsx_runtime.jsx)(SegmentedControlIndicator, { ...indicatorProps }) : null
 		]

package/dist/cjs/components/segmented-control/segmented-control.cjs.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"segmented-control.cjs","names":["createSlotComponent","segmentedControlStyle","useSegmentedControl","useValue","rest","SegmentedControlContext","SegmentedControlDescendantsContext","LayoutGroup","styled","useSegmentedControlItem","motion"],"sources":["../../../../src/components/segmented-control/segmented-control.tsx"],"sourcesContent":["\"use client\"\n\nimport type { ReactElement, ReactNode } from \"react\"\nimport type { GenericsComponent, HTMLStyledProps, ThemeProps } from \"../../core\"\nimport type { HTMLMotionProps } from \"../motion\"\nimport type { SegmentedControlStyle } from \"./segmented-control.style\"\nimport type {\n UseSegmentedControlItemProps,\n UseSegmentedControlProps,\n} from \"./use-segmented-control\"\nimport { LayoutGroup } from \"motion/react\"\nimport { useMemo } from \"react\"\nimport { createSlotComponent, styled } from \"../../core\"\nimport { useValue } from \"../../hooks/use-value\"\nimport { motion } from \"../motion\"\nimport { segmentedControlStyle } from \"./segmented-control.style\"\nimport {\n SegmentedControlContext,\n SegmentedControlDescendantsContext,\n useSegmentedControl,\n useSegmentedControlItem,\n} from \"./use-segmented-control\"\n\nexport interface SegmentedControlItem extends SegmentedControlItemProps {\n label?: ReactNode\n}\n\ninterface ComponentContext extends Pick<\n SegmentedControlRootProps,\n \"indicatorProps\" \| \"itemProps\"\n> {}\n\nexport interface SegmentedControlRootProps<Y extends string = string>\n extends\n Omit<HTMLStyledProps, \"defaultValue\" \| \"onChange\">,\n ThemeProps<SegmentedControlStyle>,\n Omit<UseSegmentedControlProps<Y>, \"orientation\"> {\n /*\n If provided, generate segmented control buttons but based on items.\n \n @default []\n /\n items?: SegmentedControlItem[]\n /\n Props for the indicator component.\n /\n indicatorProps?: SegmentedControlIndicatorProps\n /\n Props for the item component.\n /\n itemProps?: SegmentedControlItemProps\n}\n\nconst {\n ComponentContext,\n PropsContext: SegmentedControlPropsContext,\n useComponentContext,\n usePropsContext: useSegmentedControlPropsContext,\n withContext,\n withProvider,\n} = createSlotComponent<\n SegmentedControlRootProps,\n SegmentedControlStyle,\n ComponentContext\n>(\"segmented-control\", segmentedControlStyle)\n\nexport { SegmentedControlPropsContext, useSegmentedControlPropsContext }\n\n/\n `SegmentedControl` is a component used for allowing users to select one option from multiple choices.\n \n @see https://yamada-ui.com/docs/components/segmented-control\n /\nexport const SegmentedControlRoot = withProvider(\n ({\n children,\n items = [],\n orientation: orientationProp,\n indicatorProps,\n itemProps,\n ...rest\n }) => {\n const computedOrientation = useValue(orientationProp)\n const {\n id,\n name,\n descendants,\n disabled,\n orientation,\n readOnly,\n setValue,\n value,\n getRootProps,\n } = useSegmentedControl({ orientation: computedOrientation, ...rest })\n const cloneChildren = useMemo(() => {\n if (children) {\n return children\n } else {\n return items.map(({ label, ...rest }, index) => (\n <SegmentedControlItem key={index} {...rest}>\n {label}\n </SegmentedControlItem>\n ))\n }\n }, [children, items])\n const context = useMemo(\n () => ({ id, name, disabled, orientation, readOnly, setValue, value }),\n [id, name, disabled, readOnly, orientation, setValue, value],\n )\n const componentContext = useMemo(\n () => ({ indicatorProps, itemProps }),\n [itemProps, indicatorProps],\n )\n\n return (\n <SegmentedControlContext value={context}>\n <ComponentContext value={componentContext}>\n <SegmentedControlDescendantsContext value={descendants}>\n <LayoutGroup id={id}>\n <styled.div {...getRootProps()}>{cloneChildren}</styled.div>\n </LayoutGroup>\n </SegmentedControlDescendantsContext>\n </ComponentContext>\n </SegmentedControlContext>\n )\n },\n \"root\",\n { transferProps: [\"orientation\"] },\n)() as GenericsComponent<{\n <Y extends string = string>(props: SegmentedControlRootProps<Y>): ReactElement\n}>\n\nexport interface SegmentedControlItemProps<Y extends string = string>\n extends HTMLStyledProps<\"label\">, UseSegmentedControlItemProps<Y> {\n /\n Props for the indicator component.\n */\n indicatorProps?: SegmentedControlIndicatorProps\n}\n\nexport const SegmentedControlItem = withContext<\n \"label\",\n SegmentedControlItemProps\n>(({ children, indicatorProps, ...rest }) => {\n const { checked, getInputProps, getLabelProps } =\n useSegmentedControlItem(rest)\n\n return (\n <styled.label {...getLabelProps()}>\n <styled.input {...getInputProps()} />\n\n <styled.span>{children}</styled.span>\n\n {checked ? <SegmentedControlIndicator {...indicatorProps} /> : null}\n </styled.label>\n )\n}, \"item\")((props) => {\n const { indicatorProps, itemProps } = useComponentContext()\n\n return {\n ...itemProps,\n ...props,\n indicatorProps: {\n ...indicatorProps,\n ...itemProps?.indicatorProps,\n ...props.indicatorProps,\n },\n }\n}) as GenericsComponent<{\n <Y extends string = string>(props: SegmentedControlItemProps<Y>): ReactElement\n}>\n\ninterface SegmentedControlIndicatorProps extends HTMLMotionProps {}\n\nconst SegmentedControlIndicator = withContext<\n \"div\",\n SegmentedControlIndicatorProps\n>(({ transition, ...props }) => {\n return (\n <motion.div\n layoutDependency={false}\n layoutId=\"indicator\"\n transition={{ duration: 0.2, ...transition }}\n {...props}\n />\n )\n}, \"indicator\")()\n"],"mappings":";;;;;;;;;;;;;;;;AAqDA,MAAM,EACJ,kBACA,cAAc,8BACd,qBACA,iBAAiB,iCACjB,aACA,iBACEA,6CAIF,qBAAqBC,sDAAsB;;;;;;AAS7C,MAAa,uBAAuB,cACjC,EACC,UACA,QAAQ,EAAE,EACV,aAAa,iBACb,gBACA,WACA,GAAG,WACC;CAEJ,MAAM,EACJ,IACA,MACA,aACA,UACA,aACA,UACA,UACA,OACA,iBACEC,kDAAoB;EAAE,aAXEC,uCAAS,gBAAgB;EAWO,GAAG;EAAM,CAAC;CACtE,MAAM,yCAA8B;AAClC,MAAI,SACF,QAAO;MAEP,QAAO,MAAM,KAAK,EAAE,OAAO,GAAGC,UAAQ,UACpC,2CAAC;GAAiC,GAAIA;aACnC;KADwB,MAEJ,CACvB;IAEH,CAAC,UAAU,MAAM,CAAC;AAUrB,QACE,2CAACC;EAAwB,iCATlB;GAAE;GAAI;GAAM;GAAU;GAAa;GAAU;GAAU;GAAO,GACrE;GAAC;GAAI;GAAM;GAAU;GAAU;GAAa;GAAU;GAAM,CAC7D;YAQG,2CAAC;GAAiB,iCANb;IAAE;IAAgB;IAAW,GACpC,CAAC,WAAW,eAAe,CAC5B;aAKK,2CAACC;IAAmC,OAAO;cACzC,2CAACC;KAAgB;eACf,2CAACC,uBAAO;MAAI,GAAI,cAAc;gBAAG;OAA2B;MAChD;KACqB;IACpB;GACK;GAG9B,QACA,EAAE,eAAe,CAAC,cAAc,EAAE,CACnC,EAAE;AAYH,MAAa,uBAAuB,aAGjC,EAAE,UAAU,gBAAgB,GAAG,WAAW;~~CAC3C~~,MAAM,EAAE,SAAS,eAAe,kBAC9BC,sDAAwB,KAAK;AAE/B,QACE,4CAACD,uBAAO;EAAM,GAAI,~~eAAe~~;;~~GAC/B~~,2CAACA,uBAAO,SAAM,GAAI,~~eAAe~~,GAAI;~~GAErC~~,2CAACA,uBAAO,QAAM,WAAuB;GAEpC,UAAU,2CAAC,6BAA0B,GAAI,iBAAkB,GAAG;;GAClD;GAEhB,OAAO,EAAE,UAAU;CACpB,MAAM,EAAE,gBAAgB,cAAc,qBAAqB;AAE3D,QAAO;EACL,GAAG;EACH,GAAG;EACH,gBAAgB;GACd,GAAG;GACH,GAAG,WAAW;GACd,GAAG,MAAM;GACV;EACF;EACD;AAMF,MAAM,4BAA4B,aAG/B,EAAE,YAAY,GAAG,YAAY;AAC9B,QACE,2CAACE,yBAAO;EACN,kBAAkB;EAClB,UAAS;EACT,YAAY;GAAE,UAAU;GAAK,GAAG;GAAY;EAC5C,GAAI;GACJ;GAEH,YAAY,EAAE"}
1	+ {"version":3,"file":"segmented-control.cjs","names":["createSlotComponent","segmentedControlStyle","useSegmentedControl","useValue","rest","SegmentedControlContext","SegmentedControlDescendantsContext","LayoutGroup","styled","useSegmentedControlItem","motion"],"sources":["../../../../src/components/segmented-control/segmented-control.tsx"],"sourcesContent":["\"use client\"\n\nimport type { ReactElement, ReactNode } from \"react\"\nimport type { GenericsComponent, HTMLStyledProps, ThemeProps } from \"../../core\"\nimport type { HTMLMotionProps } from \"../motion\"\nimport type { SegmentedControlStyle } from \"./segmented-control.style\"\nimport type {\n UseSegmentedControlItemProps,\n UseSegmentedControlProps,\n} from \"./use-segmented-control\"\nimport { LayoutGroup } from \"motion/react\"\nimport { useMemo } from \"react\"\nimport { createSlotComponent, styled } from \"../../core\"\nimport { useValue } from \"../../hooks/use-value\"\nimport { motion } from \"../motion\"\nimport { segmentedControlStyle } from \"./segmented-control.style\"\nimport {\n SegmentedControlContext,\n SegmentedControlDescendantsContext,\n useSegmentedControl,\n useSegmentedControlItem,\n} from \"./use-segmented-control\"\n\nexport interface SegmentedControlItem extends SegmentedControlItemProps {\n label?: ReactNode\n}\n\ninterface ComponentContext extends Pick<\n SegmentedControlRootProps,\n \"indicatorProps\" \| \"itemProps\"\n> {}\n\nexport interface SegmentedControlRootProps<Y extends string = string>\n extends\n Omit<HTMLStyledProps, \"defaultValue\" \| \"onChange\">,\n ThemeProps<SegmentedControlStyle>,\n Omit<UseSegmentedControlProps<Y>, \"orientation\"> {\n /*\n If provided, generate segmented control buttons but based on items.\n \n @default []\n /\n items?: SegmentedControlItem[]\n /\n Props for the indicator component.\n /\n indicatorProps?: SegmentedControlIndicatorProps\n /\n Props for the item component.\n /\n itemProps?: SegmentedControlItemProps\n}\n\nconst {\n ComponentContext,\n PropsContext: SegmentedControlPropsContext,\n useComponentContext,\n usePropsContext: useSegmentedControlPropsContext,\n withContext,\n withProvider,\n} = createSlotComponent<\n SegmentedControlRootProps,\n SegmentedControlStyle,\n ComponentContext\n>(\"segmented-control\", segmentedControlStyle)\n\nexport { SegmentedControlPropsContext, useSegmentedControlPropsContext }\n\n/\n `SegmentedControl` is a component used for allowing users to select one option from multiple choices.\n \n @see https://yamada-ui.com/docs/components/segmented-control\n /\nexport const SegmentedControlRoot = withProvider(\n ({\n children,\n items = [],\n orientation: orientationProp,\n indicatorProps,\n itemProps,\n ...rest\n }) => {\n const computedOrientation = useValue(orientationProp)\n const {\n id,\n name,\n descendants,\n disabled,\n orientation,\n readOnly,\n setValue,\n value,\n getRootProps,\n } = useSegmentedControl({ orientation: computedOrientation, ...rest })\n const cloneChildren = useMemo(() => {\n if (children) {\n return children\n } else {\n return items.map(({ label, ...rest }, index) => (\n <SegmentedControlItem key={index} {...rest}>\n {label}\n </SegmentedControlItem>\n ))\n }\n }, [children, items])\n const context = useMemo(\n () => ({ id, name, disabled, orientation, readOnly, setValue, value }),\n [id, name, disabled, readOnly, orientation, setValue, value],\n )\n const componentContext = useMemo(\n () => ({ indicatorProps, itemProps }),\n [itemProps, indicatorProps],\n )\n\n return (\n <SegmentedControlContext value={context}>\n <ComponentContext value={componentContext}>\n <SegmentedControlDescendantsContext value={descendants}>\n <LayoutGroup id={id}>\n <styled.div {...getRootProps()}>{cloneChildren}</styled.div>\n </LayoutGroup>\n </SegmentedControlDescendantsContext>\n </ComponentContext>\n </SegmentedControlContext>\n )\n },\n \"root\",\n { transferProps: [\"orientation\"] },\n)() as GenericsComponent<{\n <Y extends string = string>(props: SegmentedControlRootProps<Y>): ReactElement\n}>\n\nexport interface SegmentedControlItemProps<Y extends string = string>\n extends HTMLStyledProps<\"label\">, UseSegmentedControlItemProps<Y> {\n /\n Props for the indicator component.\n */\n indicatorProps?: SegmentedControlIndicatorProps\n}\n\nexport const SegmentedControlItem = withContext<\n \"label\",\n SegmentedControlItemProps\n>(({ children, suppressHydrationWarning, indicatorProps, ...rest }) => {\n const { checked, getInputProps, getLabelProps } =\n useSegmentedControlItem(rest)\n\n return (\n <styled.label {...getLabelProps({ suppressHydrationWarning })}>\n <styled.input {...getInputProps({ suppressHydrationWarning })} />\n\n <styled.span>{children}</styled.span>\n\n {checked ? <SegmentedControlIndicator {...indicatorProps} /> : null}\n </styled.label>\n )\n}, \"item\")((props) => {\n const { indicatorProps, itemProps } = useComponentContext()\n\n return {\n ...itemProps,\n ...props,\n indicatorProps: {\n ...indicatorProps,\n ...itemProps?.indicatorProps,\n ...props.indicatorProps,\n },\n }\n}) as GenericsComponent<{\n <Y extends string = string>(props: SegmentedControlItemProps<Y>): ReactElement\n}>\n\ninterface SegmentedControlIndicatorProps extends HTMLMotionProps {}\n\nconst SegmentedControlIndicator = withContext<\n \"div\",\n SegmentedControlIndicatorProps\n>(({ transition, ...props }) => {\n return (\n <motion.div\n layoutDependency={false}\n layoutId=\"indicator\"\n transition={{ duration: 0.2, ...transition }}\n {...props}\n />\n )\n}, \"indicator\")()\n"],"mappings":";;;;;;;;;;;;;;;;AAqDA,MAAM,EACJ,kBACA,cAAc,8BACd,qBACA,iBAAiB,iCACjB,aACA,iBACEA,6CAIF,qBAAqBC,sDAAsB;;;;;;AAS7C,MAAa,uBAAuB,cACjC,EACC,UACA,QAAQ,EAAE,EACV,aAAa,iBACb,gBACA,WACA,GAAG,WACC;CAEJ,MAAM,EACJ,IACA,MACA,aACA,UACA,aACA,UACA,UACA,OACA,iBACEC,kDAAoB;EAAE,aAXEC,uCAAS,gBAAgB;EAWO,GAAG;EAAM,CAAC;CACtE,MAAM,yCAA8B;AAClC,MAAI,SACF,QAAO;MAEP,QAAO,MAAM,KAAK,EAAE,OAAO,GAAGC,UAAQ,UACpC,2CAAC;GAAiC,GAAIA;aACnC;KADwB,MAEJ,CACvB;IAEH,CAAC,UAAU,MAAM,CAAC;AAUrB,QACE,2CAACC;EAAwB,iCATlB;GAAE;GAAI;GAAM;GAAU;GAAa;GAAU;GAAU;GAAO,GACrE;GAAC;GAAI;GAAM;GAAU;GAAU;GAAa;GAAU;GAAM,CAC7D;YAQG,2CAAC;GAAiB,iCANb;IAAE;IAAgB;IAAW,GACpC,CAAC,WAAW,eAAe,CAC5B;aAKK,2CAACC;IAAmC,OAAO;cACzC,2CAACC;KAAgB;eACf,2CAACC,uBAAO;MAAI,GAAI,cAAc;gBAAG;OAA2B;MAChD;KACqB;IACpB;GACK;GAG9B,QACA,EAAE,eAAe,CAAC,cAAc,EAAE,CACnC,EAAE;AAYH,MAAa,uBAAuB,aAGjC,EAAE,UAAU,0BAA0B,gBAAgB,GAAG,WAAW;CACrE,MAAM,EAAE,SAAS,eAAe,kBAC9BC,sDAAwB,KAAK;AAE/B,QACE,4CAACD,uBAAO;EAAM,GAAI,cAAc,EAAE,0BAA0B,CAAC;;GAC3D,2CAACA,uBAAO,SAAM,GAAI,cAAc,EAAE,0BAA0B,CAAC,GAAI;GAEjE,2CAACA,uBAAO,QAAM,WAAuB;GAEpC,UAAU,2CAAC,6BAA0B,GAAI,iBAAkB,GAAG;;GAClD;GAEhB,OAAO,EAAE,UAAU;CACpB,MAAM,EAAE,gBAAgB,cAAc,qBAAqB;AAE3D,QAAO;EACL,GAAG;EACH,GAAG;EACH,gBAAgB;GACd,GAAG;GACH,GAAG,WAAW;GACd,GAAG,MAAM;GACV;EACF;EACD;AAMF,MAAM,4BAA4B,aAG/B,EAAE,YAAY,GAAG,YAAY;AAC9B,QACE,2CAACE,yBAAO;EACN,kBAAkB;EAClB,UAAS;EACT,YAAY;GAAE,UAAU;GAAK,GAAG;GAAY;EAC5C,GAAI;GACJ;GAEH,YAAY,EAAE"}

package/dist/cjs/components/table/table.cjs CHANGED Viewed

@@ -75,7 +75,7 @@ const Table = withContext(({ className, colorScheme, size, variant, columnFilter
 }, defaultRowSelection = {}, defaultSorting, enableAutoResizeTableWidth = false, enableColumnResizing = false, enableKeyboardNavigation = true, enablePagination = false, enableRowSelection = false, footer, header, highlightOnHover = !!enableRowSelection, highlightOnSelected = !!enableRowSelection, initialFocusableCell = {
 	colIndex: 0,
 	rowIndex: 0
-}, layout, lineClamp, manualPagination, pagination: paginationProp, rowCount: totalRowCount, rowSelection: rowSelectionProp, selectOnClickRow = false, sortDescFirst = false, sorting: sortingProp, sortingIcon, state, stickyFooter, stickyHeader, striped, truncated, withBorder, withCheckbox = true, withColumnBorders, withFooterCheckbox = false, withFooterGroups = false, withScrollArea, cellProps, checkboxProps, footerGroupProps, footerProps, headerCheckboxProps, headerGroupProps, headerProps, resizableTriggerProps, rowCheckboxProps, rowProps, scrollAreaProps, sortingIconProps, tableProps, tbodyProps, tfootProps, theadProps, onColumnFiltersChange: onColumnFiltersChangeProp, onPaginationChange: onPaginationChangeProp, onRowClick, onRowDoubleClick, onRowSelectionChange: onRowSelectionChangeProp, onSortingChange: onSortingChangeProp, ...rest }) => {
+}, layout, lineClamp, manualPagination, pagination: paginationProp, rowCount: totalRowCount, rowSelection: rowSelectionProp, selectOnClickRow = false, sortDescFirst = false, sorting: sortingProp, sortingIcon, state, stickyFooter, stickyHeader, striped, suppressHydrationWarning, truncated, withBorder, withCheckbox = true, withColumnBorders, withFooterCheckbox = false, withFooterGroups = false, withScrollArea, cellProps, checkboxProps, footerGroupProps, footerProps, headerCheckboxProps, headerGroupProps, headerProps, resizableTriggerProps, rowCheckboxProps, rowProps, scrollAreaProps, sortingIconProps, tableProps, tbodyProps, tfootProps, theadProps, onColumnFiltersChange: onColumnFiltersChangeProp, onPaginationChange: onPaginationChangeProp, onRowClick, onRowDoubleClick, onRowSelectionChange: onRowSelectionChangeProp, onSortingChange: onSortingChangeProp, ...rest }) => {
 	const { t } = require_i18n_provider.useI18n("table");
 	const initialFocus = (0, react.useRef)(false);
 	const ref = (0, react.useRef)(null);
@@ -342,6 +342,7 @@ const Table = withContext(({ className, colorScheme, size, variant, columnFilter
 					stickyFooter,
 					stickyHeader,
 					striped,
+					suppressHydrationWarning,
 					withBorder,
 					withColumnBorders,
 					withScrollArea,
@@ -389,15 +390,18 @@ const Table = withContext(({ className, colorScheme, size, variant, columnFilter
 										children: [
 											/* @__PURE__ */ (0, react_jsx_runtime.jsx)(TruncatedText, {
 												lineClamp: columnDef.lineClamp ?? lineClamp,
+												suppressHydrationWarning,
 												truncated: columnDef.truncated ?? truncated,
 												children
 											}),
 											canSort ? /* @__PURE__ */ (0, react_jsx_runtime.jsx)(SortingIcon, {
 												sorted,
+												suppressHydrationWarning,
 												onClick: header$1.column.getToggleSortingHandler()
 											}) : null,
 											canResize ? /* @__PURE__ */ (0, react_jsx_runtime.jsx)(ResizableTrigger, {
 												resizing,
+												suppressHydrationWarning,
 												onDoubleClick: header$1.column.resetSize,
 												onMouseDown: header$1.getResizeHandler(),
 												onTouchStart: header$1.getResizeHandler()
@@ -443,6 +447,7 @@ const Table = withContext(({ className, colorScheme, size, variant, columnFilter
 										...require_props.mergeProps({ css: { "&:has([data-focusable]:focus-visible)": require_focus_ring.focusRingStyle.outline } }, (0, require_utils_index.utils_exports.runIfFn)(cellProps, cell) ?? {}, columnDef.cellProps ?? {})(),
 										children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(TruncatedText, {
 											lineClamp: columnDef.lineClamp ?? lineClamp,
+											suppressHydrationWarning,
 											truncated: columnDef.truncated ?? truncated,
 											children
 										})
@@ -480,6 +485,7 @@ const Table = withContext(({ className, colorScheme, size, variant, columnFilter
 										...require_props.mergeProps({ css: { "&:has([data-focusable]:focus-visible)": require_focus_ring.focusRingStyle.outline } }, (0, require_utils_index.utils_exports.runIfFn)(footerProps, header$1) ?? {}, columnDef.footerProps ?? {})(),
 										children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(TruncatedText, {
 											lineClamp: columnDef.lineClamp ?? lineClamp,
+											suppressHydrationWarning,
 											truncated: columnDef.truncated ?? truncated,
 											children
 										})
@@ -494,7 +500,7 @@ const Table = withContext(({ className, colorScheme, size, variant, columnFilter
 		]
 	});
 })();
-const SortingIcon = ({ sorted, ...rest }) => {
+const SortingIcon = ({ sorted, suppressHydrationWarning, ...rest }) => {
 	const { t } = require_i18n_provider.useI18n("table");
 	const { sortingIcon, sortingIconProps = {} } = useComponentContext();
 	const Icon = sorted ? require_chevron_up_icon.ChevronUpIcon : require_chevrons_up_down_icon.ChevronsUpDownIcon;
@@ -512,6 +518,7 @@ const SortingIcon = ({ sorted, ...rest }) => {
 		position: "absolute",
 		right: "{space-x}",
 		rounded: "l1",
+		suppressHydrationWarning,
 		tabIndex: -1,
 		top: "50%",
 		transform: "translateY(-50%)",
@@ -522,7 +529,7 @@ const SortingIcon = ({ sorted, ...rest }) => {
 		children: (0, require_utils_index.utils_exports.runIfFn)(sortingIcon, sorted) ?? /* @__PURE__ */ (0, react_jsx_runtime.jsx)(Icon, { transform: `rotate(${sorted === "desc" ? 180 : 0}deg)` })
 	});
 };
-const ResizableTrigger = ({ resizing, ...rest }) => {
+const ResizableTrigger = ({ resizing, suppressHydrationWarning, ...rest }) => {
 	const { columnResizeMode, table, resizableTriggerProps = {} } = useComponentContext();
 	const offset = table.getState().columnSizingInfo.deltaOffset;
 	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_factory.styled.div, {
@@ -537,6 +544,7 @@ const ResizableTrigger = ({ resizing, ...rest }) => {
 		},
 		position: "absolute",
 		right: "0",
+		suppressHydrationWarning,
 		touchAction: "none",
 		transform: `translateX(${columnResizeMode === "onEnd" && resizing && offset ? `${offset}px` : "50%"})`,
 		userSelect: "none",
@@ -544,9 +552,10 @@ const ResizableTrigger = ({ resizing, ...rest }) => {
 		...require_props.mergeProps(rest, resizableTriggerProps)()
 	});
 };
-const TruncatedText = ({ children, lineClamp, truncated, ...rest }) => {
+const TruncatedText = ({ children, lineClamp, suppressHydrationWarning, truncated, ...rest }) => {
 	if (lineClamp || truncated) return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_factory.styled.span, {
 		lineClamp,
+		suppressHydrationWarning,
 		truncated,
 		wordBreak: "break-all",
 		...rest,

package/dist/cjs/components/table/table.cjs.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"table.cjs","names":["createComponent","useI18n","useControllableState","header","Checkbox","mergeProps","table","cellMap","el","focusRingStyle","SortingIcon: FC<SortingIconProps>","ChevronUpIcon","ChevronsUpDownIcon","styled","ResizableTrigger: FC<ResizableTriggerProps>","TruncatedText: FC<TruncatedTextProps>"],"sources":["../../../../src/components/table/table.tsx"],"sourcesContent":["\"use client\"\n\nimport type {\n AccessorFn,\n Cell,\n CellContext,\n ColumnDef,\n ColumnDefTemplate,\n ColumnFiltersColumnDef,\n ColumnFiltersState,\n ColumnMeta,\n ColumnPinningColumnDef,\n ColumnSizingColumnDef,\n GlobalFilterColumnDef,\n GroupingColumnDef,\n Header,\n HeaderContext,\n HeaderGroup,\n OnChangeFn,\n SortingState as OriginalSortingState,\n PaginationState,\n Table as ReactTable,\n Row,\n RowData,\n RowSelectionState,\n SortDirection,\n SortingColumnDef,\n TableOptions,\n VisibilityColumnDef,\n} from \"@tanstack/react-table\"\nimport type { FC, FocusEvent, KeyboardEvent, ReactElement } from \"react\"\nimport type { CSSProps, GenericsComponent, HTMLStyledProps } from \"../../core\"\nimport type { ReactNodeOrFunction, TransformProps } from \"../../utils\"\nimport type { CheckboxProps } from \"../checkbox\"\nimport {\n createColumnHelper,\n flexRender,\n getCoreRowModel,\n getFilteredRowModel,\n getPaginationRowModel,\n getSortedRowModel,\n useReactTable,\n} from \"@tanstack/react-table\"\nimport { useMemo, useRef } from \"react\"\nimport { createComponent, focusRingStyle, mergeProps, styled } from \"../../core\"\nimport { useControllableState } from \"../../hooks/use-controllable-state\"\nimport { useI18n } from \"../../providers/i18n-provider\"\nimport {\n ariaAttr,\n dataAttr,\n isFunction,\n runIfFn,\n runKeyAction,\n useUpdateEffect,\n} from \"../../utils\"\nimport { Checkbox } from \"../checkbox\"\nimport { ChevronsUpDownIcon, ChevronUpIcon } from \"../icon\"\nimport { NativeTable } from \"../native-table\"\n\ndeclare module \"@tanstack/react-table\" {\n interface ColumnDefExtensions<TData extends RowData, TValue = unknown>\n extends\n VisibilityColumnDef,\n ColumnPinningColumnDef,\n ColumnFiltersColumnDef<TData>,\n GlobalFilterColumnDef,\n SortingColumnDef<TData>,\n GroupingColumnDef<TData, TValue>,\n ColumnSizingColumnDef {}\n\n interface ColumnDefBase<TData extends RowData, TValue = unknown>\n extends\n ColumnDefExtensions<TData, TValue>,\n Pick<CSSProps, \"lineClamp\" \| \"truncated\">,\n Pick<NativeTable.TdProps, \"numeric\"> {\n cell?: ColumnDefTemplate<CellContext<TData, TValue>>\n footer?: ColumnDefTemplate<HeaderContext<TData, TValue>>\n getUniqueValues?: AccessorFn<TData, unknown[]>\n meta?: ColumnMeta<TData, TValue>\n cellProps?: NativeTable.TdProps\n footerProps?: NativeTable.ThProps\n headerProps?: NativeTable.ThProps\n }\n}\n\nexport { createColumnHelper }\nexport type {\n ColumnDef,\n ColumnFiltersState,\n PaginationState,\n RowSelectionState,\n SortDirection,\n}\n\nfunction getMergeHeaderGroups(\n headerGroups: HeaderGroup<any>[],\n): HeaderGroup<any>[] {\n if (headerGroups.length <= 1) return headerGroups\n\n const columnsIds = new Set()\n\n return headerGroups.map((headerGroup, depth, { length: fullDepth }) => {\n return {\n ...headerGroup,\n headers: headerGroup.headers\n .filter((header) => !columnsIds.has(header.column.id))\n .map((header) => {\n columnsIds.add(header.column.id)\n\n return header.isPlaceholder\n ? { ...header, isPlaceholder: false, rowSpan: fullDepth - depth }\n : { ...header, rowSpan: 1 }\n }),\n }\n })\n}\n\nfunction getMergeFooterGroups(\n headerGroups: HeaderGroup<any>[],\n): HeaderGroup<any>[] {\n if (headerGroups.length <= 1) return headerGroups\n\n return headerGroups.map((headerGroup, depth) => {\n const nextHeaderGroups = headerGroups.slice(depth + 1)\n\n return {\n ...headerGroup,\n headers: headerGroup.headers\n .filter((header) => !header.isPlaceholder)\n .map((header) => {\n if (nextHeaderGroups.length === 0) return header\n\n const rowSpan = nextHeaderGroups.reduce((acc, nextHeaderGroup) => {\n const hasNextHeader = nextHeaderGroup.headers.some(\n (nextHeader) => nextHeader.column.id === header.column.id,\n )\n\n return acc + (hasNextHeader ? 1 : 0)\n }, 1)\n\n return { ...header, rowSpan }\n }),\n }\n })\n}\n\nexport interface ColumnSort<Y extends RowData> {\n desc: boolean\n id: keyof Y\n}\nexport type SortingState<Y extends RowData> = ColumnSort<Y>[]\n\ninterface ComponentContext extends Pick<\n TableProps<any>,\n \| \"columnResizeMode\"\n \| \"resizableTriggerProps\"\n \| \"sortingIcon\"\n \| \"sortingIconProps\"\n> {\n table: ReactTable<any>\n}\n\ninterface OmittedTableOptions<Y extends RowData> extends Omit<\n TableOptions<Y>,\n \| \"getCoreRowModel\"\n \| \"onColumnFiltersChange\"\n \| \"onPaginationChange\"\n \| \"onSortingChange\"\n> {}\n\ninterface PickedNativeTableProps extends Pick<\n NativeTable.RootProps,\n \| \"className\"\n \| \"highlightOnHover\"\n \| \"highlightOnSelected\"\n \| \"layout\"\n \| \"scrollAreaProps\"\n \| \"size\"\n \| \"stickyFooter\"\n \| \"stickyHeader\"\n \| \"striped\"\n \| \"variant\"\n \| \"withBorder\"\n \| \"withColumnBorders\"\n \| \"withScrollArea\"\n> {}\n\nexport interface TableProps<Y extends RowData>\n extends\n OmittedTableOptions<Y>,\n PickedNativeTableProps,\n Pick<CSSProps, \"colorScheme\" \| \"lineClamp\" \| \"truncated\"> {\n /*\n The column filters state of the table.\n /\n columnFilters?: ColumnFiltersState\n /\n The default column filters state of the table.\n /\n defaultColumnFilters?: ColumnFiltersState\n /\n The default pagination state of the table.\n /\n defaultPagination?: PaginationState\n /\n The default row selection state of the table.\n /\n defaultRowSelection?: RowSelectionState\n /\n The default sorting state of the table.\n /\n defaultSorting?: SortingState<Y>\n /\n If `true`, the table width will be automatically resized to the content.\n \n @default false\n /\n enableAutoResizeTableWidth?: boolean\n /\n If `true`, the keyboard navigation will be enabled.\n \n @default true\n /\n enableKeyboardNavigation?: boolean\n /\n If `true`, the pagination will be enabled.\n \n @default false\n /\n enablePagination?: boolean\n /\n The footer of the table.\n /\n footer?: ReactNodeOrFunction<ReactTable<Y>>\n /\n The header of the table.\n /\n header?: ReactNodeOrFunction<ReactTable<Y>>\n /\n The initial focusable cell of the table.\n \n @default {rowIndex: 0, colIndex: 0}\n /\n initialFocusableCell?: { colIndex: number; rowIndex: number }\n /\n The pagination state of the table.\n /\n pagination?: PaginationState\n /\n The row selection state of the table.\n /\n rowSelection?: RowSelectionState\n /\n If `true`, the row will be selected when the row is clicked.\n \n @default false\n /\n selectOnClickRow?: boolean\n /\n The sorting state of the table.\n /\n sorting?: SortingState<Y>\n /\n The sorting icon of the table.\n /\n sortingIcon?: ReactNodeOrFunction<false \| SortDirection>\n /\n If `true`, the table will have a checkbox column.\n \n @default true\n /\n withCheckbox?: boolean\n /\n If `true`, the table will have a checkbox in the footer.\n \n @default false\n /\n withFooterCheckbox?: boolean\n /\n If `true`, the table will have footer groups.\n \n @default false\n /\n withFooterGroups?: boolean\n /\n The props for the table cell.\n /\n cellProps?: TransformProps<NativeTable.TdProps, Cell<Y, unknown>>\n /\n The props for the checkbox.\n /\n checkboxProps?: CheckboxProps\n /\n The props for the table footer group.\n /\n footerGroupProps?: TransformProps<NativeTable.TrProps, HeaderGroup<Y>>\n /\n The props for the table footer.\n /\n footerProps?: TransformProps<NativeTable.ThProps, Header<Y, unknown>>\n /\n The props for the table header checkbox.\n /\n headerCheckboxProps?: TransformProps<CheckboxProps, Header<Y, unknown>>\n /\n The props for the table header group.\n /\n headerGroupProps?: TransformProps<NativeTable.TrProps, HeaderGroup<Y>>\n /\n The props for the table header.\n /\n headerProps?: TransformProps<NativeTable.ThProps, Header<Y, unknown>>\n /\n The props for the resizable trigger.\n /\n resizableTriggerProps?: TransformProps<\n Omit<ResizableTriggerProps, \"resizing\">,\n Header<Y, unknown>\n >\n /\n The props for the table row checkbox.\n /\n rowCheckboxProps?: TransformProps<CheckboxProps, Row<Y>>\n /\n The props for the table row.\n /\n rowProps?: TransformProps<NativeTable.TrProps, Row<Y>>\n /\n The props for the sorting icon.\n /\n sortingIconProps?: TransformProps<\n Omit<SortingIconProps, \"sorted\">,\n Header<Y, unknown>\n >\n /\n The props for the table.\n /\n tableProps?: NativeTable.RootProps\n /\n The props for the table tbody.\n /\n tbodyProps?: NativeTable.TbodyProps\n /\n The props for the table tfoot.\n /\n tfootProps?: NativeTable.TfootProps\n /\n The props for the table thead.\n /\n theadProps?: NativeTable.TheadProps\n /\n The callback invoked when the column filters state changes.\n /\n onColumnFiltersChange?: (columnFilters: ColumnFiltersState) => void\n /\n The callback invoked when the pagination state changes.\n /\n onPaginationChange?: (pagination: PaginationState) => void\n /\n The callback invoked when the row is clicked.\n /\n onRowClick?: (row: Row<Y>) => void\n /\n The callback invoked when the row is double clicked.\n /\n onRowDoubleClick?: (row: Row<Y>) => void\n /\n The callback invoked when the sorting state changes.\n /\n onSortingChange?: (sorting: SortingState<Y>) => void\n}\n\nconst {\n ComponentContext,\n PropsContext: TablePropsContext,\n useComponentContext,\n usePropsContext: useTablePropsContext,\n withContext,\n} = createComponent<TableProps<any>, any, ComponentContext>(\"table\")\n\nexport { TablePropsContext, useTablePropsContext }\n\n/\n `Table` is a table component equipped with column sorting, row selection, and click event features.\n \n @see https://yamada-ui.com/docs/components/table\n /\nexport const Table = withContext(\n <Y extends RowData>({\n className,\n colorScheme,\n size,\n variant,\n columnFilters: columnFiltersProp,\n columnResizeMode = \"onChange\",\n columns: columnsProp,\n data,\n defaultColumnFilters,\n defaultPagination = { pageIndex: 0, pageSize: 20 },\n defaultRowSelection = {},\n defaultSorting,\n enableAutoResizeTableWidth = false,\n enableColumnResizing = false,\n enableKeyboardNavigation = true,\n enablePagination = false,\n enableRowSelection = false,\n footer,\n header,\n highlightOnHover = !!enableRowSelection,\n highlightOnSelected = !!enableRowSelection,\n initialFocusableCell = { colIndex: 0, rowIndex: 0 },\n layout,\n lineClamp,\n manualPagination,\n pagination: paginationProp,\n rowCount: totalRowCount,\n rowSelection: rowSelectionProp,\n selectOnClickRow = false,\n sortDescFirst = false,\n sorting: sortingProp,\n sortingIcon,\n state,\n stickyFooter,\n stickyHeader,\n striped,\n truncated,\n withBorder,\n withCheckbox = true,\n withColumnBorders,\n withFooterCheckbox = false,\n withFooterGroups = false,\n withScrollArea,\n cellProps,\n checkboxProps,\n footerGroupProps,\n footerProps,\n headerCheckboxProps,\n headerGroupProps,\n headerProps,\n resizableTriggerProps,\n rowCheckboxProps,\n rowProps,\n scrollAreaProps,\n sortingIconProps,\n tableProps,\n tbodyProps,\n tfootProps,\n theadProps,\n onColumnFiltersChange: onColumnFiltersChangeProp,\n onPaginationChange: onPaginationChangeProp,\n onRowClick,\n onRowDoubleClick,\n onRowSelectionChange: onRowSelectionChangeProp,\n onSortingChange: onSortingChangeProp,\n ...rest\n }: TableProps<Y>) => {\n const { t } = useI18n(\"table\")\n const initialFocus = useRef<boolean>(false)\n const ref = useRef<HTMLTableElement>(null)\n const focusedCell = useRef<null \| { colIndex: number; rowIndex: number }>(\n null,\n )\n const [rowSelection, onRowSelectionChange] = useControllableState({\n defaultValue: defaultRowSelection,\n value: rowSelectionProp,\n onChange: onRowSelectionChangeProp,\n })\n const [sorting, onSortingChange] = useControllableState({\n defaultValue: defaultSorting,\n value: sortingProp,\n onChange: onSortingChangeProp,\n })\n const [pagination, onPaginationChange] = useControllableState({\n defaultValue: defaultPagination,\n value: paginationProp,\n onChange: onPaginationChangeProp,\n })\n const [columnFilters, onColumnFiltersChange] = useControllableState({\n defaultValue: defaultColumnFilters,\n value: columnFiltersProp,\n onChange: onColumnFiltersChangeProp,\n })\n const columns = useMemo(() => {\n if (!enableRowSelection \|\| !withCheckbox) return columnsProp\n\n const clonedColumns = [...columnsProp]\n\n const header = ({ header, table }: HeaderContext<Y, any>) => {\n return (\n <Checkbox\n {...mergeProps(\n {\n checked: table.getIsAllRowsSelected(),\n indeterminate: table.getIsSomeRowsSelected(),\n indicatorProps: { outline: \"none\" },\n inputProps: {\n \"aria-label\": t(\"Select all rows\"),\n \"data-focusable\": \"\",\n tabIndex: -1,\n },\n onChange: table.getToggleAllRowsSelectedHandler(),\n },\n checkboxProps ?? {},\n runIfFn(headerCheckboxProps, header) ?? {},\n )()}\n />\n )\n }\n\n const cell = ({ row }: CellContext<Y, any>) => {\n return (\n <Checkbox\n {...mergeProps(\n {\n checked: row.getIsSelected(),\n disabled: !row.getCanSelect(),\n indeterminate: row.getIsSomeSelected(),\n indicatorProps: { outline: \"none\" },\n inputProps: {\n \"aria-label\": t(\"Select row\"),\n \"data-focusable\": \"\",\n tabIndex: -1,\n },\n onChange: row.getToggleSelectedHandler(),\n },\n checkboxProps ?? {},\n runIfFn(rowCheckboxProps, row) ?? {},\n )()}\n />\n )\n }\n\n clonedColumns.unshift({\n id: \"select\",\n cell,\n header,\n ...(withFooterCheckbox\n ? { footer: header }\n : { footerProps: { \"aria-hidden\": \"true\" } }),\n cellProps: { verticalAlign: \"middle\" },\n headerProps: { w: \"calc({spaces.4} + {space-x} 2)\" },\n })\n\n return clonedColumns\n }, [\n checkboxProps,\n columnsProp,\n enableRowSelection,\n headerCheckboxProps,\n rowCheckboxProps,\n t,\n withCheckbox,\n withFooterCheckbox,\n ])\n const table = useReactTable<Y>({\n columnResizeMode,\n columns,\n data,\n enableColumnResizing,\n enableRowSelection,\n getCoreRowModel: getCoreRowModel(),\n getFilteredRowModel: getFilteredRowModel(),\n getSortedRowModel: getSortedRowModel(),\n manualPagination,\n rowCount: totalRowCount,\n sortDescFirst,\n state: {\n columnFilters,\n pagination: enablePagination ? pagination : undefined,\n rowSelection,\n sorting: sorting as OriginalSortingState,\n ...state,\n },\n onColumnFiltersChange,\n onPaginationChange,\n onRowSelectionChange,\n onSortingChange: onSortingChange as OnChangeFn<OriginalSortingState>,\n ...(enablePagination\n ? { getPaginationRowModel: getPaginationRowModel() }\n : {}),\n ...rest,\n })\n const headerGroups = table.getHeaderGroups()\n const mergedHeaderGroups = getMergeHeaderGroups(headerGroups)\n const rows = table.getRowModel().rows\n const footerGroups = table.getFooterGroups()\n const mergedFooterGroups = getMergeFooterGroups(\n withFooterGroups ? footerGroups : [],\n )\n const headerGroupCount = headerGroups.length\n const rowCount = rows.length\n const colCount = table.getAllLeafColumns().length\n const maxColIndex = colCount - 1\n const pageIndex = enablePagination\n ? table.getState().pagination.pageIndex\n : 0\n const cellMap = useMemo(() => {\n const cellMap = new Map<string, string>()\n\n if (!enableKeyboardNavigation) return cellMap\n\n const insertCellMap = (\n id: string,\n colSpan: number,\n rowSpan: number,\n colIndex: number,\n rowIndex: number,\n ) => {\n for (let i = 0; i < colSpan; i++) {\n cellMap.set(`${colIndex + i}-${rowIndex}`, `${colIndex}-${rowIndex}`)\n }\n\n for (let i = 1; i < rowSpan; i++) {\n cellMap.set(`${colIndex}-${rowIndex + i}`, `${colIndex}-${rowIndex}`)\n }\n }\n\n const insertCellMapByHeaderGroup = (\n headerGroup: HeaderGroup<Y>,\n rowIndex: number,\n ) => {\n let placeholderCount = 0\n\n headerGroup.headers.forEach((header) => {\n const colSpan = header.colSpan \|\| 1\n const rowSpan = header.rowSpan \|\| 1\n const colIndex = header.index + placeholderCount\n\n placeholderCount += colSpan - 1\n\n insertCellMap(header.id, colSpan, rowSpan, colIndex, rowIndex)\n })\n }\n\n mergedHeaderGroups.forEach((headerGroup, rowIndex) => {\n insertCellMapByHeaderGroup(headerGroup, rowIndex)\n })\n\n rows.forEach((row, rowIndex) => {\n rowIndex += headerGroupCount\n\n row.getVisibleCells().forEach((cell) => {\n const colIndex = cell.column.getIndex()\n\n insertCellMap(cell.id, 1, 1, colIndex, rowIndex)\n })\n })\n\n mergedFooterGroups.forEach((footerGroup, rowIndex) => {\n rowIndex += headerGroupCount + rowCount\n\n insertCellMapByHeaderGroup(footerGroup, rowIndex)\n })\n\n return cellMap\n }, [\n enableKeyboardNavigation,\n headerGroupCount,\n mergedFooterGroups,\n mergedHeaderGroups,\n rows,\n rowCount,\n ])\n const context = useMemo(\n () => ({\n columnResizeMode,\n sortingIcon,\n table,\n resizableTriggerProps,\n sortingIconProps,\n }),\n [\n columnResizeMode,\n sortingIcon,\n sortingIconProps,\n resizableTriggerProps,\n table,\n ],\n )\n const getCell = (\n evOrEl:\n \| Element\n \| FocusEvent<HTMLTableElement>\n \| KeyboardEvent<HTMLTableElement>\n \| null\n \| undefined,\n ) => {\n if (!evOrEl) return\n\n const el =\n evOrEl instanceof HTMLElement\n ? evOrEl.closest(\"th, td\")\n : \"target\" in evOrEl && evOrEl.target instanceof HTMLElement\n ? evOrEl.target.closest(\"th, td\")\n : null\n\n if (!(el instanceof HTMLTableCellElement)) return\n\n const { colindex, rowindex } = el.dataset\n const { colSpan, rowSpan } = el\n\n if (!colindex \|\| !rowindex) return\n\n const colIndex = parseInt(colindex)\n const rowIndex = parseInt(rowindex)\n\n return { colIndex, colSpan, el, rowIndex, rowSpan }\n }\n const getShouldFocusCell = (colIndex: number, rowIndex: number) => {\n const [trulyColIndex, trulyRowIndex] =\n cellMap.get(`${colIndex}-${rowIndex}`)?.split(\"-\") ?? []\n\n if (!trulyColIndex \|\| !trulyRowIndex) return\n\n const targetEl = ref.current?.querySelector(\n `[data-colindex=\"${trulyColIndex}\"][data-rowindex=\"${trulyRowIndex}\"]`,\n )\n\n if (!targetEl \|\| !(targetEl instanceof HTMLTableCellElement)) return\n\n return targetEl\n }\n const removeTabIndex = (el: Element \| null \| undefined) => {\n if (!el \|\| !(el instanceof HTMLElement)) return\n\n el.tabIndex = -1\n el.querySelectorAll(\"[data-focusable]\").forEach((el) => {\n if (el instanceof HTMLElement) el.tabIndex = -1\n })\n }\n const onCellFocus = (\n el: HTMLTableCellElement \| null \| undefined,\n colIndex: number,\n rowIndex: number,\n ) => {\n const targetEl = getShouldFocusCell(colIndex, rowIndex)\n\n if (!targetEl) return\n\n focusedCell.current = { colIndex, rowIndex }\n\n removeTabIndex(el)\n\n const shouldFocusEl =\n targetEl.querySelector(\"[data-focusable]\") ?? targetEl\n\n if (shouldFocusEl instanceof HTMLElement) {\n shouldFocusEl.tabIndex = 0\n shouldFocusEl.focus()\n }\n }\n const onFocus = (ev: FocusEvent<HTMLTableElement>) => {\n if (initialFocus.current) return\n\n initialFocus.current = true\n\n const cell = getCell(ev)\n\n if (!cell) return\n\n onCellFocus(cell.el, cell.colIndex, cell.rowIndex)\n }\n const onKeyDown = (ev: KeyboardEvent<HTMLTableElement>) => {\n if (!enableKeyboardNavigation) return\n\n const cell = getCell(ev)\n\n if (!cell) return\n\n runKeyAction(ev, {\n ArrowDown: () =>\n onCellFocus(cell.el, cell.colIndex, cell.rowIndex + cell.rowSpan),\n ArrowLeft: () => onCellFocus(cell.el, cell.colIndex - 1, cell.rowIndex),\n ArrowRight: () =>\n onCellFocus(cell.el, cell.colIndex + cell.colSpan, cell.rowIndex),\n ArrowUp: () => onCellFocus(cell.el, cell.colIndex, cell.rowIndex - 1),\n End: () => onCellFocus(cell.el, maxColIndex, cell.rowIndex),\n Home: () => onCellFocus(cell.el, 0, cell.rowIndex),\n ...(enablePagination\n ? {\n PageDown: () => {\n if (!table.getCanNextPage()) return\n\n table.setPageIndex(pageIndex + 1)\n },\n PageUp: () => {\n if (!table.getCanPreviousPage()) return\n\n table.setPageIndex(pageIndex - 1)\n },\n }\n : {}),\n })\n }\n const getTabIndex = (colIndex: number, rowIndex: number) => {\n if (!enableKeyboardNavigation) return undefined\n\n return colIndex === initialFocusableCell.colIndex &&\n rowIndex === initialFocusableCell.rowIndex\n ? 0\n : undefined\n }\n\n useUpdateEffect(() => {\n if (!enableKeyboardNavigation) return\n\n const { colIndex, rowIndex } = focusedCell.current ?? initialFocusableCell\n const targetEl = getShouldFocusCell(colIndex, rowIndex)\n\n if (targetEl) targetEl.tabIndex = 0\n }, [pageIndex, enableKeyboardNavigation])\n\n return (\n <ComponentContext value={context}>\n {header ? runIfFn(header, table) : null}\n\n <NativeTable.Root\n {...mergeProps(\n {\n ref,\n className,\n style:\n enableColumnResizing && enableAutoResizeTableWidth\n ? { width: table.getCenterTotalSize() }\n : {},\n colorScheme,\n size,\n variant,\n \"aria-colcount\": colCount,\n \"aria-multiselectable\": enableRowSelection ? \"true\" : undefined,\n \"aria-rowcount\": totalRowCount \|\| data.length,\n highlightOnHover,\n highlightOnSelected,\n layout,\n role: \"grid\",\n stickyFooter,\n stickyHeader,\n striped,\n withBorder,\n withColumnBorders,\n withScrollArea,\n scrollAreaProps,\n onFocus,\n onKeyDown,\n },\n tableProps ?? {},\n )()}\n >\n <NativeTable.Thead role=\"rowgroup\" {...theadProps}>\n {mergedHeaderGroups.map((headerGroup, rowIndex) => {\n let placeholderCount = 0\n\n return (\n <NativeTable.Tr\n key={headerGroup.id}\n aria-rowindex={rowIndex + 1}\n role=\"row\"\n {...runIfFn(headerGroupProps, headerGroup)}\n >\n {headerGroup.headers.map((header) => {\n const { columnDef } = header.column\n const colIndex = header.index + placeholderCount\n const tabIndex = getTabIndex(colIndex, rowIndex)\n const canSort = header.column.getCanSort()\n const sorted = header.column.getIsSorted()\n const canResize = header.column.getCanResize()\n const resizing = header.column.getIsResizing()\n const children = header.isPlaceholder\n ? null\n : flexRender(\n header.column.columnDef.header,\n header.getContext(),\n )\n\n placeholderCount += (header.colSpan \|\| 1) - 1\n\n return (\n <NativeTable.Th\n key={header.id}\n aria-colindex={colIndex + 1}\n aria-rowindex={rowIndex + 1}\n aria-sort={\n sorted\n ? sorted === \"asc\"\n ? \"ascending\"\n : \"descending\"\n : \"none\"\n }\n data-colindex={colIndex}\n data-rowindex={rowIndex}\n colSpan={header.colSpan \|\| undefined}\n numeric={columnDef.numeric}\n pe={\n canSort\n ? \"calc((1rem * {lineHeights.moderate}) + {space-x})\"\n : undefined\n }\n position=\"relative\"\n role=\"columnheader\"\n rowSpan={header.rowSpan \|\| undefined}\n tabIndex={tabIndex}\n {...mergeProps(\n {\n css: {\n \"&:has([data-focusable]:focus-visible)\":\n focusRingStyle.outline,\n },\n style: enableColumnResizing\n ? { width: header.getSize() }\n : {},\n },\n runIfFn(headerProps, header) ?? {},\n columnDef.headerProps ?? {},\n )()}\n >\n <TruncatedText\n lineClamp={columnDef.lineClamp ?? lineClamp}\n truncated={columnDef.truncated ?? truncated}\n >\n {children}\n </TruncatedText>\n\n {canSort ? (\n <SortingIcon\n sorted={sorted}\n onClick={header.column.getToggleSortingHandler()}\n />\n ) : null}\n\n {canResize ? (\n <ResizableTrigger\n resizing={resizing}\n onDoubleClick={header.column.resetSize}\n onMouseDown={header.getResizeHandler()}\n onTouchStart={header.getResizeHandler()}\n />\n ) : null}\n </NativeTable.Th>\n )\n })}\n </NativeTable.Tr>\n )\n })}\n </NativeTable.Thead>\n\n <NativeTable.Tbody role=\"rowgroup\" {...tbodyProps}>\n {rows.map((row, rowIndex) => {\n rowIndex += headerGroupCount\n\n const selected = !!rowSelection[row.id]\n const disabled =\n isFunction(enableRowSelection) && !enableRowSelection(row)\n\n return (\n <NativeTable.Tr\n id={row.id}\n key={row.id}\n aria-disabled={ariaAttr(disabled)}\n aria-rowindex={rowIndex + 1}\n aria-selected={ariaAttr(selected)}\n data-disabled={dataAttr(disabled)}\n data-selected={dataAttr(selected)}\n role=\"row\"\n {...mergeProps(\n {\n onClick:\n !disabled && selectOnClickRow\n ? () => row.toggleSelected(!selected)\n : undefined,\n },\n {\n onClick: !disabled ? () => onRowClick?.(row) : undefined,\n onDoubleClick: !disabled\n ? () => onRowDoubleClick?.(row)\n : undefined,\n },\n runIfFn(rowProps, row) ?? {},\n )()}\n >\n {row.getVisibleCells().map((cell) => {\n const { columnDef } = cell.column\n const colIndex = cell.column.getIndex()\n const tabIndex = getTabIndex(colIndex, rowIndex)\n const children = flexRender(\n cell.column.columnDef.cell,\n cell.getContext(),\n )\n\n return (\n <NativeTable.Td\n key={cell.id}\n aria-colindex={colIndex + 1}\n aria-rowindex={rowIndex + 1}\n data-colindex={colIndex}\n data-rowindex={rowIndex}\n numeric={columnDef.numeric}\n role=\"gridcell\"\n tabIndex={tabIndex}\n {...mergeProps(\n {\n css: {\n \"&:has([data-focusable]:focus-visible)\":\n focusRingStyle.outline,\n },\n },\n runIfFn(cellProps, cell) ?? {},\n columnDef.cellProps ?? {},\n )()}\n >\n <TruncatedText\n lineClamp={columnDef.lineClamp ?? lineClamp}\n truncated={columnDef.truncated ?? truncated}\n >\n {children}\n </TruncatedText>\n </NativeTable.Td>\n )\n })}\n </NativeTable.Tr>\n )\n })}\n </NativeTable.Tbody>\n\n {withFooterGroups ? (\n <NativeTable.Tfoot role=\"rowgroup\" {...tfootProps}>\n {mergedFooterGroups.map((footerGroup, rowIndex) => {\n rowIndex += headerGroupCount + rowCount\n\n let placeholderCount = 0\n\n return (\n <NativeTable.Tr\n key={footerGroup.id}\n aria-rowindex={rowIndex + 1}\n role=\"row\"\n {...runIfFn(footerGroupProps, footerGroup)}\n >\n {footerGroup.headers.map((header) => {\n const { columnDef } = header.column\n const colIndex = header.index + placeholderCount\n const tabIndex = getTabIndex(colIndex, rowIndex)\n const children = header.isPlaceholder\n ? null\n : flexRender(\n header.column.columnDef.footer,\n header.getContext(),\n )\n\n placeholderCount += (header.colSpan \|\| 1) - 1\n\n return (\n <NativeTable.Td\n key={header.id}\n aria-colindex={colIndex + 1}\n aria-rowindex={rowIndex + 1}\n data-colindex={colIndex}\n data-rowindex={rowIndex}\n colSpan={header.colSpan \|\| undefined}\n numeric={columnDef.numeric}\n role=\"gridcell\"\n rowSpan={header.rowSpan \|\| undefined}\n tabIndex={tabIndex}\n {...mergeProps(\n {\n css: {\n \"&:has([data-focusable]:focus-visible)\":\n focusRingStyle.outline,\n },\n },\n runIfFn(footerProps, header) ?? {},\n columnDef.footerProps ?? {},\n )()}\n >\n <TruncatedText\n lineClamp={columnDef.lineClamp ?? lineClamp}\n truncated={columnDef.truncated ?? truncated}\n >\n {children}\n </TruncatedText>\n </NativeTable.Td>\n )\n })}\n </NativeTable.Tr>\n )\n })}\n </NativeTable.Tfoot>\n ) : null}\n </NativeTable.Root>\n\n {footer ? runIfFn(footer, table) : null}\n </ComponentContext>\n )\n },\n)() as GenericsComponent<{\n <Y extends RowData>(props: TableProps<Y>): ReactElement\n}>\n\ninterface SortingIconProps extends HTMLStyledProps<\"button\"> {\n sorted: false \| SortDirection\n}\n\nconst SortingIcon: FC<SortingIconProps> = ({ sorted, ...rest }) => {\n const { t } = useI18n(\"table\")\n const { sortingIcon, sortingIconProps = {} } = useComponentContext()\n const Icon = sorted ? ChevronUpIcon : ChevronsUpDownIcon\n\n return (\n <styled.button\n type=\"button\"\n layerStyle=\"ghost\"\n colorScheme=\"mono\"\n aria-label={t(\n sorted\n ? sorted === \"desc\"\n ? \"Sort descending\"\n : \"Sort ascending\"\n : \"Clear sorting\",\n )}\n data-focusable\n aspectRatio=\"1\"\n cursor=\"pointer\"\n display=\"center\"\n focusVisibleRing=\"none\"\n h=\"calc(1em * {lineHeights.moderate})\"\n position=\"absolute\"\n right=\"{space-x}\"\n rounded=\"l1\"\n tabIndex={-1}\n top=\"50%\"\n transform=\"translateY(-50%)\"\n transitionDuration=\"moderate\"\n transitionProperty=\"common\"\n _hover={{ layerStyle: \"ghost.hover\" }}\n {...mergeProps(rest, sortingIconProps)()}\n >\n {runIfFn(sortingIcon, sorted) ?? (\n <Icon transform={`rotate(${sorted === \"desc\" ? 180 : 0}deg)`} />\n )}\n </styled.button>\n )\n}\n\ninterface ResizableTriggerProps extends HTMLStyledProps {\n resizing: boolean\n}\n\nconst ResizableTrigger: FC<ResizableTriggerProps> = ({ resizing, ...rest }) => {\n const {\n columnResizeMode,\n table,\n resizableTriggerProps = {},\n } = useComponentContext()\n const offset = table.getState().columnSizingInfo.deltaOffset\n\n return (\n <styled.div\n data-active={dataAttr(resizing)}\n bg=\"colorScheme.solid\"\n cursor=\"col-resize\"\n insetY=\"0\"\n opacity={{ base: \"0\", _hover: \"1\", _active: \"1\" }}\n position=\"absolute\"\n right=\"0\"\n touchAction=\"none\"\n transform={`translateX(${columnResizeMode === \"onEnd\" && resizing && offset ? `${offset}px` : \"50%\"})`}\n userSelect=\"none\"\n w=\"1\"\n {...mergeProps(rest, resizableTriggerProps)()}\n />\n )\n}\n\ninterface TruncatedTextProps extends HTMLStyledProps<\"span\"> {}\n\nconst TruncatedText: FC<TruncatedTextProps> = ({\n children,\n lineClamp,\n truncated,\n ...rest\n}) => {\n if (lineClamp \|\| truncated) {\n return (\n <styled.span\n lineClamp={lineClamp}\n truncated={truncated}\n wordBreak=\"break-all\"\n {...rest}\n >\n {children}\n </styled.span>\n )\n } else {\n return children\n }\n}\n"],"mappings":"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"}
1	+ {"version":3,"file":"table.cjs","names":["createComponent","useI18n","useControllableState","header","Checkbox","mergeProps","table","cellMap","el","focusRingStyle","SortingIcon: FC<SortingIconProps>","ChevronUpIcon","ChevronsUpDownIcon","styled","ResizableTrigger: FC<ResizableTriggerProps>","TruncatedText: FC<TruncatedTextProps>"],"sources":["../../../../src/components/table/table.tsx"],"sourcesContent":["\"use client\"\n\nimport type {\n AccessorFn,\n Cell,\n CellContext,\n ColumnDef,\n ColumnDefTemplate,\n ColumnFiltersColumnDef,\n ColumnFiltersState,\n ColumnMeta,\n ColumnPinningColumnDef,\n ColumnSizingColumnDef,\n GlobalFilterColumnDef,\n GroupingColumnDef,\n Header,\n HeaderContext,\n HeaderGroup,\n OnChangeFn,\n SortingState as OriginalSortingState,\n PaginationState,\n Table as ReactTable,\n Row,\n RowData,\n RowSelectionState,\n SortDirection,\n SortingColumnDef,\n TableOptions,\n VisibilityColumnDef,\n} from \"@tanstack/react-table\"\nimport type { FC, FocusEvent, KeyboardEvent, ReactElement } from \"react\"\nimport type { CSSProps, GenericsComponent, HTMLStyledProps } from \"../../core\"\nimport type { ReactNodeOrFunction, TransformProps } from \"../../utils\"\nimport type { CheckboxProps } from \"../checkbox\"\nimport {\n createColumnHelper,\n flexRender,\n getCoreRowModel,\n getFilteredRowModel,\n getPaginationRowModel,\n getSortedRowModel,\n useReactTable,\n} from \"@tanstack/react-table\"\nimport { useMemo, useRef } from \"react\"\nimport { createComponent, focusRingStyle, mergeProps, styled } from \"../../core\"\nimport { useControllableState } from \"../../hooks/use-controllable-state\"\nimport { useI18n } from \"../../providers/i18n-provider\"\nimport {\n ariaAttr,\n dataAttr,\n isFunction,\n runIfFn,\n runKeyAction,\n useUpdateEffect,\n} from \"../../utils\"\nimport { Checkbox } from \"../checkbox\"\nimport { ChevronsUpDownIcon, ChevronUpIcon } from \"../icon\"\nimport { NativeTable } from \"../native-table\"\n\ndeclare module \"@tanstack/react-table\" {\n interface ColumnDefExtensions<TData extends RowData, TValue = unknown>\n extends\n VisibilityColumnDef,\n ColumnPinningColumnDef,\n ColumnFiltersColumnDef<TData>,\n GlobalFilterColumnDef,\n SortingColumnDef<TData>,\n GroupingColumnDef<TData, TValue>,\n ColumnSizingColumnDef {}\n\n interface ColumnDefBase<TData extends RowData, TValue = unknown>\n extends\n ColumnDefExtensions<TData, TValue>,\n Pick<CSSProps, \"lineClamp\" \| \"truncated\">,\n Pick<NativeTable.TdProps, \"numeric\"> {\n cell?: ColumnDefTemplate<CellContext<TData, TValue>>\n footer?: ColumnDefTemplate<HeaderContext<TData, TValue>>\n getUniqueValues?: AccessorFn<TData, unknown[]>\n meta?: ColumnMeta<TData, TValue>\n cellProps?: NativeTable.TdProps\n footerProps?: NativeTable.ThProps\n headerProps?: NativeTable.ThProps\n }\n}\n\nexport { createColumnHelper }\nexport type {\n ColumnDef,\n ColumnFiltersState,\n PaginationState,\n RowSelectionState,\n SortDirection,\n}\n\nfunction getMergeHeaderGroups(\n headerGroups: HeaderGroup<any>[],\n): HeaderGroup<any>[] {\n if (headerGroups.length <= 1) return headerGroups\n\n const columnsIds = new Set()\n\n return headerGroups.map((headerGroup, depth, { length: fullDepth }) => {\n return {\n ...headerGroup,\n headers: headerGroup.headers\n .filter((header) => !columnsIds.has(header.column.id))\n .map((header) => {\n columnsIds.add(header.column.id)\n\n return header.isPlaceholder\n ? { ...header, isPlaceholder: false, rowSpan: fullDepth - depth }\n : { ...header, rowSpan: 1 }\n }),\n }\n })\n}\n\nfunction getMergeFooterGroups(\n headerGroups: HeaderGroup<any>[],\n): HeaderGroup<any>[] {\n if (headerGroups.length <= 1) return headerGroups\n\n return headerGroups.map((headerGroup, depth) => {\n const nextHeaderGroups = headerGroups.slice(depth + 1)\n\n return {\n ...headerGroup,\n headers: headerGroup.headers\n .filter((header) => !header.isPlaceholder)\n .map((header) => {\n if (nextHeaderGroups.length === 0) return header\n\n const rowSpan = nextHeaderGroups.reduce((acc, nextHeaderGroup) => {\n const hasNextHeader = nextHeaderGroup.headers.some(\n (nextHeader) => nextHeader.column.id === header.column.id,\n )\n\n return acc + (hasNextHeader ? 1 : 0)\n }, 1)\n\n return { ...header, rowSpan }\n }),\n }\n })\n}\n\nexport interface ColumnSort<Y extends RowData> {\n desc: boolean\n id: keyof Y\n}\nexport type SortingState<Y extends RowData> = ColumnSort<Y>[]\n\ninterface ComponentContext extends Pick<\n TableProps<any>,\n \| \"columnResizeMode\"\n \| \"resizableTriggerProps\"\n \| \"sortingIcon\"\n \| \"sortingIconProps\"\n> {\n table: ReactTable<any>\n}\n\ninterface OmittedTableOptions<Y extends RowData> extends Omit<\n TableOptions<Y>,\n \| \"getCoreRowModel\"\n \| \"onColumnFiltersChange\"\n \| \"onPaginationChange\"\n \| \"onSortingChange\"\n> {}\n\ninterface PickedNativeTableProps extends Pick<\n NativeTable.RootProps,\n \| \"className\"\n \| \"highlightOnHover\"\n \| \"highlightOnSelected\"\n \| \"layout\"\n \| \"scrollAreaProps\"\n \| \"size\"\n \| \"stickyFooter\"\n \| \"stickyHeader\"\n \| \"striped\"\n \| \"suppressHydrationWarning\"\n \| \"variant\"\n \| \"withBorder\"\n \| \"withColumnBorders\"\n \| \"withScrollArea\"\n> {}\n\nexport interface TableProps<Y extends RowData>\n extends\n OmittedTableOptions<Y>,\n PickedNativeTableProps,\n Pick<CSSProps, \"colorScheme\" \| \"lineClamp\" \| \"truncated\"> {\n /*\n The column filters state of the table.\n /\n columnFilters?: ColumnFiltersState\n /\n The default column filters state of the table.\n /\n defaultColumnFilters?: ColumnFiltersState\n /\n The default pagination state of the table.\n /\n defaultPagination?: PaginationState\n /\n The default row selection state of the table.\n /\n defaultRowSelection?: RowSelectionState\n /\n The default sorting state of the table.\n /\n defaultSorting?: SortingState<Y>\n /\n If `true`, the table width will be automatically resized to the content.\n \n @default false\n /\n enableAutoResizeTableWidth?: boolean\n /\n If `true`, the keyboard navigation will be enabled.\n \n @default true\n /\n enableKeyboardNavigation?: boolean\n /\n If `true`, the pagination will be enabled.\n \n @default false\n /\n enablePagination?: boolean\n /\n The footer of the table.\n /\n footer?: ReactNodeOrFunction<ReactTable<Y>>\n /\n The header of the table.\n /\n header?: ReactNodeOrFunction<ReactTable<Y>>\n /\n The initial focusable cell of the table.\n \n @default {rowIndex: 0, colIndex: 0}\n /\n initialFocusableCell?: { colIndex: number; rowIndex: number }\n /\n The pagination state of the table.\n /\n pagination?: PaginationState\n /\n The row selection state of the table.\n /\n rowSelection?: RowSelectionState\n /\n If `true`, the row will be selected when the row is clicked.\n \n @default false\n /\n selectOnClickRow?: boolean\n /\n The sorting state of the table.\n /\n sorting?: SortingState<Y>\n /\n The sorting icon of the table.\n /\n sortingIcon?: ReactNodeOrFunction<false \| SortDirection>\n /\n If `true`, the table will have a checkbox column.\n \n @default true\n /\n withCheckbox?: boolean\n /\n If `true`, the table will have a checkbox in the footer.\n \n @default false\n /\n withFooterCheckbox?: boolean\n /\n If `true`, the table will have footer groups.\n \n @default false\n /\n withFooterGroups?: boolean\n /\n The props for the table cell.\n /\n cellProps?: TransformProps<NativeTable.TdProps, Cell<Y, unknown>>\n /\n The props for the checkbox.\n /\n checkboxProps?: CheckboxProps\n /\n The props for the table footer group.\n /\n footerGroupProps?: TransformProps<NativeTable.TrProps, HeaderGroup<Y>>\n /\n The props for the table footer.\n /\n footerProps?: TransformProps<NativeTable.ThProps, Header<Y, unknown>>\n /\n The props for the table header checkbox.\n /\n headerCheckboxProps?: TransformProps<CheckboxProps, Header<Y, unknown>>\n /\n The props for the table header group.\n /\n headerGroupProps?: TransformProps<NativeTable.TrProps, HeaderGroup<Y>>\n /\n The props for the table header.\n /\n headerProps?: TransformProps<NativeTable.ThProps, Header<Y, unknown>>\n /\n The props for the resizable trigger.\n /\n resizableTriggerProps?: TransformProps<\n Omit<ResizableTriggerProps, \"resizing\">,\n Header<Y, unknown>\n >\n /\n The props for the table row checkbox.\n /\n rowCheckboxProps?: TransformProps<CheckboxProps, Row<Y>>\n /\n The props for the table row.\n /\n rowProps?: TransformProps<NativeTable.TrProps, Row<Y>>\n /\n The props for the sorting icon.\n /\n sortingIconProps?: TransformProps<\n Omit<SortingIconProps, \"sorted\">,\n Header<Y, unknown>\n >\n /\n The props for the table.\n /\n tableProps?: NativeTable.RootProps\n /\n The props for the table tbody.\n /\n tbodyProps?: NativeTable.TbodyProps\n /\n The props for the table tfoot.\n /\n tfootProps?: NativeTable.TfootProps\n /\n The props for the table thead.\n /\n theadProps?: NativeTable.TheadProps\n /\n The callback invoked when the column filters state changes.\n /\n onColumnFiltersChange?: (columnFilters: ColumnFiltersState) => void\n /\n The callback invoked when the pagination state changes.\n /\n onPaginationChange?: (pagination: PaginationState) => void\n /\n The callback invoked when the row is clicked.\n /\n onRowClick?: (row: Row<Y>) => void\n /\n The callback invoked when the row is double clicked.\n /\n onRowDoubleClick?: (row: Row<Y>) => void\n /\n The callback invoked when the sorting state changes.\n /\n onSortingChange?: (sorting: SortingState<Y>) => void\n}\n\nconst {\n ComponentContext,\n PropsContext: TablePropsContext,\n useComponentContext,\n usePropsContext: useTablePropsContext,\n withContext,\n} = createComponent<TableProps<any>, any, ComponentContext>(\"table\")\n\nexport { TablePropsContext, useTablePropsContext }\n\n/\n `Table` is a table component equipped with column sorting, row selection, and click event features.\n \n @see https://yamada-ui.com/docs/components/table\n /\nexport const Table = withContext(\n <Y extends RowData>({\n className,\n colorScheme,\n size,\n variant,\n columnFilters: columnFiltersProp,\n columnResizeMode = \"onChange\",\n columns: columnsProp,\n data,\n defaultColumnFilters,\n defaultPagination = { pageIndex: 0, pageSize: 20 },\n defaultRowSelection = {},\n defaultSorting,\n enableAutoResizeTableWidth = false,\n enableColumnResizing = false,\n enableKeyboardNavigation = true,\n enablePagination = false,\n enableRowSelection = false,\n footer,\n header,\n highlightOnHover = !!enableRowSelection,\n highlightOnSelected = !!enableRowSelection,\n initialFocusableCell = { colIndex: 0, rowIndex: 0 },\n layout,\n lineClamp,\n manualPagination,\n pagination: paginationProp,\n rowCount: totalRowCount,\n rowSelection: rowSelectionProp,\n selectOnClickRow = false,\n sortDescFirst = false,\n sorting: sortingProp,\n sortingIcon,\n state,\n stickyFooter,\n stickyHeader,\n striped,\n suppressHydrationWarning,\n truncated,\n withBorder,\n withCheckbox = true,\n withColumnBorders,\n withFooterCheckbox = false,\n withFooterGroups = false,\n withScrollArea,\n cellProps,\n checkboxProps,\n footerGroupProps,\n footerProps,\n headerCheckboxProps,\n headerGroupProps,\n headerProps,\n resizableTriggerProps,\n rowCheckboxProps,\n rowProps,\n scrollAreaProps,\n sortingIconProps,\n tableProps,\n tbodyProps,\n tfootProps,\n theadProps,\n onColumnFiltersChange: onColumnFiltersChangeProp,\n onPaginationChange: onPaginationChangeProp,\n onRowClick,\n onRowDoubleClick,\n onRowSelectionChange: onRowSelectionChangeProp,\n onSortingChange: onSortingChangeProp,\n ...rest\n }: TableProps<Y>) => {\n const { t } = useI18n(\"table\")\n const initialFocus = useRef<boolean>(false)\n const ref = useRef<HTMLTableElement>(null)\n const focusedCell = useRef<null \| { colIndex: number; rowIndex: number }>(\n null,\n )\n const [rowSelection, onRowSelectionChange] = useControllableState({\n defaultValue: defaultRowSelection,\n value: rowSelectionProp,\n onChange: onRowSelectionChangeProp,\n })\n const [sorting, onSortingChange] = useControllableState({\n defaultValue: defaultSorting,\n value: sortingProp,\n onChange: onSortingChangeProp,\n })\n const [pagination, onPaginationChange] = useControllableState({\n defaultValue: defaultPagination,\n value: paginationProp,\n onChange: onPaginationChangeProp,\n })\n const [columnFilters, onColumnFiltersChange] = useControllableState({\n defaultValue: defaultColumnFilters,\n value: columnFiltersProp,\n onChange: onColumnFiltersChangeProp,\n })\n const columns = useMemo(() => {\n if (!enableRowSelection \|\| !withCheckbox) return columnsProp\n\n const clonedColumns = [...columnsProp]\n\n const header = ({ header, table }: HeaderContext<Y, any>) => {\n return (\n <Checkbox\n {...mergeProps(\n {\n checked: table.getIsAllRowsSelected(),\n indeterminate: table.getIsSomeRowsSelected(),\n indicatorProps: { outline: \"none\" },\n inputProps: {\n \"aria-label\": t(\"Select all rows\"),\n \"data-focusable\": \"\",\n tabIndex: -1,\n },\n onChange: table.getToggleAllRowsSelectedHandler(),\n },\n checkboxProps ?? {},\n runIfFn(headerCheckboxProps, header) ?? {},\n )()}\n />\n )\n }\n\n const cell = ({ row }: CellContext<Y, any>) => {\n return (\n <Checkbox\n {...mergeProps(\n {\n checked: row.getIsSelected(),\n disabled: !row.getCanSelect(),\n indeterminate: row.getIsSomeSelected(),\n indicatorProps: { outline: \"none\" },\n inputProps: {\n \"aria-label\": t(\"Select row\"),\n \"data-focusable\": \"\",\n tabIndex: -1,\n },\n onChange: row.getToggleSelectedHandler(),\n },\n checkboxProps ?? {},\n runIfFn(rowCheckboxProps, row) ?? {},\n )()}\n />\n )\n }\n\n clonedColumns.unshift({\n id: \"select\",\n cell,\n header,\n ...(withFooterCheckbox\n ? { footer: header }\n : { footerProps: { \"aria-hidden\": \"true\" } }),\n cellProps: { verticalAlign: \"middle\" },\n headerProps: { w: \"calc({spaces.4} + {space-x} 2)\" },\n })\n\n return clonedColumns\n }, [\n checkboxProps,\n columnsProp,\n enableRowSelection,\n headerCheckboxProps,\n rowCheckboxProps,\n t,\n withCheckbox,\n withFooterCheckbox,\n ])\n const table = useReactTable<Y>({\n columnResizeMode,\n columns,\n data,\n enableColumnResizing,\n enableRowSelection,\n getCoreRowModel: getCoreRowModel(),\n getFilteredRowModel: getFilteredRowModel(),\n getSortedRowModel: getSortedRowModel(),\n manualPagination,\n rowCount: totalRowCount,\n sortDescFirst,\n state: {\n columnFilters,\n pagination: enablePagination ? pagination : undefined,\n rowSelection,\n sorting: sorting as OriginalSortingState,\n ...state,\n },\n onColumnFiltersChange,\n onPaginationChange,\n onRowSelectionChange,\n onSortingChange: onSortingChange as OnChangeFn<OriginalSortingState>,\n ...(enablePagination\n ? { getPaginationRowModel: getPaginationRowModel() }\n : {}),\n ...rest,\n })\n const headerGroups = table.getHeaderGroups()\n const mergedHeaderGroups = getMergeHeaderGroups(headerGroups)\n const rows = table.getRowModel().rows\n const footerGroups = table.getFooterGroups()\n const mergedFooterGroups = getMergeFooterGroups(\n withFooterGroups ? footerGroups : [],\n )\n const headerGroupCount = headerGroups.length\n const rowCount = rows.length\n const colCount = table.getAllLeafColumns().length\n const maxColIndex = colCount - 1\n const pageIndex = enablePagination\n ? table.getState().pagination.pageIndex\n : 0\n const cellMap = useMemo(() => {\n const cellMap = new Map<string, string>()\n\n if (!enableKeyboardNavigation) return cellMap\n\n const insertCellMap = (\n id: string,\n colSpan: number,\n rowSpan: number,\n colIndex: number,\n rowIndex: number,\n ) => {\n for (let i = 0; i < colSpan; i++) {\n cellMap.set(`${colIndex + i}-${rowIndex}`, `${colIndex}-${rowIndex}`)\n }\n\n for (let i = 1; i < rowSpan; i++) {\n cellMap.set(`${colIndex}-${rowIndex + i}`, `${colIndex}-${rowIndex}`)\n }\n }\n\n const insertCellMapByHeaderGroup = (\n headerGroup: HeaderGroup<Y>,\n rowIndex: number,\n ) => {\n let placeholderCount = 0\n\n headerGroup.headers.forEach((header) => {\n const colSpan = header.colSpan \|\| 1\n const rowSpan = header.rowSpan \|\| 1\n const colIndex = header.index + placeholderCount\n\n placeholderCount += colSpan - 1\n\n insertCellMap(header.id, colSpan, rowSpan, colIndex, rowIndex)\n })\n }\n\n mergedHeaderGroups.forEach((headerGroup, rowIndex) => {\n insertCellMapByHeaderGroup(headerGroup, rowIndex)\n })\n\n rows.forEach((row, rowIndex) => {\n rowIndex += headerGroupCount\n\n row.getVisibleCells().forEach((cell) => {\n const colIndex = cell.column.getIndex()\n\n insertCellMap(cell.id, 1, 1, colIndex, rowIndex)\n })\n })\n\n mergedFooterGroups.forEach((footerGroup, rowIndex) => {\n rowIndex += headerGroupCount + rowCount\n\n insertCellMapByHeaderGroup(footerGroup, rowIndex)\n })\n\n return cellMap\n }, [\n enableKeyboardNavigation,\n headerGroupCount,\n mergedFooterGroups,\n mergedHeaderGroups,\n rows,\n rowCount,\n ])\n const context = useMemo(\n () => ({\n columnResizeMode,\n sortingIcon,\n table,\n resizableTriggerProps,\n sortingIconProps,\n }),\n [\n columnResizeMode,\n sortingIcon,\n sortingIconProps,\n resizableTriggerProps,\n table,\n ],\n )\n const getCell = (\n evOrEl:\n \| Element\n \| FocusEvent<HTMLTableElement>\n \| KeyboardEvent<HTMLTableElement>\n \| null\n \| undefined,\n ) => {\n if (!evOrEl) return\n\n const el =\n evOrEl instanceof HTMLElement\n ? evOrEl.closest(\"th, td\")\n : \"target\" in evOrEl && evOrEl.target instanceof HTMLElement\n ? evOrEl.target.closest(\"th, td\")\n : null\n\n if (!(el instanceof HTMLTableCellElement)) return\n\n const { colindex, rowindex } = el.dataset\n const { colSpan, rowSpan } = el\n\n if (!colindex \|\| !rowindex) return\n\n const colIndex = parseInt(colindex)\n const rowIndex = parseInt(rowindex)\n\n return { colIndex, colSpan, el, rowIndex, rowSpan }\n }\n const getShouldFocusCell = (colIndex: number, rowIndex: number) => {\n const [trulyColIndex, trulyRowIndex] =\n cellMap.get(`${colIndex}-${rowIndex}`)?.split(\"-\") ?? []\n\n if (!trulyColIndex \|\| !trulyRowIndex) return\n\n const targetEl = ref.current?.querySelector(\n `[data-colindex=\"${trulyColIndex}\"][data-rowindex=\"${trulyRowIndex}\"]`,\n )\n\n if (!targetEl \|\| !(targetEl instanceof HTMLTableCellElement)) return\n\n return targetEl\n }\n const removeTabIndex = (el: Element \| null \| undefined) => {\n if (!el \|\| !(el instanceof HTMLElement)) return\n\n el.tabIndex = -1\n el.querySelectorAll(\"[data-focusable]\").forEach((el) => {\n if (el instanceof HTMLElement) el.tabIndex = -1\n })\n }\n const onCellFocus = (\n el: HTMLTableCellElement \| null \| undefined,\n colIndex: number,\n rowIndex: number,\n ) => {\n const targetEl = getShouldFocusCell(colIndex, rowIndex)\n\n if (!targetEl) return\n\n focusedCell.current = { colIndex, rowIndex }\n\n removeTabIndex(el)\n\n const shouldFocusEl =\n targetEl.querySelector(\"[data-focusable]\") ?? targetEl\n\n if (shouldFocusEl instanceof HTMLElement) {\n shouldFocusEl.tabIndex = 0\n shouldFocusEl.focus()\n }\n }\n const onFocus = (ev: FocusEvent<HTMLTableElement>) => {\n if (initialFocus.current) return\n\n initialFocus.current = true\n\n const cell = getCell(ev)\n\n if (!cell) return\n\n onCellFocus(cell.el, cell.colIndex, cell.rowIndex)\n }\n const onKeyDown = (ev: KeyboardEvent<HTMLTableElement>) => {\n if (!enableKeyboardNavigation) return\n\n const cell = getCell(ev)\n\n if (!cell) return\n\n runKeyAction(ev, {\n ArrowDown: () =>\n onCellFocus(cell.el, cell.colIndex, cell.rowIndex + cell.rowSpan),\n ArrowLeft: () => onCellFocus(cell.el, cell.colIndex - 1, cell.rowIndex),\n ArrowRight: () =>\n onCellFocus(cell.el, cell.colIndex + cell.colSpan, cell.rowIndex),\n ArrowUp: () => onCellFocus(cell.el, cell.colIndex, cell.rowIndex - 1),\n End: () => onCellFocus(cell.el, maxColIndex, cell.rowIndex),\n Home: () => onCellFocus(cell.el, 0, cell.rowIndex),\n ...(enablePagination\n ? {\n PageDown: () => {\n if (!table.getCanNextPage()) return\n\n table.setPageIndex(pageIndex + 1)\n },\n PageUp: () => {\n if (!table.getCanPreviousPage()) return\n\n table.setPageIndex(pageIndex - 1)\n },\n }\n : {}),\n })\n }\n const getTabIndex = (colIndex: number, rowIndex: number) => {\n if (!enableKeyboardNavigation) return undefined\n\n return colIndex === initialFocusableCell.colIndex &&\n rowIndex === initialFocusableCell.rowIndex\n ? 0\n : undefined\n }\n\n useUpdateEffect(() => {\n if (!enableKeyboardNavigation) return\n\n const { colIndex, rowIndex } = focusedCell.current ?? initialFocusableCell\n const targetEl = getShouldFocusCell(colIndex, rowIndex)\n\n if (targetEl) targetEl.tabIndex = 0\n }, [pageIndex, enableKeyboardNavigation])\n\n return (\n <ComponentContext value={context}>\n {header ? runIfFn(header, table) : null}\n\n <NativeTable.Root\n {...mergeProps(\n {\n ref,\n className,\n style:\n enableColumnResizing && enableAutoResizeTableWidth\n ? { width: table.getCenterTotalSize() }\n : {},\n colorScheme,\n size,\n variant,\n \"aria-colcount\": colCount,\n \"aria-multiselectable\": enableRowSelection ? \"true\" : undefined,\n \"aria-rowcount\": totalRowCount \|\| data.length,\n highlightOnHover,\n highlightOnSelected,\n layout,\n role: \"grid\",\n stickyFooter,\n stickyHeader,\n striped,\n suppressHydrationWarning,\n withBorder,\n withColumnBorders,\n withScrollArea,\n scrollAreaProps,\n onFocus,\n onKeyDown,\n },\n tableProps ?? {},\n )()}\n >\n <NativeTable.Thead role=\"rowgroup\" {...theadProps}>\n {mergedHeaderGroups.map((headerGroup, rowIndex) => {\n let placeholderCount = 0\n\n return (\n <NativeTable.Tr\n key={headerGroup.id}\n aria-rowindex={rowIndex + 1}\n role=\"row\"\n {...runIfFn(headerGroupProps, headerGroup)}\n >\n {headerGroup.headers.map((header) => {\n const { columnDef } = header.column\n const colIndex = header.index + placeholderCount\n const tabIndex = getTabIndex(colIndex, rowIndex)\n const canSort = header.column.getCanSort()\n const sorted = header.column.getIsSorted()\n const canResize = header.column.getCanResize()\n const resizing = header.column.getIsResizing()\n const children = header.isPlaceholder\n ? null\n : flexRender(\n header.column.columnDef.header,\n header.getContext(),\n )\n\n placeholderCount += (header.colSpan \|\| 1) - 1\n\n return (\n <NativeTable.Th\n key={header.id}\n aria-colindex={colIndex + 1}\n aria-rowindex={rowIndex + 1}\n aria-sort={\n sorted\n ? sorted === \"asc\"\n ? \"ascending\"\n : \"descending\"\n : \"none\"\n }\n data-colindex={colIndex}\n data-rowindex={rowIndex}\n colSpan={header.colSpan \|\| undefined}\n numeric={columnDef.numeric}\n pe={\n canSort\n ? \"calc((1rem * {lineHeights.moderate}) + {space-x})\"\n : undefined\n }\n position=\"relative\"\n role=\"columnheader\"\n rowSpan={header.rowSpan \|\| undefined}\n tabIndex={tabIndex}\n {...mergeProps(\n {\n css: {\n \"&:has([data-focusable]:focus-visible)\":\n focusRingStyle.outline,\n },\n style: enableColumnResizing\n ? { width: header.getSize() }\n : {},\n },\n runIfFn(headerProps, header) ?? {},\n columnDef.headerProps ?? {},\n )()}\n >\n <TruncatedText\n lineClamp={columnDef.lineClamp ?? lineClamp}\n suppressHydrationWarning={suppressHydrationWarning}\n truncated={columnDef.truncated ?? truncated}\n >\n {children}\n </TruncatedText>\n\n {canSort ? (\n <SortingIcon\n sorted={sorted}\n suppressHydrationWarning={suppressHydrationWarning}\n onClick={header.column.getToggleSortingHandler()}\n />\n ) : null}\n\n {canResize ? (\n <ResizableTrigger\n resizing={resizing}\n suppressHydrationWarning={suppressHydrationWarning}\n onDoubleClick={header.column.resetSize}\n onMouseDown={header.getResizeHandler()}\n onTouchStart={header.getResizeHandler()}\n />\n ) : null}\n </NativeTable.Th>\n )\n })}\n </NativeTable.Tr>\n )\n })}\n </NativeTable.Thead>\n\n <NativeTable.Tbody role=\"rowgroup\" {...tbodyProps}>\n {rows.map((row, rowIndex) => {\n rowIndex += headerGroupCount\n\n const selected = !!rowSelection[row.id]\n const disabled =\n isFunction(enableRowSelection) && !enableRowSelection(row)\n\n return (\n <NativeTable.Tr\n id={row.id}\n key={row.id}\n aria-disabled={ariaAttr(disabled)}\n aria-rowindex={rowIndex + 1}\n aria-selected={ariaAttr(selected)}\n data-disabled={dataAttr(disabled)}\n data-selected={dataAttr(selected)}\n role=\"row\"\n {...mergeProps(\n {\n onClick:\n !disabled && selectOnClickRow\n ? () => row.toggleSelected(!selected)\n : undefined,\n },\n {\n onClick: !disabled ? () => onRowClick?.(row) : undefined,\n onDoubleClick: !disabled\n ? () => onRowDoubleClick?.(row)\n : undefined,\n },\n runIfFn(rowProps, row) ?? {},\n )()}\n >\n {row.getVisibleCells().map((cell) => {\n const { columnDef } = cell.column\n const colIndex = cell.column.getIndex()\n const tabIndex = getTabIndex(colIndex, rowIndex)\n const children = flexRender(\n cell.column.columnDef.cell,\n cell.getContext(),\n )\n\n return (\n <NativeTable.Td\n key={cell.id}\n aria-colindex={colIndex + 1}\n aria-rowindex={rowIndex + 1}\n data-colindex={colIndex}\n data-rowindex={rowIndex}\n numeric={columnDef.numeric}\n role=\"gridcell\"\n tabIndex={tabIndex}\n {...mergeProps(\n {\n css: {\n \"&:has([data-focusable]:focus-visible)\":\n focusRingStyle.outline,\n },\n },\n runIfFn(cellProps, cell) ?? {},\n columnDef.cellProps ?? {},\n )()}\n >\n <TruncatedText\n lineClamp={columnDef.lineClamp ?? lineClamp}\n suppressHydrationWarning={suppressHydrationWarning}\n truncated={columnDef.truncated ?? truncated}\n >\n {children}\n </TruncatedText>\n </NativeTable.Td>\n )\n })}\n </NativeTable.Tr>\n )\n })}\n </NativeTable.Tbody>\n\n {withFooterGroups ? (\n <NativeTable.Tfoot role=\"rowgroup\" {...tfootProps}>\n {mergedFooterGroups.map((footerGroup, rowIndex) => {\n rowIndex += headerGroupCount + rowCount\n\n let placeholderCount = 0\n\n return (\n <NativeTable.Tr\n key={footerGroup.id}\n aria-rowindex={rowIndex + 1}\n role=\"row\"\n {...runIfFn(footerGroupProps, footerGroup)}\n >\n {footerGroup.headers.map((header) => {\n const { columnDef } = header.column\n const colIndex = header.index + placeholderCount\n const tabIndex = getTabIndex(colIndex, rowIndex)\n const children = header.isPlaceholder\n ? null\n : flexRender(\n header.column.columnDef.footer,\n header.getContext(),\n )\n\n placeholderCount += (header.colSpan \|\| 1) - 1\n\n return (\n <NativeTable.Td\n key={header.id}\n aria-colindex={colIndex + 1}\n aria-rowindex={rowIndex + 1}\n data-colindex={colIndex}\n data-rowindex={rowIndex}\n colSpan={header.colSpan \|\| undefined}\n numeric={columnDef.numeric}\n role=\"gridcell\"\n rowSpan={header.rowSpan \|\| undefined}\n tabIndex={tabIndex}\n {...mergeProps(\n {\n css: {\n \"&:has([data-focusable]:focus-visible)\":\n focusRingStyle.outline,\n },\n },\n runIfFn(footerProps, header) ?? {},\n columnDef.footerProps ?? {},\n )()}\n >\n <TruncatedText\n lineClamp={columnDef.lineClamp ?? lineClamp}\n suppressHydrationWarning={suppressHydrationWarning}\n truncated={columnDef.truncated ?? truncated}\n >\n {children}\n </TruncatedText>\n </NativeTable.Td>\n )\n })}\n </NativeTable.Tr>\n )\n })}\n </NativeTable.Tfoot>\n ) : null}\n </NativeTable.Root>\n\n {footer ? runIfFn(footer, table) : null}\n </ComponentContext>\n )\n },\n)() as GenericsComponent<{\n <Y extends RowData>(props: TableProps<Y>): ReactElement\n}>\n\ninterface SortingIconProps extends HTMLStyledProps<\"button\"> {\n sorted: false \| SortDirection\n}\n\nconst SortingIcon: FC<SortingIconProps> = ({\n sorted,\n suppressHydrationWarning,\n ...rest\n}) => {\n const { t } = useI18n(\"table\")\n const { sortingIcon, sortingIconProps = {} } = useComponentContext()\n const Icon = sorted ? ChevronUpIcon : ChevronsUpDownIcon\n\n return (\n <styled.button\n type=\"button\"\n layerStyle=\"ghost\"\n colorScheme=\"mono\"\n aria-label={t(\n sorted\n ? sorted === \"desc\"\n ? \"Sort descending\"\n : \"Sort ascending\"\n : \"Clear sorting\",\n )}\n data-focusable\n aspectRatio=\"1\"\n cursor=\"pointer\"\n display=\"center\"\n focusVisibleRing=\"none\"\n h=\"calc(1em * {lineHeights.moderate})\"\n position=\"absolute\"\n right=\"{space-x}\"\n rounded=\"l1\"\n suppressHydrationWarning={suppressHydrationWarning}\n tabIndex={-1}\n top=\"50%\"\n transform=\"translateY(-50%)\"\n transitionDuration=\"moderate\"\n transitionProperty=\"common\"\n _hover={{ layerStyle: \"ghost.hover\" }}\n {...mergeProps(rest, sortingIconProps)()}\n >\n {runIfFn(sortingIcon, sorted) ?? (\n <Icon transform={`rotate(${sorted === \"desc\" ? 180 : 0}deg)`} />\n )}\n </styled.button>\n )\n}\n\ninterface ResizableTriggerProps extends HTMLStyledProps {\n resizing: boolean\n}\n\nconst ResizableTrigger: FC<ResizableTriggerProps> = ({\n resizing,\n suppressHydrationWarning,\n ...rest\n}) => {\n const {\n columnResizeMode,\n table,\n resizableTriggerProps = {},\n } = useComponentContext()\n const offset = table.getState().columnSizingInfo.deltaOffset\n\n return (\n <styled.div\n data-active={dataAttr(resizing)}\n bg=\"colorScheme.solid\"\n cursor=\"col-resize\"\n insetY=\"0\"\n opacity={{ base: \"0\", _hover: \"1\", _active: \"1\" }}\n position=\"absolute\"\n right=\"0\"\n suppressHydrationWarning={suppressHydrationWarning}\n touchAction=\"none\"\n transform={`translateX(${columnResizeMode === \"onEnd\" && resizing && offset ? `${offset}px` : \"50%\"})`}\n userSelect=\"none\"\n w=\"1\"\n {...mergeProps(rest, resizableTriggerProps)()}\n />\n )\n}\n\ninterface TruncatedTextProps extends HTMLStyledProps<\"span\"> {}\n\nconst TruncatedText: FC<TruncatedTextProps> = ({\n children,\n lineClamp,\n suppressHydrationWarning,\n truncated,\n ...rest\n}) => {\n if (lineClamp \|\| truncated) {\n return (\n <styled.span\n lineClamp={lineClamp}\n suppressHydrationWarning={suppressHydrationWarning}\n truncated={truncated}\n wordBreak=\"break-all\"\n {...rest}\n >\n {children}\n </styled.span>\n )\n } else {\n return children\n }\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;AA8FA,SAAS,qBACP,cACoB;AACpB,KAAI,aAAa,UAAU,EAAG,QAAO;CAErC,MAAM,6BAAa,IAAI,KAAK;AAE5B,QAAO,aAAa,KAAK,aAAa,OAAO,EAAE,QAAQ,gBAAgB;AACrE,SAAO;GACL,GAAG;GACH,SAAS,YAAY,QAClB,QAAQ,WAAW,CAAC,WAAW,IAAI,OAAO,OAAO,GAAG,CAAC,CACrD,KAAK,WAAW;AACf,eAAW,IAAI,OAAO,OAAO,GAAG;AAEhC,WAAO,OAAO,gBACV;KAAE,GAAG;KAAQ,eAAe;KAAO,SAAS,YAAY;KAAO,GAC/D;KAAE,GAAG;KAAQ,SAAS;KAAG;KAC7B;GACL;GACD;;AAGJ,SAAS,qBACP,cACoB;AACpB,KAAI,aAAa,UAAU,EAAG,QAAO;AAErC,QAAO,aAAa,KAAK,aAAa,UAAU;EAC9C,MAAM,mBAAmB,aAAa,MAAM,QAAQ,EAAE;AAEtD,SAAO;GACL,GAAG;GACH,SAAS,YAAY,QAClB,QAAQ,WAAW,CAAC,OAAO,cAAc,CACzC,KAAK,WAAW;AACf,QAAI,iBAAiB,WAAW,EAAG,QAAO;IAE1C,MAAM,UAAU,iBAAiB,QAAQ,KAAK,oBAAoB;AAKhE,YAAO,OAJe,gBAAgB,QAAQ,MAC3C,eAAe,WAAW,OAAO,OAAO,OAAO,OAAO,GACxD,GAE6B,IAAI;OACjC,EAAE;AAEL,WAAO;KAAE,GAAG;KAAQ;KAAS;KAC7B;GACL;GACD;;AAsOJ,MAAM,EACJ,kBACA,cAAc,mBACd,qBACA,iBAAiB,sBACjB,gBACEA,yCAAwD,QAAQ;;;;;;AASpE,MAAa,QAAQ,aACC,EAClB,WACA,aACA,MACA,SACA,eAAe,mBACf,mBAAmB,YACnB,SAAS,aACT,MACA,sBACA,oBAAoB;CAAE,WAAW;CAAG,UAAU;CAAI,EAClD,sBAAsB,EAAE,EACxB,gBACA,6BAA6B,OAC7B,uBAAuB,OACvB,2BAA2B,MAC3B,mBAAmB,OACnB,qBAAqB,OACrB,QACA,QACA,mBAAmB,CAAC,CAAC,oBACrB,sBAAsB,CAAC,CAAC,oBACxB,uBAAuB;CAAE,UAAU;CAAG,UAAU;CAAG,EACnD,QACA,WACA,kBACA,YAAY,gBACZ,UAAU,eACV,cAAc,kBACd,mBAAmB,OACnB,gBAAgB,OAChB,SAAS,aACT,aACA,OACA,cACA,cACA,SACA,0BACA,WACA,YACA,eAAe,MACf,mBACA,qBAAqB,OACrB,mBAAmB,OACnB,gBACA,WACA,eACA,kBACA,aACA,qBACA,kBACA,aACA,uBACA,kBACA,UACA,iBACA,kBACA,YACA,YACA,YACA,YACA,uBAAuB,2BACvB,oBAAoB,wBACpB,YACA,kBACA,sBAAsB,0BACtB,iBAAiB,qBACjB,GAAG,WACgB;CACnB,MAAM,EAAE,MAAMC,8BAAQ,QAAQ;CAC9B,MAAM,iCAA+B,MAAM;CAC3C,MAAM,wBAA+B,KAAK;CAC1C,MAAM,gCACJ,KACD;CACD,MAAM,CAAC,cAAc,wBAAwBC,gEAAqB;EAChE,cAAc;EACd,OAAO;EACP,UAAU;EACX,CAAC;CACF,MAAM,CAAC,SAAS,mBAAmBA,gEAAqB;EACtD,cAAc;EACd,OAAO;EACP,UAAU;EACX,CAAC;CACF,MAAM,CAAC,YAAY,sBAAsBA,gEAAqB;EAC5D,cAAc;EACd,OAAO;EACP,UAAU;EACX,CAAC;CACF,MAAM,CAAC,eAAe,yBAAyBA,gEAAqB;EAClE,cAAc;EACd,OAAO;EACP,UAAU;EACX,CAAC;CAyEF,MAAM,iDAAyB;EAC7B;EACA,kCA1E4B;AAC5B,OAAI,CAAC,sBAAsB,CAAC,aAAc,QAAO;GAEjD,MAAM,gBAAgB,CAAC,GAAG,YAAY;GAEtC,MAAMC,YAAU,EAAE,kBAAQ,qBAAmC;AAC3D,WACE,2CAACC,6BACC,GAAIC,yBACF;KACE,SAASC,QAAM,sBAAsB;KACrC,eAAeA,QAAM,uBAAuB;KAC5C,gBAAgB,EAAE,SAAS,QAAQ;KACnC,YAAY;MACV,cAAc,EAAE,kBAAkB;MAClC,kBAAkB;MAClB,UAAU;MACX;KACD,UAAUA,QAAM,iCAAiC;KAClD,EACD,iBAAiB,EAAE,iDACX,qBAAqBH,SAAO,IAAI,EAAE,CAC3C,EAAE,GACH;;GAIN,MAAM,QAAQ,EAAE,UAA+B;AAC7C,WACE,2CAACC,6BACC,GAAIC,yBACF;KACE,SAAS,IAAI,eAAe;KAC5B,UAAU,CAAC,IAAI,cAAc;KAC7B,eAAe,IAAI,mBAAmB;KACtC,gBAAgB,EAAE,SAAS,QAAQ;KACnC,YAAY;MACV,cAAc,EAAE,aAAa;MAC7B,kBAAkB;MAClB,UAAU;MACX;KACD,UAAU,IAAI,0BAA0B;KACzC,EACD,iBAAiB,EAAE,iDACX,kBAAkB,IAAI,IAAI,EAAE,CACrC,EAAE,GACH;;AAIN,iBAAc,QAAQ;IACpB,IAAI;IACJ;IACA;IACA,GAAI,qBACA,EAAE,QAAQF,UAAQ,GAClB,EAAE,aAAa,EAAE,eAAe,QAAQ,EAAE;IAC9C,WAAW,EAAE,eAAe,UAAU;IACtC,aAAa,EAAE,GAAG,oCAAoC;IACvD,CAAC;AAEF,UAAO;KACN;GACD;GACA;GACA;GACA;GACA;GACA;GACA;GACA;GACD,CAAC;EAIA;EACA;EACA;EACA,6DAAkC;EAClC,qEAA0C;EAC1C,iEAAsC;EACtC;EACA,UAAU;EACV;EACA,OAAO;GACL;GACA,YAAY,mBAAmB,aAAa;GAC5C;GACS;GACT,GAAG;GACJ;EACD;EACA;EACA;EACiB;EACjB,GAAI,mBACA,EAAE,yEAA8C,EAAE,GAClD,EAAE;EACN,GAAG;EACJ,CAAC;CACF,MAAM,eAAe,MAAM,iBAAiB;CAC5C,MAAM,qBAAqB,qBAAqB,aAAa;CAC7D,MAAM,OAAO,MAAM,aAAa,CAAC;CACjC,MAAM,eAAe,MAAM,iBAAiB;CAC5C,MAAM,qBAAqB,qBACzB,mBAAmB,eAAe,EAAE,CACrC;CACD,MAAM,mBAAmB,aAAa;CACtC,MAAM,WAAW,KAAK;CACtB,MAAM,WAAW,MAAM,mBAAmB,CAAC;CAC3C,MAAM,cAAc,WAAW;CAC/B,MAAM,YAAY,mBACd,MAAM,UAAU,CAAC,WAAW,YAC5B;CACJ,MAAM,mCAAwB;EAC5B,MAAMI,4BAAU,IAAI,KAAqB;AAEzC,MAAI,CAAC,yBAA0B,QAAOA;EAEtC,MAAM,iBACJ,IACA,SACA,SACA,UACA,aACG;AACH,QAAK,IAAI,IAAI,GAAG,IAAI,SAAS,IAC3B,WAAQ,IAAI,GAAG,WAAW,EAAE,GAAG,YAAY,GAAG,SAAS,GAAG,WAAW;AAGvE,QAAK,IAAI,IAAI,GAAG,IAAI,SAAS,IAC3B,WAAQ,IAAI,GAAG,SAAS,GAAG,WAAW,KAAK,GAAG,SAAS,GAAG,WAAW;;EAIzE,MAAM,8BACJ,aACA,aACG;GACH,IAAI,mBAAmB;AAEvB,eAAY,QAAQ,SAAS,aAAW;IACtC,MAAM,UAAUJ,SAAO,WAAW;IAClC,MAAM,UAAUA,SAAO,WAAW;IAClC,MAAM,WAAWA,SAAO,QAAQ;AAEhC,wBAAoB,UAAU;AAE9B,kBAAcA,SAAO,IAAI,SAAS,SAAS,UAAU,SAAS;KAC9D;;AAGJ,qBAAmB,SAAS,aAAa,aAAa;AACpD,8BAA2B,aAAa,SAAS;IACjD;AAEF,OAAK,SAAS,KAAK,aAAa;AAC9B,eAAY;AAEZ,OAAI,iBAAiB,CAAC,SAAS,SAAS;IACtC,MAAM,WAAW,KAAK,OAAO,UAAU;AAEvC,kBAAc,KAAK,IAAI,GAAG,GAAG,UAAU,SAAS;KAChD;IACF;AAEF,qBAAmB,SAAS,aAAa,aAAa;AACpD,eAAY,mBAAmB;AAE/B,8BAA2B,aAAa,SAAS;IACjD;AAEF,SAAOI;IACN;EACD;EACA;EACA;EACA;EACA;EACA;EACD,CAAC;CACF,MAAM,oCACG;EACL;EACA;EACA;EACA;EACA;EACD,GACD;EACE;EACA;EACA;EACA;EACA;EACD,CACF;CACD,MAAM,WACJ,WAMG;AACH,MAAI,CAAC,OAAQ;EAEb,MAAM,KACJ,kBAAkB,cACd,OAAO,QAAQ,SAAS,GACxB,YAAY,UAAU,OAAO,kBAAkB,cAC7C,OAAO,OAAO,QAAQ,SAAS,GAC/B;AAER,MAAI,EAAE,cAAc,sBAAuB;EAE3C,MAAM,EAAE,UAAU,aAAa,GAAG;EAClC,MAAM,EAAE,SAAS,YAAY;AAE7B,MAAI,CAAC,YAAY,CAAC,SAAU;AAK5B,SAAO;GAAE,UAHQ,SAAS,SAAS;GAGhB;GAAS;GAAI,UAFf,SAAS,SAAS;GAEO;GAAS;;CAErD,MAAM,sBAAsB,UAAkB,aAAqB;EACjE,MAAM,CAAC,eAAe,iBACpB,QAAQ,IAAI,GAAG,SAAS,GAAG,WAAW,EAAE,MAAM,IAAI,IAAI,EAAE;AAE1D,MAAI,CAAC,iBAAiB,CAAC,cAAe;EAEtC,MAAM,WAAW,IAAI,SAAS,cAC5B,mBAAmB,cAAc,oBAAoB,cAAc,IACpE;AAED,MAAI,CAAC,YAAY,EAAE,oBAAoB,sBAAuB;AAE9D,SAAO;;CAET,MAAM,kBAAkB,OAAmC;AACzD,MAAI,CAAC,MAAM,EAAE,cAAc,aAAc;AAEzC,KAAG,WAAW;AACd,KAAG,iBAAiB,mBAAmB,CAAC,SAAS,SAAO;AACtD,OAAIC,gBAAc,YAAa,MAAG,WAAW;IAC7C;;CAEJ,MAAM,eACJ,IACA,UACA,aACG;EACH,MAAM,WAAW,mBAAmB,UAAU,SAAS;AAEvD,MAAI,CAAC,SAAU;AAEf,cAAY,UAAU;GAAE;GAAU;GAAU;AAE5C,iBAAe,GAAG;EAElB,MAAM,gBACJ,SAAS,cAAc,mBAAmB,IAAI;AAEhD,MAAI,yBAAyB,aAAa;AACxC,iBAAc,WAAW;AACzB,iBAAc,OAAO;;;CAGzB,MAAM,WAAW,OAAqC;AACpD,MAAI,aAAa,QAAS;AAE1B,eAAa,UAAU;EAEvB,MAAM,OAAO,QAAQ,GAAG;AAExB,MAAI,CAAC,KAAM;AAEX,cAAY,KAAK,IAAI,KAAK,UAAU,KAAK,SAAS;;CAEpD,MAAM,aAAa,OAAwC;AACzD,MAAI,CAAC,yBAA0B;EAE/B,MAAM,OAAO,QAAQ,GAAG;AAExB,MAAI,CAAC,KAAM;AAEX,2BAAa,IAAI;GACf,iBACE,YAAY,KAAK,IAAI,KAAK,UAAU,KAAK,WAAW,KAAK,QAAQ;GACnE,iBAAiB,YAAY,KAAK,IAAI,KAAK,WAAW,GAAG,KAAK,SAAS;GACvE,kBACE,YAAY,KAAK,IAAI,KAAK,WAAW,KAAK,SAAS,KAAK,SAAS;GACnE,eAAe,YAAY,KAAK,IAAI,KAAK,UAAU,KAAK,WAAW,EAAE;GACrE,WAAW,YAAY,KAAK,IAAI,aAAa,KAAK,SAAS;GAC3D,YAAY,YAAY,KAAK,IAAI,GAAG,KAAK,SAAS;GAClD,GAAI,mBACA;IACE,gBAAgB;AACd,SAAI,CAAC,MAAM,gBAAgB,CAAE;AAE7B,WAAM,aAAa,YAAY,EAAE;;IAEnC,cAAc;AACZ,SAAI,CAAC,MAAM,oBAAoB,CAAE;AAEjC,WAAM,aAAa,YAAY,EAAE;;IAEpC,GACD,EAAE;GACP,CAAC;;CAEJ,MAAM,eAAe,UAAkB,aAAqB;AAC1D,MAAI,CAAC,yBAA0B,QAAO;AAEtC,SAAO,aAAa,qBAAqB,YACvC,aAAa,qBAAqB,WAChC,IACA;;AAGN,sCAAsB;AACpB,MAAI,CAAC,yBAA0B;EAE/B,MAAM,EAAE,UAAU,aAAa,YAAY,WAAW;EACtD,MAAM,WAAW,mBAAmB,UAAU,SAAS;AAEvD,MAAI,SAAU,UAAS,WAAW;IACjC,CAAC,WAAW,yBAAyB,CAAC;AAEzC,QACE,4CAAC;EAAiB,OAAO;;GACtB,wDAAiB,QAAQ,MAAM,GAAG;GAEnC;IACE,GAAIH,yBACF;KACE;KACA;KACA,OACE,wBAAwB,6BACpB,EAAE,OAAO,MAAM,oBAAoB,EAAE,GACrC,EAAE;KACR;KACA;KACA;KACA,iBAAiB;KACjB,wBAAwB,qBAAqB,SAAS;KACtD,iBAAiB,iBAAiB,KAAK;KACvC;KACA;KACA;KACA,MAAM;KACN;KACA;KACA;KACA;KACA;KACA;KACA;KACA;KACA;KACA;KACD,EACD,cAAc,EAAE,CACjB,EAAE;;KAEH;MAAmB,MAAK;MAAW,GAAI;gBACpC,mBAAmB,KAAK,aAAa,aAAa;OACjD,IAAI,mBAAmB;AAEvB,cACE;QAEE,iBAAe,WAAW;QAC1B,MAAK;QACL,kDAAY,kBAAkB,YAAY;kBAEzC,YAAY,QAAQ,KAAK,aAAW;SACnC,MAAM,EAAE,cAAcF,SAAO;SAC7B,MAAM,WAAWA,SAAO,QAAQ;SAChC,MAAM,WAAW,YAAY,UAAU,SAAS;SAChD,MAAM,UAAUA,SAAO,OAAO,YAAY;SAC1C,MAAM,SAASA,SAAO,OAAO,aAAa;SAC1C,MAAM,YAAYA,SAAO,OAAO,cAAc;SAC9C,MAAM,WAAWA,SAAO,OAAO,eAAe;SAC9C,MAAM,WAAWA,SAAO,gBACpB,6CAEEA,SAAO,OAAO,UAAU,QACxBA,SAAO,YAAY,CACpB;AAEL,8BAAqBA,SAAO,WAAW,KAAK;AAE5C,gBACE;UAEE,iBAAe,WAAW;UAC1B,iBAAe,WAAW;UAC1B,aACE,SACI,WAAW,QACT,cACA,eACF;UAEN,iBAAe;UACf,iBAAe;UACf,SAASA,SAAO,WAAW;UAC3B,SAAS,UAAU;UACnB,IACE,UACI,sDACA;UAEN,UAAS;UACT,MAAK;UACL,SAASA,SAAO,WAAW;UACjB;UACV,GAAIE,yBACF;WACE,KAAK,EACH,yCACEI,kCAAe,SAClB;WACD,OAAO,uBACH,EAAE,OAAON,SAAO,SAAS,EAAE,GAC3B,EAAE;WACP,iDACO,aAAaA,SAAO,IAAI,EAAE,EAClC,UAAU,eAAe,EAAE,CAC5B,EAAE;;WAEH,2CAAC;YACC,WAAW,UAAU,aAAa;YACR;YAC1B,WAAW,UAAU,aAAa;YAEjC;aACa;WAEf,UACC,2CAAC;YACS;YACkB;YAC1B,SAASA,SAAO,OAAO,yBAAyB;aAChD,GACA;WAEH,YACC,2CAAC;YACW;YACgB;YAC1B,eAAeA,SAAO,OAAO;YAC7B,aAAaA,SAAO,kBAAkB;YACtC,cAAcA,SAAO,kBAAkB;aACvC,GACA;;YA7DCA,SAAO,GA8DG;UAEnB;UAxFG,YAAY,GAyFF;QAEnB;OACgB;KAEpB;MAAmB,MAAK;MAAW,GAAI;gBACpC,KAAK,KAAK,KAAK,aAAa;AAC3B,mBAAY;OAEZ,MAAM,WAAW,CAAC,CAAC,aAAa,IAAI;OACpC,MAAM,6DACO,mBAAmB,IAAI,CAAC,mBAAmB,IAAI;AAE5D,cACE;QACE,IAAI,IAAI;QAER,iEAAwB,SAAS;QACjC,iBAAe,WAAW;QAC1B,iEAAwB,SAAS;QACjC,iEAAwB,SAAS;QACjC,iEAAwB,SAAS;QACjC,MAAK;QACL,GAAIE,yBACF,EACE,SACE,CAAC,YAAY,yBACH,IAAI,eAAe,CAAC,SAAS,GACnC,QACP,EACD;SACE,SAAS,CAAC,iBAAiB,aAAa,IAAI,GAAG;SAC/C,eAAe,CAAC,iBACN,mBAAmB,IAAI,GAC7B;SACL,iDACO,UAAU,IAAI,IAAI,EAAE,CAC7B,EAAE;kBAEF,IAAI,iBAAiB,CAAC,KAAK,SAAS;SACnC,MAAM,EAAE,cAAc,KAAK;SAC3B,MAAM,WAAW,KAAK,OAAO,UAAU;SACvC,MAAM,WAAW,YAAY,UAAU,SAAS;SAChD,MAAM,iDACJ,KAAK,OAAO,UAAU,MACtB,KAAK,YAAY,CAClB;AAED,gBACE;UAEE,iBAAe,WAAW;UAC1B,iBAAe,WAAW;UAC1B,iBAAe;UACf,iBAAe;UACf,SAAS,UAAU;UACnB,MAAK;UACK;UACV,GAAIA,yBACF,EACE,KAAK,EACH,yCACEI,kCAAe,SAClB,EACF,iDACO,WAAW,KAAK,IAAI,EAAE,EAC9B,UAAU,aAAa,EAAE,CAC1B,EAAE;oBAEH,2CAAC;WACC,WAAW,UAAU,aAAa;WACR;WAC1B,WAAW,UAAU,aAAa;WAEjC;YACa;YAzBX,KAAK,GA0BK;UAEnB;UA9DG,IAAI,GA+DM;QAEnB;OACgB;KAEnB,mBACC;MAAmB,MAAK;MAAW,GAAI;gBACpC,mBAAmB,KAAK,aAAa,aAAa;AACjD,mBAAY,mBAAmB;OAE/B,IAAI,mBAAmB;AAEvB,cACE;QAEE,iBAAe,WAAW;QAC1B,MAAK;QACL,kDAAY,kBAAkB,YAAY;kBAEzC,YAAY,QAAQ,KAAK,aAAW;SACnC,MAAM,EAAE,cAAcN,SAAO;SAC7B,MAAM,WAAWA,SAAO,QAAQ;SAChC,MAAM,WAAW,YAAY,UAAU,SAAS;SAChD,MAAM,WAAWA,SAAO,gBACpB,6CAEEA,SAAO,OAAO,UAAU,QACxBA,SAAO,YAAY,CACpB;AAEL,8BAAqBA,SAAO,WAAW,KAAK;AAE5C,gBACE;UAEE,iBAAe,WAAW;UAC1B,iBAAe,WAAW;UAC1B,iBAAe;UACf,iBAAe;UACf,SAASA,SAAO,WAAW;UAC3B,SAAS,UAAU;UACnB,MAAK;UACL,SAASA,SAAO,WAAW;UACjB;UACV,GAAIE,yBACF,EACE,KAAK,EACH,yCACEI,kCAAe,SAClB,EACF,iDACO,aAAaN,SAAO,IAAI,EAAE,EAClC,UAAU,eAAe,EAAE,CAC5B,EAAE;oBAEH,2CAAC;WACC,WAAW,UAAU,aAAa;WACR;WAC1B,WAAW,UAAU,aAAa;WAEjC;YACa;YA3BXA,SAAO,GA4BG;UAEnB;UAlDG,YAAY,GAmDF;QAEnB;OACgB,GAClB;;KACa;GAElB,wDAAiB,QAAQ,MAAM,GAAG;;GAClB;EAGxB,EAAE;AAQH,MAAMO,eAAqC,EACzC,QACA,0BACA,GAAG,WACC;CACJ,MAAM,EAAE,MAAMT,8BAAQ,QAAQ;CAC9B,MAAM,EAAE,aAAa,mBAAmB,EAAE,KAAK,qBAAqB;CACpE,MAAM,OAAO,SAASU,wCAAgBC;AAEtC,QACE,2CAACC,uBAAO;EACN,MAAK;EACL,YAAW;EACX,aAAY;EACZ,cAAY,EACV,SACI,WAAW,SACT,oBACA,mBACF,gBACL;EACD;EACA,aAAY;EACZ,QAAO;EACP,SAAQ;EACR,kBAAiB;EACjB,GAAE;EACF,UAAS;EACT,OAAM;EACN,SAAQ;EACkB;EAC1B,UAAU;EACV,KAAI;EACJ,WAAU;EACV,oBAAmB;EACnB,oBAAmB;EACnB,QAAQ,EAAE,YAAY,eAAe;EACrC,GAAIR,yBAAW,MAAM,iBAAiB,EAAE;2DAE/B,aAAa,OAAO,IAC3B,2CAAC,QAAK,WAAW,UAAU,WAAW,SAAS,MAAM,EAAE,QAAS;GAEpD;;AAQpB,MAAMS,oBAA+C,EACnD,UACA,0BACA,GAAG,WACC;CACJ,MAAM,EACJ,kBACA,OACA,wBAAwB,EAAE,KACxB,qBAAqB;CACzB,MAAM,SAAS,MAAM,UAAU,CAAC,iBAAiB;AAEjD,QACE,2CAACD,uBAAO;EACN,+DAAsB,SAAS;EAC/B,IAAG;EACH,QAAO;EACP,QAAO;EACP,SAAS;GAAE,MAAM;GAAK,QAAQ;GAAK,SAAS;GAAK;EACjD,UAAS;EACT,OAAM;EACoB;EAC1B,aAAY;EACZ,WAAW,cAAc,qBAAqB,WAAW,YAAY,SAAS,GAAG,OAAO,MAAM,MAAM;EACpG,YAAW;EACX,GAAE;EACF,GAAIR,yBAAW,MAAM,sBAAsB,EAAE;GAC7C;;AAMN,MAAMU,iBAAyC,EAC7C,UACA,WACA,0BACA,WACA,GAAG,WACC;AACJ,KAAI,aAAa,UACf,QACE,2CAACF,uBAAO;EACK;EACe;EACf;EACX,WAAU;EACV,GAAI;EAEH;GACW;KAGhB,QAAO"}

package/dist/esm/components/segmented-control/segmented-control.js CHANGED Viewed

@@ -67,12 +67,12 @@ const SegmentedControlRoot = withProvider(({ children, items = [], orientation:
 		})
 	});
 }, "root", { transferProps: ["orientation"] })();
-const SegmentedControlItem = withContext(({ children, indicatorProps, ...rest }) => {
+const SegmentedControlItem = withContext(({ children, suppressHydrationWarning, indicatorProps, ...rest }) => {
 	const { checked, getInputProps, getLabelProps } = useSegmentedControlItem(rest);
 	return /* @__PURE__ */ jsxs(styled.label, {
-		...getLabelProps(),
+		...getLabelProps({ suppressHydrationWarning }),
 		children: [
-			/* @__PURE__ */ jsx(styled.input, { ...getInputProps() }),
+			/* @__PURE__ */ jsx(styled.input, { ...getInputProps({ suppressHydrationWarning }) }),
 			/* @__PURE__ */ jsx(styled.span, { children }),
 			checked ? /* @__PURE__ */ jsx(SegmentedControlIndicator, { ...indicatorProps }) : null
 		]

package/dist/esm/components/segmented-control/segmented-control.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"segmented-control.js","names":["rest","motion"],"sources":["../../../../src/components/segmented-control/segmented-control.tsx"],"sourcesContent":["\"use client\"\n\nimport type { ReactElement, ReactNode } from \"react\"\nimport type { GenericsComponent, HTMLStyledProps, ThemeProps } from \"../../core\"\nimport type { HTMLMotionProps } from \"../motion\"\nimport type { SegmentedControlStyle } from \"./segmented-control.style\"\nimport type {\n UseSegmentedControlItemProps,\n UseSegmentedControlProps,\n} from \"./use-segmented-control\"\nimport { LayoutGroup } from \"motion/react\"\nimport { useMemo } from \"react\"\nimport { createSlotComponent, styled } from \"../../core\"\nimport { useValue } from \"../../hooks/use-value\"\nimport { motion } from \"../motion\"\nimport { segmentedControlStyle } from \"./segmented-control.style\"\nimport {\n SegmentedControlContext,\n SegmentedControlDescendantsContext,\n useSegmentedControl,\n useSegmentedControlItem,\n} from \"./use-segmented-control\"\n\nexport interface SegmentedControlItem extends SegmentedControlItemProps {\n label?: ReactNode\n}\n\ninterface ComponentContext extends Pick<\n SegmentedControlRootProps,\n \"indicatorProps\" \| \"itemProps\"\n> {}\n\nexport interface SegmentedControlRootProps<Y extends string = string>\n extends\n Omit<HTMLStyledProps, \"defaultValue\" \| \"onChange\">,\n ThemeProps<SegmentedControlStyle>,\n Omit<UseSegmentedControlProps<Y>, \"orientation\"> {\n /*\n If provided, generate segmented control buttons but based on items.\n \n @default []\n /\n items?: SegmentedControlItem[]\n /\n Props for the indicator component.\n /\n indicatorProps?: SegmentedControlIndicatorProps\n /\n Props for the item component.\n /\n itemProps?: SegmentedControlItemProps\n}\n\nconst {\n ComponentContext,\n PropsContext: SegmentedControlPropsContext,\n useComponentContext,\n usePropsContext: useSegmentedControlPropsContext,\n withContext,\n withProvider,\n} = createSlotComponent<\n SegmentedControlRootProps,\n SegmentedControlStyle,\n ComponentContext\n>(\"segmented-control\", segmentedControlStyle)\n\nexport { SegmentedControlPropsContext, useSegmentedControlPropsContext }\n\n/\n `SegmentedControl` is a component used for allowing users to select one option from multiple choices.\n \n @see https://yamada-ui.com/docs/components/segmented-control\n /\nexport const SegmentedControlRoot = withProvider(\n ({\n children,\n items = [],\n orientation: orientationProp,\n indicatorProps,\n itemProps,\n ...rest\n }) => {\n const computedOrientation = useValue(orientationProp)\n const {\n id,\n name,\n descendants,\n disabled,\n orientation,\n readOnly,\n setValue,\n value,\n getRootProps,\n } = useSegmentedControl({ orientation: computedOrientation, ...rest })\n const cloneChildren = useMemo(() => {\n if (children) {\n return children\n } else {\n return items.map(({ label, ...rest }, index) => (\n <SegmentedControlItem key={index} {...rest}>\n {label}\n </SegmentedControlItem>\n ))\n }\n }, [children, items])\n const context = useMemo(\n () => ({ id, name, disabled, orientation, readOnly, setValue, value }),\n [id, name, disabled, readOnly, orientation, setValue, value],\n )\n const componentContext = useMemo(\n () => ({ indicatorProps, itemProps }),\n [itemProps, indicatorProps],\n )\n\n return (\n <SegmentedControlContext value={context}>\n <ComponentContext value={componentContext}>\n <SegmentedControlDescendantsContext value={descendants}>\n <LayoutGroup id={id}>\n <styled.div {...getRootProps()}>{cloneChildren}</styled.div>\n </LayoutGroup>\n </SegmentedControlDescendantsContext>\n </ComponentContext>\n </SegmentedControlContext>\n )\n },\n \"root\",\n { transferProps: [\"orientation\"] },\n)() as GenericsComponent<{\n <Y extends string = string>(props: SegmentedControlRootProps<Y>): ReactElement\n}>\n\nexport interface SegmentedControlItemProps<Y extends string = string>\n extends HTMLStyledProps<\"label\">, UseSegmentedControlItemProps<Y> {\n /\n Props for the indicator component.\n */\n indicatorProps?: SegmentedControlIndicatorProps\n}\n\nexport const SegmentedControlItem = withContext<\n \"label\",\n SegmentedControlItemProps\n>(({ children, indicatorProps, ...rest }) => {\n const { checked, getInputProps, getLabelProps } =\n useSegmentedControlItem(rest)\n\n return (\n <styled.label {...getLabelProps()}>\n <styled.input {...getInputProps()} />\n\n <styled.span>{children}</styled.span>\n\n {checked ? <SegmentedControlIndicator {...indicatorProps} /> : null}\n </styled.label>\n )\n}, \"item\")((props) => {\n const { indicatorProps, itemProps } = useComponentContext()\n\n return {\n ...itemProps,\n ...props,\n indicatorProps: {\n ...indicatorProps,\n ...itemProps?.indicatorProps,\n ...props.indicatorProps,\n },\n }\n}) as GenericsComponent<{\n <Y extends string = string>(props: SegmentedControlItemProps<Y>): ReactElement\n}>\n\ninterface SegmentedControlIndicatorProps extends HTMLMotionProps {}\n\nconst SegmentedControlIndicator = withContext<\n \"div\",\n SegmentedControlIndicatorProps\n>(({ transition, ...props }) => {\n return (\n <motion.div\n layoutDependency={false}\n layoutId=\"indicator\"\n transition={{ duration: 0.2, ...transition }}\n {...props}\n />\n )\n}, \"indicator\")()\n"],"mappings":";;;;;;;;;;;;;;;AAqDA,MAAM,EACJ,kBACA,cAAc,8BACd,qBACA,iBAAiB,iCACjB,aACA,iBACE,oBAIF,qBAAqB,sBAAsB;;;;;;AAS7C,MAAa,uBAAuB,cACjC,EACC,UACA,QAAQ,EAAE,EACV,aAAa,iBACb,gBACA,WACA,GAAG,WACC;CAEJ,MAAM,EACJ,IACA,MACA,aACA,UACA,aACA,UACA,UACA,OACA,iBACE,oBAAoB;EAAE,aAXE,SAAS,gBAAgB;EAWO,GAAG;EAAM,CAAC;CACtE,MAAM,gBAAgB,cAAc;AAClC,MAAI,SACF,QAAO;MAEP,QAAO,MAAM,KAAK,EAAE,OAAO,GAAGA,UAAQ,UACpC,oBAAC;GAAiC,GAAIA;aACnC;KADwB,MAEJ,CACvB;IAEH,CAAC,UAAU,MAAM,CAAC;AAUrB,QACE,oBAAC;EAAwB,OAVX,eACP;GAAE;GAAI;GAAM;GAAU;GAAa;GAAU;GAAU;GAAO,GACrE;GAAC;GAAI;GAAM;GAAU;GAAU;GAAa;GAAU;GAAM,CAC7D;YAQG,oBAAC;GAAiB,OAPG,eAChB;IAAE;IAAgB;IAAW,GACpC,CAAC,WAAW,eAAe,CAC5B;aAKK,oBAAC;IAAmC,OAAO;cACzC,oBAAC;KAAgB;eACf,oBAAC,OAAO;MAAI,GAAI,cAAc;gBAAG;OAA2B;MAChD;KACqB;IACpB;GACK;GAG9B,QACA,EAAE,eAAe,CAAC,cAAc,EAAE,CACnC,EAAE;AAYH,MAAa,uBAAuB,aAGjC,EAAE,UAAU,gBAAgB,GAAG,WAAW;~~CAC3C~~,MAAM,EAAE,SAAS,eAAe,kBAC9B,wBAAwB,KAAK;AAE/B,QACE,qBAAC,OAAO;EAAM,GAAI,~~eAAe~~;;~~GAC/B~~,oBAAC,OAAO,SAAM,GAAI,~~eAAe~~,GAAI;~~GAErC~~,oBAAC,OAAO,QAAM,WAAuB;GAEpC,UAAU,oBAAC,6BAA0B,GAAI,iBAAkB,GAAG;;GAClD;GAEhB,OAAO,EAAE,UAAU;CACpB,MAAM,EAAE,gBAAgB,cAAc,qBAAqB;AAE3D,QAAO;EACL,GAAG;EACH,GAAG;EACH,gBAAgB;GACd,GAAG;GACH,GAAG,WAAW;GACd,GAAG,MAAM;GACV;EACF;EACD;AAMF,MAAM,4BAA4B,aAG/B,EAAE,YAAY,GAAG,YAAY;AAC9B,QACE,oBAACC,SAAO;EACN,kBAAkB;EAClB,UAAS;EACT,YAAY;GAAE,UAAU;GAAK,GAAG;GAAY;EAC5C,GAAI;GACJ;GAEH,YAAY,EAAE"}
1	+ {"version":3,"file":"segmented-control.js","names":["rest","motion"],"sources":["../../../../src/components/segmented-control/segmented-control.tsx"],"sourcesContent":["\"use client\"\n\nimport type { ReactElement, ReactNode } from \"react\"\nimport type { GenericsComponent, HTMLStyledProps, ThemeProps } from \"../../core\"\nimport type { HTMLMotionProps } from \"../motion\"\nimport type { SegmentedControlStyle } from \"./segmented-control.style\"\nimport type {\n UseSegmentedControlItemProps,\n UseSegmentedControlProps,\n} from \"./use-segmented-control\"\nimport { LayoutGroup } from \"motion/react\"\nimport { useMemo } from \"react\"\nimport { createSlotComponent, styled } from \"../../core\"\nimport { useValue } from \"../../hooks/use-value\"\nimport { motion } from \"../motion\"\nimport { segmentedControlStyle } from \"./segmented-control.style\"\nimport {\n SegmentedControlContext,\n SegmentedControlDescendantsContext,\n useSegmentedControl,\n useSegmentedControlItem,\n} from \"./use-segmented-control\"\n\nexport interface SegmentedControlItem extends SegmentedControlItemProps {\n label?: ReactNode\n}\n\ninterface ComponentContext extends Pick<\n SegmentedControlRootProps,\n \"indicatorProps\" \| \"itemProps\"\n> {}\n\nexport interface SegmentedControlRootProps<Y extends string = string>\n extends\n Omit<HTMLStyledProps, \"defaultValue\" \| \"onChange\">,\n ThemeProps<SegmentedControlStyle>,\n Omit<UseSegmentedControlProps<Y>, \"orientation\"> {\n /*\n If provided, generate segmented control buttons but based on items.\n \n @default []\n /\n items?: SegmentedControlItem[]\n /\n Props for the indicator component.\n /\n indicatorProps?: SegmentedControlIndicatorProps\n /\n Props for the item component.\n /\n itemProps?: SegmentedControlItemProps\n}\n\nconst {\n ComponentContext,\n PropsContext: SegmentedControlPropsContext,\n useComponentContext,\n usePropsContext: useSegmentedControlPropsContext,\n withContext,\n withProvider,\n} = createSlotComponent<\n SegmentedControlRootProps,\n SegmentedControlStyle,\n ComponentContext\n>(\"segmented-control\", segmentedControlStyle)\n\nexport { SegmentedControlPropsContext, useSegmentedControlPropsContext }\n\n/\n `SegmentedControl` is a component used for allowing users to select one option from multiple choices.\n \n @see https://yamada-ui.com/docs/components/segmented-control\n /\nexport const SegmentedControlRoot = withProvider(\n ({\n children,\n items = [],\n orientation: orientationProp,\n indicatorProps,\n itemProps,\n ...rest\n }) => {\n const computedOrientation = useValue(orientationProp)\n const {\n id,\n name,\n descendants,\n disabled,\n orientation,\n readOnly,\n setValue,\n value,\n getRootProps,\n } = useSegmentedControl({ orientation: computedOrientation, ...rest })\n const cloneChildren = useMemo(() => {\n if (children) {\n return children\n } else {\n return items.map(({ label, ...rest }, index) => (\n <SegmentedControlItem key={index} {...rest}>\n {label}\n </SegmentedControlItem>\n ))\n }\n }, [children, items])\n const context = useMemo(\n () => ({ id, name, disabled, orientation, readOnly, setValue, value }),\n [id, name, disabled, readOnly, orientation, setValue, value],\n )\n const componentContext = useMemo(\n () => ({ indicatorProps, itemProps }),\n [itemProps, indicatorProps],\n )\n\n return (\n <SegmentedControlContext value={context}>\n <ComponentContext value={componentContext}>\n <SegmentedControlDescendantsContext value={descendants}>\n <LayoutGroup id={id}>\n <styled.div {...getRootProps()}>{cloneChildren}</styled.div>\n </LayoutGroup>\n </SegmentedControlDescendantsContext>\n </ComponentContext>\n </SegmentedControlContext>\n )\n },\n \"root\",\n { transferProps: [\"orientation\"] },\n)() as GenericsComponent<{\n <Y extends string = string>(props: SegmentedControlRootProps<Y>): ReactElement\n}>\n\nexport interface SegmentedControlItemProps<Y extends string = string>\n extends HTMLStyledProps<\"label\">, UseSegmentedControlItemProps<Y> {\n /\n Props for the indicator component.\n */\n indicatorProps?: SegmentedControlIndicatorProps\n}\n\nexport const SegmentedControlItem = withContext<\n \"label\",\n SegmentedControlItemProps\n>(({ children, suppressHydrationWarning, indicatorProps, ...rest }) => {\n const { checked, getInputProps, getLabelProps } =\n useSegmentedControlItem(rest)\n\n return (\n <styled.label {...getLabelProps({ suppressHydrationWarning })}>\n <styled.input {...getInputProps({ suppressHydrationWarning })} />\n\n <styled.span>{children}</styled.span>\n\n {checked ? <SegmentedControlIndicator {...indicatorProps} /> : null}\n </styled.label>\n )\n}, \"item\")((props) => {\n const { indicatorProps, itemProps } = useComponentContext()\n\n return {\n ...itemProps,\n ...props,\n indicatorProps: {\n ...indicatorProps,\n ...itemProps?.indicatorProps,\n ...props.indicatorProps,\n },\n }\n}) as GenericsComponent<{\n <Y extends string = string>(props: SegmentedControlItemProps<Y>): ReactElement\n}>\n\ninterface SegmentedControlIndicatorProps extends HTMLMotionProps {}\n\nconst SegmentedControlIndicator = withContext<\n \"div\",\n SegmentedControlIndicatorProps\n>(({ transition, ...props }) => {\n return (\n <motion.div\n layoutDependency={false}\n layoutId=\"indicator\"\n transition={{ duration: 0.2, ...transition }}\n {...props}\n />\n )\n}, \"indicator\")()\n"],"mappings":";;;;;;;;;;;;;;;AAqDA,MAAM,EACJ,kBACA,cAAc,8BACd,qBACA,iBAAiB,iCACjB,aACA,iBACE,oBAIF,qBAAqB,sBAAsB;;;;;;AAS7C,MAAa,uBAAuB,cACjC,EACC,UACA,QAAQ,EAAE,EACV,aAAa,iBACb,gBACA,WACA,GAAG,WACC;CAEJ,MAAM,EACJ,IACA,MACA,aACA,UACA,aACA,UACA,UACA,OACA,iBACE,oBAAoB;EAAE,aAXE,SAAS,gBAAgB;EAWO,GAAG;EAAM,CAAC;CACtE,MAAM,gBAAgB,cAAc;AAClC,MAAI,SACF,QAAO;MAEP,QAAO,MAAM,KAAK,EAAE,OAAO,GAAGA,UAAQ,UACpC,oBAAC;GAAiC,GAAIA;aACnC;KADwB,MAEJ,CACvB;IAEH,CAAC,UAAU,MAAM,CAAC;AAUrB,QACE,oBAAC;EAAwB,OAVX,eACP;GAAE;GAAI;GAAM;GAAU;GAAa;GAAU;GAAU;GAAO,GACrE;GAAC;GAAI;GAAM;GAAU;GAAU;GAAa;GAAU;GAAM,CAC7D;YAQG,oBAAC;GAAiB,OAPG,eAChB;IAAE;IAAgB;IAAW,GACpC,CAAC,WAAW,eAAe,CAC5B;aAKK,oBAAC;IAAmC,OAAO;cACzC,oBAAC;KAAgB;eACf,oBAAC,OAAO;MAAI,GAAI,cAAc;gBAAG;OAA2B;MAChD;KACqB;IACpB;GACK;GAG9B,QACA,EAAE,eAAe,CAAC,cAAc,EAAE,CACnC,EAAE;AAYH,MAAa,uBAAuB,aAGjC,EAAE,UAAU,0BAA0B,gBAAgB,GAAG,WAAW;CACrE,MAAM,EAAE,SAAS,eAAe,kBAC9B,wBAAwB,KAAK;AAE/B,QACE,qBAAC,OAAO;EAAM,GAAI,cAAc,EAAE,0BAA0B,CAAC;;GAC3D,oBAAC,OAAO,SAAM,GAAI,cAAc,EAAE,0BAA0B,CAAC,GAAI;GAEjE,oBAAC,OAAO,QAAM,WAAuB;GAEpC,UAAU,oBAAC,6BAA0B,GAAI,iBAAkB,GAAG;;GAClD;GAEhB,OAAO,EAAE,UAAU;CACpB,MAAM,EAAE,gBAAgB,cAAc,qBAAqB;AAE3D,QAAO;EACL,GAAG;EACH,GAAG;EACH,gBAAgB;GACd,GAAG;GACH,GAAG,WAAW;GACd,GAAG,MAAM;GACV;EACF;EACD;AAMF,MAAM,4BAA4B,aAG/B,EAAE,YAAY,GAAG,YAAY;AAC9B,QACE,oBAACC,SAAO;EACN,kBAAkB;EAClB,UAAS;EACT,YAAY;GAAE,UAAU;GAAK,GAAG;GAAY;EAC5C,GAAI;GACJ;GAEH,YAAY,EAAE"}

package/dist/esm/components/table/table.js CHANGED Viewed

@@ -74,7 +74,7 @@ const Table = withContext(({ className, colorScheme, size, variant, columnFilter
 }, defaultRowSelection = {}, defaultSorting, enableAutoResizeTableWidth = false, enableColumnResizing = false, enableKeyboardNavigation = true, enablePagination = false, enableRowSelection = false, footer, header, highlightOnHover = !!enableRowSelection, highlightOnSelected = !!enableRowSelection, initialFocusableCell = {
 	colIndex: 0,
 	rowIndex: 0
-}, layout, lineClamp, manualPagination, pagination: paginationProp, rowCount: totalRowCount, rowSelection: rowSelectionProp, selectOnClickRow = false, sortDescFirst = false, sorting: sortingProp, sortingIcon, state, stickyFooter, stickyHeader, striped, truncated, withBorder, withCheckbox = true, withColumnBorders, withFooterCheckbox = false, withFooterGroups = false, withScrollArea, cellProps, checkboxProps, footerGroupProps, footerProps, headerCheckboxProps, headerGroupProps, headerProps, resizableTriggerProps, rowCheckboxProps, rowProps, scrollAreaProps, sortingIconProps, tableProps, tbodyProps, tfootProps, theadProps, onColumnFiltersChange: onColumnFiltersChangeProp, onPaginationChange: onPaginationChangeProp, onRowClick, onRowDoubleClick, onRowSelectionChange: onRowSelectionChangeProp, onSortingChange: onSortingChangeProp, ...rest }) => {
+}, layout, lineClamp, manualPagination, pagination: paginationProp, rowCount: totalRowCount, rowSelection: rowSelectionProp, selectOnClickRow = false, sortDescFirst = false, sorting: sortingProp, sortingIcon, state, stickyFooter, stickyHeader, striped, suppressHydrationWarning, truncated, withBorder, withCheckbox = true, withColumnBorders, withFooterCheckbox = false, withFooterGroups = false, withScrollArea, cellProps, checkboxProps, footerGroupProps, footerProps, headerCheckboxProps, headerGroupProps, headerProps, resizableTriggerProps, rowCheckboxProps, rowProps, scrollAreaProps, sortingIconProps, tableProps, tbodyProps, tfootProps, theadProps, onColumnFiltersChange: onColumnFiltersChangeProp, onPaginationChange: onPaginationChangeProp, onRowClick, onRowDoubleClick, onRowSelectionChange: onRowSelectionChangeProp, onSortingChange: onSortingChangeProp, ...rest }) => {
 	const { t } = useI18n("table");
 	const initialFocus = useRef(false);
 	const ref = useRef(null);
@@ -341,6 +341,7 @@ const Table = withContext(({ className, colorScheme, size, variant, columnFilter
 					stickyFooter,
 					stickyHeader,
 					striped,
+					suppressHydrationWarning,
 					withBorder,
 					withColumnBorders,
 					withScrollArea,
@@ -388,15 +389,18 @@ const Table = withContext(({ className, colorScheme, size, variant, columnFilter
 										children: [
 											/* @__PURE__ */ jsx(TruncatedText, {
 												lineClamp: columnDef.lineClamp ?? lineClamp,
+												suppressHydrationWarning,
 												truncated: columnDef.truncated ?? truncated,
 												children
 											}),
 											canSort ? /* @__PURE__ */ jsx(SortingIcon, {
 												sorted,
+												suppressHydrationWarning,
 												onClick: header$1.column.getToggleSortingHandler()
 											}) : null,
 											canResize ? /* @__PURE__ */ jsx(ResizableTrigger, {
 												resizing,
+												suppressHydrationWarning,
 												onDoubleClick: header$1.column.resetSize,
 												onMouseDown: header$1.getResizeHandler(),
 												onTouchStart: header$1.getResizeHandler()
@@ -442,6 +446,7 @@ const Table = withContext(({ className, colorScheme, size, variant, columnFilter
 										...mergeProps({ css: { "&:has([data-focusable]:focus-visible)": focusRingStyle.outline } }, (0, utils_exports.runIfFn)(cellProps, cell) ?? {}, columnDef.cellProps ?? {})(),
 										children: /* @__PURE__ */ jsx(TruncatedText, {
 											lineClamp: columnDef.lineClamp ?? lineClamp,
+											suppressHydrationWarning,
 											truncated: columnDef.truncated ?? truncated,
 											children
 										})
@@ -479,6 +484,7 @@ const Table = withContext(({ className, colorScheme, size, variant, columnFilter
 										...mergeProps({ css: { "&:has([data-focusable]:focus-visible)": focusRingStyle.outline } }, (0, utils_exports.runIfFn)(footerProps, header$1) ?? {}, columnDef.footerProps ?? {})(),
 										children: /* @__PURE__ */ jsx(TruncatedText, {
 											lineClamp: columnDef.lineClamp ?? lineClamp,
+											suppressHydrationWarning,
 											truncated: columnDef.truncated ?? truncated,
 											children
 										})
@@ -493,7 +499,7 @@ const Table = withContext(({ className, colorScheme, size, variant, columnFilter
 		]
 	});
 })();
-const SortingIcon = ({ sorted, ...rest }) => {
+const SortingIcon = ({ sorted, suppressHydrationWarning, ...rest }) => {
 	const { t } = useI18n("table");
 	const { sortingIcon, sortingIconProps = {} } = useComponentContext();
 	const Icon = sorted ? ChevronUpIcon : ChevronsUpDownIcon;
@@ -511,6 +517,7 @@ const SortingIcon = ({ sorted, ...rest }) => {
 		position: "absolute",
 		right: "{space-x}",
 		rounded: "l1",
+		suppressHydrationWarning,
 		tabIndex: -1,
 		top: "50%",
 		transform: "translateY(-50%)",
@@ -521,7 +528,7 @@ const SortingIcon = ({ sorted, ...rest }) => {
 		children: (0, utils_exports.runIfFn)(sortingIcon, sorted) ?? /* @__PURE__ */ jsx(Icon, { transform: `rotate(${sorted === "desc" ? 180 : 0}deg)` })
 	});
 };
-const ResizableTrigger = ({ resizing, ...rest }) => {
+const ResizableTrigger = ({ resizing, suppressHydrationWarning, ...rest }) => {
 	const { columnResizeMode, table, resizableTriggerProps = {} } = useComponentContext();
 	const offset = table.getState().columnSizingInfo.deltaOffset;
 	return /* @__PURE__ */ jsx(styled.div, {
@@ -536,6 +543,7 @@ const ResizableTrigger = ({ resizing, ...rest }) => {
 		},
 		position: "absolute",
 		right: "0",
+		suppressHydrationWarning,
 		touchAction: "none",
 		transform: `translateX(${columnResizeMode === "onEnd" && resizing && offset ? `${offset}px` : "50%"})`,
 		userSelect: "none",
@@ -543,9 +551,10 @@ const ResizableTrigger = ({ resizing, ...rest }) => {
 		...mergeProps(rest, resizableTriggerProps)()
 	});
 };
-const TruncatedText = ({ children, lineClamp, truncated, ...rest }) => {
+const TruncatedText = ({ children, lineClamp, suppressHydrationWarning, truncated, ...rest }) => {
 	if (lineClamp || truncated) return /* @__PURE__ */ jsx(styled.span, {
 		lineClamp,
+		suppressHydrationWarning,
 		truncated,
 		wordBreak: "break-all",
 		...rest,