@jinmi/ui 0.0.0-stage → 6.0.2

package/es/SortableList/style.mjs

@@ -0,0 +1,44 @@
+import { staticStylish } from "../styles/theme/customStylishStatic.mjs";
+import { createStaticStyles } from "antd-style";
+import { cva } from "class-variance-authority";
+//#region src/SortableList/style.ts
+const styles = createStaticStyles(({ css, cssVar }) => {
+	return {
+		borderless: staticStylish.variantBorderlessWithoutHover,
+		container: css`
+      padding: 0;
+      list-style: none;
+    `,
+		filled: staticStylish.variantFilledWithoutHover,
+		item: css`
+      overflow: hidden;
+      box-sizing: border-box;
+      border-radius: ${cssVar.borderRadius};
+      list-style: none;
+    `,
+		itemVariant: css`
+      padding-block: 4px;
+      padding-inline: 4px 16px;
+    `,
+		outlined: staticStylish.variantOutlinedWithoutHover
+	};
+});
+const variants = cva(styles.item, {
+	compoundVariants: [{
+		className: styles.itemVariant,
+		variant: "outlined"
+	}, {
+		className: styles.itemVariant,
+		variant: "filled"
+	}],
+	defaultVariants: { variant: "borderless" },
+	variants: { variant: {
+		filled: styles.filled,
+		outlined: styles.outlined,
+		borderless: styles.borderless
+	} }
+});
+//#endregion
+export { styles, variants };
+
+//# sourceMappingURL=style.mjs.map

package/es/SortableList/style.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"style.mjs","names":["lobeStaticStylish"],"sources":["../../src/SortableList/style.ts"],"sourcesContent":["import { createStaticStyles } from 'antd-style';\r\nimport { cva } from 'class-variance-authority';\r\n\r\nimport { lobeStaticStylish } from '@/styles';\r\n\r\nexport const styles = createStaticStyles(({ css, cssVar }) => {\r\n  return {\r\n    borderless: lobeStaticStylish.variantBorderlessWithoutHover,\r\n    container: css`\r\n      padding: 0;\r\n      list-style: none;\r\n    `,\r\n    filled: lobeStaticStylish.variantFilledWithoutHover,\r\n    item: css`\r\n      overflow: hidden;\r\n      box-sizing: border-box;\r\n      border-radius: ${cssVar.borderRadius};\r\n      list-style: none;\r\n    `,\r\n    itemVariant: css`\r\n      padding-block: 4px;\r\n      padding-inline: 4px 16px;\r\n    `,\r\n    outlined: lobeStaticStylish.variantOutlinedWithoutHover,\r\n  };\r\n});\r\n\r\nexport const variants = cva(styles.item, {\r\n  compoundVariants: [\r\n    {\r\n      className: styles.itemVariant,\r\n      variant: 'outlined',\r\n    },\r\n    {\r\n      className: styles.itemVariant,\r\n      variant: 'filled',\r\n    },\r\n  ],\r\n  defaultVariants: {\r\n    variant: 'borderless',\r\n  },\r\n\r\n  variants: {\r\n    variant: {\r\n      filled: styles.filled,\r\n      outlined: styles.outlined,\r\n      borderless: styles.borderless,\r\n    },\r\n  },\r\n});\r\n"],"mappings":";;;;AAKA,MAAa,SAAS,oBAAoB,EAAE,KAAK,aAAa;CAC5D,OAAO;EACL,YAAYA,cAAkB;EAC9B,WAAW,GAAG;;;;EAId,QAAQA,cAAkB;EAC1B,MAAM,GAAG;;;uBAGU,OAAO,aAAa;;;EAGvC,aAAa,GAAG;;;;EAIhB,UAAUA,cAAkB;CAC9B;AACF,CAAC;AAED,MAAa,WAAW,IAAI,OAAO,MAAM;CACvC,kBAAkB,CAChB;EACE,WAAW,OAAO;EAClB,SAAS;CACX,GACA;EACE,WAAW,OAAO;EAClB,SAAS;CACX,CACF;CACA,iBAAiB,EACf,SAAS,aACX;CAEA,UAAU,EACR,SAAS;EACP,QAAQ,OAAO;EACf,UAAU,OAAO;EACjB,YAAY,OAAO;CACrB,EACF;AACF,CAAC"}

package/es/SortableList/type.d.mts

@@ -0,0 +1,26 @@
+import { FlexboxProps } from "../Flex/type.mjs";
+import "../Flex/index.mjs";
+import { ReactNode, Ref } from "react";
+//#region src/SortableList/type.d.ts
+interface SortableListItem {
+  [key: string]: any;
+  id: string | number;
+}
+interface SortableListProps<T extends SortableListItem = SortableListItem> extends Omit<FlexboxProps, 'onChange'> {
+  /**
+   * @default 8
+   */
+  gap?: number;
+  items: T[];
+  onChange: (items: T[]) => void;
+  ref?: Ref<HTMLUListElement>;
+  renderItem: (item: T) => ReactNode;
+  /**
+   * Custom render function for the drag overlay
+   * If not provided, renderItem will be used
+   */
+  renderOverlay?: (item: T) => ReactNode;
+}
+//#endregion
+export { SortableListItem, SortableListProps };
+//# sourceMappingURL=type.d.mts.map

package/es/Tabs/Tabs.d.mts

@@ -0,0 +1,10 @@
+import { TabsProps } from "./type.mjs";
+import { FC } from "react";
+//#region src/Tabs/Tabs.d.ts
+/**
+ * @deprecated Use `Tabs` from `@jinmi/ui/base-ui` instead.
+ */
+declare const Tabs: FC<TabsProps>;
+//#endregion
+export { Tabs as default };
+//# sourceMappingURL=Tabs.d.mts.map

package/es/Tabs/Tabs.mjs

