@viax.io/uxm 4.36.0

package/dist/ui/tabs-underline/tabs-underline.cjs

@@ -0,0 +1,80 @@
+"use strict";
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+var tabs_underline_exports = {};
+__export(tabs_underline_exports, {
+  TabsUnderline: () => TabsUnderline
+});
+module.exports = __toCommonJS(tabs_underline_exports);
+var import_jsx_runtime = require("react/jsx-runtime");
+var import_react = require("react");
+var import_helpers = require("../../helpers/index.cjs");
+var import_use_roving_tab_index = require("../../hooks/use-roving-tab-index.cjs");
+function TabsUnderline({
+  options,
+  value,
+  defaultValue,
+  onChange,
+  className,
+  ...rest
+}) {
+  const isControlled = value !== void 0;
+  const [internal, setInternal] = (0, import_react.useState)(defaultValue ?? options[0]?.value ?? "");
+  const active = isControlled ? value : internal;
+  const select = (next) => {
+    if (!isControlled) setInternal(next);
+    onChange?.(next);
+  };
+  const activeIndex = Math.max(0, options.findIndex((opt) => opt.value === active));
+  const { getItemRef, onItemKeyDown } = (0, import_use_roving_tab_index.useRovingTabIndex)({
+    count: options.length,
+    activeIndex,
+    isDisabled: (i) => !!options[i]?.disabled,
+    onNavigate: (i) => select(options[i].value)
+  });
+  return /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { role: "tablist", className: (0, import_helpers.cn)("uxm-tabs-underline", className), ...rest, children: options.map((opt, i) => {
+    const isActive = opt.value === active;
+    return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(
+      "button",
+      {
+        ref: getItemRef(i),
+        type: "button",
+        role: "tab",
+        "aria-selected": isActive,
+        tabIndex: i === activeIndex ? 0 : -1,
+        disabled: opt.disabled,
+        className: (0, import_helpers.cn)(
+          "uxm-tabs-underline__tab",
+          isActive && "uxm-tabs-underline__tab--active"
+        ),
+        onClick: () => select(opt.value),
+        onKeyDown: (e) => onItemKeyDown(e, i),
+        children: [
+          opt.icon && /* @__PURE__ */ (0, import_jsx_runtime.jsx)("span", { className: "uxm-tabs-underline__icon", children: opt.icon }),
+          /* @__PURE__ */ (0, import_jsx_runtime.jsx)("span", { className: "uxm-tabs-underline__label", children: opt.label })
+        ]
+      },
+      opt.value
+    );
+  }) });
+}
+// Annotate the CommonJS export names for ESM import in node:
+0 && (module.exports = {
+  TabsUnderline
+});
+//# sourceMappingURL=tabs-underline.cjs.map

