@jinmi/ui 6.0.1 → 6.0.2

package/es/ThemeProvider/GlobalStyle/essential.mjs

@@ -1,4 +1,4 @@
-import { brandToken } from "../../styles/theme/customToken.mjs";
+import { brandToken, inkToken } from "../../styles/theme/customToken.mjs";
 import { CLASSNAMES } from "../../styles/classNames.mjs";
 import { css } from "antd-style";
 //#region src/ThemeProvider/GlobalStyle/essential.ts
@@ -9,104 +9,111 @@ import { css } from "antd-style";
 */
 var essential_default = (token) => {
 	const brand = brandToken[token.isDarkMode ? "dark" : "light"];
+	const ink = inkToken[token.isDarkMode ? "dark" : "light"];
 	return css`
-  :root {
-    /* Outer hairline painted on the page behind an elevated surface. Dark alpha is much
+    :root {
+      /* Outer hairline painted on the page behind an elevated surface. Dark alpha is much
        higher on purpose: a white hairline lightens toward a raised surface, and below ~16%
        it lands on the surface's own colour and the edge vanishes. */
-    --jinmi-ring: 0 0 0 1px ${token.isDarkMode ? "rgb(255 255 255 / 18%)" : "rgb(0 0 0 / 5%)"};
-
-    /* Brand tokens, read through brandCssVar. */
-    --jinmi-color-brand: ${brand.colorBrand};
-    --jinmi-color-brand-bg: ${brand.colorBrandBg};
-    --jinmi-color-brand-border: ${brand.colorBrandBorder};
-    --jinmi-color-brand-glow: ${brand.colorBrandGlow};
-    --jinmi-color-brand-text: ${brand.colorBrandText};
-  }
-
-  /* Keyboard focus ring in brand cyan. Zero specificity so components can override. */
-  :where(:focus-visible) {
-    outline: 2px solid var(--jinmi-color-brand);
-    outline-offset: 2px;
-  }
-
-  @layer jinmi-popup {
-    .${CLASSNAMES.ContextTrigger}[data-popup-open],
-      .${CLASSNAMES.DropdownMenuTrigger}[data-popup-open] {
-      background: ${token.colorFillTertiary};
+      --jinmi-ring: 0 0 0 1px ${token.isDarkMode ? "rgb(255 255 255 / 18%)" : "rgb(0 0 0 / 5%)"};
+
+      /* Brand tokens, read through brandCssVar. */
+      --jinmi-color-brand: ${brand.colorBrand};
+      --jinmi-color-brand-bg: ${brand.colorBrandBg};
+      --jinmi-color-brand-border: ${brand.colorBrandBorder};
+      --jinmi-color-brand-glow: ${brand.colorBrandGlow};
+      --jinmi-color-brand-text: ${brand.colorBrandText};
+
+      /* Ink tokens, read through inkCssVar. */
+      --jinmi-color-ink: ${ink.colorInk};
+      --jinmi-color-ink-active: ${ink.colorInkActive};
+      --jinmi-color-ink-hover: ${ink.colorInkHover};
+      --jinmi-color-ink-text: ${ink.colorInkText};
     }
-  }
-
-  @layer jinmi-base {
-    :where(.jinmi-flex) {
-      /* Define defaults on the element itself to avoid CSS variable inheritance leaking to nested Flex */
-      --jinmi-flex: 0 1 auto;
-      --jinmi-flex-direction: column;
-      --jinmi-flex-wrap: nowrap;
-      --jinmi-flex-justify: flex-start;
-      --jinmi-flex-align: stretch;
-      --jinmi-flex-width: auto;
-      --jinmi-flex-height: auto;
-      --jinmi-flex-padding: 0;
-
-      /* Keep padding-inline/block aligned with padding by default, and prevent inheriting from parent */
-      --jinmi-flex-padding-inline: var(--jinmi-flex-padding);
-      --jinmi-flex-padding-block: var(--jinmi-flex-padding);
-      --jinmi-flex-gap: 0;
-
-      display: flex;
-      flex: var(--jinmi-flex);
-      flex-flow: var(--jinmi-flex-direction) var(--jinmi-flex-wrap);
-      gap: var(--jinmi-flex-gap);
-      align-items: var(--jinmi-flex-align);
-      justify-content: var(--jinmi-flex-justify);
-
-      width: var(--jinmi-flex-width);
-      height: var(--jinmi-flex-height);
-      padding: var(--jinmi-flex-padding);
-      padding-block: var(--jinmi-flex-padding-block);
-      padding-inline: var(--jinmi-flex-padding-inline);
+
+    /* Keyboard focus ring in brand cyan. Zero specificity so components can override. */
+    :where(:focus-visible) {
+      outline: 2px solid var(--jinmi-color-brand);
+      outline-offset: 2px;
     }
 
-    .jinmi-flex-hidden {
-      display: none;
+    @layer jinmi-popup {
+      .${CLASSNAMES.ContextTrigger}[data-popup-open],
+        .${CLASSNAMES.DropdownMenuTrigger}[data-popup-open] {
+        background: ${token.colorFillTertiary};
+      }
     }
-  }
 
-  /* Brand Loading */
-  @keyframes draw {
-    0% {
-      stroke-dashoffset: 1000;
+    @layer jinmi-base {
+      :where(.jinmi-flex) {
+        /* Define defaults on the element itself to avoid CSS variable inheritance leaking to nested Flex */
+        --jinmi-flex: 0 1 auto;
+        --jinmi-flex-direction: column;
+        --jinmi-flex-wrap: nowrap;
+        --jinmi-flex-justify: flex-start;
+        --jinmi-flex-align: stretch;
+        --jinmi-flex-width: auto;
+        --jinmi-flex-height: auto;
+        --jinmi-flex-padding: 0;
+
+        /* Keep padding-inline/block aligned with padding by default, and prevent inheriting from parent */
+        --jinmi-flex-padding-inline: var(--jinmi-flex-padding);
+        --jinmi-flex-padding-block: var(--jinmi-flex-padding);
+        --jinmi-flex-gap: 0;
+
+        display: flex;
+        flex: var(--jinmi-flex);
+        flex-flow: var(--jinmi-flex-direction) var(--jinmi-flex-wrap);
+        gap: var(--jinmi-flex-gap);
+        align-items: var(--jinmi-flex-align);
+        justify-content: var(--jinmi-flex-justify);
+
+        width: var(--jinmi-flex-width);
+        height: var(--jinmi-flex-height);
+        padding: var(--jinmi-flex-padding);
+        padding-block: var(--jinmi-flex-padding-block);
+        padding-inline: var(--jinmi-flex-padding-inline);
+      }
+
+      .jinmi-flex-hidden {
+        display: none;
+      }
     }
 
-    100% {
-      stroke-dashoffset: 0;
+    /* Brand Loading */
+    @keyframes draw {
+      0% {
+        stroke-dashoffset: 1000;
+      }
+
+      100% {
+        stroke-dashoffset: 0;
+      }
     }
-  }
 
-  @keyframes fill {
-    30% {
-      fill-opacity: 0.05;
+    @keyframes fill {
+      30% {
+        fill-opacity: 0.05;
+      }
+
+      100% {
+        fill-opacity: 1;
+      }
     }
 
-    100% {
-      fill-opacity: 1;
+    .jinmi-brand-loading path {
+      fill: currentcolor;
+      fill-opacity: 0;
+      stroke: currentcolor;
+      stroke-dasharray: 1000;
+      stroke-dashoffset: 1000;
+      stroke-width: 0.25em;
+
+      animation:
+        draw 2s cubic-bezier(0.4, 0, 0.2, 1) infinite,
+        fill 2s cubic-bezier(0.4, 0, 0.2, 1) infinite;
     }
-  }
-
-  .jinmi-brand-loading path {
-    fill: currentcolor;
-    fill-opacity: 0;
-    stroke: currentcolor;
-    stroke-dasharray: 1000;
-    stroke-dashoffset: 1000;
-    stroke-width: 0.25em;
-
-    animation:
-      draw 2s cubic-bezier(0.4, 0, 0.2, 1) infinite,
-      fill 2s cubic-bezier(0.4, 0, 0.2, 1) infinite;
-  }
-`;
+  `;
 };
 //#endregion
 export { essential_default as default };

package/es/ThemeProvider/GlobalStyle/essential.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"essential.mjs","names":[],"sources":["../../../src/ThemeProvider/GlobalStyle/essential.ts"],"sourcesContent":["import { css, type Theme } from 'antd-style';\n\nimport { CLASSNAMES } from '@/styles/classNames';\nimport { brandToken } from '@/styles/theme/customToken';\n\n/**\n * Styles that library components rely on to render correctly (Flex layout,\n * popup trigger states, brand animations). Always injected by ThemeProvider,\n * independent of `enableGlobalStyle`, which only gates document-level resets.\n */\nexport default (token: Theme) => {\n  const brand = brandToken[token.isDarkMode ? 'dark' : 'light'];\n\n  return css`\n  :root {\n    /* Outer hairline painted on the page behind an elevated surface. Dark alpha is much\n       higher on purpose: a white hairline lightens toward a raised surface, and below ~16%\n       it lands on the surface's own colour and the edge vanishes. */\n    --jinmi-ring: 0 0 0 1px ${token.isDarkMode ? 'rgb(255 255 255 / 18%)' : 'rgb(0 0 0 / 5%)'};\n\n    /* Brand tokens, read through brandCssVar. */\n    --jinmi-color-brand: ${brand.colorBrand};\n    --jinmi-color-brand-bg: ${brand.colorBrandBg};\n    --jinmi-color-brand-border: ${brand.colorBrandBorder};\n    --jinmi-color-brand-glow: ${brand.colorBrandGlow};\n    --jinmi-color-brand-text: ${brand.colorBrandText};\n  }\n\n  /* Keyboard focus ring in brand cyan. Zero specificity so components can override. */\n  :where(:focus-visible) {\n    outline: 2px solid var(--jinmi-color-brand);\n    outline-offset: 2px;\n  }\n\n  @layer jinmi-popup {\n    .${CLASSNAMES.ContextTrigger}[data-popup-open],\n      .${CLASSNAMES.DropdownMenuTrigger}[data-popup-open] {\n      background: ${token.colorFillTertiary};\n    }\n  }\n\n  @layer jinmi-base {\n    :where(.jinmi-flex) {\n      /* Define defaults on the element itself to avoid CSS variable inheritance leaking to nested Flex */\n      --jinmi-flex: 0 1 auto;\n      --jinmi-flex-direction: column;\n      --jinmi-flex-wrap: nowrap;\n      --jinmi-flex-justify: flex-start;\n      --jinmi-flex-align: stretch;\n      --jinmi-flex-width: auto;\n      --jinmi-flex-height: auto;\n      --jinmi-flex-padding: 0;\n\n      /* Keep padding-inline/block aligned with padding by default, and prevent inheriting from parent */\n      --jinmi-flex-padding-inline: var(--jinmi-flex-padding);\n      --jinmi-flex-padding-block: var(--jinmi-flex-padding);\n      --jinmi-flex-gap: 0;\n\n      display: flex;\n      flex: var(--jinmi-flex);\n      flex-flow: var(--jinmi-flex-direction) var(--jinmi-flex-wrap);\n      gap: var(--jinmi-flex-gap);\n      align-items: var(--jinmi-flex-align);\n      justify-content: var(--jinmi-flex-justify);\n\n      width: var(--jinmi-flex-width);\n      height: var(--jinmi-flex-height);\n      padding: var(--jinmi-flex-padding);\n      padding-block: var(--jinmi-flex-padding-block);\n      padding-inline: var(--jinmi-flex-padding-inline);\n    }\n\n    .jinmi-flex-hidden {\n      display: none;\n    }\n  }\n\n  /* Brand Loading */\n  @keyframes draw {\n    0% {\n      stroke-dashoffset: 1000;\n    }\n\n    100% {\n      stroke-dashoffset: 0;\n    }\n  }\n\n  @keyframes fill {\n    30% {\n      fill-opacity: 0.05;\n    }\n\n    100% {\n      fill-opacity: 1;\n    }\n  }\n\n  .jinmi-brand-loading path {\n    fill: currentcolor;\n    fill-opacity: 0;\n    stroke: currentcolor;\n    stroke-dasharray: 1000;\n    stroke-dashoffset: 1000;\n    stroke-width: 0.25em;\n\n    animation:\n      draw 2s cubic-bezier(0.4, 0, 0.2, 1) infinite,\n      fill 2s cubic-bezier(0.4, 0, 0.2, 1) infinite;\n  }\n`;\n};\n"],"mappings":";;;;;;;;;AAUA,IAAA,qBAAgB,UAAiB;CAC/B,MAAM,QAAQ,WAAW,MAAM,aAAa,SAAS;CAErD,OAAO,GAAG;;;;;8BAKkB,MAAM,aAAa,2BAA2B,kBAAkB;;;2BAGnE,MAAM,WAAW;8BACd,MAAM,aAAa;kCACf,MAAM,iBAAiB;gCACzB,MAAM,eAAe;gCACrB,MAAM,eAAe;;;;;;;;;;OAU9C,WAAW,eAAe;SACxB,WAAW,oBAAoB;oBACpB,MAAM,kBAAkB;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AA0E5C"}
+{"version":3,"file":"essential.mjs","names":[],"sources":["../../../src/ThemeProvider/GlobalStyle/essential.ts"],"sourcesContent":["import { css, type Theme } from 'antd-style';\n\nimport { CLASSNAMES } from '@/styles/classNames';\nimport { brandToken, inkToken } from '@/styles/theme/customToken';\n\n/**\n * Styles that library components rely on to render correctly (Flex layout,\n * popup trigger states, brand animations). Always injected by ThemeProvider,\n * independent of `enableGlobalStyle`, which only gates document-level resets.\n */\nexport default (token: Theme) => {\n  const brand = brandToken[token.isDarkMode ? 'dark' : 'light'];\n  const ink = inkToken[token.isDarkMode ? 'dark' : 'light'];\n\n  return css`\n    :root {\n      /* Outer hairline painted on the page behind an elevated surface. Dark alpha is much\n       higher on purpose: a white hairline lightens toward a raised surface, and below ~16%\n       it lands on the surface's own colour and the edge vanishes. */\n      --jinmi-ring: 0 0 0 1px ${token.isDarkMode ? 'rgb(255 255 255 / 18%)' : 'rgb(0 0 0 / 5%)'};\n\n      /* Brand tokens, read through brandCssVar. */\n      --jinmi-color-brand: ${brand.colorBrand};\n      --jinmi-color-brand-bg: ${brand.colorBrandBg};\n      --jinmi-color-brand-border: ${brand.colorBrandBorder};\n      --jinmi-color-brand-glow: ${brand.colorBrandGlow};\n      --jinmi-color-brand-text: ${brand.colorBrandText};\n\n      /* Ink tokens, read through inkCssVar. */\n      --jinmi-color-ink: ${ink.colorInk};\n      --jinmi-color-ink-active: ${ink.colorInkActive};\n      --jinmi-color-ink-hover: ${ink.colorInkHover};\n      --jinmi-color-ink-text: ${ink.colorInkText};\n    }\n\n    /* Keyboard focus ring in brand cyan. Zero specificity so components can override. */\n    :where(:focus-visible) {\n      outline: 2px solid var(--jinmi-color-brand);\n      outline-offset: 2px;\n    }\n\n    @layer jinmi-popup {\n      .${CLASSNAMES.ContextTrigger}[data-popup-open],\n        .${CLASSNAMES.DropdownMenuTrigger}[data-popup-open] {\n        background: ${token.colorFillTertiary};\n      }\n    }\n\n    @layer jinmi-base {\n      :where(.jinmi-flex) {\n        /* Define defaults on the element itself to avoid CSS variable inheritance leaking to nested Flex */\n        --jinmi-flex: 0 1 auto;\n        --jinmi-flex-direction: column;\n        --jinmi-flex-wrap: nowrap;\n        --jinmi-flex-justify: flex-start;\n        --jinmi-flex-align: stretch;\n        --jinmi-flex-width: auto;\n        --jinmi-flex-height: auto;\n        --jinmi-flex-padding: 0;\n\n        /* Keep padding-inline/block aligned with padding by default, and prevent inheriting from parent */\n        --jinmi-flex-padding-inline: var(--jinmi-flex-padding);\n        --jinmi-flex-padding-block: var(--jinmi-flex-padding);\n        --jinmi-flex-gap: 0;\n\n        display: flex;\n        flex: var(--jinmi-flex);\n        flex-flow: var(--jinmi-flex-direction) var(--jinmi-flex-wrap);\n        gap: var(--jinmi-flex-gap);\n        align-items: var(--jinmi-flex-align);\n        justify-content: var(--jinmi-flex-justify);\n\n        width: var(--jinmi-flex-width);\n        height: var(--jinmi-flex-height);\n        padding: var(--jinmi-flex-padding);\n        padding-block: var(--jinmi-flex-padding-block);\n        padding-inline: var(--jinmi-flex-padding-inline);\n      }\n\n      .jinmi-flex-hidden {\n        display: none;\n      }\n    }\n\n    /* Brand Loading */\n    @keyframes draw {\n      0% {\n        stroke-dashoffset: 1000;\n      }\n\n      100% {\n        stroke-dashoffset: 0;\n      }\n    }\n\n    @keyframes fill {\n      30% {\n        fill-opacity: 0.05;\n      }\n\n      100% {\n        fill-opacity: 1;\n      }\n    }\n\n    .jinmi-brand-loading path {\n      fill: currentcolor;\n      fill-opacity: 0;\n      stroke: currentcolor;\n      stroke-dasharray: 1000;\n      stroke-dashoffset: 1000;\n      stroke-width: 0.25em;\n\n      animation:\n        draw 2s cubic-bezier(0.4, 0, 0.2, 1) infinite,\n        fill 2s cubic-bezier(0.4, 0, 0.2, 1) infinite;\n    }\n  `;\n};\n"],"mappings":";;;;;;;;;AAUA,IAAA,qBAAgB,UAAiB;CAC/B,MAAM,QAAQ,WAAW,MAAM,aAAa,SAAS;CACrD,MAAM,MAAM,SAAS,MAAM,aAAa,SAAS;CAEjD,OAAO,GAAG;;;;;gCAKoB,MAAM,aAAa,2BAA2B,kBAAkB;;;6BAGnE,MAAM,WAAW;gCACd,MAAM,aAAa;oCACf,MAAM,iBAAiB;kCACzB,MAAM,eAAe;kCACrB,MAAM,eAAe;;;2BAG5B,IAAI,SAAS;kCACN,IAAI,eAAe;iCACpB,IAAI,cAAc;gCACnB,IAAI,aAAa;;;;;;;;;;SAUxC,WAAW,eAAe;WACxB,WAAW,oBAAoB;sBACpB,MAAM,kBAAkB;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AA0E9C"}

package/es/ThemeProvider/GlobalStyle/global.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"global.mjs","names":[],"sources":["../../../src/ThemeProvider/GlobalStyle/global.ts"],"sourcesContent":["import { css, type Theme } from 'antd-style';\r\n\r\nexport default (token: Theme) => css`\r\n  :root {\r\n    --font-settings: 'cv01', 'tnum', 'kern';\r\n    --font-variations: 'opsz' auto, tabular-nums;\r\n\r\n    /* Real Inter italic for Latin; synthesize style for CJK fallback faces. */\r\n    font-synthesis: style;\r\n    text-autospace: normal;\r\n  }\r\n\r\n  html {\r\n    overscroll-behavior: none;\r\n    color-scheme: ${token.isDarkMode ? 'dark' : 'light'};\r\n  }\r\n\r\n  body {\r\n    overflow: hidden auto;\r\n\r\n    min-height: 100vh;\r\n    margin: 0;\r\n    padding: 0;\r\n\r\n    font-family: ${token.fontFamily};\r\n    font-size: ${token.fontSize}px;\r\n    font-feature-settings: var(--font-settings);\r\n    font-variation-settings: var(--font-variations);\r\n    font-optical-sizing: auto;\r\n    font-kerning: normal;\r\n    font-variant-ligatures: common-ligatures contextual;\r\n    font-variant-numeric: tabular-nums;\r\n    font-size-adjust: from-font;\r\n    -webkit-font-smoothing: antialiased;\r\n    -moz-osx-font-smoothing: grayscale;\r\n    line-height: 1;\r\n    color: ${token.colorTextBase};\r\n    text-wrap: pretty;\r\n    text-size-adjust: 100%;\r\n    text-rendering: optimizelegibility;\r\n    overflow-wrap: anywhere;\r\n    vertical-align: baseline;\r\n\r\n    background-color: ${token.colorBgLayout};\r\n\r\n    font-synthesis: style;\r\n\r\n    -webkit-overflow-scrolling: touch;\r\n    -webkit-tap-highlight-color: transparent;\r\n  }\r\n\r\n  code,\r\n  kbd,\r\n  samp,\r\n  pre {\r\n    font-family: ${token.fontFamilyCode} !important;\r\n    font-feature-settings:\r\n      'liga' 0,\r\n      'calt' 0;\r\n    font-variant-ligatures: none;\r\n\r\n    span {\r\n      font-family: ${token.fontFamilyCode} !important;\r\n    }\r\n  }\r\n\r\n  ::selection {\r\n    color: #000;\r\n    background: ${token.yellow9};\r\n\r\n    -webkit-text-fill-color: unset !important;\r\n  }\r\n\r\n  * {\r\n    scrollbar-color: ${token.colorFill} transparent;\r\n    scrollbar-width: thin;\r\n    box-sizing: border-box;\r\n    vertical-align: baseline;\r\n  }\r\n`;\r\n"],"mappings":";;AAEA,IAAA,kBAAgB,UAAiB,GAAG;;;;;;;;;;;;oBAYhB,MAAM,aAAa,SAAS,QAAQ;;;;;;;;;;mBAUrC,MAAM,WAAW;iBACnB,MAAM,SAAS;;;;;;;;;;;aAWnB,MAAM,cAAc;;;;;;;wBAOT,MAAM,cAAc;;;;;;;;;;;;mBAYzB,MAAM,eAAe;;;;;;;qBAOnB,MAAM,eAAe;;;;;;kBAMxB,MAAM,QAAQ;;;;;;uBAMT,MAAM,UAAU"}
+{"version":3,"file":"global.mjs","names":[],"sources":["../../../src/ThemeProvider/GlobalStyle/global.ts"],"sourcesContent":["import { css, type Theme } from 'antd-style';\n\nexport default (token: Theme) => css`\n  :root {\n    --font-settings: 'cv01', 'tnum', 'kern';\n    --font-variations: 'opsz' auto, tabular-nums;\n\n    /* Real Inter italic for Latin; synthesize style for CJK fallback faces. */\n    font-synthesis: style;\n    text-autospace: normal;\n  }\n\n  html {\n    overscroll-behavior: none;\n    color-scheme: ${token.isDarkMode ? 'dark' : 'light'};\n  }\n\n  body {\n    overflow: hidden auto;\n\n    min-height: 100vh;\n    margin: 0;\n    padding: 0;\n\n    font-family: ${token.fontFamily};\n    font-size: ${token.fontSize}px;\n    font-feature-settings: var(--font-settings);\n    font-variation-settings: var(--font-variations);\n    font-optical-sizing: auto;\n    font-kerning: normal;\n    font-variant-ligatures: common-ligatures contextual;\n    font-variant-numeric: tabular-nums;\n    font-size-adjust: from-font;\n    -webkit-font-smoothing: antialiased;\n    -moz-osx-font-smoothing: grayscale;\n    line-height: 1;\n    color: ${token.colorTextBase};\n    text-wrap: pretty;\n    text-size-adjust: 100%;\n    text-rendering: optimizelegibility;\n    overflow-wrap: anywhere;\n    vertical-align: baseline;\n\n    background-color: ${token.colorBgLayout};\n\n    font-synthesis: style;\n\n    -webkit-overflow-scrolling: touch;\n    -webkit-tap-highlight-color: transparent;\n  }\n\n  code,\n  kbd,\n  samp,\n  pre {\n    font-family: ${token.fontFamilyCode} !important;\n    font-feature-settings:\n      'liga' 0,\n      'calt' 0;\n    font-variant-ligatures: none;\n\n    span {\n      font-family: ${token.fontFamilyCode} !important;\n    }\n  }\n\n  ::selection {\n    color: #000;\n    background: ${token.yellow9};\n\n    -webkit-text-fill-color: unset !important;\n  }\n\n  * {\n    scrollbar-color: ${token.colorFill} transparent;\n    scrollbar-width: thin;\n    box-sizing: border-box;\n    vertical-align: baseline;\n  }\n`;\n"],"mappings":";;AAEA,IAAA,kBAAgB,UAAiB,GAAG;;;;;;;;;;;;oBAYhB,MAAM,aAAa,SAAS,QAAQ;;;;;;;;;;mBAUrC,MAAM,WAAW;iBACnB,MAAM,SAAS;;;;;;;;;;;aAWnB,MAAM,cAAc;;;;;;;wBAOT,MAAM,cAAc;;;;;;;;;;;;mBAYzB,MAAM,eAAe;;;;;;;qBAOnB,MAAM,eAAe;;;;;;kBAMxB,MAAM,QAAQ;;;;;;uBAMT,MAAM,UAAU"}

package/es/ThemeProvider/ThemeProvider.mjs

@@ -1,7 +1,7 @@
 "use client";
 import { useCdnFn } from "../ConfigProvider/index.mjs";
-import { generateCustomToken } from "../styles/theme/customToken.mjs";
 import { generateCustomStylish } from "../styles/theme/customStylish.mjs";
+import { generateCustomToken } from "../styles/theme/customToken.mjs";
 import AppElementContext from "./AppElementContext.mjs";
 import { LOBE_THEME_APP_ID } from "./constants.mjs";
 import FontLoader from "../FontLoader/index.mjs";

package/es/awesome/Hero/Hero.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"Hero.mjs","names":["Flexbox"],"sources":["../../../src/awesome/Hero/Hero.tsx"],"sourcesContent":["'use client';\r\n\r\nimport { GithubIcon } from '@jinmi/ui/icons';\r\nimport { useResponsive } from 'antd-style';\r\nimport { memo, useCallback } from 'react';\r\n\r\nimport A from '@/A';\r\nimport AuroraBackground from '@/awesome/AuroraBackground';\r\nimport GradientButton from '@/awesome/GradientButton';\r\nimport Button from '@/base-ui/Button';\r\nimport { Center, Flexbox } from '@/Flex';\r\nimport Icon from '@/Icon';\r\n\r\nimport { styles } from './style';\r\nimport { type HeroProps } from './type';\r\n\r\nconst Hero = memo<HeroProps>(({ title, description, actions, Link }) => {\r\n  const { mobile } = useResponsive();\r\n\r\n  const LinkRender = Link || A;\r\n\r\n  const ButtonGroups = useCallback(\r\n    () =>\r\n      Boolean(actions?.length) && (\r\n        <Flexbox horizontal className={styles.actions} gap={16} justify={'center'}>\r\n          {actions!.map(({ text, link, openExternal, github, type }, index) => {\r\n            const content =\r\n              type === 'primary' ? (\r\n                <GradientButton\r\n                  block={mobile}\r\n                  icon={github ? <Icon icon={GithubIcon} size={18} /> : undefined}\r\n                  key={index}\r\n                  size=\"large\"\r\n                >\r\n                  {text}\r\n                </GradientButton>\r\n              ) : (\r\n                <Button\r\n                  block={mobile}\r\n                  icon={github ? <Icon icon={GithubIcon} size={18} /> : undefined}\r\n                  key={index}\r\n                  size=\"large\"\r\n                  type=\"primary\"\r\n                >\r\n                  {text}\r\n                </Button>\r\n              );\r\n\r\n            return openExternal ? (\r\n              <A href={link} key={text} target={openExternal ? '_blank' : undefined}>\r\n                {content}\r\n              </A>\r\n            ) : (\r\n              <LinkRender key={text} to={link}>\r\n                {content}\r\n              </LinkRender>\r\n            );\r\n          })}\r\n        </Flexbox>\r\n      ),\r\n    [actions],\r\n  );\r\n\r\n  return (\r\n    <>\r\n      <AuroraBackground />\r\n      <Flexbox align={'center'} style={{ fontSize: 16, zIndex: 1 }}>\r\n        <Flexbox horizontal className={styles.container} distribution={'center'}>\r\n          <Center>\r\n            {title && (\r\n              <Center\r\n                horizontal\r\n                as={'h1'}\r\n                className={styles.title}\r\n                dangerouslySetInnerHTML={{ __html: title }}\r\n                gap={'0.25em'}\r\n                wrap={'wrap'}\r\n              />\r\n            )}\r\n            {description && (\r\n              <p className={styles.desc} dangerouslySetInnerHTML={{ __html: description }} />\r\n            )}\r\n            <ButtonGroups />\r\n          </Center>\r\n        </Flexbox>\r\n      </Flexbox>\r\n    </>\r\n  );\r\n});\r\n\r\nHero.displayName = 'Hero';\r\n\r\nexport default Hero;\r\n"],"mappings":";;;;;;;;;;;;;;AAgBA,MAAM,OAAO,MAAiB,EAAE,OAAO,aAAa,SAAS,WAAW;CACtE,MAAM,EAAE,WAAW,cAAc;CAEjC,MAAM,aAAa,QAAQ;CAE3B,MAAM,eAAe,kBAEjB,QAAQ,SAAS,MAAM,KACrB,oBAACA,mBAAD;EAAS,YAAA;EAAW,WAAW,OAAO;EAAS,KAAK;EAAI,SAAS;EAC9D,UAAA,QAAS,KAAK,EAAE,MAAM,MAAM,cAAc,QAAQ,QAAQ,UAAU;GACnE,MAAM,UACJ,SAAS,YACP,oBAAC,gBAAD;IACE,OAAO;IACP,MAAM,SAAS,oBAAC,MAAD;KAAM,MAAM;KAAY,MAAM;IAAK,CAAA,IAAI,KAAA;IAEtD,MAAK;IAEJ,UAAA;GACa,GAJT,KAIS,IAEhB,oBAAC,QAAD;IACE,OAAO;IACP,MAAM,SAAS,oBAAC,MAAD;KAAM,MAAM;KAAY,MAAM;IAAK,CAAA,IAAI,KAAA;IAEtD,MAAK;IACL,MAAK;IAEJ,UAAA;GACK,GALD,KAKC;GAGZ,OAAO,eACL,oBAAC,GAAD;IAAG,MAAM;IAAiB,QAAQ,eAAe,WAAW,KAAA;IACzD,UAAA;GACA,GAFiB,IAEjB,IAEH,oBAAC,YAAD;IAAuB,IAAI;IACxB,UAAA;GACS,GAFK,IAEL;EAEhB,CAAC;CACM,CAAA,GAEb,CAAC,OAAO,CACV;CAEA,OACE,qBAAA,YAAA,EAAA,UAAA,CACE,oBAAC,kBAAD,CAAmB,CAAA,GACnB,oBAACA,mBAAD;EAAS,OAAO;EAAU,OAAO;GAAE,UAAU;GAAI,QAAQ;EAAE;EACzD,UAAA,oBAACA,mBAAD;GAAS,YAAA;GAAW,WAAW,OAAO;GAAW,cAAc;GAC7D,UAAA,qBAAC,QAAD,EAAA,UAAA;IACG,SACC,oBAAC,QAAD;KACE,YAAA;KACA,IAAI;KACJ,WAAW,OAAO;KAClB,yBAAyB,EAAE,QAAQ,MAAM;KACzC,KAAK;KACL,MAAM;IACP,CAAA;IAEF,eACC,oBAAC,KAAD;KAAG,WAAW,OAAO;KAAM,yBAAyB,EAAE,QAAQ,YAAY;IAAI,CAAA;IAEhF,oBAAC,cAAD,CAAe,CAAA;GACT,EAAA,CAAA;EACD,CAAA;CACF,CAAA,CACT,EAAA,CAAA;AAEN,CAAC;AAED,KAAK,cAAc"}
+{"version":3,"file":"Hero.mjs","names":["Flexbox"],"sources":["../../../src/awesome/Hero/Hero.tsx"],"sourcesContent":["'use client';\n\nimport { GithubIcon } from '@jinmi/ui/icons';\nimport { useResponsive } from 'antd-style';\nimport { memo, useCallback } from 'react';\n\nimport A from '@/A';\nimport AuroraBackground from '@/awesome/AuroraBackground';\nimport GradientButton from '@/awesome/GradientButton';\nimport Button from '@/base-ui/Button';\nimport { Center, Flexbox } from '@/Flex';\nimport Icon from '@/Icon';\n\nimport { styles } from './style';\nimport { type HeroProps } from './type';\n\nconst Hero = memo<HeroProps>(({ title, description, actions, Link }) => {\n  const { mobile } = useResponsive();\n\n  const LinkRender = Link || A;\n\n  const ButtonGroups = useCallback(\n    () =>\n      Boolean(actions?.length) && (\n        <Flexbox horizontal className={styles.actions} gap={16} justify={'center'}>\n          {actions!.map(({ text, link, openExternal, github, type }, index) => {\n            const content =\n              type === 'primary' ? (\n                <GradientButton\n                  block={mobile}\n                  icon={github ? <Icon icon={GithubIcon} size={18} /> : undefined}\n                  key={index}\n                  size=\"large\"\n                >\n                  {text}\n                </GradientButton>\n              ) : (\n                <Button\n                  block={mobile}\n                  icon={github ? <Icon icon={GithubIcon} size={18} /> : undefined}\n                  key={index}\n                  size=\"large\"\n                  type=\"primary\"\n                >\n                  {text}\n                </Button>\n              );\n\n            return openExternal ? (\n              <A href={link} key={text} target={openExternal ? '_blank' : undefined}>\n                {content}\n              </A>\n            ) : (\n              <LinkRender key={text} to={link}>\n                {content}\n              </LinkRender>\n            );\n          })}\n        </Flexbox>\n      ),\n    [actions],\n  );\n\n  return (\n    <>\n      <AuroraBackground />\n      <Flexbox align={'center'} style={{ fontSize: 16, zIndex: 1 }}>\n        <Flexbox horizontal className={styles.container} distribution={'center'}>\n          <Center>\n            {title && (\n              <Center\n                horizontal\n                as={'h1'}\n                className={styles.title}\n                dangerouslySetInnerHTML={{ __html: title }}\n                gap={'0.25em'}\n                wrap={'wrap'}\n              />\n            )}\n            {description && (\n              <p className={styles.desc} dangerouslySetInnerHTML={{ __html: description }} />\n            )}\n            <ButtonGroups />\n          </Center>\n        </Flexbox>\n      </Flexbox>\n    </>\n  );\n});\n\nHero.displayName = 'Hero';\n\nexport default Hero;\n"],"mappings":";;;;;;;;;;;;;;AAgBA,MAAM,OAAO,MAAiB,EAAE,OAAO,aAAa,SAAS,WAAW;CACtE,MAAM,EAAE,WAAW,cAAc;CAEjC,MAAM,aAAa,QAAQ;CAE3B,MAAM,eAAe,kBAEjB,QAAQ,SAAS,MAAM,KACrB,oBAACA,mBAAD;EAAS,YAAA;EAAW,WAAW,OAAO;EAAS,KAAK;EAAI,SAAS;EAC9D,UAAA,QAAS,KAAK,EAAE,MAAM,MAAM,cAAc,QAAQ,QAAQ,UAAU;GACnE,MAAM,UACJ,SAAS,YACP,oBAAC,gBAAD;IACE,OAAO;IACP,MAAM,SAAS,oBAAC,MAAD;KAAM,MAAM;KAAY,MAAM;IAAK,CAAA,IAAI,KAAA;IAEtD,MAAK;IAEJ,UAAA;GACa,GAJT,KAIS,IAEhB,oBAAC,QAAD;IACE,OAAO;IACP,MAAM,SAAS,oBAAC,MAAD;KAAM,MAAM;KAAY,MAAM;IAAK,CAAA,IAAI,KAAA;IAEtD,MAAK;IACL,MAAK;IAEJ,UAAA;GACK,GALD,KAKC;GAGZ,OAAO,eACL,oBAAC,GAAD;IAAG,MAAM;IAAiB,QAAQ,eAAe,WAAW,KAAA;IACzD,UAAA;GACA,GAFiB,IAEjB,IAEH,oBAAC,YAAD;IAAuB,IAAI;IACxB,UAAA;GACS,GAFK,IAEL;EAEhB,CAAC;CACM,CAAA,GAEb,CAAC,OAAO,CACV;CAEA,OACE,qBAAA,YAAA,EAAA,UAAA,CACE,oBAAC,kBAAD,CAAmB,CAAA,GACnB,oBAACA,mBAAD;EAAS,OAAO;EAAU,OAAO;GAAE,UAAU;GAAI,QAAQ;EAAE;EACzD,UAAA,oBAACA,mBAAD;GAAS,YAAA;GAAW,WAAW,OAAO;GAAW,cAAc;GAC7D,UAAA,qBAAC,QAAD,EAAA,UAAA;IACG,SACC,oBAAC,QAAD;KACE,YAAA;KACA,IAAI;KACJ,WAAW,OAAO;KAClB,yBAAyB,EAAE,QAAQ,MAAM;KACzC,KAAK;KACL,MAAM;IACP,CAAA;IAEF,eACC,oBAAC,KAAD;KAAG,WAAW,OAAO;KAAM,yBAAyB,EAAE,QAAQ,YAAY;IAAI,CAAA;IAEhF,oBAAC,cAAD,CAAe,CAAA;GACT,EAAA,CAAA;EACD,CAAA;CACF,CAAA,CACT,EAAA,CAAA;AAEN,CAAC;AAED,KAAK,cAAc"}

package/es/base-ui/Anchor/style.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"style.mjs","names":[],"sources":["../../../src/base-ui/Anchor/style.ts"],"sourcesContent":["import { createStaticStyles } from 'antd-style';\r\n\nimport { brandCssVar } from '@/styles/brandCssVar';\n\r\nexport const styles = createStaticStyles(({ css, cssVar }) => ({\r\n  link: css`\r\n    overflow: hidden;\r\n    display: -webkit-box;\r\n    -webkit-box-orient: vertical;\r\n    -webkit-line-clamp: 2;\r\n\r\n    font-size: 14px;\r\n    line-height: 1.4;\r\n    color: ${cssVar.colorTextSecondary};\r\n    overflow-wrap: anywhere;\r\n\r\n    transition: color 0.15s ease;\r\n\r\n    &:hover {\r\n      color: ${cssVar.colorText};\r\n    }\r\n\r\n    &[aria-current='location'] {\r\n      font-weight: 500;\r\n      color: ${cssVar.colorText};\r\n    }\r\n\r\n    &:focus-visible {\r\n      border-radius: 4px;\r\n      outline: 2px solid ${brandCssVar.colorBrand};\r\n      outline-offset: 2px;\r\n    }\r\n  `,\r\n  list: css`\r\n    display: flex;\r\n    flex-direction: column;\r\n    gap: 8px;\r\n\r\n    margin: 0;\r\n    padding-block: 0;\r\n    padding-inline: 14px 0;\r\n    border-inline-start: 1px solid ${cssVar.colorBorderSecondary};\r\n\r\n    list-style: none;\r\n\r\n    & & {\r\n      margin-block-start: 8px;\r\n      padding-inline-start: 12px;\r\n      border-inline-start: none;\r\n\r\n      a {\r\n        font-size: 13px;\r\n      }\r\n    }\r\n  `,\r\n  marker: css`\r\n    pointer-events: none;\r\n\r\n    position: absolute;\r\n    inset-inline-start: -1px;\r\n\r\n    width: 2px;\r\n    border-radius: 2px;\r\n\r\n    background: ${cssVar.colorText};\r\n\r\n    transition:\r\n      inset-block-start 0.2s ${cssVar.motionEaseOut},\r\n      height 0.2s ${cssVar.motionEaseOut};\r\n\r\n    @media (prefers-reduced-motion: reduce) {\r\n      transition: none;\r\n    }\r\n  `,\r\n  root: css`\r\n    position: relative;\r\n  `,\r\n}));\r\n"],"mappings":";;;AAIA,MAAa,SAAS,oBAAoB,EAAE,KAAK,cAAc;CAC7D,MAAM,GAAG;;;;;;;;aAQE,OAAO,mBAAmB;;;;;;eAMxB,OAAO,UAAU;;;;;eAKjB,OAAO,UAAU;;;;;2BAKL,YAAY,WAAW;;;;CAIhD,MAAM,GAAG;;;;;;;;qCAQ0B,OAAO,qBAAqB;;;;;;;;;;;;;;CAc/D,QAAQ,GAAG;;;;;;;;;kBASK,OAAO,UAAU;;;+BAGJ,OAAO,cAAc;oBAChC,OAAO,cAAc;;;;;;CAMvC,MAAM,GAAG;;;AAGX,EAAE"}
+{"version":3,"file":"style.mjs","names":[],"sources":["../../../src/base-ui/Anchor/style.ts"],"sourcesContent":["import { createStaticStyles } from 'antd-style';\n\nimport { brandCssVar } from '@/styles/brandCssVar';\n\nexport const styles = createStaticStyles(({ css, cssVar }) => ({\n  link: css`\n    overflow: hidden;\n    display: -webkit-box;\n    -webkit-box-orient: vertical;\n    -webkit-line-clamp: 2;\n\n    font-size: 14px;\n    line-height: 1.4;\n    color: ${cssVar.colorTextSecondary};\n    overflow-wrap: anywhere;\n\n    transition: color 0.15s ease;\n\n    &:hover {\n      color: ${cssVar.colorText};\n    }\n\n    &[aria-current='location'] {\n      font-weight: 500;\n      color: ${cssVar.colorText};\n    }\n\n    &:focus-visible {\n      border-radius: 4px;\n      outline: 2px solid ${brandCssVar.colorBrand};\n      outline-offset: 2px;\n    }\n  `,\n  list: css`\n    display: flex;\n    flex-direction: column;\n    gap: 8px;\n\n    margin: 0;\n    padding-block: 0;\n    padding-inline: 14px 0;\n    border-inline-start: 1px solid ${cssVar.colorBorderSecondary};\n\n    list-style: none;\n\n    & & {\n      margin-block-start: 8px;\n      padding-inline-start: 12px;\n      border-inline-start: none;\n\n      a {\n        font-size: 13px;\n      }\n    }\n  `,\n  marker: css`\n    pointer-events: none;\n\n    position: absolute;\n    inset-inline-start: -1px;\n\n    width: 2px;\n    border-radius: 2px;\n\n    background: ${cssVar.colorText};\n\n    transition:\n      inset-block-start 0.2s ${cssVar.motionEaseOut},\n      height 0.2s ${cssVar.motionEaseOut};\n\n    @media (prefers-reduced-motion: reduce) {\n      transition: none;\n    }\n  `,\n  root: css`\n    position: relative;\n  `,\n}));\n"],"mappings":";;;AAIA,MAAa,SAAS,oBAAoB,EAAE,KAAK,cAAc;CAC7D,MAAM,GAAG;;;;;;;;aAQE,OAAO,mBAAmB;;;;;;eAMxB,OAAO,UAAU;;;;;eAKjB,OAAO,UAAU;;;;;2BAKL,YAAY,WAAW;;;;CAIhD,MAAM,GAAG;;;;;;;;qCAQ0B,OAAO,qBAAqB;;;;;;;;;;;;;;CAc/D,QAAQ,GAAG;;;;;;;;;kBASK,OAAO,UAAU;;;+BAGJ,OAAO,cAAc;oBAChC,OAAO,cAAc;;;;;;CAMvC,MAAM,GAAG;;;AAGX,EAAE"}

