@ultraviolet/ui 3.0.0-beta.20 → 3.0.0-beta.22

package/dist/components/Drawer/styles.css.cjs

@@ -0,0 +1,17 @@
+"use strict";
+Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
+;/* empty css                                                       */
+;/* empty css                                   */
+;/* empty css                            */
+var drawer = { small: "uv_1iezf7y3", medium: "uv_1iezf7y4", large: "uv_1iezf7y5" };
+var drawerContentWrapper = "uv_1iezf7y6";
+var drawerChildrenWrapper = "uv_1iezf7y7";
+var drawerContent = "uv_1iezf7y8";
+var drawerHeader = "uv_1iezf7y9";
+var drawerFooter = "uv_1iezf7ya";
+exports.drawer = drawer;
+exports.drawerChildrenWrapper = drawerChildrenWrapper;
+exports.drawerContent = drawerContent;
+exports.drawerContentWrapper = drawerContentWrapper;
+exports.drawerFooter = drawerFooter;
+exports.drawerHeader = drawerHeader;

package/dist/components/Drawer/styles.css.d.ts

@@ -0,0 +1,12 @@
+export declare const SIZES: {
+    large: number;
+    medium: number;
+    small: number;
+};
+export type SizeProp = keyof typeof SIZES;
+export declare const drawer: Record<"large" | "medium" | "small", string>;
+export declare const drawerContentWrapper: string;
+export declare const drawerChildrenWrapper: string;
+export declare const drawerContent: string;
+export declare const drawerHeader: string;
+export declare const drawerFooter: string;

package/dist/components/Drawer/styles.css.js

@@ -0,0 +1,17 @@
+/* empty css                                                     */
+/* empty css                                 */
+/* empty css                          */
+var drawer = { small: "uv_1iezf7y3", medium: "uv_1iezf7y4", large: "uv_1iezf7y5" };
+var drawerContentWrapper = "uv_1iezf7y6";
+var drawerChildrenWrapper = "uv_1iezf7y7";
+var drawerContent = "uv_1iezf7y8";
+var drawerHeader = "uv_1iezf7y9";
+var drawerFooter = "uv_1iezf7ya";
+export {
+  drawer,
+  drawerChildrenWrapper,
+  drawerContent,
+  drawerContentWrapper,
+  drawerFooter,
+  drawerHeader
+};

package/dist/components/Link/index.cjs