package/dist/ui/tabs-underline/tabs-underline.cjs.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../src/ui/tabs-underline/tabs-underline.tsx"],"sourcesContent":["import { useState } from 'react';\n\nimport { cn } from '@/helpers';\n\nimport { useRovingTabIndex } from '../../hooks/use-roving-tab-index';\n\nimport type { HTMLAttributes, ReactNode } from 'react';\n\nexport interface TabsUnderlineOption {\n  value: string;\n  label: ReactNode;\n  icon?: ReactNode;\n  /** Disabled tabs are inert and paint the disabled styling (opacity +\n   *  disabled text color). Selecting one is a no-op. */\n  disabled?: boolean;\n}\n\nexport interface TabsUnderlineProps extends Omit<HTMLAttributes<HTMLDivElement>, 'onChange'> {\n  options: TabsUnderlineOption[];\n  value?: string;\n  defaultValue?: string;\n  onChange?: (value: string) => void;\n}\n\nexport function TabsUnderline({\n  options,\n  value,\n  defaultValue,\n  onChange,\n  className,\n  ...rest\n}: TabsUnderlineProps) {\n  const isControlled = value !== undefined;\n  const [internal, setInternal] = useState<string>(defaultValue ?? options[0]?.value ?? '');\n  const active = isControlled ? value : internal;\n\n  const select = (next: string) => {\n    if (!isControlled) setInternal(next);\n    onChange?.(next);\n  };\n\n  // Roving tabindex: only the active tab is a Tab stop; ArrowLeft/Right +\n  // Home/End move (and select) within the group, matching the ARIA tabs\n  // pattern's \"automatic activation\" model — the same thing a click does.\n  const activeIndex = Math.max(0, options.findIndex((opt) => opt.value === active));\n  const { getItemRef, onItemKeyDown } = useRovingTabIndex({\n    count: options.length,\n    activeIndex,\n    isDisabled: (i) => !!options[i]?.disabled,\n    onNavigate: (i) => select(options[i].value),\n  });\n\n  return (\n    <div role=\"tablist\" className={cn('uxm-tabs-underline', className)} {...rest}>\n      {options.map((opt, i) => {\n        const isActive = opt.value === active;\n        return (\n          <button\n            key={opt.value}\n            ref={getItemRef(i)}\n            type=\"button\"\n            role=\"tab\"\n            aria-selected={isActive}\n            tabIndex={i === activeIndex ? 0 : -1}\n            disabled={opt.disabled}\n            className={cn(\n              'uxm-tabs-underline__tab',\n              isActive && 'uxm-tabs-underline__tab--active',\n            )}\n            onClick={() => select(opt.value)}\n            onKeyDown={(e) => onItemKeyDown(e, i)}\n          >\n            {opt.icon && <span className=\"uxm-tabs-underline__icon\">{opt.icon}</span>}\n            <span className=\"uxm-tabs-underline__label\">{opt.label}</span>\n          </button>\n        );\n      })}\n    </div>\n  );\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAyDU;AAzDV,mBAAyB;AAEzB,qBAAmB;AAEnB,kCAAkC;AAoB3B,SAAS,cAAc;AAAA,EAC5B;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA,GAAG;AACL,GAAuB;AACrB,QAAM,eAAe,UAAU;AAC/B,QAAM,CAAC,UAAU,WAAW,QAAI,uBAAiB,gBAAgB,QAAQ,CAAC,GAAG,SAAS,EAAE;AACxF,QAAM,SAAS,eAAe,QAAQ;AAEtC,QAAM,SAAS,CAAC,SAAiB;AAC/B,QAAI,CAAC,aAAc,aAAY,IAAI;AACnC,eAAW,IAAI;AAAA,EACjB;AAKA,QAAM,cAAc,KAAK,IAAI,GAAG,QAAQ,UAAU,CAAC,QAAQ,IAAI,UAAU,MAAM,CAAC;AAChF,QAAM,EAAE,YAAY,cAAc,QAAI,+CAAkB;AAAA,IACtD,OAAO,QAAQ;AAAA,IACf;AAAA,IACA,YAAY,CAAC,MAAM,CAAC,CAAC,QAAQ,CAAC,GAAG;AAAA,IACjC,YAAY,CAAC,MAAM,OAAO,QAAQ,CAAC,EAAE,KAAK;AAAA,EAC5C,CAAC;AAED,SACE,4CAAC,SAAI,MAAK,WAAU,eAAW,mBAAG,sBAAsB,SAAS,GAAI,GAAG,MACrE,kBAAQ,IAAI,CAAC,KAAK,MAAM;AACvB,UAAM,WAAW,IAAI,UAAU;AAC/B,WACE;AAAA,MAAC;AAAA;AAAA,QAEC,KAAK,WAAW,CAAC;AAAA,QACjB,MAAK;AAAA,QACL,MAAK;AAAA,QACL,iBAAe;AAAA,QACf,UAAU,MAAM,cAAc,IAAI;AAAA,QAClC,UAAU,IAAI;AAAA,QACd,eAAW;AAAA,UACT;AAAA,UACA,YAAY;AAAA,QACd;AAAA,QACA,SAAS,MAAM,OAAO,IAAI,KAAK;AAAA,QAC/B,WAAW,CAAC,MAAM,cAAc,GAAG,CAAC;AAAA,QAEnC;AAAA,cAAI,QAAQ,4CAAC,UAAK,WAAU,4BAA4B,cAAI,MAAK;AAAA,UAClE,4CAAC,UAAK,WAAU,6BAA6B,cAAI,OAAM;AAAA;AAAA;AAAA,MAflD,IAAI;AAAA,IAgBX;AAAA,EAEJ,CAAC,GACH;AAEJ;","names":[]}

package/dist/ui/tabs-underline/tabs-underline.css

@@ -0,0 +1,59 @@
+@charset "UTF-8";
+/* ── tabs-underline ── */
+/* Tabs Underline (page-nav style — text labels with an animated bar under the active tab) */
+.uxm-tabs-underline {
+  border-bottom: var(--uxm-tabs-underline-track-border-width, 1px) solid var(--uxm-tabs-underline-track-border-color, var(--color-border));
+  display: inline-flex;
+  gap: var(--uxm-tabs-underline-gap, 4px);
+  position: relative;
+}
+.uxm-tabs-underline__tab {
+  align-items: center;
+  background-color: transparent;
+  border: none;
+  color: var(--uxm-tabs-underline-inactive-text, var(--color-text-muted));
+  cursor: pointer;
+  display: inline-flex;
+  font-size: calc(var(--uxm-tabs-underline-font-size, 13px) * var(--type-scale, 1));
+  font-weight: var(--uxm-tabs-underline-font-weight, 500);
+  gap: var(--uxm-tabs-underline-icon-gap, 6px);
+  justify-content: center;
+  padding: var(--uxm-tabs-underline-padding-y, 8px) var(--uxm-tabs-underline-padding-x, 12px);
+  position: relative;
+  transition: color 0.15s;
+}
+.uxm-tabs-underline__tab:hover {
+  color: var(--uxm-tabs-underline-hover-text, var(--color-text));
+}
+.uxm-tabs-underline__tab:focus-visible {
+  color: var(--uxm-tabs-underline-focus-text, var(--color-text));
+  outline: 2px solid var(--uxm-tabs-underline-focus-ring, var(--color-accent));
+  outline-offset: 2px;
+}
+.uxm-tabs-underline__tab:disabled {
+  color: var(--uxm-tabs-underline-disabled-text, var(--color-text-muted));
+  opacity: var(--uxm-tabs-underline-disabled-opacity, 0.5);
+}
+.uxm-tabs-underline__tab--active {
+  color: var(--uxm-tabs-underline-active-text, var(--color-text));
+  font-weight: 600;
+}
+.uxm-tabs-underline__tab--active::after {
+  background-color: var(--uxm-tabs-underline-bar-color, var(--color-accent));
+  border-radius: var(--uxm-tabs-underline-bar-radius, 2px);
+  bottom: -1px;
+  content: "";
+  height: var(--uxm-tabs-underline-bar-height, 2px);
+  left: 0;
+  position: absolute;
+  right: 0;
+}
+.uxm-tabs-underline__icon {
+  display: inline-flex;
+  height: var(--uxm-tabs-underline-icon-size, 14px);
+  width: var(--uxm-tabs-underline-icon-size, 14px);
+}
+.uxm-tabs-underline__icon > svg {
+  height: 100%;
+  width: 100%;
+}

package/dist/ui/tabs-underline/tabs-underline.d.ts

@@ -0,0 +1,17 @@
+import type { HTMLAttributes, ReactNode } from 'react';
+export interface TabsUnderlineOption {
+    value: string;
+    label: ReactNode;
+    icon?: ReactNode;
+    /** Disabled tabs are inert and paint the disabled styling (opacity +
+     *  disabled text color). Selecting one is a no-op. */
+    disabled?: boolean;
+}
+export interface TabsUnderlineProps extends Omit<HTMLAttributes<HTMLDivElement>, 'onChange'> {
+    options: TabsUnderlineOption[];
+    value?: string;
+    defaultValue?: string;
+    onChange?: (value: string) => void;
+}
+export declare function TabsUnderline({ options, value, defaultValue, onChange, className, ...rest }: TabsUnderlineProps): import("react/jsx-runtime").JSX.Element;
+//# sourceMappingURL=tabs-underline.d.ts.map

package/dist/ui/tabs-underline/tabs-underline.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"tabs-underline.d.ts","sourceRoot":"","sources":["../../../src/ui/tabs-underline/tabs-underline.tsx"],"names":[],"mappings":"AAMA,OAAO,KAAK,EAAE,cAAc,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAEvD,MAAM,WAAW,mBAAmB;IAClC,KAAK,EAAE,MAAM,CAAC;IACd,KAAK,EAAE,SAAS,CAAC;IACjB,IAAI,CAAC,EAAE,SAAS,CAAC;IACjB;0DACsD;IACtD,QAAQ,CAAC,EAAE,OAAO,CAAC;CACpB;AAED,MAAM,WAAW,kBAAmB,SAAQ,IAAI,CAAC,cAAc,CAAC,cAAc,CAAC,EAAE,UAAU,CAAC;IAC1F,OAAO,EAAE,mBAAmB,EAAE,CAAC;IAC/B,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,QAAQ,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;CACpC;AAED,wBAAgB,aAAa,CAAC,EAC5B,OAAO,EACP,KAAK,EACL,YAAY,EACZ,QAAQ,EACR,SAAS,EACT,GAAG,IAAI,EACR,EAAE,kBAAkB,2CAgDpB"}

