@ultraviolet/ui 3.11.1 → 3.12.0

package/dist/components/SwitchButton/index.js

@@ -1,140 +1,149 @@
 'use client';
-import { __name } from "../../_virtual/_rolldown/runtime.js";
-import { Stack } from "../Stack/index.js";
-import { Tooltip } from "../Tooltip/index.js";
-import { switchButtonContainer } from "./styles.css.js";
-import { FocusOverlay } from "./FocusOverlay.js";
-import { SwitchButtonContext } from "./SwitchButtonContext.js";
-import { Option } from "./Option.js";
+import { __esmMin, __name } from "../../_virtual/_rolldown/runtime.js";
+import { Stack, init_Stack } from "../Stack/index.js";
+import { Tooltip, init_Tooltip } from "../Tooltip/index.js";
+import { init_constant } from "./constant.js";
+import { init_styles_css, switchButtonStyle } from "./styles.css.js";
+import { FocusOverlay, init_FocusOverlay } from "./FocusOverlay.js";
+import { SwitchButtonContext, init_SwitchButtonContext } from "./SwitchButtonContext.js";
+import { Option, init_Option } from "./Option.js";
 import { useCallback, useEffect, useMemo, useRef, useState } from "react";
-import { jsx, jsxs } from "react/jsx-runtime";
 import { cn } from "@ultraviolet/utils";
+import { jsx, jsxs } from "react/jsx-runtime";
 
 //#region src/components/SwitchButton/index.tsx