package/es/base-ui/Button/SplitButton.mjs

@@ -1,4 +1,5 @@
 "use client";
+import { inkCssVar } from "../../styles/inkCssVar.mjs";
 import Button from "./Button.mjs";
 import DropdownMenu from "../DropdownMenu/DropdownMenu.mjs";
 import { createContext, use, useMemo } from "react";
@@ -44,13 +45,13 @@ const styles = createStaticStyles(({ css, cssVar }) => ({
   `,
 	solidPrimary: css`
     &:has(> :where(button, a):hover:not(:disabled, [aria-disabled='true'])) > :where(button, a) {
-      border-color: ${cssVar.colorPrimaryHover};
-      background: ${cssVar.colorPrimaryHover};
+      border-color: ${inkCssVar.colorInkHover};
+      background: ${inkCssVar.colorInkHover};
     }
 
     &:has(> :where(button, a):active:not(:disabled, [aria-disabled='true'])) > :where(button, a) {
-      border-color: ${cssVar.colorPrimaryActive};
-      background: ${cssVar.colorPrimaryActive};
+      border-color: ${inkCssVar.colorInkActive};
+      background: ${inkCssVar.colorInkActive};
     }
   `,
 	splitButton: css`

package/es/base-ui/Button/SplitButton.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"SplitButton.mjs","names":[],"sources":["../../../src/base-ui/Button/SplitButton.tsx"],"sourcesContent":["'use client';\r\n\r\nimport { createStaticStyles, cx } from 'antd-style';\r\nimport { ChevronDownIcon } from 'lucide-react';\r\nimport { createContext, type CSSProperties, type ReactNode, use, useMemo } from 'react';\r\n\r\nimport { DropdownMenu, type DropdownMenuProps } from '@/base-ui/DropdownMenu';\r\n\r\nimport Button from './Button';\r\nimport type { ButtonProps } from './type';\r\n\r\ninterface SharedVisualProps {\r\n  danger?: boolean;\r\n  disabled?: boolean;\r\n  loading?: boolean;\r\n  size?: ButtonProps['size'];\r\n  type?: ButtonProps['type'];\r\n}\r\n\r\ninterface SplitButtonProps extends SharedVisualProps {\r\n  children: ReactNode;\r\n  className?: string;\r\n  style?: CSSProperties;\r\n}\r\n\r\nconst SplitButtonContext = createContext<SharedVisualProps>({});\r\n\r\nconst styles = createStaticStyles(({ css, cssVar }) => ({\r\n  interactionDisabled: css`\r\n    opacity: 0.5;\r\n\r\n    & > :where(button, a):disabled,\r\n    & > :where(button, a)[aria-disabled='true'] {\r\n      opacity: 1;\r\n    }\r\n  `,\r\n  solid: css`\r\n    & > :where(button, a):last-of-type::before {\r\n      pointer-events: none;\r\n      content: '';\r\n\r\n      position: absolute;\r\n      inset-block: 0;\r\n      inset-inline-start: 0;\r\n\r\n      width: 1px;\r\n\r\n      opacity: 0.2;\r\n      background: currentcolor;\r\n    }\r\n  `,\r\n  solidDanger: css`\r\n    &:has(> :where(button, a):hover:not(:disabled, [aria-disabled='true'])) > :where(button, a) {\r\n      border-color: ${cssVar.colorErrorHover};\r\n      background: ${cssVar.colorErrorHover};\r\n    }\r\n\r\n    &:has(> :where(button, a):active:not(:disabled, [aria-disabled='true'])) > :where(button, a) {\r\n      border-color: ${cssVar.colorErrorActive};\r\n      background: ${cssVar.colorErrorActive};\r\n    }\r\n  `,\r\n  solidPrimary: css`\r\n    &:has(> :where(button, a):hover:not(:disabled, [aria-disabled='true'])) > :where(button, a) {\r\n      border-color: ${cssVar.colorPrimaryHover};\r\n      background: ${cssVar.colorPrimaryHover};\r\n    }\r\n\r\n    &:has(> :where(button, a):active:not(:disabled, [aria-disabled='true'])) > :where(button, a) {\r\n      border-color: ${cssVar.colorPrimaryActive};\r\n      background: ${cssVar.colorPrimaryActive};\r\n    }\r\n  `,\r\n  splitButton: css`\r\n    display: inline-flex;\r\n    flex-direction: row;\r\n\r\n    & > :where(button, a):first-of-type {\r\n      border-start-end-radius: 0;\r\n      border-end-end-radius: 0;\r\n    }\r\n\r\n    & > :where(button, a):last-of-type {\r\n      margin-inline-start: -1px;\r\n      border-start-start-radius: 0;\r\n      border-end-start-radius: 0;\r\n    }\r\n  `,\r\n}));\r\n\r\nconst SplitButton = ({\r\n  children,\r\n  className,\r\n  style,\r\n  danger,\r\n  disabled,\r\n  loading,\r\n  size,\r\n  type,\r\n}: SplitButtonProps) => {\r\n  const shared = useMemo<SharedVisualProps>(\r\n    () => ({ danger, disabled, loading, size, type }),\r\n    [danger, disabled, loading, size, type],\r\n  );\r\n  return (\r\n    <SplitButtonContext value={shared}>\r\n      <div\r\n        style={style}\r\n        className={cx(\r\n          styles.splitButton,\r\n          type === 'primary' && styles.solid,\r\n          type === 'primary' && (danger ? styles.solidDanger : styles.solidPrimary),\r\n          (disabled || loading) && styles.interactionDisabled,\r\n          className,\r\n        )}\r\n      >\r\n        {children}\r\n      </div>\r\n    </SplitButtonContext>\r\n  );\r\n};\r\n\r\nconst SplitButtonMain = (props: ButtonProps) => {\r\n  const shared = use(SplitButtonContext);\r\n  return <Button {...shared} {...props} />;\r\n};\r\n\r\ninterface SplitButtonMenuProps extends Omit<DropdownMenuProps, 'children'> {\r\n  icon?: ReactNode;\r\n}\r\n\r\nconst SplitButtonMenu = ({\r\n  icon = <ChevronDownIcon size={14} />,\r\n  disabled,\r\n  ...menuProps\r\n}: SplitButtonMenuProps) => {\r\n  const shared = use(SplitButtonContext);\r\n  const interactionDisabled = disabled || shared.disabled || shared.loading;\r\n\r\n  return (\r\n    <DropdownMenu {...menuProps} disabled={interactionDisabled}>\r\n      <Button {...shared} disabled={interactionDisabled} icon={icon} />\r\n    </DropdownMenu>\r\n  );\r\n};\r\n\r\ntype SplitButtonComponent = typeof SplitButton & {\r\n  Main: typeof SplitButtonMain;\r\n  Menu: typeof SplitButtonMenu;\r\n};\r\n\r\n(SplitButton as SplitButtonComponent).Main = SplitButtonMain;\r\n(SplitButton as SplitButtonComponent).Menu = SplitButtonMenu;\r\n\r\nexport type { SplitButtonMenuProps, SplitButtonProps };\r\nexport default SplitButton as SplitButtonComponent;\r\n"],"mappings":";;;;;;;;AAyBA,MAAM,qBAAqB,cAAiC,CAAC,CAAC;AAE9D,MAAM,SAAS,oBAAoB,EAAE,KAAK,cAAc;CACtD,qBAAqB,GAAG;;;;;;;;CAQxB,OAAO,GAAG;;;;;;;;;;;;;;;CAeV,aAAa,GAAG;;sBAEI,OAAO,gBAAgB;oBACzB,OAAO,gBAAgB;;;;sBAIrB,OAAO,iBAAiB;oBAC1B,OAAO,iBAAiB;;;CAG1C,cAAc,GAAG;;sBAEG,OAAO,kBAAkB;oBAC3B,OAAO,kBAAkB;;;;sBAIvB,OAAO,mBAAmB;oBAC5B,OAAO,mBAAmB;;;CAG5C,aAAa,GAAG;;;;;;;;;;;;;;;AAelB,EAAE;AAEF,MAAM,eAAe,EACnB,UACA,WACA,OACA,QACA,UACA,SACA,MACA,WACsB;CACtB,MAAM,SAAS,eACN;EAAE;EAAQ;EAAU;EAAS;EAAM;CAAK,IAC/C;EAAC;EAAQ;EAAU;EAAS;EAAM;CAAI,CACxC;CACA,OACE,oBAAC,oBAAD;EAAoB,OAAO;EACzB,UAAA,oBAAC,OAAD;GACS;GACP,WAAW,GACT,OAAO,aACP,SAAS,aAAa,OAAO,OAC7B,SAAS,cAAc,SAAS,OAAO,cAAc,OAAO,gBAC3D,YAAY,YAAY,OAAO,qBAChC,SACF;GAEC;EACE,CAAA;CACa,CAAA;AAExB;AAEA,MAAM,mBAAmB,UAAuB;CAC9C,MAAM,SAAS,IAAI,kBAAkB;CACrC,OAAO,oBAAC,QAAD;EAAQ,GAAI;EAAQ,GAAI;CAAQ,CAAA;AACzC;AAMA,MAAM,mBAAmB,EACvB,OAAO,oBAAC,iBAAD,EAAiB,MAAM,GAAK,CAAA,GACnC,UACA,GAAG,gBACuB;CAC1B,MAAM,SAAS,IAAI,kBAAkB;CACrC,MAAM,sBAAsB,YAAY,OAAO,YAAY,OAAO;CAElE,OACE,oBAAC,cAAD;EAAc,GAAI;EAAW,UAAU;EACrC,UAAA,oBAAC,QAAD;GAAQ,GAAI;GAAQ,UAAU;GAA2B;EAAO,CAAA;CACpD,CAAA;AAElB;AAOA,YAAsC,OAAO;AAC7C,YAAsC,OAAO"}
+{"version":3,"file":"SplitButton.mjs","names":[],"sources":["../../../src/base-ui/Button/SplitButton.tsx"],"sourcesContent":["'use client';\n\nimport { createStaticStyles, cx } from 'antd-style';\nimport { ChevronDownIcon } from 'lucide-react';\nimport { createContext, type CSSProperties, type ReactNode, use, useMemo } from 'react';\n\nimport { DropdownMenu, type DropdownMenuProps } from '@/base-ui/DropdownMenu';\nimport { inkCssVar } from '@/styles/inkCssVar';\n\nimport Button from './Button';\nimport type { ButtonProps } from './type';\n\ninterface SharedVisualProps {\n  danger?: boolean;\n  disabled?: boolean;\n  loading?: boolean;\n  size?: ButtonProps['size'];\n  type?: ButtonProps['type'];\n}\n\ninterface SplitButtonProps extends SharedVisualProps {\n  children: ReactNode;\n  className?: string;\n  style?: CSSProperties;\n}\n\nconst SplitButtonContext = createContext<SharedVisualProps>({});\n\nconst styles = createStaticStyles(({ css, cssVar }) => ({\n  interactionDisabled: css`\n    opacity: 0.5;\n\n    & > :where(button, a):disabled,\n    & > :where(button, a)[aria-disabled='true'] {\n      opacity: 1;\n    }\n  `,\n  solid: css`\n    & > :where(button, a):last-of-type::before {\n      pointer-events: none;\n      content: '';\n\n      position: absolute;\n      inset-block: 0;\n      inset-inline-start: 0;\n\n      width: 1px;\n\n      opacity: 0.2;\n      background: currentcolor;\n    }\n  `,\n  solidDanger: css`\n    &:has(> :where(button, a):hover:not(:disabled, [aria-disabled='true'])) > :where(button, a) {\n      border-color: ${cssVar.colorErrorHover};\n      background: ${cssVar.colorErrorHover};\n    }\n\n    &:has(> :where(button, a):active:not(:disabled, [aria-disabled='true'])) > :where(button, a) {\n      border-color: ${cssVar.colorErrorActive};\n      background: ${cssVar.colorErrorActive};\n    }\n  `,\n  solidPrimary: css`\n    &:has(> :where(button, a):hover:not(:disabled, [aria-disabled='true'])) > :where(button, a) {\n      border-color: ${inkCssVar.colorInkHover};\n      background: ${inkCssVar.colorInkHover};\n    }\n\n    &:has(> :where(button, a):active:not(:disabled, [aria-disabled='true'])) > :where(button, a) {\n      border-color: ${inkCssVar.colorInkActive};\n      background: ${inkCssVar.colorInkActive};\n    }\n  `,\n  splitButton: css`\n    display: inline-flex;\n    flex-direction: row;\n\n    & > :where(button, a):first-of-type {\n      border-start-end-radius: 0;\n      border-end-end-radius: 0;\n    }\n\n    & > :where(button, a):last-of-type {\n      margin-inline-start: -1px;\n      border-start-start-radius: 0;\n      border-end-start-radius: 0;\n    }\n  `,\n}));\n\nconst SplitButton = ({\n  children,\n  className,\n  style,\n  danger,\n  disabled,\n  loading,\n  size,\n  type,\n}: SplitButtonProps) => {\n  const shared = useMemo<SharedVisualProps>(\n    () => ({ danger, disabled, loading, size, type }),\n    [danger, disabled, loading, size, type],\n  );\n  return (\n    <SplitButtonContext value={shared}>\n      <div\n        style={style}\n        className={cx(\n          styles.splitButton,\n          type === 'primary' && styles.solid,\n          type === 'primary' && (danger ? styles.solidDanger : styles.solidPrimary),\n          (disabled || loading) && styles.interactionDisabled,\n          className,\n        )}\n      >\n        {children}\n      </div>\n    </SplitButtonContext>\n  );\n};\n\nconst SplitButtonMain = (props: ButtonProps) => {\n  const shared = use(SplitButtonContext);\n  return <Button {...shared} {...props} />;\n};\n\ninterface SplitButtonMenuProps extends Omit<DropdownMenuProps, 'children'> {\n  icon?: ReactNode;\n}\n\nconst SplitButtonMenu = ({\n  icon = <ChevronDownIcon size={14} />,\n  disabled,\n  ...menuProps\n}: SplitButtonMenuProps) => {\n  const shared = use(SplitButtonContext);\n  const interactionDisabled = disabled || shared.disabled || shared.loading;\n\n  return (\n    <DropdownMenu {...menuProps} disabled={interactionDisabled}>\n      <Button {...shared} disabled={interactionDisabled} icon={icon} />\n    </DropdownMenu>\n  );\n};\n\ntype SplitButtonComponent = typeof SplitButton & {\n  Main: typeof SplitButtonMain;\n  Menu: typeof SplitButtonMenu;\n};\n\n(SplitButton as SplitButtonComponent).Main = SplitButtonMain;\n(SplitButton as SplitButtonComponent).Menu = SplitButtonMenu;\n\nexport type { SplitButtonMenuProps, SplitButtonProps };\nexport default SplitButton as SplitButtonComponent;\n"],"mappings":";;;;;;;;;AA0BA,MAAM,qBAAqB,cAAiC,CAAC,CAAC;AAE9D,MAAM,SAAS,oBAAoB,EAAE,KAAK,cAAc;CACtD,qBAAqB,GAAG;;;;;;;;CAQxB,OAAO,GAAG;;;;;;;;;;;;;;;CAeV,aAAa,GAAG;;sBAEI,OAAO,gBAAgB;oBACzB,OAAO,gBAAgB;;;;sBAIrB,OAAO,iBAAiB;oBAC1B,OAAO,iBAAiB;;;CAG1C,cAAc,GAAG;;sBAEG,UAAU,cAAc;oBAC1B,UAAU,cAAc;;;;sBAItB,UAAU,eAAe;oBAC3B,UAAU,eAAe;;;CAG3C,aAAa,GAAG;;;;;;;;;;;;;;;AAelB,EAAE;AAEF,MAAM,eAAe,EACnB,UACA,WACA,OACA,QACA,UACA,SACA,MACA,WACsB;CACtB,MAAM,SAAS,eACN;EAAE;EAAQ;EAAU;EAAS;EAAM;CAAK,IAC/C;EAAC;EAAQ;EAAU;EAAS;EAAM;CAAI,CACxC;CACA,OACE,oBAAC,oBAAD;EAAoB,OAAO;EACzB,UAAA,oBAAC,OAAD;GACS;GACP,WAAW,GACT,OAAO,aACP,SAAS,aAAa,OAAO,OAC7B,SAAS,cAAc,SAAS,OAAO,cAAc,OAAO,gBAC3D,YAAY,YAAY,OAAO,qBAChC,SACF;GAEC;EACE,CAAA;CACa,CAAA;AAExB;AAEA,MAAM,mBAAmB,UAAuB;CAC9C,MAAM,SAAS,IAAI,kBAAkB;CACrC,OAAO,oBAAC,QAAD;EAAQ,GAAI;EAAQ,GAAI;CAAQ,CAAA;AACzC;AAMA,MAAM,mBAAmB,EACvB,OAAO,oBAAC,iBAAD,EAAiB,MAAM,GAAK,CAAA,GACnC,UACA,GAAG,gBACuB;CAC1B,MAAM,SAAS,IAAI,kBAAkB;CACrC,MAAM,sBAAsB,YAAY,OAAO,YAAY,OAAO;CAElE,OACE,oBAAC,cAAD;EAAc,GAAI;EAAW,UAAU;EACrC,UAAA,oBAAC,QAAD;GAAQ,GAAI;GAAQ,UAAU;GAA2B;EAAO,CAAA;CACpD,CAAA;AAElB;AAOA,YAAsC,OAAO;AAC7C,YAAsC,OAAO"}

package/es/base-ui/Button/style.mjs

@@ -1,3 +1,4 @@
+import { inkCssVar } from "../../styles/inkCssVar.mjs";
 import { controlHeight } from "../controlSize.mjs";
 import { focusRing } from "../focusRing.mjs";
 import { createStaticStyles } from "antd-style";
@@ -144,29 +145,29 @@ const styles = createStaticStyles(({ css, cssVar }) => ({
     }
   `,
 	variantPrimary: css`
-    border-color: ${cssVar.colorPrimary};
-    background: ${cssVar.colorPrimary};
+    border-color: ${inkCssVar.colorInk};
+    background: ${inkCssVar.colorInk};
 
     &,
     &:hover,
     &:active {
-      color: ${cssVar.colorBgLayout};
+      color: ${inkCssVar.colorInkText};
     }
 
     &:hover:not(:disabled, [aria-disabled='true']) {
-      border-color: ${cssVar.colorPrimaryHover};
-      background: ${cssVar.colorPrimaryHover};
+      border-color: ${inkCssVar.colorInkHover};
+      background: ${inkCssVar.colorInkHover};
     }
 
     &:active:not(:disabled, [aria-disabled='true']) {
-      border-color: ${cssVar.colorPrimaryActive};
-      background: ${cssVar.colorPrimaryActive};
+      border-color: ${inkCssVar.colorInkActive};
+      background: ${inkCssVar.colorInkActive};
     }
 
     /* triple-class specificity so the global popup-open trigger highlight cannot wash out a solid button */
     &&&[data-popup-open] {
-      border-color: ${cssVar.colorPrimaryActive};
-      background: ${cssVar.colorPrimaryActive};
+      border-color: ${inkCssVar.colorInkActive};
+      background: ${inkCssVar.colorInkActive};
     }
   `,
 	variantDashed: css`

package/es/base-ui/Button/style.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"style.mjs","names":[],"sources":["../../../src/base-ui/Button/style.ts"],"sourcesContent":["import { createStaticStyles } from 'antd-style';\r\n\r\nimport { controlHeight } from '@/base-ui/controlSize';\r\nimport { focusRing } from '@/base-ui/focusRing';\r\n\r\nexport const buttonPaddingInline = {\r\n  large: 16,\r\n  middle: 14,\r\n  small: 8,\r\n} as const;\r\n\r\nexport const styles = createStaticStyles(({ css, cssVar }) => ({\r\n  base: css`\r\n    cursor: pointer;\r\n\r\n    position: relative;\r\n\r\n    display: inline-flex;\r\n    gap: 6px;\r\n    align-items: center;\r\n    justify-content: center;\r\n\r\n    box-sizing: border-box;\r\n    border: 1px solid ${cssVar.colorBorder};\r\n\r\n    font-weight: 500;\r\n    line-height: 1;\r\n    text-decoration: none;\r\n    white-space: nowrap;\r\n\r\n    transition:\r\n      color 160ms cubic-bezier(0.32, 0.72, 0, 1),\r\n      background 160ms cubic-bezier(0.32, 0.72, 0, 1),\r\n      border-color 160ms cubic-bezier(0.32, 0.72, 0, 1),\r\n      box-shadow 160ms cubic-bezier(0.32, 0.72, 0, 1);\r\n\r\n    ${focusRing};\r\n\r\n    &:disabled,\r\n    &[aria-disabled='true'] {\r\n      pointer-events: none;\r\n      cursor: not-allowed;\r\n      opacity: 0.5;\r\n    }\r\n  `,\r\n\r\n  sizeSmall: css`\r\n    --button-padding-inline: ${buttonPaddingInline.small}px;\r\n\r\n    height: ${controlHeight.small}px;\r\n    padding-inline: var(--button-padding-inline);\r\n    border-radius: ${cssVar.borderRadiusSM};\r\n    font-size: 12px;\r\n  `,\r\n\r\n  sizeMiddle: css`\r\n    --button-padding-inline: ${buttonPaddingInline.middle}px;\r\n\r\n    height: ${controlHeight.middle}px;\r\n    padding-inline: var(--button-padding-inline);\r\n    border-radius: ${cssVar.borderRadiusSM};\r\n    font-size: 13px;\r\n  `,\r\n\r\n  sizeLarge: css`\r\n    --button-padding-inline: ${buttonPaddingInline.large}px;\r\n\r\n    height: ${controlHeight.large}px;\r\n    padding-inline: var(--button-padding-inline);\r\n    border-radius: ${cssVar.borderRadius};\r\n    font-size: 14px;\r\n  `,\r\n\r\n  outdentStart: css`\r\n    margin-inline-start: calc(var(--button-padding-inline) * -1);\r\n  `,\r\n\r\n  outdentEnd: css`\r\n    margin-inline-end: calc(var(--button-padding-inline) * -1);\r\n  `,\r\n\r\n  shapeCircle: css`\r\n    padding-inline: 0;\r\n    border-radius: 50%;\r\n  `,\r\n\r\n  shapeRound: css`\r\n    border-radius: 999px;\r\n  `,\r\n\r\n  block: css`\r\n    width: 100%;\r\n  `,\r\n\r\n  iconEnd: css`\r\n    flex-direction: row-reverse;\r\n  `,\r\n\r\n  iconOnlySmall: css`\r\n    --button-padding-inline: 0px;\r\n\r\n    width: 24px;\r\n    padding-inline: 0;\r\n  `,\r\n\r\n  iconOnlyMiddle: css`\r\n    --button-padding-inline: 0px;\r\n\r\n    width: 32px;\r\n    padding-inline: 0;\r\n  `,\r\n\r\n  iconOnlyLarge: css`\r\n    --button-padding-inline: 0px;\r\n\r\n    width: 40px;\r\n    padding-inline: 0;\r\n  `,\r\n\r\n  iconBox: css`\r\n    display: inline-flex;\r\n    align-items: center;\r\n    justify-content: center;\r\n  `,\r\n\r\n  spinnerSlot: css`\r\n    overflow: hidden;\r\n\r\n    width: 0;\r\n    margin-inline-end: -6px;\r\n\r\n    opacity: 0;\r\n\r\n    transition:\r\n      width 380ms cubic-bezier(0.22, 1, 0.36, 1),\r\n      margin 380ms cubic-bezier(0.22, 1, 0.36, 1),\r\n      opacity 260ms cubic-bezier(0.22, 1, 0.36, 1);\r\n  `,\r\n\r\n  spinnerSlotEnd: css`\r\n    margin-inline: -6px 0;\r\n  `,\r\n\r\n  spinnerSlotShow: css`\r\n    width: 12px;\r\n    margin-inline: 0;\r\n    opacity: 1;\r\n  `,\r\n\r\n  variantDefault: css`\r\n    background: ${cssVar.colorBgContainer};\r\n\r\n    /* &:hover/&:active included so the anchor form outranks antd's global a:hover/a:active link color */\r\n    &,\r\n    &:hover,\r\n    &:active {\r\n      color: ${cssVar.colorText};\r\n    }\r\n\r\n    &:hover:not(:disabled, [aria-disabled='true']) {\r\n      border-color: ${cssVar.colorPrimaryBorder};\r\n      color: ${cssVar.colorPrimaryText};\r\n    }\r\n  `,\r\n\r\n  variantPrimary: css`\r\n    border-color: ${cssVar.colorPrimary};\r\n    background: ${cssVar.colorPrimary};\r\n\r\n    &,\r\n    &:hover,\r\n    &:active {\r\n      color: ${cssVar.colorBgLayout};\r\n    }\r\n\r\n    &:hover:not(:disabled, [aria-disabled='true']) {\r\n      border-color: ${cssVar.colorPrimaryHover};\r\n      background: ${cssVar.colorPrimaryHover};\r\n    }\r\n\r\n    &:active:not(:disabled, [aria-disabled='true']) {\r\n      border-color: ${cssVar.colorPrimaryActive};\r\n      background: ${cssVar.colorPrimaryActive};\r\n    }\r\n\r\n    /* triple-class specificity so the global popup-open trigger highlight cannot wash out a solid button */\r\n    &&&[data-popup-open] {\r\n      border-color: ${cssVar.colorPrimaryActive};\r\n      background: ${cssVar.colorPrimaryActive};\r\n    }\r\n  `,\r\n\r\n  variantDashed: css`\r\n    border-style: dashed;\r\n    background: ${cssVar.colorBgContainer};\r\n\r\n    &,\r\n    &:hover,\r\n    &:active {\r\n      color: ${cssVar.colorText};\r\n    }\r\n\r\n    &:hover:not(:disabled, [aria-disabled='true']) {\r\n      border-color: ${cssVar.colorPrimaryBorder};\r\n      color: ${cssVar.colorPrimaryText};\r\n    }\r\n  `,\r\n\r\n  variantFill: css`\r\n    border-color: transparent;\r\n    background: ${cssVar.colorFillTertiary};\r\n\r\n    &,\r\n    &:hover,\r\n    &:active {\r\n      color: ${cssVar.colorText};\r\n    }\r\n\r\n    &:hover:not(:disabled, [aria-disabled='true']) {\r\n      background: ${cssVar.colorFillSecondary};\r\n    }\r\n\r\n    &:active:not(:disabled, [aria-disabled='true']) {\r\n      background: ${cssVar.colorFill};\r\n    }\r\n  `,\r\n\r\n  variantText: css`\r\n    border-color: transparent;\r\n    background: transparent;\r\n\r\n    &,\r\n    &:hover,\r\n    &:active {\r\n      color: ${cssVar.colorText};\r\n    }\r\n\r\n    &:hover:not(:disabled, [aria-disabled='true']) {\r\n      background: ${cssVar.colorFillSecondary};\r\n    }\r\n  `,\r\n\r\n  variantLink: css`\r\n    padding-inline: 0;\r\n    border-color: transparent;\r\n    background: transparent;\r\n\r\n    &,\r\n    &:hover,\r\n    &:active {\r\n      color: ${cssVar.colorPrimary};\r\n    }\r\n\r\n    &:hover:not(:disabled, [aria-disabled='true']) {\r\n      color: ${cssVar.colorPrimaryHover};\r\n      background: transparent;\r\n    }\r\n  `,\r\n\r\n  dangerOutlined: css`\r\n    border-color: ${cssVar.colorError};\r\n    background: ${cssVar.colorBgContainer};\r\n\r\n    &,\r\n    &:hover,\r\n    &:active {\r\n      color: ${cssVar.colorError};\r\n    }\r\n\r\n    &:hover:not(:disabled, [aria-disabled='true']) {\r\n      border-color: ${cssVar.colorErrorHover};\r\n      color: ${cssVar.colorErrorHover};\r\n      background: ${cssVar.colorBgContainer};\r\n    }\r\n  `,\r\n\r\n  dangerSolid: css`\r\n    border-color: ${cssVar.colorError};\r\n    background: ${cssVar.colorError};\r\n\r\n    &,\r\n    &:hover,\r\n    &:active {\r\n      color: ${cssVar.colorBgLayout};\r\n    }\r\n\r\n    &:hover:not(:disabled, [aria-disabled='true']) {\r\n      border-color: ${cssVar.colorErrorHover};\r\n      background: ${cssVar.colorErrorHover};\r\n    }\r\n\r\n    &:active:not(:disabled, [aria-disabled='true']) {\r\n      border-color: ${cssVar.colorErrorActive};\r\n      background: ${cssVar.colorErrorActive};\r\n    }\r\n\r\n    &&&[data-popup-open] {\r\n      border-color: ${cssVar.colorErrorActive};\r\n      background: ${cssVar.colorErrorActive};\r\n    }\r\n  `,\r\n\r\n  dangerFill: css`\r\n    border-color: transparent;\r\n    color: ${cssVar.colorError};\r\n    background: ${cssVar.colorErrorBg};\r\n\r\n    &:hover:not(:disabled, [aria-disabled='true']) {\r\n      color: ${cssVar.colorErrorHover};\r\n      background: ${cssVar.colorErrorBgHover};\r\n    }\r\n\r\n    &:active:not(:disabled, [aria-disabled='true']) {\r\n      color: ${cssVar.colorErrorActive};\r\n      background: ${cssVar.colorErrorBgHover};\r\n    }\r\n  `,\r\n\r\n  dangerInline: css`\r\n    &,\r\n    &:hover,\r\n    &:active {\r\n      color: ${cssVar.colorError};\r\n    }\r\n\r\n    &:hover:not(:disabled, [aria-disabled='true']) {\r\n      color: ${cssVar.colorErrorHover};\r\n    }\r\n  `,\r\n\r\n  ghostDefault: css`\r\n    border-color: transparent;\r\n    background: transparent;\r\n\r\n    &,\r\n    &:hover,\r\n    &:active {\r\n      color: ${cssVar.colorText};\r\n    }\r\n\r\n    &:hover:not(:disabled, [aria-disabled='true']) {\r\n      background: ${cssVar.colorFillSecondary};\r\n    }\r\n\r\n    &:active:not(:disabled, [aria-disabled='true']) {\r\n      background: ${cssVar.colorFill};\r\n    }\r\n  `,\r\n\r\n  ghostPrimary: css`\r\n    border-color: transparent;\r\n    background: transparent;\r\n\r\n    &,\r\n    &:hover,\r\n    &:active {\r\n      color: ${cssVar.colorPrimary};\r\n    }\r\n\r\n    &:hover:not(:disabled, [aria-disabled='true']) {\r\n      color: ${cssVar.colorPrimaryHover};\r\n      background: ${cssVar.colorFillSecondary};\r\n    }\r\n\r\n    &:active:not(:disabled, [aria-disabled='true']) {\r\n      color: ${cssVar.colorPrimaryActive};\r\n      background: ${cssVar.colorFill};\r\n    }\r\n  `,\r\n\r\n  ghostDanger: css`\r\n    border-color: transparent;\r\n    background: transparent;\r\n\r\n    &,\r\n    &:hover,\r\n    &:active {\r\n      color: ${cssVar.colorError};\r\n    }\r\n\r\n    &:hover:not(:disabled, [aria-disabled='true']) {\r\n      color: ${cssVar.colorErrorHover};\r\n      background: ${cssVar.colorFillSecondary};\r\n    }\r\n\r\n    &:active:not(:disabled, [aria-disabled='true']) {\r\n      color: ${cssVar.colorErrorActive};\r\n      background: ${cssVar.colorFill};\r\n    }\r\n  `,\r\n\r\n  spinner: css`\r\n    @keyframes base-button-spin {\r\n      to {\r\n        transform: rotate(360deg);\r\n      }\r\n    }\r\n\r\n    display: inline-block;\r\n\r\n    width: 12px;\r\n    height: 12px;\r\n    border: 1.5px solid currentcolor;\r\n    border-block-start-color: transparent;\r\n    border-radius: 50%;\r\n\r\n    animation: base-button-spin 0.6s linear infinite;\r\n  `,\r\n}));\r\n"],"mappings":"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"}
+{"version":3,"file":"style.mjs","names":[],"sources":["../../../src/base-ui/Button/style.ts"],"sourcesContent":["import { createStaticStyles } from 'antd-style';\n\nimport { controlHeight } from '@/base-ui/controlSize';\nimport { focusRing } from '@/base-ui/focusRing';\nimport { inkCssVar } from '@/styles/inkCssVar';\n\nexport const buttonPaddingInline = {\n  large: 16,\n  middle: 14,\n  small: 8,\n} as const;\n\nexport const styles = createStaticStyles(({ css, cssVar }) => ({\n  base: css`\n    cursor: pointer;\n\n    position: relative;\n\n    display: inline-flex;\n    gap: 6px;\n    align-items: center;\n    justify-content: center;\n\n    box-sizing: border-box;\n    border: 1px solid ${cssVar.colorBorder};\n\n    font-weight: 500;\n    line-height: 1;\n    text-decoration: none;\n    white-space: nowrap;\n\n    transition:\n      color 160ms cubic-bezier(0.32, 0.72, 0, 1),\n      background 160ms cubic-bezier(0.32, 0.72, 0, 1),\n      border-color 160ms cubic-bezier(0.32, 0.72, 0, 1),\n      box-shadow 160ms cubic-bezier(0.32, 0.72, 0, 1);\n\n    ${focusRing};\n\n    &:disabled,\n    &[aria-disabled='true'] {\n      pointer-events: none;\n      cursor: not-allowed;\n      opacity: 0.5;\n    }\n  `,\n\n  sizeSmall: css`\n    --button-padding-inline: ${buttonPaddingInline.small}px;\n\n    height: ${controlHeight.small}px;\n    padding-inline: var(--button-padding-inline);\n    border-radius: ${cssVar.borderRadiusSM};\n    font-size: 12px;\n  `,\n\n  sizeMiddle: css`\n    --button-padding-inline: ${buttonPaddingInline.middle}px;\n\n    height: ${controlHeight.middle}px;\n    padding-inline: var(--button-padding-inline);\n    border-radius: ${cssVar.borderRadiusSM};\n    font-size: 13px;\n  `,\n\n  sizeLarge: css`\n    --button-padding-inline: ${buttonPaddingInline.large}px;\n\n    height: ${controlHeight.large}px;\n    padding-inline: var(--button-padding-inline);\n    border-radius: ${cssVar.borderRadius};\n    font-size: 14px;\n  `,\n\n  outdentStart: css`\n    margin-inline-start: calc(var(--button-padding-inline) * -1);\n  `,\n\n  outdentEnd: css`\n    margin-inline-end: calc(var(--button-padding-inline) * -1);\n  `,\n\n  shapeCircle: css`\n    padding-inline: 0;\n    border-radius: 50%;\n  `,\n\n  shapeRound: css`\n    border-radius: 999px;\n  `,\n\n  block: css`\n    width: 100%;\n  `,\n\n  iconEnd: css`\n    flex-direction: row-reverse;\n  `,\n\n  iconOnlySmall: css`\n    --button-padding-inline: 0px;\n\n    width: 24px;\n    padding-inline: 0;\n  `,\n\n  iconOnlyMiddle: css`\n    --button-padding-inline: 0px;\n\n    width: 32px;\n    padding-inline: 0;\n  `,\n\n  iconOnlyLarge: css`\n    --button-padding-inline: 0px;\n\n    width: 40px;\n    padding-inline: 0;\n  `,\n\n  iconBox: css`\n    display: inline-flex;\n    align-items: center;\n    justify-content: center;\n  `,\n\n  spinnerSlot: css`\n    overflow: hidden;\n\n    width: 0;\n    margin-inline-end: -6px;\n\n    opacity: 0;\n\n    transition:\n      width 380ms cubic-bezier(0.22, 1, 0.36, 1),\n      margin 380ms cubic-bezier(0.22, 1, 0.36, 1),\n      opacity 260ms cubic-bezier(0.22, 1, 0.36, 1);\n  `,\n\n  spinnerSlotEnd: css`\n    margin-inline: -6px 0;\n  `,\n\n  spinnerSlotShow: css`\n    width: 12px;\n    margin-inline: 0;\n    opacity: 1;\n  `,\n\n  variantDefault: css`\n    background: ${cssVar.colorBgContainer};\n\n    /* &:hover/&:active included so the anchor form outranks antd's global a:hover/a:active link color */\n    &,\n    &:hover,\n    &:active {\n      color: ${cssVar.colorText};\n    }\n\n    &:hover:not(:disabled, [aria-disabled='true']) {\n      border-color: ${cssVar.colorPrimaryBorder};\n      color: ${cssVar.colorPrimaryText};\n    }\n  `,\n\n  variantPrimary: css`\n    border-color: ${inkCssVar.colorInk};\n    background: ${inkCssVar.colorInk};\n\n    &,\n    &:hover,\n    &:active {\n      color: ${inkCssVar.colorInkText};\n    }\n\n    &:hover:not(:disabled, [aria-disabled='true']) {\n      border-color: ${inkCssVar.colorInkHover};\n      background: ${inkCssVar.colorInkHover};\n    }\n\n    &:active:not(:disabled, [aria-disabled='true']) {\n      border-color: ${inkCssVar.colorInkActive};\n      background: ${inkCssVar.colorInkActive};\n    }\n\n    /* triple-class specificity so the global popup-open trigger highlight cannot wash out a solid button */\n    &&&[data-popup-open] {\n      border-color: ${inkCssVar.colorInkActive};\n      background: ${inkCssVar.colorInkActive};\n    }\n  `,\n\n  variantDashed: css`\n    border-style: dashed;\n    background: ${cssVar.colorBgContainer};\n\n    &,\n    &:hover,\n    &:active {\n      color: ${cssVar.colorText};\n    }\n\n    &:hover:not(:disabled, [aria-disabled='true']) {\n      border-color: ${cssVar.colorPrimaryBorder};\n      color: ${cssVar.colorPrimaryText};\n    }\n  `,\n\n  variantFill: css`\n    border-color: transparent;\n    background: ${cssVar.colorFillTertiary};\n\n    &,\n    &:hover,\n    &:active {\n      color: ${cssVar.colorText};\n    }\n\n    &:hover:not(:disabled, [aria-disabled='true']) {\n      background: ${cssVar.colorFillSecondary};\n    }\n\n    &:active:not(:disabled, [aria-disabled='true']) {\n      background: ${cssVar.colorFill};\n    }\n  `,\n\n  variantText: css`\n    border-color: transparent;\n    background: transparent;\n\n    &,\n    &:hover,\n    &:active {\n      color: ${cssVar.colorText};\n    }\n\n    &:hover:not(:disabled, [aria-disabled='true']) {\n      background: ${cssVar.colorFillSecondary};\n    }\n  `,\n\n  variantLink: css`\n    padding-inline: 0;\n    border-color: transparent;\n    background: transparent;\n\n    &,\n    &:hover,\n    &:active {\n      color: ${cssVar.colorPrimary};\n    }\n\n    &:hover:not(:disabled, [aria-disabled='true']) {\n      color: ${cssVar.colorPrimaryHover};\n      background: transparent;\n    }\n  `,\n\n  dangerOutlined: css`\n    border-color: ${cssVar.colorError};\n    background: ${cssVar.colorBgContainer};\n\n    &,\n    &:hover,\n    &:active {\n      color: ${cssVar.colorError};\n    }\n\n    &:hover:not(:disabled, [aria-disabled='true']) {\n      border-color: ${cssVar.colorErrorHover};\n      color: ${cssVar.colorErrorHover};\n      background: ${cssVar.colorBgContainer};\n    }\n  `,\n\n  dangerSolid: css`\n    border-color: ${cssVar.colorError};\n    background: ${cssVar.colorError};\n\n    &,\n    &:hover,\n    &:active {\n      color: ${cssVar.colorBgLayout};\n    }\n\n    &:hover:not(:disabled, [aria-disabled='true']) {\n      border-color: ${cssVar.colorErrorHover};\n      background: ${cssVar.colorErrorHover};\n    }\n\n    &:active:not(:disabled, [aria-disabled='true']) {\n      border-color: ${cssVar.colorErrorActive};\n      background: ${cssVar.colorErrorActive};\n    }\n\n    &&&[data-popup-open] {\n      border-color: ${cssVar.colorErrorActive};\n      background: ${cssVar.colorErrorActive};\n    }\n  `,\n\n  dangerFill: css`\n    border-color: transparent;\n    color: ${cssVar.colorError};\n    background: ${cssVar.colorErrorBg};\n\n    &:hover:not(:disabled, [aria-disabled='true']) {\n      color: ${cssVar.colorErrorHover};\n      background: ${cssVar.colorErrorBgHover};\n    }\n\n    &:active:not(:disabled, [aria-disabled='true']) {\n      color: ${cssVar.colorErrorActive};\n      background: ${cssVar.colorErrorBgHover};\n    }\n  `,\n\n  dangerInline: css`\n    &,\n    &:hover,\n    &:active {\n      color: ${cssVar.colorError};\n    }\n\n    &:hover:not(:disabled, [aria-disabled='true']) {\n      color: ${cssVar.colorErrorHover};\n    }\n  `,\n\n  ghostDefault: css`\n    border-color: transparent;\n    background: transparent;\n\n    &,\n    &:hover,\n    &:active {\n      color: ${cssVar.colorText};\n    }\n\n    &:hover:not(:disabled, [aria-disabled='true']) {\n      background: ${cssVar.colorFillSecondary};\n    }\n\n    &:active:not(:disabled, [aria-disabled='true']) {\n      background: ${cssVar.colorFill};\n    }\n  `,\n\n  ghostPrimary: css`\n    border-color: transparent;\n    background: transparent;\n\n    &,\n    &:hover,\n    &:active {\n      color: ${cssVar.colorPrimary};\n    }\n\n    &:hover:not(:disabled, [aria-disabled='true']) {\n      color: ${cssVar.colorPrimaryHover};\n      background: ${cssVar.colorFillSecondary};\n    }\n\n    &:active:not(:disabled, [aria-disabled='true']) {\n      color: ${cssVar.colorPrimaryActive};\n      background: ${cssVar.colorFill};\n    }\n  `,\n\n  ghostDanger: css`\n    border-color: transparent;\n    background: transparent;\n\n    &,\n    &:hover,\n    &:active {\n      color: ${cssVar.colorError};\n    }\n\n    &:hover:not(:disabled, [aria-disabled='true']) {\n      color: ${cssVar.colorErrorHover};\n      background: ${cssVar.colorFillSecondary};\n    }\n\n    &:active:not(:disabled, [aria-disabled='true']) {\n      color: ${cssVar.colorErrorActive};\n      background: ${cssVar.colorFill};\n    }\n  `,\n\n  spinner: css`\n    @keyframes base-button-spin {\n      to {\n        transform: rotate(360deg);\n      }\n    }\n\n    display: inline-block;\n\n    width: 12px;\n    height: 12px;\n    border: 1.5px solid currentcolor;\n    border-block-start-color: transparent;\n    border-radius: 50%;\n\n    animation: base-button-spin 0.6s linear infinite;\n  `,\n}));\n"],"mappings":"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"}

package/es/base-ui/Carousel/style.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"style.mjs","names":[],"sources":["../../../src/base-ui/Carousel/style.ts"],"sourcesContent":["import { createStaticStyles } from 'antd-style';\r\n\nimport { brandCssVar } from '@/styles/brandCssVar';\n\r\nexport const styles = createStaticStyles(({ css, cssVar }) => ({\r\n  arrow: css`\r\n    position: absolute;\r\n    z-index: 1;\r\n    inset-block-start: 50%;\r\n    transform: translateY(-50%);\r\n\r\n    color: ${cssVar.colorText};\r\n\r\n    background: ${cssVar.colorBgContainer};\r\n    box-shadow: 0 1px 4px rgb(0 0 0 / 12%);\r\n  `,\r\n  dot: css`\r\n    cursor: pointer;\r\n\r\n    width: 6px;\r\n    height: 6px;\r\n    padding: 0;\r\n    border: 0;\r\n    border-radius: 999px;\r\n\r\n    background: ${cssVar.colorFill};\r\n\r\n    transition:\r\n      width 0.2s ease,\r\n      background 0.2s ease;\r\n\r\n    &:hover {\r\n      background: ${cssVar.colorTextQuaternary};\r\n    }\r\n\r\n    &[aria-current='true'] {\r\n      width: 18px;\r\n      background: ${cssVar.colorText};\r\n    }\r\n\r\n    &:focus-visible {\r\n      outline: 2px solid ${brandCssVar.colorBrand};\r\n      outline-offset: 2px;\r\n    }\r\n\r\n    @media (prefers-reduced-motion: reduce) {\r\n      transition: none;\r\n    }\r\n  `,\r\n  dots: css`\r\n    display: flex;\r\n    gap: 6px;\r\n    align-items: center;\r\n    justify-content: center;\r\n\r\n    padding-block: 10px;\r\n  `,\r\n  root: css`\r\n    position: relative;\r\n  `,\r\n  slide: css`\r\n    flex: 0 0 100%;\r\n    min-width: 0;\r\n  `,\r\n  track: css`\r\n    display: flex;\r\n    transition: transform 0.4s cubic-bezier(0.2, 0.8, 0.2, 1);\r\n\r\n    @media (prefers-reduced-motion: reduce) {\r\n      transition: none;\r\n    }\r\n  `,\r\n  trackAdaptive: css`\r\n    align-items: flex-start;\r\n  `,\r\n  viewport: css`\r\n    touch-action: pan-y;\r\n    position: relative;\r\n    overflow: hidden;\r\n    transition: height 0.3s ease;\r\n\r\n    @media (prefers-reduced-motion: reduce) {\r\n      transition: none;\r\n    }\r\n  `,\r\n}));\r\n"],"mappings":";;;AAIA,MAAa,SAAS,oBAAoB,EAAE,KAAK,cAAc;CAC7D,OAAO,GAAG;;;;;;aAMC,OAAO,UAAU;;kBAEZ,OAAO,iBAAiB;;;CAGxC,KAAK,GAAG;;;;;;;;;kBASQ,OAAO,UAAU;;;;;;;oBAOf,OAAO,oBAAoB;;;;;oBAK3B,OAAO,UAAU;;;;2BAIV,YAAY,WAAW;;;;;;;;CAQhD,MAAM,GAAG;;;;;;;;CAQT,MAAM,GAAG;;;CAGT,OAAO,GAAG;;;;CAIV,OAAO,GAAG;;;;;;;;CAQV,eAAe,GAAG;;;CAGlB,UAAU,GAAG;;;;;;;;;;AAUf,EAAE"}
+{"version":3,"file":"style.mjs","names":[],"sources":["../../../src/base-ui/Carousel/style.ts"],"sourcesContent":["import { createStaticStyles } from 'antd-style';\n\nimport { brandCssVar } from '@/styles/brandCssVar';\n\nexport const styles = createStaticStyles(({ css, cssVar }) => ({\n  arrow: css`\n    position: absolute;\n    z-index: 1;\n    inset-block-start: 50%;\n    transform: translateY(-50%);\n\n    color: ${cssVar.colorText};\n\n    background: ${cssVar.colorBgContainer};\n    box-shadow: 0 1px 4px rgb(0 0 0 / 12%);\n  `,\n  dot: css`\n    cursor: pointer;\n\n    width: 6px;\n    height: 6px;\n    padding: 0;\n    border: 0;\n    border-radius: 999px;\n\n    background: ${cssVar.colorFill};\n\n    transition:\n      width 0.2s ease,\n      background 0.2s ease;\n\n    &:hover {\n      background: ${cssVar.colorTextQuaternary};\n    }\n\n    &[aria-current='true'] {\n      width: 18px;\n      background: ${cssVar.colorText};\n    }\n\n    &:focus-visible {\n      outline: 2px solid ${brandCssVar.colorBrand};\n      outline-offset: 2px;\n    }\n\n    @media (prefers-reduced-motion: reduce) {\n      transition: none;\n    }\n  `,\n  dots: css`\n    display: flex;\n    gap: 6px;\n    align-items: center;\n    justify-content: center;\n\n    padding-block: 10px;\n  `,\n  root: css`\n    position: relative;\n  `,\n  slide: css`\n    flex: 0 0 100%;\n    min-width: 0;\n  `,\n  track: css`\n    display: flex;\n    transition: transform 0.4s cubic-bezier(0.2, 0.8, 0.2, 1);\n\n    @media (prefers-reduced-motion: reduce) {\n      transition: none;\n    }\n  `,\n  trackAdaptive: css`\n    align-items: flex-start;\n  `,\n  viewport: css`\n    touch-action: pan-y;\n    position: relative;\n    overflow: hidden;\n    transition: height 0.3s ease;\n\n    @media (prefers-reduced-motion: reduce) {\n      transition: none;\n    }\n  `,\n}));\n"],"mappings":";;;AAIA,MAAa,SAAS,oBAAoB,EAAE,KAAK,cAAc;CAC7D,OAAO,GAAG;;;;;;aAMC,OAAO,UAAU;;kBAEZ,OAAO,iBAAiB;;;CAGxC,KAAK,GAAG;;;;;;;;;kBASQ,OAAO,UAAU;;;;;;;oBAOf,OAAO,oBAAoB;;;;;oBAK3B,OAAO,UAAU;;;;2BAIV,YAAY,WAAW;;;;;;;;CAQhD,MAAM,GAAG;;;;;;;;CAQT,MAAM,GAAG;;;CAGT,OAAO,GAAG;;;;CAIV,OAAO,GAAG;;;;;;;;CAQV,eAAe,GAAG;;;CAGlB,UAAU,GAAG;;;;;;;;;;AAUf,EAAE"}

package/es/base-ui/Checkbox/style.mjs

@@ -1,3 +1,4 @@
+import { inkCssVar } from "../../styles/inkCssVar.mjs";
 import { focusRing } from "../focusRing.mjs";
 import { createStaticStyles } from "antd-style";
 //#region src/base-ui/Checkbox/style.ts
@@ -29,7 +30,7 @@ const styles = createStaticStyles(({ css, cssVar }) => ({
     padding: 0;
     border: 1px solid ${cssVar.colorBorderSecondary};
 
-    color: ${cssVar.colorBgLayout};
+    color: ${inkCssVar.colorInkText};
 
     background: ${cssVar.colorBgContainer};
     outline: none;
@@ -46,8 +47,8 @@ const styles = createStaticStyles(({ css, cssVar }) => ({
 
     &[data-checked],
     &[data-indeterminate] {
-      border-color: var(--jinmi-checkbox-bg, ${cssVar.colorPrimary});
-      background: var(--jinmi-checkbox-bg, ${cssVar.colorPrimary});
+      border-color: var(--jinmi-checkbox-bg, ${inkCssVar.colorInk});
+      background: var(--jinmi-checkbox-bg, ${inkCssVar.colorInk});
     }
 
     &[data-disabled] {

package/es/base-ui/Checkbox/style.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"style.mjs","names":[],"sources":["../../../src/base-ui/Checkbox/style.ts"],"sourcesContent":["import { createStaticStyles } from 'antd-style';\n\nimport { focusRing } from '@/base-ui/focusRing';\n\nexport const styles = createStaticStyles(({ css, cssVar }) => ({\n  indicator: css`\n    display: flex;\n    align-items: center;\n    justify-content: center;\n  `,\n  label: css`\n    cursor: pointer;\n    user-select: none;\n    display: inline-flex;\n    align-items: center;\n\n    &:has([data-disabled]) {\n      cursor: not-allowed;\n    }\n  `,\n  root: css`\n    cursor: pointer;\n\n    display: inline-flex;\n    flex: none;\n    align-items: center;\n    justify-content: center;\n\n    margin: 0;\n    padding: 0;\n    border: 1px solid ${cssVar.colorBorderSecondary};\n\n    color: ${cssVar.colorBgLayout};\n\n    background: ${cssVar.colorBgContainer};\n    outline: none;\n\n    transition:\n      background 150ms ${cssVar.motionEaseOut},\n      border-color 150ms ${cssVar.motionEaseOut};\n\n    &:hover:not([data-disabled], [data-checked], [data-indeterminate]) {\n      border-color: ${cssVar.colorBorder};\n    }\n\n    ${focusRing};\n\n    &[data-checked],\n    &[data-indeterminate] {\n      border-color: var(--jinmi-checkbox-bg, ${cssVar.colorPrimary});\n      background: var(--jinmi-checkbox-bg, ${cssVar.colorPrimary});\n    }\n\n    &[data-disabled] {\n      cursor: not-allowed;\n\n      border-color: ${cssVar.colorFill};\n\n      color: ${cssVar.colorText};\n\n      opacity: 0.25;\n      background: ${cssVar.colorFill};\n    }\n  `,\n}));\n"],"mappings":";;;AAIA,MAAa,SAAS,oBAAoB,EAAE,KAAK,cAAc;CAC7D,WAAW,GAAG;;;;;CAKd,OAAO,GAAG;;;;;;;;;;CAUV,MAAM,GAAG;;;;;;;;;;wBAUa,OAAO,qBAAqB;;aAEvC,OAAO,cAAc;;kBAEhB,OAAO,iBAAiB;;;;yBAIjB,OAAO,cAAc;2BACnB,OAAO,cAAc;;;sBAG1B,OAAO,YAAY;;;MAGnC,UAAU;;;;+CAI+B,OAAO,aAAa;6CACtB,OAAO,aAAa;;;;;;sBAM3C,OAAO,UAAU;;eAExB,OAAO,UAAU;;;oBAGZ,OAAO,UAAU;;;AAGrC,EAAE"}
+{"version":3,"file":"style.mjs","names":[],"sources":["../../../src/base-ui/Checkbox/style.ts"],"sourcesContent":["import { createStaticStyles } from 'antd-style';\n\nimport { focusRing } from '@/base-ui/focusRing';\nimport { inkCssVar } from '@/styles/inkCssVar';\n\nexport const styles = createStaticStyles(({ css, cssVar }) => ({\n  indicator: css`\n    display: flex;\n    align-items: center;\n    justify-content: center;\n  `,\n  label: css`\n    cursor: pointer;\n    user-select: none;\n    display: inline-flex;\n    align-items: center;\n\n    &:has([data-disabled]) {\n      cursor: not-allowed;\n    }\n  `,\n  root: css`\n    cursor: pointer;\n\n    display: inline-flex;\n    flex: none;\n    align-items: center;\n    justify-content: center;\n\n    margin: 0;\n    padding: 0;\n    border: 1px solid ${cssVar.colorBorderSecondary};\n\n    color: ${inkCssVar.colorInkText};\n\n    background: ${cssVar.colorBgContainer};\n    outline: none;\n\n    transition:\n      background 150ms ${cssVar.motionEaseOut},\n      border-color 150ms ${cssVar.motionEaseOut};\n\n    &:hover:not([data-disabled], [data-checked], [data-indeterminate]) {\n      border-color: ${cssVar.colorBorder};\n    }\n\n    ${focusRing};\n\n    &[data-checked],\n    &[data-indeterminate] {\n      border-color: var(--jinmi-checkbox-bg, ${inkCssVar.colorInk});\n      background: var(--jinmi-checkbox-bg, ${inkCssVar.colorInk});\n    }\n\n    &[data-disabled] {\n      cursor: not-allowed;\n\n      border-color: ${cssVar.colorFill};\n\n      color: ${cssVar.colorText};\n\n      opacity: 0.25;\n      background: ${cssVar.colorFill};\n    }\n  `,\n}));\n"],"mappings":";;;;AAKA,MAAa,SAAS,oBAAoB,EAAE,KAAK,cAAc;CAC7D,WAAW,GAAG;;;;;CAKd,OAAO,GAAG;;;;;;;;;;CAUV,MAAM,GAAG;;;;;;;;;;wBAUa,OAAO,qBAAqB;;aAEvC,UAAU,aAAa;;kBAElB,OAAO,iBAAiB;;;;yBAIjB,OAAO,cAAc;2BACnB,OAAO,cAAc;;;sBAG1B,OAAO,YAAY;;;MAGnC,UAAU;;;;+CAI+B,UAAU,SAAS;6CACrB,UAAU,SAAS;;;;;;sBAM1C,OAAO,UAAU;;eAExB,OAAO,UAAU;;;oBAGZ,OAAO,UAAU;;;AAGrC,EAAE"}

package/es/base-ui/DraggablePanel/style.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"style.mjs","names":[],"sources":["../../../src/base-ui/DraggablePanel/style.ts"],"sourcesContent":["import { createStaticStyles, cx } from 'antd-style';\r\nimport { cva } from 'class-variance-authority';\r\n\nimport { brandCssVar } from '@/styles/brandCssVar';\n\r\nconst TOGGLE_HIT_SHORT = 26;\r\nconst TOGGLE_HIT_LONG = 40;\r\n\r\nexport const SEAM_ARROW = {\r\n  depth: 6.5,\r\n  half: 11,\r\n  lead: 6,\r\n  stroke: 1.25,\r\n};\r\n\r\nconst prefix = 'base-draggable-panel';\r\n\r\nexport const styles = createStaticStyles(({ css, cssVar }) => {\r\n  const float = css`\r\n    position: absolute;\r\n    z-index: 200;\r\n  `;\r\n\r\n  const toggleRoot = cx(\r\n    `${prefix}-toggle`,\r\n    css`\r\n      pointer-events: none;\r\n\r\n      position: absolute;\r\n      z-index: 110;\r\n\r\n      display: flex;\r\n      align-items: center;\r\n      justify-content: center;\r\n\r\n      > button {\r\n        pointer-events: all;\r\n        cursor: pointer;\r\n\r\n        position: relative;\r\n\r\n        width: ${TOGGLE_HIT_SHORT}px;\r\n        height: ${TOGGLE_HIT_LONG}px;\r\n        padding: 0;\r\n        border: none;\r\n\r\n        background: none;\r\n\r\n        &:focus-visible {\r\n          outline: 2px solid ${brandCssVar.colorBrand};\r\n          outline-offset: 3px;\r\n        }\r\n      }\r\n\r\n      svg {\r\n        pointer-events: none;\r\n\r\n        position: absolute;\r\n        inset-block-start: 50%;\r\n        inset-inline-start: 50%;\r\n        transform: translate(-50%, -50%);\r\n\r\n        overflow: visible;\r\n\r\n        opacity: 0;\r\n\r\n        transition: opacity 0.18s ${cssVar.motionEaseOut};\r\n      }\r\n\r\n      path {\r\n        transform-origin: center;\r\n        transform: scaleX(0);\r\n        vector-effect: non-scaling-stroke;\r\n        transition: transform 0.24s ${cssVar.motionEaseOut};\r\n      }\r\n\r\n      /* The ends fade into the seam so the bend reads as the seam itself, not a drawn icon. */\r\n      stop[data-end] {\r\n        stop-color: ${cssVar.colorBorderSecondary};\r\n        transition: stop-opacity 0.18s ${cssVar.motionEaseOut};\r\n      }\r\n\r\n      stop[data-tip] {\r\n        stop-color: ${cssVar.colorTextTertiary};\r\n        transition: stop-color 0.16s ${cssVar.motionEaseOut};\r\n      }\r\n\r\n      button:hover stop[data-tip] {\r\n        stop-color: ${cssVar.colorTextSecondary};\r\n      }\r\n    `,\r\n  );\r\n\r\n  return {\r\n    body: css`\r\n      overflow: hidden auto;\r\n      padding: 16px;\r\n    `,\r\n    bottomFloat: cx(\r\n      float,\r\n      css`\r\n        inset-block-end: 0;\r\n        inset-inline: 0;\r\n        width: 100%;\r\n      `,\r\n    ),\r\n    container: css`\r\n      position: relative;\r\n      overflow: hidden;\r\n      display: flex;\r\n      flex-direction: column;\r\n    `,\r\n    content: cx(\r\n      `${prefix}-content`,\r\n      css`\r\n        display: flex;\r\n        flex-direction: column;\r\n        flex-shrink: 0;\r\n\r\n        min-width: 0;\r\n        min-height: 0;\r\n\r\n        background: var(--draggable-panel-bg, transparent);\r\n      `,\r\n    ),\r\n    fixed: css`\r\n      position: relative;\r\n    `,\r\n    footer: css`\r\n      display: flex;\r\n      flex: none;\r\n      gap: 8px;\r\n      align-items: center;\r\n\r\n      padding-block: 8px;\r\n      padding-inline: 16px;\r\n      border-block-start: 1px solid ${cssVar.colorBorderSecondary};\r\n    `,\r\n    handle: cx(\r\n      `${prefix}-handle`,\r\n      css`\r\n        touch-action: none;\r\n        position: absolute;\r\n        z-index: 100;\r\n\r\n        &::before,\r\n        &::after {\r\n          content: '';\r\n          position: absolute;\r\n          background: ${cssVar.colorBorderSecondary};\r\n          transition:\r\n            width 0.25s ${cssVar.motionEaseOut},\r\n            height 0.25s ${cssVar.motionEaseOut},\r\n            background 0.16s ${cssVar.motionEaseOut};\r\n        }\r\n\r\n        &:hover::before,\r\n        &:hover::after {\r\n          background: ${cssVar.colorFill};\r\n        }\r\n\r\n        &[data-resizing]::before,\r\n        &[data-resizing]::after {\r\n          background: ${cssVar.colorPrimary};\r\n        }\r\n\r\n        &[data-border='false']::before,\r\n        &[data-border='false']::after {\r\n          background: transparent;\r\n        }\r\n\r\n        &:focus-visible {\r\n          outline: 2px solid ${brandCssVar.colorBrand};\r\n          outline-offset: -2px;\r\n        }\r\n      `,\r\n    ),\r\n    handleHorizontal: css`\r\n      cursor: row-resize;\r\n      inset-inline: 0;\r\n      height: var(--draggable-panel-handle-size);\r\n\r\n      &::before,\r\n      &::after {\r\n        inset-block-start: 50%;\r\n        height: 1px;\r\n        margin-block-start: -0.5px;\r\n      }\r\n\r\n      &::before {\r\n        inset-inline-start: 0;\r\n        width: calc(50% - var(--draggable-panel-gap, 0px));\r\n      }\r\n\r\n      &::after {\r\n        inset-inline-end: 0;\r\n        width: calc(50% - var(--draggable-panel-gap, 0px));\r\n      }\r\n    `,\r\n    handleVertical: css`\r\n      cursor: col-resize;\r\n      inset-block: 0;\r\n      width: var(--draggable-panel-handle-size);\r\n\r\n      &::before,\r\n      &::after {\r\n        inset-inline-start: 50%;\r\n        width: 1px;\r\n        margin-inline-start: -0.5px;\r\n      }\r\n\r\n      &::before {\r\n        inset-block-start: 0;\r\n        height: calc(50% - var(--draggable-panel-gap, 0px));\r\n      }\r\n\r\n      &::after {\r\n        inset-block-end: 0;\r\n        height: calc(50% - var(--draggable-panel-gap, 0px));\r\n      }\r\n    `,\r\n    header: css`\r\n      display: flex;\r\n      flex: none;\r\n      gap: 8px;\r\n      align-items: center;\r\n      justify-content: space-between;\r\n\r\n      padding-block: 8px;\r\n      padding-inline: 16px;\r\n      border-block-end: 1px solid ${cssVar.colorBorderSecondary};\r\n\r\n      font-weight: 500;\r\n    `,\r\n    leftFloat: cx(\r\n      float,\r\n      css`\r\n        inset-block: 0;\r\n        inset-inline-start: 0;\r\n        height: 100%;\r\n      `,\r\n    ),\r\n    rightFloat: cx(\r\n      float,\r\n      css`\r\n        inset-block: 0;\r\n        inset-inline-end: 0;\r\n        height: 100%;\r\n      `,\r\n    ),\r\n    root: cx(\r\n      prefix,\r\n      css`\r\n        --draggable-panel-gap: 0px;\r\n\r\n        display: flex;\r\n        flex-shrink: 0;\r\n        min-width: 0;\r\n        min-height: 0;\r\n\r\n        &[data-expandable='true']:hover,\r\n        &[data-expandable='true']:focus-within,\r\n        &[data-expandable='true'][data-expand='false'] {\r\n          --draggable-panel-gap: ${SEAM_ARROW.half + SEAM_ARROW.lead}px;\r\n        }\r\n\r\n        /* The wrapper carries an inline opacity when collapsed, so beat it. */\r\n        &[data-expandable='true']:hover\r\n          .${prefix}-toggle,\r\n          &[data-expandable='true']:focus-within\r\n          .${prefix}-toggle {\r\n          opacity: 1 !important;\r\n        }\r\n\r\n        &[data-expandable='true']:hover .${prefix}-toggle svg,\r\n        &[data-expandable='true']:focus-within .${prefix}-toggle svg,\r\n        &[data-expandable='true'][data-expand='false'] .${prefix}-toggle svg {\r\n          opacity: 1;\r\n        }\r\n\r\n        &[data-expandable='true']:hover .${prefix}-toggle path,\r\n        &[data-expandable='true']:focus-within .${prefix}-toggle path,\r\n        &[data-expandable='true'][data-expand='false'] .${prefix}-toggle path {\r\n          transform: scaleX(var(--seam-bend));\r\n        }\r\n\r\n        &[data-expandable='true'][data-resizing='true'] {\r\n          --draggable-panel-gap: 0px;\r\n        }\r\n\r\n        &[data-expandable='true'][data-resizing='true'] .${prefix}-toggle svg {\r\n          opacity: 0;\r\n        }\r\n      `,\r\n    ),\r\n    toggleBottom: cx(\r\n      `${prefix}-toggle-bottom`,\r\n      css`\r\n        inset-block-end: -${TOGGLE_HIT_SHORT / 2}px;\r\n        inset-inline: 0;\r\n        height: ${TOGGLE_HIT_SHORT}px;\r\n\r\n        > button {\r\n          width: ${TOGGLE_HIT_LONG}px;\r\n          height: ${TOGGLE_HIT_SHORT}px;\r\n        }\r\n      `,\r\n    ),\r\n    toggleLeft: cx(\r\n      `${prefix}-toggle-left`,\r\n      css`\r\n        inset-block: 0;\r\n        inset-inline-start: -${TOGGLE_HIT_SHORT / 2}px;\r\n        width: ${TOGGLE_HIT_SHORT}px;\r\n      `,\r\n    ),\r\n    toggleRight: cx(\r\n      `${prefix}-toggle-right`,\r\n      css`\r\n        inset-block: 0;\r\n        inset-inline-end: -${TOGGLE_HIT_SHORT / 2}px;\r\n        width: ${TOGGLE_HIT_SHORT}px;\r\n      `,\r\n    ),\r\n    toggleRoot,\r\n    toggleTop: cx(\r\n      `${prefix}-toggle-top`,\r\n      css`\r\n        inset-block-start: -${TOGGLE_HIT_SHORT / 2}px;\r\n        inset-inline: 0;\r\n        height: ${TOGGLE_HIT_SHORT}px;\r\n\r\n        > button {\r\n          width: ${TOGGLE_HIT_LONG}px;\r\n          height: ${TOGGLE_HIT_SHORT}px;\r\n        }\r\n      `,\r\n    ),\r\n\r\n    topFloat: cx(\r\n      float,\r\n      css`\r\n        inset-block-start: 0;\r\n        inset-inline: 0;\r\n        width: 100%;\r\n      `,\r\n    ),\r\n  };\r\n});\r\n\r\nexport const rootVariants = cva(styles.root, {\r\n  compoundVariants: [\r\n    { class: styles.leftFloat, mode: 'float', placement: 'left' },\r\n    { class: styles.rightFloat, mode: 'float', placement: 'right' },\r\n    { class: styles.topFloat, mode: 'float', placement: 'top' },\r\n    { class: styles.bottomFloat, mode: 'float', placement: 'bottom' },\r\n  ],\r\n  defaultVariants: { mode: 'fixed', placement: 'right' },\r\n  variants: {\r\n    mode: { fixed: styles.fixed, float: null },\r\n    placement: { bottom: null, left: null, right: null, top: null },\r\n  },\r\n});\r\n\r\nexport const handleVariants = cva(styles.handle, {\r\n  variants: {\r\n    edge: {\r\n      bottom: styles.handleHorizontal,\r\n      left: styles.handleVertical,\r\n      right: styles.handleVertical,\r\n      top: styles.handleHorizontal,\r\n    },\r\n  },\r\n});\r\n\r\nexport const toggleVariants = cva(styles.toggleRoot, {\r\n  variants: {\r\n    placement: {\r\n      bottom: styles.toggleTop,\r\n      left: styles.toggleRight,\r\n      right: styles.toggleLeft,\r\n      top: styles.toggleBottom,\r\n    },\r\n  },\r\n});\r\n"],"mappings":"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"}
+{"version":3,"file":"style.mjs","names":[],"sources":["../../../src/base-ui/DraggablePanel/style.ts"],"sourcesContent":["import { createStaticStyles, cx } from 'antd-style';\nimport { cva } from 'class-variance-authority';\n\nimport { brandCssVar } from '@/styles/brandCssVar';\n\nconst TOGGLE_HIT_SHORT = 26;\nconst TOGGLE_HIT_LONG = 40;\n\nexport const SEAM_ARROW = {\n  depth: 6.5,\n  half: 11,\n  lead: 6,\n  stroke: 1.25,\n};\n\nconst prefix = 'base-draggable-panel';\n\nexport const styles = createStaticStyles(({ css, cssVar }) => {\n  const float = css`\n    position: absolute;\n    z-index: 200;\n  `;\n\n  const toggleRoot = cx(\n    `${prefix}-toggle`,\n    css`\n      pointer-events: none;\n\n      position: absolute;\n      z-index: 110;\n\n      display: flex;\n      align-items: center;\n      justify-content: center;\n\n      > button {\n        pointer-events: all;\n        cursor: pointer;\n\n        position: relative;\n\n        width: ${TOGGLE_HIT_SHORT}px;\n        height: ${TOGGLE_HIT_LONG}px;\n        padding: 0;\n        border: none;\n\n        background: none;\n\n        &:focus-visible {\n          outline: 2px solid ${brandCssVar.colorBrand};\n          outline-offset: 3px;\n        }\n      }\n\n      svg {\n        pointer-events: none;\n\n        position: absolute;\n        inset-block-start: 50%;\n        inset-inline-start: 50%;\n        transform: translate(-50%, -50%);\n\n        overflow: visible;\n\n        opacity: 0;\n\n        transition: opacity 0.18s ${cssVar.motionEaseOut};\n      }\n\n      path {\n        transform-origin: center;\n        transform: scaleX(0);\n        vector-effect: non-scaling-stroke;\n        transition: transform 0.24s ${cssVar.motionEaseOut};\n      }\n\n      /* The ends fade into the seam so the bend reads as the seam itself, not a drawn icon. */\n      stop[data-end] {\n        stop-color: ${cssVar.colorBorderSecondary};\n        transition: stop-opacity 0.18s ${cssVar.motionEaseOut};\n      }\n\n      stop[data-tip] {\n        stop-color: ${cssVar.colorTextTertiary};\n        transition: stop-color 0.16s ${cssVar.motionEaseOut};\n      }\n\n      button:hover stop[data-tip] {\n        stop-color: ${cssVar.colorTextSecondary};\n      }\n    `,\n  );\n\n  return {\n    body: css`\n      overflow: hidden auto;\n      padding: 16px;\n    `,\n    bottomFloat: cx(\n      float,\n      css`\n        inset-block-end: 0;\n        inset-inline: 0;\n        width: 100%;\n      `,\n    ),\n    container: css`\n      position: relative;\n      overflow: hidden;\n      display: flex;\n      flex-direction: column;\n    `,\n    content: cx(\n      `${prefix}-content`,\n      css`\n        display: flex;\n        flex-direction: column;\n        flex-shrink: 0;\n\n        min-width: 0;\n        min-height: 0;\n\n        background: var(--draggable-panel-bg, transparent);\n      `,\n    ),\n    fixed: css`\n      position: relative;\n    `,\n    footer: css`\n      display: flex;\n      flex: none;\n      gap: 8px;\n      align-items: center;\n\n      padding-block: 8px;\n      padding-inline: 16px;\n      border-block-start: 1px solid ${cssVar.colorBorderSecondary};\n    `,\n    handle: cx(\n      `${prefix}-handle`,\n      css`\n        touch-action: none;\n        position: absolute;\n        z-index: 100;\n\n        &::before,\n        &::after {\n          content: '';\n          position: absolute;\n          background: ${cssVar.colorBorderSecondary};\n          transition:\n            width 0.25s ${cssVar.motionEaseOut},\n            height 0.25s ${cssVar.motionEaseOut},\n            background 0.16s ${cssVar.motionEaseOut};\n        }\n\n        &:hover::before,\n        &:hover::after {\n          background: ${cssVar.colorFill};\n        }\n\n        &[data-resizing]::before,\n        &[data-resizing]::after {\n          background: ${cssVar.colorPrimary};\n        }\n\n        &[data-border='false']::before,\n        &[data-border='false']::after {\n          background: transparent;\n        }\n\n        &:focus-visible {\n          outline: 2px solid ${brandCssVar.colorBrand};\n          outline-offset: -2px;\n        }\n      `,\n    ),\n    handleHorizontal: css`\n      cursor: row-resize;\n      inset-inline: 0;\n      height: var(--draggable-panel-handle-size);\n\n      &::before,\n      &::after {\n        inset-block-start: 50%;\n        height: 1px;\n        margin-block-start: -0.5px;\n      }\n\n      &::before {\n        inset-inline-start: 0;\n        width: calc(50% - var(--draggable-panel-gap, 0px));\n      }\n\n      &::after {\n        inset-inline-end: 0;\n        width: calc(50% - var(--draggable-panel-gap, 0px));\n      }\n    `,\n    handleVertical: css`\n      cursor: col-resize;\n      inset-block: 0;\n      width: var(--draggable-panel-handle-size);\n\n      &::before,\n      &::after {\n        inset-inline-start: 50%;\n        width: 1px;\n        margin-inline-start: -0.5px;\n      }\n\n      &::before {\n        inset-block-start: 0;\n        height: calc(50% - var(--draggable-panel-gap, 0px));\n      }\n\n      &::after {\n        inset-block-end: 0;\n        height: calc(50% - var(--draggable-panel-gap, 0px));\n      }\n    `,\n    header: css`\n      display: flex;\n      flex: none;\n      gap: 8px;\n      align-items: center;\n      justify-content: space-between;\n\n      padding-block: 8px;\n      padding-inline: 16px;\n      border-block-end: 1px solid ${cssVar.colorBorderSecondary};\n\n      font-weight: 500;\n    `,\n    leftFloat: cx(\n      float,\n      css`\n        inset-block: 0;\n        inset-inline-start: 0;\n        height: 100%;\n      `,\n    ),\n    rightFloat: cx(\n      float,\n      css`\n        inset-block: 0;\n        inset-inline-end: 0;\n        height: 100%;\n      `,\n    ),\n    root: cx(\n      prefix,\n      css`\n        --draggable-panel-gap: 0px;\n\n        display: flex;\n        flex-shrink: 0;\n        min-width: 0;\n        min-height: 0;\n\n        &[data-expandable='true']:hover,\n        &[data-expandable='true']:focus-within,\n        &[data-expandable='true'][data-expand='false'] {\n          --draggable-panel-gap: ${SEAM_ARROW.half + SEAM_ARROW.lead}px;\n        }\n\n        /* The wrapper carries an inline opacity when collapsed, so beat it. */\n        &[data-expandable='true']:hover\n          .${prefix}-toggle,\n          &[data-expandable='true']:focus-within\n          .${prefix}-toggle {\n          opacity: 1 !important;\n        }\n\n        &[data-expandable='true']:hover .${prefix}-toggle svg,\n        &[data-expandable='true']:focus-within .${prefix}-toggle svg,\n        &[data-expandable='true'][data-expand='false'] .${prefix}-toggle svg {\n          opacity: 1;\n        }\n\n        &[data-expandable='true']:hover .${prefix}-toggle path,\n        &[data-expandable='true']:focus-within .${prefix}-toggle path,\n        &[data-expandable='true'][data-expand='false'] .${prefix}-toggle path {\n          transform: scaleX(var(--seam-bend));\n        }\n\n        &[data-expandable='true'][data-resizing='true'] {\n          --draggable-panel-gap: 0px;\n        }\n\n        &[data-expandable='true'][data-resizing='true'] .${prefix}-toggle svg {\n          opacity: 0;\n        }\n      `,\n    ),\n    toggleBottom: cx(\n      `${prefix}-toggle-bottom`,\n      css`\n        inset-block-end: -${TOGGLE_HIT_SHORT / 2}px;\n        inset-inline: 0;\n        height: ${TOGGLE_HIT_SHORT}px;\n\n        > button {\n          width: ${TOGGLE_HIT_LONG}px;\n          height: ${TOGGLE_HIT_SHORT}px;\n        }\n      `,\n    ),\n    toggleLeft: cx(\n      `${prefix}-toggle-left`,\n      css`\n        inset-block: 0;\n        inset-inline-start: -${TOGGLE_HIT_SHORT / 2}px;\n        width: ${TOGGLE_HIT_SHORT}px;\n      `,\n    ),\n    toggleRight: cx(\n      `${prefix}-toggle-right`,\n      css`\n        inset-block: 0;\n        inset-inline-end: -${TOGGLE_HIT_SHORT / 2}px;\n        width: ${TOGGLE_HIT_SHORT}px;\n      `,\n    ),\n    toggleRoot,\n    toggleTop: cx(\n      `${prefix}-toggle-top`,\n      css`\n        inset-block-start: -${TOGGLE_HIT_SHORT / 2}px;\n        inset-inline: 0;\n        height: ${TOGGLE_HIT_SHORT}px;\n\n        > button {\n          width: ${TOGGLE_HIT_LONG}px;\n          height: ${TOGGLE_HIT_SHORT}px;\n        }\n      `,\n    ),\n\n    topFloat: cx(\n      float,\n      css`\n        inset-block-start: 0;\n        inset-inline: 0;\n        width: 100%;\n      `,\n    ),\n  };\n});\n\nexport const rootVariants = cva(styles.root, {\n  compoundVariants: [\n    { class: styles.leftFloat, mode: 'float', placement: 'left' },\n    { class: styles.rightFloat, mode: 'float', placement: 'right' },\n    { class: styles.topFloat, mode: 'float', placement: 'top' },\n    { class: styles.bottomFloat, mode: 'float', placement: 'bottom' },\n  ],\n  defaultVariants: { mode: 'fixed', placement: 'right' },\n  variants: {\n    mode: { fixed: styles.fixed, float: null },\n    placement: { bottom: null, left: null, right: null, top: null },\n  },\n});\n\nexport const handleVariants = cva(styles.handle, {\n  variants: {\n    edge: {\n      bottom: styles.handleHorizontal,\n      left: styles.handleVertical,\n      right: styles.handleVertical,\n      top: styles.handleHorizontal,\n    },\n  },\n});\n\nexport const toggleVariants = cva(styles.toggleRoot, {\n  variants: {\n    placement: {\n      bottom: styles.toggleTop,\n      left: styles.toggleRight,\n      right: styles.toggleLeft,\n      top: styles.toggleBottom,\n    },\n  },\n});\n"],"mappings":"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"}

package/es/base-ui/Form/index.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"index.mjs","names":["FormParent"],"sources":["../../../src/base-ui/Form/index.ts"],"sourcesContent":["'use client';\r\n\r\nimport FormDivider from './components/FormDivider';\r\nimport FormField from './components/FormField';\r\nimport FormFlatGroup from './components/FormFlatGroup';\r\nimport FormFooter from './components/FormFooter';\r\nimport FormGroup from './components/FormGroup';\r\nimport FormSubmitFooter from './components/FormSubmitFooter';\r\nimport FormTitle from './components/FormTitle';\r\nimport FormParent from './Form';\r\n\r\n/**\r\n * @deprecated Use `Form` from `@jinmi/ui/base-ui/form`. This uncontrolled Form is removed in the next major.\r\n */\r\nexport const Form = Object.assign(FormParent, {\r\n  Divider: FormDivider,\r\n  Field: FormField,\r\n  FlatGroup: FormFlatGroup,\r\n  Footer: FormFooter,\r\n  Group: FormGroup,\r\n  SubmitFooter: FormSubmitFooter,\r\n  Title: FormTitle,\r\n});\r\n\r\nexport { useFormContext } from './context';\r\nexport {\r\n  FormDivider,\r\n  FormField,\r\n  FormFlatGroup,\r\n  FormFooter,\r\n  FormGroup,\r\n  FormSubmitFooter,\r\n  FormTitle,\r\n};\r\nexport type {\r\n  FormContextValue,\r\n  FormDividerProps,\r\n  FormFieldProps,\r\n  FormFlatGroupProps,\r\n  FormFooterProps,\r\n  FormGroupItemType,\r\n  FormGroupProps,\r\n  FormLayout,\r\n  FormProps,\r\n  FormSubmitFooterProps,\r\n  FormTitleProps,\r\n  FormValues,\r\n  FormVariant,\r\n  ItemsType,\r\n} from './type';\r\n\r\nexport default Form;\r\n"],"mappings":";;;;;;;;;;;;;;AAcA,MAAa,OAAO,OAAO,OAAOA,QAAY;CAC5C,SAAS;CACT,OAAO;CACP,WAAW;CACX,QAAQ;CACR,OAAO;CACP,cAAc;CACd,OAAO;AACT,CAAC"}
+{"version":3,"file":"index.mjs","names":["FormParent"],"sources":["../../../src/base-ui/Form/index.ts"],"sourcesContent":["'use client';\n\nimport FormDivider from './components/FormDivider';\nimport FormField from './components/FormField';\nimport FormFlatGroup from './components/FormFlatGroup';\nimport FormFooter from './components/FormFooter';\nimport FormGroup from './components/FormGroup';\nimport FormSubmitFooter from './components/FormSubmitFooter';\nimport FormTitle from './components/FormTitle';\nimport FormParent from './Form';\n\n/**\n * @deprecated Use `Form` from `@jinmi/ui/base-ui/form`. This uncontrolled Form is removed in the next major.\n */\nexport const Form = Object.assign(FormParent, {\n  Divider: FormDivider,\n  Field: FormField,\n  FlatGroup: FormFlatGroup,\n  Footer: FormFooter,\n  Group: FormGroup,\n  SubmitFooter: FormSubmitFooter,\n  Title: FormTitle,\n});\n\nexport { useFormContext } from './context';\nexport {\n  FormDivider,\n  FormField,\n  FormFlatGroup,\n  FormFooter,\n  FormGroup,\n  FormSubmitFooter,\n  FormTitle,\n};\nexport type {\n  FormContextValue,\n  FormDividerProps,\n  FormFieldProps,\n  FormFlatGroupProps,\n  FormFooterProps,\n  FormGroupItemType,\n  FormGroupProps,\n  FormLayout,\n  FormProps,\n  FormSubmitFooterProps,\n  FormTitleProps,\n  FormValues,\n  FormVariant,\n  ItemsType,\n} from './type';\n\nexport default Form;\n"],"mappings":";;;;;;;;;;;;;;AAcA,MAAa,OAAO,OAAO,OAAOA,QAAY;CAC5C,SAAS;CACT,OAAO;CACP,WAAW;CACX,QAAQ;CACR,OAAO;CACP,cAAc;CACd,OAAO;AACT,CAAC"}