@@ -0,0 +1,41 @@
+"use client";
+import ActionIcon from "../base-ui/ActionIcon/ActionIcon.mjs";
+import { styles, variants } from "./style.mjs";
+import { jsx } from "react/jsx-runtime";
+import { cx } from "antd-style";
+import { MoreHorizontalIcon } from "lucide-react";
+import { Tabs } from "antd";
+//#region src/Tabs/Tabs.tsx
+/**
+* @deprecated Use `Tabs` from `@jinmi/ui/base-ui` instead.
+*/
+const Tabs$1 = ({ className, compact, variant = "rounded", items, classNames, ...rest }) => {
+	const hasContent = items?.some((item) => !!item.children);
+	const popupClassNames = {
+		root: styles.dropdown,
+		...typeof classNames === "function" ? void 0 : classNames?.popup
+	};
+	const mergedClassNames = typeof classNames === "function" ? Object.assign((info) => classNames(info), { popup: popupClassNames }) : {
+		...classNames,
+		popup: popupClassNames
+	};
+	return /* @__PURE__ */ jsx(Tabs, {
+		className: cx(variants({
+			compact,
+			underlined: hasContent,
+			variant
+		}), className),
+		items,
+		...rest,
+		classNames: mergedClassNames,
+		more: {
+			icon: /* @__PURE__ */ jsx(ActionIcon, { icon: MoreHorizontalIcon }),
+			...rest?.more
+		}
+	});
+};
+Tabs$1.displayName = "Tabs";
+//#endregion
+export { Tabs$1 as default };
+
+//# sourceMappingURL=Tabs.mjs.map

package/es/Tabs/Tabs.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"Tabs.mjs","names":["Tabs","AntdTabs"],"sources":["../../src/Tabs/Tabs.tsx"],"sourcesContent":["'use client';\n\nimport { Tabs as AntdTabs } from 'antd';\nimport { cx } from 'antd-style';\nimport { MoreHorizontalIcon } from 'lucide-react';\nimport { type FC } from 'react';\n\nimport ActionIcon from '@/base-ui/ActionIcon';\n\nimport { styles, variants } from './style';\nimport type { TabsProps } from './type';\n\n/**\n * @deprecated Use `Tabs` from `@jinmi/ui/base-ui` instead.\n */\nconst Tabs: FC<TabsProps> = ({\n  className,\n  compact,\n  variant = 'rounded',\n  items,\n  classNames,\n  ...rest\n}) => {\n  const hasContent = items?.some((item) => !!item.children);\n  const popupClassNames = {\n    root: styles.dropdown,\n    ...(typeof classNames === 'function' ? undefined : classNames?.popup),\n  };\n  const mergedClassNames: TabsProps['classNames'] =\n    typeof classNames === 'function'\n      ? Object.assign((info: Parameters<typeof classNames>[0]) => classNames(info), {\n          popup: popupClassNames,\n        })\n      : {\n          ...classNames,\n          popup: popupClassNames,\n        };\n\n  return (\n    <AntdTabs\n      className={cx(variants({ compact, underlined: hasContent, variant }), className)}\n      items={items}\n      {...rest}\n      classNames={mergedClassNames}\n      more={{\n        icon: <ActionIcon icon={MoreHorizontalIcon} />,\n        ...rest?.more,\n      }}\n    />\n  );\n};\n\nTabs.displayName = 'Tabs';\n\nexport default Tabs;\n"],"mappings":";;;;;;;;;;;AAeA,MAAMA,UAAuB,EAC3B,WACA,SACA,UAAU,WACV,OACA,YACA,GAAG,WACC;CACJ,MAAM,aAAa,OAAO,MAAM,SAAS,CAAC,CAAC,KAAK,QAAQ;CACxD,MAAM,kBAAkB;EACtB,MAAM,OAAO;EACb,GAAI,OAAO,eAAe,aAAa,KAAA,IAAY,YAAY;CACjE;CACA,MAAM,mBACJ,OAAO,eAAe,aAClB,OAAO,QAAQ,SAA2C,WAAW,IAAI,GAAG,EAC1E,OAAO,gBACT,CAAC,IACD;EACE,GAAG;EACH,OAAO;CACT;CAEN,OACE,oBAACC,MAAD;EACE,WAAW,GAAG,SAAS;GAAE;GAAS,YAAY;GAAY;EAAQ,CAAC,GAAG,SAAS;EACxE;EACP,GAAI;EACJ,YAAY;EACZ,MAAM;GACJ,MAAM,oBAAC,YAAD,EAAY,MAAM,mBAAqB,CAAA;GAC7C,GAAG,MAAM;EACX;CACD,CAAA;AAEL;AAEA,OAAK,cAAc"}

package/es/Tabs/index.d.mts

@@ -0,0 +1,3 @@
+import { TabsProps } from "./type.mjs";
+import Tabs from "./Tabs.mjs";
+export { type TabsProps, Tabs as default };

package/es/Tabs/index.d.ts

@@ -0,0 +1 @@
+export * from './index.d.mts';

package/es/Tabs/index.js

@@ -0,0 +1 @@
+export * from './index.mjs';

package/es/Tabs/index.mjs

@@ -0,0 +1,2 @@
+import Tabs from "./Tabs.mjs";
+export { Tabs as default };

package/es/Tabs/style.mjs