package/dist/ui/tabs-underline/tabs-underline.js

@@ -0,0 +1,56 @@
+import { jsx, jsxs } from "react/jsx-runtime";
+import { useState } from "react";
+import { cn } from "../../helpers/index.js";
+import { useRovingTabIndex } from "../../hooks/use-roving-tab-index.js";
+function TabsUnderline({
+  options,
+  value,
+  defaultValue,
+  onChange,
+  className,
+  ...rest
+}) {
+  const isControlled = value !== void 0;
+  const [internal, setInternal] = useState(defaultValue ?? options[0]?.value ?? "");
+  const active = isControlled ? value : internal;
+  const select = (next) => {
+    if (!isControlled) setInternal(next);
+    onChange?.(next);
+  };
+  const activeIndex = Math.max(0, options.findIndex((opt) => opt.value === active));
+  const { getItemRef, onItemKeyDown } = useRovingTabIndex({
+    count: options.length,
+    activeIndex,
+    isDisabled: (i) => !!options[i]?.disabled,
+    onNavigate: (i) => select(options[i].value)
+  });
+  return /* @__PURE__ */ jsx("div", { role: "tablist", className: cn("uxm-tabs-underline", className), ...rest, children: options.map((opt, i) => {
+    const isActive = opt.value === active;
+    return /* @__PURE__ */ jsxs(
+      "button",
+      {
+        ref: getItemRef(i),
+        type: "button",
+        role: "tab",
+        "aria-selected": isActive,
+        tabIndex: i === activeIndex ? 0 : -1,
+        disabled: opt.disabled,
+        className: cn(
+          "uxm-tabs-underline__tab",
+          isActive && "uxm-tabs-underline__tab--active"
+        ),
+        onClick: () => select(opt.value),
+        onKeyDown: (e) => onItemKeyDown(e, i),
+        children: [
+          opt.icon && /* @__PURE__ */ jsx("span", { className: "uxm-tabs-underline__icon", children: opt.icon }),
+          /* @__PURE__ */ jsx("span", { className: "uxm-tabs-underline__label", children: opt.label })
+        ]
+      },
+      opt.value
+    );
+  }) });
+}
+export {
+  TabsUnderline
+};
+//# sourceMappingURL=tabs-underline.js.map

