@ultraviolet/ui 3.12.3 → 3.13.0

package/dist/components/Table/TableContainer.js

@@ -0,0 +1,31 @@
+'use client';
+import { __esmMin, __name } from "../../_virtual/_rolldown/runtime.js";
+import { init_ListContext, useListContext } from "../List/ListContext.js";
+import { init_styles_css, listStyle } from "../List/styles.css.js";
+import { Children, useEffect, useState } from "react";
+import { jsx } from "react/jsx-runtime";
+
+//#region src/components/Table/TableContainer.tsx
+var TableContainer;
+var init_TableContainer = __esmMin(() => {
+	init_ListContext();
+	init_styles_css();
+	TableContainer = ({ children }) => {
+		const [childrenMemory, setChildrenMemory] = useState(Children.toArray(children));
+		const { setRefList } = useListContext();
+		useEffect(() => {
+			if (Children.toArray(children) !== childrenMemory) {
+				setRefList([]);
+				setChildrenMemory(Children.toArray(children));
+			}
+		}, [children, setRefList]);
+		return /* @__PURE__ */ jsx("div", {
+			className: listStyle.container,
+			children
+		});
+	};
+});
+
+//#endregion
+init_TableContainer();
+export { TableContainer, init_TableContainer };

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

@@ -1 +1 @@
-{"version":3,"file":"TableContext.d.ts","sourceRoot":"","sources":["../../../src/components/Table/TableContext.tsx"],"names":[],"mappings":"AAMA,OAAO,KAAK,EAAE,gBAAgB,EAAE,iBAAiB,EAAE,MAAM,qBAAqB,CAAA;AAC9E,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,SAAS,CAAA;AAE1C,KAAK,iBAAiB,GAAG,IAAI,CAAC,gBAAgB,EAAE,SAAS,CAAC,GAAG;IAC3D,QAAQ,EAAE,OAAO,CAAA;IACjB,OAAO,EAAE,WAAW,EAAE,CAAA;CACvB,CAAA;AAID,MAAM,MAAM,kBAAkB,GAAG,IAAI,CAAC,iBAAiB,EAAE,SAAS,CAAC,GAAG;IACpE,QAAQ,EAAE,OAAO,CAAA;IACjB,QAAQ,EAAE,OAAO,CAAA;IACjB,OAAO,EAAE,WAAW,EAAE,CAAA;CACvB,CAAA;AA0BD,eAAO,MAAM,aAAa,sHAiBzB,CAAA;AAGD,eAAO,MAAM,eAAe,yBAO3B,CAAA"}
+{"version":3,"file":"TableContext.d.ts","sourceRoot":"","sources":["../../../src/components/Table/TableContext.tsx"],"names":[],"mappings":"AAMA,OAAO,KAAK,EAAE,gBAAgB,EAAE,iBAAiB,EAAE,MAAM,qBAAqB,CAAA;AAC9E,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,SAAS,CAAA;AAE1C,KAAK,iBAAiB,GAAG,IAAI,CAAC,gBAAgB,EAAE,SAAS,CAAC,GAAG;IAC3D,QAAQ,EAAE,OAAO,CAAA;IACjB,OAAO,EAAE,WAAW,EAAE,CAAA;CACvB,CAAA;AAID,MAAM,MAAM,kBAAkB,GAAG,IAAI,CAAC,iBAAiB,EAAE,SAAS,CAAC,GAAG;IACpE,QAAQ,EAAE,OAAO,CAAA;IACjB,QAAQ,EAAE,OAAO,CAAA;IACjB,OAAO,EAAE,WAAW,EAAE,CAAA;CACvB,CAAA;AA2BD,eAAO,MAAM,aAAa,sHAiBzB,CAAA;AAGD,eAAO,MAAM,eAAe,yBAO3B,CAAA"}

package/dist/components/Table/TableContext.js

@@ -1,7 +1,7 @@
 'use client';
 import { __esmMin, __name } from "../../_virtual/_rolldown/runtime.js";
-import { _objectSpread2, init_objectSpread2 } from "../../_virtual/_@oxc-project_runtime@0.120.0/helpers/objectSpread2.js";
-import { _objectWithoutProperties, init_objectWithoutProperties } from "../../_virtual/_@oxc-project_runtime@0.120.0/helpers/objectWithoutProperties.js";
+import { _objectSpread2, init_objectSpread2 } from "../../_virtual/_@oxc-project_runtime@0.122.0/helpers/objectSpread2.js";
+import { _objectWithoutProperties, init_objectWithoutProperties } from "../../_virtual/_@oxc-project_runtime@0.122.0/helpers/objectWithoutProperties.js";
 import { ListProvider, init_ListContext, useListContext } from "../List/ListContext.js";
 import { createContext, useContext, useEffect, useMemo } from "react";
 import { jsx } from "react/jsx-runtime";

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

@@ -1,6 +1,6 @@
 import type { TableProviderProps } from './TableContext';
 import type { ColumnProps } from './types';
