@bioturing/components 0.18.0 → 0.19.0

package/dist/components/Button/component.js

@@ -1,36 +1,46 @@
 "use client";
-import { jsxs as u, jsx as s } from "react/jsx-runtime";
-import m from "antd/es/button";
+import { jsx as s } from "react/jsx-runtime";
+import a from "antd/es/button";
 import { forwardRef as l } from "react";
 import './style.css';/* empty css          */
-import { useCls as a } from "../utils/antdUtils.js";
-const f = ({ negativeMargin: p = !0, type: t, size: n, variant: r, ...o }, e) => {
-  const c = p && (r === "text" || r === "link" || t == "text" || t === "link"), i = a();
-  return c ? /* @__PURE__ */ u(
+import { useCls as u } from "../utils/antdUtils.js";
+const w = ({ negativeMargin: c = !0, type: t, size: o, variant: n, icon: r, ...m }, p) => {
+  const i = c && (n === "text" || n === "link" || t == "text" || t === "link"), e = u();
+  return i ? /* @__PURE__ */ s(
     "span",
     {
-      className: i(
+      className: e(
         "btn-wrapper",
         "btn-negative-margin-wrapper",
-        "btn-wrapper-" + n
+        "btn-wrapper-" + o
       ),
-      children: [
-        /* @__PURE__ */ s(
-          m,
-          {
-            ref: e,
-            type: t,
-            size: n,
-            variant: r,
-            ...o
-          }
-        ),
-        " "
-      ]
+      children: /* @__PURE__ */ s(
+        a,
+        {
+          ref: p,
+          type: t,
+          size: o,
+          variant: n,
+          icon: r,
+          className: r ? e("btn-with-icon") : "",
+          ...m
+        }
+      )
     }
-  ) : /* @__PURE__ */ s(m, { ref: e, type: t, size: n, variant: r, ...o });
-}, B = l(f);
+  ) : /* @__PURE__ */ s(
+    a,
+    {
+      ref: p,
+      type: t,
+      size: o,
+      variant: n,
+      icon: r,
+      className: r ? e("btn-with-icon") : "",
+      ...m
+    }
+  );
+}, d = l(w);
 export {
-  B as Button
+  d as Button
 };
 //# sourceMappingURL=component.js.map

package/dist/components/Button/component.js.map

@@ -1 +1 @@
-{"version":3,"file":"component.js","sources":["../../../src/components/Button/component.tsx"],"sourcesContent":["\"use client\";\n\nimport {\n  default as AntdButton,\n  type ButtonProps as AntdButtonProps,\n} from \"antd/es/button\";\nimport { forwardRef } from \"react\";\n\n// Import component-specific styles\nimport { useCls } from \"../utils\";\nimport \"./style.css\";\n\nexport interface ButtonProps extends AntdButtonProps {\n  /**\n   * If true, negative margin will be applied to the text and link buttons to make it align with content\n   * @default true\n   */\n  negativeMargin?: boolean;\n}\n\nconst ButtonInner = (\n  { negativeMargin = true, type, size, variant, ...rest }: ButtonProps,\n  ref: React.Ref<HTMLButtonElement | HTMLAnchorElement>\n) => {\n  const useNegativeMargin =\n    negativeMargin &&\n    (variant === \"text\" ||\n      variant === \"link\" ||\n      type == \"text\" ||\n      type === \"link\");\n  const cls = useCls();\n  return useNegativeMargin ? (\n    <span\n      className={cls(\n        \"btn-wrapper\",\n        \"btn-negative-margin-wrapper\",\n        \"btn-wrapper-\" + size\n      )}\n    >\n      <AntdButton\n        ref={ref}\n        type={type}\n        size={size}\n        variant={variant}\n        {...rest}\n      />{\" \"}\n    </span>\n  ) : (\n    <AntdButton ref={ref} type={type} size={size} variant={variant} {...rest} />\n  );\n};\n\nexport const Button = forwardRef(ButtonInner) as (\n  props: ButtonProps & {\n    ref?: React.ForwardedRef<HTMLButtonElement | HTMLAnchorElement>;\n  }\n) => ReturnType<typeof ButtonInner>;\n"],"names":["ButtonInner","negativeMargin","type","size","variant","rest","ref","useNegativeMargin","cls","useCls","jsxs","jsx","AntdButton","Button","forwardRef"],"mappings":";;;;;;AAoBA,MAAMA,IAAc,CAClB,EAAE,gBAAAC,IAAiB,IAAM,MAAAC,GAAM,MAAAC,GAAM,SAAAC,GAAS,GAAGC,EAAK,GACtDC,MACG;AACG,QAAAC,IACJN,MACCG,MAAY,UACXA,MAAY,UACZF,KAAQ,UACRA,MAAS,SACPM,IAAMC,EAAO;AACnB,SAAOF,IACL,gBAAAG;AAAA,IAAC;AAAA,IAAA;AAAA,MACC,WAAWF;AAAA,QACT;AAAA,QACA;AAAA,QACA,iBAAiBL;AAAA,MACnB;AAAA,MAEA,UAAA;AAAA,QAAA,gBAAAQ;AAAA,UAACC;AAAA,UAAA;AAAA,YACC,KAAAN;AAAA,YACA,MAAAJ;AAAA,YACA,MAAAC;AAAA,YACA,SAAAC;AAAA,YACC,GAAGC;AAAA,UAAA;AAAA,QACN;AAAA,QAAG;AAAA,MAAA;AAAA,IAAA;AAAA,EAAA,sBAGJO,GAAW,EAAA,KAAAN,GAAU,MAAAJ,GAAY,MAAAC,GAAY,SAAAC,GAAmB,GAAGC,GAAM;AAE9E,GAEaQ,IAASC,EAAWd,CAAW;"}
+{"version":3,"file":"component.js","sources":["../../../src/components/Button/component.tsx"],"sourcesContent":["\"use client\";\n\nimport {\n  default as AntdButton,\n  type ButtonProps as AntdButtonProps,\n} from \"antd/es/button\";\nimport { forwardRef } from \"react\";\n\n// Import component-specific styles\nimport { useCls } from \"../utils\";\nimport \"./style.css\";\n\nexport interface ButtonProps extends AntdButtonProps {\n  /**\n   * If true, negative margin will be applied to the text and link buttons to make it align with content\n   * @default true\n   */\n  negativeMargin?: boolean;\n}\n\nconst ButtonInner = (\n  { negativeMargin = true, type, size, variant, icon, ...rest }: ButtonProps,\n  ref: React.Ref<HTMLButtonElement | HTMLAnchorElement>\n) => {\n  const useNegativeMargin =\n    negativeMargin &&\n    (variant === \"text\" ||\n      variant === \"link\" ||\n      type == \"text\" ||\n      type === \"link\");\n  const cls = useCls();\n  return useNegativeMargin ? (\n    <span\n      className={cls(\n        \"btn-wrapper\",\n        \"btn-negative-margin-wrapper\",\n        \"btn-wrapper-\" + size\n      )}\n    >\n      <AntdButton\n        ref={ref}\n        type={type}\n        size={size}\n        variant={variant}\n        icon={icon}\n        className={icon ? cls(\"btn-with-icon\") : \"\"}\n        {...rest}\n      />\n    </span>\n  ) : (\n    <AntdButton\n      ref={ref}\n      type={type}\n      size={size}\n      variant={variant}\n      icon={icon}\n      className={icon ? cls(\"btn-with-icon\") : \"\"}\n      {...rest}\n    />\n  );\n};\n\nexport const Button = forwardRef(ButtonInner) as (\n  props: ButtonProps & {\n    ref?: React.ForwardedRef<HTMLButtonElement | HTMLAnchorElement>;\n  }\n) => ReturnType<typeof ButtonInner>;\n"],"names":["ButtonInner","negativeMargin","type","size","variant","icon","rest","ref","useNegativeMargin","cls","useCls","jsx","AntdButton","Button","forwardRef"],"mappings":";;;;;;AAoBA,MAAMA,IAAc,CAClB,EAAE,gBAAAC,IAAiB,IAAM,MAAAC,GAAM,MAAAC,GAAM,SAAAC,GAAS,MAAAC,GAAM,GAAGC,EAAK,GAC5DC,MACG;AACG,QAAAC,IACJP,MACCG,MAAY,UACXA,MAAY,UACZF,KAAQ,UACRA,MAAS,SACPO,IAAMC,EAAO;AACnB,SAAOF,IACL,gBAAAG;AAAA,IAAC;AAAA,IAAA;AAAA,MACC,WAAWF;AAAA,QACT;AAAA,QACA;AAAA,QACA,iBAAiBN;AAAA,MACnB;AAAA,MAEA,UAAA,gBAAAQ;AAAA,QAACC;AAAA,QAAA;AAAA,UACC,KAAAL;AAAA,UACA,MAAAL;AAAA,UACA,MAAAC;AAAA,UACA,SAAAC;AAAA,UACA,MAAAC;AAAA,UACA,WAAWA,IAAOI,EAAI,eAAe,IAAI;AAAA,UACxC,GAAGH;AAAA,QAAA;AAAA,MAAA;AAAA,IACN;AAAA,EAAA,IAGF,gBAAAK;AAAA,IAACC;AAAA,IAAA;AAAA,MACC,KAAAL;AAAA,MACA,MAAAL;AAAA,MACA,MAAAC;AAAA,MACA,SAAAC;AAAA,MACA,MAAAC;AAAA,MACA,WAAWA,IAAOI,EAAI,eAAe,IAAI;AAAA,MACxC,GAAGH;AAAA,IAAA;AAAA,EACN;AAEJ,GAEaO,IAASC,EAAWd,CAAW;"}

package/dist/components/Button/style.css

@@ -1 +1 @@
-@layer components{span.ds-btn-icon{display:flex;align-items:center}.ds-btn-negative-margin-wrapper{display:inline-flex;flex-shrink:0}.ds-btn-negative-margin-wrapper,.ds-btn-negative-margin-wrapper.ds-btn-wrapper-lg{margin-inline:-1rem}.ds-btn-negative-margin-wrapper.ds-btn-wrapper-sm{margin-inline:-.5rem}.ds-btn-loading .ds-btn-loading-icon{position:absolute}.ds-btn-loading>span:not(.ds-btn-loading-icon){opacity:0}}
+@layer components{span.ds-btn-icon{display:flex;align-items:center}.ds-btn-negative-margin-wrapper{display:inline-flex;flex-shrink:0}.ds-btn-negative-margin-wrapper,.ds-btn-negative-margin-wrapper.ds-btn-wrapper-lg{margin-inline:-1rem}.ds-btn-negative-margin-wrapper.ds-btn-wrapper-sm{margin-inline:-.5rem}.ds-btn-loading:not(.ds-btn-with-icon) .ds-btn-loading-icon{position:absolute}.ds-btn-loading:not(.ds-btn-with-icon)>span:not(.ds-btn-loading-icon){opacity:0}}

package/dist/components/Nav/item.js

@@ -1,36 +1,37 @@
 "use client";
-import { jsxs as c, jsx as a, Fragment as l } from "react/jsx-runtime";
-import { forwardRef as d } from "react";
-import { useRender as p } from "@base-ui-components/react/use-render";
-import { useCls as f } from "../utils/antdUtils.js";
-import { clsx as v } from "../utils/cn.js";
-const x = ({
-  icon: r,
-  active: s = !1,
-  render: n,
-  onClick: N,
-  className: m,
-  children: o,
-  ...t
-}, i) => {
-  const e = f();
-  return p({
-    render: n ?? /* @__PURE__ */ a("button", { className: v(e("nav-item"), m) }),
-    ref: i,
+import { jsxs as p, jsx as a, Fragment as c } from "react/jsx-runtime";
+import f, { forwardRef as u, useMemo as x, isValidElement as N } from "react";
+import { useRender as v } from "@base-ui-components/react/use-render";
+import { useCls as h } from "../utils/antdUtils.js";
+import { clsx as I } from "../utils/cn.js";
+const R = (e) => N(e), j = ({
+  icon: e,
+  active: r = !1,
+  render: m,
+  onClick: w,
+  className: o,
+  children: l,
+  changeIconWeightOnActive: s = !0,
+  ...n
+}, d) => {
+  const t = h(), i = x(() => !s || !r || !R(e) ? e : f.cloneElement(e, { weight: "fill" }), [e, s, r]);
+  return v({
+    render: m ?? /* @__PURE__ */ a("button", { className: I(t("nav-item"), o) }),
+    ref: d,
     props: {
-      "data-active": s || void 0,
-      "aria-expanded": t["aria-expanded"],
+      "data-active": r || void 0,
+      "aria-expanded": n["aria-expanded"],
       className: void 0,
-      ...t,
-      children: /* @__PURE__ */ c(l, { children: [
-        /* @__PURE__ */ a("span", { className: e("nav-item-icon"), children: r }),
-        /* @__PURE__ */ a("span", { className: e("nav-item-content"), children: o })
+      ...n,
+      children: /* @__PURE__ */ p(c, { children: [
+        /* @__PURE__ */ a("span", { className: t("nav-item-icon"), children: i }),
+        /* @__PURE__ */ a("span", { className: t("nav-item-content"), children: l })
       ] })
     },
-    state: { active: s, icon: r }
+    state: { active: r, icon: e }
   });
-}, R = d(x);
+}, F = u(j);
 export {
-  R as NavItem
+  F as NavItem
 };
 //# sourceMappingURL=item.js.map

package/dist/components/Nav/item.js.map

@@ -1 +1 @@
-{"version":3,"file":"item.js","sources":["../../../src/components/Nav/item.tsx"],"sourcesContent":["\"use client\";\nimport React, { useState, type MouseEvent, forwardRef } from \"react\";\nimport { clsx, useCls } from \"../utils\";\nimport { Transition } from \"../Transition\";\nimport { useRender } from \"@base-ui-components/react/use-render\";\n\nexport interface NavItemProps\n  extends React.ButtonHTMLAttributes<HTMLButtonElement> {\n  icon?: React.ReactNode;\n  active?: boolean;\n  render?: useRender.RenderProp<{\n    active: boolean;\n    icon?: React.ReactNode;\n  }>;\n  size?: \"small\" | \"medium\" | \"large\";\n}\n\nconst NavItemImpl = <T extends HTMLElement>(\n  {\n    icon,\n    active = false,\n    render,\n    onClick,\n    className,\n    children,\n    ...rest\n  }: NavItemProps,\n  ref: React.Ref<T>\n) => {\n  const cls = useCls();\n\n  return useRender({\n    render: render ?? <button className={clsx(cls(\"nav-item\"), className)} />,\n    ref,\n    props: {\n      \"data-active\": active || undefined,\n      \"aria-expanded\": rest[\"aria-expanded\"],\n      className: undefined,\n      ...rest,\n      children: (\n        <>\n          <span className={cls(\"nav-item-icon\")}>{icon}</span>\n          {/* <Transition\n            starting=\"opacity-0 max-w-[0]\"\n            ending=\"opacity-0 max-w-[0]\"\n            className={cls(\"nav-item-transition\")}\n          > */}\n          <span className={cls(\"nav-item-content\")}>{children}</span>\n          {/* </Transition> */}\n        </>\n      ),\n    },\n    state: { active, icon },\n  });\n};\n\nconst NavItem = forwardRef(NavItemImpl) as <T extends HTMLElement>(\n  props: NavItemProps & { ref?: React.Ref<T> }\n) => ReturnType<typeof NavItemImpl>;\n\nexport { NavItem };\n"],"names":["NavItemImpl","icon","active","render","onClick","className","children","rest","ref","cls","useCls","useRender","jsx","clsx","jsxs","Fragment","NavItem","forwardRef"],"mappings":";;;;;;AAiBA,MAAMA,IAAc,CAClB;AAAA,EACE,MAAAC;AAAA,EACA,QAAAC,IAAS;AAAA,EACT,QAAAC;AAAA,EACA,SAAAC;AAAA,EACA,WAAAC;AAAA,EACA,UAAAC;AAAA,EACA,GAAGC;AACL,GACAC,MACG;AACH,QAAMC,IAAMC,EAAO;AAEnB,SAAOC,EAAU;AAAA,IACf,QAAQR,KAAU,gBAAAS,EAAC,UAAO,EAAA,WAAWC,EAAKJ,EAAI,UAAU,GAAGJ,CAAS,EAAG,CAAA;AAAA,IACvE,KAAAG;AAAA,IACA,OAAO;AAAA,MACL,eAAeN,KAAU;AAAA,MACzB,iBAAiBK,EAAK,eAAe;AAAA,MACrC,WAAW;AAAA,MACX,GAAGA;AAAA,MACH,UAEI,gBAAAO,EAAAC,GAAA,EAAA,UAAA;AAAA,QAAA,gBAAAH,EAAC,QAAK,EAAA,WAAWH,EAAI,eAAe,GAAI,UAAKR,GAAA;AAAA,0BAM5C,QAAK,EAAA,WAAWQ,EAAI,kBAAkB,GAAI,UAAAH,EAAS,CAAA;AAAA,MAAA,EAEtD,CAAA;AAAA,IAEJ;AAAA,IACA,OAAO,EAAE,QAAAJ,GAAQ,MAAAD,EAAK;AAAA,EAAA,CACvB;AACH,GAEMe,IAAUC,EAAWjB,CAAW;"}
+{"version":3,"file":"item.js","sources":["../../../src/components/Nav/item.tsx"],"sourcesContent":["\"use client\";\nimport React, {\n  useState,\n  type MouseEvent,\n  forwardRef,\n  isValidElement,\n  useMemo,\n} from \"react\";\nimport { clsx, useCls } from \"../utils\";\nimport { Transition } from \"../Transition\";\nimport { useRender } from \"@base-ui-components/react/use-render\";\n\nexport interface NavItemProps\n  extends React.ButtonHTMLAttributes<HTMLButtonElement> {\n  /**\n   * The icon to display in the nav item\n   */\n  icon?: React.ReactNode;\n  /**\n   * Whether the nav item is active\n   */\n  active?: boolean;\n  /**\n   * The render prop to render the nav item\n   */\n  render?: useRender.RenderProp<{\n    active: boolean;\n    icon?: React.ReactNode;\n  }>;\n  /**\n   * The size of the nav item\n   * @default \"medium\"\n   */\n  size?: \"small\" | \"medium\" | \"large\";\n  /**\n   * Whether to change the icon weight on active state\n   * @default true\n   */\n  changeIconWeightOnActive?: boolean;\n}\n\n// Define a type for elements that can have a weight prop\ntype ElementWithWeight = React.ReactElement<{ weight?: string }>;\n\n// Type guard to check if an element can accept a weight prop\nconst canHaveWeightProp = (el: React.ReactNode): el is ElementWithWeight => {\n  return isValidElement(el);\n};\n\nconst NavItemImpl = <T extends HTMLElement>(\n  {\n    icon,\n    active = false,\n    render,\n    onClick,\n    className,\n    children,\n    changeIconWeightOnActive = true,\n    ...rest\n  }: NavItemProps,\n  ref: React.Ref<T>\n) => {\n  const cls = useCls();\n\n  // Apply weight prop only if the element can accept it\n  const renderedIcon = useMemo(() => {\n    if (!changeIconWeightOnActive || !active || !canHaveWeightProp(icon)) {\n      return icon;\n    }\n    return React.cloneElement(icon, { weight: \"fill\" });\n  }, [icon, changeIconWeightOnActive, active]);\n\n  return useRender({\n    render: render ?? <button className={clsx(cls(\"nav-item\"), className)} />,\n    ref,\n    props: {\n      \"data-active\": active || undefined,\n      \"aria-expanded\": rest[\"aria-expanded\"],\n      className: undefined,\n      ...rest,\n      children: (\n        <>\n          <span className={cls(\"nav-item-icon\")}>{renderedIcon}</span>\n          {/* <Transition\n            starting=\"opacity-0 max-w-[0]\"\n            ending=\"opacity-0 max-w-[0]\"\n            className={cls(\"nav-item-transition\")}\n          > */}\n          <span className={cls(\"nav-item-content\")}>{children}</span>\n          {/* </Transition> */}\n        </>\n      ),\n    },\n    state: { active, icon },\n  });\n};\n\nconst NavItem = forwardRef(NavItemImpl) as <T extends HTMLElement>(\n  props: NavItemProps & { ref?: React.Ref<T> }\n) => ReturnType<typeof NavItemImpl>;\n\nexport { NavItem };\n"],"names":["canHaveWeightProp","el","isValidElement","NavItemImpl","icon","active","render","onClick","className","children","changeIconWeightOnActive","rest","ref","cls","useCls","renderedIcon","useMemo","React","useRender","jsx","clsx","jsxs","Fragment","NavItem","forwardRef"],"mappings":";;;;;;AA6CA,MAAMA,IAAoB,CAACC,MAClBC,EAAeD,CAAE,GAGpBE,IAAc,CAClB;AAAA,EACE,MAAAC;AAAA,EACA,QAAAC,IAAS;AAAA,EACT,QAAAC;AAAA,EACA,SAAAC;AAAA,EACA,WAAAC;AAAA,EACA,UAAAC;AAAA,EACA,0BAAAC,IAA2B;AAAA,EAC3B,GAAGC;AACL,GACAC,MACG;AACH,QAAMC,IAAMC,EAAO,GAGbC,IAAeC,EAAQ,MACvB,CAACN,KAA4B,CAACL,KAAU,CAACL,EAAkBI,CAAI,IAC1DA,IAEFa,EAAM,aAAab,GAAM,EAAE,QAAQ,QAAQ,GACjD,CAACA,GAAMM,GAA0BL,CAAM,CAAC;AAE3C,SAAOa,EAAU;AAAA,IACf,QAAQZ,KAAU,gBAAAa,EAAC,UAAO,EAAA,WAAWC,EAAKP,EAAI,UAAU,GAAGL,CAAS,EAAG,CAAA;AAAA,IACvE,KAAAI;AAAA,IACA,OAAO;AAAA,MACL,eAAeP,KAAU;AAAA,MACzB,iBAAiBM,EAAK,eAAe;AAAA,MACrC,WAAW;AAAA,MACX,GAAGA;AAAA,MACH,UAEI,gBAAAU,EAAAC,GAAA,EAAA,UAAA;AAAA,QAAA,gBAAAH,EAAC,QAAK,EAAA,WAAWN,EAAI,eAAe,GAAI,UAAaE,GAAA;AAAA,0BAMpD,QAAK,EAAA,WAAWF,EAAI,kBAAkB,GAAI,UAAAJ,EAAS,CAAA;AAAA,MAAA,EAEtD,CAAA;AAAA,IAEJ;AAAA,IACA,OAAO,EAAE,QAAAJ,GAAQ,MAAAD,EAAK;AAAA,EAAA,CACvB;AACH,GAEMmB,IAAUC,EAAWrB,CAAW;"}

package/dist/components/Stack/StackChild.js

@@ -1,5 +1,5 @@
 "use client";
-import { jsx as r } from "react/jsx-runtime";
+import { jsx as c } from "react/jsx-runtime";
 import b, { forwardRef as g } from "react";
 import { useRender as R } from "@base-ui-components/react/use-render";
 import { mergeProps as S } from "@base-ui-components/react/merge-props";
@@ -8,54 +8,54 @@ import { useCls as v } from "../utils/antdUtils.js";
 import { cn as w } from "../utils/cn.js";
 const E = g(
   ({
-    flex: e,
-    grow: l = !1,
-    shrink: c = !1,
+    flex: s,
+    grow: m = !1,
+    shrink: f = !1,
     children: t,
-    style: f,
-    stack: m = !1,
+    style: i,
+    stack: n = !1,
     // stack props
-    hug: i = !1,
-    align: n = "flex-start",
-    justify: p = "flex-start",
-    vertical: d = !1,
-    gap: k = 0,
-    wrap: u = !1,
-    className: x,
-    ...h
-  }, y) => {
-    const s = v(), C = {
-      hug: i,
-      align: n,
-      justify: p,
-      vertical: d,
-      gap: k,
-      wrap: u
+    hug: p = !1,
+    align: d = "flex-start",
+    justify: k = "flex-start",
+    vertical: u = !1,
+    gap: x = 0,
+    wrap: h = !1,
+    className: y,
+    ...o
+  }, a) => {
+    const e = v(), C = {
+      hug: p,
+      align: d,
+      justify: k,
+      vertical: u,
+      gap: x,
+      wrap: h
     };
-    let o = "";
-    typeof e == "boolean" && (o = s(e ? "stack-child-flex-1" : "stack-child-flex-0"));
-    const a = w(
-      s("stack-child"),
-      l && s("stack-child-grow"),
-      c && s("stack-child-shrink"),
-      o,
-      x
+    let l = "";
+    typeof s == "boolean" && (l = e(s ? "stack-child-flex-1" : "stack-child-flex-0"));
+    const r = w(
+      e("stack-child"),
+      m && e("stack-child-grow"),
+      f && e("stack-child-shrink"),
+      l,
+      y
     ), N = R({
-      render: () => b.isValidElement(t) ? t : /* @__PURE__ */ r("div", { children: t }),
-      ref: y,
+      render: () => b.isValidElement(t) ? t : /* @__PURE__ */ c("div", { children: t }),
+      ref: a,
       props: S(
         {
-          className: a,
+          className: r,
           style: {
-            ...f,
-            flex: typeof e == "string" || typeof e == "number" ? e : void 0
+            ...i,
+            flex: typeof s == "string" || typeof s == "number" ? s : void 0
           },
-          ...h
+          ...o
         },
         {}
       )
     });
-    return m ? /* @__PURE__ */ r(V, { ...C, className: a, children: t }) : N;
+    return n ? /* @__PURE__ */ c(V, { ...C, ref: a, className: r, ...o, children: t }) : N;
   }
 );
 E.displayName = "StackChild";

package/dist/components/Stack/StackChild.js.map

@@ -1 +1 @@
-{"version":3,"file":"StackChild.js","sources":["../../../src/components/Stack/StackChild.tsx"],"sourcesContent":["\"use client\";\nimport React, { forwardRef } from \"react\";\nimport { cn, useCls } from \"../utils\";\nimport { useRender } from \"@base-ui-components/react/use-render\";\nimport { mergeProps } from \"@base-ui-components/react/merge-props\";\nimport { Stack, StackProps } from \"./Stack\";\n\nexport interface StackChildProps extends StackProps {\n  /**\n   * CSS flex property value (e.g. \"1\", \"1 0 auto\", \"0 1 auto\")\n   * When boolean: true = 1, false = 0\n   * @default undefined\n   */\n  flex?: string | number | boolean;\n\n  /**\n   * Whether this child should grow to fill available space\n   * @default false\n   */\n  grow?: boolean;\n\n  /**\n   * Whether this child should shrink if necessary\n   * @default false\n   */\n  shrink?: boolean;\n\n  /**\n   * Children of the stack child\n   */\n  children?: React.ReactNode;\n  /**\n   * Whether to render the child with a stack wrapper\n   * @default false\n   */\n  stack?: boolean;\n}\n\nexport const StackChild = forwardRef<HTMLDivElement, StackChildProps>(\n  (\n    {\n      flex,\n      grow = false,\n      shrink = false,\n      children,\n      style,\n      stack = false,\n      // stack props\n      hug = false,\n      align = \"flex-start\",\n      justify = \"flex-start\",\n      vertical = false,\n      gap = 0,\n      wrap = false,\n      className,\n      ...rest\n    },\n    ref\n  ) => {\n    const cls = useCls();\n    const stackProps = {\n      hug,\n      align,\n      justify,\n      vertical,\n      gap,\n      wrap,\n    };\n\n    // Determine flex class based on flex prop type\n    let flexClass = \"\";\n    if (typeof flex === \"boolean\") {\n      flexClass = flex ? cls(\"stack-child-flex-1\") : cls(\"stack-child-flex-0\");\n    }\n\n    // Calculate the combined className\n    const combinedClassName = cn(\n      cls(\"stack-child\"),\n      grow && cls(\"stack-child-grow\"),\n      shrink && cls(\"stack-child-shrink\"),\n      flexClass,\n      className\n    );\n\n    // Calculate the flex style value\n    const flexValue =\n      typeof flex === \"string\" || typeof flex === \"number\" ? flex : undefined;\n\n    // Use useRender to apply props directly to the child without creating a wrapper\n    const renderedElement = useRender({\n      render: () =>\n        React.isValidElement(children) ? children : <div>{children}</div>,\n      ref,\n      props: mergeProps<\"div\">(\n        {\n          className: combinedClassName,\n          style: {\n            ...style,\n            flex: flexValue,\n          },\n          ...rest,\n        },\n        {}\n      ),\n    });\n\n    return stack ? (\n      <Stack {...stackProps} className={combinedClassName}>\n        {children}\n      </Stack>\n    ) : (\n      renderedElement\n    );\n  }\n);\n\nStackChild.displayName = \"StackChild\";\n"],"names":["StackChild","forwardRef","flex","grow","shrink","children","style","stack","hug","align","justify","vertical","gap","wrap","className","rest","ref","cls","useCls","stackProps","flexClass","combinedClassName","cn","renderedElement","useRender","React","jsx","mergeProps","Stack"],"mappings":";;;;;;;;AAsCO,MAAMA,IAAaC;AAAA,EACxB,CACE;AAAA,IACE,MAAAC;AAAA,IACA,MAAAC,IAAO;AAAA,IACP,QAAAC,IAAS;AAAA,IACT,UAAAC;AAAA,IACA,OAAAC;AAAA,IACA,OAAAC,IAAQ;AAAA;AAAA,IAER,KAAAC,IAAM;AAAA,IACN,OAAAC,IAAQ;AAAA,IACR,SAAAC,IAAU;AAAA,IACV,UAAAC,IAAW;AAAA,IACX,KAAAC,IAAM;AAAA,IACN,MAAAC,IAAO;AAAA,IACP,WAAAC;AAAA,IACA,GAAGC;AAAA,KAELC,MACG;AACH,UAAMC,IAAMC,EAAO,GACbC,IAAa;AAAA,MACjB,KAAAX;AAAA,MACA,OAAAC;AAAA,MACA,SAAAC;AAAA,MACA,UAAAC;AAAA,MACA,KAAAC;AAAA,MACA,MAAAC;AAAA,IACF;AAGA,QAAIO,IAAY;AACZ,IAAA,OAAOlB,KAAS,cAClBkB,IAAmBH,EAAPf,IAAW,uBAA4B,oBAAR;AAI7C,UAAMmB,IAAoBC;AAAA,MACxBL,EAAI,aAAa;AAAA,MACjBd,KAAQc,EAAI,kBAAkB;AAAA,MAC9Bb,KAAUa,EAAI,oBAAoB;AAAA,MAClCG;AAAA,MACAN;AAAA,IACF,GAOMS,IAAkBC,EAAU;AAAA,MAChC,QAAQ,MACNC,EAAM,eAAepB,CAAQ,IAAIA,IAAY,gBAAAqB,EAAA,OAAA,EAAK,UAAArB,GAAS;AAAA,MAC7D,KAAAW;AAAA,MACA,OAAOW;AAAA,QACL;AAAA,UACE,WAAWN;AAAA,UACX,OAAO;AAAA,YACL,GAAGf;AAAA,YACH,MAZN,OAAOJ,KAAS,YAAY,OAAOA,KAAS,WAAWA,IAAO;AAAA,UAa1D;AAAA,UACA,GAAGa;AAAA,QACL;AAAA,QACA,CAAA;AAAA,MAAC;AAAA,IACH,CACD;AAEM,WAAAR,sBACJqB,GAAO,EAAA,GAAGT,GAAY,WAAWE,GAC/B,UAAAhB,EACH,CAAA,IAEAkB;AAAA,EAAA;AAGN;AAEAvB,EAAW,cAAc;"}
+{"version":3,"file":"StackChild.js","sources":["../../../src/components/Stack/StackChild.tsx"],"sourcesContent":["\"use client\";\nimport React, { forwardRef } from \"react\";\nimport { cn, useCls } from \"../utils\";\nimport { useRender } from \"@base-ui-components/react/use-render\";\nimport { mergeProps } from \"@base-ui-components/react/merge-props\";\nimport { Stack, StackProps } from \"./Stack\";\n\nexport interface StackChildProps extends StackProps {\n  /**\n   * CSS flex property value (e.g. \"1\", \"1 0 auto\", \"0 1 auto\")\n   * When boolean: true = 1, false = 0\n   * @default undefined\n   */\n  flex?: string | number | boolean;\n\n  /**\n   * Whether this child should grow to fill available space\n   * @default false\n   */\n  grow?: boolean;\n\n  /**\n   * Whether this child should shrink if necessary\n   * @default false\n   */\n  shrink?: boolean;\n\n  /**\n   * Children of the stack child\n   */\n  children?: React.ReactNode;\n  /**\n   * Whether to render the child with a stack wrapper\n   * @default false\n   */\n  stack?: boolean;\n}\n\nexport const StackChild = forwardRef<HTMLDivElement, StackChildProps>(\n  (\n    {\n      flex,\n      grow = false,\n      shrink = false,\n      children,\n      style,\n      stack = false,\n      // stack props\n      hug = false,\n      align = \"flex-start\",\n      justify = \"flex-start\",\n      vertical = false,\n      gap = 0,\n      wrap = false,\n      className,\n      ...rest\n    },\n    ref\n  ) => {\n    const cls = useCls();\n    const stackProps = {\n      hug,\n      align,\n      justify,\n      vertical,\n      gap,\n      wrap,\n    };\n\n    // Determine flex class based on flex prop type\n    let flexClass = \"\";\n    if (typeof flex === \"boolean\") {\n      flexClass = flex ? cls(\"stack-child-flex-1\") : cls(\"stack-child-flex-0\");\n    }\n\n    // Calculate the combined className\n    const combinedClassName = cn(\n      cls(\"stack-child\"),\n      grow && cls(\"stack-child-grow\"),\n      shrink && cls(\"stack-child-shrink\"),\n      flexClass,\n      className\n    );\n\n    // Calculate the flex style value\n    const flexValue =\n      typeof flex === \"string\" || typeof flex === \"number\" ? flex : undefined;\n\n    // Use useRender to apply props directly to the child without creating a wrapper\n    const renderedElement = useRender({\n      render: () =>\n        React.isValidElement(children) ? children : <div>{children}</div>,\n      ref,\n      props: mergeProps<\"div\">(\n        {\n          className: combinedClassName,\n          style: {\n            ...style,\n            flex: flexValue,\n          },\n          ...rest,\n        },\n        {}\n      ),\n    });\n\n    return stack ? (\n      <Stack {...stackProps} ref={ref} className={combinedClassName} {...rest}>\n        {children}\n      </Stack>\n    ) : (\n      renderedElement\n    );\n  }\n);\n\nStackChild.displayName = \"StackChild\";\n"],"names":["StackChild","forwardRef","flex","grow","shrink","children","style","stack","hug","align","justify","vertical","gap","wrap","className","rest","ref","cls","useCls","stackProps","flexClass","combinedClassName","cn","renderedElement","useRender","React","jsx","mergeProps","Stack"],"mappings":";;;;;;;;AAsCO,MAAMA,IAAaC;AAAA,EACxB,CACE;AAAA,IACE,MAAAC;AAAA,IACA,MAAAC,IAAO;AAAA,IACP,QAAAC,IAAS;AAAA,IACT,UAAAC;AAAA,IACA,OAAAC;AAAA,IACA,OAAAC,IAAQ;AAAA;AAAA,IAER,KAAAC,IAAM;AAAA,IACN,OAAAC,IAAQ;AAAA,IACR,SAAAC,IAAU;AAAA,IACV,UAAAC,IAAW;AAAA,IACX,KAAAC,IAAM;AAAA,IACN,MAAAC,IAAO;AAAA,IACP,WAAAC;AAAA,IACA,GAAGC;AAAA,KAELC,MACG;AACH,UAAMC,IAAMC,EAAO,GACbC,IAAa;AAAA,MACjB,KAAAX;AAAA,MACA,OAAAC;AAAA,MACA,SAAAC;AAAA,MACA,UAAAC;AAAA,MACA,KAAAC;AAAA,MACA,MAAAC;AAAA,IACF;AAGA,QAAIO,IAAY;AACZ,IAAA,OAAOlB,KAAS,cAClBkB,IAAmBH,EAAPf,IAAW,uBAA4B,oBAAR;AAI7C,UAAMmB,IAAoBC;AAAA,MACxBL,EAAI,aAAa;AAAA,MACjBd,KAAQc,EAAI,kBAAkB;AAAA,MAC9Bb,KAAUa,EAAI,oBAAoB;AAAA,MAClCG;AAAA,MACAN;AAAA,IACF,GAOMS,IAAkBC,EAAU;AAAA,MAChC,QAAQ,MACNC,EAAM,eAAepB,CAAQ,IAAIA,IAAY,gBAAAqB,EAAA,OAAA,EAAK,UAAArB,GAAS;AAAA,MAC7D,KAAAW;AAAA,MACA,OAAOW;AAAA,QACL;AAAA,UACE,WAAWN;AAAA,UACX,OAAO;AAAA,YACL,GAAGf;AAAA,YACH,MAZN,OAAOJ,KAAS,YAAY,OAAOA,KAAS,WAAWA,IAAO;AAAA,UAa1D;AAAA,UACA,GAAGa;AAAA,QACL;AAAA,QACA,CAAA;AAAA,MAAC;AAAA,IACH,CACD;AAEM,WAAAR,IACJ,gBAAAmB,EAAAE,GAAA,EAAO,GAAGT,GAAY,KAAAH,GAAU,WAAWK,GAAoB,GAAGN,GAChE,UAAAV,EAAA,CACH,IAEAkB;AAAA,EAAA;AAGN;AAEAvB,EAAW,cAAc;"}

package/dist/components/Toast/component.js

@@ -4,11 +4,11 @@ import { X as g, CircleNotch as w, CheckCircle as C, XCircle as T, WarningCircle
 import { Toast as t } from "@base-ui-components/react";
 import { toastManager as a } from "./function.js";
 import { useEffect as v, useCallback as x } from "react";
-import { Button as B } from "../Button/component.js";
-import { Modal as I } from "../Modal/index.js";
+import { Button as P } from "../Button/component.js";
+import { Modal as B } from "../Modal/index.js";
 import './style.css';/* empty css          */
-import { isTracebackError as M } from "../utils/isTracebackError.js";
-import { CodeBlock as P } from "../CodeBlock/component.js";
+import { isTracebackError as I } from "../utils/isTracebackError.js";
+import { CodeBlock as M } from "../CodeBlock/component.js";
 import { useCls as f } from "../utils/antdUtils.js";
 import { IconButton as j } from "../IconButton/component.js";
 import { clsx as E } from "../utils/cn.js";
@@ -22,13 +22,13 @@ function u({
     error: /* @__PURE__ */ r(T, { weight: "fill" }),
     success: /* @__PURE__ */ r(C, { weight: "fill" }),
     progress: /* @__PURE__ */ r(w, {})
-  }, i = ((l = e.data) == null ? void 0 : l.type) || "info", s = M(e == null ? void 0 : e.description);
+  }, i = ((l = e.data) == null ? void 0 : l.type) || "info", s = I(e == null ? void 0 : e.description);
   v(() => {
     s && a.update(e.id, { timeout: 0 });
   }, [s, e.id]);
   const h = x(
     (N) => {
-      const { children: m, className: d, ...p } = N;
+      const { children: d, className: m, ...p } = N;
       return s ? /* @__PURE__ */ c(
         "div",
         {
@@ -36,7 +36,7 @@ function u({
           className: o(
             "toast-description",
             s ? "toast-description-traceback" : "",
-            d
+            m
           ),
           children: [
             /* @__PURE__ */ c("p", { children: [
@@ -45,13 +45,13 @@ function u({
               "Please contact us with error details for support."
             ] }),
             /* @__PURE__ */ r("p", { children: /* @__PURE__ */ r(
-              B,
+              P,
               {
                 size: "small",
                 onClick: () => {
-                  I.open({
+                  B.open({
                     title: "Error details",
-                    content: /* @__PURE__ */ r(P, { children: m }),
+                    content: /* @__PURE__ */ r(M, { children: d }),
                     hideOkButton: !0
                   }), a.close(e.id);
                 },
@@ -60,7 +60,7 @@ function u({
             ) })
           ]
         }
-      ) : /* @__PURE__ */ r("p", { ...p, className: o("toast-description", d), children: m });
+      ) : /* @__PURE__ */ r("p", { ...p, className: o("toast-description", m), children: d });
     },
     [s, o, e.id]
   );
@@ -74,14 +74,14 @@ function u({
       t.Close,
       {
         className: o("toast-close"),
-        render: /* @__PURE__ */ r(j, { size: "small", children: /* @__PURE__ */ r(g, {}) })
+        render: /* @__PURE__ */ r("span", { children: /* @__PURE__ */ r(j, { size: "small", children: /* @__PURE__ */ r(g, {}) }) })
       }
     )
   ] });
 }
 function y({ className: e }) {
   const { toasts: o } = t.useToastManager(), n = f();
-  return /* @__PURE__ */ r(t.Viewport, { className: E(n("toast-viewport"), e), children: o.map((i) => /* @__PURE__ */ r(u, { toast: i }, i.id)) });
+  return /* @__PURE__ */ r(t.Portal, { children: /* @__PURE__ */ r(t.Viewport, { className: E(n("toast-viewport"), e), children: o.map((i) => /* @__PURE__ */ r(u, { toast: i }, i.id)) }) });
 }
 function z(e) {
   return /* @__PURE__ */ r(t.Provider, { toastManager: a, ...e });

package/dist/components/Toast/component.js.map

@@ -1 +1 @@
-{"version":3,"file":"component.js","sources":["../../../src/components/Toast/component.tsx"],"sourcesContent":["\"use client\";\nimport { useCls, clsx } from \"../utils\";\nimport {\n  CheckCircle,\n  CircleNotch,\n  Info,\n  WarningCircle,\n  X,\n  XCircle,\n} from \"@bioturing/assets\";\nimport { Toast as BaseToast } from \"@base-ui-components/react\";\nimport { IconButton } from \"../IconButton\";\nimport { ToastData } from \"./types\";\nimport { toastManager } from \"./function\";\nimport { isTracebackError, type GenericHTMLProps } from \"../utils\";\nimport { useCallback, useEffect } from \"react\";\nimport { Button } from \"../Button/component\";\nimport { Modal } from \"../Modal\";\nimport { CodeBlock } from \"../CodeBlock\";\n\n// Import component-specific styles\nimport \"./style.css\";\n\nfunction InnerToast({\n  toast,\n}: {\n  toast: BaseToast.Root.ToastObject<ToastData>;\n}) {\n  const cls = useCls();\n  const toastIconMap = {\n    info: <Info weight=\"fill\" />,\n    warning: <WarningCircle weight=\"fill\" />,\n    error: <XCircle weight=\"fill\" />,\n    success: <CheckCircle weight=\"fill\" />,\n    progress: <CircleNotch />,\n  };\n  const type = toast.data?.type || \"info\";\n  const isTraceback = isTracebackError(toast?.description);\n\n  // Update manager timeout for traceback to disable auto-dismiss\n  useEffect(() => {\n    if (isTraceback) {\n      toastManager.update(toast.id, { timeout: 0 });\n    }\n  }, [isTraceback, toast.id]);\n  // console.log(toast);\n  const renderDescription: BaseToast.Description.Props[\"render\"] = useCallback(\n    (props: GenericHTMLProps) => {\n      const { children, className, ...rest } = props;\n      if (isTraceback) {\n        return (\n          <div\n            {...rest}\n            className={cls(\n              \"toast-description\",\n              isTraceback ? \"toast-description-traceback\" : \"\",\n              className\n            )}\n          >\n            <p>\n              An unexpected error occurred.\n              <br />\n              Please contact us with error details for support.\n            </p>\n            <p>\n              <Button\n                size=\"small\"\n                onClick={() => {\n                  Modal.open({\n                    title: \"Error details\",\n                    content: <CodeBlock>{children}</CodeBlock>,\n                    hideOkButton: true,\n                  });\n                  toastManager.close(toast.id);\n                }}\n              >\n                View error details\n              </Button>\n            </p>\n          </div>\n        );\n      }\n      return (\n        <p {...rest} className={cls(\"toast-description\", className)}>\n          {children}\n        </p>\n      );\n    },\n    [isTraceback, cls, toast.id]\n  );\n  return (\n    <BaseToast.Root toast={toast} className={cls(\"toast\")}>\n      <span className={cls(\"toast-icon-wrap\")}>\n        <span className={cls(\"toast-icon\", `toast-icon-${type}`)}>\n          {toastIconMap[type]}\n        </span>\n      </span>\n      <div className={cls(\"toast-content\")}>\n        <BaseToast.Title className={cls(\"toast-title\")} />\n        <BaseToast.Description render={renderDescription} />\n      </div>\n      <BaseToast.Close\n        className={cls(\"toast-close\")}\n        render={\n          <IconButton size=\"small\">\n            <X />\n          </IconButton>\n        }\n      ></BaseToast.Close>\n    </BaseToast.Root>\n  );\n}\n\nfunction ToastList({ className }: { className?: string }) {\n  const { toasts } = BaseToast.useToastManager();\n  const cls = useCls();\n\n  return (\n    <BaseToast.Viewport className={clsx(cls(\"toast-viewport\"), className)}>\n      {toasts.map((toast) => (\n        <InnerToast key={toast.id} toast={toast} />\n      ))}\n    </BaseToast.Viewport>\n  );\n}\n\nfunction ToastProvider(props: BaseToast.Provider.Props) {\n  return <BaseToast.Provider toastManager={toastManager} {...props} />;\n}\n\nexport const Toast = Object.assign(InnerToast, {\n  List: ToastList,\n  Provider: ToastProvider,\n});\n"],"names":["InnerToast","toast","cls","useCls","toastIconMap","jsx","Info","WarningCircle","XCircle","CheckCircle","CircleNotch","type","_a","isTraceback","isTracebackError","useEffect","toastManager","renderDescription","useCallback","props","children","className","rest","jsxs","Button","Modal","CodeBlock","BaseToast","IconButton","X","ToastList","toasts","clsx","ToastProvider","Toast"],"mappings":"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"}
+{"version":3,"file":"component.js","sources":["../../../src/components/Toast/component.tsx"],"sourcesContent":["\"use client\";\nimport { useCls, clsx } from \"../utils\";\nimport {\n  CheckCircle,\n  CircleNotch,\n  Info,\n  WarningCircle,\n  X,\n  XCircle,\n} from \"@bioturing/assets\";\nimport { Toast as BaseToast } from \"@base-ui-components/react\";\nimport { IconButton } from \"../IconButton\";\nimport { ToastData } from \"./types\";\nimport { toastManager } from \"./function\";\nimport { isTracebackError, type GenericHTMLProps } from \"../utils\";\nimport { useCallback, useEffect } from \"react\";\nimport { Button } from \"../Button/component\";\nimport { Modal } from \"../Modal\";\nimport { CodeBlock } from \"../CodeBlock\";\n\n// Import component-specific styles\nimport \"./style.css\";\n\nfunction InnerToast({\n  toast,\n}: {\n  toast: BaseToast.Root.ToastObject<ToastData>;\n}) {\n  const cls = useCls();\n  const toastIconMap = {\n    info: <Info weight=\"fill\" />,\n    warning: <WarningCircle weight=\"fill\" />,\n    error: <XCircle weight=\"fill\" />,\n    success: <CheckCircle weight=\"fill\" />,\n    progress: <CircleNotch />,\n  };\n  const type = toast.data?.type || \"info\";\n  const isTraceback = isTracebackError(toast?.description);\n\n  // Update manager timeout for traceback to disable auto-dismiss\n  useEffect(() => {\n    if (isTraceback) {\n      toastManager.update(toast.id, { timeout: 0 });\n    }\n  }, [isTraceback, toast.id]);\n  // console.log(toast);\n  const renderDescription: BaseToast.Description.Props[\"render\"] = useCallback(\n    (props: GenericHTMLProps) => {\n      const { children, className, ...rest } = props;\n      if (isTraceback) {\n        return (\n          <div\n            {...rest}\n            className={cls(\n              \"toast-description\",\n              isTraceback ? \"toast-description-traceback\" : \"\",\n              className\n            )}\n          >\n            <p>\n              An unexpected error occurred.\n              <br />\n              Please contact us with error details for support.\n            </p>\n            <p>\n              <Button\n                size=\"small\"\n                onClick={() => {\n                  Modal.open({\n                    title: \"Error details\",\n                    content: <CodeBlock>{children}</CodeBlock>,\n                    hideOkButton: true,\n                  });\n                  toastManager.close(toast.id);\n                }}\n              >\n                View error details\n              </Button>\n            </p>\n          </div>\n        );\n      }\n      return (\n        <p {...rest} className={cls(\"toast-description\", className)}>\n          {children}\n        </p>\n      );\n    },\n    [isTraceback, cls, toast.id]\n  );\n  return (\n    <BaseToast.Root toast={toast} className={cls(\"toast\")}>\n      <span className={cls(\"toast-icon-wrap\")}>\n        <span className={cls(\"toast-icon\", `toast-icon-${type}`)}>\n          {toastIconMap[type]}\n        </span>\n      </span>\n      <div className={cls(\"toast-content\")}>\n        <BaseToast.Title className={cls(\"toast-title\")} />\n        <BaseToast.Description render={renderDescription} />\n      </div>\n      <BaseToast.Close\n        className={cls(\"toast-close\")}\n        render={\n          <span>\n            <IconButton size=\"small\">\n              <X />\n            </IconButton>\n          </span>\n        }\n      ></BaseToast.Close>\n    </BaseToast.Root>\n  );\n}\n\nfunction ToastList({ className }: { className?: string }) {\n  const { toasts } = BaseToast.useToastManager();\n  const cls = useCls();\n\n  return (\n    <BaseToast.Portal>\n      <BaseToast.Viewport className={clsx(cls(\"toast-viewport\"), className)}>\n        {toasts.map((toast) => (\n          <InnerToast key={toast.id} toast={toast} />\n        ))}\n      </BaseToast.Viewport>\n    </BaseToast.Portal>\n  );\n}\n\nfunction ToastProvider(props: BaseToast.Provider.Props) {\n  return <BaseToast.Provider toastManager={toastManager} {...props} />;\n}\n\nexport const Toast = Object.assign(InnerToast, {\n  List: ToastList,\n  Provider: ToastProvider,\n});\n"],"names":["InnerToast","toast","cls","useCls","toastIconMap","jsx","Info","WarningCircle","XCircle","CheckCircle","CircleNotch","type","_a","isTraceback","isTracebackError","useEffect","toastManager","renderDescription","useCallback","props","children","className","rest","jsxs","Button","Modal","CodeBlock","BaseToast","IconButton","X","ToastList","toasts","clsx","ToastProvider","Toast"],"mappings":"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"}

package/dist/components/Toast/style.css

@@ -1 +1 @@
-@layer components{.ds-toast-viewport{position:fixed;width:100%;max-width:30rem;margin:0 auto;bottom:2rem;left:50%;transform:translate(-50%);top:auto;z-index:2001;display:flex;justify-content:center}.ds-toast{--gap: .5rem;--offset-y: calc( var(--toast-offset-y) * -1 + (var(--toast-index) * var(--gap) * -1) + var(--toast-swipe-movement-y) );font-family:var(--font-sans);position:absolute;box-sizing:border-box;background:var(--ds-color-bg-elevated);color:var(--ds-color-text);padding:.75rem 1rem;max-width:100%;display:inline-flex;gap:var(--gap);box-shadow:var(--ds-box-shadow-secondary);background-clip:padding-box;border-radius:.5rem;bottom:0;margin-right:0;-webkit-user-select:none;user-select:none;transition:transform .5s cubic-bezier(.22,1,.36,1),opacity .5s;cursor:default;z-index:calc(1000 - var(--toast-index));transform:translate(var(--toast-swipe-movement-x)) translateY(calc(var(--toast-swipe-movement-y) + (var(--toast-index) * -20%))) scale(calc(1 - (var(--toast-index) * .1)))}.ds-toast:after{top:100%}.ds-toast[data-expanded]{transform:translate(var(--toast-swipe-movement-x)) translateY(var(--offset-y))}.ds-toast[data-starting-style],.ds-toast[data-ending-style]:not([data-limited]){transform:translateY(150%)}.ds-toast[data-ending-style]{opacity:0}.ds-toast[data-ending-style][data-swipe-direction=up]{transform:translateY(calc(var(--toast-swipe-movement-y) - 150%))}.ds-toast[data-ending-style][data-swipe-direction=left]{transform:translate(calc(var(--toast-swipe-movement-x) - 150%)) translateY(var(--offset-y))}.ds-toast[data-ending-style][data-swipe-direction=right]{transform:translate(calc(var(--toast-swipe-movement-x) + 150%)) translateY(var(--offset-y))}.ds-toast[data-ending-style][data-swipe-direction=down]{transform:translateY(calc(var(--toast-swipe-movement-y) + 150%))}.ds-toast:after{content:"";position:absolute;width:100%;left:0;height:calc(var(--gap) + 1px)}.ds-toast-content{display:flex;flex:1;flex-direction:column;gap:2}.ds-toast-title{font-size:var(--text-ds-h5);font-weight:var(--text-ds-h5--font-weight);line-height:var(--text-ds-h5--line-height)}.ds-toast-description{font-size:var(--ds-font-size);line-height:var(--ds-line-height)}.ds-toast-description-traceback p:not(:first-child){margin-top:.5rem}.ds-toast-icon-wrap{width:1.25rem;font-size:1.25rem;display:block;flex:0}.ds-toast-icon{width:1.25rem;height:1.25rem;display:block}.ds-toast-icon.ds-toast-icon-info{color:var(--ds-color-primary)}.ds-toast-icon.ds-toast-icon-success{color:var(--ds-color-success)}.ds-toast-icon.ds-toast-icon-warning{color:var(--ds-color-warning)}.ds-toast-icon.ds-toast-icon-error{color:var(--ds-color-error)}.ds-toast-icon.ds-toast-icon-progress{color:var(--ds-color-primary);animation:var(--ds-animate-spin)}}
+@layer components{.ds-toast-viewport{position:fixed;width:100%;max-width:30rem;margin:0 auto;bottom:2rem;left:50%;transform:translate(-50%);top:auto;z-index:2001;display:flex;justify-content:center}.ds-toast{--gap: .5rem;--offset-y: calc( var(--toast-offset-y) * -1 + (var(--toast-index) * var(--gap) * -1) + var(--toast-swipe-movement-y) );font-family:var(--font-sans);position:absolute;box-sizing:border-box;background:var(--ds-color-bg-elevated);color:var(--ds-color-text);padding:.75rem 1rem;max-width:100%;display:inline-flex;gap:var(--gap);box-shadow:var(--ds-box-shadow-secondary);background-clip:padding-box;border-radius:.5rem;bottom:0;margin-right:0;-webkit-user-select:none;user-select:none;transition:transform .5s cubic-bezier(.22,1,.36,1),opacity .5s;cursor:default;z-index:calc(1000 - var(--toast-index));transform:translate(var(--toast-swipe-movement-x)) translateY(calc(var(--toast-swipe-movement-y) + (var(--toast-index) * -20%))) scale(calc(1 - (var(--toast-index) * .1)))}.ds-toast:after{top:100%}.ds-toast[data-expanded]{transform:translate(var(--toast-swipe-movement-x)) translateY(var(--offset-y))}.ds-toast[data-starting-style],.ds-toast[data-ending-style]:not([data-limited]){transform:translateY(150%)}.ds-toast[data-ending-style]{opacity:0}.ds-toast[data-ending-style][data-swipe-direction=up]{transform:translateY(calc(var(--toast-swipe-movement-y) - 150%))}.ds-toast[data-ending-style][data-swipe-direction=left]{transform:translate(calc(var(--toast-swipe-movement-x) - 150%)) translateY(var(--offset-y))}.ds-toast[data-ending-style][data-swipe-direction=right]{transform:translate(calc(var(--toast-swipe-movement-x) + 150%)) translateY(var(--offset-y))}.ds-toast[data-ending-style][data-swipe-direction=down]{transform:translateY(calc(var(--toast-swipe-movement-y) + 150%))}.ds-toast:after{content:"";position:absolute;width:100%;left:0;height:calc(var(--gap) + 1px)}.ds-toast-content{display:flex;flex:1;flex-direction:column;gap:2}.ds-toast-title{font-size:var(--text-ds-h5);font-weight:var(--text-ds-h5--font-weight);line-height:var(--text-ds-h5--line-height)}.ds-toast-description{font-size:var(--ds-font-size);line-height:var(--ds-line-height)}.ds-toast-description:last-child{margin-bottom:0}.ds-toast-description-traceback p:not(:first-child){margin-top:.5rem}.ds-toast-icon-wrap{width:1.25rem;font-size:1.25rem;display:block;flex:0}.ds-toast-icon{width:1.25rem;height:1.25rem;display:block}.ds-toast-icon.ds-toast-icon-info{color:var(--ds-color-primary)}.ds-toast-icon.ds-toast-icon-success{color:var(--ds-color-success)}.ds-toast-icon.ds-toast-icon-warning{color:var(--ds-color-warning)}.ds-toast-icon.ds-toast-icon-error{color:var(--ds-color-error)}.ds-toast-icon.ds-toast-icon-progress{color:var(--ds-color-primary);animation:var(--ds-animate-spin)}.ds-toast-close{margin-top:.125rem;display:flex}}

package/dist/components/hooks/useCSSVariables.js

@@ -0,0 +1,12 @@
+"use client";
+const u = (t) => {
+  const s = Array.isArray(t) ? t : [t], n = window.getComputedStyle(document.body);
+  return s.reduce((r, e) => {
+    const o = e.startsWith("--") ? e : `--${e}`;
+    return r[o] = n.getPropertyValue(o), r;
+  }, {});
+};
+export {
+  u as useCSSVariables
+};
+//# sourceMappingURL=useCSSVariables.js.map

package/dist/components/hooks/useCSSVariables.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"useCSSVariables.js","sources":["../../../src/components/hooks/useCSSVariables.ts"],"sourcesContent":["\"use client\";\n\n/**\n * Get CSS variables from the document\n * @param variables CSS variable names\n * @returns CSS variable values\n */\nexport const useCSSVariables = (variables: string | string[]) => {\n  const variablesList = Array.isArray(variables) ? variables : [variables];\n  const el = window.getComputedStyle(document.body);\n  return variablesList.reduce((acc, variable) => {\n    const variableName = variable.startsWith(\"--\") ? variable : `--${variable}`;\n    acc[variableName] = el.getPropertyValue(variableName);\n    return acc;\n  }, {} as Record<string, string>);\n};\n"],"names":["useCSSVariables","variables","variablesList","el","acc","variable","variableName"],"mappings":";AAOa,MAAAA,IAAkB,CAACC,MAAiC;AAC/D,QAAMC,IAAgB,MAAM,QAAQD,CAAS,IAAIA,IAAY,CAACA,CAAS,GACjEE,IAAK,OAAO,iBAAiB,SAAS,IAAI;AAChD,SAAOD,EAAc,OAAO,CAACE,GAAKC,MAAa;AAC7C,UAAMC,IAAeD,EAAS,WAAW,IAAI,IAAIA,IAAW,KAAKA,CAAQ;AACzE,WAAAD,EAAIE,CAAY,IAAIH,EAAG,iBAAiBG,CAAY,GAC7CF;AAAA,EACT,GAAG,EAA4B;AACjC;"}

package/dist/components/hooks/useCharts.js.map

@@ -1 +1 @@
-{"version":3,"file":"useCharts.js","sources":["../../../src/components/hooks/useCharts.ts"],"sourcesContent":["import { useDS } from \"../DSRoot/context\";\nimport { getColorsByTheme, getTokensByTheme } from \"../../tokens/utils\";\nimport {\n  chartColorTokens,\n  categoricalChartColorTokens,\n} from \"../../tokens/charts/palettes/cloudscape\";\n\nimport {\n  SequentialPaletteName,\n  CategoricalPaletteName,\n  CATEGORICAL_PALETTE_NAMES,\n  getCategoricalChartColors,\n  getSequentialChartColors,\n  SEQUENTIAL_PALETTE_NAMES,\n  Theme,\n} from \"../../tokens\";\n\nexport interface UseChartsOptions {\n  /**\n   * The palette to use for the charts.\n   * @default \"cloudscape\"\n   */\n  palette?: SequentialPaletteName | CategoricalPaletteName;\n  /**\n   * The theme to use for the charts.\n   * @default \"light\"\n   */\n  theme?: Theme;\n}\n\n/**\n * Get chart colors and axis configuration based on the current theme.\n * @param options\n * @returns\n */\nexport const useCharts = (\n  options: UseChartsOptions = {\n    palette: \"cloudscape\",\n    theme: undefined,\n  }\n) => {\n  const { theme: themeContext } = useDS();\n  const theme = options.theme || themeContext;\n  const themedChartColorTokens = getTokensByTheme(chartColorTokens, theme);\n  const axisLineColor = themedChartColorTokens[\"colorChartsLineAxis\"];\n  const splitLineColor = themedChartColorTokens[\"colorChartsLineGrid\"];\n  const axisLabelColor = themedChartColorTokens[\"colorChartsLabelAxis\"];\n\n  const palette = options.palette;\n\n  const chartColors = CATEGORICAL_PALETTE_NAMES.includes(\n    palette as CategoricalPaletteName\n  )\n    ? getCategoricalChartColors(palette as CategoricalPaletteName, theme)\n    : SEQUENTIAL_PALETTE_NAMES.includes(palette as SequentialPaletteName)\n    ? getSequentialChartColors(palette as SequentialPaletteName, theme)\n    : [];\n  const echartsAxisConfig = {\n    axisLine: { lineStyle: { color: axisLineColor } },\n    splitLine: { lineStyle: { color: splitLineColor } },\n    axisLabel: {\n      color: axisLabelColor,\n      fontFamily: \"InterVariable, Inter, Helvetica, Arial, sans-serif\",\n    },\n  };\n\n  return {\n    axisLineColor,\n    splitLineColor,\n    axisLabelColor,\n    chartColors,\n    echartsAxisConfig,\n  };\n};\n"],"names":["useCharts","options","themeContext","useDS","theme","themedChartColorTokens","getTokensByTheme","chartColorTokens","axisLineColor","splitLineColor","axisLabelColor","palette","chartColors","CATEGORICAL_PALETTE_NAMES","getCategoricalChartColors","SEQUENTIAL_PALETTE_NAMES","getSequentialChartColors"],"mappings":";;;;AAmCa,MAAAA,IAAY,CACvBC,IAA4B;AAAA,EAC1B,SAAS;AAAA,EACT,OAAO;AACT,MACG;AACH,QAAM,EAAE,OAAOC,EAAa,IAAIC,EAAM,GAChCC,IAAQH,EAAQ,SAASC,GACzBG,IAAyBC,EAAiBC,GAAkBH,CAAK,GACjEI,IAAgBH,EAAuB,qBACvCI,IAAiBJ,EAAuB,qBACxCK,IAAiBL,EAAuB,sBAExCM,IAAUV,EAAQ,SAElBW,IAAcC,EAA0B;AAAA,IAC5CF;AAAA,EAEE,IAAAG,EAA0BH,GAAmCP,CAAK,IAClEW,EAAyB,SAASJ,CAAgC,IAClEK,EAAyBL,GAAkCP,CAAK,IAChE,CAAC;AAUE,SAAA;AAAA,IACL,eAAAI;AAAA,IACA,gBAAAC;AAAA,IACA,gBAAAC;AAAA,IACA,aAAAE;AAAA,IACA,mBAdwB;AAAA,MACxB,UAAU,EAAE,WAAW,EAAE,OAAOJ,IAAgB;AAAA,MAChD,WAAW,EAAE,WAAW,EAAE,OAAOC,IAAiB;AAAA,MAClD,WAAW;AAAA,QACT,OAAOC;AAAA,QACP,YAAY;AAAA,MAAA;AAAA,IAEhB;AAAA,EAQA;AACF;"}
+{"version":3,"file":"useCharts.js","sources":["../../../src/components/hooks/useCharts.ts"],"sourcesContent":["import { useDS } from \"../DSRoot/context\";\nimport { getTokensByTheme } from \"../../tokens/utils\";\nimport { chartColorTokens } from \"../../tokens/charts/palettes/cloudscape\";\n\nimport {\n  SequentialPaletteName,\n  CategoricalPaletteName,\n  CATEGORICAL_PALETTE_NAMES,\n  getCategoricalChartColors,\n  getSequentialChartColors,\n  SEQUENTIAL_PALETTE_NAMES,\n  Theme,\n} from \"../../tokens\";\n\nexport interface UseChartsOptions {\n  /**\n   * The palette to use for the charts.\n   * @default \"cloudscape\"\n   */\n  palette?: SequentialPaletteName | CategoricalPaletteName;\n  /**\n   * The theme to use for the charts.\n   * @default \"light\"\n   */\n  theme?: Theme;\n}\n\n/**\n * Get chart colors and axis configuration based on the current theme.\n * @param options\n * @returns\n */\nexport const useCharts = (\n  options: UseChartsOptions = {\n    palette: \"cloudscape\",\n    theme: undefined,\n  }\n) => {\n  const { theme: themeContext } = useDS();\n  const theme = options.theme || themeContext;\n  const themedChartColorTokens = getTokensByTheme(chartColorTokens, theme);\n  const axisLineColor = themedChartColorTokens[\"colorChartsLineAxis\"];\n  const splitLineColor = themedChartColorTokens[\"colorChartsLineGrid\"];\n  const axisLabelColor = themedChartColorTokens[\"colorChartsLabelAxis\"];\n\n  const palette = options.palette;\n\n  const chartColors = CATEGORICAL_PALETTE_NAMES.includes(\n    palette as CategoricalPaletteName\n  )\n    ? getCategoricalChartColors(palette as CategoricalPaletteName, theme)\n    : SEQUENTIAL_PALETTE_NAMES.includes(palette as SequentialPaletteName)\n    ? getSequentialChartColors(palette as SequentialPaletteName, theme)\n    : [];\n  const echartsAxisConfig = {\n    axisLine: { lineStyle: { color: axisLineColor } },\n    splitLine: { lineStyle: { color: splitLineColor } },\n    axisLabel: {\n      color: axisLabelColor,\n      fontFamily: \"InterVariable, Inter, Helvetica, Arial, sans-serif\",\n    },\n  };\n\n  return {\n    axisLineColor,\n    splitLineColor,\n    axisLabelColor,\n    chartColors,\n    echartsAxisConfig,\n  };\n};\n"],"names":["useCharts","options","themeContext","useDS","theme","themedChartColorTokens","getTokensByTheme","chartColorTokens","axisLineColor","splitLineColor","axisLabelColor","palette","chartColors","CATEGORICAL_PALETTE_NAMES","getCategoricalChartColors","SEQUENTIAL_PALETTE_NAMES","getSequentialChartColors"],"mappings":";;;;AAgCa,MAAAA,IAAY,CACvBC,IAA4B;AAAA,EAC1B,SAAS;AAAA,EACT,OAAO;AACT,MACG;AACH,QAAM,EAAE,OAAOC,EAAa,IAAIC,EAAM,GAChCC,IAAQH,EAAQ,SAASC,GACzBG,IAAyBC,EAAiBC,GAAkBH,CAAK,GACjEI,IAAgBH,EAAuB,qBACvCI,IAAiBJ,EAAuB,qBACxCK,IAAiBL,EAAuB,sBAExCM,IAAUV,EAAQ,SAElBW,IAAcC,EAA0B;AAAA,IAC5CF;AAAA,EAEE,IAAAG,EAA0BH,GAAmCP,CAAK,IAClEW,EAAyB,SAASJ,CAAgC,IAClEK,EAAyBL,GAAkCP,CAAK,IAChE,CAAC;AAUE,SAAA;AAAA,IACL,eAAAI;AAAA,IACA,gBAAAC;AAAA,IACA,gBAAAC;AAAA,IACA,aAAAE;AAAA,IACA,mBAdwB;AAAA,MACxB,UAAU,EAAE,WAAW,EAAE,OAAOJ,IAAgB;AAAA,MAChD,WAAW,EAAE,WAAW,EAAE,OAAOC,IAAiB;AAAA,MAClD,WAAW;AAAA,QACT,OAAOC;AAAA,QACP,YAAY;AAAA,MAAA;AAAA,IAEhB;AAAA,EAQA;AACF;"}

package/dist/index.d.ts

@@ -339,7 +339,7 @@ export declare const Button: (props: ButtonProps & {
     ref?: React.ForwardedRef<HTMLButtonElement | HTMLAnchorElement>;
 }) => ReturnType<typeof ButtonInner>;
 
-declare const ButtonInner: ({ negativeMargin, type, size, variant, ...rest }: ButtonProps, ref: React.Ref<HTMLButtonElement | HTMLAnchorElement>) => JSX.Element;
+declare const ButtonInner: ({ negativeMargin, type, size, variant, icon, ...rest }: ButtonProps, ref: React.Ref<HTMLButtonElement | HTMLAnchorElement>) => JSX.Element;
 
 export declare interface ButtonProps extends ButtonProps_2 {
     /**
@@ -1973,7 +1973,7 @@ export declare function moveTypingCursorToEnd(contentEditableElement: HTMLElemen
 export declare const Nav: {
     Item: <T extends HTMLElement>(props: NavItemProps & {
         ref?: React.Ref<T>;
-    }) => ReturnType<(<T_1 extends HTMLElement>({ icon, active, render, onClick, className, children, ...rest }: NavItemProps, ref: React.Ref<T_1>) => null)>;
+    }) => ReturnType<(<T_1 extends HTMLElement>({ icon, active, render, onClick, className, children, changeIconWeightOnActive, ...rest }: NavItemProps, ref: React.Ref<T_1>) => null)>;
     Heading: ({ children, className, ...rest }: NavHeadingProps) => JSX.Element;
     Group: ForwardRefExoticComponent<NavGroupProps & RefAttributes<HTMLDivElement>>;
 };
@@ -1995,13 +1995,31 @@ export declare interface NavHeadingProps extends default_2.HTMLAttributes<HTMLHe
 }
 
 export declare interface NavItemProps extends default_2.ButtonHTMLAttributes<HTMLButtonElement> {
+    /**
+     * The icon to display in the nav item
+     */
     icon?: default_2.ReactNode;
+    /**
+     * Whether the nav item is active
+     */
     active?: boolean;
+    /**
+     * The render prop to render the nav item
+     */
     render?: useRender.RenderProp<{
         active: boolean;
         icon?: default_2.ReactNode;
     }>;
+    /**
+     * The size of the nav item
+     * @default "medium"
+     */
     size?: "small" | "medium" | "large";
+    /**
+     * Whether to change the icon weight on active state
+     * @default true
+     */
+    changeIconWeightOnActive?: boolean;
 }
 
 export { notification }
@@ -3190,6 +3208,13 @@ T | undefined,
 (value: T | ((prev: T | undefined) => T), ...args: K | []) => void
 ];
 
+/**
+ * Get CSS variables from the document
+ * @param variables CSS variable names
+ * @returns CSS variable values
+ */
+export declare const useCSSVariables: (variables: string | string[]) => Record<string, string>;
+
 export declare const useDS: () => {
     theme: "light" | "dark";
 };

package/dist/index.js

@@ -1,5 +1,5 @@
 import { componentMetadata as r, getComponentsByCategory as t } from "./metadata.js";
-import { Affix as p, Alert as m, Anchor as s, App as f, AutoComplete as l, Avatar as n, BackTop as x, Calendar as i, Card as C, Carousel as c, Cascader as T, Col as u, ColorPicker as d, ConfigProvider as g, DatePicker as S, Descriptions as h, Divider as A, Drawer as E, Dropdown as k, Flex as P, FloatButton as R, Grid as D, InputNumber as b, Layout as y, List as B, Mentions as L, Menu as v, Pagination as I, Popconfirm as M, Progress as F, QRCode as N, Rate as U, Result as w, Row as _, Skeleton as O, Space as W, Statistic as q, Steps as G, Tabs as K, TimePicker as Q, Timeline as V, Transfer as H, TreeSelect as j, Typography as z, Watermark as J, message as X, notification as Y, theme as Z, unstableSetRender as $, version as oo } from "antd";
+import { Affix as p, Alert as m, Anchor as s, App as f, AutoComplete as l, Avatar as n, BackTop as x, Calendar as i, Card as C, Carousel as c, Cascader as T, Col as u, ColorPicker as d, ConfigProvider as g, DatePicker as S, Descriptions as h, Divider as A, Drawer as E, Dropdown as k, Flex as P, FloatButton as R, Grid as b, InputNumber as D, Layout as y, List as B, Mentions as L, Menu as v, Pagination as I, Popconfirm as M, Progress as F, QRCode as N, Rate as U, Result as w, Row as _, Skeleton as O, Space as W, Statistic as q, Steps as G, Tabs as V, TimePicker as K, Timeline as Q, Transfer as H, TreeSelect as j, Typography as z, Watermark as J, message as X, notification as Y, theme as Z, unstableSetRender as $, version as oo } from "antd";
 import { Select as ro } from "./components/Select/component.js";
 import { Modal as ao } from "./components/Modal/index.js";
 import { IconButton as mo } from "./components/IconButton/component.js";
@@ -11,14 +11,14 @@ import { Tag as uo } from "./components/Tag/component.js";
 import { ThemeProvider as So } from "./components/ThemeProvider/component.js";
 import { Split as Ao, Splitter as Eo } from "./components/Splitter/component.js";
 import { Truncate as Po } from "./components/Truncate/component.js";
-import { DropdownMenu as Do } from "./components/DropdownMenu/component.js";
+import { DropdownMenu as bo } from "./components/DropdownMenu/component.js";
 import { clsx as yo, cn as Bo, cx as Lo } from "./components/utils/cn.js";
 import { reactNodeToString as Io } from "./components/utils/reactToString.js";
 import { isTracebackError as Fo } from "./components/utils/isTracebackError.js";
 import { isValidHexColor as Uo } from "./components/utils/colors.js";
 import { parseAntdPlacement as _o, useAntdCssVarClassname as Oo, useCls as Wo, useGetPrefixCls as qo } from "./components/utils/antdUtils.js";
-import { WithAntdTokens as Ko } from "./components/utils/WithAntdTokens.js";
-import { changeThemeWithoutTransition as Vo } from "./components/utils/theme.js";
+import { WithAntdTokens as Vo } from "./components/utils/WithAntdTokens.js";
+import { changeThemeWithoutTransition as Qo } from "./components/utils/theme.js";
 import { moveTypingCursorToEnd as jo } from "./components/utils/selectionRange.js";
 import { Transition as Jo } from "./components/Transition/component.js";
 import { DefaultUpload as Yo, Upload as Zo } from "./components/Upload/component.js";
@@ -34,7 +34,7 @@ import { Tree as de } from "./components/Tree/components.js";
 import { Spin as Se } from "./components/Spin/component.js";
 import { Empty as Ae, EmptyIcon as Ee } from "./components/Empty/component.js";
 import { Form as Pe } from "./components/Form/component.js";
-import { Field as De } from "./components/Field/component.js";
+import { Field as be } from "./components/Field/component.js";
 import { Tour as ye } from "./components/Tour/component.js";
 import { Toast as Le } from "./components/Toast/component.js";
 import { toast as Ie, toastManager as Me } from "./components/Toast/function.js";
@@ -42,8 +42,8 @@ import { VerticalCollapsiblePanel as Ne } from "./components/VerticalCollapsible
 import { PopupPanel as we } from "./components/PopupPanel/component.js";
 import { CodeBlock as Oe } from "./components/CodeBlock/component.js";
 import { StackChild as qe } from "./components/Stack/StackChild.js";
-import { Stack as Ke } from "./components/Stack/index.js";
-import { Collapse as Ve } from "./components/Collapse/component.js";
+import { Stack as Ve } from "./components/Stack/index.js";
+import { Collapse as Qe } from "./components/Collapse/component.js";
 import { Input as je } from "./components/Input/component.js";
 import { Badge as Je, InternalBadge as Xe } from "./components/Badge/component.js";
 import { Radio as Ze } from "./components/Radio/component.js";
@@ -56,15 +56,16 @@ import { Nav as ir } from "./components/Nav/index.js";
 import { useForm as cr, useWatch as Tr } from "antd/es/form/Form";
 import { useBreakpoint as dr, useMessage as gr, useModal as Sr, useToken as hr } from "./components/hooks/antd.js";
 import { default as Er } from "antd/es/app/useApp";
-import { useAnimationsFinished as Pr, useEnhancedEffect as Rr, useEventCallback as Dr, useLatestRef as br } from "./components/hooks/base-ui.js";
+import { useAnimationsFinished as Pr, useEnhancedEffect as Rr, useEventCallback as br, useLatestRef as Dr } from "./components/hooks/base-ui.js";
 import { useControlledState as Br } from "./components/hooks/useControlledState.js";
 import { useCharts as vr } from "./components/hooks/useCharts.js";
-import { antdColorTokens as Mr, darkTheme as Fr, lightTheme as Nr } from "./tokens/and-theme/tokens.js";
-import { categoricalChartColorKeys as wr, categoricalChartColorTokens as _r, categoricalChartsColors as Or, chartColorTokens as Wr, rawChartColorTokens as qr } from "./tokens/charts/palettes/cloudscape.js";
-import { COLORBREWER as Kr } from "./tokens/charts/palettes/colorbrewer.js";
-import { tab10 as Vr, tab20 as Hr, tab20b as jr, tab20c as zr } from "./tokens/charts/palettes/tableau.js";
-import { CATEGORICAL_PALETTES as Xr, CATEGORICAL_PALETTE_NAMES as Yr, SEQUENTIAL_PALETTES as Zr, SEQUENTIAL_PALETTE_NAMES as $r, getAllCategoricalChartColors as ot, getAllSequentialChartColors as et, getCategoricalChartColors as rt, getSequentialChartColors as tt } from "./tokens/charts/palettes/index.js";
-import { getColorsByTheme as pt, getTokensByTheme as mt, resolveColorTokens as st } from "./tokens/utils.js";
+import { useCSSVariables as Mr } from "./components/hooks/useCSSVariables.js";
+import { antdColorTokens as Nr, darkTheme as Ur, lightTheme as wr } from "./tokens/and-theme/tokens.js";
+import { categoricalChartColorKeys as Or, categoricalChartColorTokens as Wr, categoricalChartsColors as qr, chartColorTokens as Gr, rawChartColorTokens as Vr } from "./tokens/charts/palettes/cloudscape.js";
+import { COLORBREWER as Qr } from "./tokens/charts/palettes/colorbrewer.js";
+import { tab10 as jr, tab20 as zr, tab20b as Jr, tab20c as Xr } from "./tokens/charts/palettes/tableau.js";
+import { CATEGORICAL_PALETTES as Zr, CATEGORICAL_PALETTE_NAMES as $r, SEQUENTIAL_PALETTES as ot, SEQUENTIAL_PALETTE_NAMES as et, getAllCategoricalChartColors as rt, getAllSequentialChartColors as tt, getCategoricalChartColors as at, getSequentialChartColors as pt } from "./tokens/charts/palettes/index.js";
+import { getColorsByTheme as st, getTokensByTheme as ft, resolveColorTokens as lt } from "./tokens/utils.js";
 export {
   p as Affix,
   m as Alert,
@@ -76,9 +77,9 @@ export {
   Je as Badge,
   ne as Breadcrumb,
   or as Button,
-  Xr as CATEGORICAL_PALETTES,
-  Yr as CATEGORICAL_PALETTE_NAMES,
-  Kr as COLORBREWER,
+  Zr as CATEGORICAL_PALETTES,
+  $r as CATEGORICAL_PALETTE_NAMES,
+  Qr as COLORBREWER,
   i as Calendar,
   C as Card,
   c as Carousel,
@@ -86,7 +87,7 @@ export {
   no as Checkbox,
   Oe as CodeBlock,
   u as Col,
-  Ve as Collapse,
+  Qe as Collapse,
   d as ColorPicker,
   nr as ColorSelect,
   g as ConfigProvider,
@@ -100,17 +101,17 @@ export {
   fr as DragDropRoot,
   E as Drawer,
   k as Dropdown,
-  Do as DropdownMenu,
+  bo as DropdownMenu,
   Ae as Empty,
   Ee as EmptyIcon,
-  De as Field,
+  be as Field,
   P as Flex,
   R as FloatButton,
   Pe as Form,
-  D as Grid,
+  b as Grid,
   mo as IconButton,
   je as Input,
-  b as InputNumber,
+  D as InputNumber,
   Xe as InternalBadge,
   y as Layout,
   B as List,
@@ -128,8 +129,8 @@ export {
   U as Rate,
   w as Result,
   _ as Row,
-  Zr as SEQUENTIAL_PALETTES,
-  $r as SEQUENTIAL_PALETTE_NAMES,
+  ot as SEQUENTIAL_PALETTES,
+  et as SEQUENTIAL_PALETTE_NAMES,
   re as ScrollArea,
   io as Segmented,
   ro as Select,
@@ -139,17 +140,17 @@ export {
   Se as Spin,
   Ao as Split,
   Eo as Splitter,
-  Ke as Stack,
+  Ve as Stack,
   qe as StackChild,
   q as Statistic,
   G as Steps,
   fo as Switch,
   co as Table,
-  K as Tabs,
+  V as Tabs,
   uo as Tag,
   So as ThemeProvider,
-  Q as TimePicker,
-  V as Timeline,
+  K as TimePicker,
+  Q as Timeline,
   Le as Toast,
   fe as Tooltip,
   ye as Tour,
@@ -162,41 +163,41 @@ export {
   Zo as Upload,
   Ne as VerticalCollapsiblePanel,
   J as Watermark,
-  Ko as WithAntdTokens,
-  Mr as antdColorTokens,
-  wr as categoricalChartColorKeys,
-  _r as categoricalChartColorTokens,
-  Or as categoricalChartsColors,
-  Vo as changeThemeWithoutTransition,
-  Wr as chartColorTokens,
+  Vo as WithAntdTokens,
+  Nr as antdColorTokens,
+  Or as categoricalChartColorKeys,
+  Wr as categoricalChartColorTokens,
+  qr as categoricalChartsColors,
+  Qo as changeThemeWithoutTransition,
+  Gr as chartColorTokens,
   yo as clsx,
   Bo as cn,
   r as componentMetadata,
   Lo as cx,
-  Fr as darkTheme,
-  ot as getAllCategoricalChartColors,
-  et as getAllSequentialChartColors,
-  rt as getCategoricalChartColors,
-  pt as getColorsByTheme,
+  Ur as darkTheme,
+  rt as getAllCategoricalChartColors,
+  tt as getAllSequentialChartColors,
+  at as getCategoricalChartColors,
+  st as getColorsByTheme,
   t as getComponentsByCategory,
-  tt as getSequentialChartColors,
-  mt as getTokensByTheme,
+  pt as getSequentialChartColors,
+  ft as getTokensByTheme,
   ce as getUniqueKeysFromOriginals,
   Fo as isTracebackError,
   Uo as isValidHexColor,
-  Nr as lightTheme,
+  wr as lightTheme,
   X as message,
   jo as moveTypingCursorToEnd,
   Y as notification,
   _o as parseAntdPlacement,
   Te as processTreeData,
-  qr as rawChartColorTokens,
+  Vr as rawChartColorTokens,
   Io as reactNodeToString,
-  st as resolveColorTokens,
-  Vr as tab10,
-  Hr as tab20,
-  jr as tab20b,
-  zr as tab20c,
+  lt as resolveColorTokens,
+  jr as tab10,
+  zr as tab20,
+  Jr as tab20b,
+  Xr as tab20c,
   Z as theme,
   Ie as toast,
   Me as toastManager,
@@ -205,15 +206,16 @@ export {
   Oo as useAntdCssVarClassname,
   Er as useApp,
   dr as useBreakpoint,
+  Mr as useCSSVariables,
   vr as useCharts,
   Wo as useCls,
   Br as useControlledState,
   pr as useDS,
   Rr as useEnhancedEffect,
-  Dr as useEventCallback,
+  br as useEventCallback,
   cr as useForm,
   qo as useGetPrefixCls,
-  br as useLatestRef,
+  Dr as useLatestRef,
   gr as useMessage,
   Sr as useModal,
   hr as useToken,

package/dist/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
+{"version":3,"file":"index.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}

package/dist/tokens/and-theme/tokens.js

@@ -3,7 +3,7 @@ const o = {
   // Text colors
   colorText: {
     light: "rgba(0, 0, 0, 0.88)",
-    dark: "rgba(255, 255, 255, 0.85)"
+    dark: "rgba(255, 255, 255, 0.88)"
   },
   colorTextSecondary: {
     light: "rgba(0, 0, 0, 0.65)",
@@ -234,38 +234,38 @@ const o = {
   },
   // Icon colors
   colorIcon: {
-    light: "rgba(0, 0, 0, 0.58)",
+    light: "rgba(0, 0, 0, 0.50)",
     dark: "rgba(255, 255, 255, 0.58)"
   },
   colorIconHover: {
-    light: "rgba(0, 0, 0, 0.88)",
+    light: "rgba(0, 0, 0, 0.80)",
     dark: "rgba(255, 255, 255, 0.88)"
   },
+  colorBgBase: {
+    light: "#FFFFFF",
+    dark: "#111113"
+  },
   // Background colors
   colorBgContainer: {
     light: "#FFFFFF",
-    dark: "#26262C"
+    dark: "#242429"
   },
   colorBgElevated: {
     light: "#FFFFFF",
-    dark: "#2F2F37"
+    dark: "#2B2B31"
   },
   colorBgLayout: {
-    light: "#F5F5F5",
-    dark: "#1A1A1E"
+    light: "#F4F4F5",
+    dark: "#18181B"
   },
   colorBgSpotlight: {
     light: "rgba(0, 0, 0, 0.85)",
-    dark: "#505D5D"
+    dark: "#484851"
   },
   colorBgMask: {
     light: "rgba(0, 0, 0, 0.45)",
     dark: "rgba(0, 0, 0, 0.45)"
   },
-  colorBgBase: {
-    light: "#FFFFFF",
-    dark: "#13131A"
-  },
   // Control
   controlOutline: {
     light: "rgba(0, 0, 0, 0.12)",

package/dist/tokens/and-theme/tokens.js.map

@@ -1 +1 @@
-{"version":3,"file":"tokens.js","sources":["../../../src/tokens/and-theme/tokens.ts"],"sourcesContent":["import { type ThemeConfig } from \"antd\";\nimport { getTokensByTheme } from \"../utils\";\nimport { ColorTokens } from \"../types\";\n\n// Convert Figma variables to Ant Design tokens with light/dark variants\nexport const antdColorTokens: ColorTokens = {\n  // Text colors\n  colorText: {\n    light: \"rgba(0, 0, 0, 0.88)\",\n    dark: \"rgba(255, 255, 255, 0.85)\",\n  },\n  colorTextSecondary: {\n    light: \"rgba(0, 0, 0, 0.65)\",\n    dark: \"rgba(255, 255, 255, 0.65)\",\n  },\n  colorTextTertiary: {\n    light: \"rgba(0, 0, 0, 0.45)\",\n    dark: \"rgba(255, 255, 255, 0.45)\",\n  },\n  colorTextQuaternary: {\n    light: \"rgba(0, 0, 0, 0.25)\",\n    dark: \"rgba(255, 255, 255, 0.25)\",\n  },\n  // Primary colors\n  colorPrimary: {\n    light: \"#175CD3\",\n    dark: \"#2E90FA\",\n  },\n  colorPrimaryBg: {\n    light: \"#E9F2FF\",\n    dark: \"#152137\",\n  },\n  colorPrimaryBgHover: {\n    light: \"#D1E9FF\",\n    dark: \"#112545\",\n  },\n  colorPrimaryBorder: {\n    light: \"#84CAFF\",\n    dark: \"#1C3959\",\n  },\n  colorPrimaryBorderHover: {\n    light: \"#53B1FD\",\n    dark: \"#204C7C\",\n  },\n  colorPrimaryHover: {\n    light: \"#1570EF\",\n    dark: \"#50A0E8\",\n  },\n  colorPrimaryActive: {\n    light: \"#175CD3\",\n    dark: \"#2565AB\",\n  },\n  colorPrimaryTextHover: {\n    light: \"#1570EF\",\n    dark: \"#50A0E8\",\n  },\n  colorPrimaryTextActive: {\n    light: \"#175CD3\",\n    dark: \"#2565AB\",\n  },\n\n  // Info colors\n  colorInfo: {\n    light: \"#175CD3\",\n    dark: \"#2E90FA\",\n  },\n  colorInfoBg: {\n    light: \"#E9F2FF\",\n    dark: \"#152137\",\n  },\n  colorInfoBgHover: {\n    light: \"#D1E9FF\",\n    dark: \"#112545\",\n  },\n  colorInfoBorder: {\n    light: \"#84CAFF\",\n    dark: \"#1C3959\",\n  },\n  colorInfoBorderHover: {\n    light: \"#53B1FD\",\n    dark: \"#204C7C\",\n  },\n  colorInfoHover: {\n    light: \"#1570EF\",\n    dark: \"#50A0E8\",\n  },\n  colorInfoActive: {\n    light: \"#175CD3\",\n    dark: \"#2565AB\",\n  },\n  colorInfoTextHover: {\n    light: \"#1570EF\",\n    dark: \"#50A0E8\",\n  },\n  colorInfoTextActive: {\n    light: \"#175CD3\",\n    dark: \"#2565AB\",\n  },\n\n  // Success colors\n  colorSuccess: {\n    light: \"#4CB200\",\n    dark: \"#389E0D\",\n  },\n  colorSuccessBg: {\n    light: \"#F6FFF0\",\n    dark: \"#162100\",\n  },\n  colorSuccessBgHover: {\n    light: \"#D9F7BE\",\n    dark: \"#1D2B00\",\n  },\n  colorSuccessBorder: {\n    light: \"#B7EB8F\",\n    dark: \"#274916\",\n  },\n  colorSuccessBorderHover: {\n    light: \"#95DE64\",\n    dark: \"#306317\",\n  },\n  colorSuccessHover: {\n    light: \"#73D13D\",\n    dark: \"#52C41A\",\n  },\n  colorSuccessActive: {\n    light: \"#389E0D\",\n    dark: \"#237804\",\n  },\n  colorSuccessTextHover: {\n    light: \"#237804\",\n    dark: \"#52C41A\",\n  },\n  colorSuccessTextActive: {\n    light: \"#092B00\",\n    dark: \"#237804\",\n  },\n\n  // Warning colors\n  colorWarning: {\n    light: \"#FA8C16\",\n    dark: \"#D48806\",\n  },\n  colorWarningBg: {\n    light: \"#FFF7E6\",\n    dark: \"#281800\",\n  },\n  colorWarningBgHover: {\n    light: \"#FFE7BA\",\n    dark: \"#3D2200\",\n  },\n  colorWarningBorder: {\n    light: \"#FFD591\",\n    dark: \"#443B16\",\n  },\n  colorWarningBorderHover: {\n    light: \"#FFC069\",\n    dark: \"#594E1A\",\n  },\n  colorWarningHover: {\n    light: \"#FFA940\",\n    dark: \"#E8B339\",\n  },\n  colorWarningActive: {\n    light: \"#D46B08\",\n    dark: \"#AA7714\",\n  },\n  colorWarningTextHover: {\n    light: \"#AD4E00\",\n    dark: \"#E8B339\",\n  },\n  colorWarningTextActive: {\n    light: \"#873800\",\n    dark: \"#AA7714\",\n  },\n\n  // Error colors\n  colorError: {\n    light: \"#D92D20\",\n    dark: \"#CF3D33\",\n  },\n  colorErrorBg: {\n    light: \"#FEF3F2\",\n    dark: \"#291414\",\n  },\n  colorErrorBgHover: {\n    light: \"#FEE4E2\",\n    dark: \"#411A18\",\n  },\n  colorErrorBorder: {\n    light: \"#FDA29B\",\n    dark: \"#562222\",\n  },\n  colorErrorBorderHover: {\n    light: \"#F97066\",\n    dark: \"#772A24\",\n  },\n  colorErrorHover: {\n    light: \"#F04438\",\n    dark: \"#E5695A\",\n  },\n  colorErrorActive: {\n    light: \"#D92D20\",\n    dark: \"#A3332B\",\n  },\n  colorErrorTextHover: {\n    light: \"#F04438\",\n    dark: \"#E5695A\",\n  },\n  colorErrorTextActive: {\n    light: \"#D92D20\",\n    dark: \"#A3332B\",\n  },\n\n  // Fill colors\n  colorFill: {\n    light: \"rgba(0, 0, 0, 0.15)\",\n    dark: \"rgba(255, 255, 255, 0.15)\",\n  },\n  colorFillSecondary: {\n    light: \"rgba(0, 0, 0, 0.06)\",\n    dark: \"rgba(255, 255, 255, 0.06)\",\n  },\n  colorFillTertiary: {\n    light: \"rgba(0, 0, 0, 0.04)\",\n    dark: \"rgba(255, 255, 255, 0.04)\",\n  },\n  colorFillQuaternary: {\n    light: \"rgba(0, 0, 0, 0.02)\",\n    dark: \"rgba(255, 255, 255, 0.02)\",\n  },\n  colorFillAlter: {\n    light: \"rgba(0, 0, 0, 0.02)\",\n    dark: \"rgba(255, 255, 255, 0.02)\",\n  },\n\n  // Border colors\n  colorBorder: {\n    light: \"rgba(0, 0, 0, 0.16)\",\n    dark: \"rgba(255, 255, 255, 0.16)\",\n  },\n  colorBorderSecondary: {\n    light: \"rgba(0, 0, 0, 0.06)\",\n    dark: \"rgba(255, 255, 255, 0.06)\",\n  },\n\n  // Icon colors\n  colorIcon: {\n    light: \"rgba(0, 0, 0, 0.58)\",\n    dark: \"rgba(255, 255, 255, 0.58)\",\n  },\n  colorIconHover: {\n    light: \"rgba(0, 0, 0, 0.88)\",\n    dark: \"rgba(255, 255, 255, 0.88)\",\n  },\n\n  // Background colors\n  colorBgContainer: {\n    light: \"#FFFFFF\",\n    dark: \"#26262C\",\n  },\n  colorBgElevated: {\n    light: \"#FFFFFF\",\n    dark: \"#2F2F37\",\n  },\n  colorBgLayout: {\n    light: \"#F5F5F5\",\n    dark: \"#1A1A1E\",\n  },\n  colorBgSpotlight: {\n    light: \"rgba(0, 0, 0, 0.85)\",\n    dark: \"#505D5D\",\n  },\n  colorBgMask: {\n    light: \"rgba(0, 0, 0, 0.45)\",\n    dark: \"rgba(0, 0, 0, 0.45)\",\n  },\n  colorBgBase: {\n    light: \"#FFFFFF\",\n    dark: \"#13131A\",\n  },\n\n  // Control\n  controlOutline: {\n    light: \"rgba(0, 0, 0, 0.12)\",\n    dark: \"rgba(255, 255, 255, 0.12)\",\n  },\n};\n\nconst sharedTokens: ThemeConfig[\"token\"] = {\n  fontFamily: \"var(--ds-inter)\",\n  fontFamilyCode: \"var(--ds-roboto-mono)\",\n  fontSizeHeading1: 36,\n  fontSizeHeading2: 30,\n  fontSizeHeading3: 24,\n  fontSizeHeading4: 20,\n  fontSizeHeading5: 16,\n  lineHeightHeading1: 40 / 36,\n  lineHeightHeading2: 36 / 30,\n  lineHeightHeading3: 32 / 24,\n  lineHeightHeading4: 28 / 20,\n  lineHeightHeading5: 24 / 16,\n  lineHeight: 20 / 14,\n  lineHeightLG: 24 / 16,\n  lineHeightSM: 16 / 12,\n  fontWeightStrong: 600,\n  boxShadow:\n    \"0px 1px 2px rgba(0, 0, 0, 0.06), 0px 1px 6px rgba(0, 0, 0, 0.04), 0px 2px 10px rgba(0, 0, 0, 0.04)\",\n  boxShadowSecondary:\n    \"0px 0px 1px 0px var(--ds-modal-color-border), 0px 3px 6px 1px rgba(0, 0, 0, 0.08), 0px 6px 26px 2px rgba(0, 0, 0, 0.08), 0px 4px 52px 0px rgba(0, 0, 0, 0.05)\",\n  colorBgSpotlight: \"rgba(0, 0, 0, 0.85)\",\n};\n\nconst sharedThemeConfig: ThemeConfig = {\n  cssVar: true,\n  components: {\n    Input: {\n      activeBorderColor: \"var(--ds-input-color-border-active)\",\n      activeShadow: \"var(--ds-input-shadow-active)\",\n      errorActiveShadow: \"var(--ds-input-shadow-error-active)\",\n      warningActiveShadow: \"var(--ds-input-shadow-warning-active)\",\n    },\n    InputNumber: {\n      activeBorderColor: \"var(--ds-input-color-border-active)\",\n      activeShadow: \"var(--ds-input-shadow-active)\",\n      errorActiveShadow: \"var(--ds-input-shadow-error-active)\",\n      warningActiveShadow: \"var(--ds-input-shadow-warning-active)\",\n    },\n    Button: {\n      defaultShadow: undefined,\n      primaryShadow: undefined,\n      dangerShadow: undefined,\n    },\n    Select: {},\n    Segmented: {\n      controlHeightLG: 36,\n      controlHeightSM: 24,\n    },\n    Breadcrumb: {\n      separatorColor: \"var(--ds-color-border)\",\n    },\n    Slider: {\n      trackBg: \"var(--ds-color-primary)\",\n      trackHoverBg: \"var(--ds-color-primary-hover)\",\n      trackBgDisabled: \"var(--ds-color-text-disabled)\",\n      railBg: \"var(--ds-control-outline)\",\n      railHoverBg: \"var(--ds-color-border)\",\n      handleColor: \"var(--ds-color-primary)\",\n      handleActiveColor: \"var(--ds-color-primary-active)\",\n      handleColorDisabled: \"var(--ds-color-text-disabled)\",\n      dotBorderColor: \"var(--ds-color-primary)\",\n      dotActiveBorderColor: \"var(--ds-color-primary-active)\",\n    },\n    Form: {\n      itemMarginBottom: 16,\n      labelColor: \"var(--ds-color-text)\",\n    },\n  },\n};\n\n// Export theme configurations\nexport const lightTheme: ThemeConfig = {\n  token: {\n    ...getTokensByTheme(antdColorTokens, \"light\"),\n    ...sharedTokens,\n  },\n  ...sharedThemeConfig,\n};\n\nexport const darkTheme: ThemeConfig = {\n  token: {\n    ...getTokensByTheme(antdColorTokens, \"dark\"),\n    ...sharedTokens,\n  },\n  ...sharedThemeConfig,\n};\n"],"names":["antdColorTokens","sharedTokens","sharedThemeConfig","lightTheme","getTokensByTheme","darkTheme"],"mappings":"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"}
+{"version":3,"file":"tokens.js","sources":["../../../src/tokens/and-theme/tokens.ts"],"sourcesContent":["import { type ThemeConfig } from \"antd\";\nimport { getTokensByTheme } from \"../utils\";\nimport { ColorTokens } from \"../types\";\n\n// Convert Figma variables to Ant Design tokens with light/dark variants\nexport const antdColorTokens: ColorTokens = {\n  // Text colors\n  colorText: {\n    light: \"rgba(0, 0, 0, 0.88)\",\n    dark: \"rgba(255, 255, 255, 0.88)\",\n  },\n  colorTextSecondary: {\n    light: \"rgba(0, 0, 0, 0.65)\",\n    dark: \"rgba(255, 255, 255, 0.65)\",\n  },\n  colorTextTertiary: {\n    light: \"rgba(0, 0, 0, 0.45)\",\n    dark: \"rgba(255, 255, 255, 0.45)\",\n  },\n  colorTextQuaternary: {\n    light: \"rgba(0, 0, 0, 0.25)\",\n    dark: \"rgba(255, 255, 255, 0.25)\",\n  },\n  // Primary colors\n  colorPrimary: {\n    light: \"#175CD3\",\n    dark: \"#2E90FA\",\n  },\n  colorPrimaryBg: {\n    light: \"#E9F2FF\",\n    dark: \"#152137\",\n  },\n  colorPrimaryBgHover: {\n    light: \"#D1E9FF\",\n    dark: \"#112545\",\n  },\n  colorPrimaryBorder: {\n    light: \"#84CAFF\",\n    dark: \"#1C3959\",\n  },\n  colorPrimaryBorderHover: {\n    light: \"#53B1FD\",\n    dark: \"#204C7C\",\n  },\n  colorPrimaryHover: {\n    light: \"#1570EF\",\n    dark: \"#50A0E8\",\n  },\n  colorPrimaryActive: {\n    light: \"#175CD3\",\n    dark: \"#2565AB\",\n  },\n  colorPrimaryTextHover: {\n    light: \"#1570EF\",\n    dark: \"#50A0E8\",\n  },\n  colorPrimaryTextActive: {\n    light: \"#175CD3\",\n    dark: \"#2565AB\",\n  },\n\n  // Info colors\n  colorInfo: {\n    light: \"#175CD3\",\n    dark: \"#2E90FA\",\n  },\n  colorInfoBg: {\n    light: \"#E9F2FF\",\n    dark: \"#152137\",\n  },\n  colorInfoBgHover: {\n    light: \"#D1E9FF\",\n    dark: \"#112545\",\n  },\n  colorInfoBorder: {\n    light: \"#84CAFF\",\n    dark: \"#1C3959\",\n  },\n  colorInfoBorderHover: {\n    light: \"#53B1FD\",\n    dark: \"#204C7C\",\n  },\n  colorInfoHover: {\n    light: \"#1570EF\",\n    dark: \"#50A0E8\",\n  },\n  colorInfoActive: {\n    light: \"#175CD3\",\n    dark: \"#2565AB\",\n  },\n  colorInfoTextHover: {\n    light: \"#1570EF\",\n    dark: \"#50A0E8\",\n  },\n  colorInfoTextActive: {\n    light: \"#175CD3\",\n    dark: \"#2565AB\",\n  },\n\n  // Success colors\n  colorSuccess: {\n    light: \"#4CB200\",\n    dark: \"#389E0D\",\n  },\n  colorSuccessBg: {\n    light: \"#F6FFF0\",\n    dark: \"#162100\",\n  },\n  colorSuccessBgHover: {\n    light: \"#D9F7BE\",\n    dark: \"#1D2B00\",\n  },\n  colorSuccessBorder: {\n    light: \"#B7EB8F\",\n    dark: \"#274916\",\n  },\n  colorSuccessBorderHover: {\n    light: \"#95DE64\",\n    dark: \"#306317\",\n  },\n  colorSuccessHover: {\n    light: \"#73D13D\",\n    dark: \"#52C41A\",\n  },\n  colorSuccessActive: {\n    light: \"#389E0D\",\n    dark: \"#237804\",\n  },\n  colorSuccessTextHover: {\n    light: \"#237804\",\n    dark: \"#52C41A\",\n  },\n  colorSuccessTextActive: {\n    light: \"#092B00\",\n    dark: \"#237804\",\n  },\n\n  // Warning colors\n  colorWarning: {\n    light: \"#FA8C16\",\n    dark: \"#D48806\",\n  },\n  colorWarningBg: {\n    light: \"#FFF7E6\",\n    dark: \"#281800\",\n  },\n  colorWarningBgHover: {\n    light: \"#FFE7BA\",\n    dark: \"#3D2200\",\n  },\n  colorWarningBorder: {\n    light: \"#FFD591\",\n    dark: \"#443B16\",\n  },\n  colorWarningBorderHover: {\n    light: \"#FFC069\",\n    dark: \"#594E1A\",\n  },\n  colorWarningHover: {\n    light: \"#FFA940\",\n    dark: \"#E8B339\",\n  },\n  colorWarningActive: {\n    light: \"#D46B08\",\n    dark: \"#AA7714\",\n  },\n  colorWarningTextHover: {\n    light: \"#AD4E00\",\n    dark: \"#E8B339\",\n  },\n  colorWarningTextActive: {\n    light: \"#873800\",\n    dark: \"#AA7714\",\n  },\n\n  // Error colors\n  colorError: {\n    light: \"#D92D20\",\n    dark: \"#CF3D33\",\n  },\n  colorErrorBg: {\n    light: \"#FEF3F2\",\n    dark: \"#291414\",\n  },\n  colorErrorBgHover: {\n    light: \"#FEE4E2\",\n    dark: \"#411A18\",\n  },\n  colorErrorBorder: {\n    light: \"#FDA29B\",\n    dark: \"#562222\",\n  },\n  colorErrorBorderHover: {\n    light: \"#F97066\",\n    dark: \"#772A24\",\n  },\n  colorErrorHover: {\n    light: \"#F04438\",\n    dark: \"#E5695A\",\n  },\n  colorErrorActive: {\n    light: \"#D92D20\",\n    dark: \"#A3332B\",\n  },\n  colorErrorTextHover: {\n    light: \"#F04438\",\n    dark: \"#E5695A\",\n  },\n  colorErrorTextActive: {\n    light: \"#D92D20\",\n    dark: \"#A3332B\",\n  },\n\n  // Fill colors\n  colorFill: {\n    light: \"rgba(0, 0, 0, 0.15)\",\n    dark: \"rgba(255, 255, 255, 0.15)\",\n  },\n  colorFillSecondary: {\n    light: \"rgba(0, 0, 0, 0.06)\",\n    dark: \"rgba(255, 255, 255, 0.06)\",\n  },\n  colorFillTertiary: {\n    light: \"rgba(0, 0, 0, 0.04)\",\n    dark: \"rgba(255, 255, 255, 0.04)\",\n  },\n  colorFillQuaternary: {\n    light: \"rgba(0, 0, 0, 0.02)\",\n    dark: \"rgba(255, 255, 255, 0.02)\",\n  },\n  colorFillAlter: {\n    light: \"rgba(0, 0, 0, 0.02)\",\n    dark: \"rgba(255, 255, 255, 0.02)\",\n  },\n\n  // Border colors\n  colorBorder: {\n    light: \"rgba(0, 0, 0, 0.16)\",\n    dark: \"rgba(255, 255, 255, 0.16)\",\n  },\n  colorBorderSecondary: {\n    light: \"rgba(0, 0, 0, 0.06)\",\n    dark: \"rgba(255, 255, 255, 0.06)\",\n  },\n\n  // Icon colors\n  colorIcon: {\n    light: \"rgba(0, 0, 0, 0.50)\",\n    dark: \"rgba(255, 255, 255, 0.58)\",\n  },\n  colorIconHover: {\n    light: \"rgba(0, 0, 0, 0.80)\",\n    dark: \"rgba(255, 255, 255, 0.88)\",\n  },\n  colorBgBase: {\n    light: \"#FFFFFF\",\n    dark: \"#111113\",\n  },\n\n  // Background colors\n  colorBgContainer: {\n    light: \"#FFFFFF\",\n    dark: \"#242429\",\n  },\n  colorBgElevated: {\n    light: \"#FFFFFF\",\n    dark: \"#2B2B31\",\n  },\n  colorBgLayout: {\n    light: \"#F4F4F5\",\n    dark: \"#18181B\",\n  },\n  colorBgSpotlight: {\n    light: \"rgba(0, 0, 0, 0.85)\",\n    dark: \"#484851\",\n  },\n  colorBgMask: {\n    light: \"rgba(0, 0, 0, 0.45)\",\n    dark: \"rgba(0, 0, 0, 0.45)\",\n  },\n\n  // Control\n  controlOutline: {\n    light: \"rgba(0, 0, 0, 0.12)\",\n    dark: \"rgba(255, 255, 255, 0.12)\",\n  },\n};\n\nconst sharedTokens: ThemeConfig[\"token\"] = {\n  fontFamily: \"var(--ds-inter)\",\n  fontFamilyCode: \"var(--ds-roboto-mono)\",\n  fontSizeHeading1: 36,\n  fontSizeHeading2: 30,\n  fontSizeHeading3: 24,\n  fontSizeHeading4: 20,\n  fontSizeHeading5: 16,\n  lineHeightHeading1: 40 / 36,\n  lineHeightHeading2: 36 / 30,\n  lineHeightHeading3: 32 / 24,\n  lineHeightHeading4: 28 / 20,\n  lineHeightHeading5: 24 / 16,\n  lineHeight: 20 / 14,\n  lineHeightLG: 24 / 16,\n  lineHeightSM: 16 / 12,\n  fontWeightStrong: 600,\n  boxShadow:\n    \"0px 1px 2px rgba(0, 0, 0, 0.06), 0px 1px 6px rgba(0, 0, 0, 0.04), 0px 2px 10px rgba(0, 0, 0, 0.04)\",\n  boxShadowSecondary:\n    \"0px 0px 1px 0px var(--ds-modal-color-border), 0px 3px 6px 1px rgba(0, 0, 0, 0.08), 0px 6px 26px 2px rgba(0, 0, 0, 0.08), 0px 4px 52px 0px rgba(0, 0, 0, 0.05)\",\n  colorBgSpotlight: \"rgba(0, 0, 0, 0.85)\",\n};\n\nconst sharedThemeConfig: ThemeConfig = {\n  cssVar: true,\n  components: {\n    Input: {\n      activeBorderColor: \"var(--ds-input-color-border-active)\",\n      activeShadow: \"var(--ds-input-shadow-active)\",\n      errorActiveShadow: \"var(--ds-input-shadow-error-active)\",\n      warningActiveShadow: \"var(--ds-input-shadow-warning-active)\",\n    },\n    InputNumber: {\n      activeBorderColor: \"var(--ds-input-color-border-active)\",\n      activeShadow: \"var(--ds-input-shadow-active)\",\n      errorActiveShadow: \"var(--ds-input-shadow-error-active)\",\n      warningActiveShadow: \"var(--ds-input-shadow-warning-active)\",\n    },\n    Button: {\n      defaultShadow: undefined,\n      primaryShadow: undefined,\n      dangerShadow: undefined,\n    },\n    Select: {},\n    Segmented: {\n      controlHeightLG: 36,\n      controlHeightSM: 24,\n    },\n    Breadcrumb: {\n      separatorColor: \"var(--ds-color-border)\",\n    },\n    Slider: {\n      trackBg: \"var(--ds-color-primary)\",\n      trackHoverBg: \"var(--ds-color-primary-hover)\",\n      trackBgDisabled: \"var(--ds-color-text-disabled)\",\n      railBg: \"var(--ds-control-outline)\",\n      railHoverBg: \"var(--ds-color-border)\",\n      handleColor: \"var(--ds-color-primary)\",\n      handleActiveColor: \"var(--ds-color-primary-active)\",\n      handleColorDisabled: \"var(--ds-color-text-disabled)\",\n      dotBorderColor: \"var(--ds-color-primary)\",\n      dotActiveBorderColor: \"var(--ds-color-primary-active)\",\n    },\n    Form: {\n      itemMarginBottom: 16,\n      labelColor: \"var(--ds-color-text)\",\n    },\n  },\n};\n\n// Export theme configurations\nexport const lightTheme: ThemeConfig = {\n  token: {\n    ...getTokensByTheme(antdColorTokens, \"light\"),\n    ...sharedTokens,\n  },\n  ...sharedThemeConfig,\n};\n\nexport const darkTheme: ThemeConfig = {\n  token: {\n    ...getTokensByTheme(antdColorTokens, \"dark\"),\n    ...sharedTokens,\n  },\n  ...sharedThemeConfig,\n};\n"],"names":["antdColorTokens","sharedTokens","sharedThemeConfig","lightTheme","getTokensByTheme","darkTheme"],"mappings":"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"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@bioturing/components",
-  "version": "0.18.0",
+  "version": "0.19.0",
   "type": "module",
   "module": "./dist/index.js",
   "main": "./dist/index.js",
@@ -62,6 +62,9 @@
   "description": "BioTuring Design system React component library",
   "scripts": {
     "build": "vite build",
-    "dev": "vite build --watch"
+    "dev": "vite build --watch",
+    "rslib:build": "rslib build",
+    "rslib:dev": "rslib build --watch",
+    "tsdown": "tsdown"
   }
 }