package/dist/ui/tabs-underline/tabs-underline.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../src/ui/tabs-underline/tabs-underline.tsx"],"sourcesContent":["import { useState } from 'react';\n\nimport { cn } from '@/helpers';\n\nimport { useRovingTabIndex } from '../../hooks/use-roving-tab-index';\n\nimport type { HTMLAttributes, ReactNode } from 'react';\n\nexport interface TabsUnderlineOption {\n  value: string;\n  label: ReactNode;\n  icon?: ReactNode;\n  /** Disabled tabs are inert and paint the disabled styling (opacity +\n   *  disabled text color). Selecting one is a no-op. */\n  disabled?: boolean;\n}\n\nexport interface TabsUnderlineProps extends Omit<HTMLAttributes<HTMLDivElement>, 'onChange'> {\n  options: TabsUnderlineOption[];\n  value?: string;\n  defaultValue?: string;\n  onChange?: (value: string) => void;\n}\n\nexport function TabsUnderline({\n  options,\n  value,\n  defaultValue,\n  onChange,\n  className,\n  ...rest\n}: TabsUnderlineProps) {\n  const isControlled = value !== undefined;\n  const [internal, setInternal] = useState<string>(defaultValue ?? options[0]?.value ?? '');\n  const active = isControlled ? value : internal;\n\n  const select = (next: string) => {\n    if (!isControlled) setInternal(next);\n    onChange?.(next);\n  };\n\n  // Roving tabindex: only the active tab is a Tab stop; ArrowLeft/Right +\n  // Home/End move (and select) within the group, matching the ARIA tabs\n  // pattern's \"automatic activation\" model — the same thing a click does.\n  const activeIndex = Math.max(0, options.findIndex((opt) => opt.value === active));\n  const { getItemRef, onItemKeyDown } = useRovingTabIndex({\n    count: options.length,\n    activeIndex,\n    isDisabled: (i) => !!options[i]?.disabled,\n    onNavigate: (i) => select(options[i].value),\n  });\n\n  return (\n    <div role=\"tablist\" className={cn('uxm-tabs-underline', className)} {...rest}>\n      {options.map((opt, i) => {\n        const isActive = opt.value === active;\n        return (\n          <button\n            key={opt.value}\n            ref={getItemRef(i)}\n            type=\"button\"\n            role=\"tab\"\n            aria-selected={isActive}\n            tabIndex={i === activeIndex ? 0 : -1}\n            disabled={opt.disabled}\n            className={cn(\n              'uxm-tabs-underline__tab',\n              isActive && 'uxm-tabs-underline__tab--active',\n            )}\n            onClick={() => select(opt.value)}\n            onKeyDown={(e) => onItemKeyDown(e, i)}\n          >\n            {opt.icon && <span className=\"uxm-tabs-underline__icon\">{opt.icon}</span>}\n            <span className=\"uxm-tabs-underline__label\">{opt.label}</span>\n          </button>\n        );\n      })}\n    </div>\n  );\n}\n"],"mappings":"AAyDU,SAee,KAff;AAzDV,SAAS,gBAAgB;AAEzB,SAAS,UAAU;AAEnB,SAAS,yBAAyB;AAoB3B,SAAS,cAAc;AAAA,EAC5B;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA,GAAG;AACL,GAAuB;AACrB,QAAM,eAAe,UAAU;AAC/B,QAAM,CAAC,UAAU,WAAW,IAAI,SAAiB,gBAAgB,QAAQ,CAAC,GAAG,SAAS,EAAE;AACxF,QAAM,SAAS,eAAe,QAAQ;AAEtC,QAAM,SAAS,CAAC,SAAiB;AAC/B,QAAI,CAAC,aAAc,aAAY,IAAI;AACnC,eAAW,IAAI;AAAA,EACjB;AAKA,QAAM,cAAc,KAAK,IAAI,GAAG,QAAQ,UAAU,CAAC,QAAQ,IAAI,UAAU,MAAM,CAAC;AAChF,QAAM,EAAE,YAAY,cAAc,IAAI,kBAAkB;AAAA,IACtD,OAAO,QAAQ;AAAA,IACf;AAAA,IACA,YAAY,CAAC,MAAM,CAAC,CAAC,QAAQ,CAAC,GAAG;AAAA,IACjC,YAAY,CAAC,MAAM,OAAO,QAAQ,CAAC,EAAE,KAAK;AAAA,EAC5C,CAAC;AAED,SACE,oBAAC,SAAI,MAAK,WAAU,WAAW,GAAG,sBAAsB,SAAS,GAAI,GAAG,MACrE,kBAAQ,IAAI,CAAC,KAAK,MAAM;AACvB,UAAM,WAAW,IAAI,UAAU;AAC/B,WACE;AAAA,MAAC;AAAA;AAAA,QAEC,KAAK,WAAW,CAAC;AAAA,QACjB,MAAK;AAAA,QACL,MAAK;AAAA,QACL,iBAAe;AAAA,QACf,UAAU,MAAM,cAAc,IAAI;AAAA,QAClC,UAAU,IAAI;AAAA,QACd,WAAW;AAAA,UACT;AAAA,UACA,YAAY;AAAA,QACd;AAAA,QACA,SAAS,MAAM,OAAO,IAAI,KAAK;AAAA,QAC/B,WAAW,CAAC,MAAM,cAAc,GAAG,CAAC;AAAA,QAEnC;AAAA,cAAI,QAAQ,oBAAC,UAAK,WAAU,4BAA4B,cAAI,MAAK;AAAA,UAClE,oBAAC,UAAK,WAAU,6BAA6B,cAAI,OAAM;AAAA;AAAA;AAAA,MAflD,IAAI;AAAA,IAgBX;AAAA,EAEJ,CAAC,GACH;AAEJ;","names":[]}

package/dist/ui/tag/index.cjs

@@ -0,0 +1,23 @@
+"use strict";
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __reExport = (target, mod, secondTarget) => (__copyProps(target, mod, "default"), secondTarget && __copyProps(secondTarget, mod, "default"));
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+var tag_exports = {};
+module.exports = __toCommonJS(tag_exports);
+__reExport(tag_exports, require("./tag.cjs"), module.exports);
+// Annotate the CommonJS export names for ESM import in node:
+0 && (module.exports = {
+  ...require("./tag.cjs")
+});
+//# sourceMappingURL=index.cjs.map

package/dist/ui/tag/index.cjs.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../src/ui/tag/index.ts"],"sourcesContent":["export * from './tag';\n"],"mappings":";;;;;;;;;;;;;;;AAAA;AAAA;AAAA,wBAAc,kBAAd;","names":[]}

package/dist/ui/tag/index.d.ts

@@ -0,0 +1,2 @@
+export * from './tag.js';
+//# sourceMappingURL=index.d.ts.map

package/dist/ui/tag/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/ui/tag/index.ts"],"names":[],"mappings":"AAAA,cAAc,OAAO,CAAC"}

package/dist/ui/tag/index.js

@@ -0,0 +1,2 @@
+export * from "./tag.js";
+//# sourceMappingURL=index.js.map

package/dist/ui/tag/index.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../src/ui/tag/index.ts"],"sourcesContent":["export * from './tag';\n"],"mappings":"AAAA,cAAc;","names":[]}

package/dist/ui/tag/tag-preview.cjs

@@ -0,0 +1,65 @@
+"use strict";
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+var tag_preview_exports = {};
+__export(tag_preview_exports, {
+  TagPreview: () => TagPreview
+});
+module.exports = __toCommonJS(tag_preview_exports);
+var import_jsx_runtime = require("react/jsx-runtime");
+var import_ui = require("../../ui/index.cjs");
+var import_ui2 = require("../../ui/index.cjs");
+const SAMPLE_LABEL = {
+  accent: "Featured",
+  success: "Approved",
+  warning: "Pending",
+  danger: "Rejected",
+  info: "In Review",
+  neutral: "Draft"
+};
+function CheckIcon() {
+  return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_ui.Icon, { glyph: "check", size: 16, strokeWidth: 2.5, "aria-hidden": true });
+}
+function stylesToCssVars(styles) {
+  const out = {};
+  for (const [key, value] of Object.entries(styles)) {
+    const cssVar = "--uxm-tag-" + key.replace(/([A-Z])/g, "-$1").toLowerCase();
+    if (typeof value === "boolean") {
+      out[cssVar] = value ? "1" : "0";
+    } else if (typeof value === "number") {
+      out[cssVar] = `${value}px`;
+    } else {
+      out[cssVar] = String(value);
+    }
+  }
+  return out;
+}
+function TagPreview({ styles, variants }) {
+  const type = variants.type ?? "success";
+  const size = variants.size ?? "medium";
+  const tagStyle = stylesToCssVars(styles);
+  return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { style: { display: "flex", alignItems: "center", gap: 8 }, children: [
+    /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_ui2.Tag, { type, size, iconLeft: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(CheckIcon, {}), style: tagStyle, children: SAMPLE_LABEL[type] }),
+    /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_ui2.Tag, { type, size, style: tagStyle, children: SAMPLE_LABEL[type] })
+  ] });
+}
+// Annotate the CommonJS export names for ESM import in node:
+0 && (module.exports = {
+  TagPreview
+});
+//# sourceMappingURL=tag-preview.cjs.map