-import type { CSSProperties, ReactNode } from 'react';
+import type { CSSProperties } from 'react';
 export declare const BaseTable: import("react").ForwardRefExoticComponent<Omit<TableProviderProps, "autoCollapse" | "bordered" | "columns" | "expandButton" | "loading" | "selectable" | "stripped"> & {
     selectable?: boolean | undefined;
     /**
@@ -41,10 +41,10 @@ export declare const Table: import("react").ForwardRefExoticComponent<Omit<Table
     style?: CSSProperties | undefined;
 } & import("react").RefAttributes<HTMLTableElement>> & {
     Body: ({ children }: {
-        children: ReactNode;
+        children: import("react").ReactNode;
     }) => import("react/jsx-runtime").JSX.Element;
     Cell: ({ children, className, colSpan, rowSpan, sentiment, align, style, }: {
-        children?: ReactNode;
+        children?: import("react").ReactNode;
         className?: string | undefined;
         colSpan?: number | undefined;
         rowSpan?: number | undefined;
@@ -53,8 +53,8 @@ export declare const Table: import("react").ForwardRefExoticComponent<Omit<Table
         style?: CSSProperties | undefined;
     }) => import("react/jsx-runtime").JSX.Element;
     Row: ({ children, className, id, selectDisabled, highlightAnimation, expandable, expanded, style, 'data-testid': dataTestid, }: {
-        children: ReactNode;
-        expandable?: ReactNode;
+        children: import("react").ReactNode;
+        expandable?: import("react").ReactNode;
         className?: string | undefined;
         id: string;
         'data-testid'?: string | undefined;
@@ -68,7 +68,7 @@ export declare const Table: import("react").ForwardRefExoticComponent<Omit<Table
         children: (p: {
             selectedItems: T[];
             unselectAll: () => void;
-        }) => ReactNode;
+        }) => import("react").ReactNode;
         data: T[];
         idKey: keyof T;
     }) => import("react/jsx-runtime").JSX.Element | null;

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

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/Table/index.tsx"],"names":[],"mappings":"AAmBA,OAAO,KAAK,EAAE,kBAAkB,EAAE,MAAM,gBAAgB,CAAA;AACxD,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,SAAS,CAAA;AAC1C,OAAO,KAAK,EAAE,aAAa,EAAE,SAAS,EAAE,MAAM,OAAO,CAAA;AAwDrD,eAAO,MAAM,SAAS;;IApCpB;;OAEG;;;;;IAKH;;OAEG;;;;;;oDAkGJ,CAAA;AAED;;GAEG;AACH,eAAO,MAAM,KAAK;;IAhHhB;;OAEG;;;;;IAKH;;OAEG;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CA6GH,CAAA"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/Table/index.tsx"],"names":[],"mappings":"AAiBA,OAAO,KAAK,EAAE,kBAAkB,EAAE,MAAM,gBAAgB,CAAA;AACxD,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,SAAS,CAAA;AAC1C,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,OAAO,CAAA;AAqC1C,eAAO,MAAM,SAAS;;IAjBpB;;OAEG;;;;;IAKH;;OAEG;;;;;;oDA+EJ,CAAA;AAED;;GAEG;AACH,eAAO,MAAM,KAAK;;IA7FhB;;OAEG;;;;;IAKH;;OAEG;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CA0FH,CAAA"}

package/dist/components/Table/index.js

@@ -1,9 +1,7 @@
 'use client';
 import { __esmMin, __name } from "../../_virtual/_rolldown/runtime.js";
-import { init_ListContext, useListContext } from "../List/ListContext.js";
-import { init_styles_css, listStyle } from "../List/styles.css.js";
 import { Body, init_Body } from "./Body.js";
-import { init_styles_css as init_styles_css$1, tableStyle } from "./styles.css.js";
+import { init_styles_css, tableStyle } from "./styles.css.js";
 import { Cell, init_Cell } from "./Cell.js";
 import { Header, init_Header } from "./Header.js";
 import { HeaderCell, init_HeaderCell } from "./HeaderCell.js";
@@ -12,15 +10,14 @@ import { HeaderRow, init_HeaderRow } from "./HeaderRow.js";
 import { Row, init_Row } from "./Row.js";
 import { SelectBar, init_SelectBar } from "./SelectBar.js";
 import { SkeletonRows, init_SkeletonRows } from "./SkeletonRows.js";
-import { Children, forwardRef, useEffect, useState } from "react";
+import { TableContainer, init_TableContainer } from "./TableContainer.js";
+import { forwardRef } from "react";
 import { cn } from "@ultraviolet/utils";
 import { jsx, jsxs } from "react/jsx-runtime";
 
 //#region src/components/Table/index.tsx
-var TableContainer, BaseTable, Table;
+var BaseTable, Table;
 var init_Table = __esmMin(() => {
-	init_ListContext();
-	init_styles_css();
 	init_Body();
 	init_Cell();
 	init_Header();
@@ -29,22 +26,9 @@ var init_Table = __esmMin(() => {
 	init_Row();
 	init_SelectBar();
 	init_SkeletonRows();
-	init_styles_css$1();
+	init_styles_css();
+	init_TableContainer();
 	init_TableContext();
-	TableContainer = ({ children }) => {
-		const [childrenMemory, setChildrenMemory] = useState(Children.toArray(children));
-		const { setRefList } = useListContext();
-		useEffect(() => {
-			if (Children.toArray(children) !== childrenMemory) {
-				setRefList([]);
-				setChildrenMemory(Children.toArray(children));
-			}
-		}, [children, setRefList]);
-		return /* @__PURE__ */ jsx("div", {
-			className: listStyle.container,
-			children
-		});
-	};
 	BaseTable = forwardRef(({ selectable = false, expandable = false, children, columns, loading, bordered = false, stripped = false, autoCollapse = false, onSelectedChange, style, highlightHeader }, ref) => /* @__PURE__ */ jsx(TableProvider, {
 		autoCollapse,
 		bordered,

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

@@ -1,12 +1,10 @@
 import { __esmMin } from "../../_virtual/_rolldown/runtime.js";
-import { init_variables_css_ts_vanilla } from "./variables.css.ts.vanilla.js";
 import { init_styles_css_ts_vanilla } from "./styles.css.ts.vanilla.js";
 import { createRuntimeFn } from "@vanilla-extract/recipes/createRuntimeFn";
 
 //#region src/components/Table/styles.css.ts
 var tableStyle;
 var init_styles_css = __esmMin(() => {
-	init_variables_css_ts_vanilla();
 	init_styles_css_ts_vanilla();
 	tableStyle = {
 		stripped: "uv_1cpcscz2",

package/dist/components/Tabs/Tab.js

@@ -1,7 +1,7 @@
 'use client';
 import { __esmMin, __name } from "../../_virtual/_rolldown/runtime.js";
-import { _objectSpread2, init_objectSpread2 } from "../../_virtual/_@oxc-project_runtime@0.120.0/helpers/objectSpread2.js";
-import { _objectWithoutProperties, init_objectWithoutProperties } from "../../_virtual/_@oxc-project_runtime@0.120.0/helpers/objectWithoutProperties.js";
+import { _objectSpread2, init_objectSpread2 } from "../../_virtual/_@oxc-project_runtime@0.122.0/helpers/objectSpread2.js";
+import { _objectWithoutProperties, init_objectWithoutProperties } from "../../_virtual/_@oxc-project_runtime@0.122.0/helpers/objectWithoutProperties.js";
 import { Stack, init_Stack } from "../Stack/index.js";
 import { Tooltip, init_Tooltip } from "../Tooltip/index.js";
 import { Text, init_Text } from "../Text/index.js";

package/dist/components/Tabs/TabMenu.js

@@ -1,7 +1,7 @@
 'use client';
 import { __esmMin, __name } from "../../_virtual/_rolldown/runtime.js";
-import { _objectSpread2, init_objectSpread2 } from "../../_virtual/_@oxc-project_runtime@0.120.0/helpers/objectSpread2.js";
-import { _objectWithoutProperties, init_objectWithoutProperties } from "../../_virtual/_@oxc-project_runtime@0.120.0/helpers/objectWithoutProperties.js";
+import { _objectSpread2, init_objectSpread2 } from "../../_virtual/_@oxc-project_runtime@0.122.0/helpers/objectSpread2.js";
+import { _objectWithoutProperties, init_objectWithoutProperties } from "../../_virtual/_@oxc-project_runtime@0.122.0/helpers/objectWithoutProperties.js";
 import { Menu, init_Menu } from "../Menu/index.js";
 import { init_styles_css, tabsStyle } from "./styles.css.js";
 import { forwardRef } from "react";

package/dist/components/Tabs/TabMenuItem.js

@@ -1,7 +1,7 @@
 'use client';
 import { __esmMin, __name } from "../../_virtual/_rolldown/runtime.js";
-import { _objectSpread2, init_objectSpread2 } from "../../_virtual/_@oxc-project_runtime@0.120.0/helpers/objectSpread2.js";
-import { _objectWithoutProperties, init_objectWithoutProperties } from "../../_virtual/_@oxc-project_runtime@0.120.0/helpers/objectWithoutProperties.js";
+import { _objectSpread2, init_objectSpread2 } from "../../_virtual/_@oxc-project_runtime@0.122.0/helpers/objectSpread2.js";
+import { _objectWithoutProperties, init_objectWithoutProperties } from "../../_virtual/_@oxc-project_runtime@0.122.0/helpers/objectWithoutProperties.js";
 import { Menu, init_Menu } from "../Menu/index.js";
 import { init_styles_css, tabsStyle } from "./styles.css.js";
 import { init_TabsContext, useTabsContext } from "./TabsContext.js";

package/dist/components/Tabs/index.js

@@ -1,7 +1,7 @@
 'use client';
 import { __esmMin, __name } from "../../_virtual/_rolldown/runtime.js";
-import { _objectSpread2, init_objectSpread2 } from "../../_virtual/_@oxc-project_runtime@0.120.0/helpers/objectSpread2.js";
-import { _objectWithoutProperties, init_objectWithoutProperties } from "../../_virtual/_@oxc-project_runtime@0.120.0/helpers/objectWithoutProperties.js";
+import { _objectSpread2, init_objectSpread2 } from "../../_virtual/_@oxc-project_runtime@0.122.0/helpers/objectSpread2.js";
+import { _objectWithoutProperties, init_objectWithoutProperties } from "../../_virtual/_@oxc-project_runtime@0.122.0/helpers/objectWithoutProperties.js";
 import { init_styles_css, tabsStyle } from "./styles.css.js";
 import { TabsContext, init_TabsContext } from "./TabsContext.js";
 import { Tab, init_Tab } from "./Tab.js";

package/dist/components/Tag/TagInner.d.ts

@@ -0,0 +1,5 @@
+import type { TagProps } from './type';
+type TagInnerProps = Omit<TagProps, 'copyText' | 'copiedText' | 'className' | 'data-testid'>;
+export declare const TagInner: ({ children, isLoading, onClose, disabled, copiable, variant, copyButton, }: TagInnerProps) => import("react/jsx-runtime").JSX.Element;
+export {};
+//# sourceMappingURL=TagInner.d.ts.map

package/dist/components/Tag/TagInner.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"TagInner.d.ts","sourceRoot":"","sources":["../../../src/components/Tag/TagInner.tsx"],"names":[],"mappings":"AAWA,OAAO,KAAK,EAAE,QAAQ,EAAE,MAAM,QAAQ,CAAA;AAEtC,KAAK,aAAa,GAAG,IAAI,CACvB,QAAQ,EACR,UAAU,GAAG,YAAY,GAAG,WAAW,GAAG,aAAa,CACxD,CAAA;AAED,eAAO,MAAM,QAAQ,wIAsCpB,CAAA"}

package/dist/components/Tag/TagInner.js

@@ -0,0 +1,48 @@
+'use client';
+import { __esmMin, __name } from "../../_virtual/_rolldown/runtime.js";
+import { Text, init_Text } from "../Text/index.js";
+import { Loader, init_Loader } from "../Loader/index.js";
+import { Button, init_Button } from "../Button/index.js";
+import { init_styles_css, tagStyle } from "./styles.css.js";
+import { Fragment, jsx, jsxs } from "react/jsx-runtime";
+import { CloseIcon } from "@ultraviolet/icons/CloseIcon";
+import { CopyContentIcon } from "@ultraviolet/icons/CopyContentIcon";
+
+//#region src/components/Tag/TagInner.tsx
+var TagInner;
+var init_TagInner = __esmMin(() => {
+	init_Button();
+	init_Loader();
+	init_Text();
+	init_styles_css();
+	TagInner = ({ children, isLoading = false, onClose, disabled = false, copiable, variant, copyButton }) => /* @__PURE__ */ jsxs(Fragment, { children: [
+		/* @__PURE__ */ jsx(Text, {
+			"aria-disabled": disabled,
+			as: "span",
+			className: tagStyle.text,
+			oneLine: true,
+			variant: variant === "code" ? "code" : "caption",
+			children
+		}),
+		copiable && copyButton && !isLoading ? /* @__PURE__ */ jsx(CopyContentIcon, { size: "xsmall" }) : null,
+		onClose && !isLoading ? /* @__PURE__ */ jsx(Button, {
+			"aria-label": "Close tag",
+			className: tagStyle.closeButton,
+			"data-testid": "close-tag",
+			disabled,
+			onClick: onClose,
+			sentiment: "neutral",
+			size: "small",
+			variant: "ghost",
+			children: /* @__PURE__ */ jsx(CloseIcon, { size: "small" })
+		}) : null,
+		isLoading ? /* @__PURE__ */ jsx(Loader, {
+			active: true,
+			size: "small"
+		}) : null
+	] });
+});
+
+//#endregion
+init_TagInner();
+export { TagInner, init_TagInner };

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

@@ -1,37 +1,7 @@
-import type { SENTIMENTS } from './styles.css';
-import type { CSSProperties, MouseEventHandler, ReactNode } from 'react';
-type TagProps = {
-    isLoading?: boolean;
-    sentiment?: (typeof SENTIMENTS)[number];
-    disabled?: boolean;
-    className?: string;
-    variant?: 'default' | 'code';
-    'data-testid'?: string;
-    style?: CSSProperties;
-} & ({
-    keyValue: {
-        key: string;
-        value: string;
-    };
-    children?: never;
-    copiable?: never;
-    copyButton?: never;
-    copyText?: never;
-    copiedText?: never;
-    onClose?: never;
-} | {
-    keyValue?: never;
-    children: ReactNode;
-    copiable?: boolean;
-    copyButton?: boolean;
-    copyText?: string;
-    copiedText?: string;
-    onClose?: MouseEventHandler<HTMLButtonElement>;
-});
+import type { TagProps } from './type';
 /**
  * Tag component is used to display a short text description of an item. It can be used to display a category
  * or any other metadata.
  */
 export declare const Tag: ({ children, isLoading, onClose, copiable, copyButton, copyText, copiedText, disabled, sentiment, variant, className, style, keyValue, 'data-testid': dataTestId, }: TagProps) => import("react/jsx-runtime").JSX.Element;
-export {};
 //# sourceMappingURL=index.d.ts.map

package/dist/components/Tag/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/Tag/index.tsx"],"names":[],"mappings":"AAeA,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,cAAc,CAAA;AAC9C,OAAO,KAAK,EAAE,aAAa,EAAE,iBAAiB,EAAE,SAAS,EAAE,MAAM,OAAO,CAAA;AAIxE,KAAK,QAAQ,GAAG;IACd,SAAS,CAAC,EAAE,OAAO,CAAA;IACnB,SAAS,CAAC,EAAE,CAAC,OAAO,UAAU,CAAC,CAAC,MAAM,CAAC,CAAA;IACvC,QAAQ,CAAC,EAAE,OAAO,CAAA;IAElB,SAAS,CAAC,EAAE,MAAM,CAAA;IAClB,OAAO,CAAC,EAAE,SAAS,GAAG,MAAM,CAAA;IAC5B,aAAa,CAAC,EAAE,MAAM,CAAA;IACtB,KAAK,CAAC,EAAE,aAAa,CAAA;CACtB,GAAG,CACA;IACE,QAAQ,EAAE;QAAE,GAAG,EAAE,MAAM,CAAC;QAAC,KAAK,EAAE,MAAM,CAAA;KAAE,CAAA;IACxC,QAAQ,CAAC,EAAE,KAAK,CAAA;IAChB,QAAQ,CAAC,EAAE,KAAK,CAAA;IAChB,UAAU,CAAC,EAAE,KAAK,CAAA;IAClB,QAAQ,CAAC,EAAE,KAAK,CAAA;IAChB,UAAU,CAAC,EAAE,KAAK,CAAA;IAClB,OAAO,CAAC,EAAE,KAAK,CAAA;CAChB,GACD;IACE,QAAQ,CAAC,EAAE,KAAK,CAAA;IAChB,QAAQ,EAAE,SAAS,CAAA;IACnB,QAAQ,CAAC,EAAE,OAAO,CAAA;IAClB,UAAU,CAAC,EAAE,OAAO,CAAA;IACpB,QAAQ,CAAC,EAAE,MAAM,CAAA;IAEjB,UAAU,CAAC,EAAE,MAAM,CAAA;IACnB,OAAO,CAAC,EAAE,iBAAiB,CAAC,iBAAiB,CAAC,CAAA;CAC/C,CACJ,CAAA;AA+CD;;;GAGG;AACH,eAAO,MAAM,GAAG,2NAmIf,CAAA"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/Tag/index.tsx"],"names":[],"mappings":"AAUA,OAAO,KAAK,EAAE,QAAQ,EAAE,MAAM,QAAQ,CAAA;AAItC;;;GAGG;AACH,eAAO,MAAM,GAAG,2NAmIf,CAAA"}

package/dist/components/Tag/index.js

@@ -1,52 +1,19 @@
 'use client';
 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 { Loader, init_Loader } from "../Loader/index.js";
-import { Button, init_Button } from "../Button/index.js";
 import { init_styles_css, tagStyle } from "./styles.css.js";
+import { TagInner, init_TagInner } from "./TagInner.js";
 import { useMemo } from "react";
-import { cn } from "@ultraviolet/utils";
+import { cn, useClipboard } from "@ultraviolet/utils";
 import { Fragment as Fragment$1, jsx, jsxs } from "react/jsx-runtime";
-import { CloseIcon } from "@ultraviolet/icons/CloseIcon";
-import { CopyContentIcon } from "@ultraviolet/icons/CopyContentIcon";
-import useClipboard from "react-use-clipboard";
 
 //#region src/components/Tag/index.tsx
-var COPY_DURATION, TagInner, Tag;
+var COPY_DURATION, Tag;
 var init_Tag = __esmMin(() => {
-	init_Button();
-	init_Loader();
-	init_Text();
 	init_Tooltip();
 	init_styles_css();
+	init_TagInner();
 	COPY_DURATION = 2500;
-	TagInner = ({ children, isLoading = false, onClose, disabled = false, copiable, variant, copyButton }) => /* @__PURE__ */ jsxs(Fragment$1, { children: [
-		/* @__PURE__ */ jsx(Text, {
-			"aria-disabled": disabled,
-			as: "span",
-			className: tagStyle.text,
-			oneLine: true,
-			variant: variant === "code" ? "code" : "caption",
-			children
-		}),
-		copiable && copyButton && !isLoading ? /* @__PURE__ */ jsx(CopyContentIcon, { size: "xsmall" }) : null,
-		onClose && !isLoading ? /* @__PURE__ */ jsx(Button, {
-			"aria-label": "Close tag",
-			className: tagStyle.closeButton,
-			"data-testid": "close-tag",
-			disabled,
-			onClick: onClose,
-			sentiment: "neutral",
-			size: "small",
-			variant: "ghost",
-			children: /* @__PURE__ */ jsx(CloseIcon, { size: "small" })
-		}) : null,
-		isLoading ? /* @__PURE__ */ jsx(Loader, {
-			active: true,
-			size: "small"
-		}) : null
-	] });
 	Tag = ({ children, isLoading, onClose, copiable = false, copyButton, copyText = "Copy", copiedText = "Copied!", disabled, sentiment = "neutral", variant = "default", className, style, keyValue, "data-testid": dataTestId }) => {
 		const [isCopied, setCopied] = useClipboard(useMemo(() => {
 			if (typeof children === "string") return children;
@@ -63,7 +30,6 @@ var init_Tag = __esmMin(() => {
 			"data-testid": dataTestId,
 			style,
 			children: /* @__PURE__ */ jsx(TagInner, {
-				copiable: true,
 				copyButton,
 				disabled,
 				isLoading,
@@ -81,7 +47,6 @@ var init_Tag = __esmMin(() => {
 			"data-testid": dataTestId,
 			style,
 			children: /* @__PURE__ */ jsx(TagInner, {
-				copiable: true,
 				copyButton,
 				disabled,
 				isLoading,
@@ -100,7 +65,9 @@ var init_Tag = __esmMin(() => {
 				})),
 				"data-testid": dataTestId,
 				disabled,
-				onClick: setCopied,
+				onClick: () => {
+					setCopied().catch(() => null);
+				},
 				type: "button",
 				children: /* @__PURE__ */ jsx(TagInner, {
 					copiable: true,

package/dist/components/Tag/type.d.ts

@@ -0,0 +1,31 @@
+import type { SENTIMENTS } from './styles.css';
+import type { CSSProperties, MouseEventHandler, ReactNode } from 'react';
+export type TagProps = {
+    isLoading?: boolean;
+    sentiment?: (typeof SENTIMENTS)[number];
+    disabled?: boolean;
+    className?: string;
+    variant?: 'default' | 'code';
+    'data-testid'?: string;
+    style?: CSSProperties;
+} & ({
+    keyValue: {
+        key: string;
+        value: string;
+    };
+    children?: never;
+    copiable?: never;
+    copyButton?: never;
+    copyText?: never;
+    copiedText?: never;
+    onClose?: never;
+} | {
+    keyValue?: never;
+    children: ReactNode;
+    copiable?: boolean;
+    copyButton?: boolean;
+    copyText?: string;
+    copiedText?: string;
+    onClose?: MouseEventHandler<HTMLButtonElement>;
+});
+//# sourceMappingURL=type.d.ts.map

package/dist/components/Tag/type.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"type.d.ts","sourceRoot":"","sources":["../../../src/components/Tag/type.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,cAAc,CAAA;AAC9C,OAAO,KAAK,EAAE,aAAa,EAAE,iBAAiB,EAAE,SAAS,EAAE,MAAM,OAAO,CAAA;AAExE,MAAM,MAAM,QAAQ,GAAG;IACrB,SAAS,CAAC,EAAE,OAAO,CAAA;IACnB,SAAS,CAAC,EAAE,CAAC,OAAO,UAAU,CAAC,CAAC,MAAM,CAAC,CAAA;IACvC,QAAQ,CAAC,EAAE,OAAO,CAAA;IAElB,SAAS,CAAC,EAAE,MAAM,CAAA;IAClB,OAAO,CAAC,EAAE,SAAS,GAAG,MAAM,CAAA;IAC5B,aAAa,CAAC,EAAE,MAAM,CAAA;IACtB,KAAK,CAAC,EAAE,aAAa,CAAA;CACtB,GAAG,CACA;IACE,QAAQ,EAAE;QAAE,GAAG,EAAE,MAAM,CAAC;QAAC,KAAK,EAAE,MAAM,CAAA;KAAE,CAAA;IACxC,QAAQ,CAAC,EAAE,KAAK,CAAA;IAChB,QAAQ,CAAC,EAAE,KAAK,CAAA;IAChB,UAAU,CAAC,EAAE,KAAK,CAAA;IAClB,QAAQ,CAAC,EAAE,KAAK,CAAA;IAChB,UAAU,CAAC,EAAE,KAAK,CAAA;IAClB,OAAO,CAAC,EAAE,KAAK,CAAA;CAChB,GACD;IACE,QAAQ,CAAC,EAAE,KAAK,CAAA;IAChB,QAAQ,EAAE,SAAS,CAAA;IACnB,QAAQ,CAAC,EAAE,OAAO,CAAA;IAClB,UAAU,CAAC,EAAE,OAAO,CAAA;IACpB,QAAQ,CAAC,EAAE,MAAM,CAAA;IAEjB,UAAU,CAAC,EAAE,MAAM,CAAA;IACnB,OAAO,CAAC,EAAE,iBAAiB,CAAC,iBAAiB,CAAC,CAAA;CAC/C,CACJ,CAAA"}

package/dist/components/TagInput/index.js

@@ -1,6 +1,6 @@
 'use client';
 import { __esmMin, __name } from "../../_virtual/_rolldown/runtime.js";
-import { _objectSpread2, init_objectSpread2 } from "../../_virtual/_@oxc-project_runtime@0.120.0/helpers/objectSpread2.js";
+import { _objectSpread2, init_objectSpread2 } from "../../_virtual/_@oxc-project_runtime@0.122.0/helpers/objectSpread2.js";
 import { Stack, init_Stack } from "../Stack/index.js";
 import { Tooltip, init_Tooltip } from "../Tooltip/index.js";
 import { Text, init_Text } from "../Text/index.js";

package/dist/components/TagList/constant.d.ts

@@ -1,2 +1,4 @@
 export declare const TAGS_GAP: string;
+export declare const DEFAULT_POPOVER_MAX_HEIGHT = "16rem";
+export declare const MIN_TAG_WIDTH = 32;
 //# sourceMappingURL=constant.d.ts.map

package/dist/components/TagList/constant.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"constant.d.ts","sourceRoot":"","sources":["../../../src/components/TagList/constant.ts"],"names":[],"mappings":"AAEA,eAAO,MAAM,QAAQ,QAA+B,CAAA"}
+{"version":3,"file":"constant.d.ts","sourceRoot":"","sources":["../../../src/components/TagList/constant.ts"],"names":[],"mappings":"AAEA,eAAO,MAAM,QAAQ,QAA+B,CAAA;AAEpD,eAAO,MAAM,0BAA0B,UAAU,CAAA;AACjD,eAAO,MAAM,aAAa,KAAK,CAAA"}

package/dist/components/TagList/constant.js

@@ -2,11 +2,12 @@ import { __esmMin } from "../../_virtual/_rolldown/runtime.js";
 import { consoleLightTheme } from "@ultraviolet/themes";
 
 //#region src/components/TagList/constant.ts
-var TAGS_GAP;
+var TAGS_GAP, DEFAULT_POPOVER_MAX_HEIGHT;
 var init_constant = __esmMin(() => {
 	TAGS_GAP = consoleLightTheme.space["1"];
+	DEFAULT_POPOVER_MAX_HEIGHT = "16rem";
 });
 
 //#endregion
 init_constant();
-export { TAGS_GAP, init_constant };
+export { DEFAULT_POPOVER_MAX_HEIGHT, TAGS_GAP, init_constant };

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

@@ -40,6 +40,6 @@ type TagListProps = {
 /**
  * This component is used to display a list of tags with a threshold and a popover when there are too many tags.
  */
-export declare const TagList: ({ maxLength, tags, threshold, multiline, popoverTitle, popoverPlacement, popoverMaxHeight, copiable, copyText, copiedText, className, 'data-testid': dataTestId, style, }: TagListProps) => import("react/jsx-runtime").JSX.Element | null;
+export declare const TagList: ({ maxLength, tags, threshold, multiline, popoverTitle, popoverPlacement, popoverMaxHeight, copiable, copyText, copiedText, className, 'data-testid': dataTestId, style, }: TagListProps) => import("react/jsx-runtime").JSX.Element;
 export {};
 //# sourceMappingURL=index.d.ts.map

package/dist/components/TagList/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/TagList/index.tsx"],"names":[],"mappings":"AAMA,OAAO,EAAE,OAAO,EAAE,MAAM,YAAY,CAAA;AACpC,OAAO,EAAE,GAAG,EAAE,MAAM,QAAQ,CAAA;AAK5B,OAAO,KAAK,EAAE,cAAc,EAAE,aAAa,EAAE,SAAS,EAAE,MAAM,OAAO,CAAA;AAIrE,MAAM,MAAM,OAAO,GAAG,MAAM,GAAG;IAAE,KAAK,EAAE,MAAM,CAAC;IAAC,IAAI,EAAE,SAAS,CAAA;CAAE,CAAA;AAEjE,KAAK,YAAY,GAAG;IAClB;;OAEG;IACH,SAAS,CAAC,EAAE,MAAM,CAAA;IAClB,IAAI,CAAC,EAAE,OAAO,EAAE,CAAA;IAChB;;;OAGG;IACH,SAAS,CAAC,EAAE,MAAM,CAAA;IAClB;;OAEG;IACH,SAAS,CAAC,EAAE,OAAO,CAAA;IACnB;;OAEG;IACH,YAAY,EAAE,MAAM,CAAA;IACpB;;;OAGG;IACH,gBAAgB,CAAC,EAAE,cAAc,CAAC,OAAO,OAAO,CAAC,CAAC,WAAW,CAAC,CAAA;IAC9D;;OAEG;IACH,gBAAgB,CAAC,EAAE,cAAc,CAAC,OAAO,OAAO,CAAC,CAAC,WAAW,CAAC,CAAA;IAC9D,SAAS,CAAC,EAAE,MAAM,CAAA;IAClB,aAAa,CAAC,EAAE,MAAM,CAAA;IACtB,KAAK,CAAC,EAAE,aAAa,CAAA;CACtB,GAAG,IAAI,CAAC,cAAc,CAAC,OAAO,GAAG,CAAC,EAAE,UAAU,GAAG,UAAU,GAAG,YAAY,CAAC,CAAA;AAO5E;;GAEG;AACH,eAAO,MAAM,OAAO,6OAmSnB,CAAA"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/TagList/index.tsx"],"names":[],"mappings":"AAMA,OAAO,EAAE,OAAO,EAAE,MAAM,YAAY,CAAA;AACpC,OAAO,EAAE,GAAG,EAAE,MAAM,QAAQ,CAAA;AAK5B,OAAO,KAAK,EAAE,cAAc,EAAE,aAAa,EAAE,SAAS,EAAE,MAAM,OAAO,CAAA;AAErE,MAAM,MAAM,OAAO,GAAG,MAAM,GAAG;IAAE,KAAK,EAAE,MAAM,CAAC;IAAC,IAAI,EAAE,SAAS,CAAA;CAAE,CAAA;AAEjE,KAAK,YAAY,GAAG;IAClB;;OAEG;IACH,SAAS,CAAC,EAAE,MAAM,CAAA;IAClB,IAAI,CAAC,EAAE,OAAO,EAAE,CAAA;IAChB;;;OAGG;IACH,SAAS,CAAC,EAAE,MAAM,CAAA;IAClB;;OAEG;IACH,SAAS,CAAC,EAAE,OAAO,CAAA;IACnB;;OAEG;IACH,YAAY,EAAE,MAAM,CAAA;IACpB;;;OAGG;IACH,gBAAgB,CAAC,EAAE,cAAc,CAAC,OAAO,OAAO,CAAC,CAAC,WAAW,CAAC,CAAA;IAC9D;;OAEG;IACH,gBAAgB,CAAC,EAAE,cAAc,CAAC,OAAO,OAAO,CAAC,CAAC,WAAW,CAAC,CAAA;IAC9D,SAAS,CAAC,EAAE,MAAM,CAAA;IAClB,aAAa,CAAC,EAAE,MAAM,CAAA;IACtB,KAAK,CAAC,EAAE,aAAa,CAAA;CACtB,GAAG,IAAI,CAAC,cAAc,CAAC,OAAO,GAAG,CAAC,EAAE,UAAU,GAAG,UAAU,GAAG,YAAY,CAAC,CAAA;AAO5E;;GAEG;AACH,eAAO,MAAM,OAAO,sOAoTnB,CAAA"}

package/dist/components/TagList/index.js

@@ -1,9 +1,9 @@
 'use client';
 import { __esmMin, __name } from "../../_virtual/_rolldown/runtime.js";
-import { _objectSpread2, init_objectSpread2 } from "../../_virtual/_@oxc-project_runtime@0.120.0/helpers/objectSpread2.js";
+import { _objectSpread2, init_objectSpread2 } from "../../_virtual/_@oxc-project_runtime@0.122.0/helpers/objectSpread2.js";
 import { Tag, init_Tag } from "../Tag/index.js";
 import { Popover, init_Popover } from "../Popover/index.js";
-import { TAGS_GAP, init_constant } from "./constant.js";
+import { DEFAULT_POPOVER_MAX_HEIGHT, TAGS_GAP, init_constant } from "./constant.js";
 import { init_styles_css, popoverTriggerWidthVar, tagListStyle } from "./styles.css.js";
 import { useEffect, useMemo, useRef, useState } from "react";
 import { cn } from "@ultraviolet/utils";
@@ -11,17 +11,18 @@ import { assignInlineVars } from "@vanilla-extract/dynamic";
 import { jsx, jsxs } from "react/jsx-runtime";
 
 //#region src/components/TagList/index.tsx
-var DEFAULT_POPOVER_MAX_HEIGHT, DEFAULT_TAGS, getTagLabel, TagList;
+var DEFAULT_TAGS, getTagLabel, TagList;
 var init_TagList = __esmMin(() => {
 	init_Popover();
 	init_Tag();
 	init_constant();
 	init_styles_css();
 	init_objectSpread2();
-	DEFAULT_POPOVER_MAX_HEIGHT = "16rem";
 	DEFAULT_TAGS = [];
 	getTagLabel = (tag) => typeof tag === "object" ? tag.label : tag;
 	TagList = ({ maxLength = 600, tags = DEFAULT_TAGS, threshold = 1, multiline = false, popoverTitle, popoverPlacement, popoverMaxHeight = DEFAULT_POPOVER_MAX_HEIGHT, copiable, copyText, copiedText, className, "data-testid": dataTestId, style }) => {
+		var _containerRef$current3;
+		var _containerRef$current6;
 		const containerRef = useRef(null);
 		const measureRef = useRef(null);
 		const popoverTriggerRef = useRef(null);
@@ -54,19 +55,25 @@ var init_TagList = __esmMin(() => {
 				setIsReady(true);
 				return;
 			}
-			const parentWidth = (_containerRef$current = (_containerRef$current2 = containerRef.current.parentElement) === null || _containerRef$current2 === void 0 ? void 0 : _containerRef$current2.offsetWidth) !== null && _containerRef$current !== void 0 ? _containerRef$current : 0;
-			const [firstTag, ...restOfToMeasureElements] = [...measureRef.current.children[0].children];
-			const { measuredVisibleTags, measuredHiddenTags } = restOfToMeasureElements.reduce((accumulator, currentValue, index) => {
-				const newAccumulatedWidth = accumulator.accumulatedWidth + currentValue.offsetWidth + Number.parseInt(TAGS_GAP, 10);
-				return {
+			const parentWidth = ((_containerRef$current = (_containerRef$current2 = containerRef.current.parentElement) === null || _containerRef$current2 === void 0 ? void 0 : _containerRef$current2.offsetWidth) !== null && _containerRef$current !== void 0 ? _containerRef$current : 0) - 32;
+			const { measuredVisibleTags, measuredHiddenTags } = [...measureRef.current.children[0].children].reduce((accumulator, currentValue, index) => {
+				const tagWidth = currentValue.offsetWidth;
+				const gap = index > 0 ? Number.parseInt(TAGS_GAP, 10) : 0;
+				const newAccumulatedWidth = accumulator.accumulatedWidth + tagWidth + gap;
+				if (accumulator.accumulatedWidth + 32 + gap <= parentWidth) return {
 					accumulatedWidth: newAccumulatedWidth,
-					measuredHiddenTags: [...accumulator.measuredHiddenTags, newAccumulatedWidth > parentWidth && tags[index + 1]].filter(Boolean),
-					measuredVisibleTags: [...accumulator.measuredVisibleTags, newAccumulatedWidth <= parentWidth && tags[index + 1]].filter(Boolean)
+					measuredHiddenTags: accumulator.measuredHiddenTags,
+					measuredVisibleTags: [...accumulator.measuredVisibleTags, tags[index]]
+				};
+				return {
+					accumulatedWidth: accumulator.accumulatedWidth,
+					measuredHiddenTags: [...accumulator.measuredHiddenTags, tags[index]],
+					measuredVisibleTags: accumulator.measuredVisibleTags
 				};
 			}, {
-				accumulatedWidth: firstTag.offsetWidth + Number.parseInt(TAGS_GAP, 10),
+				accumulatedWidth: 0,
 				measuredHiddenTags: [],
-				measuredVisibleTags: [tags[0]]
+				measuredVisibleTags: []
 			});
 			const finalHiddenTags = [...measuredHiddenTags, ...surelyHiddenTags];
 			setVisibleTags(measuredVisibleTags);
@@ -78,19 +85,20 @@ var init_TagList = __esmMin(() => {
 			surelyHiddenTags,
 			tags,
 			threshold,
-			tmpThreshold
+			tmpThreshold,
+			(_containerRef$current3 = containerRef.current) === null || _containerRef$current3 === void 0 || (_containerRef$current3 = _containerRef$current3.parentElement) === null || _containerRef$current3 === void 0 ? void 0 : _containerRef$current3.offsetWidth
 		]);
 		useEffect(() => {
 			var _popoverTriggerRef$cu;
-			if (!isReady && ((_popoverTriggerRef$cu = popoverTriggerRef.current) === null || _popoverTriggerRef$cu === void 0 ? void 0 : _popoverTriggerRef$cu.offsetWidth)) {
-				var _containerRef$current3;
+			if ((_popoverTriggerRef$cu = popoverTriggerRef.current) === null || _popoverTriggerRef$cu === void 0 ? void 0 : _popoverTriggerRef$cu.offsetWidth) {
 				var _containerRef$current4;
+				var _containerRef$current5;
 				var _tagsContainer$parent;
 				var _tagsContainer$parent2;
 				const newPopoverTriggerWidth = popoverTriggerRef.current.offsetWidth;
 				setPopoverTriggerWidth(newPopoverTriggerWidth);
 				const tagsContainer = containerRef.current;
-				const tagsContainerWidth = (_containerRef$current3 = (_containerRef$current4 = containerRef.current) === null || _containerRef$current4 === void 0 ? void 0 : _containerRef$current4.offsetWidth) !== null && _containerRef$current3 !== void 0 ? _containerRef$current3 : 0;
+				const tagsContainerWidth = (_containerRef$current4 = (_containerRef$current5 = containerRef.current) === null || _containerRef$current5 === void 0 ? void 0 : _containerRef$current5.offsetWidth) !== null && _containerRef$current4 !== void 0 ? _containerRef$current4 : 0;
 				const parentWidth = (_tagsContainer$parent = tagsContainer === null || tagsContainer === void 0 || (_tagsContainer$parent2 = tagsContainer.parentElement) === null || _tagsContainer$parent2 === void 0 ? void 0 : _tagsContainer$parent2.offsetWidth) !== null && _tagsContainer$parent !== void 0 ? _tagsContainer$parent : 0;
 				if (visibleTags.length > 1 && hiddenTags.length > 0 && tagsContainerWidth + newPopoverTriggerWidth > parentWidth) {
 					var _visibleTags$at;
@@ -103,27 +111,24 @@ var init_TagList = __esmMin(() => {
 			}
 		}, [
 			hiddenTags,
-			isReady,
 			threshold,
 			visibleTags,
-			visibleTags.length
+			visibleTags.length,
+			(_containerRef$current6 = containerRef.current) === null || _containerRef$current6 === void 0 || (_containerRef$current6 = _containerRef$current6.parentElement) === null || _containerRef$current6 === void 0 ? void 0 : _containerRef$current6.offsetWidth
 		]);
-		useEffect(() => {
-			var _measureRef$current;
-			if (isReady && ((_measureRef$current = measureRef.current) === null || _measureRef$current === void 0 ? void 0 : _measureRef$current.parentNode)) measureRef.current.remove();
-		}, [isReady]);
-		if (tags.length === 0) return null;
-		const renderTag = (tag, index, isEllipsis = false) => typeof tag !== "string" && tag.icon ? /* @__PURE__ */ jsxs(Tag, {
+		const renderTag = (tag, index, isEllipsis = false, hidden) => typeof tag !== "string" && tag.icon ? /* @__PURE__ */ jsxs(Tag, {
 			className: cn(isEllipsis ? "ellipsed" : "", tagListStyle.ellipsisChild),
 			copiable,
 			copiedText,
 			copyText,
+			"data-testid": hidden ? "" : getTagLabel(tag),
 			children: [tag.icon, getTagLabel(tag)]
 		}, `${getTagLabel(tag)}-${index}`) : /* @__PURE__ */ jsx(Tag, {
 			className: cn(isEllipsis ? "ellipsed" : "", tagListStyle.ellipsisChild),
 			copiable,
 			copiedText,
 			copyText,
+			"data-testid": hidden ? "" : getTagLabel(tag),
 			children: getTagLabel(tag)
 		}, `${getTagLabel(tag)}-${index}`);
 		return /* @__PURE__ */ jsxs("div", {
@@ -136,14 +141,15 @@ var init_TagList = __esmMin(() => {
 					"data-testid": `${dataTestId !== null && dataTestId !== void 0 ? dataTestId : "taglist"}-container`,
 					ref: containerRef,
 					style: assignInlineVars({ [popoverTriggerWidthVar]: `${popoverTriggerWidth || 0}px` }),
-					children: visibleTags.map((tag, index) => renderTag(tag, index, index === visibleTags.length - 1))
+					children: visibleTags.map((tag, index) => renderTag(tag, index, index === visibleTags.length - 1, true))
 				}),
 				/* @__PURE__ */ jsx("div", {
 					ref: measureRef,
 					style: {
 						position: "absolute",
 						visibility: "hidden",
-						whiteSpace: "nowrap"
+						whiteSpace: "nowrap",
+						pointerEvents: "none"
 					},
 					children: /* @__PURE__ */ jsx("div", {
 						className: tagListStyle.tagContainer({ multiline }),