@@ -0,0 +1,171 @@
+import { createStaticStyles } from "antd-style";
+import { cva } from "class-variance-authority";
+//#region src/Tabs/style.ts
+const prefixCls = "ant";
+const styles = createStaticStyles(({ css, cssVar }) => {
+	return {
+		compact: css`
+      &.${prefixCls}-tabs {
+        .${prefixCls}-tabs-tab {
+          margin: 4px;
+
+          + [class*='ant-tabs-tab'] {
+            margin: 4px;
+          }
+        }
+      }
+    `,
+		dropdown: css`
+      .${prefixCls}-tabs-dropdown-menu {
+        padding: 4px;
+        border: 1px solid ${cssVar.colorBorderSecondary};
+
+        .${prefixCls}-tabs-dropdown-menu-item {
+          border-radius: ${cssVar.borderRadius};
+        }
+      }
+    `,
+		hideHolder: css`
+      &.${prefixCls}-tabs {
+        .${prefixCls}-tabs-content-holder {
+          display: none;
+        }
+
+        .${prefixCls}-tabs-nav {
+          margin: 0;
+
+          &::before {
+            display: none;
+          }
+        }
+      }
+    `,
+		margin: css`
+      &.${prefixCls}-tabs {
+        .${prefixCls}-tabs-tab {
+          margin: 8px;
+
+          + .${prefixCls}-tabs-tab {
+            margin: 8px;
+          }
+        }
+      }
+    `,
+		point: css`
+      &.${prefixCls}-tabs {
+        &.${prefixCls}-tabs-top {
+          .${prefixCls}-tabs-ink-bar {
+            width: 8px !important;
+            height: 4px;
+            border-start-start-radius: 4px;
+            border-start-end-radius: 4px;
+          }
+        }
+
+        &.${prefixCls}-tabs-bottom {
+          .${prefixCls}-tabs-ink-bar {
+            width: 8px !important;
+            height: 4px;
+            border-end-start-radius: 4px;
+            border-end-end-radius: 4px;
+          }
+        }
+
+        &.${prefixCls}-tabs-left {
+          .${prefixCls}-tabs-ink-bar {
+            width: 4px;
+            height: 8px !important;
+            border-start-start-radius: 4px;
+            border-end-start-radius: 4px;
+          }
+        }
+
+        &.${prefixCls}-tabs-right {
+          .${prefixCls}-tabs-ink-bar {
+            width: 4px;
+            height: 8px !important;
+            border-start-end-radius: 4px;
+            border-end-end-radius: 4px;
+          }
+        }
+      }
+    `,
+		root: css`
+      &.${prefixCls}-tabs {
+        .${prefixCls}-tabs-tab {
+          padding-block: 8px;
+          padding-inline: 12px;
+          color: ${cssVar.colorTextSecondary};
+          transition: background-color 100ms ease-out;
+
+          &:hover {
+            border-radius: ${cssVar.borderRadius};
+            color: ${cssVar.colorText};
+            background: ${cssVar.colorFillTertiary};
+          }
+        }
+      }
+    `,
+		rounded: css`
+      &.${prefixCls}-tabs {
+        &.${prefixCls}-tabs-top {
+          .${prefixCls}-tabs-ink-bar {
+            height: 3px;
+            border-start-start-radius: 3px;
+            border-start-end-radius: 3px;
+          }
+        }
+
+        &.${prefixCls}-tabs-bottom {
+          .${prefixCls}-tabs-ink-bar {
+            height: 3px;
+            border-end-start-radius: 3px;
+            border-end-end-radius: 3px;
+          }
+        }
+
+        &.${prefixCls}-tabs-left {
+          .${prefixCls}-tabs-ink-bar {
+            width: 3px;
+            border-start-start-radius: 3px;
+            border-end-start-radius: 3px;
+          }
+        }
+
+        &.${prefixCls}-tabs-right {
+          .${prefixCls}-tabs-ink-bar {
+            width: 3px;
+            border-start-end-radius: 3px;
+            border-end-end-radius: 3px;
+          }
+        }
+      }
+    `
+	};
+});
+const variants = cva(styles.root, {
+	defaultVariants: {
+		compact: false,
+		underlined: false,
+		variant: "rounded"
+	},
+	variants: {
+		variant: {
+			square: null,
+			rounded: styles.rounded,
+			point: styles.point
+		},
+		compact: {
+			false: styles.margin,
+			true: styles.compact
+		},
+		underlined: {
+			false: styles.hideHolder,
+			true: null
+		}
+	}
+});
+//#endregion
+export { styles, variants };
+
+//# sourceMappingURL=style.mjs.map