package/dist/ui/tag/tag-preview.cjs.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../src/ui/tag/tag-preview.tsx"],"sourcesContent":["import type { PreviewProps } from '@/previews/types';\nimport { Icon } from '@/ui';\nimport { Tag, type TagSize, type TagType } from '@/ui';\n\nimport type { CSSProperties } from 'react';\n\nconst SAMPLE_LABEL: Record<TagType, string> = {\n  accent: 'Featured',\n  success: 'Approved',\n  warning: 'Pending',\n  danger: 'Rejected',\n  info: 'In Review',\n  neutral: 'Draft',\n};\n\nfunction CheckIcon() {\n  return <Icon glyph=\"check\" size={16} strokeWidth={2.5} aria-hidden />;\n}\n\n/**\n * Project the resolved style knobs onto `--uxm-tag-{kebab(key)}` CSS\n * custom properties, applied INLINE per-tag (not on a wrapper). Same\n * cascade-precedence reason as ChipPreview — saved overrides on\n * `.uxm-tag` would otherwise beat ancestor-inherited slider values.\n *\n * Per-size knobs (`smallPaddingX`, `mediumFontSize`, etc.) project as\n * `--uxm-tag-small-padding-x`, `--uxm-tag-medium-font-size`, etc. Each\n * size modifier rule reads its own namespace, so projecting all knobs\n * at once is safe — the inactive size's vars are simply unused.\n */\nfunction stylesToCssVars(styles: PreviewProps['styles']): CSSProperties {\n  const out: Record<string, string> = {};\n  for (const [key, value] of Object.entries(styles)) {\n    const cssVar = '--uxm-tag-' + key.replace(/([A-Z])/g, '-$1').toLowerCase();\n    if (typeof value === 'boolean') {\n      out[cssVar] = value ? '1' : '0';\n    } else if (typeof value === 'number') {\n      out[cssVar] = `${value}px`;\n    } else {\n      out[cssVar] = String(value);\n    }\n  }\n  return out as CSSProperties;\n}\n\nexport function TagPreview({ styles, variants }: PreviewProps) {\n  const type = ((variants.type as string) ?? 'success') as TagType;\n  const size = ((variants.size as string) ?? 'medium') as TagSize;\n  const tagStyle = stylesToCssVars(styles);\n  return (\n    <div style={{ display: 'flex', alignItems: 'center', gap: 8 }}>\n      <Tag type={type} size={size} iconLeft={<CheckIcon />} style={tagStyle}>{SAMPLE_LABEL[type]}</Tag>\n      <Tag type={type} size={size} style={tagStyle}>{SAMPLE_LABEL[type]}</Tag>\n    </div>\n  );\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAgBS;AAfT,gBAAqB;AACrB,IAAAA,aAAgD;AAIhD,MAAM,eAAwC;AAAA,EAC5C,QAAQ;AAAA,EACR,SAAS;AAAA,EACT,SAAS;AAAA,EACT,QAAQ;AAAA,EACR,MAAM;AAAA,EACN,SAAS;AACX;AAEA,SAAS,YAAY;AACnB,SAAO,4CAAC,kBAAK,OAAM,SAAQ,MAAM,IAAI,aAAa,KAAK,eAAW,MAAC;AACrE;AAaA,SAAS,gBAAgB,QAA+C;AACtE,QAAM,MAA8B,CAAC;AACrC,aAAW,CAAC,KAAK,KAAK,KAAK,OAAO,QAAQ,MAAM,GAAG;AACjD,UAAM,SAAS,eAAe,IAAI,QAAQ,YAAY,KAAK,EAAE,YAAY;AACzE,QAAI,OAAO,UAAU,WAAW;AAC9B,UAAI,MAAM,IAAI,QAAQ,MAAM;AAAA,IAC9B,WAAW,OAAO,UAAU,UAAU;AACpC,UAAI,MAAM,IAAI,GAAG,KAAK;AAAA,IACxB,OAAO;AACL,UAAI,MAAM,IAAI,OAAO,KAAK;AAAA,IAC5B;AAAA,EACF;AACA,SAAO;AACT;AAEO,SAAS,WAAW,EAAE,QAAQ,SAAS,GAAiB;AAC7D,QAAM,OAAS,SAAS,QAAmB;AAC3C,QAAM,OAAS,SAAS,QAAmB;AAC3C,QAAM,WAAW,gBAAgB,MAAM;AACvC,SACE,6CAAC,SAAI,OAAO,EAAE,SAAS,QAAQ,YAAY,UAAU,KAAK,EAAE,GAC1D;AAAA,gDAAC,kBAAI,MAAY,MAAY,UAAU,4CAAC,aAAU,GAAI,OAAO,UAAW,uBAAa,IAAI,GAAE;AAAA,IAC3F,4CAAC,kBAAI,MAAY,MAAY,OAAO,UAAW,uBAAa,IAAI,GAAE;AAAA,KACpE;AAEJ;","names":["import_ui"]}

package/dist/ui/tag/tag-preview.d.ts

@@ -0,0 +1,3 @@
+import type { PreviewProps } from '../../previews/types.js';
+export declare function TagPreview({ styles, variants }: PreviewProps): import("react/jsx-runtime").JSX.Element;
+//# sourceMappingURL=tag-preview.d.ts.map

package/dist/ui/tag/tag-preview.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"tag-preview.d.ts","sourceRoot":"","sources":["../../../src/ui/tag/tag-preview.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,kBAAkB,CAAC;AA6CrD,wBAAgB,UAAU,CAAC,EAAE,MAAM,EAAE,QAAQ,EAAE,EAAE,YAAY,2CAU5D"}

package/dist/ui/tag/tag-preview.js

@@ -0,0 +1,41 @@
+import { jsx, jsxs } from "react/jsx-runtime";
+import { Icon } from "../../ui/index.js";
+import { Tag } from "../../ui/index.js";
+const SAMPLE_LABEL = {
+  accent: "Featured",
+  success: "Approved",
+  warning: "Pending",
+  danger: "Rejected",
+  info: "In Review",
+  neutral: "Draft"
+};
+function CheckIcon() {
+  return /* @__PURE__ */ jsx(Icon, { glyph: "check", size: 16, strokeWidth: 2.5, "aria-hidden": true });
+}
+function stylesToCssVars(styles) {
+  const out = {};
+  for (const [key, value] of Object.entries(styles)) {
+    const cssVar = "--uxm-tag-" + key.replace(/([A-Z])/g, "-$1").toLowerCase();
+    if (typeof value === "boolean") {
+      out[cssVar] = value ? "1" : "0";
+    } else if (typeof value === "number") {
+      out[cssVar] = `${value}px`;
+    } else {
+      out[cssVar] = String(value);
+    }
+  }
+  return out;
+}
+function TagPreview({ styles, variants }) {
+  const type = variants.type ?? "success";
+  const size = variants.size ?? "medium";
+  const tagStyle = stylesToCssVars(styles);
+  return /* @__PURE__ */ jsxs("div", { style: { display: "flex", alignItems: "center", gap: 8 }, children: [
+    /* @__PURE__ */ jsx(Tag, { type, size, iconLeft: /* @__PURE__ */ jsx(CheckIcon, {}), style: tagStyle, children: SAMPLE_LABEL[type] }),
+    /* @__PURE__ */ jsx(Tag, { type, size, style: tagStyle, children: SAMPLE_LABEL[type] })
+  ] });
+}
+export {
+  TagPreview
+};
+//# sourceMappingURL=tag-preview.js.map