@@ -23,6 +23,7 @@ const Link = react.forwardRef(({
   onClick,
   "aria-label": ariaLabel,
   "aria-current": ariaCurrent,
+  "aria-keyshortcuts": ariaKeyshortcuts,
   oneLine = false,
   "data-testid": dataTestId,
   variant = "standalone"
@@ -51,7 +52,7 @@ const Link = react.forwardRef(({
       setIsTruncated(offsetWidth < scrollWidth);
     }
   }, [oneLine, ref, usedRef]);
-  return /* @__PURE__ */ jsxRuntime.jsx(index.Tooltip, { text: oneLine && isTruncated ? finalStringChildren : "", children: /* @__PURE__ */ jsxRuntime.jsxs("a", { "aria-current": ariaCurrent, "aria-label": ariaLabel, className: `${className ? `${className} ` : ""}${styles_css.link({
+  return /* @__PURE__ */ jsxRuntime.jsx(index.Tooltip, { text: oneLine && isTruncated ? finalStringChildren : "", children: /* @__PURE__ */ jsxRuntime.jsxs("a", { "aria-current": ariaCurrent, "aria-keyshortcuts": ariaKeyshortcuts, "aria-label": ariaLabel, className: `${className ? `${className} ` : ""}${styles_css.link({
     oneLine,
     prominence,
     sentiment,

package/dist/components/Link/index.d.ts

@@ -17,6 +17,7 @@ type LinkProps = {
     onClick?: MouseEventHandler<HTMLAnchorElement>;
     'aria-label'?: string;
     'aria-current'?: AnchorHTMLAttributes<HTMLAnchorElement>['aria-current'];
+    'aria-keyshortcuts'?: string;
     oneLine?: boolean;
     'data-testid'?: string;
     variant?: 'inline' | 'standalone';

package/dist/components/Link/index.js

@@ -21,6 +21,7 @@ const Link = forwardRef(({
   onClick,
   "aria-label": ariaLabel,
   "aria-current": ariaCurrent,
+  "aria-keyshortcuts": ariaKeyshortcuts,
   oneLine = false,
   "data-testid": dataTestId,
   variant = "standalone"
@@ -49,7 +50,7 @@ const Link = forwardRef(({
       setIsTruncated(offsetWidth < scrollWidth);
     }
   }, [oneLine, ref, usedRef]);
-  return /* @__PURE__ */ jsx(Tooltip, { text: oneLine && isTruncated ? finalStringChildren : "", children: /* @__PURE__ */ jsxs("a", { "aria-current": ariaCurrent, "aria-label": ariaLabel, className: `${className ? `${className} ` : ""}${link({
+  return /* @__PURE__ */ jsx(Tooltip, { text: oneLine && isTruncated ? finalStringChildren : "", children: /* @__PURE__ */ jsxs("a", { "aria-current": ariaCurrent, "aria-keyshortcuts": ariaKeyshortcuts, "aria-label": ariaLabel, className: `${className ? `${className} ` : ""}${link({
     oneLine,
     prominence,
     sentiment,

package/dist/components/List/Cell.cjs

@@ -2,24 +2,30 @@
 "use strict";
 Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
 const jsxRuntime = require("@emotion/react/jsx-runtime");
-const _styled = require("@emotion/styled/base");
+const dynamic = require("@vanilla-extract/dynamic");
 const react = require("react");
-const _interopDefaultCompat = (e) => e && typeof e === "object" && "default" in e ? e : { default: e };
-const _styled__default = /* @__PURE__ */ _interopDefaultCompat(_styled);
-const StyledCell = /* @__PURE__ */ _styled__default.default("td", process.env.NODE_ENV === "production" ? {
-  target: "e1e6rck40"
-} : {
-  target: "e1e6rck40",
-  label: "StyledCell"
-})("display:table-cell;vertical-align:middle;height:", ({
-  theme
-}) => theme.sizing["750"], ";padding:0 ", ({
-  theme
-}) => theme.space["2"], ";" + (process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIi9ob21lL3J1bm5lci93b3JrL3VsdHJhdmlvbGV0L3VsdHJhdmlvbGV0L3BhY2thZ2VzL3VpL3NyYy9jb21wb25lbnRzL0xpc3QvQ2VsbC50c3giXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBTTRCIiwiZmlsZSI6Ii9ob21lL3J1bm5lci93b3JrL3VsdHJhdmlvbGV0L3VsdHJhdmlvbGV0L3BhY2thZ2VzL3VpL3NyYy9jb21wb25lbnRzL0xpc3QvQ2VsbC50c3giLCJzb3VyY2VzQ29udGVudCI6WyIndXNlIGNsaWVudCdcblxuaW1wb3J0IHN0eWxlZCBmcm9tICdAZW1vdGlvbi9zdHlsZWQnXG5pbXBvcnQgdHlwZSB7IFJlYWN0Tm9kZSB9IGZyb20gJ3JlYWN0J1xuaW1wb3J0IHsgZm9yd2FyZFJlZiB9IGZyb20gJ3JlYWN0J1xuXG5jb25zdCBTdHlsZWRDZWxsID0gc3R5bGVkLnRkYFxuICBkaXNwbGF5OiB0YWJsZS1jZWxsO1xuICB2ZXJ0aWNhbC1hbGlnbjogbWlkZGxlO1xuICBoZWlnaHQ6ICR7KHsgdGhlbWUgfSkgPT4gdGhlbWUuc2l6aW5nWyc3NTAnXX07XG4gIHBhZGRpbmc6IDAgJHsoeyB0aGVtZSB9KSA9PiB0aGVtZS5zcGFjZVsnMiddfTtcbmBcblxudHlwZSBDZWxsUHJvcHMgPSB7XG4gIGNoaWxkcmVuPzogUmVhY3ROb2RlXG4gIGNsYXNzTmFtZT86IHN0cmluZ1xuICAnZGF0YS10ZXN0aWQnPzogc3RyaW5nXG4gIGNvbFNwYW4/OiBudW1iZXJcbn1cblxuZXhwb3J0IGNvbnN0IENlbGwgPSBmb3J3YXJkUmVmPEhUTUxUYWJsZUNlbGxFbGVtZW50LCBDZWxsUHJvcHM+KFxuICAoeyBjaGlsZHJlbiwgY2xhc3NOYW1lLCAnZGF0YS10ZXN0aWQnOiBkYXRhVGVzdGlkLCBjb2xTcGFuIH0sIHJlZikgPT4gKFxuICAgIDxTdHlsZWRDZWxsXG4gICAgICBjbGFzc05hbWU9e2NsYXNzTmFtZX1cbiAgICAgIGNvbFNwYW49e2NvbFNwYW59XG4gICAgICBkYXRhLXRlc3RpZD17ZGF0YVRlc3RpZH1cbiAgICAgIHJlZj17cmVmfVxuICAgID5cbiAgICAgIHtjaGlsZHJlbn1cbiAgICA8L1N0eWxlZENlbGw+XG4gICksXG4pXG4iXX0= */"));
+const ColumnProvider = require("./ColumnProvider.cjs");
+const styles_css = require("./styles.css.cjs");
+const variables_css = require("./variables.css.cjs");
 const Cell = react.forwardRef(({
   children,
   className,
   "data-testid": dataTestid,
-  colSpan
-}, ref) => /* @__PURE__ */ jsxRuntime.jsx(StyledCell, { className, colSpan, "data-testid": dataTestid, ref, children }));
+  colSpan,
+  style
+}, ref) => {
+  const {
+    maxWidth,
+    minWidth,
+    width
+  } = ColumnProvider.useColumnProvider();
+  return /* @__PURE__ */ jsxRuntime.jsx("td", { className: `${className ? `${className} ` : ""}${styles_css.listCell}`, colSpan, "data-testid": dataTestid, ref, style: {
+    ...style,
+    ...dynamic.assignInlineVars({
+      [variables_css.widthCell]: width,
+      [variables_css.minWidthCell]: minWidth,
+      [variables_css.maxWidthCell]: maxWidth
+    })
+  }, children });
+});
 exports.Cell = Cell;

package/dist/components/List/Cell.d.ts

@@ -1,9 +1,10 @@
-import type { ReactNode } from 'react';
+import type { CSSProperties, ReactNode } from 'react';
 type CellProps = {
     children?: ReactNode;
     className?: string;
     'data-testid'?: string;
     colSpan?: number;
+    style?: CSSProperties;
 };
 export declare const Cell: import("react").ForwardRefExoticComponent<CellProps & import("react").RefAttributes<HTMLTableCellElement>>;
 export {};

package/dist/components/List/Cell.js

@@ -1,23 +1,31 @@
 "use client";
 import { jsx } from "@emotion/react/jsx-runtime";
-import _styled from "@emotion/styled/base";
+import { assignInlineVars } from "@vanilla-extract/dynamic";
 import { forwardRef } from "react";
-const StyledCell = /* @__PURE__ */ _styled("td", process.env.NODE_ENV === "production" ? {
-  target: "e1e6rck40"
-} : {
-  target: "e1e6rck40",
-  label: "StyledCell"
-})("display:table-cell;vertical-align:middle;height:", ({
-  theme
-}) => theme.sizing["750"], ";padding:0 ", ({
-  theme
-}) => theme.space["2"], ";" + (process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIi9ob21lL3J1bm5lci93b3JrL3VsdHJhdmlvbGV0L3VsdHJhdmlvbGV0L3BhY2thZ2VzL3VpL3NyYy9jb21wb25lbnRzL0xpc3QvQ2VsbC50c3giXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBTTRCIiwiZmlsZSI6Ii9ob21lL3J1bm5lci93b3JrL3VsdHJhdmlvbGV0L3VsdHJhdmlvbGV0L3BhY2thZ2VzL3VpL3NyYy9jb21wb25lbnRzL0xpc3QvQ2VsbC50c3giLCJzb3VyY2VzQ29udGVudCI6WyIndXNlIGNsaWVudCdcblxuaW1wb3J0IHN0eWxlZCBmcm9tICdAZW1vdGlvbi9zdHlsZWQnXG5pbXBvcnQgdHlwZSB7IFJlYWN0Tm9kZSB9IGZyb20gJ3JlYWN0J1xuaW1wb3J0IHsgZm9yd2FyZFJlZiB9IGZyb20gJ3JlYWN0J1xuXG5jb25zdCBTdHlsZWRDZWxsID0gc3R5bGVkLnRkYFxuICBkaXNwbGF5OiB0YWJsZS1jZWxsO1xuICB2ZXJ0aWNhbC1hbGlnbjogbWlkZGxlO1xuICBoZWlnaHQ6ICR7KHsgdGhlbWUgfSkgPT4gdGhlbWUuc2l6aW5nWyc3NTAnXX07XG4gIHBhZGRpbmc6IDAgJHsoeyB0aGVtZSB9KSA9PiB0aGVtZS5zcGFjZVsnMiddfTtcbmBcblxudHlwZSBDZWxsUHJvcHMgPSB7XG4gIGNoaWxkcmVuPzogUmVhY3ROb2RlXG4gIGNsYXNzTmFtZT86IHN0cmluZ1xuICAnZGF0YS10ZXN0aWQnPzogc3RyaW5nXG4gIGNvbFNwYW4/OiBudW1iZXJcbn1cblxuZXhwb3J0IGNvbnN0IENlbGwgPSBmb3J3YXJkUmVmPEhUTUxUYWJsZUNlbGxFbGVtZW50LCBDZWxsUHJvcHM+KFxuICAoeyBjaGlsZHJlbiwgY2xhc3NOYW1lLCAnZGF0YS10ZXN0aWQnOiBkYXRhVGVzdGlkLCBjb2xTcGFuIH0sIHJlZikgPT4gKFxuICAgIDxTdHlsZWRDZWxsXG4gICAgICBjbGFzc05hbWU9e2NsYXNzTmFtZX1cbiAgICAgIGNvbFNwYW49e2NvbFNwYW59XG4gICAgICBkYXRhLXRlc3RpZD17ZGF0YVRlc3RpZH1cbiAgICAgIHJlZj17cmVmfVxuICAgID5cbiAgICAgIHtjaGlsZHJlbn1cbiAgICA8L1N0eWxlZENlbGw+XG4gICksXG4pXG4iXX0= */"));
+import { useColumnProvider } from "./ColumnProvider.js";
+import { listCell } from "./styles.css.js";
+import { maxWidthCell, minWidthCell, widthCell } from "./variables.css.js";
 const Cell = forwardRef(({
   children,
   className,
   "data-testid": dataTestid,
-  colSpan
-}, ref) => /* @__PURE__ */ jsx(StyledCell, { className, colSpan, "data-testid": dataTestid, ref, children }));
+  colSpan,
+  style
+}, ref) => {
+  const {
+    maxWidth,
+    minWidth,
+    width
+  } = useColumnProvider();
+  return /* @__PURE__ */ jsx("td", { className: `${className ? `${className} ` : ""}${listCell}`, colSpan, "data-testid": dataTestid, ref, style: {
+    ...style,
+    ...assignInlineVars({
+      [widthCell]: width,
+      [minWidthCell]: minWidth,
+      [maxWidthCell]: maxWidth
+    })
+  }, children });
+});
 export {
   Cell
 };

package/dist/components/List/ColumnProvider.cjs

@@ -0,0 +1,28 @@
+"use strict";
+Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
+const jsxRuntime = require("@emotion/react/jsx-runtime");
+const react = require("react");
+const ColumnContext = react.createContext(void 0);
+const ColumnProvider = ({
+  width,
+  minWidth,
+  maxWidth,
+  children
+}) => /* @__PURE__ */ jsxRuntime.jsx(ColumnContext.Provider, { value: {
+  maxWidth: maxWidth ?? "none",
+  minWidth: minWidth ?? "auto",
+  width: width ?? "auto"
+}, children });
+const useColumnProvider = () => {
+  const context = react.useContext(ColumnContext);
+  if (!context) {
+    return {
+      maxWidth: "none",
+      minWidth: "auto",
+      width: "auto"
+    };
+  }
+  return context;
+};
+exports.ColumnProvider = ColumnProvider;
+exports.useColumnProvider = useColumnProvider;

package/dist/components/List/ColumnProvider.d.ts

@@ -0,0 +1,14 @@
+import type { ReactNode } from 'react';
+type ColumnProviderProps = {
+    width?: string;
+    maxWidth?: string;
+    minWidth?: string;
+    children?: ReactNode;
+};
+export declare const ColumnProvider: ({ width, minWidth, maxWidth, children, }: ColumnProviderProps) => import("@emotion/react/jsx-runtime").JSX.Element;
+export declare const useColumnProvider: () => {
+    width: string;
+    maxWidth: string;
+    minWidth: string;
+};
+export {};

package/dist/components/List/ColumnProvider.js

@@ -0,0 +1,28 @@
+import { jsx } from "@emotion/react/jsx-runtime";
+import { createContext, useContext } from "react";
+const ColumnContext = createContext(void 0);
+const ColumnProvider = ({
+  width,
+  minWidth,
+  maxWidth,
+  children
+}) => /* @__PURE__ */ jsx(ColumnContext.Provider, { value: {
+  maxWidth: maxWidth ?? "none",
+  minWidth: minWidth ?? "auto",
+  width: width ?? "auto"
+}, children });
+const useColumnProvider = () => {
+  const context = useContext(ColumnContext);
+  if (!context) {
+    return {
+      maxWidth: "none",
+      minWidth: "auto",
+      width: "auto"
+    };
+  }
+  return context;
+};
+export {
+  ColumnProvider,
+  useColumnProvider
+};

package/dist/components/List/HeaderCell.cjs

@@ -2,53 +2,15 @@
 "use strict";
 Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
 const jsxRuntime = require("@emotion/react/jsx-runtime");
-const _styled = require("@emotion/styled/base");
 const Icon = require("@ultraviolet/icons");
+const dynamic = require("@vanilla-extract/dynamic");
 const index = require("../Stack/index.cjs");
 const index$1 = require("../Tooltip/index.cjs");
-const _interopDefaultCompat = (e) => e && typeof e === "object" && "default" in e ? e : { default: e };
-const _styled__default = /* @__PURE__ */ _interopDefaultCompat(_styled);
-const StyledSortIcon = /* @__PURE__ */ _styled__default.default(Icon.SouthShortIcon, process.env.NODE_ENV === "production" ? {
-  shouldForwardProp: (prop) => !["order"].includes(prop),
-  target: "e1q5cnom1"
-} : {
-  shouldForwardProp: (prop) => !["order"].includes(prop),
-  target: "e1q5cnom1",
-  label: "StyledSortIcon"
-})("transform:", ({
-  order
-}) => order === "ascending" ? "rotate(-180deg)" : "none", ";transition:transform 0.2s ease-in-out;" + (process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIi9ob21lL3J1bm5lci93b3JrL3VsdHJhdmlvbGV0L3VsdHJhdmlvbGV0L3BhY2thZ2VzL3VpL3NyYy9jb21wb25lbnRzL0xpc3QvSGVhZGVyQ2VsbC50c3giXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBY3lDIiwiZmlsZSI6Ii9ob21lL3J1bm5lci93b3JrL3VsdHJhdmlvbGV0L3VsdHJhdmlvbGV0L3BhY2thZ2VzL3VpL3NyYy9jb21wb25lbnRzL0xpc3QvSGVhZGVyQ2VsbC50c3giLCJzb3VyY2VzQ29udGVudCI6WyIndXNlIGNsaWVudCdcblxuaW1wb3J0IHN0eWxlZCBmcm9tICdAZW1vdGlvbi9zdHlsZWQnXG5pbXBvcnQge1xuICBJbmZvcm1hdGlvbk91dGxpbmVJY29uLFxuICBTb3J0SWNvbiBhcyBTb3J0SWNvblVWLFxuICBTb3V0aFNob3J0SWNvbixcbn0gZnJvbSAnQHVsdHJhdmlvbGV0L2ljb25zJ1xuaW1wb3J0IHR5cGUgeyBSZWFjdE5vZGUgfSBmcm9tICdyZWFjdCdcbmltcG9ydCB7IFN0YWNrIH0gZnJvbSAnLi4vU3RhY2snXG5pbXBvcnQgeyBUb29sdGlwIH0gZnJvbSAnLi4vVG9vbHRpcCdcblxuY29uc3QgU3R5bGVkU29ydEljb24gPSBzdHlsZWQoU291dGhTaG9ydEljb24sIHtcbiAgc2hvdWxkRm9yd2FyZFByb3A6IHByb3AgPT4gIVsnb3JkZXInXS5pbmNsdWRlcyhwcm9wKSxcbn0pPHsgb3JkZXI6ICdhc2NlbmRpbmcnIHwgJ2Rlc2NlbmRpbmcnIH0+YFxuICB0cmFuc2Zvcm06ICR7KHsgb3JkZXIgfSkgPT5cbiAgICBvcmRlciA9PT0gJ2FzY2VuZGluZycgPyAncm90YXRlKC0xODBkZWcpJyA6ICdub25lJ307XG4gIHRyYW5zaXRpb246IHRyYW5zZm9ybSAwLjJzIGVhc2UtaW4tb3V0O1xuYFxuXG5jb25zdCBTb3J0SWNvbiA9ICh7IG9yZGVyIH06IHsgb3JkZXI/OiAnYXNjZW5kaW5nJyB8ICdkZXNjZW5kaW5nJyB9KSA9PlxuICBvcmRlciA/IChcbiAgICA8U3R5bGVkU29ydEljb24gb3JkZXI9e29yZGVyfSBzZW50aW1lbnQ9XCJwcmltYXJ5XCIgLz5cbiAgKSA6IChcbiAgICA8U29ydEljb25VViBzZW50aW1lbnQ9XCJuZXV0cmFsXCIgLz5cbiAgKVxuXG5jb25zdCBTdHlsZWRIZWFkZXJDZWxsID0gc3R5bGVkKCd0aCcsIHtcbiAgc2hvdWxkRm9yd2FyZFByb3A6IHByb3AgPT4gIVsnd2lkdGgnLCAnbWluV2lkdGgnLCAnbWF4V2lkdGgnXS5pbmNsdWRlcyhwcm9wKSxcbn0pPHsgd2lkdGg/OiBzdHJpbmc7IG1pbldpZHRoPzogc3RyaW5nOyBtYXhXaWR0aD86IHN0cmluZyB9PmBcbiAgZGlzcGxheTogdGFibGUtY2VsbDtcbiAgdGV4dC1hbGlnbjogbGVmdDtcbiAgdmVydGljYWwtYWxpZ246IG1pZGRsZTtcbiAgZm9udC1zaXplOiAkeyh7IHRoZW1lIH0pID0+IHRoZW1lLnR5cG9ncmFwaHkuYm9keVNtYWxsLmZvbnRTaXplfTtcbiAgZm9udC13ZWlnaHQ6ICR7KHsgdGhlbWUgfSkgPT4gdGhlbWUudHlwb2dyYXBoeS5ib2R5U21hbGwud2VpZ2h0fTtcbiAgZm9udC1mYW1pbHk6ICR7KHsgdGhlbWUgfSkgPT4gdGhlbWUudHlwb2dyYXBoeS5ib2R5U21hbGwuZm9udEZhbWlseX07XG4gIGNvbG9yOiAkeyh7IHRoZW1lIH0pID0+IHRoZW1lLmNvbG9ycy5uZXV0cmFsLnRleHR9O1xuICBnYXA6ICR7KHsgdGhlbWUgfSkgPT4gdGhlbWUuc3BhY2VbJzEnXX07XG4gIHBhZGRpbmc6IDAgJHsoeyB0aGVtZSB9KSA9PiB0aGVtZS5zcGFjZVsnMiddfTtcblxuICAmW3JvbGUqPSdidXR0b24nXSB7XG4gICAgY3Vyc29yOiBwb2ludGVyO1xuICAgIHVzZXItc2VsZWN0OiBub25lO1xuICB9XG5cbiAgJlthcmlhLXNvcnRdIHtcbiAgICBjb2xvcjogJHsoeyB0aGVtZSB9KSA9PiB0aGVtZS5jb2xvcnMucHJpbWFyeS50ZXh0fTtcbiAgfVxuXG4gIHdpZHRoOiAkeyh7IHdpZHRoIH0pID0+IHdpZHRofTtcbiAgbWluLXdpZHRoOiAkeyh7IG1pbldpZHRoIH0pID0+IG1pbldpZHRofTtcbiAgbWF4LXdpZHRoOiAkeyh7IG1heFdpZHRoIH0pID0+IG1heFdpZHRofTtcbmBcblxudHlwZSBIZWFkZXJDZWxsUHJvcHMgPSB7XG4gIGNoaWxkcmVuOiBSZWFjdE5vZGVcbiAgY2xhc3NOYW1lPzogc3RyaW5nXG4gIGlzT3JkZXJlZD86IGJvb2xlYW5cbiAgb3JkZXJEaXJlY3Rpb24/OiAnYXNjJyB8ICdkZXNjJyB8ICdub25lJ1xuICBvbk9yZGVyPzogKG5ld09yZGVyOiAnYXNjJyB8ICdkZXNjJykgPT4gdm9pZFxuICBpbmZvPzogc3RyaW5nXG4gIHdpZHRoPzogc3RyaW5nXG4gIG1pbldpdGg/OiBzdHJpbmdcbiAgbWF4V2lkdGg/OiBzdHJpbmdcbn1cblxuZXhwb3J0IGNvbnN0IEhlYWRlckNlbGwgPSAoe1xuICBjaGlsZHJlbixcbiAgaXNPcmRlcmVkLFxuICBvcmRlckRpcmVjdGlvbixcbiAgb25PcmRlcixcbiAgY2xhc3NOYW1lLFxuICBpbmZvLFxuICB3aWR0aCxcbiAgbWluV2l0aCxcbiAgbWF4V2lkdGgsXG59OiBIZWFkZXJDZWxsUHJvcHMpID0+IHtcbiAgbGV0IG9yZGVyOiB1bmRlZmluZWQgfCAnYXNjZW5kaW5nJyB8ICdkZXNjZW5kaW5nJ1xuICBpZiAoaXNPcmRlcmVkICYmIG9yZGVyRGlyZWN0aW9uID09PSAnYXNjJykge1xuICAgIG9yZGVyID0gJ2FzY2VuZGluZydcbiAgfSBlbHNlIGlmIChpc09yZGVyZWQgJiYgb3JkZXJEaXJlY3Rpb24gPT09ICdkZXNjJykge1xuICAgIG9yZGVyID0gJ2Rlc2NlbmRpbmcnXG4gIH1cblxuICBjb25zdCBoYW5kbGVPcmRlciA9IG9uT3JkZXJcbiAgICA/ICgpID0+IG9uT3JkZXIob3JkZXIgPT09ICdhc2NlbmRpbmcnID8gJ2Rlc2MnIDogJ2FzYycpXG4gICAgOiB1bmRlZmluZWRcblxuICByZXR1cm4gKFxuICAgIDxTdHlsZWRIZWFkZXJDZWxsXG4gICAgICBhcmlhLXNvcnQ9e29yZGVyfVxuICAgICAgY2xhc3NOYW1lPXtjbGFzc05hbWV9XG4gICAgICBtYXhXaWR0aD17bWF4V2lkdGh9XG4gICAgICBtaW5XaWR0aD17bWluV2l0aH1cbiAgICAgIG9uQ2xpY2s9e2hhbmRsZU9yZGVyfVxuICAgICAgb25LZXlEb3duPXtcbiAgICAgICAgaGFuZGxlT3JkZXJcbiAgICAgICAgICA/IGV2ZW50ID0+IHtcbiAgICAgICAgICAgICAgaWYgKGV2ZW50LmtleSA9PT0gJyAnIHx8IGV2ZW50LmtleSA9PT0gJ0VudGVyJykge1xuICAgICAgICAgICAgICAgIGhhbmRsZU9yZGVyKClcbiAgICAgICAgICAgICAgICBpZiAoZXZlbnQua2V5ID09PSAnICcpIHtcbiAgICAgICAgICAgICAgICAgIC8vIEBub3RlOiBpdCBhdm9pZCBzY3JvbGwgd2hlbiBwcmVzc2luZyBTcGFjZVxuICAgICAgICAgICAgICAgICAgZXZlbnQucHJldmVudERlZmF1bHQoKVxuICAgICAgICAgICAgICAgIH1cbiAgICAgICAgICAgICAgfVxuICAgICAgICAgICAgfVxuICAgICAgICAgIDogdW5kZWZpbmVkXG4gICAgICB9XG4gICAgICByb2xlPXtvbk9yZGVyID8gJ2J1dHRvbiBjb2x1bW5oZWFkZXInIDogdW5kZWZpbmVkfVxuICAgICAgdGFiSW5kZXg9e2hhbmRsZU9yZGVyID8gMCA6IC0xfVxuICAgICAgd2lkdGg9e3dpZHRofVxuICAgID5cbiAgICAgIDxTdGFjayBhbGlnbkl0ZW1zPVwiY2VudGVyXCIgZGlyZWN0aW9uPVwicm93XCIgZ2FwPXsxfT5cbiAgICAgICAge2NoaWxkcmVufVxuICAgICAgICB7aW5mbyA/IChcbiAgICAgICAgICA8VG9vbHRpcCB0ZXh0PXtpbmZvfT5cbiAgICAgICAgICAgIDxJbmZvcm1hdGlvbk91dGxpbmVJY29uXG4gICAgICAgICAgICAgIHByb21pbmVuY2U9XCJ3ZWFrXCJcbiAgICAgICAgICAgICAgc2VudGltZW50PVwibmV1dHJhbFwiXG4gICAgICAgICAgICAgIHNpemU9XCJzbWFsbFwiXG4gICAgICAgICAgICAvPlxuICAgICAgICAgIDwvVG9vbHRpcD5cbiAgICAgICAgKSA6IG51bGx9XG4gICAgICAgIHtvcmRlckRpcmVjdGlvbiAhPT0gdW5kZWZpbmVkICYmIGlzT3JkZXJlZCAhPT0gdW5kZWZpbmVkID8gKFxuICAgICAgICAgIDxTb3J0SWNvbiBvcmRlcj17b3JkZXJ9IC8+XG4gICAgICAgICkgOiBudWxsfVxuICAgICAgPC9TdGFjaz5cbiAgICA8L1N0eWxlZEhlYWRlckNlbGw+XG4gIClcbn1cbiJdfQ== */"));
+const styles_css = require("./styles.css.cjs");
+const variables_css = require("./variables.css.cjs");
 const SortIcon = ({
   order
-}) => order ? /* @__PURE__ */ jsxRuntime.jsx(StyledSortIcon, { order, sentiment: "primary" }) : /* @__PURE__ */ jsxRuntime.jsx(Icon.SortIcon, { sentiment: "neutral" });
-const StyledHeaderCell = /* @__PURE__ */ _styled__default.default("th", process.env.NODE_ENV === "production" ? {
-  shouldForwardProp: (prop) => !["width", "minWidth", "maxWidth"].includes(prop),
-  target: "e1q5cnom0"
-} : {
-  shouldForwardProp: (prop) => !["width", "minWidth", "maxWidth"].includes(prop),
-  target: "e1q5cnom0",
-  label: "StyledHeaderCell"
-})("display:table-cell;text-align:left;vertical-align:middle;font-size:", ({
-  theme
-}) => theme.typography.bodySmall.fontSize, ";font-weight:", ({
-  theme
-}) => theme.typography.bodySmall.weight, ";font-family:", ({
-  theme
-}) => theme.typography.bodySmall.fontFamily, ";color:", ({
-  theme
-}) => theme.colors.neutral.text, ";gap:", ({
-  theme
-}) => theme.space["1"], ";padding:0 ", ({
-  theme
-}) => theme.space["2"], ";&[role*='button']{cursor:pointer;user-select:none;}&[aria-sort]{color:", ({
-  theme
-}) => theme.colors.primary.text, ";}width:", ({
-  width
-}) => width, ";min-width:", ({
-  minWidth
-}) => minWidth, ";max-width:", ({
-  maxWidth
-}) => maxWidth, ";" + (process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIi9ob21lL3J1bm5lci93b3JrL3VsdHJhdmlvbGV0L3VsdHJhdmlvbGV0L3BhY2thZ2VzL3VpL3NyYy9jb21wb25lbnRzL0xpc3QvSGVhZGVyQ2VsbC50c3giXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBNkI0RCIsImZpbGUiOiIvaG9tZS9ydW5uZXIvd29yay91bHRyYXZpb2xldC91bHRyYXZpb2xldC9wYWNrYWdlcy91aS9zcmMvY29tcG9uZW50cy9MaXN0L0hlYWRlckNlbGwudHN4Iiwic291cmNlc0NvbnRlbnQiOlsiJ3VzZSBjbGllbnQnXG5cbmltcG9ydCBzdHlsZWQgZnJvbSAnQGVtb3Rpb24vc3R5bGVkJ1xuaW1wb3J0IHtcbiAgSW5mb3JtYXRpb25PdXRsaW5lSWNvbixcbiAgU29ydEljb24gYXMgU29ydEljb25VVixcbiAgU291dGhTaG9ydEljb24sXG59IGZyb20gJ0B1bHRyYXZpb2xldC9pY29ucydcbmltcG9ydCB0eXBlIHsgUmVhY3ROb2RlIH0gZnJvbSAncmVhY3QnXG5pbXBvcnQgeyBTdGFjayB9IGZyb20gJy4uL1N0YWNrJ1xuaW1wb3J0IHsgVG9vbHRpcCB9IGZyb20gJy4uL1Rvb2x0aXAnXG5cbmNvbnN0IFN0eWxlZFNvcnRJY29uID0gc3R5bGVkKFNvdXRoU2hvcnRJY29uLCB7XG4gIHNob3VsZEZvcndhcmRQcm9wOiBwcm9wID0+ICFbJ29yZGVyJ10uaW5jbHVkZXMocHJvcCksXG59KTx7IG9yZGVyOiAnYXNjZW5kaW5nJyB8ICdkZXNjZW5kaW5nJyB9PmBcbiAgdHJhbnNmb3JtOiAkeyh7IG9yZGVyIH0pID0+XG4gICAgb3JkZXIgPT09ICdhc2NlbmRpbmcnID8gJ3JvdGF0ZSgtMTgwZGVnKScgOiAnbm9uZSd9O1xuICB0cmFuc2l0aW9uOiB0cmFuc2Zvcm0gMC4ycyBlYXNlLWluLW91dDtcbmBcblxuY29uc3QgU29ydEljb24gPSAoeyBvcmRlciB9OiB7IG9yZGVyPzogJ2FzY2VuZGluZycgfCAnZGVzY2VuZGluZycgfSkgPT5cbiAgb3JkZXIgPyAoXG4gICAgPFN0eWxlZFNvcnRJY29uIG9yZGVyPXtvcmRlcn0gc2VudGltZW50PVwicHJpbWFyeVwiIC8+XG4gICkgOiAoXG4gICAgPFNvcnRJY29uVVYgc2VudGltZW50PVwibmV1dHJhbFwiIC8+XG4gIClcblxuY29uc3QgU3R5bGVkSGVhZGVyQ2VsbCA9IHN0eWxlZCgndGgnLCB7XG4gIHNob3VsZEZvcndhcmRQcm9wOiBwcm9wID0+ICFbJ3dpZHRoJywgJ21pbldpZHRoJywgJ21heFdpZHRoJ10uaW5jbHVkZXMocHJvcCksXG59KTx7IHdpZHRoPzogc3RyaW5nOyBtaW5XaWR0aD86IHN0cmluZzsgbWF4V2lkdGg/OiBzdHJpbmcgfT5gXG4gIGRpc3BsYXk6IHRhYmxlLWNlbGw7XG4gIHRleHQtYWxpZ246IGxlZnQ7XG4gIHZlcnRpY2FsLWFsaWduOiBtaWRkbGU7XG4gIGZvbnQtc2l6ZTogJHsoeyB0aGVtZSB9KSA9PiB0aGVtZS50eXBvZ3JhcGh5LmJvZHlTbWFsbC5mb250U2l6ZX07XG4gIGZvbnQtd2VpZ2h0OiAkeyh7IHRoZW1lIH0pID0+IHRoZW1lLnR5cG9ncmFwaHkuYm9keVNtYWxsLndlaWdodH07XG4gIGZvbnQtZmFtaWx5OiAkeyh7IHRoZW1lIH0pID0+IHRoZW1lLnR5cG9ncmFwaHkuYm9keVNtYWxsLmZvbnRGYW1pbHl9O1xuICBjb2xvcjogJHsoeyB0aGVtZSB9KSA9PiB0aGVtZS5jb2xvcnMubmV1dHJhbC50ZXh0fTtcbiAgZ2FwOiAkeyh7IHRoZW1lIH0pID0+IHRoZW1lLnNwYWNlWycxJ119O1xuICBwYWRkaW5nOiAwICR7KHsgdGhlbWUgfSkgPT4gdGhlbWUuc3BhY2VbJzInXX07XG5cbiAgJltyb2xlKj0nYnV0dG9uJ10ge1xuICAgIGN1cnNvcjogcG9pbnRlcjtcbiAgICB1c2VyLXNlbGVjdDogbm9uZTtcbiAgfVxuXG4gICZbYXJpYS1zb3J0XSB7XG4gICAgY29sb3I6ICR7KHsgdGhlbWUgfSkgPT4gdGhlbWUuY29sb3JzLnByaW1hcnkudGV4dH07XG4gIH1cblxuICB3aWR0aDogJHsoeyB3aWR0aCB9KSA9PiB3aWR0aH07XG4gIG1pbi13aWR0aDogJHsoeyBtaW5XaWR0aCB9KSA9PiBtaW5XaWR0aH07XG4gIG1heC13aWR0aDogJHsoeyBtYXhXaWR0aCB9KSA9PiBtYXhXaWR0aH07XG5gXG5cbnR5cGUgSGVhZGVyQ2VsbFByb3BzID0ge1xuICBjaGlsZHJlbjogUmVhY3ROb2RlXG4gIGNsYXNzTmFtZT86IHN0cmluZ1xuICBpc09yZGVyZWQ/OiBib29sZWFuXG4gIG9yZGVyRGlyZWN0aW9uPzogJ2FzYycgfCAnZGVzYycgfCAnbm9uZSdcbiAgb25PcmRlcj86IChuZXdPcmRlcjogJ2FzYycgfCAnZGVzYycpID0+IHZvaWRcbiAgaW5mbz86IHN0cmluZ1xuICB3aWR0aD86IHN0cmluZ1xuICBtaW5XaXRoPzogc3RyaW5nXG4gIG1heFdpZHRoPzogc3RyaW5nXG59XG5cbmV4cG9ydCBjb25zdCBIZWFkZXJDZWxsID0gKHtcbiAgY2hpbGRyZW4sXG4gIGlzT3JkZXJlZCxcbiAgb3JkZXJEaXJlY3Rpb24sXG4gIG9uT3JkZXIsXG4gIGNsYXNzTmFtZSxcbiAgaW5mbyxcbiAgd2lkdGgsXG4gIG1pbldpdGgsXG4gIG1heFdpZHRoLFxufTogSGVhZGVyQ2VsbFByb3BzKSA9PiB7XG4gIGxldCBvcmRlcjogdW5kZWZpbmVkIHwgJ2FzY2VuZGluZycgfCAnZGVzY2VuZGluZydcbiAgaWYgKGlzT3JkZXJlZCAmJiBvcmRlckRpcmVjdGlvbiA9PT0gJ2FzYycpIHtcbiAgICBvcmRlciA9ICdhc2NlbmRpbmcnXG4gIH0gZWxzZSBpZiAoaXNPcmRlcmVkICYmIG9yZGVyRGlyZWN0aW9uID09PSAnZGVzYycpIHtcbiAgICBvcmRlciA9ICdkZXNjZW5kaW5nJ1xuICB9XG5cbiAgY29uc3QgaGFuZGxlT3JkZXIgPSBvbk9yZGVyXG4gICAgPyAoKSA9PiBvbk9yZGVyKG9yZGVyID09PSAnYXNjZW5kaW5nJyA/ICdkZXNjJyA6ICdhc2MnKVxuICAgIDogdW5kZWZpbmVkXG5cbiAgcmV0dXJuIChcbiAgICA8U3R5bGVkSGVhZGVyQ2VsbFxuICAgICAgYXJpYS1zb3J0PXtvcmRlcn1cbiAgICAgIGNsYXNzTmFtZT17Y2xhc3NOYW1lfVxuICAgICAgbWF4V2lkdGg9e21heFdpZHRofVxuICAgICAgbWluV2lkdGg9e21pbldpdGh9XG4gICAgICBvbkNsaWNrPXtoYW5kbGVPcmRlcn1cbiAgICAgIG9uS2V5RG93bj17XG4gICAgICAgIGhhbmRsZU9yZGVyXG4gICAgICAgICAgPyBldmVudCA9PiB7XG4gICAgICAgICAgICAgIGlmIChldmVudC5rZXkgPT09ICcgJyB8fCBldmVudC5rZXkgPT09ICdFbnRlcicpIHtcbiAgICAgICAgICAgICAgICBoYW5kbGVPcmRlcigpXG4gICAgICAgICAgICAgICAgaWYgKGV2ZW50LmtleSA9PT0gJyAnKSB7XG4gICAgICAgICAgICAgICAgICAvLyBAbm90ZTogaXQgYXZvaWQgc2Nyb2xsIHdoZW4gcHJlc3NpbmcgU3BhY2VcbiAgICAgICAgICAgICAgICAgIGV2ZW50LnByZXZlbnREZWZhdWx0KClcbiAgICAgICAgICAgICAgICB9XG4gICAgICAgICAgICAgIH1cbiAgICAgICAgICAgIH1cbiAgICAgICAgICA6IHVuZGVmaW5lZFxuICAgICAgfVxuICAgICAgcm9sZT17b25PcmRlciA/ICdidXR0b24gY29sdW1uaGVhZGVyJyA6IHVuZGVmaW5lZH1cbiAgICAgIHRhYkluZGV4PXtoYW5kbGVPcmRlciA/IDAgOiAtMX1cbiAgICAgIHdpZHRoPXt3aWR0aH1cbiAgICA+XG4gICAgICA8U3RhY2sgYWxpZ25JdGVtcz1cImNlbnRlclwiIGRpcmVjdGlvbj1cInJvd1wiIGdhcD17MX0+XG4gICAgICAgIHtjaGlsZHJlbn1cbiAgICAgICAge2luZm8gPyAoXG4gICAgICAgICAgPFRvb2x0aXAgdGV4dD17aW5mb30+XG4gICAgICAgICAgICA8SW5mb3JtYXRpb25PdXRsaW5lSWNvblxuICAgICAgICAgICAgICBwcm9taW5lbmNlPVwid2Vha1wiXG4gICAgICAgICAgICAgIHNlbnRpbWVudD1cIm5ldXRyYWxcIlxuICAgICAgICAgICAgICBzaXplPVwic21hbGxcIlxuICAgICAgICAgICAgLz5cbiAgICAgICAgICA8L1Rvb2x0aXA+XG4gICAgICAgICkgOiBudWxsfVxuICAgICAgICB7b3JkZXJEaXJlY3Rpb24gIT09IHVuZGVmaW5lZCAmJiBpc09yZGVyZWQgIT09IHVuZGVmaW5lZCA/IChcbiAgICAgICAgICA8U29ydEljb24gb3JkZXI9e29yZGVyfSAvPlxuICAgICAgICApIDogbnVsbH1cbiAgICAgIDwvU3RhY2s+XG4gICAgPC9TdHlsZWRIZWFkZXJDZWxsPlxuICApXG59XG4iXX0= */"));
+}) => order ? /* @__PURE__ */ jsxRuntime.jsx(Icon.SouthShortIcon, { className: styles_css.listSortIcon[order], sentiment: "primary" }) : /* @__PURE__ */ jsxRuntime.jsx(Icon.SortIcon, { sentiment: "neutral" });
 const HeaderCell = ({
   children,
   isOrdered,
@@ -57,7 +19,7 @@ const HeaderCell = ({
   className,
   info,
   width,
-  minWith,
+  minWidth,
   maxWidth
 }) => {
   let order;
@@ -67,14 +29,18 @@ const HeaderCell = ({
     order = "descending";
   }
   const handleOrder = onOrder ? () => onOrder(order === "ascending" ? "desc" : "asc") : void 0;
-  return /* @__PURE__ */ jsxRuntime.jsx(StyledHeaderCell, { "aria-sort": order, className, maxWidth, minWidth: minWith, onClick: handleOrder, onKeyDown: handleOrder ? (event) => {
+  return /* @__PURE__ */ jsxRuntime.jsx("th", { "aria-sort": order, className: `${className ? `${className} ` : ""}${styles_css.listHeaderCell}`, onClick: handleOrder, onKeyDown: handleOrder ? (event) => {
     if (event.key === " " || event.key === "Enter") {
       handleOrder();
       if (event.key === " ") {
         event.preventDefault();
       }
     }
-  } : void 0, role: onOrder ? "button columnheader" : void 0, tabIndex: handleOrder ? 0 : -1, width, children: /* @__PURE__ */ jsxRuntime.jsxs(index.Stack, { alignItems: "center", direction: "row", gap: 1, children: [
+  } : void 0, role: onOrder ? "button columnheader" : void 0, style: dynamic.assignInlineVars({
+    [variables_css.widthHeaderCell]: width,
+    [variables_css.minWidthHeaderCell]: minWidth,
+    [variables_css.maxWidthHeaderCell]: maxWidth
+  }), tabIndex: handleOrder ? 0 : -1, children: /* @__PURE__ */ jsxRuntime.jsxs(index.Stack, { alignItems: "center", direction: "row", gap: 1, children: [
     children,
     info ? /* @__PURE__ */ jsxRuntime.jsx(index$1.Tooltip, { text: info, children: /* @__PURE__ */ jsxRuntime.jsx(Icon.InformationOutlineIcon, { prominence: "weak", sentiment: "neutral", size: "small" }) }) : null,
     orderDirection !== void 0 && isOrdered !== void 0 ? /* @__PURE__ */ jsxRuntime.jsx(SortIcon, { order }) : null

package/dist/components/List/HeaderCell.d.ts

@@ -7,8 +7,8 @@ type HeaderCellProps = {
     onOrder?: (newOrder: 'asc' | 'desc') => void;
     info?: string;
     width?: string;
-    minWith?: string;
+    minWidth?: string;
     maxWidth?: string;
 };
-export declare const HeaderCell: ({ children, isOrdered, orderDirection, onOrder, className, info, width, minWith, maxWidth, }: HeaderCellProps) => import("@emotion/react/jsx-runtime").JSX.Element;
+export declare const HeaderCell: ({ children, isOrdered, orderDirection, onOrder, className, info, width, minWidth, maxWidth, }: HeaderCellProps) => import("@emotion/react/jsx-runtime").JSX.Element;
 export {};

package/dist/components/List/HeaderCell.js

@@ -1,50 +1,14 @@
 "use client";
 import { jsx, jsxs } from "@emotion/react/jsx-runtime";
-import _styled from "@emotion/styled/base";
-import { InformationOutlineIcon, SortIcon as SortIcon$1, SouthShortIcon } from "@ultraviolet/icons";
+import { InformationOutlineIcon, SouthShortIcon, SortIcon as SortIcon$1 } from "@ultraviolet/icons";
+import { assignInlineVars } from "@vanilla-extract/dynamic";
 import { Stack } from "../Stack/index.js";
 import { Tooltip } from "../Tooltip/index.js";
-const StyledSortIcon = /* @__PURE__ */ _styled(SouthShortIcon, process.env.NODE_ENV === "production" ? {
-  shouldForwardProp: (prop) => !["order"].includes(prop),
-  target: "e1q5cnom1"
-} : {
-  shouldForwardProp: (prop) => !["order"].includes(prop),
-  target: "e1q5cnom1",
-  label: "StyledSortIcon"
-})("transform:", ({
-  order
-}) => order === "ascending" ? "rotate(-180deg)" : "none", ";transition:transform 0.2s ease-in-out;" + (process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIi9ob21lL3J1bm5lci93b3JrL3VsdHJhdmlvbGV0L3VsdHJhdmlvbGV0L3BhY2thZ2VzL3VpL3NyYy9jb21wb25lbnRzL0xpc3QvSGVhZGVyQ2VsbC50c3giXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBY3lDIiwiZmlsZSI6Ii9ob21lL3J1bm5lci93b3JrL3VsdHJhdmlvbGV0L3VsdHJhdmlvbGV0L3BhY2thZ2VzL3VpL3NyYy9jb21wb25lbnRzL0xpc3QvSGVhZGVyQ2VsbC50c3giLCJzb3VyY2VzQ29udGVudCI6WyIndXNlIGNsaWVudCdcblxuaW1wb3J0IHN0eWxlZCBmcm9tICdAZW1vdGlvbi9zdHlsZWQnXG5pbXBvcnQge1xuICBJbmZvcm1hdGlvbk91dGxpbmVJY29uLFxuICBTb3J0SWNvbiBhcyBTb3J0SWNvblVWLFxuICBTb3V0aFNob3J0SWNvbixcbn0gZnJvbSAnQHVsdHJhdmlvbGV0L2ljb25zJ1xuaW1wb3J0IHR5cGUgeyBSZWFjdE5vZGUgfSBmcm9tICdyZWFjdCdcbmltcG9ydCB7IFN0YWNrIH0gZnJvbSAnLi4vU3RhY2snXG5pbXBvcnQgeyBUb29sdGlwIH0gZnJvbSAnLi4vVG9vbHRpcCdcblxuY29uc3QgU3R5bGVkU29ydEljb24gPSBzdHlsZWQoU291dGhTaG9ydEljb24sIHtcbiAgc2hvdWxkRm9yd2FyZFByb3A6IHByb3AgPT4gIVsnb3JkZXInXS5pbmNsdWRlcyhwcm9wKSxcbn0pPHsgb3JkZXI6ICdhc2NlbmRpbmcnIHwgJ2Rlc2NlbmRpbmcnIH0+YFxuICB0cmFuc2Zvcm06ICR7KHsgb3JkZXIgfSkgPT5cbiAgICBvcmRlciA9PT0gJ2FzY2VuZGluZycgPyAncm90YXRlKC0xODBkZWcpJyA6ICdub25lJ307XG4gIHRyYW5zaXRpb246IHRyYW5zZm9ybSAwLjJzIGVhc2UtaW4tb3V0O1xuYFxuXG5jb25zdCBTb3J0SWNvbiA9ICh7IG9yZGVyIH06IHsgb3JkZXI/OiAnYXNjZW5kaW5nJyB8ICdkZXNjZW5kaW5nJyB9KSA9PlxuICBvcmRlciA/IChcbiAgICA8U3R5bGVkU29ydEljb24gb3JkZXI9e29yZGVyfSBzZW50aW1lbnQ9XCJwcmltYXJ5XCIgLz5cbiAgKSA6IChcbiAgICA8U29ydEljb25VViBzZW50aW1lbnQ9XCJuZXV0cmFsXCIgLz5cbiAgKVxuXG5jb25zdCBTdHlsZWRIZWFkZXJDZWxsID0gc3R5bGVkKCd0aCcsIHtcbiAgc2hvdWxkRm9yd2FyZFByb3A6IHByb3AgPT4gIVsnd2lkdGgnLCAnbWluV2lkdGgnLCAnbWF4V2lkdGgnXS5pbmNsdWRlcyhwcm9wKSxcbn0pPHsgd2lkdGg/OiBzdHJpbmc7IG1pbldpZHRoPzogc3RyaW5nOyBtYXhXaWR0aD86IHN0cmluZyB9PmBcbiAgZGlzcGxheTogdGFibGUtY2VsbDtcbiAgdGV4dC1hbGlnbjogbGVmdDtcbiAgdmVydGljYWwtYWxpZ246IG1pZGRsZTtcbiAgZm9udC1zaXplOiAkeyh7IHRoZW1lIH0pID0+IHRoZW1lLnR5cG9ncmFwaHkuYm9keVNtYWxsLmZvbnRTaXplfTtcbiAgZm9udC13ZWlnaHQ6ICR7KHsgdGhlbWUgfSkgPT4gdGhlbWUudHlwb2dyYXBoeS5ib2R5U21hbGwud2VpZ2h0fTtcbiAgZm9udC1mYW1pbHk6ICR7KHsgdGhlbWUgfSkgPT4gdGhlbWUudHlwb2dyYXBoeS5ib2R5U21hbGwuZm9udEZhbWlseX07XG4gIGNvbG9yOiAkeyh7IHRoZW1lIH0pID0+IHRoZW1lLmNvbG9ycy5uZXV0cmFsLnRleHR9O1xuICBnYXA6ICR7KHsgdGhlbWUgfSkgPT4gdGhlbWUuc3BhY2VbJzEnXX07XG4gIHBhZGRpbmc6IDAgJHsoeyB0aGVtZSB9KSA9PiB0aGVtZS5zcGFjZVsnMiddfTtcblxuICAmW3JvbGUqPSdidXR0b24nXSB7XG4gICAgY3Vyc29yOiBwb2ludGVyO1xuICAgIHVzZXItc2VsZWN0OiBub25lO1xuICB9XG5cbiAgJlthcmlhLXNvcnRdIHtcbiAgICBjb2xvcjogJHsoeyB0aGVtZSB9KSA9PiB0aGVtZS5jb2xvcnMucHJpbWFyeS50ZXh0fTtcbiAgfVxuXG4gIHdpZHRoOiAkeyh7IHdpZHRoIH0pID0+IHdpZHRofTtcbiAgbWluLXdpZHRoOiAkeyh7IG1pbldpZHRoIH0pID0+IG1pbldpZHRofTtcbiAgbWF4LXdpZHRoOiAkeyh7IG1heFdpZHRoIH0pID0+IG1heFdpZHRofTtcbmBcblxudHlwZSBIZWFkZXJDZWxsUHJvcHMgPSB7XG4gIGNoaWxkcmVuOiBSZWFjdE5vZGVcbiAgY2xhc3NOYW1lPzogc3RyaW5nXG4gIGlzT3JkZXJlZD86IGJvb2xlYW5cbiAgb3JkZXJEaXJlY3Rpb24/OiAnYXNjJyB8ICdkZXNjJyB8ICdub25lJ1xuICBvbk9yZGVyPzogKG5ld09yZGVyOiAnYXNjJyB8ICdkZXNjJykgPT4gdm9pZFxuICBpbmZvPzogc3RyaW5nXG4gIHdpZHRoPzogc3RyaW5nXG4gIG1pbldpdGg/OiBzdHJpbmdcbiAgbWF4V2lkdGg/OiBzdHJpbmdcbn1cblxuZXhwb3J0IGNvbnN0IEhlYWRlckNlbGwgPSAoe1xuICBjaGlsZHJlbixcbiAgaXNPcmRlcmVkLFxuICBvcmRlckRpcmVjdGlvbixcbiAgb25PcmRlcixcbiAgY2xhc3NOYW1lLFxuICBpbmZvLFxuICB3aWR0aCxcbiAgbWluV2l0aCxcbiAgbWF4V2lkdGgsXG59OiBIZWFkZXJDZWxsUHJvcHMpID0+IHtcbiAgbGV0IG9yZGVyOiB1bmRlZmluZWQgfCAnYXNjZW5kaW5nJyB8ICdkZXNjZW5kaW5nJ1xuICBpZiAoaXNPcmRlcmVkICYmIG9yZGVyRGlyZWN0aW9uID09PSAnYXNjJykge1xuICAgIG9yZGVyID0gJ2FzY2VuZGluZydcbiAgfSBlbHNlIGlmIChpc09yZGVyZWQgJiYgb3JkZXJEaXJlY3Rpb24gPT09ICdkZXNjJykge1xuICAgIG9yZGVyID0gJ2Rlc2NlbmRpbmcnXG4gIH1cblxuICBjb25zdCBoYW5kbGVPcmRlciA9IG9uT3JkZXJcbiAgICA/ICgpID0+IG9uT3JkZXIob3JkZXIgPT09ICdhc2NlbmRpbmcnID8gJ2Rlc2MnIDogJ2FzYycpXG4gICAgOiB1bmRlZmluZWRcblxuICByZXR1cm4gKFxuICAgIDxTdHlsZWRIZWFkZXJDZWxsXG4gICAgICBhcmlhLXNvcnQ9e29yZGVyfVxuICAgICAgY2xhc3NOYW1lPXtjbGFzc05hbWV9XG4gICAgICBtYXhXaWR0aD17bWF4V2lkdGh9XG4gICAgICBtaW5XaWR0aD17bWluV2l0aH1cbiAgICAgIG9uQ2xpY2s9e2hhbmRsZU9yZGVyfVxuICAgICAgb25LZXlEb3duPXtcbiAgICAgICAgaGFuZGxlT3JkZXJcbiAgICAgICAgICA/IGV2ZW50ID0+IHtcbiAgICAgICAgICAgICAgaWYgKGV2ZW50LmtleSA9PT0gJyAnIHx8IGV2ZW50LmtleSA9PT0gJ0VudGVyJykge1xuICAgICAgICAgICAgICAgIGhhbmRsZU9yZGVyKClcbiAgICAgICAgICAgICAgICBpZiAoZXZlbnQua2V5ID09PSAnICcpIHtcbiAgICAgICAgICAgICAgICAgIC8vIEBub3RlOiBpdCBhdm9pZCBzY3JvbGwgd2hlbiBwcmVzc2luZyBTcGFjZVxuICAgICAgICAgICAgICAgICAgZXZlbnQucHJldmVudERlZmF1bHQoKVxuICAgICAgICAgICAgICAgIH1cbiAgICAgICAgICAgICAgfVxuICAgICAgICAgICAgfVxuICAgICAgICAgIDogdW5kZWZpbmVkXG4gICAgICB9XG4gICAgICByb2xlPXtvbk9yZGVyID8gJ2J1dHRvbiBjb2x1bW5oZWFkZXInIDogdW5kZWZpbmVkfVxuICAgICAgdGFiSW5kZXg9e2hhbmRsZU9yZGVyID8gMCA6IC0xfVxuICAgICAgd2lkdGg9e3dpZHRofVxuICAgID5cbiAgICAgIDxTdGFjayBhbGlnbkl0ZW1zPVwiY2VudGVyXCIgZGlyZWN0aW9uPVwicm93XCIgZ2FwPXsxfT5cbiAgICAgICAge2NoaWxkcmVufVxuICAgICAgICB7aW5mbyA/IChcbiAgICAgICAgICA8VG9vbHRpcCB0ZXh0PXtpbmZvfT5cbiAgICAgICAgICAgIDxJbmZvcm1hdGlvbk91dGxpbmVJY29uXG4gICAgICAgICAgICAgIHByb21pbmVuY2U9XCJ3ZWFrXCJcbiAgICAgICAgICAgICAgc2VudGltZW50PVwibmV1dHJhbFwiXG4gICAgICAgICAgICAgIHNpemU9XCJzbWFsbFwiXG4gICAgICAgICAgICAvPlxuICAgICAgICAgIDwvVG9vbHRpcD5cbiAgICAgICAgKSA6IG51bGx9XG4gICAgICAgIHtvcmRlckRpcmVjdGlvbiAhPT0gdW5kZWZpbmVkICYmIGlzT3JkZXJlZCAhPT0gdW5kZWZpbmVkID8gKFxuICAgICAgICAgIDxTb3J0SWNvbiBvcmRlcj17b3JkZXJ9IC8+XG4gICAgICAgICkgOiBudWxsfVxuICAgICAgPC9TdGFjaz5cbiAgICA8L1N0eWxlZEhlYWRlckNlbGw+XG4gIClcbn1cbiJdfQ== */"));
+import { listHeaderCell, listSortIcon } from "./styles.css.js";
+import { maxWidthHeaderCell, minWidthHeaderCell, widthHeaderCell } from "./variables.css.js";
 const SortIcon = ({
   order
-}) => order ? /* @__PURE__ */ jsx(StyledSortIcon, { order, sentiment: "primary" }) : /* @__PURE__ */ jsx(SortIcon$1, { sentiment: "neutral" });
-const StyledHeaderCell = /* @__PURE__ */ _styled("th", process.env.NODE_ENV === "production" ? {
-  shouldForwardProp: (prop) => !["width", "minWidth", "maxWidth"].includes(prop),
-  target: "e1q5cnom0"
-} : {
-  shouldForwardProp: (prop) => !["width", "minWidth", "maxWidth"].includes(prop),
-  target: "e1q5cnom0",
-  label: "StyledHeaderCell"
-})("display:table-cell;text-align:left;vertical-align:middle;font-size:", ({
-  theme
-}) => theme.typography.bodySmall.fontSize, ";font-weight:", ({
-  theme
-}) => theme.typography.bodySmall.weight, ";font-family:", ({
-  theme
-}) => theme.typography.bodySmall.fontFamily, ";color:", ({
-  theme
-}) => theme.colors.neutral.text, ";gap:", ({
-  theme
-}) => theme.space["1"], ";padding:0 ", ({
-  theme
-}) => theme.space["2"], ";&[role*='button']{cursor:pointer;user-select:none;}&[aria-sort]{color:", ({
-  theme
-}) => theme.colors.primary.text, ";}width:", ({
-  width
-}) => width, ";min-width:", ({
-  minWidth
-}) => minWidth, ";max-width:", ({
-  maxWidth
-}) => maxWidth, ";" + (process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIi9ob21lL3J1bm5lci93b3JrL3VsdHJhdmlvbGV0L3VsdHJhdmlvbGV0L3BhY2thZ2VzL3VpL3NyYy9jb21wb25lbnRzL0xpc3QvSGVhZGVyQ2VsbC50c3giXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBNkI0RCIsImZpbGUiOiIvaG9tZS9ydW5uZXIvd29yay91bHRyYXZpb2xldC91bHRyYXZpb2xldC9wYWNrYWdlcy91aS9zcmMvY29tcG9uZW50cy9MaXN0L0hlYWRlckNlbGwudHN4Iiwic291cmNlc0NvbnRlbnQiOlsiJ3VzZSBjbGllbnQnXG5cbmltcG9ydCBzdHlsZWQgZnJvbSAnQGVtb3Rpb24vc3R5bGVkJ1xuaW1wb3J0IHtcbiAgSW5mb3JtYXRpb25PdXRsaW5lSWNvbixcbiAgU29ydEljb24gYXMgU29ydEljb25VVixcbiAgU291dGhTaG9ydEljb24sXG59IGZyb20gJ0B1bHRyYXZpb2xldC9pY29ucydcbmltcG9ydCB0eXBlIHsgUmVhY3ROb2RlIH0gZnJvbSAncmVhY3QnXG5pbXBvcnQgeyBTdGFjayB9IGZyb20gJy4uL1N0YWNrJ1xuaW1wb3J0IHsgVG9vbHRpcCB9IGZyb20gJy4uL1Rvb2x0aXAnXG5cbmNvbnN0IFN0eWxlZFNvcnRJY29uID0gc3R5bGVkKFNvdXRoU2hvcnRJY29uLCB7XG4gIHNob3VsZEZvcndhcmRQcm9wOiBwcm9wID0+ICFbJ29yZGVyJ10uaW5jbHVkZXMocHJvcCksXG59KTx7IG9yZGVyOiAnYXNjZW5kaW5nJyB8ICdkZXNjZW5kaW5nJyB9PmBcbiAgdHJhbnNmb3JtOiAkeyh7IG9yZGVyIH0pID0+XG4gICAgb3JkZXIgPT09ICdhc2NlbmRpbmcnID8gJ3JvdGF0ZSgtMTgwZGVnKScgOiAnbm9uZSd9O1xuICB0cmFuc2l0aW9uOiB0cmFuc2Zvcm0gMC4ycyBlYXNlLWluLW91dDtcbmBcblxuY29uc3QgU29ydEljb24gPSAoeyBvcmRlciB9OiB7IG9yZGVyPzogJ2FzY2VuZGluZycgfCAnZGVzY2VuZGluZycgfSkgPT5cbiAgb3JkZXIgPyAoXG4gICAgPFN0eWxlZFNvcnRJY29uIG9yZGVyPXtvcmRlcn0gc2VudGltZW50PVwicHJpbWFyeVwiIC8+XG4gICkgOiAoXG4gICAgPFNvcnRJY29uVVYgc2VudGltZW50PVwibmV1dHJhbFwiIC8+XG4gIClcblxuY29uc3QgU3R5bGVkSGVhZGVyQ2VsbCA9IHN0eWxlZCgndGgnLCB7XG4gIHNob3VsZEZvcndhcmRQcm9wOiBwcm9wID0+ICFbJ3dpZHRoJywgJ21pbldpZHRoJywgJ21heFdpZHRoJ10uaW5jbHVkZXMocHJvcCksXG59KTx7IHdpZHRoPzogc3RyaW5nOyBtaW5XaWR0aD86IHN0cmluZzsgbWF4V2lkdGg/OiBzdHJpbmcgfT5gXG4gIGRpc3BsYXk6IHRhYmxlLWNlbGw7XG4gIHRleHQtYWxpZ246IGxlZnQ7XG4gIHZlcnRpY2FsLWFsaWduOiBtaWRkbGU7XG4gIGZvbnQtc2l6ZTogJHsoeyB0aGVtZSB9KSA9PiB0aGVtZS50eXBvZ3JhcGh5LmJvZHlTbWFsbC5mb250U2l6ZX07XG4gIGZvbnQtd2VpZ2h0OiAkeyh7IHRoZW1lIH0pID0+IHRoZW1lLnR5cG9ncmFwaHkuYm9keVNtYWxsLndlaWdodH07XG4gIGZvbnQtZmFtaWx5OiAkeyh7IHRoZW1lIH0pID0+IHRoZW1lLnR5cG9ncmFwaHkuYm9keVNtYWxsLmZvbnRGYW1pbHl9O1xuICBjb2xvcjogJHsoeyB0aGVtZSB9KSA9PiB0aGVtZS5jb2xvcnMubmV1dHJhbC50ZXh0fTtcbiAgZ2FwOiAkeyh7IHRoZW1lIH0pID0+IHRoZW1lLnNwYWNlWycxJ119O1xuICBwYWRkaW5nOiAwICR7KHsgdGhlbWUgfSkgPT4gdGhlbWUuc3BhY2VbJzInXX07XG5cbiAgJltyb2xlKj0nYnV0dG9uJ10ge1xuICAgIGN1cnNvcjogcG9pbnRlcjtcbiAgICB1c2VyLXNlbGVjdDogbm9uZTtcbiAgfVxuXG4gICZbYXJpYS1zb3J0XSB7XG4gICAgY29sb3I6ICR7KHsgdGhlbWUgfSkgPT4gdGhlbWUuY29sb3JzLnByaW1hcnkudGV4dH07XG4gIH1cblxuICB3aWR0aDogJHsoeyB3aWR0aCB9KSA9PiB3aWR0aH07XG4gIG1pbi13aWR0aDogJHsoeyBtaW5XaWR0aCB9KSA9PiBtaW5XaWR0aH07XG4gIG1heC13aWR0aDogJHsoeyBtYXhXaWR0aCB9KSA9PiBtYXhXaWR0aH07XG5gXG5cbnR5cGUgSGVhZGVyQ2VsbFByb3BzID0ge1xuICBjaGlsZHJlbjogUmVhY3ROb2RlXG4gIGNsYXNzTmFtZT86IHN0cmluZ1xuICBpc09yZGVyZWQ/OiBib29sZWFuXG4gIG9yZGVyRGlyZWN0aW9uPzogJ2FzYycgfCAnZGVzYycgfCAnbm9uZSdcbiAgb25PcmRlcj86IChuZXdPcmRlcjogJ2FzYycgfCAnZGVzYycpID0+IHZvaWRcbiAgaW5mbz86IHN0cmluZ1xuICB3aWR0aD86IHN0cmluZ1xuICBtaW5XaXRoPzogc3RyaW5nXG4gIG1heFdpZHRoPzogc3RyaW5nXG59XG5cbmV4cG9ydCBjb25zdCBIZWFkZXJDZWxsID0gKHtcbiAgY2hpbGRyZW4sXG4gIGlzT3JkZXJlZCxcbiAgb3JkZXJEaXJlY3Rpb24sXG4gIG9uT3JkZXIsXG4gIGNsYXNzTmFtZSxcbiAgaW5mbyxcbiAgd2lkdGgsXG4gIG1pbldpdGgsXG4gIG1heFdpZHRoLFxufTogSGVhZGVyQ2VsbFByb3BzKSA9PiB7XG4gIGxldCBvcmRlcjogdW5kZWZpbmVkIHwgJ2FzY2VuZGluZycgfCAnZGVzY2VuZGluZydcbiAgaWYgKGlzT3JkZXJlZCAmJiBvcmRlckRpcmVjdGlvbiA9PT0gJ2FzYycpIHtcbiAgICBvcmRlciA9ICdhc2NlbmRpbmcnXG4gIH0gZWxzZSBpZiAoaXNPcmRlcmVkICYmIG9yZGVyRGlyZWN0aW9uID09PSAnZGVzYycpIHtcbiAgICBvcmRlciA9ICdkZXNjZW5kaW5nJ1xuICB9XG5cbiAgY29uc3QgaGFuZGxlT3JkZXIgPSBvbk9yZGVyXG4gICAgPyAoKSA9PiBvbk9yZGVyKG9yZGVyID09PSAnYXNjZW5kaW5nJyA/ICdkZXNjJyA6ICdhc2MnKVxuICAgIDogdW5kZWZpbmVkXG5cbiAgcmV0dXJuIChcbiAgICA8U3R5bGVkSGVhZGVyQ2VsbFxuICAgICAgYXJpYS1zb3J0PXtvcmRlcn1cbiAgICAgIGNsYXNzTmFtZT17Y2xhc3NOYW1lfVxuICAgICAgbWF4V2lkdGg9e21heFdpZHRofVxuICAgICAgbWluV2lkdGg9e21pbldpdGh9XG4gICAgICBvbkNsaWNrPXtoYW5kbGVPcmRlcn1cbiAgICAgIG9uS2V5RG93bj17XG4gICAgICAgIGhhbmRsZU9yZGVyXG4gICAgICAgICAgPyBldmVudCA9PiB7XG4gICAgICAgICAgICAgIGlmIChldmVudC5rZXkgPT09ICcgJyB8fCBldmVudC5rZXkgPT09ICdFbnRlcicpIHtcbiAgICAgICAgICAgICAgICBoYW5kbGVPcmRlcigpXG4gICAgICAgICAgICAgICAgaWYgKGV2ZW50LmtleSA9PT0gJyAnKSB7XG4gICAgICAgICAgICAgICAgICAvLyBAbm90ZTogaXQgYXZvaWQgc2Nyb2xsIHdoZW4gcHJlc3NpbmcgU3BhY2VcbiAgICAgICAgICAgICAgICAgIGV2ZW50LnByZXZlbnREZWZhdWx0KClcbiAgICAgICAgICAgICAgICB9XG4gICAgICAgICAgICAgIH1cbiAgICAgICAgICAgIH1cbiAgICAgICAgICA6IHVuZGVmaW5lZFxuICAgICAgfVxuICAgICAgcm9sZT17b25PcmRlciA/ICdidXR0b24gY29sdW1uaGVhZGVyJyA6IHVuZGVmaW5lZH1cbiAgICAgIHRhYkluZGV4PXtoYW5kbGVPcmRlciA/IDAgOiAtMX1cbiAgICAgIHdpZHRoPXt3aWR0aH1cbiAgICA+XG4gICAgICA8U3RhY2sgYWxpZ25JdGVtcz1cImNlbnRlclwiIGRpcmVjdGlvbj1cInJvd1wiIGdhcD17MX0+XG4gICAgICAgIHtjaGlsZHJlbn1cbiAgICAgICAge2luZm8gPyAoXG4gICAgICAgICAgPFRvb2x0aXAgdGV4dD17aW5mb30+XG4gICAgICAgICAgICA8SW5mb3JtYXRpb25PdXRsaW5lSWNvblxuICAgICAgICAgICAgICBwcm9taW5lbmNlPVwid2Vha1wiXG4gICAgICAgICAgICAgIHNlbnRpbWVudD1cIm5ldXRyYWxcIlxuICAgICAgICAgICAgICBzaXplPVwic21hbGxcIlxuICAgICAgICAgICAgLz5cbiAgICAgICAgICA8L1Rvb2x0aXA+XG4gICAgICAgICkgOiBudWxsfVxuICAgICAgICB7b3JkZXJEaXJlY3Rpb24gIT09IHVuZGVmaW5lZCAmJiBpc09yZGVyZWQgIT09IHVuZGVmaW5lZCA/IChcbiAgICAgICAgICA8U29ydEljb24gb3JkZXI9e29yZGVyfSAvPlxuICAgICAgICApIDogbnVsbH1cbiAgICAgIDwvU3RhY2s+XG4gICAgPC9TdHlsZWRIZWFkZXJDZWxsPlxuICApXG59XG4iXX0= */"));
+}) => order ? /* @__PURE__ */ jsx(SouthShortIcon, { className: listSortIcon[order], sentiment: "primary" }) : /* @__PURE__ */ jsx(SortIcon$1, { sentiment: "neutral" });
 const HeaderCell = ({
   children,
   isOrdered,
@@ -53,7 +17,7 @@ const HeaderCell = ({
   className,
   info,
   width,
-  minWith,
+  minWidth,
   maxWidth
 }) => {
   let order;
@@ -63,14 +27,18 @@ const HeaderCell = ({
     order = "descending";
   }
   const handleOrder = onOrder ? () => onOrder(order === "ascending" ? "desc" : "asc") : void 0;
-  return /* @__PURE__ */ jsx(StyledHeaderCell, { "aria-sort": order, className, maxWidth, minWidth: minWith, onClick: handleOrder, onKeyDown: handleOrder ? (event) => {
+  return /* @__PURE__ */ jsx("th", { "aria-sort": order, className: `${className ? `${className} ` : ""}${listHeaderCell}`, onClick: handleOrder, onKeyDown: handleOrder ? (event) => {
     if (event.key === " " || event.key === "Enter") {
       handleOrder();
       if (event.key === " ") {
         event.preventDefault();
       }
     }
-  } : void 0, role: onOrder ? "button columnheader" : void 0, tabIndex: handleOrder ? 0 : -1, width, children: /* @__PURE__ */ jsxs(Stack, { alignItems: "center", direction: "row", gap: 1, children: [
+  } : void 0, role: onOrder ? "button columnheader" : void 0, style: assignInlineVars({
+    [widthHeaderCell]: width,
+    [minWidthHeaderCell]: minWidth,
+    [maxWidthHeaderCell]: maxWidth
+  }), tabIndex: handleOrder ? 0 : -1, children: /* @__PURE__ */ jsxs(Stack, { alignItems: "center", direction: "row", gap: 1, children: [
     children,
     info ? /* @__PURE__ */ jsx(Tooltip, { text: info, children: /* @__PURE__ */ jsx(InformationOutlineIcon, { prominence: "weak", sentiment: "neutral", size: "small" }) }) : null,
     orderDirection !== void 0 && isOrdered !== void 0 ? /* @__PURE__ */ jsx(SortIcon, { order }) : null

package/dist/components/List/HeaderRow.cjs

@@ -2,31 +2,10 @@
 "use strict";
 Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
 const jsxRuntime = require("@emotion/react/jsx-runtime");
-const _styled = require("@emotion/styled/base");
 const index = require("../Checkbox/index.cjs");
-const constants = require("./constants.cjs");
 const HeaderCell = require("./HeaderCell.cjs");
 const ListContext = require("./ListContext.cjs");
-const _interopDefaultCompat = (e) => e && typeof e === "object" && "default" in e ? e : { default: e };
-const _styled__default = /* @__PURE__ */ _interopDefaultCompat(_styled);
-const StyledHeaderRow = /* @__PURE__ */ _styled__default.default("tr", process.env.NODE_ENV === "production" ? {
-  target: "epvvdb71"
-} : {
-  target: "epvvdb71",
-  label: "StyledHeaderRow"
-})("display:table-row;vertical-align:middle;padding:0 ", ({
-  theme
-}) => theme.space["2"], ";" + (process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIi9ob21lL3J1bm5lci93b3JrL3VsdHJhdmlvbGV0L3VsdHJhdmlvbGV0L3BhY2thZ2VzL3VpL3NyYy9jb21wb25lbnRzL0xpc3QvSGVhZGVyUm93LnRzeCJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFTaUMiLCJmaWxlIjoiL2hvbWUvcnVubmVyL3dvcmsvdWx0cmF2aW9sZXQvdWx0cmF2aW9sZXQvcGFja2FnZXMvdWkvc3JjL2NvbXBvbmVudHMvTGlzdC9IZWFkZXJSb3cudHN4Iiwic291cmNlc0NvbnRlbnQiOlsiJ3VzZSBjbGllbnQnXG5cbmltcG9ydCBzdHlsZWQgZnJvbSAnQGVtb3Rpb24vc3R5bGVkJ1xuaW1wb3J0IHR5cGUgeyBSZWFjdE5vZGUgfSBmcm9tICdyZWFjdCdcbmltcG9ydCB7IENoZWNrYm94IH0gZnJvbSAnLi4vQ2hlY2tib3gnXG5pbXBvcnQgeyBTRUxFQ1RBQkxFX0NIRUNLQk9YX1NJWkUgfSBmcm9tICcuL2NvbnN0YW50cydcbmltcG9ydCB7IEhlYWRlckNlbGwgfSBmcm9tICcuL0hlYWRlckNlbGwnXG5pbXBvcnQgeyB1c2VMaXN0Q29udGV4dCB9IGZyb20gJy4vTGlzdENvbnRleHQnXG5cbmNvbnN0IFN0eWxlZEhlYWRlclJvdyA9IHN0eWxlZC50cmBcbiAgLyogTGlzdCBpdHNlbGYgYWxzbyBhcHBseSBzdHlsZSBhYm91dCBjb21tb24gdGVtcGxhdGluZyBiZXR3ZWVuIEhlYWRlclJvdyBhbmQgb3RoZXIgUm93cyAqL1xuICBkaXNwbGF5OiB0YWJsZS1yb3c7XG4gIHZlcnRpY2FsLWFsaWduOiBtaWRkbGU7XG4gIHBhZGRpbmc6IDAgJHsoeyB0aGVtZSB9KSA9PiB0aGVtZS5zcGFjZVsnMiddfTtcbmBcblxuY29uc3QgTm9QYWRkaW5nSGVhZGVyQ2VsbCA9IHN0eWxlZChIZWFkZXJDZWxsKWBcbiAgcGFkZGluZzogMDtcblxuICAmOmZpcnN0LW9mLXR5cGUge1xuICAgIHBhZGRpbmctbGVmdDogJHsoeyB0aGVtZSB9KSA9PiB0aGVtZS5zcGFjZVsnMiddfTtcbiAgfVxuXG4gIG1heC13aWR0aDogJHsoeyB0aGVtZSB9KSA9PiB0aGVtZS5zaXppbmdbU0VMRUNUQUJMRV9DSEVDS0JPWF9TSVpFXX07XG5gXG5cbnR5cGUgUm93UHJvcHMgPSB7XG4gIGhhc1NlbGVjdEFsbENvbHVtbjogYm9vbGVhblxuICBjaGlsZHJlbjogUmVhY3ROb2RlXG59XG5cbmV4cG9ydCBjb25zdCBIZWFkZXJSb3cgPSAoeyBjaGlsZHJlbiwgaGFzU2VsZWN0QWxsQ29sdW1uIH06IFJvd1Byb3BzKSA9PiB7XG4gIGNvbnN0IHsgYWxsUm93U2VsZWN0VmFsdWUsIHNlbGVjdEFsbEhhbmRsZXIsIHNlbGVjdGVkUm93SWRzLCBleHBhbmRCdXR0b24gfSA9XG4gICAgdXNlTGlzdENvbnRleHQoKVxuXG4gIGNvbnN0IHNlbGVjdGFibGVSb3dDb3VudCA9IE9iamVjdC5rZXlzKHNlbGVjdGVkUm93SWRzKS5sZW5ndGhcblxuICByZXR1cm4gKFxuICAgIDx0aGVhZD5cbiAgICAgIDxTdHlsZWRIZWFkZXJSb3c+XG4gICAgICAgIHtoYXNTZWxlY3RBbGxDb2x1bW4gPyAoXG4gICAgICAgICAgPE5vUGFkZGluZ0hlYWRlckNlbGw+XG4gICAgICAgICAgICA8Q2hlY2tib3hcbiAgICAgICAgICAgICAgYXJpYS1sYWJlbD1cInNlbGVjdCBhbGxcIlxuICAgICAgICAgICAgICBjaGVja2VkPXthbGxSb3dTZWxlY3RWYWx1ZX1cbiAgICAgICAgICAgICAgZGlzYWJsZWQ9e3NlbGVjdGFibGVSb3dDb3VudCA9PT0gMH1cbiAgICAgICAgICAgICAgbmFtZT1cImxpc3Qtc2VsZWN0LWNoZWNrYm94XCJcbiAgICAgICAgICAgICAgb25DaGFuZ2U9e3NlbGVjdEFsbEhhbmRsZXJ9XG4gICAgICAgICAgICAgIHZhbHVlPVwiYWxsXCJcbiAgICAgICAgICAgIC8+XG4gICAgICAgICAgPC9Ob1BhZGRpbmdIZWFkZXJDZWxsPlxuICAgICAgICApIDogbnVsbH1cbiAgICAgICAge2V4cGFuZEJ1dHRvbiA/IChcbiAgICAgICAgICA8Tm9QYWRkaW5nSGVhZGVyQ2VsbD57bnVsbH08L05vUGFkZGluZ0hlYWRlckNlbGw+XG4gICAgICAgICkgOiBudWxsfVxuICAgICAgICB7Y2hpbGRyZW59XG4gICAgICA8L1N0eWxlZEhlYWRlclJvdz5cbiAgICA8L3RoZWFkPlxuICApXG59XG4iXX0= */"));
-const NoPaddingHeaderCell = /* @__PURE__ */ _styled__default.default(HeaderCell.HeaderCell, process.env.NODE_ENV === "production" ? {
-  target: "epvvdb70"
-} : {
-  target: "epvvdb70",
-  label: "NoPaddingHeaderCell"
-})("padding:0;&:first-of-type{padding-left:", ({
-  theme
-}) => theme.space["2"], ";}max-width:", ({
-  theme
-}) => theme.sizing[constants.SELECTABLE_CHECKBOX_SIZE], ";" + (process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIi9ob21lL3J1bm5lci93b3JrL3VsdHJhdmlvbGV0L3VsdHJhdmlvbGV0L3BhY2thZ2VzL3VpL3NyYy9jb21wb25lbnRzL0xpc3QvSGVhZGVyUm93LnRzeCJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFnQjhDIiwiZmlsZSI6Ii9ob21lL3J1bm5lci93b3JrL3VsdHJhdmlvbGV0L3VsdHJhdmlvbGV0L3BhY2thZ2VzL3VpL3NyYy9jb21wb25lbnRzL0xpc3QvSGVhZGVyUm93LnRzeCIsInNvdXJjZXNDb250ZW50IjpbIid1c2UgY2xpZW50J1xuXG5pbXBvcnQgc3R5bGVkIGZyb20gJ0BlbW90aW9uL3N0eWxlZCdcbmltcG9ydCB0eXBlIHsgUmVhY3ROb2RlIH0gZnJvbSAncmVhY3QnXG5pbXBvcnQgeyBDaGVja2JveCB9IGZyb20gJy4uL0NoZWNrYm94J1xuaW1wb3J0IHsgU0VMRUNUQUJMRV9DSEVDS0JPWF9TSVpFIH0gZnJvbSAnLi9jb25zdGFudHMnXG5pbXBvcnQgeyBIZWFkZXJDZWxsIH0gZnJvbSAnLi9IZWFkZXJDZWxsJ1xuaW1wb3J0IHsgdXNlTGlzdENvbnRleHQgfSBmcm9tICcuL0xpc3RDb250ZXh0J1xuXG5jb25zdCBTdHlsZWRIZWFkZXJSb3cgPSBzdHlsZWQudHJgXG4gIC8qIExpc3QgaXRzZWxmIGFsc28gYXBwbHkgc3R5bGUgYWJvdXQgY29tbW9uIHRlbXBsYXRpbmcgYmV0d2VlbiBIZWFkZXJSb3cgYW5kIG90aGVyIFJvd3MgKi9cbiAgZGlzcGxheTogdGFibGUtcm93O1xuICB2ZXJ0aWNhbC1hbGlnbjogbWlkZGxlO1xuICBwYWRkaW5nOiAwICR7KHsgdGhlbWUgfSkgPT4gdGhlbWUuc3BhY2VbJzInXX07XG5gXG5cbmNvbnN0IE5vUGFkZGluZ0hlYWRlckNlbGwgPSBzdHlsZWQoSGVhZGVyQ2VsbClgXG4gIHBhZGRpbmc6IDA7XG5cbiAgJjpmaXJzdC1vZi10eXBlIHtcbiAgICBwYWRkaW5nLWxlZnQ6ICR7KHsgdGhlbWUgfSkgPT4gdGhlbWUuc3BhY2VbJzInXX07XG4gIH1cblxuICBtYXgtd2lkdGg6ICR7KHsgdGhlbWUgfSkgPT4gdGhlbWUuc2l6aW5nW1NFTEVDVEFCTEVfQ0hFQ0tCT1hfU0laRV19O1xuYFxuXG50eXBlIFJvd1Byb3BzID0ge1xuICBoYXNTZWxlY3RBbGxDb2x1bW46IGJvb2xlYW5cbiAgY2hpbGRyZW46IFJlYWN0Tm9kZVxufVxuXG5leHBvcnQgY29uc3QgSGVhZGVyUm93ID0gKHsgY2hpbGRyZW4sIGhhc1NlbGVjdEFsbENvbHVtbiB9OiBSb3dQcm9wcykgPT4ge1xuICBjb25zdCB7IGFsbFJvd1NlbGVjdFZhbHVlLCBzZWxlY3RBbGxIYW5kbGVyLCBzZWxlY3RlZFJvd0lkcywgZXhwYW5kQnV0dG9uIH0gPVxuICAgIHVzZUxpc3RDb250ZXh0KClcblxuICBjb25zdCBzZWxlY3RhYmxlUm93Q291bnQgPSBPYmplY3Qua2V5cyhzZWxlY3RlZFJvd0lkcykubGVuZ3RoXG5cbiAgcmV0dXJuIChcbiAgICA8dGhlYWQ+XG4gICAgICA8U3R5bGVkSGVhZGVyUm93PlxuICAgICAgICB7aGFzU2VsZWN0QWxsQ29sdW1uID8gKFxuICAgICAgICAgIDxOb1BhZGRpbmdIZWFkZXJDZWxsPlxuICAgICAgICAgICAgPENoZWNrYm94XG4gICAgICAgICAgICAgIGFyaWEtbGFiZWw9XCJzZWxlY3QgYWxsXCJcbiAgICAgICAgICAgICAgY2hlY2tlZD17YWxsUm93U2VsZWN0VmFsdWV9XG4gICAgICAgICAgICAgIGRpc2FibGVkPXtzZWxlY3RhYmxlUm93Q291bnQgPT09IDB9XG4gICAgICAgICAgICAgIG5hbWU9XCJsaXN0LXNlbGVjdC1jaGVja2JveFwiXG4gICAgICAgICAgICAgIG9uQ2hhbmdlPXtzZWxlY3RBbGxIYW5kbGVyfVxuICAgICAgICAgICAgICB2YWx1ZT1cImFsbFwiXG4gICAgICAgICAgICAvPlxuICAgICAgICAgIDwvTm9QYWRkaW5nSGVhZGVyQ2VsbD5cbiAgICAgICAgKSA6IG51bGx9XG4gICAgICAgIHtleHBhbmRCdXR0b24gPyAoXG4gICAgICAgICAgPE5vUGFkZGluZ0hlYWRlckNlbGw+e251bGx9PC9Ob1BhZGRpbmdIZWFkZXJDZWxsPlxuICAgICAgICApIDogbnVsbH1cbiAgICAgICAge2NoaWxkcmVufVxuICAgICAgPC9TdHlsZWRIZWFkZXJSb3c+XG4gICAgPC90aGVhZD5cbiAgKVxufVxuIl19 */"));
+const styles_css = require("./styles.css.cjs");
 const HeaderRow = ({
   children,
   hasSelectAllColumn
@@ -38,9 +17,9 @@ const HeaderRow = ({
     expandButton
   } = ListContext.useListContext();
   const selectableRowCount = Object.keys(selectedRowIds).length;
-  return /* @__PURE__ */ jsxRuntime.jsx("thead", { children: /* @__PURE__ */ jsxRuntime.jsxs(StyledHeaderRow, { children: [
-    hasSelectAllColumn ? /* @__PURE__ */ jsxRuntime.jsx(NoPaddingHeaderCell, { children: /* @__PURE__ */ jsxRuntime.jsx(index.Checkbox, { "aria-label": "select all", checked: allRowSelectValue, disabled: selectableRowCount === 0, name: "list-select-checkbox", onChange: selectAllHandler, value: "all" }) }) : null,
-    expandButton ? /* @__PURE__ */ jsxRuntime.jsx(NoPaddingHeaderCell, { children: null }) : null,
+  return /* @__PURE__ */ jsxRuntime.jsx("thead", { children: /* @__PURE__ */ jsxRuntime.jsxs("tr", { className: styles_css.listHeaderRow, children: [
+    hasSelectAllColumn ? /* @__PURE__ */ jsxRuntime.jsx(HeaderCell.HeaderCell, { className: styles_css.listNoPaddingHeaderCell, children: /* @__PURE__ */ jsxRuntime.jsx(index.Checkbox, { "aria-label": "select all", checked: allRowSelectValue, disabled: selectableRowCount === 0, name: "list-select-checkbox", onChange: selectAllHandler, value: "all" }) }) : null,
+    expandButton ? /* @__PURE__ */ jsxRuntime.jsx(HeaderCell.HeaderCell, { className: styles_css.listNoPaddingHeaderCell, children: null }) : null,
     children
   ] }) });
 };

package/dist/components/List/HeaderRow.js

@@ -1,28 +1,9 @@
 "use client";
 import { jsx, jsxs } from "@emotion/react/jsx-runtime";
-import _styled from "@emotion/styled/base";
 import { Checkbox } from "../Checkbox/index.js";
-import { SELECTABLE_CHECKBOX_SIZE } from "./constants.js";
 import { HeaderCell } from "./HeaderCell.js";
 import { useListContext } from "./ListContext.js";
-const StyledHeaderRow = /* @__PURE__ */ _styled("tr", process.env.NODE_ENV === "production" ? {
-  target: "epvvdb71"
-} : {
-  target: "epvvdb71",
-  label: "StyledHeaderRow"
-})("display:table-row;vertical-align:middle;padding:0 ", ({
-  theme
-}) => theme.space["2"], ";" + (process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIi9ob21lL3J1bm5lci93b3JrL3VsdHJhdmlvbGV0L3VsdHJhdmlvbGV0L3BhY2thZ2VzL3VpL3NyYy9jb21wb25lbnRzL0xpc3QvSGVhZGVyUm93LnRzeCJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFTaUMiLCJmaWxlIjoiL2hvbWUvcnVubmVyL3dvcmsvdWx0cmF2aW9sZXQvdWx0cmF2aW9sZXQvcGFja2FnZXMvdWkvc3JjL2NvbXBvbmVudHMvTGlzdC9IZWFkZXJSb3cudHN4Iiwic291cmNlc0NvbnRlbnQiOlsiJ3VzZSBjbGllbnQnXG5cbmltcG9ydCBzdHlsZWQgZnJvbSAnQGVtb3Rpb24vc3R5bGVkJ1xuaW1wb3J0IHR5cGUgeyBSZWFjdE5vZGUgfSBmcm9tICdyZWFjdCdcbmltcG9ydCB7IENoZWNrYm94IH0gZnJvbSAnLi4vQ2hlY2tib3gnXG5pbXBvcnQgeyBTRUxFQ1RBQkxFX0NIRUNLQk9YX1NJWkUgfSBmcm9tICcuL2NvbnN0YW50cydcbmltcG9ydCB7IEhlYWRlckNlbGwgfSBmcm9tICcuL0hlYWRlckNlbGwnXG5pbXBvcnQgeyB1c2VMaXN0Q29udGV4dCB9IGZyb20gJy4vTGlzdENvbnRleHQnXG5cbmNvbnN0IFN0eWxlZEhlYWRlclJvdyA9IHN0eWxlZC50cmBcbiAgLyogTGlzdCBpdHNlbGYgYWxzbyBhcHBseSBzdHlsZSBhYm91dCBjb21tb24gdGVtcGxhdGluZyBiZXR3ZWVuIEhlYWRlclJvdyBhbmQgb3RoZXIgUm93cyAqL1xuICBkaXNwbGF5OiB0YWJsZS1yb3c7XG4gIHZlcnRpY2FsLWFsaWduOiBtaWRkbGU7XG4gIHBhZGRpbmc6IDAgJHsoeyB0aGVtZSB9KSA9PiB0aGVtZS5zcGFjZVsnMiddfTtcbmBcblxuY29uc3QgTm9QYWRkaW5nSGVhZGVyQ2VsbCA9IHN0eWxlZChIZWFkZXJDZWxsKWBcbiAgcGFkZGluZzogMDtcblxuICAmOmZpcnN0LW9mLXR5cGUge1xuICAgIHBhZGRpbmctbGVmdDogJHsoeyB0aGVtZSB9KSA9PiB0aGVtZS5zcGFjZVsnMiddfTtcbiAgfVxuXG4gIG1heC13aWR0aDogJHsoeyB0aGVtZSB9KSA9PiB0aGVtZS5zaXppbmdbU0VMRUNUQUJMRV9DSEVDS0JPWF9TSVpFXX07XG5gXG5cbnR5cGUgUm93UHJvcHMgPSB7XG4gIGhhc1NlbGVjdEFsbENvbHVtbjogYm9vbGVhblxuICBjaGlsZHJlbjogUmVhY3ROb2RlXG59XG5cbmV4cG9ydCBjb25zdCBIZWFkZXJSb3cgPSAoeyBjaGlsZHJlbiwgaGFzU2VsZWN0QWxsQ29sdW1uIH06IFJvd1Byb3BzKSA9PiB7XG4gIGNvbnN0IHsgYWxsUm93U2VsZWN0VmFsdWUsIHNlbGVjdEFsbEhhbmRsZXIsIHNlbGVjdGVkUm93SWRzLCBleHBhbmRCdXR0b24gfSA9XG4gICAgdXNlTGlzdENvbnRleHQoKVxuXG4gIGNvbnN0IHNlbGVjdGFibGVSb3dDb3VudCA9IE9iamVjdC5rZXlzKHNlbGVjdGVkUm93SWRzKS5sZW5ndGhcblxuICByZXR1cm4gKFxuICAgIDx0aGVhZD5cbiAgICAgIDxTdHlsZWRIZWFkZXJSb3c+XG4gICAgICAgIHtoYXNTZWxlY3RBbGxDb2x1bW4gPyAoXG4gICAgICAgICAgPE5vUGFkZGluZ0hlYWRlckNlbGw+XG4gICAgICAgICAgICA8Q2hlY2tib3hcbiAgICAgICAgICAgICAgYXJpYS1sYWJlbD1cInNlbGVjdCBhbGxcIlxuICAgICAgICAgICAgICBjaGVja2VkPXthbGxSb3dTZWxlY3RWYWx1ZX1cbiAgICAgICAgICAgICAgZGlzYWJsZWQ9e3NlbGVjdGFibGVSb3dDb3VudCA9PT0gMH1cbiAgICAgICAgICAgICAgbmFtZT1cImxpc3Qtc2VsZWN0LWNoZWNrYm94XCJcbiAgICAgICAgICAgICAgb25DaGFuZ2U9e3NlbGVjdEFsbEhhbmRsZXJ9XG4gICAgICAgICAgICAgIHZhbHVlPVwiYWxsXCJcbiAgICAgICAgICAgIC8+XG4gICAgICAgICAgPC9Ob1BhZGRpbmdIZWFkZXJDZWxsPlxuICAgICAgICApIDogbnVsbH1cbiAgICAgICAge2V4cGFuZEJ1dHRvbiA/IChcbiAgICAgICAgICA8Tm9QYWRkaW5nSGVhZGVyQ2VsbD57bnVsbH08L05vUGFkZGluZ0hlYWRlckNlbGw+XG4gICAgICAgICkgOiBudWxsfVxuICAgICAgICB7Y2hpbGRyZW59XG4gICAgICA8L1N0eWxlZEhlYWRlclJvdz5cbiAgICA8L3RoZWFkPlxuICApXG59XG4iXX0= */"));
-const NoPaddingHeaderCell = /* @__PURE__ */ _styled(HeaderCell, process.env.NODE_ENV === "production" ? {
-  target: "epvvdb70"
-} : {
-  target: "epvvdb70",
-  label: "NoPaddingHeaderCell"
-})("padding:0;&:first-of-type{padding-left:", ({
-  theme
-}) => theme.space["2"], ";}max-width:", ({
-  theme
-}) => theme.sizing[SELECTABLE_CHECKBOX_SIZE], ";" + (process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIi9ob21lL3J1bm5lci93b3JrL3VsdHJhdmlvbGV0L3VsdHJhdmlvbGV0L3BhY2thZ2VzL3VpL3NyYy9jb21wb25lbnRzL0xpc3QvSGVhZGVyUm93LnRzeCJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFnQjhDIiwiZmlsZSI6Ii9ob21lL3J1bm5lci93b3JrL3VsdHJhdmlvbGV0L3VsdHJhdmlvbGV0L3BhY2thZ2VzL3VpL3NyYy9jb21wb25lbnRzL0xpc3QvSGVhZGVyUm93LnRzeCIsInNvdXJjZXNDb250ZW50IjpbIid1c2UgY2xpZW50J1xuXG5pbXBvcnQgc3R5bGVkIGZyb20gJ0BlbW90aW9uL3N0eWxlZCdcbmltcG9ydCB0eXBlIHsgUmVhY3ROb2RlIH0gZnJvbSAncmVhY3QnXG5pbXBvcnQgeyBDaGVja2JveCB9IGZyb20gJy4uL0NoZWNrYm94J1xuaW1wb3J0IHsgU0VMRUNUQUJMRV9DSEVDS0JPWF9TSVpFIH0gZnJvbSAnLi9jb25zdGFudHMnXG5pbXBvcnQgeyBIZWFkZXJDZWxsIH0gZnJvbSAnLi9IZWFkZXJDZWxsJ1xuaW1wb3J0IHsgdXNlTGlzdENvbnRleHQgfSBmcm9tICcuL0xpc3RDb250ZXh0J1xuXG5jb25zdCBTdHlsZWRIZWFkZXJSb3cgPSBzdHlsZWQudHJgXG4gIC8qIExpc3QgaXRzZWxmIGFsc28gYXBwbHkgc3R5bGUgYWJvdXQgY29tbW9uIHRlbXBsYXRpbmcgYmV0d2VlbiBIZWFkZXJSb3cgYW5kIG90aGVyIFJvd3MgKi9cbiAgZGlzcGxheTogdGFibGUtcm93O1xuICB2ZXJ0aWNhbC1hbGlnbjogbWlkZGxlO1xuICBwYWRkaW5nOiAwICR7KHsgdGhlbWUgfSkgPT4gdGhlbWUuc3BhY2VbJzInXX07XG5gXG5cbmNvbnN0IE5vUGFkZGluZ0hlYWRlckNlbGwgPSBzdHlsZWQoSGVhZGVyQ2VsbClgXG4gIHBhZGRpbmc6IDA7XG5cbiAgJjpmaXJzdC1vZi10eXBlIHtcbiAgICBwYWRkaW5nLWxlZnQ6ICR7KHsgdGhlbWUgfSkgPT4gdGhlbWUuc3BhY2VbJzInXX07XG4gIH1cblxuICBtYXgtd2lkdGg6ICR7KHsgdGhlbWUgfSkgPT4gdGhlbWUuc2l6aW5nW1NFTEVDVEFCTEVfQ0hFQ0tCT1hfU0laRV19O1xuYFxuXG50eXBlIFJvd1Byb3BzID0ge1xuICBoYXNTZWxlY3RBbGxDb2x1bW46IGJvb2xlYW5cbiAgY2hpbGRyZW46IFJlYWN0Tm9kZVxufVxuXG5leHBvcnQgY29uc3QgSGVhZGVyUm93ID0gKHsgY2hpbGRyZW4sIGhhc1NlbGVjdEFsbENvbHVtbiB9OiBSb3dQcm9wcykgPT4ge1xuICBjb25zdCB7IGFsbFJvd1NlbGVjdFZhbHVlLCBzZWxlY3RBbGxIYW5kbGVyLCBzZWxlY3RlZFJvd0lkcywgZXhwYW5kQnV0dG9uIH0gPVxuICAgIHVzZUxpc3RDb250ZXh0KClcblxuICBjb25zdCBzZWxlY3RhYmxlUm93Q291bnQgPSBPYmplY3Qua2V5cyhzZWxlY3RlZFJvd0lkcykubGVuZ3RoXG5cbiAgcmV0dXJuIChcbiAgICA8dGhlYWQ+XG4gICAgICA8U3R5bGVkSGVhZGVyUm93PlxuICAgICAgICB7aGFzU2VsZWN0QWxsQ29sdW1uID8gKFxuICAgICAgICAgIDxOb1BhZGRpbmdIZWFkZXJDZWxsPlxuICAgICAgICAgICAgPENoZWNrYm94XG4gICAgICAgICAgICAgIGFyaWEtbGFiZWw9XCJzZWxlY3QgYWxsXCJcbiAgICAgICAgICAgICAgY2hlY2tlZD17YWxsUm93U2VsZWN0VmFsdWV9XG4gICAgICAgICAgICAgIGRpc2FibGVkPXtzZWxlY3RhYmxlUm93Q291bnQgPT09IDB9XG4gICAgICAgICAgICAgIG5hbWU9XCJsaXN0LXNlbGVjdC1jaGVja2JveFwiXG4gICAgICAgICAgICAgIG9uQ2hhbmdlPXtzZWxlY3RBbGxIYW5kbGVyfVxuICAgICAgICAgICAgICB2YWx1ZT1cImFsbFwiXG4gICAgICAgICAgICAvPlxuICAgICAgICAgIDwvTm9QYWRkaW5nSGVhZGVyQ2VsbD5cbiAgICAgICAgKSA6IG51bGx9XG4gICAgICAgIHtleHBhbmRCdXR0b24gPyAoXG4gICAgICAgICAgPE5vUGFkZGluZ0hlYWRlckNlbGw+e251bGx9PC9Ob1BhZGRpbmdIZWFkZXJDZWxsPlxuICAgICAgICApIDogbnVsbH1cbiAgICAgICAge2NoaWxkcmVufVxuICAgICAgPC9TdHlsZWRIZWFkZXJSb3c+XG4gICAgPC90aGVhZD5cbiAgKVxufVxuIl19 */"));
+import { listHeaderRow, listNoPaddingHeaderCell } from "./styles.css.js";
 const HeaderRow = ({
   children,
   hasSelectAllColumn
@@ -34,9 +15,9 @@ const HeaderRow = ({
     expandButton
   } = useListContext();
   const selectableRowCount = Object.keys(selectedRowIds).length;
-  return /* @__PURE__ */ jsx("thead", { children: /* @__PURE__ */ jsxs(StyledHeaderRow, { children: [
-    hasSelectAllColumn ? /* @__PURE__ */ jsx(NoPaddingHeaderCell, { children: /* @__PURE__ */ jsx(Checkbox, { "aria-label": "select all", checked: allRowSelectValue, disabled: selectableRowCount === 0, name: "list-select-checkbox", onChange: selectAllHandler, value: "all" }) }) : null,
-    expandButton ? /* @__PURE__ */ jsx(NoPaddingHeaderCell, { children: null }) : null,
+  return /* @__PURE__ */ jsx("thead", { children: /* @__PURE__ */ jsxs("tr", { className: listHeaderRow, children: [
+    hasSelectAllColumn ? /* @__PURE__ */ jsx(HeaderCell, { className: listNoPaddingHeaderCell, children: /* @__PURE__ */ jsx(Checkbox, { "aria-label": "select all", checked: allRowSelectValue, disabled: selectableRowCount === 0, name: "list-select-checkbox", onChange: selectAllHandler, value: "all" }) }) : null,
+    expandButton ? /* @__PURE__ */ jsx(HeaderCell, { className: listNoPaddingHeaderCell, children: null }) : null,
     children
   ] }) });
 };