@ac-design/design-system 2.4.4 → 2.5.0

package/dist/lib/compat.css

@@ -1260,6 +1260,12 @@ button:is([data-ac-ds], [data-ac-ds] *), input:where([type="button"], [type="res
   .max-w-250:where([data-ac-ds], [data-ac-ds] *) {
     max-width: calc(var(--spacing) * 250) !important;
   }
+  .max-w-\[135px\]:where([data-ac-ds], [data-ac-ds] *) {
+    max-width: 135px !important;
+  }
+  .max-w-\[146px\]:where([data-ac-ds], [data-ac-ds] *) {
+    max-width: 146px !important;
+  }
   .max-w-\[280px\]:where([data-ac-ds], [data-ac-ds] *) {
     max-width: 280px !important;
   }
@@ -1356,6 +1362,9 @@ button:is([data-ac-ds], [data-ac-ds] *), input:where([type="button"], [type="res
   .grow:where([data-ac-ds], [data-ac-ds] *) {
     flex-grow: 1 !important;
   }
+  .basis-\[80px\]:where([data-ac-ds], [data-ac-ds] *) {
+    flex-basis: 80px !important;
+  }
   .basis-\[240px\]:where([data-ac-ds], [data-ac-ds] *) {
     flex-basis: 240px !important;
   }
@@ -2084,9 +2093,6 @@ button:is([data-ac-ds], [data-ac-ds] *), input:where([type="button"], [type="res
       border-color: color-mix(in oklab, var(--color-primary) 40%, transparent) !important;
     }
   }
-  .border-slate-70:where([data-ac-ds], [data-ac-ds] *) {
-    border-color: var(--color-slate-70) !important;
-  }
   .border-success\/25:where([data-ac-ds], [data-ac-ds] *) {
     border-color: color-mix(in srgb, #00a651 25%, transparent) !important;
     @supports (color: color-mix(in lab, red, red)) {
@@ -2132,9 +2138,6 @@ button:is([data-ac-ds], [data-ac-ds] *), input:where([type="button"], [type="res
       border-color: color-mix(in oklab, var(--color-warning) 45%, transparent) !important;
     }
   }
-  .border-white:where([data-ac-ds], [data-ac-ds] *) {
-    border-color: var(--color-white) !important;
-  }
   .border-white\/10:where([data-ac-ds], [data-ac-ds] *) {
     border-color: color-mix(in srgb, hsl(0 0% 100%) 10%, transparent) !important;
     @supports (color: color-mix(in lab, red, red)) {
@@ -2456,8 +2459,8 @@ button:is([data-ac-ds], [data-ac-ds] *), input:where([type="button"], [type="res
       background-color: color-mix(in oklab, var(--color-slate-20) 10%, transparent) !important;
     }
   }
-  .bg-slate-80:where([data-ac-ds], [data-ac-ds] *) {
-    background-color: var(--color-slate-80) !important;
+  .bg-slate-70:where([data-ac-ds], [data-ac-ds] *) {
+    background-color: var(--color-slate-70) !important;
   }
   .bg-success:where([data-ac-ds], [data-ac-ds] *) {
     background-color: var(--color-success) !important;
@@ -2911,6 +2914,9 @@ button:is([data-ac-ds], [data-ac-ds] *), input:where([type="button"], [type="res
   .object-cover:where([data-ac-ds], [data-ac-ds] *) {
     object-fit: cover !important;
   }
+  .object-left:where([data-ac-ds], [data-ac-ds] *) {
+    object-position: left !important;
+  }
   .p-0:where([data-ac-ds], [data-ac-ds] *) {
     padding: 0px !important;
   }
@@ -3711,12 +3717,6 @@ button:is([data-ac-ds], [data-ac-ds] *), input:where([type="button"], [type="res
       --tw-ring-color: color-mix(in oklab, var(--color-info) 40%, transparent) !important;
     }
   }
-  .ring-muted\/70:where([data-ac-ds], [data-ac-ds] *) {
-    --tw-ring-color: color-mix(in srgb, #5c5c5c 70%, transparent) !important;
-    @supports (color: color-mix(in lab, red, red)) {
-      --tw-ring-color: color-mix(in oklab, var(--color-muted) 70%, transparent) !important;
-    }
-  }
   .ring-pending\/20:where([data-ac-ds], [data-ac-ds] *) {
     --tw-ring-color: color-mix(in srgb, #8b5cf6 20%, transparent) !important;
     @supports (color: color-mix(in lab, red, red)) {
@@ -5775,6 +5775,12 @@ button:is([data-ac-ds], [data-ac-ds] *), input:where([type="button"], [type="res
     width: calc(var(--spacing) * 4) !important;
     height: calc(var(--spacing) * 4) !important;
   }
+  .\[\&\>svg\]\:h-auto > svg:where([data-ac-ds], [data-ac-ds] *) {
+    height: auto !important;
+  }
+  .\[\&\>svg\]\:w-full > svg:where([data-ac-ds], [data-ac-ds] *) {
+    width: 100% !important;
+  }
   .\[\&\>svg\]\:shrink-0 > svg:where([data-ac-ds], [data-ac-ds] *) {
     flex-shrink: 0 !important;
   }

package/dist/lib/components/AcNavbar.vue_vue_type_script_setup_true_lang.js

@@ -1,12 +1,10 @@
-import { createCommentVNode as e, createElementBlock as t, createVNode as n, defineComponent as r, normalizeClass as i, openBlock as a, renderSlot as o, toDisplayString as s, unref as c } from "vue";
-import { Menu as l } from "@lucide/vue";
+import e from "./AcProductTag.js";
+import { createBlock as t, createCommentVNode as n, createElementBlock as r, createVNode as i, defineComponent as a, normalizeClass as o, openBlock as s, renderSlot as c, unref as l } from "vue";
+import { Menu as u } from "@lucide/vue";
 //#region src/lib/components/AcNavbar.vue?vue&type=script&setup=true&lang.ts
-var u = ["aria-label"], d = {
+var d = ["aria-label"], f = {
 	key: 1,
 	class: "flex shrink-0 items-center gap-2"
-}, f = {
-	key: 0,
-	class: "inline-flex items-center rounded-6 border border-primary/25 bg-primary/10 px-1.5 py-0.5 text-sm font-semibold tracking-wide text-primary-strong uppercase"
 }, p = ["aria-label"], m = {
 	key: 3,
 	class: "hidden min-w-0 shrink sm:block sm:w-48 md:w-60 lg:w-80 xl:w-96"
@@ -22,7 +20,7 @@ var u = ["aria-label"], d = {
 }, v = {
 	key: 6,
 	class: "flex shrink-0 items-center gap-0.5 sm:gap-3"
-}, y = /*@__PURE__*/ r({
+}, y = /*@__PURE__*/ a({
 	__name: "AcNavbar",
 	props: {
 		menuButton: { default: "mobile" },
@@ -36,37 +34,40 @@ var u = ["aria-label"], d = {
 		searchPosition: { default: "start" }
 	},
 	emits: ["menu"],
-	setup(r, { emit: y }) {
+	setup(a, { emit: y }) {
 		let b = y;
-		return (y, x) => (a(), t("header", {
-			class: i(["top-0 z-30 flex h-18 shrink-0 items-center gap-2 border-b border-border/80 bg-surface/90 px-4 backdrop-blur-sm sm:gap-4 sm:px-6", r.sticky && "sticky"]),
+		return (y, x) => (s(), r("header", {
+			class: o(["top-0 z-30 flex h-18 shrink-0 items-center gap-2 border-b border-border/80 bg-surface/90 px-4 backdrop-blur-sm sm:gap-4 sm:px-6", a.sticky && "sticky"]),
 			"data-ac-ds": "",
 			"data-testid": "ac-navbar"
 		}, [
-			r.menuButton === "never" ? e("", !0) : (a(), t("button", {
+			a.menuButton === "never" ? n("", !0) : (s(), r("button", {
 				key: 0,
 				type: "button",
-				class: i(["inline-flex size-9.5 shrink-0 cursor-pointer items-center justify-center rounded-10 border border-transparent text-muted transition-colors duration-200 hover:border-border hover:bg-surface-sunken/50 hover:text-heading focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 focus-visible:ring-offset-surface focus-visible:outline-none", {
-					"md:hidden": r.menuButton === "mobile",
-					"lg:hidden": r.menuButton === "tablet"
+				class: o(["inline-flex size-9.5 shrink-0 cursor-pointer items-center justify-center rounded-10 border border-transparent text-muted transition-colors duration-200 hover:border-border hover:bg-surface-sunken/50 hover:text-heading focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 focus-visible:ring-offset-surface focus-visible:outline-none", {
+					"md:hidden": a.menuButton === "mobile",
+					"lg:hidden": a.menuButton === "tablet"
 				}]),
-				"aria-label": r.menuLabel,
+				"aria-label": a.menuLabel,
 				"data-ac-ds": "",
 				"data-testid": "ac-navbar-menu",
 				onClick: x[0] ||= (e) => b("menu")
-			}, [n(c(l), {
+			}, [i(l(u), {
 				class: "size-5",
 				"aria-hidden": "true"
-			})], 10, u)),
-			y.$slots.brand || r.productName ? (a(), t("div", d, [o(y.$slots, "brand"), r.productName ? (a(), t("span", f, s(r.productName), 1)) : e("", !0)])) : e("", !0),
-			y.$slots.default ? (a(), t("nav", {
+			})], 10, d)),
+			y.$slots.brand || a.productName ? (s(), r("div", f, [c(y.$slots, "brand"), a.productName ? (s(), t(e, {
+				key: 0,
+				label: a.productName
+			}, null, 8, ["label"])) : n("", !0)])) : n("", !0),
+			y.$slots.default ? (s(), r("nav", {
 				key: 2,
-				"aria-label": r.label,
+				"aria-label": a.label,
 				class: "hidden items-center gap-1 md:flex"
-			}, [o(y.$slots, "default")], 8, p)) : e("", !0),
-			y.$slots.search && r.searchPosition === "start" ? (a(), t("div", m, [o(y.$slots, "search")])) : e("", !0),
-			y.$slots.start ? (a(), t("div", h, [o(y.$slots, "start")])) : (a(), t("div", g, [y.$slots.search && r.searchPosition === "center" ? (a(), t("div", _, [o(y.$slots, "search")])) : e("", !0)])),
-			y.$slots.actions ? (a(), t("div", v, [o(y.$slots, "actions")])) : e("", !0)
+			}, [c(y.$slots, "default")], 8, p)) : n("", !0),
+			y.$slots.search && a.searchPosition === "start" ? (s(), r("div", m, [c(y.$slots, "search")])) : n("", !0),
+			y.$slots.start ? (s(), r("div", h, [c(y.$slots, "start")])) : (s(), r("div", g, [y.$slots.search && a.searchPosition === "center" ? (s(), r("div", _, [c(y.$slots, "search")])) : n("", !0)])),
+			y.$slots.actions ? (s(), r("div", v, [c(y.$slots, "actions")])) : n("", !0)
 		], 2));
 	}
 });

package/dist/lib/components/AcProductTag.js

@@ -0,0 +1,5 @@
+import e from "./AcProductTag.vue_vue_type_script_setup_true_lang.js";
+//#region src/lib/components/AcProductTag.vue
+var t = e;
+//#endregion
+export { t as default };

package/dist/lib/components/AcProductTag.vue.d.ts

@@ -0,0 +1,7 @@
+export interface Props {
+    /** The product's short name, shown in capitals, e.g. `"Console"`, `"DB"` or `"Billing"`. */
+    label: string;
+}
+declare const __VLS_export: import("vue").DefineComponent<Props, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<Props> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
+declare const _default: typeof __VLS_export;
+export default _default;

package/dist/lib/components/AcProductTag.vue_vue_type_script_setup_true_lang.js

@@ -0,0 +1,15 @@
+import { createElementBlock as e, defineComponent as t, openBlock as n, toDisplayString as r } from "vue";
+//#region src/lib/components/AcProductTag.vue?vue&type=script&setup=true&lang.ts
+var i = {
+	class: "inline-flex h-5 shrink-0 items-center rounded-6 border border-primary/25 bg-primary/10 px-1.5 text-sm leading-none font-semibold tracking-wide whitespace-nowrap text-primary-strong uppercase",
+	"data-ac-ds": "",
+	"data-testid": "ac-product-tag"
+}, a = /*@__PURE__*/ t({
+	__name: "AcProductTag",
+	props: { label: {} },
+	setup(t) {
+		return (a, o) => (n(), e("span", i, r(t.label), 1));
+	}
+});
+//#endregion
+export { a as default };

package/dist/lib/components/AcSidebarBrand.js

@@ -0,0 +1,5 @@
+import e from "./AcSidebarBrand.vue_vue_type_script_setup_true_lang.js";
+//#region src/lib/components/AcSidebarBrand.vue
+var t = e;
+//#endregion
+export { t as default };

package/dist/lib/components/AcSidebarBrand.vue.d.ts

@@ -0,0 +1,27 @@
+export interface Props {
+    /** Short product tag after the logo, e.g. `"Console"`, `"DB"` or `"Billing"`. Empty hides it; the collapsed rail never shows it. */
+    productName?: string;
+    /** Image URL of a custom (white-label) logo. Empty draws the AppsCode logo. */
+    logo?: string;
+    /** Image URL of a square mark for the collapsed rail. Empty draws the AppsCode mark. */
+    mark?: string;
+    /** Shows only the mark, for the 56px rail. Pass the sidebar header slot's `collapsed`. */
+    collapsed?: boolean;
+    /** Route for `RouterLink` (needs vue-router in the app). */
+    to?: string | Record<string, unknown>;
+    /** Plain link, when there's no router. */
+    href?: string;
+    /** Accessible name of the link. */
+    label?: string;
+}
+declare const __VLS_export: import("vue").DefineComponent<Props, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<Props> & Readonly<{}>, {
+    label: string;
+    mark: string;
+    href: string;
+    to: string | Record<string, unknown>;
+    logo: string;
+    collapsed: boolean;
+    productName: string;
+}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
+declare const _default: typeof __VLS_export;
+export default _default;

package/dist/lib/components/AcSidebarBrand.vue_vue_type_script_setup_true_lang.js

@@ -0,0 +1,76 @@
+import e from "./AcLogo.js";
+import t from "./AcProductTag.js";
+import { Fragment as n, computed as r, createBlock as i, createCommentVNode as a, createElementBlock as o, createVNode as s, defineComponent as c, getCurrentInstance as l, mergeProps as u, openBlock as d, resolveDynamicComponent as f, withCtx as p } from "vue";
+//#region src/lib/components/AcSidebarBrand.vue?vue&type=script&setup=true&lang.ts
+var m = {
+	class: "min-w-0 flex-1",
+	"data-ac-ds": "",
+	"data-testid": "ac-sidebar-brand"
+}, h = ["src"], g = ["src"], _ = {
+	key: 1,
+	class: "flex max-w-[135px] min-w-0 grow basis-[80px] [&>svg]:h-auto [&>svg]:w-full"
+}, v = /*@__PURE__*/ c({
+	__name: "AcSidebarBrand",
+	props: {
+		productName: { default: "" },
+		logo: { default: "" },
+		mark: { default: "" },
+		collapsed: {
+			type: Boolean,
+			default: !1
+		},
+		to: { default: void 0 },
+		href: { default: void 0 },
+		label: { default: "Home" }
+	},
+	setup(c) {
+		let v = c, y = l()?.appContext.components.RouterLink, b = r(() => {
+			if (v.to !== void 0 && y) return {
+				is: y,
+				attrs: {
+					to: v.to,
+					"aria-label": v.label
+				}
+			};
+			let e = v.href ?? (typeof v.to == "string" ? v.to : void 0);
+			return e ? {
+				is: "a",
+				attrs: {
+					href: e,
+					"aria-label": v.label
+				}
+			} : {
+				is: "div",
+				attrs: {}
+			};
+		}), x = r(() => b.value.is === "div" ? "AppsCode" : "");
+		return (r, l) => (d(), o("div", m, [(d(), i(f(b.value.is), u(b.value.attrs, { class: "flex w-fit max-w-full min-w-0 flex-wrap items-center gap-x-2 gap-y-1.5 rounded-8 no-underline focus-visible:ring-2 focus-visible:ring-ring focus-visible:outline-none" }), {
+			default: p(() => [c.collapsed ? (d(), o(n, { key: 0 }, [c.mark ? (d(), o("img", {
+				key: 0,
+				src: c.mark,
+				alt: "",
+				class: "size-7 rounded-6 object-contain"
+			}, null, 8, h)) : (d(), i(e, {
+				key: 1,
+				variant: "mark",
+				size: 28,
+				label: x.value
+			}, null, 8, ["label"]))], 64)) : (d(), o(n, { key: 1 }, [c.logo ? (d(), o("img", {
+				key: 0,
+				src: c.logo,
+				alt: "",
+				class: "block h-8 max-w-[146px] min-w-0 object-contain object-left",
+				"data-testid": "ac-sidebar-brand-logo"
+			}, null, 8, g)) : (d(), o("span", _, [s(e, {
+				size: 28,
+				label: x.value
+			}, null, 8, ["label"])])), c.productName ? (d(), i(t, {
+				key: 2,
+				label: c.productName
+			}, null, 8, ["label"])) : a("", !0)], 64))]),
+			_: 1
+		}, 16))]));
+	}
+});
+//#endregion
+export { v as default };

package/dist/lib/components/AcSwitch.vue_vue_type_script_setup_true_lang.js

@@ -68,9 +68,9 @@ var h = { class: "flex items-center gap-2" }, g = ["for"], _ = [
 				"aria-busy": i.loading || void 0,
 				"aria-disabled": i.loading && !i.disabled || void 0,
 				disabled: i.disabled,
-				class: ["relative h-6 w-11 shrink-0 rounded-full transition-colors duration-200 focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 focus-visible:ring-offset-surface focus-visible:outline-none motion-reduce:transition-none", [b.value ? "bg-primary" : "bg-slate-80 ring-1 ring-muted/70 ring-inset", i.disabled ? "cursor-not-allowed opacity-50" : i.loading ? "cursor-wait animate-pulse motion-reduce:animate-none" : "cursor-pointer"]],
+				class: ["relative h-6 w-11 shrink-0 rounded-full transition-colors duration-200 focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 focus-visible:ring-offset-surface focus-visible:outline-none motion-reduce:transition-none", [b.value ? "bg-primary" : "bg-slate-70", i.disabled ? "cursor-not-allowed opacity-50" : i.loading ? "cursor-wait animate-pulse motion-reduce:animate-none" : "cursor-pointer"]],
 				onClick: D
-			}), [r("span", { class: s(["pointer-events-none absolute top-0.5 left-0.5 size-5 rounded-full border bg-white transition-transform duration-200 ease-out motion-reduce:transition-none", b.value ? "translate-x-5 border-white" : "translate-x-0 border-slate-70"]) }, null, 2)], 16, _),
+			}), [r("span", { class: s(["pointer-events-none absolute top-0.5 left-0.5 size-5 rounded-full bg-white shadow-sm transition-transform duration-200 ease-out motion-reduce:transition-none", b.value ? "translate-x-5" : "translate-x-0"]) }, null, 2)], 16, _),
 			u(e.$slots, "right")
 		]), i.errorMsg ? (c(), n("p", v, d(i.errorMsg), 1)) : t("", !0)], 16));
 	}

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

@@ -61,6 +61,7 @@ export { default as AcPagination } from "./AcPagination.vue";
 export { default as AcPreloader } from "./AcPreloader.vue";
 export { default as AcProgress } from "./AcProgress.vue";
 export { default as AcProductHero } from "./AcProductHero.vue";
+export { default as AcProductTag } from "./AcProductTag.vue";
 export { default as AcRadioCard } from "./AcRadioCard.vue";
 export { default as AcResourceCard } from "./AcResourceCard.vue";
 export { default as AcSearchBar } from "./AcSearchBar.vue";
@@ -69,6 +70,7 @@ export { default as AcSegmentedControl } from "./AcSegmentedControl.vue";
 export { default as AcSettingsRow } from "./AcSettingsRow.vue";
 export { default as AcSelect } from "./AcSelect.vue";
 export { default as AcSidebar } from "./AcSidebar.vue";
+export { default as AcSidebarBrand } from "./AcSidebarBrand.vue";
 export { default as AcSidebarItem } from "./AcSidebarItem.vue";
 export { default as AcSidebarSection } from "./AcSidebarSection.vue";
 export { default as AcSidePanel } from "./AcSidePanel.vue";

package/dist/lib/index.js

@@ -59,46 +59,48 @@ import $ from "./components/AcSelect.js";
 import se from "./components/AcKeyValueInput.js";
 import ce from "./components/AcLoader.js";
 import le from "./components/AcLocaleSwitcher.js";
-import ue from "./components/AcNavbar.js";
-import de from "./components/AcNotificationMenu.js";
-import fe from "./components/AcNumberInput.js";
-import pe from "./components/AcPage.js";
-import me from "./components/AcPagination.js";
-import he from "./components/AcPreloader.js";
-import ge from "./components/AcProgress.js";
-import _e from "./components/AcProductHero.js";
-import ve from "./components/AcRadioCard.js";
-import ye from "./components/AcTag.js";
-import be from "./components/AcResourceCard.js";
-import xe from "./components/AcSectionContent.js";
-import Se from "./components/AcSegmentedControl.js";
-import Ce from "./components/AcSettingsRow.js";
-import we from "./components/AcSidebar.js";
-import Te from "./components/AcSidebarItem.js";
-import Ee from "./components/AcSidebarSection.js";
-import De from "./components/AcSidePanel.js";
-import Oe from "./components/AcSideTabs.js";
-import ke from "./components/AcSlider.js";
-import Ae from "./components/AcStatCard.js";
-import je from "./components/AcStatusBar.js";
-import Me from "./components/AcSteps.js";
-import Ne from "./components/AcSwitch.js";
-import Pe from "./components/AcSwitchCard.js";
-import Fe from "./components/AcTable.js";
-import Ie from "./components/AcTabs.js";
-import Le from "./components/AcTagInput.js";
-import Re from "./components/AcTaintInput.js";
-import ze from "./components/AcTextarea.js";
-import { useColorMode as Be } from "./composables/useColorMode.js";
-import Ve from "./components/AcThemeMode.js";
-import He from "./components/AcTimePicker.js";
-import { showToast as Ue, useToast as We } from "./composables/useToast.js";
-import Ge from "./components/AcToaster.js";
-import Ke from "./components/AcUsageCard.js";
-import qe from "./components/AcUserMenu.js";
-import { useTablePagination as Je } from "./composables/useTablePagination.js";
-import { useApiPagination as Ye } from "./composables/useApiPagination.js";
-import { useBulkSelection as Xe } from "./composables/useBulkSelection.js";
-import { useFormValidation as Ze } from "./composables/useFormValidation.js";
-import { HSLToHex as Qe, HexToHSL as $e, MIN_CONTRAST as et, contrastOnWhite as tt, getThemeHSL as nt, hexToHsl as rt, hslToHex as it, readableLightness as at, setThemeHSL as ot, useBrandColor as st } from "./composables/useBrandColor.js";
-export { ee as AcAccordion, te as AcAccordionItem, r as AcAlert, o as AcAppSwitcher, s as AcAvatar, d as AcBadge, f as AcBanner, p as AcBreadcrumb, m as AcBulkActionBar, n as AcButton, h as AcButtons, g as AcCard, y as AcCellValue, b as AcCheckBox, x as AcCheckList, S as AcCheckRadio, C as AcCircularProgress, w as AcClusterSwitcher, T as AcColorInput, E as AcCommandBlock, D as AcConfirmModal, O as AcContentHeader, k as AcContentLayout, j as AcContentTable, M as AcCopyButton, N as AcCostSummary, P as AcDatePicker, I as AcDeleteConfirmationModal, I as AcDeleteModal, L as AcDivider, R as AcDropdown, z as AcDropdownDivider, B as AcDropdownItem, V as AcEmptyState, H as AcErrorState, U as AcFeatureCard, W as AcFileUpload, q as AcFontScale, J as AcFooter, Y as AcForm, X as AcFormArray, Z as AcFormFooter, Q as AcFormSection, ne as AcHeader, re as AcHeaderItem, ie as AcHeaderItems, ae as AcInfoTable, F as AcInput, oe as AcKbd, se as AcKeyValueInput, ce as AcLoader, le as AcLocaleSwitcher, i as AcLogo, _ as AcModal, ue as AcNavbar, a as AcNavbarItem, de as AcNotificationMenu, fe as AcNumberInput, pe as AcPage, me as AcPagination, he as AcPreloader, _e as AcProductHero, ge as AcProgress, ve as AcRadioCard, be as AcResourceCard, A as AcSearchBar, xe as AcSectionContent, Se as AcSegmentedControl, $ as AcSelect, Ce as AcSettingsRow, De as AcSidePanel, Oe as AcSideTabs, we as AcSidebar, Te as AcSidebarItem, Ee as AcSidebarSection, v as AcSkeleton, ke as AcSlider, e as AcSpinner, Ae as AcStatCard, je as AcStatusBar, Me as AcSteps, Ne as AcSwitch, Pe as AcSwitchCard, Fe as AcTable, Ie as AcTabs, ye as AcTag, Le as AcTagInput, Re as AcTaintInput, ze as AcTextarea, Ve as AcThemeMode, He as AcTimePicker, Ge as AcToaster, t as AcTooltip, Ke as AcUsageCard, qe as AcUserMenu, G as FONT_SCALES, Qe as HSLToHex, $e as HexToHSL, et as MIN_CONTRAST, tt as contrastOnWhite, nt as getThemeHSL, rt as hexToHsl, it as hslToHex, c as humanizeState, l as normalizeState, at as readableLightness, ot as setThemeHSL, Ue as showToast, u as statusMeta, Ye as useApiPagination, st as useBrandColor, Xe as useBulkSelection, Be as useColorMode, K as useFontScale, Ze as useFormValidation, Je as useTablePagination, We as useToast };
+import ue from "./components/AcProductTag.js";
+import de from "./components/AcNavbar.js";
+import fe from "./components/AcNotificationMenu.js";
+import pe from "./components/AcNumberInput.js";
+import me from "./components/AcPage.js";
+import he from "./components/AcPagination.js";
+import ge from "./components/AcPreloader.js";
+import _e from "./components/AcProgress.js";
+import ve from "./components/AcProductHero.js";
+import ye from "./components/AcRadioCard.js";
+import be from "./components/AcTag.js";
+import xe from "./components/AcResourceCard.js";
+import Se from "./components/AcSectionContent.js";
+import Ce from "./components/AcSegmentedControl.js";
+import we from "./components/AcSettingsRow.js";
+import Te from "./components/AcSidebar.js";
+import Ee from "./components/AcSidebarBrand.js";
+import De from "./components/AcSidebarItem.js";
+import Oe from "./components/AcSidebarSection.js";
+import ke from "./components/AcSidePanel.js";
+import Ae from "./components/AcSideTabs.js";
+import je from "./components/AcSlider.js";
+import Me from "./components/AcStatCard.js";
+import Ne from "./components/AcStatusBar.js";
+import Pe from "./components/AcSteps.js";
+import Fe from "./components/AcSwitch.js";
+import Ie from "./components/AcSwitchCard.js";
+import Le from "./components/AcTable.js";
+import Re from "./components/AcTabs.js";
+import ze from "./components/AcTagInput.js";
+import Be from "./components/AcTaintInput.js";
+import Ve from "./components/AcTextarea.js";
+import { useColorMode as He } from "./composables/useColorMode.js";
+import Ue from "./components/AcThemeMode.js";
+import We from "./components/AcTimePicker.js";
+import { showToast as Ge, useToast as Ke } from "./composables/useToast.js";
+import qe from "./components/AcToaster.js";
+import Je from "./components/AcUsageCard.js";
+import Ye from "./components/AcUserMenu.js";
+import { useTablePagination as Xe } from "./composables/useTablePagination.js";
+import { useApiPagination as Ze } from "./composables/useApiPagination.js";
+import { useBulkSelection as Qe } from "./composables/useBulkSelection.js";
+import { useFormValidation as $e } from "./composables/useFormValidation.js";
+import { HSLToHex as et, HexToHSL as tt, MIN_CONTRAST as nt, contrastOnWhite as rt, getThemeHSL as it, hexToHsl as at, hslToHex as ot, readableLightness as st, setThemeHSL as ct, useBrandColor as lt } from "./composables/useBrandColor.js";
+export { ee as AcAccordion, te as AcAccordionItem, r as AcAlert, o as AcAppSwitcher, s as AcAvatar, d as AcBadge, f as AcBanner, p as AcBreadcrumb, m as AcBulkActionBar, n as AcButton, h as AcButtons, g as AcCard, y as AcCellValue, b as AcCheckBox, x as AcCheckList, S as AcCheckRadio, C as AcCircularProgress, w as AcClusterSwitcher, T as AcColorInput, E as AcCommandBlock, D as AcConfirmModal, O as AcContentHeader, k as AcContentLayout, j as AcContentTable, M as AcCopyButton, N as AcCostSummary, P as AcDatePicker, I as AcDeleteConfirmationModal, I as AcDeleteModal, L as AcDivider, R as AcDropdown, z as AcDropdownDivider, B as AcDropdownItem, V as AcEmptyState, H as AcErrorState, U as AcFeatureCard, W as AcFileUpload, q as AcFontScale, J as AcFooter, Y as AcForm, X as AcFormArray, Z as AcFormFooter, Q as AcFormSection, ne as AcHeader, re as AcHeaderItem, ie as AcHeaderItems, ae as AcInfoTable, F as AcInput, oe as AcKbd, se as AcKeyValueInput, ce as AcLoader, le as AcLocaleSwitcher, i as AcLogo, _ as AcModal, de as AcNavbar, a as AcNavbarItem, fe as AcNotificationMenu, pe as AcNumberInput, me as AcPage, he as AcPagination, ge as AcPreloader, ve as AcProductHero, ue as AcProductTag, _e as AcProgress, ye as AcRadioCard, xe as AcResourceCard, A as AcSearchBar, Se as AcSectionContent, Ce as AcSegmentedControl, $ as AcSelect, we as AcSettingsRow, ke as AcSidePanel, Ae as AcSideTabs, Te as AcSidebar, Ee as AcSidebarBrand, De as AcSidebarItem, Oe as AcSidebarSection, v as AcSkeleton, je as AcSlider, e as AcSpinner, Me as AcStatCard, Ne as AcStatusBar, Pe as AcSteps, Fe as AcSwitch, Ie as AcSwitchCard, Le as AcTable, Re as AcTabs, be as AcTag, ze as AcTagInput, Be as AcTaintInput, Ve as AcTextarea, Ue as AcThemeMode, We as AcTimePicker, qe as AcToaster, t as AcTooltip, Je as AcUsageCard, Ye as AcUserMenu, G as FONT_SCALES, et as HSLToHex, tt as HexToHSL, nt as MIN_CONTRAST, rt as contrastOnWhite, it as getThemeHSL, at as hexToHsl, ot as hslToHex, c as humanizeState, l as normalizeState, st as readableLightness, ct as setThemeHSL, Ge as showToast, u as statusMeta, Ze as useApiPagination, lt as useBrandColor, Qe as useBulkSelection, He as useColorMode, K as useFontScale, $e as useFormValidation, Xe as useTablePagination, Ke as useToast };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@ac-design/design-system",
-  "version": "2.4.4",
+  "version": "2.5.0",
   "description": "AppsCode design system: Tailwind CSS v4 theme and Vue 3 components.",
   "repository": {
     "type": "git",