package/es/Tabs/style.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"style.mjs","names":[],"sources":["../../src/Tabs/style.ts"],"sourcesContent":["import { createStaticStyles } from 'antd-style';\r\nimport { cva } from 'class-variance-authority';\r\n\r\nconst prefixCls = 'ant';\r\n\r\nexport const styles = createStaticStyles(({ css, cssVar }) => {\r\n  return {\r\n    compact: css`\r\n      &.${prefixCls}-tabs {\r\n        .${prefixCls}-tabs-tab {\r\n          margin: 4px;\r\n\r\n          + [class*='ant-tabs-tab'] {\r\n            margin: 4px;\r\n          }\r\n        }\r\n      }\r\n    `,\r\n    dropdown: css`\r\n      .${prefixCls}-tabs-dropdown-menu {\r\n        padding: 4px;\r\n        border: 1px solid ${cssVar.colorBorderSecondary};\r\n\r\n        .${prefixCls}-tabs-dropdown-menu-item {\r\n          border-radius: ${cssVar.borderRadius};\r\n        }\r\n      }\r\n    `,\r\n    hideHolder: css`\r\n      &.${prefixCls}-tabs {\r\n        .${prefixCls}-tabs-content-holder {\r\n          display: none;\r\n        }\r\n\r\n        .${prefixCls}-tabs-nav {\r\n          margin: 0;\r\n\r\n          &::before {\r\n            display: none;\r\n          }\r\n        }\r\n      }\r\n    `,\r\n\r\n    margin: css`\r\n      &.${prefixCls}-tabs {\r\n        .${prefixCls}-tabs-tab {\r\n          margin: 8px;\r\n\r\n          + .${prefixCls}-tabs-tab {\r\n            margin: 8px;\r\n          }\r\n        }\r\n      }\r\n    `,\r\n    point: css`\r\n      &.${prefixCls}-tabs {\r\n        &.${prefixCls}-tabs-top {\r\n          .${prefixCls}-tabs-ink-bar {\r\n            width: 8px !important;\r\n            height: 4px;\r\n            border-start-start-radius: 4px;\r\n            border-start-end-radius: 4px;\r\n          }\r\n        }\r\n\r\n        &.${prefixCls}-tabs-bottom {\r\n          .${prefixCls}-tabs-ink-bar {\r\n            width: 8px !important;\r\n            height: 4px;\r\n            border-end-start-radius: 4px;\r\n            border-end-end-radius: 4px;\r\n          }\r\n        }\r\n\r\n        &.${prefixCls}-tabs-left {\r\n          .${prefixCls}-tabs-ink-bar {\r\n            width: 4px;\r\n            height: 8px !important;\r\n            border-start-start-radius: 4px;\r\n            border-end-start-radius: 4px;\r\n          }\r\n        }\r\n\r\n        &.${prefixCls}-tabs-right {\r\n          .${prefixCls}-tabs-ink-bar {\r\n            width: 4px;\r\n            height: 8px !important;\r\n            border-start-end-radius: 4px;\r\n            border-end-end-radius: 4px;\r\n          }\r\n        }\r\n      }\r\n    `,\r\n    root: css`\r\n      &.${prefixCls}-tabs {\r\n        .${prefixCls}-tabs-tab {\r\n          padding-block: 8px;\r\n          padding-inline: 12px;\r\n          color: ${cssVar.colorTextSecondary};\r\n          transition: background-color 100ms ease-out;\r\n\r\n          &:hover {\r\n            border-radius: ${cssVar.borderRadius};\r\n            color: ${cssVar.colorText};\r\n            background: ${cssVar.colorFillTertiary};\r\n          }\r\n        }\r\n      }\r\n    `,\r\n    rounded: css`\r\n      &.${prefixCls}-tabs {\r\n        &.${prefixCls}-tabs-top {\r\n          .${prefixCls}-tabs-ink-bar {\r\n            height: 3px;\r\n            border-start-start-radius: 3px;\r\n            border-start-end-radius: 3px;\r\n          }\r\n        }\r\n\r\n        &.${prefixCls}-tabs-bottom {\r\n          .${prefixCls}-tabs-ink-bar {\r\n            height: 3px;\r\n            border-end-start-radius: 3px;\r\n            border-end-end-radius: 3px;\r\n          }\r\n        }\r\n\r\n        &.${prefixCls}-tabs-left {\r\n          .${prefixCls}-tabs-ink-bar {\r\n            width: 3px;\r\n            border-start-start-radius: 3px;\r\n            border-end-start-radius: 3px;\r\n          }\r\n        }\r\n\r\n        &.${prefixCls}-tabs-right {\r\n          .${prefixCls}-tabs-ink-bar {\r\n            width: 3px;\r\n            border-start-end-radius: 3px;\r\n            border-end-end-radius: 3px;\r\n          }\r\n        }\r\n      }\r\n    `,\r\n  };\r\n});\r\n\r\nexport const variants = cva(styles.root, {\r\n  defaultVariants: {\r\n    compact: false,\r\n    underlined: false,\r\n    variant: 'rounded',\r\n  },\r\n\r\n  variants: {\r\n    variant: {\r\n      square: null,\r\n      rounded: styles.rounded,\r\n      point: styles.point,\r\n    },\r\n    compact: {\r\n      false: styles.margin,\r\n      true: styles.compact,\r\n    },\r\n    underlined: {\r\n      false: styles.hideHolder,\r\n      true: null,\r\n    },\r\n  },\r\n});\r\n"],"mappings":";;;AAGA,MAAM,YAAY;AAElB,MAAa,SAAS,oBAAoB,EAAE,KAAK,aAAa;CAC5D,OAAO;EACL,SAAS,GAAG;UACN,UAAU;WACT,UAAU;;;;;;;;;EASjB,UAAU,GAAG;SACR,UAAU;;4BAES,OAAO,qBAAqB;;WAE7C,UAAU;2BACM,OAAO,aAAa;;;;EAI3C,YAAY,GAAG;UACT,UAAU;WACT,UAAU;;;;WAIV,UAAU;;;;;;;;;EAUjB,QAAQ,GAAG;UACL,UAAU;WACT,UAAU;;;eAGN,UAAU;;;;;;EAMrB,OAAO,GAAG;UACJ,UAAU;YACR,UAAU;aACT,UAAU;;;;;;;;YAQX,UAAU;aACT,UAAU;;;;;;;;YAQX,UAAU;aACT,UAAU;;;;;;;;YAQX,UAAU;aACT,UAAU;;;;;;;;;EASnB,MAAM,GAAG;UACH,UAAU;WACT,UAAU;;;mBAGF,OAAO,mBAAmB;;;;6BAIhB,OAAO,aAAa;qBAC5B,OAAO,UAAU;0BACZ,OAAO,kBAAkB;;;;;EAK/C,SAAS,GAAG;UACN,UAAU;YACR,UAAU;aACT,UAAU;;;;;;;YAOX,UAAU;aACT,UAAU;;;;;;;YAOX,UAAU;aACT,UAAU;;;;;;;YAOX,UAAU;aACT,UAAU;;;;;;;;CAQrB;AACF,CAAC;AAED,MAAa,WAAW,IAAI,OAAO,MAAM;CACvC,iBAAiB;EACf,SAAS;EACT,YAAY;EACZ,SAAS;CACX;CAEA,UAAU;EACR,SAAS;GACP,QAAQ;GACR,SAAS,OAAO;GAChB,OAAO,OAAO;EAChB;EACA,SAAS;GACP,OAAO,OAAO;GACd,MAAM,OAAO;EACf;EACA,YAAY;GACV,OAAO,OAAO;GACd,MAAM;EACR;CACF;AACF,CAAC"}

package/es/Tabs/type.d.mts

@@ -0,0 +1,9 @@
+import { TabsProps } from "antd";
+//#region src/Tabs/type.d.ts
+interface TabsProps$1 extends TabsProps {
+  compact?: boolean;
+  variant?: 'square' | 'rounded' | 'point';
+}
+//#endregion
+export { TabsProps$1 as TabsProps };
+//# sourceMappingURL=type.d.mts.map

package/es/Tag/Tag.d.mts

@@ -0,0 +1,10 @@
+import { TagProps } from "./type.mjs";
+import { FC } from "react";
+//#region src/Tag/Tag.d.ts
+/**
+ * @deprecated Use `Tag` from `@jinmi/ui/base-ui` instead.
+ */
+declare const Tag: FC<TagProps>;
+//#endregion
+export { Tag as default };
+//# sourceMappingURL=Tag.d.mts.map