-/**
-* SwitchButton is a component that allows the user to select between two options.
-*/
-const SwitchButton = ({ value, onChange, onFocus, onBlur, name, size = "small", sentiment = "primary", tooltip, className, children, "data-testid": dataTestId, style }) => {
-	const containerRef = useRef(null);
-	const [localValue, setLocalValue] = useState(value);
-	const [refOptions, setRefOptions] = useState([]);
-	const [position, setPosition] = useState(0);
-	const [width, setWidth] = useState(0);
-	const [mouseDownSide, setMouseDownSide] = useState(null);
-	const getElement = useCallback((referenceValue) => {
-		var _refOptions$find;
-		return (_refOptions$find = refOptions.find((element) => element.current && element.value === referenceValue)) === null || _refOptions$find === void 0 ? void 0 : _refOptions$find.current;
-	}, [refOptions]);
-	const getPosition = (curentElement) => {
-		var _containerRef$current;
-		var _containerRef$current2;
-		if (!curentElement) return 0;
-		return curentElement.getBoundingClientRect().left - ((_containerRef$current = (_containerRef$current2 = containerRef.current) === null || _containerRef$current2 === void 0 ? void 0 : _containerRef$current2.getBoundingClientRect().left) !== null && _containerRef$current !== void 0 ? _containerRef$current : 0);
-	};
-	useEffect(() => {
-		var _getElement$offsetWid;
-		var _getElement;
-		setLocalValue(value);
-		setWidth((_getElement$offsetWid = (_getElement = getElement(value)) === null || _getElement === void 0 ? void 0 : _getElement.offsetWidth) !== null && _getElement$offsetWid !== void 0 ? _getElement$offsetWid : 0);
-		setPosition(getPosition(getElement(value)));
-	}, [
-		refOptions,
-		value,
-		getElement
-	]);
-	useEffect(() => {
-		const element = getElement(localValue);
-		if (!element) return;
-		const resizeObserver = new ResizeObserver(() => {
-			if (element.offsetWidth && (![
-				width,
-				width + 6,
-				width - 6
-			].includes(element.offsetWidth) || getPosition(element) !== position)) {
-				var _element$offsetWidth;
-				setWidth((_element$offsetWidth = element.offsetWidth) !== null && _element$offsetWidth !== void 0 ? _element$offsetWidth : 0);
-				setPosition(getPosition(element));
-			}
-		});
-		resizeObserver.observe(element);
-		return () => {
-			resizeObserver.disconnect();
+var SwitchButton;
+var init_SwitchButton = __esmMin(() => {
+	init_Stack();
+	init_Tooltip();
+	init_constant();
+	init_FocusOverlay();
+	init_Option();
+	init_SwitchButtonContext();
+	init_styles_css();
+	SwitchButton = ({ value, onChange, onFocus, onBlur, name, size = "small", sentiment = "primary", tooltip, className, children, "data-testid": dataTestId, style }) => {
+		const containerRef = useRef(null);
+		const [localValue, setLocalValue] = useState(value);
+		const [refOptions, setRefOptions] = useState([]);
+		const [position, setPosition] = useState(0);
+		const [width, setWidth] = useState(0);
+		const [mouseDownSide, setMouseDownSide] = useState(null);
+		const getElement = useCallback((referenceValue) => {
+			var _refOptions$find;
+			return (_refOptions$find = refOptions.find((element) => element.current && element.value === referenceValue)) === null || _refOptions$find === void 0 ? void 0 : _refOptions$find.current;
+		}, [refOptions]);
+		const getPosition = (curentElement) => {
+			var _containerRef$current;
+			var _containerRef$current2;
+			if (!curentElement) return 0;
+			return curentElement.getBoundingClientRect().left - ((_containerRef$current = (_containerRef$current2 = containerRef.current) === null || _containerRef$current2 === void 0 ? void 0 : _containerRef$current2.getBoundingClientRect().left) !== null && _containerRef$current !== void 0 ? _containerRef$current : 0);
 		};
-	}, [
-		getElement,
-		width,
-		position,
-		localValue,
-		children
-	]);
-	const handleOnChange = useCallback((event) => {
-		onChange === null || onChange === void 0 || onChange(event);
-		setLocalValue(event.target.value);
-		const currentElement = getElement(event.target.value);
-		if (currentElement && containerRef.current) {
-			var _currentElement$offse;
-			setWidth((_currentElement$offse = currentElement.offsetWidth) !== null && _currentElement$offse !== void 0 ? _currentElement$offse : 0);
-			setPosition(getPosition(currentElement));
-		}
-	}, [getElement, onChange]);
-	const valueContext = useMemo(() => ({
-		handleOnChange,
-		localValue,
-		name,
-		onBlur,
-		onFocus,
-		refOptions,
-		sentiment,
-		setRefOptions,
-		size
-	}), [
-		handleOnChange,
-		localValue,
-		name,
-		onBlur,
-		onFocus,
-		refOptions,
-		size,
-		sentiment
-	]);
-	return /* @__PURE__ */ jsx(SwitchButtonContext.Provider, {
-		value: valueContext,
-		children: /* @__PURE__ */ jsx(Tooltip, {
-			text: tooltip,
-			children: /* @__PURE__ */ jsxs(Stack, {
-				className: cn(className, switchButtonContainer[size]),
-				"data-testid": dataTestId,
-				direction: "row",
-				onMouseDown: (event) => {
-					const rect = event.currentTarget.getBoundingClientRect();
-					const clickX = event.clientX - rect.left;
-					if (clickX > position && clickX < position + width) setMouseDownSide(null);
-					else {
-						setMouseDownSide(clickX < getPosition(getElement(localValue)) ? "left" : "right");
-						setWidth(width + 6);
-					}
-				},
-				onMouseLeave: () => {
-					setMouseDownSide(null);
-					if (mouseDownSide) setWidth(width - 6);
-				},
-				onMouseUp: () => {
-					setMouseDownSide(null);
-					if (mouseDownSide) setWidth(width - 6);
-				},
-				ref: containerRef,
-				style,
-				children: [width ? /* @__PURE__ */ jsx(FocusOverlay, {
-					cardWidth: width,
-					mouseDownSide,
-					position,
-					sentiment
-				}) : null, children]
+		useEffect(() => {
+			var _getElement$offsetWid;
+			var _getElement;
+			setLocalValue(value);
+			setWidth((_getElement$offsetWid = (_getElement = getElement(value)) === null || _getElement === void 0 ? void 0 : _getElement.offsetWidth) !== null && _getElement$offsetWid !== void 0 ? _getElement$offsetWid : 0);
+			setPosition(getPosition(getElement(value)));
+		}, [
+			refOptions,
+			value,
+			getElement
+		]);
+		useEffect(() => {
+			const element = getElement(localValue);
+			if (!element) return;
+			const resizeObserver = new ResizeObserver(() => {
+				if (element.offsetWidth && (![
+					width,
+					width + 6,
+					width - 6
+				].includes(element.offsetWidth) || getPosition(element) !== position)) {
+					var _element$offsetWidth;
+					setWidth((_element$offsetWidth = element.offsetWidth) !== null && _element$offsetWidth !== void 0 ? _element$offsetWidth : 0);
+					setPosition(getPosition(element));
+				}
+			});
+			resizeObserver.observe(element);
+			return () => {
+				resizeObserver.disconnect();
+			};
+		}, [
+			getElement,
+			width,
+			position,
+			localValue,
+			children
+		]);
+		const handleOnChange = useCallback((event) => {
+			onChange === null || onChange === void 0 || onChange(event);
+			setLocalValue(event.target.value);
+			const currentElement = getElement(event.target.value);
+			if (currentElement && containerRef.current) {
+				var _currentElement$offse;
+				setWidth((_currentElement$offse = currentElement.offsetWidth) !== null && _currentElement$offse !== void 0 ? _currentElement$offse : 0);
+				setPosition(getPosition(currentElement));
+			}
+		}, [getElement, onChange]);
+		const valueContext = useMemo(() => ({
+			handleOnChange,
+			localValue,
+			name,
+			onBlur,
+			onFocus,
+			refOptions,
+			sentiment,
+			setRefOptions,
+			size
+		}), [
+			handleOnChange,
+			localValue,
+			name,
+			onBlur,
+			onFocus,
+			refOptions,
+			size,
+			sentiment
+		]);
+		return /* @__PURE__ */ jsx(SwitchButtonContext.Provider, {
+			value: valueContext,
+			children: /* @__PURE__ */ jsx(Tooltip, {
+				text: tooltip,
+				children: /* @__PURE__ */ jsxs(Stack, {
+					className: cn(className, switchButtonStyle.container[size]),
+					"data-testid": dataTestId,
+					direction: "row",
+					onMouseDown: (event) => {
+						const rect = event.currentTarget.getBoundingClientRect();
+						const clickX = event.clientX - rect.left;
+						if (clickX > position && clickX < position + width) setMouseDownSide(null);
+						else {
+							setMouseDownSide(clickX < getPosition(getElement(localValue)) ? "left" : "right");
+							setWidth(width + 6);
+						}
+					},
+					onMouseLeave: () => {
+						setMouseDownSide(null);
+						if (mouseDownSide) setWidth(width - 6);
+					},
+					onMouseUp: () => {
+						setMouseDownSide(null);
+						if (mouseDownSide) setWidth(width - 6);
+					},
+					ref: containerRef,
+					style,
+					children: [width ? /* @__PURE__ */ jsx(FocusOverlay, {
+						cardWidth: width,
+						mouseDownSide,
+						position,
+						sentiment
+					}) : null, children]
+				})
 			})
-		})
-	});
-};
-SwitchButton.Option = Option;
+		});
+	};
+	SwitchButton.Option = Option;
+});
 
 //#endregion
-export { SwitchButton };
+init_SwitchButton();
+export { SwitchButton, init_SwitchButton };

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

@@ -1,9 +1,8 @@
-export declare const switchButtonContainer: Record<"medium" | "small", string>;
-export declare const switchButtonOptionBase: string;
-/**
- * Create style variant so it is easier to deal with the global styles
- */
-export declare const switchButtonOptionPrimary: string;
-export declare const switchButtonOptionNeutral: string;
-export declare const focusOverlay: Record<"neutral" | "primary", string>;
+export declare const switchButtonStyle: {
+    container: Record<"medium" | "small", string>;
+    optionBase: string;
+    optionNeutral: string;
+    optionPrimary: string;
+    focusOverlay: Record<"neutral" | "primary", string>;
+};
 //# sourceMappingURL=styles.css.d.ts.map

package/dist/components/SwitchButton/styles.css.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"styles.css.d.ts","sourceRoot":"","sources":["../../../src/components/SwitchButton/styles.css.ts"],"names":[],"mappings":"AAkBA,eAAO,MAAM,qBAAqB,oCAGhC,CAAA;AAEF,eAAO,MAAM,sBAAsB,QAuBjC,CAAA;AAEF;;GAEG;AACH,eAAO,MAAM,yBAAyB,QAAY,CAAA;AAClD,eAAO,MAAM,yBAAyB,QAAY,CAAA;AAUlD,eAAO,MAAM,YAAY,uCASvB,CAAA"}
+{"version":3,"file":"styles.css.d.ts","sourceRoot":"","sources":["../../../src/components/SwitchButton/styles.css.ts"],"names":[],"mappings":"AAyEA,eAAO,MAAM,iBAAiB;;;;;;CAM7B,CAAA"}

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

@@ -1,17 +1,25 @@
-/* empty css                      */
+import { __esmMin } from "../../_virtual/_rolldown/runtime.js";
+import { init_styles_css_ts_vanilla } from "./styles.css.ts.vanilla.js";
 
 //#region src/components/SwitchButton/styles.css.ts
-var switchButtonContainer = {
-	medium: "uv_m5izgx1 uv_m5izgx0",
-	small: "uv_m5izgx2 uv_m5izgx0"
-};
-var switchButtonOptionBase = "uv_m5izgx3";
-var switchButtonOptionPrimary = "uv_m5izgx4";
-var switchButtonOptionNeutral = "uv_m5izgx5";
-var focusOverlay = {
-	neutral: "uv_m5izgx7 uv_m5izgx6",
-	primary: "uv_m5izgx8 uv_m5izgx6"
-};
+var switchButtonStyle;
+var init_styles_css = __esmMin(() => {
+	init_styles_css_ts_vanilla();
+	switchButtonStyle = {
+		container: {
+			medium: "uv_m5izgx1 uv_m5izgx0",
+			small: "uv_m5izgx2 uv_m5izgx0"
+		},
+		optionBase: "uv_m5izgx3",
+		optionNeutral: "uv_m5izgx5",
+		optionPrimary: "uv_m5izgx4",
+		focusOverlay: {
+			neutral: "uv_m5izgx7 uv_m5izgx6",
+			primary: "uv_m5izgx8 uv_m5izgx6"
+		}
+	};
+});
 
 //#endregion
-export { focusOverlay, switchButtonContainer, switchButtonOptionBase, switchButtonOptionNeutral, switchButtonOptionPrimary };
+init_styles_css();
+export { init_styles_css, switchButtonStyle };

package/dist/components/SwitchButton/styles.css.ts.vanilla.js

@@ -0,0 +1,8 @@
+import { __esmMin } from "../../_virtual/_rolldown/runtime.js";
+
+//#region src/components/SwitchButton/styles.css.ts.vanilla.css
+var init_styles_css_ts_vanilla = __esmMin(() => {});
+
+//#endregion
+init_styles_css_ts_vanilla();
+export { init_styles_css_ts_vanilla };

package/dist/components/Table/Body.js

@@ -1,9 +1,13 @@
 'use client';
-import { __name } from "../../_virtual/_rolldown/runtime.js";
+import { __esmMin, __name } from "../../_virtual/_rolldown/runtime.js";
 import { jsx } from "react/jsx-runtime";
 
 //#region src/components/Table/Body.tsx
-const Body = ({ children }) => /* @__PURE__ */ jsx("tbody", { children });
+var Body;
+var init_Body = __esmMin(() => {
+	Body = ({ children }) => /* @__PURE__ */ jsx("tbody", { children });
+});
 
 //#endregion
-export { Body };
+init_Body();
+export { Body, init_Body };

package/dist/components/Table/Cell.js

@@ -1,35 +1,43 @@
 'use client';
-import { __name } from "../../_virtual/_rolldown/runtime.js";
-import { _objectSpread2 } from "../../_virtual/_@oxc-project_runtime@0.114.0/helpers/objectSpread2.js";
-import { useColumnProvider } from "../List/ColumnProvider.js";
-import { tableCell } from "./styles.css.js";
-import { maxWidthCell, minWidthCell, widthCell } from "./variables.css.js";
+import { __esmMin, __name } from "../../_virtual/_rolldown/runtime.js";
+import { _objectSpread2, init_objectSpread2 } from "../../_virtual/_@oxc-project_runtime@0.115.0/helpers/objectSpread2.js";
+import { init_ColumnProvider, useColumnProvider } from "../List/ColumnProvider.js";
+import { init_styles_css, tableStyle } from "./styles.css.js";
+import { init_variables_css, maxWidthCell, minWidthCell, widthCell } from "./variables.css.js";
+import { cn } from "@ultraviolet/utils";
 import { assignInlineVars } from "@vanilla-extract/dynamic";
 import { jsx } from "react/jsx-runtime";
-import { cn } from "@ultraviolet/utils";
 
 //#region src/components/Table/Cell.tsx
-const Cell = ({ children, className, colSpan, rowSpan, sentiment, align = "left", style }) => {
-	var _context$width;
-	var _context$minWidth;
-	var _context$maxWidth;
-	const context = useColumnProvider();
-	return /* @__PURE__ */ jsx("td", {
-		align,
-		className: cn(className, tableCell({
+var Cell;
+var init_Cell = __esmMin(() => {
+	init_ColumnProvider();
+	init_styles_css();
+	init_variables_css();
+	init_objectSpread2();
+	Cell = ({ children, className, colSpan, rowSpan, sentiment, align = "left", style }) => {
+		var _context$width;
+		var _context$minWidth;
+		var _context$maxWidth;
+		const context = useColumnProvider();
+		return /* @__PURE__ */ jsx("td", {
 			align,
-			sentiment
-		})),
-		colSpan,
-		rowSpan,
-		style: _objectSpread2(_objectSpread2({}, assignInlineVars({
-			[widthCell]: (_context$width = context === null || context === void 0 ? void 0 : context.width) !== null && _context$width !== void 0 ? _context$width : "auto",
-			[minWidthCell]: (_context$minWidth = context === null || context === void 0 ? void 0 : context.minWidth) !== null && _context$minWidth !== void 0 ? _context$minWidth : "auto",
-			[maxWidthCell]: (_context$maxWidth = context === null || context === void 0 ? void 0 : context.maxWidth) !== null && _context$maxWidth !== void 0 ? _context$maxWidth : "none"
-		})), style),
-		children
-	});
-};
+			className: cn(className, tableStyle.cell({
+				align,
+				sentiment
+			})),
+			colSpan,
+			rowSpan,
+			style: _objectSpread2(_objectSpread2({}, assignInlineVars({
+				[widthCell]: (_context$width = context === null || context === void 0 ? void 0 : context.width) !== null && _context$width !== void 0 ? _context$width : "auto",
+				[minWidthCell]: (_context$minWidth = context === null || context === void 0 ? void 0 : context.minWidth) !== null && _context$minWidth !== void 0 ? _context$minWidth : "auto",
+				[maxWidthCell]: (_context$maxWidth = context === null || context === void 0 ? void 0 : context.maxWidth) !== null && _context$maxWidth !== void 0 ? _context$maxWidth : "none"
+			})), style),
+			children
+		});
+	};
+});
 
 //#endregion
-export { Cell };
+init_Cell();
+export { Cell, init_Cell };

package/dist/components/Table/Header.js

@@ -1,13 +1,18 @@
 'use client';
-import { __name } from "../../_virtual/_rolldown/runtime.js";
-import { tableHeader } from "./styles.css.js";
+import { __esmMin, __name } from "../../_virtual/_rolldown/runtime.js";
+import { init_styles_css, tableStyle } from "./styles.css.js";
 import { jsx } from "react/jsx-runtime";
 
 //#region src/components/Table/Header.tsx
-const Header = ({ children }) => /* @__PURE__ */ jsx("thead", {
-	className: tableHeader,
-	children
+var Header;
+var init_Header = __esmMin(() => {
+	init_styles_css();
+	Header = ({ children }) => /* @__PURE__ */ jsx("thead", {
+		className: tableStyle.header,
+		children
+	});
 });
 
 //#endregion
-export { Header };
+init_Header();
+export { Header, init_Header };

package/dist/components/Table/HeaderCell.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"HeaderCell.d.ts","sourceRoot":"","sources":["../../../src/components/Table/HeaderCell.tsx"],"names":[],"mappings":"AAOA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,OAAO,CAAA;AAkBtC,KAAK,eAAe,GAAG;IACrB,QAAQ,EAAE,SAAS,CAAA;IACnB,SAAS,CAAC,EAAE,MAAM,CAAA;IAClB,SAAS,CAAC,EAAE,OAAO,CAAA;IACnB,cAAc,CAAC,EAAE,KAAK,GAAG,MAAM,GAAG,MAAM,CAAA;IACxC,OAAO,CAAC,EAAE,CAAC,QAAQ,EAAE,KAAK,GAAG,MAAM,KAAK,IAAI,CAAA;IAC5C,IAAI,CAAC,EAAE,MAAM,CAAA;IACb,KAAK,CAAC,EAAE,MAAM,GAAG,QAAQ,GAAG,OAAO,CAAA;IACnC,KAAK,CAAC,EAAE,MAAM,CAAA;IACd,QAAQ,CAAC,EAAE,MAAM,CAAA;IACjB,QAAQ,CAAC,EAAE,MAAM,CAAA;IACjB,UAAU,CAAC,EAAE,OAAO,CAAA;CACrB,CAAA;AAED,eAAO,MAAM,UAAU,gLAyEtB,CAAA"}
+{"version":3,"file":"HeaderCell.d.ts","sourceRoot":"","sources":["../../../src/components/Table/HeaderCell.tsx"],"names":[],"mappings":"AAOA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,OAAO,CAAA;AAkBtC,KAAK,eAAe,GAAG;IACrB,QAAQ,EAAE,SAAS,CAAA;IACnB,SAAS,CAAC,EAAE,MAAM,CAAA;IAClB,SAAS,CAAC,EAAE,OAAO,CAAA;IACnB,cAAc,CAAC,EAAE,KAAK,GAAG,MAAM,GAAG,MAAM,CAAA;IACxC,OAAO,CAAC,EAAE,CAAC,QAAQ,EAAE,KAAK,GAAG,MAAM,KAAK,IAAI,CAAA;IAC5C,IAAI,CAAC,EAAE,MAAM,CAAA;IACb,KAAK,CAAC,EAAE,MAAM,GAAG,QAAQ,GAAG,OAAO,CAAA;IACnC,KAAK,CAAC,EAAE,MAAM,CAAA;IACd,QAAQ,CAAC,EAAE,MAAM,CAAA;IACjB,QAAQ,CAAC,EAAE,MAAM,CAAA;IACjB,UAAU,CAAC,EAAE,OAAO,CAAA;CACrB,CAAA;AAED,eAAO,MAAM,UAAU,gLA4EtB,CAAA"}

package/dist/components/Table/HeaderCell.js

@@ -1,71 +1,80 @@
 'use client';
-import { __name } from "../../_virtual/_rolldown/runtime.js";
-import { Tooltip } from "../Tooltip/index.js";
-import { Text } from "../Text/index.js";
-import { listSortIcon } from "../List/styles.css.js";
-import { headerCellText, tableHeaderCell } from "./styles.css.js";
-import { headerCellMaxWidth, headerCellMinWidth, headerCellWidth } from "./variables.css.js";
+import { __esmMin, __name } from "../../_virtual/_rolldown/runtime.js";
+import { Tooltip, init_Tooltip } from "../Tooltip/index.js";
+import { Text, init_Text } from "../Text/index.js";
+import { init_styles_css, listStyle } from "../List/styles.css.js";
+import { init_styles_css as init_styles_css$1, tableStyle } from "./styles.css.js";
+import { headerCellMaxWidth, headerCellMinWidth, headerCellWidth, init_variables_css } from "./variables.css.js";
+import { cn } from "@ultraviolet/utils";
 import { assignInlineVars } from "@vanilla-extract/dynamic";
 import { jsx, jsxs } from "react/jsx-runtime";
-import { cn } from "@ultraviolet/utils";
 import { InformationOutlineIcon } from "@ultraviolet/icons/InformationOutlineIcon";
 import { SortIcon } from "@ultraviolet/icons/SortIcon";
 import { SouthShortIcon } from "@ultraviolet/icons/SouthShortIcon";
 
 //#region src/components/Table/HeaderCell.tsx
-const SortIcon$1 = /* @__PURE__ */ __name(({ order }) => order ? /* @__PURE__ */ jsx(SouthShortIcon, {
-	className: listSortIcon[order],
-	sentiment: "primary"
-}) : /* @__PURE__ */ jsx(SortIcon, { sentiment: "neutral" }), "SortIcon");
-const HeaderCell = ({ children, className, isOrdered, onOrder, orderDirection, info, align, width, maxWidth, minWidth, isCheckbox }) => {
-	let order;
-	if (isOrdered && orderDirection === "asc") order = "ascending";
-	else if (isOrdered && orderDirection === "desc") order = "descending";
-	const handleOrder = onOrder ? () => onOrder(order === "ascending" ? "desc" : "asc") : void 0;
-	return /* @__PURE__ */ jsx("th", {
-		align,
-		"aria-sort": order,
-		className: cn(className, tableHeaderCell({
+var SortIcon$1, HeaderCell;
+var init_HeaderCell = __esmMin(() => {
+	init_styles_css();
+	init_Text();
+	init_Tooltip();
+	init_styles_css$1();
+	init_variables_css();
+	SortIcon$1 = /* @__PURE__ */ __name(({ order }) => order ? /* @__PURE__ */ jsx(SouthShortIcon, {
+		className: listStyle.sortIcon[order],
+		sentiment: "primary"
+	}) : /* @__PURE__ */ jsx(SortIcon, { sentiment: "neutral" }), "SortIcon");
+	HeaderCell = ({ children, className, isOrdered, onOrder, orderDirection, info, align, width, maxWidth, minWidth, isCheckbox }) => {
+		let order;
+		if (isOrdered && orderDirection === "asc") order = "ascending";
+		else if (isOrdered && orderDirection === "desc") order = "descending";
+		const handleOrder = onOrder ? () => onOrder(order === "ascending" ? "desc" : "asc") : void 0;
+		return /* @__PURE__ */ jsx("th", {
 			align,
-			checked: isCheckbox
-		})),
-		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,
-		style: assignInlineVars({
-			[headerCellWidth]: width !== null && width !== void 0 ? width : "auto",
-			[headerCellMaxWidth]: maxWidth !== null && maxWidth !== void 0 ? maxWidth : "none",
-			[headerCellMinWidth]: minWidth !== null && minWidth !== void 0 ? minWidth : "auto"
-		}),
-		tabIndex: handleOrder ? 0 : -1,
-		children: /* @__PURE__ */ jsxs(Text, {
-			as: "div",
-			className: headerCellText,
-			sentiment: order !== void 0 ? "primary" : "neutral",
-			variant: "bodySmall",
-			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$1, {
-					"aria-disabled": !onOrder,
-					order
-				}) : null
-			]
-		})
-	});
-};
+			"aria-sort": order,
+			className: cn(className, tableStyle.headerCell({
+				align,
+				checked: isCheckbox
+			})),
+			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,
+			style: assignInlineVars({
+				[headerCellWidth]: width !== null && width !== void 0 ? width : "auto",
+				[headerCellMaxWidth]: maxWidth !== null && maxWidth !== void 0 ? maxWidth : "none",
+				[headerCellMinWidth]: minWidth !== null && minWidth !== void 0 ? minWidth : "auto"
+			}),
+			tabIndex: handleOrder ? 0 : -1,
+			children: /* @__PURE__ */ jsxs(Text, {
+				as: "div",
+				className: tableStyle.headerCellText,
+				sentiment: order !== void 0 ? "primary" : "neutral",
+				variant: "bodySmall",
+				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$1, {
+						"aria-disabled": !onOrder,
+						order
+					}) : null
+				]
+			})
+		});
+	};
+});
 
 //#endregion
-export { HeaderCell };
+init_HeaderCell();
+export { HeaderCell, init_HeaderCell };