package/dist/ui/tag/tag-preview.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../src/ui/tag/tag-preview.tsx"],"sourcesContent":["import type { PreviewProps } from '@/previews/types';\nimport { Icon } from '@/ui';\nimport { Tag, type TagSize, type TagType } from '@/ui';\n\nimport type { CSSProperties } from 'react';\n\nconst SAMPLE_LABEL: Record<TagType, string> = {\n  accent: 'Featured',\n  success: 'Approved',\n  warning: 'Pending',\n  danger: 'Rejected',\n  info: 'In Review',\n  neutral: 'Draft',\n};\n\nfunction CheckIcon() {\n  return <Icon glyph=\"check\" size={16} strokeWidth={2.5} aria-hidden />;\n}\n\n/**\n * Project the resolved style knobs onto `--uxm-tag-{kebab(key)}` CSS\n * custom properties, applied INLINE per-tag (not on a wrapper). Same\n * cascade-precedence reason as ChipPreview — saved overrides on\n * `.uxm-tag` would otherwise beat ancestor-inherited slider values.\n *\n * Per-size knobs (`smallPaddingX`, `mediumFontSize`, etc.) project as\n * `--uxm-tag-small-padding-x`, `--uxm-tag-medium-font-size`, etc. Each\n * size modifier rule reads its own namespace, so projecting all knobs\n * at once is safe — the inactive size's vars are simply unused.\n */\nfunction stylesToCssVars(styles: PreviewProps['styles']): CSSProperties {\n  const out: Record<string, string> = {};\n  for (const [key, value] of Object.entries(styles)) {\n    const cssVar = '--uxm-tag-' + key.replace(/([A-Z])/g, '-$1').toLowerCase();\n    if (typeof value === 'boolean') {\n      out[cssVar] = value ? '1' : '0';\n    } else if (typeof value === 'number') {\n      out[cssVar] = `${value}px`;\n    } else {\n      out[cssVar] = String(value);\n    }\n  }\n  return out as CSSProperties;\n}\n\nexport function TagPreview({ styles, variants }: PreviewProps) {\n  const type = ((variants.type as string) ?? 'success') as TagType;\n  const size = ((variants.size as string) ?? 'medium') as TagSize;\n  const tagStyle = stylesToCssVars(styles);\n  return (\n    <div style={{ display: 'flex', alignItems: 'center', gap: 8 }}>\n      <Tag type={type} size={size} iconLeft={<CheckIcon />} style={tagStyle}>{SAMPLE_LABEL[type]}</Tag>\n      <Tag type={type} size={size} style={tagStyle}>{SAMPLE_LABEL[type]}</Tag>\n    </div>\n  );\n}\n"],"mappings":"AAgBS,cAkCL,YAlCK;AAfT,SAAS,YAAY;AACrB,SAAS,WAAuC;AAIhD,MAAM,eAAwC;AAAA,EAC5C,QAAQ;AAAA,EACR,SAAS;AAAA,EACT,SAAS;AAAA,EACT,QAAQ;AAAA,EACR,MAAM;AAAA,EACN,SAAS;AACX;AAEA,SAAS,YAAY;AACnB,SAAO,oBAAC,QAAK,OAAM,SAAQ,MAAM,IAAI,aAAa,KAAK,eAAW,MAAC;AACrE;AAaA,SAAS,gBAAgB,QAA+C;AACtE,QAAM,MAA8B,CAAC;AACrC,aAAW,CAAC,KAAK,KAAK,KAAK,OAAO,QAAQ,MAAM,GAAG;AACjD,UAAM,SAAS,eAAe,IAAI,QAAQ,YAAY,KAAK,EAAE,YAAY;AACzE,QAAI,OAAO,UAAU,WAAW;AAC9B,UAAI,MAAM,IAAI,QAAQ,MAAM;AAAA,IAC9B,WAAW,OAAO,UAAU,UAAU;AACpC,UAAI,MAAM,IAAI,GAAG,KAAK;AAAA,IACxB,OAAO;AACL,UAAI,MAAM,IAAI,OAAO,KAAK;AAAA,IAC5B;AAAA,EACF;AACA,SAAO;AACT;AAEO,SAAS,WAAW,EAAE,QAAQ,SAAS,GAAiB;AAC7D,QAAM,OAAS,SAAS,QAAmB;AAC3C,QAAM,OAAS,SAAS,QAAmB;AAC3C,QAAM,WAAW,gBAAgB,MAAM;AACvC,SACE,qBAAC,SAAI,OAAO,EAAE,SAAS,QAAQ,YAAY,UAAU,KAAK,EAAE,GAC1D;AAAA,wBAAC,OAAI,MAAY,MAAY,UAAU,oBAAC,aAAU,GAAI,OAAO,UAAW,uBAAa,IAAI,GAAE;AAAA,IAC3F,oBAAC,OAAI,MAAY,MAAY,OAAO,UAAW,uBAAa,IAAI,GAAE;AAAA,KACpE;AAEJ;","names":[]}

package/dist/ui/tag/tag.cjs

@@ -0,0 +1,36 @@
+"use strict";
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+var tag_exports = {};
+__export(tag_exports, {
+  Tag: () => Tag
+});
+module.exports = __toCommonJS(tag_exports);
+var import_jsx_runtime = require("react/jsx-runtime");
+var import_helpers = require("../../helpers/index.cjs");
+function Tag({ children, type = "neutral", size = "medium", iconLeft, className, ...rest }) {
+  return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("span", { className: (0, import_helpers.cn)("uxm-tag", `uxm-tag--${type}`, `uxm-tag--${size}`, className), ...rest, children: [
+    iconLeft && /* @__PURE__ */ (0, import_jsx_runtime.jsx)("span", { className: "uxm-tag__icon-left", "aria-hidden": "true", children: iconLeft }),
+    /* @__PURE__ */ (0, import_jsx_runtime.jsx)("span", { className: "uxm-tag__label", children })
+  ] });
+}
+// Annotate the CommonJS export names for ESM import in node:
+0 && (module.exports = {
+  Tag
+});
+//# sourceMappingURL=tag.cjs.map