package/es/Tag/Tag.mjs

@@ -0,0 +1,72 @@
+"use client";
+import { safeReadableColor } from "../utils/safeReadableColor.mjs";
+import { colorsPreset, colorsPresetSystem, presetColors, presetSystemColors } from "./utils.mjs";
+import { variants } from "./styles.mjs";
+import { useMemo } from "react";
+import { jsx } from "react/jsx-runtime";
+import { cssVar, cx } from "antd-style";
+import { Tag } from "antd";
+//#region src/Tag/Tag.tsx
+/**
+* @deprecated Use `Tag` from `@jinmi/ui/base-ui` instead.
+*/
+const Tag$1 = ({ className, ref, shape = "normal", size = "middle", color, variant = "filled", children, onClick, style, ...rest }) => {
+	const colors = useMemo(() => {
+		let textColor = cssVar.colorTextSecondary;
+		let backgroundColor;
+		let borderColor;
+		const isBorderless = variant === "borderless";
+		const isFilled = variant === "filled";
+		const isSolid = variant === "solid";
+		const isPresetColor = color && presetColors.includes(color);
+		const isPresetSystemColors = color && presetSystemColors.has(color);
+		const isHexColor = color && color.startsWith("#");
+		if (isPresetColor) {
+			const solidBgColor = colorsPreset(color);
+			textColor = isSolid ? safeReadableColor(solidBgColor) : colorsPreset(color, "active");
+			backgroundColor = isSolid ? solidBgColor : isBorderless ? "transparent" : colorsPreset(color, "fillTertiary");
+			borderColor = isSolid ? solidBgColor : colorsPreset(color, isFilled ? "fillQuaternary" : "fillTertiary");
+		}
+		if (isPresetSystemColors) {
+			const solidBgColor = colorsPresetSystem(color);
+			textColor = isSolid ? safeReadableColor(solidBgColor) : colorsPresetSystem(color);
+			backgroundColor = isSolid ? solidBgColor : isBorderless ? "transparent" : colorsPresetSystem(color, "fillTertiary");
+			borderColor = isSolid ? solidBgColor : colorsPresetSystem(color, isFilled ? "fillQuaternary" : "fillTertiary");
+		}
+		if (isHexColor) {
+			textColor = isSolid ? safeReadableColor(color) : isBorderless ? color : cssVar.colorBgLayout;
+			backgroundColor = isSolid ? color : isBorderless ? "transparent" : color;
+			borderColor = isSolid ? color : borderColor;
+		}
+		return {
+			backgroundColor,
+			borderColor,
+			textColor
+		};
+	}, [color, variant]);
+	return /* @__PURE__ */ jsx(Tag, {
+		className: cx(variants({
+			shape,
+			size,
+			variant
+		}), className),
+		color,
+		ref,
+		variant: variant === "borderless" ? "outlined" : variant === "solid" ? "filled" : variant,
+		style: {
+			background: colors?.backgroundColor,
+			borderColor: colors?.borderColor,
+			color: colors?.textColor,
+			cursor: onClick ? "pointer" : void 0,
+			...style
+		},
+		onClick,
+		...rest,
+		children
+	});
+};
+Tag$1.displayName = "Tag";
+//#endregion
+export { Tag$1 as default };
+
+//# sourceMappingURL=Tag.mjs.map

package/es/Tag/Tag.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"Tag.mjs","names":["Tag","AntTag"],"sources":["../../src/Tag/Tag.tsx"],"sourcesContent":["'use client';\n\nimport { Tag as AntTag } from 'antd';\nimport { cssVar, cx } from 'antd-style';\nimport { type FC, useMemo } from 'react';\n\nimport { colorsPreset, colorsPresetSystem, presetColors, presetSystemColors } from '@/Tag/utils';\nimport { safeReadableColor } from '@/utils/safeReadableColor';\n\nimport { variants } from './styles';\nimport type { TagProps } from './type';\n\n/**\n * @deprecated Use `Tag` from `@jinmi/ui/base-ui` instead.\n */\nconst Tag: FC<TagProps> = ({\n  className,\n  ref,\n  shape = 'normal',\n  size = 'middle',\n  color,\n  variant = 'filled',\n  children,\n  onClick,\n  style,\n  ...rest\n}) => {\n  const colors = useMemo(() => {\n    let textColor = cssVar.colorTextSecondary;\n    let backgroundColor;\n    let borderColor;\n    const isBorderless = variant === 'borderless';\n    const isFilled = variant === 'filled';\n    const isSolid = variant === 'solid';\n    const isPresetColor = color && presetColors.includes(color);\n    const isPresetSystemColors = color && presetSystemColors.has(color);\n    const isHexColor = color && color.startsWith('#');\n\n    if (isPresetColor) {\n      const solidBgColor = colorsPreset(color);\n      textColor = isSolid ? safeReadableColor(solidBgColor) : colorsPreset(color, 'active');\n      backgroundColor = isSolid\n        ? solidBgColor\n        : isBorderless\n          ? 'transparent'\n          : colorsPreset(color, 'fillTertiary');\n      borderColor = isSolid\n        ? solidBgColor\n        : colorsPreset(color, isFilled ? 'fillQuaternary' : 'fillTertiary');\n    }\n    if (isPresetSystemColors) {\n      const solidBgColor = colorsPresetSystem(color);\n      textColor = isSolid ? safeReadableColor(solidBgColor) : colorsPresetSystem(color);\n      backgroundColor = isSolid\n        ? solidBgColor\n        : isBorderless\n          ? 'transparent'\n          : colorsPresetSystem(color, 'fillTertiary');\n      borderColor = isSolid\n        ? solidBgColor\n        : colorsPresetSystem(color, isFilled ? 'fillQuaternary' : 'fillTertiary');\n    }\n    if (isHexColor) {\n      textColor = isSolid ? safeReadableColor(color) : isBorderless ? color : cssVar.colorBgLayout;\n      backgroundColor = isSolid ? color : isBorderless ? 'transparent' : color;\n      borderColor = isSolid ? color : borderColor;\n    }\n\n    return {\n      backgroundColor,\n      borderColor,\n      textColor,\n    };\n  }, [color, variant]);\n\n  return (\n    <AntTag\n      className={cx(variants({ shape, size, variant: variant as any }), className)}\n      color={color}\n      ref={ref}\n      variant={variant === 'borderless' ? 'outlined' : variant === 'solid' ? 'filled' : variant}\n      style={{\n        background: colors?.backgroundColor,\n        borderColor: colors?.borderColor,\n        color: colors?.textColor,\n        cursor: onClick ? 'pointer' : undefined,\n        ...style,\n      }}\n      onClick={onClick}\n      {...rest}\n    >\n      {children}\n    </AntTag>\n  );\n};\n\nTag.displayName = 'Tag';\n\nexport default Tag;\n"],"mappings":";;;;;;;;;;;;AAeA,MAAMA,SAAqB,EACzB,WACA,KACA,QAAQ,UACR,OAAO,UACP,OACA,UAAU,UACV,UACA,SACA,OACA,GAAG,WACC;CACJ,MAAM,SAAS,cAAc;EAC3B,IAAI,YAAY,OAAO;EACvB,IAAI;EACJ,IAAI;EACJ,MAAM,eAAe,YAAY;EACjC,MAAM,WAAW,YAAY;EAC7B,MAAM,UAAU,YAAY;EAC5B,MAAM,gBAAgB,SAAS,aAAa,SAAS,KAAK;EAC1D,MAAM,uBAAuB,SAAS,mBAAmB,IAAI,KAAK;EAClE,MAAM,aAAa,SAAS,MAAM,WAAW,GAAG;EAEhD,IAAI,eAAe;GACjB,MAAM,eAAe,aAAa,KAAK;GACvC,YAAY,UAAU,kBAAkB,YAAY,IAAI,aAAa,OAAO,QAAQ;GACpF,kBAAkB,UACd,eACA,eACE,gBACA,aAAa,OAAO,cAAc;GACxC,cAAc,UACV,eACA,aAAa,OAAO,WAAW,mBAAmB,cAAc;EACtE;EACA,IAAI,sBAAsB;GACxB,MAAM,eAAe,mBAAmB,KAAK;GAC7C,YAAY,UAAU,kBAAkB,YAAY,IAAI,mBAAmB,KAAK;GAChF,kBAAkB,UACd,eACA,eACE,gBACA,mBAAmB,OAAO,cAAc;GAC9C,cAAc,UACV,eACA,mBAAmB,OAAO,WAAW,mBAAmB,cAAc;EAC5E;EACA,IAAI,YAAY;GACd,YAAY,UAAU,kBAAkB,KAAK,IAAI,eAAe,QAAQ,OAAO;GAC/E,kBAAkB,UAAU,QAAQ,eAAe,gBAAgB;GACnE,cAAc,UAAU,QAAQ;EAClC;EAEA,OAAO;GACL;GACA;GACA;EACF;CACF,GAAG,CAAC,OAAO,OAAO,CAAC;CAEnB,OACE,oBAACC,KAAD;EACE,WAAW,GAAG,SAAS;GAAE;GAAO;GAAe;EAAe,CAAC,GAAG,SAAS;EACpE;EACF;EACL,SAAS,YAAY,eAAe,aAAa,YAAY,UAAU,WAAW;EAClF,OAAO;GACL,YAAY,QAAQ;GACpB,aAAa,QAAQ;GACrB,OAAO,QAAQ;GACf,QAAQ,UAAU,YAAY,KAAA;GAC9B,GAAG;EACL;EACS;EACT,GAAI;EAEH;CACK,CAAA;AAEZ;AAEA,MAAI,cAAc"}

package/es/Tag/index.d.mts

@@ -0,0 +1,3 @@
+import { TagProps } from "./type.mjs";
+import Tag from "./Tag.mjs";
+export { type TagProps, Tag as default };

package/es/Tag/styles.mjs

@@ -0,0 +1,116 @@
+import { staticStylish } from "../styles/theme/customStylishStatic.mjs";
+import { createStaticStyles } from "antd-style";
+import { cva } from "class-variance-authority";
+//#region src/Tag/styles.ts
+const prefixCls = "ant";
+const styles = createStaticStyles(({ css, cssVar }) => ({
+	borderless: staticStylish.variantBorderlessWithoutHover,
+	filled: staticStylish.variantFilledWithoutHover,
+	large: css`
+    &.${prefixCls}-tag {
+      height: 28px;
+      padding-inline: 12px;
+      border-radius: 6px !important;
+    }
+  `,
+	outlined: staticStylish.variantOutlinedWithoutHover,
+	round: css`
+    &.${prefixCls}-tag {
+      border-radius: 999px !important;
+    }
+  `,
+	roundLarge: css`
+    &.${prefixCls}-tag {
+      padding-inline: 14px;
+    }
+  `,
+	roundMiddle: css`
+    &.${prefixCls}-tag {
+      padding-inline: 10px;
+    }
+  `,
+	roundSmall: css`
+    &.${prefixCls}-tag {
+      padding-inline: 8px;
+    }
+  `,
+	root: css`
+    color: ${cssVar.colorTextSecondary};
+
+    &.${prefixCls}-tag {
+      user-select: none;
+
+      display: flex;
+      gap: 0.4em;
+      align-items: center;
+      justify-content: center;
+
+      width: fit-content;
+      height: 22px;
+      margin: 0;
+      border-radius: 3px;
+
+      line-height: 1.2;
+
+      span {
+        margin: 0;
+      }
+
+      span:not(.anticon) {
+        line-height: inherit;
+      }
+    }
+  `,
+	small: css`
+    &.${prefixCls}-tag {
+      height: 20px;
+      padding-inline: 4px;
+      border-radius: 3px;
+    }
+  `
+}));
+const variants = cva(styles.root, {
+	defaultVariants: {
+		shape: "normal",
+		size: "middle",
+		variant: "filled"
+	},
+	compoundVariants: [
+		{
+			className: styles.roundSmall,
+			shape: "round",
+			size: "small"
+		},
+		{
+			className: styles.roundMiddle,
+			shape: "round",
+			size: "middle"
+		},
+		{
+			className: styles.roundLarge,
+			shape: "round",
+			size: "large"
+		}
+	],
+	variants: {
+		shape: {
+			normal: null,
+			round: styles.round
+		},
+		variant: {
+			filled: styles.filled,
+			outlined: styles.outlined,
+			borderless: styles.borderless,
+			solid: styles.filled
+		},
+		size: {
+			small: styles.small,
+			middle: null,
+			large: styles.large
+		}
+	}
+});
+//#endregion
+export { styles, variants };
+
+//# sourceMappingURL=styles.mjs.map