package/dist/ui/tag/tag.cjs.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../src/ui/tag/tag.tsx"],"sourcesContent":["import { cn } from '@/helpers';\n\nimport type { HTMLAttributes, ReactNode } from 'react';\n\nexport type TagType = 'accent' | 'success' | 'warning' | 'danger' | 'info' | 'neutral';\nexport type TagSize = 'small' | 'medium';\n\nexport interface TagProps extends HTMLAttributes<HTMLSpanElement> {\n  children: ReactNode;\n  type?: TagType;\n  /**\n   * Preset size. `medium` (default) is the standalone tag — what\n   * registry knobs like paddingX / fontSize tune. `small` is a fixed\n   * tighter preset for dense contexts (e.g. status pills inside a\n   * data-table row).\n   */\n  size?: TagSize;\n  iconLeft?: ReactNode;\n}\n\n/**\n * Tag — read-only status label, six semantic types (accent / success /\n * warning / danger / info / neutral) × two sizes (small / medium).\n * Styled via `.uxm-tag` + `.uxm-tag--{type}` + `.uxm-tag--{size}` CSS\n * reading `--uxm-tag-*` custom properties.\n */\nexport function Tag({ children, type = 'neutral', size = 'medium', iconLeft, className, ...rest }: TagProps) {\n  return (\n    <span className={cn('uxm-tag', `uxm-tag--${type}`, `uxm-tag--${size}`, className)} {...rest}>\n      {iconLeft && (\n        <span className=\"uxm-tag__icon-left\" aria-hidden=\"true\">\n          {iconLeft}\n        </span>\n      )}\n      <span className=\"uxm-tag__label\">{children}</span>\n    </span>\n  );\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AA4BI;AA5BJ,qBAAmB;AA0BZ,SAAS,IAAI,EAAE,UAAU,OAAO,WAAW,OAAO,UAAU,UAAU,WAAW,GAAG,KAAK,GAAa;AAC3G,SACE,6CAAC,UAAK,eAAW,mBAAG,WAAW,YAAY,IAAI,IAAI,YAAY,IAAI,IAAI,SAAS,GAAI,GAAG,MACpF;AAAA,gBACC,4CAAC,UAAK,WAAU,sBAAqB,eAAY,QAC9C,oBACH;AAAA,IAEF,4CAAC,UAAK,WAAU,kBAAkB,UAAS;AAAA,KAC7C;AAEJ;","names":[]}

package/dist/ui/tag/tag.css

@@ -0,0 +1,85 @@
+@charset "UTF-8";
+/* ── tag ── */
+.uxm-tag {
+  align-items: center;
+  /* Shared knobs — borderRadius and fontWeight apply to both sizes. */
+  border-radius: var(--uxm-tag-border-radius, 999px);
+  border-style: solid;
+  border-width: 1px;
+  display: inline-flex;
+  font: inherit;
+  font-weight: var(--uxm-tag-font-weight, 500);
+  line-height: 1;
+  user-select: none;
+  white-space: nowrap;
+}
+.uxm-tag__icon-left {
+  align-items: center;
+  display: inline-flex;
+  flex-shrink: 0;
+}
+.uxm-tag__label {
+  align-items: center;
+  display: inline-flex;
+}
+.uxm-tag--accent {
+  background-color: var(--uxm-tag-accent-bg, var(--color-accent-subtle));
+  border-color: var(--uxm-tag-accent-border, var(--color-accent-subtle));
+  color: var(--uxm-tag-accent-text, var(--color-accent-bold));
+}
+.uxm-tag--success {
+  background-color: var(--uxm-tag-success-bg, var(--color-success-bg));
+  border-color: var(--uxm-tag-success-border, var(--color-success-border));
+  color: var(--uxm-tag-success-text, var(--color-success-text));
+}
+.uxm-tag--warning {
+  background-color: var(--uxm-tag-warning-bg, var(--color-warning-bg));
+  border-color: var(--uxm-tag-warning-border, var(--color-warning-border));
+  color: var(--uxm-tag-warning-text, var(--color-warning-text));
+}
+.uxm-tag--danger {
+  background-color: var(--uxm-tag-danger-bg, var(--color-danger-bg));
+  border-color: var(--uxm-tag-danger-border, var(--color-danger-border));
+  color: var(--uxm-tag-danger-text, var(--color-danger-text));
+}
+.uxm-tag--info {
+  background-color: var(--uxm-tag-info-bg, var(--color-info-bg));
+  border-color: var(--uxm-tag-info-border, var(--color-info-border));
+  color: var(--uxm-tag-info-text, var(--color-info-text));
+}
+.uxm-tag--neutral {
+  background-color: var(--uxm-tag-neutral-bg, var(--color-surface-alt));
+  border-color: var(--uxm-tag-neutral-border, var(--color-border));
+  color: var(--uxm-tag-neutral-text, var(--color-text-muted));
+}
+
+/* Size presets — each owns its own padding/font/gap/icon-size scale via
+   `--uxm-tag-{size}-{key}` namespaced vars. Saves of `smallPaddingX`,
+   `mediumFontSize`, etc. emit as `--uxm-tag-small-padding-x` /
+   `--uxm-tag-medium-font-size` (fallback path in toCSS), which the
+   matching modifier reads. Double-class selector raises specificity to
+   (0,2,0) so per-size declarations beat any single-class override on
+   `.uxm-tag` regardless of source order. */
+.uxm-tag.uxm-tag--small {
+  font-size: calc(var(--uxm-tag-small-font-size, 11px) * var(--type-scale, 1));
+  gap: var(--uxm-tag-small-gap, 6px);
+  padding-block: var(--uxm-tag-small-padding-y, 2px);
+  padding-inline: var(--uxm-tag-small-padding-x, 8px);
+}
+
+.uxm-tag.uxm-tag--small .uxm-tag__icon-left > svg {
+  height: var(--uxm-tag-small-icon-size, 12px);
+  width: var(--uxm-tag-small-icon-size, 12px);
+}
+
+.uxm-tag.uxm-tag--medium {
+  font-size: calc(var(--uxm-tag-medium-font-size, 13px) * var(--type-scale, 1));
+  gap: var(--uxm-tag-medium-gap, 8px);
+  padding-block: var(--uxm-tag-medium-padding-y, 4px);
+  padding-inline: var(--uxm-tag-medium-padding-x, 12px);
+}
+
+.uxm-tag.uxm-tag--medium .uxm-tag__icon-left > svg {
+  height: var(--uxm-tag-medium-icon-size, 16px);
+  width: var(--uxm-tag-medium-icon-size, 16px);
+}

package/dist/ui/tag/tag.d.ts

@@ -0,0 +1,23 @@
+import type { HTMLAttributes, ReactNode } from 'react';
+export type TagType = 'accent' | 'success' | 'warning' | 'danger' | 'info' | 'neutral';
+export type TagSize = 'small' | 'medium';
+export interface TagProps extends HTMLAttributes<HTMLSpanElement> {
+    children: ReactNode;
+    type?: TagType;
+    /**
+     * Preset size. `medium` (default) is the standalone tag — what
+     * registry knobs like paddingX / fontSize tune. `small` is a fixed
+     * tighter preset for dense contexts (e.g. status pills inside a
+     * data-table row).
+     */
+    size?: TagSize;
+    iconLeft?: ReactNode;
+}
+/**
+ * Tag — read-only status label, six semantic types (accent / success /
+ * warning / danger / info / neutral) × two sizes (small / medium).
+ * Styled via `.uxm-tag` + `.uxm-tag--{type}` + `.uxm-tag--{size}` CSS
+ * reading `--uxm-tag-*` custom properties.
+ */
+export declare function Tag({ children, type, size, iconLeft, className, ...rest }: TagProps): import("react/jsx-runtime").JSX.Element;
+//# sourceMappingURL=tag.d.ts.map

package/dist/ui/tag/tag.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"tag.d.ts","sourceRoot":"","sources":["../../../src/ui/tag/tag.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,cAAc,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAEvD,MAAM,MAAM,OAAO,GAAG,QAAQ,GAAG,SAAS,GAAG,SAAS,GAAG,QAAQ,GAAG,MAAM,GAAG,SAAS,CAAC;AACvF,MAAM,MAAM,OAAO,GAAG,OAAO,GAAG,QAAQ,CAAC;AAEzC,MAAM,WAAW,QAAS,SAAQ,cAAc,CAAC,eAAe,CAAC;IAC/D,QAAQ,EAAE,SAAS,CAAC;IACpB,IAAI,CAAC,EAAE,OAAO,CAAC;IACf;;;;;OAKG;IACH,IAAI,CAAC,EAAE,OAAO,CAAC;IACf,QAAQ,CAAC,EAAE,SAAS,CAAC;CACtB;AAED;;;;;GAKG;AACH,wBAAgB,GAAG,CAAC,EAAE,QAAQ,EAAE,IAAgB,EAAE,IAAe,EAAE,QAAQ,EAAE,SAAS,EAAE,GAAG,IAAI,EAAE,EAAE,QAAQ,2CAW1G"}

package/dist/ui/tag/tag.js

@@ -0,0 +1,12 @@
+import { jsx, jsxs } from "react/jsx-runtime";
+import { cn } from "../../helpers/index.js";
+function Tag({ children, type = "neutral", size = "medium", iconLeft, className, ...rest }) {
+  return /* @__PURE__ */ jsxs("span", { className: cn("uxm-tag", `uxm-tag--${type}`, `uxm-tag--${size}`, className), ...rest, children: [
+    iconLeft && /* @__PURE__ */ jsx("span", { className: "uxm-tag__icon-left", "aria-hidden": "true", children: iconLeft }),
+    /* @__PURE__ */ jsx("span", { className: "uxm-tag__label", children })
+  ] });
+}
+export {
+  Tag
+};
+//# sourceMappingURL=tag.js.map

package/dist/ui/tag/tag.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../src/ui/tag/tag.tsx"],"sourcesContent":["import { cn } from '@/helpers';\n\nimport type { HTMLAttributes, ReactNode } from 'react';\n\nexport type TagType = 'accent' | 'success' | 'warning' | 'danger' | 'info' | 'neutral';\nexport type TagSize = 'small' | 'medium';\n\nexport interface TagProps extends HTMLAttributes<HTMLSpanElement> {\n  children: ReactNode;\n  type?: TagType;\n  /**\n   * Preset size. `medium` (default) is the standalone tag — what\n   * registry knobs like paddingX / fontSize tune. `small` is a fixed\n   * tighter preset for dense contexts (e.g. status pills inside a\n   * data-table row).\n   */\n  size?: TagSize;\n  iconLeft?: ReactNode;\n}\n\n/**\n * Tag — read-only status label, six semantic types (accent / success /\n * warning / danger / info / neutral) × two sizes (small / medium).\n * Styled via `.uxm-tag` + `.uxm-tag--{type}` + `.uxm-tag--{size}` CSS\n * reading `--uxm-tag-*` custom properties.\n */\nexport function Tag({ children, type = 'neutral', size = 'medium', iconLeft, className, ...rest }: TagProps) {\n  return (\n    <span className={cn('uxm-tag', `uxm-tag--${type}`, `uxm-tag--${size}`, className)} {...rest}>\n      {iconLeft && (\n        <span className=\"uxm-tag__icon-left\" aria-hidden=\"true\">\n          {iconLeft}\n        </span>\n      )}\n      <span className=\"uxm-tag__label\">{children}</span>\n    </span>\n  );\n}\n"],"mappings":"AA4BI,SAEI,KAFJ;AA5BJ,SAAS,UAAU;AA0BZ,SAAS,IAAI,EAAE,UAAU,OAAO,WAAW,OAAO,UAAU,UAAU,WAAW,GAAG,KAAK,GAAa;AAC3G,SACE,qBAAC,UAAK,WAAW,GAAG,WAAW,YAAY,IAAI,IAAI,YAAY,IAAI,IAAI,SAAS,GAAI,GAAG,MACpF;AAAA,gBACC,oBAAC,UAAK,WAAU,sBAAqB,eAAY,QAC9C,oBACH;AAAA,IAEF,oBAAC,UAAK,WAAU,kBAAkB,UAAS;AAAA,KAC7C;AAEJ;","names":[]}

package/dist/ui/thumbnail/index.cjs

@@ -0,0 +1,23 @@
+"use strict";
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __reExport = (target, mod, secondTarget) => (__copyProps(target, mod, "default"), secondTarget && __copyProps(secondTarget, mod, "default"));
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+var thumbnail_exports = {};
+module.exports = __toCommonJS(thumbnail_exports);
+__reExport(thumbnail_exports, require("./thumbnail.cjs"), module.exports);
+// Annotate the CommonJS export names for ESM import in node:
+0 && (module.exports = {
+  ...require("./thumbnail.cjs")
+});
+//# sourceMappingURL=index.cjs.map

package/dist/ui/thumbnail/index.cjs.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../src/ui/thumbnail/index.ts"],"sourcesContent":["export * from './thumbnail';\n"],"mappings":";;;;;;;;;;;;;;;AAAA;AAAA;AAAA,8BAAc,wBAAd;","names":[]}

package/dist/ui/thumbnail/index.d.ts

@@ -0,0 +1,2 @@
+export * from './thumbnail.js';
+//# sourceMappingURL=index.d.ts.map

package/dist/ui/thumbnail/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/ui/thumbnail/index.ts"],"names":[],"mappings":"AAAA,cAAc,aAAa,CAAC"}

package/dist/ui/thumbnail/index.js

@@ -0,0 +1,2 @@
+export * from "./thumbnail.js";
+//# sourceMappingURL=index.js.map