package/es/Tag/styles.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"styles.mjs","names":["lobeStaticStylish"],"sources":["../../src/Tag/styles.ts"],"sourcesContent":["import { createStaticStyles } from 'antd-style';\r\nimport { cva } from 'class-variance-authority';\r\n\r\nimport { lobeStaticStylish } from '@/styles';\r\n\r\nconst prefixCls = 'ant';\r\n\r\nexport const styles = createStaticStyles(({ css, cssVar }) => ({\r\n  borderless: lobeStaticStylish.variantBorderlessWithoutHover,\r\n  filled: lobeStaticStylish.variantFilledWithoutHover,\r\n  large: css`\r\n    &.${prefixCls}-tag {\r\n      height: 28px;\r\n      padding-inline: 12px;\r\n      border-radius: 6px !important;\r\n    }\r\n  `,\r\n  outlined: lobeStaticStylish.variantOutlinedWithoutHover,\r\n  round: css`\r\n    &.${prefixCls}-tag {\r\n      border-radius: 999px !important;\r\n    }\r\n  `,\r\n  roundLarge: css`\r\n    &.${prefixCls}-tag {\r\n      padding-inline: 14px;\r\n    }\r\n  `,\r\n  roundMiddle: css`\r\n    &.${prefixCls}-tag {\r\n      padding-inline: 10px;\r\n    }\r\n  `,\r\n  roundSmall: css`\r\n    &.${prefixCls}-tag {\r\n      padding-inline: 8px;\r\n    }\r\n  `,\r\n  root: css`\r\n    color: ${cssVar.colorTextSecondary};\r\n\r\n    &.${prefixCls}-tag {\r\n      user-select: none;\r\n\r\n      display: flex;\r\n      gap: 0.4em;\r\n      align-items: center;\r\n      justify-content: center;\r\n\r\n      width: fit-content;\r\n      height: 22px;\r\n      margin: 0;\r\n      border-radius: 3px;\r\n\r\n      line-height: 1.2;\r\n\r\n      span {\r\n        margin: 0;\r\n      }\r\n\r\n      span:not(.anticon) {\r\n        line-height: inherit;\r\n      }\r\n    }\r\n  `,\r\n  small: css`\r\n    &.${prefixCls}-tag {\r\n      height: 20px;\r\n      padding-inline: 4px;\r\n      border-radius: 3px;\r\n    }\r\n  `,\r\n}));\r\n\r\nexport const variants = cva(styles.root, {\r\n  defaultVariants: {\r\n    shape: 'normal',\r\n    size: 'middle',\r\n    variant: 'filled',\r\n  },\r\n\r\n  compoundVariants: [\r\n    {\r\n      className: styles.roundSmall,\r\n      shape: 'round',\r\n      size: 'small',\r\n    },\r\n    {\r\n      className: styles.roundMiddle,\r\n      shape: 'round',\r\n      size: 'middle',\r\n    },\r\n    {\r\n      className: styles.roundLarge,\r\n      shape: 'round',\r\n      size: 'large',\r\n    },\r\n  ],\r\n\r\n  variants: {\r\n    shape: {\r\n      normal: null,\r\n      round: styles.round,\r\n    },\r\n    variant: {\r\n      filled: styles.filled,\r\n      outlined: styles.outlined,\r\n      borderless: styles.borderless,\r\n      solid: styles.filled,\r\n    },\r\n    size: {\r\n      small: styles.small,\r\n      middle: null,\r\n      large: styles.large,\r\n    },\r\n  },\r\n});\r\n"],"mappings":";;;;AAKA,MAAM,YAAY;AAElB,MAAa,SAAS,oBAAoB,EAAE,KAAK,cAAc;CAC7D,YAAYA,cAAkB;CAC9B,QAAQA,cAAkB;CAC1B,OAAO,GAAG;QACJ,UAAU;;;;;;CAMhB,UAAUA,cAAkB;CAC5B,OAAO,GAAG;QACJ,UAAU;;;;CAIhB,YAAY,GAAG;QACT,UAAU;;;;CAIhB,aAAa,GAAG;QACV,UAAU;;;;CAIhB,YAAY,GAAG;QACT,UAAU;;;;CAIhB,MAAM,GAAG;aACE,OAAO,mBAAmB;;QAE/B,UAAU;;;;;;;;;;;;;;;;;;;;;;;;CAwBhB,OAAO,GAAG;QACJ,UAAU;;;;;;AAMlB,EAAE;AAEF,MAAa,WAAW,IAAI,OAAO,MAAM;CACvC,iBAAiB;EACf,OAAO;EACP,MAAM;EACN,SAAS;CACX;CAEA,kBAAkB;EAChB;GACE,WAAW,OAAO;GAClB,OAAO;GACP,MAAM;EACR;EACA;GACE,WAAW,OAAO;GAClB,OAAO;GACP,MAAM;EACR;EACA;GACE,WAAW,OAAO;GAClB,OAAO;GACP,MAAM;EACR;CACF;CAEA,UAAU;EACR,OAAO;GACL,QAAQ;GACR,OAAO,OAAO;EAChB;EACA,SAAS;GACP,QAAQ,OAAO;GACf,UAAU,OAAO;GACjB,YAAY,OAAO;GACnB,OAAO,OAAO;EAChB;EACA,MAAM;GACJ,OAAO,OAAO;GACd,QAAQ;GACR,OAAO,OAAO;EAChB;CACF;AACF,CAAC"}

package/es/Tag/type.d.mts

@@ -0,0 +1,13 @@
+import { Ref } from "react";
+import { TagProps } from "antd";
+//#region src/Tag/type.d.ts
+interface TagProps$1 extends Omit<TagProps, 'color' | 'variant'> {
+  color?: TagProps['color'] | 'info';
+  ref?: Ref<HTMLDivElement>;
+  shape?: 'normal' | 'round';
+  size?: 'small' | 'middle' | 'large';
+  variant?: 'filled' | 'outlined' | 'borderless' | 'solid';
+}
+//#endregion
+export { TagProps$1 as TagProps };
+//# sourceMappingURL=type.d.mts.map

package/es/Tag/utils.mjs

@@ -0,0 +1,41 @@
+import { cssVar } from "antd-style";
+import { camelCase } from "es-toolkit/compat";
+//#region src/Tag/utils.ts
+const presetColors = [
+	"red",
+	"volcano",
+	"orange",
+	"gold",
+	"yellow",
+	"lime",
+	"green",
+	"cyan",
+	"blue",
+	"geekblue",
+	"purple",
+	"magenta",
+	"gray"
+];
+const presetSystemColors = /* @__PURE__ */ new Set([
+	"error",
+	"warning",
+	"success",
+	"info",
+	"processing"
+]);
+const toKebabCase = (value) => value.replaceAll(/([a-z])([A-Z])/g, "$1-$2").replaceAll(/([a-z])(\d)/g, "$1-$2").replaceAll(/(\d)([A-Z])/g, "$1-$2").replaceAll(/([A-Z]+)([A-Z][a-z])/g, "$1-$2").toLowerCase();
+const getCssVar = (tokenKey) => {
+	return cssVar[tokenKey] || `var(--ant-${toKebabCase(tokenKey)})`;
+};
+const colorsPreset = (type, ...keys) => getCssVar(camelCase([type, ...keys].join("-")));
+const colorsPresetSystem = (type, ...keys) => {
+	return getCssVar(camelCase([
+		"color",
+		type === "processing" ? "info" : type,
+		...keys
+	].join("-")));
+};
+//#endregion
+export { colorsPreset, colorsPresetSystem, presetColors, presetSystemColors };
+
+//# sourceMappingURL=utils.mjs.map

package/es/Tag/utils.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"utils.mjs","names":[],"sources":["../../src/Tag/utils.ts"],"sourcesContent":["import { cssVar } from 'antd-style';\r\nimport { camelCase } from 'es-toolkit/compat';\r\n\r\nexport const presetColors = [\r\n  'red',\r\n  'volcano',\r\n  'orange',\r\n  'gold',\r\n  'yellow',\r\n  'lime',\r\n  'green',\r\n  'cyan',\r\n  'blue',\r\n  'geekblue',\r\n  'purple',\r\n  'magenta',\r\n  'gray',\r\n];\r\n\r\nexport const presetSystemColors = new Set(['error', 'warning', 'success', 'info', 'processing']);\r\n\r\nconst toKebabCase = (value: string) =>\r\n  value\r\n    .replaceAll(/([a-z])([A-Z])/g, '$1-$2')\r\n    .replaceAll(/([a-z])(\\d)/g, '$1-$2')\r\n    .replaceAll(/(\\d)([A-Z])/g, '$1-$2')\r\n    .replaceAll(/([A-Z]+)([A-Z][a-z])/g, '$1-$2')\r\n    .toLowerCase();\r\n\r\nconst getCssVar = (tokenKey: string) => {\r\n  const mapped = (cssVar as Record<string, string>)[tokenKey];\r\n  return mapped || `var(--ant-${toKebabCase(tokenKey)})`;\r\n};\r\n\r\nexport const colorsPreset = (type: string, ...keys: string[]) =>\r\n  getCssVar(camelCase([type, ...keys].join('-')));\r\n\r\nexport const colorsPresetSystem = (type: string, ...keys: string[]) => {\r\n  const t = type === 'processing' ? 'info' : type;\r\n  return getCssVar(camelCase(['color', t, ...keys].join('-')));\r\n};\r\n"],"mappings":";;;AAGA,MAAa,eAAe;CAC1B;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;AACF;AAEA,MAAa,qCAAqB,IAAI,IAAI;CAAC;CAAS;CAAW;CAAW;CAAQ;AAAY,CAAC;AAE/F,MAAM,eAAe,UACnB,MACG,WAAW,mBAAmB,OAAO,CAAC,CACtC,WAAW,gBAAgB,OAAO,CAAC,CACnC,WAAW,gBAAgB,OAAO,CAAC,CACnC,WAAW,yBAAyB,OAAO,CAAC,CAC5C,YAAY;AAEjB,MAAM,aAAa,aAAqB;CAEtC,OADgB,OAAkC,aACjC,aAAa,YAAY,QAAQ,EAAE;AACtD;AAEA,MAAa,gBAAgB,MAAc,GAAG,SAC5C,UAAU,UAAU,CAAC,MAAM,GAAG,IAAI,CAAC,CAAC,KAAK,GAAG,CAAC,CAAC;AAEhD,MAAa,sBAAsB,MAAc,GAAG,SAAmB;CAErE,OAAO,UAAU,UAAU;EAAC;EADlB,SAAS,eAAe,SAAS;EACH,GAAG;CAAI,CAAC,CAAC,KAAK,GAAG,CAAC,CAAC;AAC7D"}

package/es/Text/Text.d.mts

@@ -0,0 +1,10 @@
+import { TextProps } from "./type.mjs";
+import { FC } from "react";
+//#region src/Text/Text.d.ts
+/**
+ * @deprecated Use `Text` from `@jinmi/ui/base-ui` instead.
+ */
+declare const Text: FC<TextProps>;
+//#endregion
+export { Text as default };
+//# sourceMappingURL=Text.d.mts.map