@lobehub/ui 1.171.0 → 2.0.0

package/es/SortableList/{SortableItem.js → components/SortableItem.js}

@@ -1,5 +1,7 @@
+'use client';
+
 function _typeof(o) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (o) { return typeof o; } : function (o) { return o && "function" == typeof Symbol && o.constructor === Symbol && o !== Symbol.prototype ? "symbol" : typeof o; }, _typeof(o); }
-var _excluded = ["children", "id", "style"];
+var _excluded = ["variant", "className", "children", "id", "style"];
 function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
 function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
 function _defineProperty(obj, key, value) { key = _toPropertyKey(key); if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
@@ -9,9 +11,10 @@ function _objectWithoutProperties(source, excluded) { if (source == null) return
 function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }
 import { useSortable } from '@dnd-kit/sortable';
 import { CSS } from '@dnd-kit/utilities';
+import { cva } from 'class-variance-authority';
 import { createContext, memo, useMemo } from 'react';
 import { Flexbox } from 'react-layout-kit';
-import { useStyles } from "./style";
+import { useStyles } from "../style";
 import { jsx as _jsx } from "react/jsx-runtime";
 export var SortableItemContext = /*#__PURE__*/createContext({
   attributes: {},
@@ -19,12 +22,39 @@ export var SortableItemContext = /*#__PURE__*/createContext({
   ref: function ref() {}
 });
 var SortableItem = /*#__PURE__*/memo(function (_ref) {
-  var children = _ref.children,
+  var _ref$variant = _ref.variant,
+    variant = _ref$variant === void 0 ? 'borderless' : _ref$variant,
+    className = _ref.className,
+    children = _ref.children,
     id = _ref.id,
     style = _ref.style,
     rest = _objectWithoutProperties(_ref, _excluded);
   var _useStyles = useStyles(),
+    cx = _useStyles.cx,
     styles = _useStyles.styles;
+  var variants = useMemo(function () {
+    return cva(styles.item, {
+      compoundVariants: [{
+        className: styles.itemVariant,
+        variant: 'outlined'
+      }, {
+        className: styles.itemVariant,
+        variant: 'filled'
+      }],
+      defaultVariants: {
+        variant: 'borderless'
+      },
+      /* eslint-disable sort-keys-fix/sort-keys-fix */
+      variants: {
+        variant: {
+          filled: styles.filled,
+          outlined: styles.outlined,
+          borderless: styles.borderless
+        }
+      }
+      /* eslint-enable sort-keys-fix/sort-keys-fix */
+    });
+  }, [styles]);
   var _useSortable = useSortable({
       id: id
     }),
@@ -42,12 +72,15 @@ var SortableItem = /*#__PURE__*/memo(function (_ref) {
       ref: setActivatorNodeRef
     };
   }, [attributes, listeners, setActivatorNodeRef]);
-  return /*#__PURE__*/_jsx(SortableItemContext.Provider, {
+  return /*#__PURE__*/_jsx(SortableItemContext, {
     value: context,
     children: /*#__PURE__*/_jsx(Flexbox, _objectSpread(_objectSpread({
       align: 'center',
       as: 'li',
-      className: styles.item,
+      className: cx(variants({
+        className: className,
+        variant: variant
+      })),
       gap: 4,
       horizontal: true,
       ref: setNodeRef,
@@ -61,4 +94,5 @@ var SortableItem = /*#__PURE__*/memo(function (_ref) {
     }))
   });
 });
+SortableItem.displayName = 'SortableItem';
 export default SortableItem;

package/es/SortableList/{SortableOverlay.js → components/SortableOverlay.js}

@@ -1,3 +1,5 @@
+'use client';
+
 import { DragOverlay, defaultDropAnimationSideEffects } from '@dnd-kit/core';
 import { memo } from 'react';
 import { jsx as _jsx } from "react/jsx-runtime";
@@ -17,4 +19,5 @@ var SortableOverlay = /*#__PURE__*/memo(function (_ref) {
     children: children
   });
 });
+SortableOverlay.displayName = 'SortableOverlay';
 export default SortableOverlay;

package/es/SortableList/index.d.ts

@@ -1,20 +1,2 @@
-import { type ReactNode } from 'react';
-import { type FlexboxProps } from 'react-layout-kit';
-import DragHandle from './DragHandle';
-import SortableItem from './SortableItem';
-interface BaseItem {
-    [key: string]: any;
-    id: string | number;
-}
-export interface SortableListProps extends Omit<FlexboxProps, 'onChange'> {
-    items: BaseItem[];
-    onChange(items: BaseItem[]): void;
-    renderItem(item: BaseItem): ReactNode;
-}
-export interface ISortableList {
-    (props: SortableListProps): ReactNode;
-    DragHandle: typeof DragHandle;
-    Item: typeof SortableItem;
-}
-declare const SortableList: ISortableList;
-export default SortableList;
+export { default } from './SortableList';
+export type * from './type';

package/es/SortableList/index.js

@@ -1,98 +1 @@
-'use client';
-
-function _typeof(o) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (o) { return typeof o; } : function (o) { return o && "function" == typeof Symbol && o.constructor === Symbol && o !== Symbol.prototype ? "symbol" : typeof o; }, _typeof(o); }
-var _excluded = ["items", "onChange", "renderItem", "gap"];
-function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
-function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
-function _defineProperty(obj, key, value) { key = _toPropertyKey(key); if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
-function _toPropertyKey(t) { var i = _toPrimitive(t, "string"); return "symbol" == _typeof(i) ? i : String(i); }
-function _toPrimitive(t, r) { if ("object" != _typeof(t) || !t) return t; var e = t[Symbol.toPrimitive]; if (void 0 !== e) { var i = e.call(t, r || "default"); if ("object" != _typeof(i)) return i; throw new TypeError("@@toPrimitive must return a primitive value."); } return ("string" === r ? String : Number)(t); }
-function _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest(); }
-function _nonIterableRest() { throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
-function _unsupportedIterableToArray(o, minLen) { if (!o) return; if (typeof o === "string") return _arrayLikeToArray(o, minLen); var n = Object.prototype.toString.call(o).slice(8, -1); if (n === "Object" && o.constructor) n = o.constructor.name; if (n === "Map" || n === "Set") return Array.from(o); if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen); }
-function _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len = arr.length; for (var i = 0, arr2 = new Array(len); i < len; i++) arr2[i] = arr[i]; return arr2; }
-function _iterableToArrayLimit(r, l) { var t = null == r ? null : "undefined" != typeof Symbol && r[Symbol.iterator] || r["@@iterator"]; if (null != t) { var e, n, i, u, a = [], f = !0, o = !1; try { if (i = (t = t.call(r)).next, 0 === l) { if (Object(t) !== t) return; f = !1; } else for (; !(f = (e = i.call(t)).done) && (a.push(e.value), a.length !== l); f = !0); } catch (r) { o = !0, n = r; } finally { try { if (!f && null != t.return && (u = t.return(), Object(u) !== u)) return; } finally { if (o) throw n; } } return a; } }
-function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
-function _objectWithoutProperties(source, excluded) { if (source == null) return {}; var target = _objectWithoutPropertiesLoose(source, excluded); var key, i; if (Object.getOwnPropertySymbols) { var sourceSymbolKeys = Object.getOwnPropertySymbols(source); for (i = 0; i < sourceSymbolKeys.length; i++) { key = sourceSymbolKeys[i]; if (excluded.indexOf(key) >= 0) continue; if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue; target[key] = source[key]; } } return target; }
-function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }
-import { DndContext, KeyboardSensor, PointerSensor, useSensor, useSensors } from '@dnd-kit/core';
-import { restrictToVerticalAxis, restrictToWindowEdges } from '@dnd-kit/modifiers';
-import { SortableContext, arrayMove, sortableKeyboardCoordinates, verticalListSortingStrategy } from '@dnd-kit/sortable';
-import { Fragment, memo, useMemo, useState } from 'react';
-import { Flexbox } from 'react-layout-kit';
-import DragHandle from "./DragHandle";
-import SortableItem from "./SortableItem";
-import SortableOverlay from "./SortableOverlay";
-import { useStyles } from "./style";
-import { jsx as _jsx } from "react/jsx-runtime";
-import { jsxs as _jsxs } from "react/jsx-runtime";
-var SortableListParent = /*#__PURE__*/memo(function (_ref) {
-  var items = _ref.items,
-    onChange = _ref.onChange,
-    renderItem = _ref.renderItem,
-    _ref$gap = _ref.gap,
-    gap = _ref$gap === void 0 ? 8 : _ref$gap,
-    rest = _objectWithoutProperties(_ref, _excluded);
-  var _useState = useState(null),
-    _useState2 = _slicedToArray(_useState, 2),
-    active = _useState2[0],
-    setActive = _useState2[1];
-  var _useStyles = useStyles(),
-    styles = _useStyles.styles;
-  var activeItem = useMemo(function () {
-    return items.find(function (item) {
-      return item.id === (active === null || active === void 0 ? void 0 : active.id);
-    });
-  }, [active, items]);
-  var sensors = useSensors(useSensor(PointerSensor), useSensor(KeyboardSensor, {
-    coordinateGetter: sortableKeyboardCoordinates
-  }));
-  return /*#__PURE__*/_jsxs(DndContext, {
-    modifiers: [restrictToVerticalAxis, restrictToWindowEdges],
-    onDragCancel: function onDragCancel() {
-      setActive(null);
-    },
-    onDragEnd: function onDragEnd(_ref2) {
-      var active = _ref2.active,
-        over = _ref2.over;
-      if (over && active.id !== (over === null || over === void 0 ? void 0 : over.id)) {
-        var activeIndex = items.findIndex(function (_ref3) {
-          var id = _ref3.id;
-          return id === active.id;
-        });
-        var overIndex = items.findIndex(function (_ref4) {
-          var id = _ref4.id;
-          return id === over.id;
-        });
-        onChange(arrayMove(items, activeIndex, overIndex));
-      }
-      setActive(null);
-    },
-    onDragStart: function onDragStart(_ref5) {
-      var active = _ref5.active;
-      setActive(active);
-    },
-    sensors: sensors,
-    children: [/*#__PURE__*/_jsx(SortableContext, {
-      items: items,
-      strategy: verticalListSortingStrategy,
-      children: /*#__PURE__*/_jsx(Flexbox, _objectSpread(_objectSpread({
-        as: 'ul',
-        className: styles.container,
-        gap: gap
-      }, rest), {}, {
-        children: items.map(function (item) {
-          return /*#__PURE__*/_jsx(Fragment, {
-            children: renderItem(item)
-          }, item.id);
-        })
-      }))
-    }), /*#__PURE__*/_jsx(SortableOverlay, {
-      children: activeItem ? renderItem(activeItem) : null
-    })]
-  });
-});
-var SortableList = SortableListParent;
-SortableList.Item = SortableItem;
-SortableList.DragHandle = DragHandle;
-export default SortableList;
+export { default } from "./SortableList";

package/es/SortableList/style.d.ts

@@ -1,4 +1,8 @@
 export declare const useStyles: (props?: unknown) => import("antd-style").ReturnStyles<{
+    borderless: string;
     container: import("antd-style").SerializedStyles;
+    filled: string;
     item: import("antd-style").SerializedStyles;
+    itemVariant: import("antd-style").SerializedStyles;
+    outlined: string;
 }>;

package/es/SortableList/style.js

@@ -1,10 +1,16 @@
-var _templateObject, _templateObject2;
+var _templateObject, _templateObject2, _templateObject3;
 function _taggedTemplateLiteral(strings, raw) { if (!raw) { raw = strings.slice(0); } return Object.freeze(Object.defineProperties(strings, { raw: { value: Object.freeze(raw) } })); }
 import { createStyles } from 'antd-style';
 export var useStyles = createStyles(function (_ref) {
-  var css = _ref.css;
+  var css = _ref.css,
+    stylish = _ref.stylish,
+    token = _ref.token;
   return {
+    borderless: stylish.variantBorderlessWithoutHover,
     container: css(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n      padding: 0;\n      list-style: none;\n    "]))),
-    item: css(_templateObject2 || (_templateObject2 = _taggedTemplateLiteral(["\n      box-sizing: border-box;\n      list-style: none;\n    "])))
+    filled: stylish.variantFilledWithoutHover,
+    item: css(_templateObject2 || (_templateObject2 = _taggedTemplateLiteral(["\n      overflow: hidden;\n      box-sizing: border-box;\n      list-style: none;\n      border-radius: ", "px;\n    "])), token.borderRadius),
+    itemVariant: css(_templateObject3 || (_templateObject3 = _taggedTemplateLiteral(["\n      padding-block: 4px;\n      padding-inline: 4px 16px;\n    "]))),
+    outlined: stylish.variantOutlinedWithoutHover
   };
 });

package/es/SortableList/type.d.ts

@@ -0,0 +1,12 @@
+import { type ReactNode, Ref } from 'react';
+import type { FlexboxProps } from 'react-layout-kit';
+export interface SortableListItem {
+    [key: string]: any;
+    id: string | number;
+}
+export interface SortableListProps extends Omit<FlexboxProps, 'onChange'> {
+    items: SortableListItem[];
+    onChange(items: SortableListItem[]): void;
+    ref?: Ref<HTMLUListElement>;
+    renderItem(item: SortableListItem): ReactNode;
+}

package/es/SortableList/type.js

@@ -0,0 +1 @@
+export {};

package/es/Tabs/Tabs.d.ts

@@ -0,0 +1,4 @@
+/// <reference types="react" />
+import type { TabsProps } from './type';
+declare const Tabs: import("react").NamedExoticComponent<TabsProps>;
+export default Tabs;

package/es/Tabs/Tabs.js

@@ -0,0 +1,74 @@
+'use client';
+
+function _typeof(o) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (o) { return typeof o; } : function (o) { return o && "function" == typeof Symbol && o.constructor === Symbol && o !== Symbol.prototype ? "symbol" : typeof o; }, _typeof(o); }
+var _excluded = ["className", "compact", "variant", "items"];
+function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
+function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
+function _defineProperty(obj, key, value) { key = _toPropertyKey(key); if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
+function _toPropertyKey(t) { var i = _toPrimitive(t, "string"); return "symbol" == _typeof(i) ? i : String(i); }
+function _toPrimitive(t, r) { if ("object" != _typeof(t) || !t) return t; var e = t[Symbol.toPrimitive]; if (void 0 !== e) { var i = e.call(t, r || "default"); if ("object" != _typeof(i)) return i; throw new TypeError("@@toPrimitive must return a primitive value."); } return ("string" === r ? String : Number)(t); }
+function _objectWithoutProperties(source, excluded) { if (source == null) return {}; var target = _objectWithoutPropertiesLoose(source, excluded); var key, i; if (Object.getOwnPropertySymbols) { var sourceSymbolKeys = Object.getOwnPropertySymbols(source); for (i = 0; i < sourceSymbolKeys.length; i++) { key = sourceSymbolKeys[i]; if (excluded.indexOf(key) >= 0) continue; if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue; target[key] = source[key]; } } return target; }
+function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }
+import { Tabs as AntdTabs } from 'antd';
+import { cva } from 'class-variance-authority';
+import { MoreHorizontalIcon } from 'lucide-react';
+import { memo, useMemo } from 'react';
+import ActionIcon from "../ActionIcon";
+import { useStyles } from "./style";
+import { jsx as _jsx } from "react/jsx-runtime";
+var Tabs = /*#__PURE__*/memo(function (_ref) {
+  var className = _ref.className,
+    compact = _ref.compact,
+    _ref$variant = _ref.variant,
+    variant = _ref$variant === void 0 ? 'rounded' : _ref$variant,
+    items = _ref.items,
+    rest = _objectWithoutProperties(_ref, _excluded);
+  var _useStyles = useStyles(),
+    styles = _useStyles.styles,
+    cx = _useStyles.cx;
+  var hasContent = items === null || items === void 0 ? void 0 : items.some(function (item) {
+    return !!item.children;
+  });
+  var variants = useMemo(function () {
+    return cva(styles.root, {
+      defaultVariants: {
+        compact: false,
+        underlined: false,
+        variant: 'rounded'
+      },
+      /* eslint-disable sort-keys-fix/sort-keys-fix */
+      variants: {
+        variant: {
+          square: null,
+          rounded: styles.rounded,
+          point: styles.point
+        },
+        compact: {
+          false: styles.margin,
+          true: styles.compact
+        },
+        underlined: {
+          false: styles.hideHolder,
+          true: null
+        }
+      }
+      /* eslint-enable sort-keys-fix/sort-keys-fix */
+    });
+  }, [styles]);
+  return /*#__PURE__*/_jsx(AntdTabs, _objectSpread({
+    className: cx(variants({
+      compact: compact,
+      underlined: hasContent,
+      variant: variant
+    }), className),
+    items: items,
+    more: {
+      icon: /*#__PURE__*/_jsx(ActionIcon, {
+        icon: MoreHorizontalIcon
+      })
+    },
+    popupClassName: cx(styles.dropdown)
+  }, rest));
+});
+Tabs.displayName = 'Tabs';
+export default Tabs;

package/es/Tabs/index.d.ts

@@ -0,0 +1,2 @@
+export { default } from './Tabs';
+export type * from './type';

package/es/Tabs/index.js

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

package/es/Tabs/style.d.ts

@@ -0,0 +1,9 @@
+export declare const useStyles: (props?: unknown) => import("antd-style").ReturnStyles<{
+    compact: import("antd-style").SerializedStyles;
+    dropdown: import("antd-style").SerializedStyles;
+    hideHolder: import("antd-style").SerializedStyles;
+    margin: import("antd-style").SerializedStyles;
+    point: import("antd-style").SerializedStyles;
+    root: import("antd-style").SerializedStyles;
+    rounded: import("antd-style").SerializedStyles;
+}>;

package/es/Tabs/style.js

@@ -0,0 +1,17 @@
+var _templateObject, _templateObject2, _templateObject3, _templateObject4, _templateObject5, _templateObject6, _templateObject7;
+function _taggedTemplateLiteral(strings, raw) { if (!raw) { raw = strings.slice(0); } return Object.freeze(Object.defineProperties(strings, { raw: { value: Object.freeze(raw) } })); }
+import { createStyles } from 'antd-style';
+export var useStyles = createStyles(function (_ref) {
+  var css = _ref.css,
+    token = _ref.token,
+    prefixCls = _ref.prefixCls;
+  return {
+    compact: css(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n      &.", "-tabs {\n        .", "-tabs-tab {\n          margin: 4px;\n\n          + .", "-tabs-tab {\n            margin: 4px;\n          }\n        }\n      }\n    "])), prefixCls, prefixCls, prefixCls),
+    dropdown: css(_templateObject2 || (_templateObject2 = _taggedTemplateLiteral(["\n      .", "-tabs-dropdown-menu {\n        padding: 4px;\n        border: 1px solid ", ";\n\n        .", "-tabs-dropdown-menu-item {\n          border-radius: ", "px;\n        }\n      }\n    "])), prefixCls, token.colorBorderSecondary, prefixCls, token.borderRadius),
+    hideHolder: css(_templateObject3 || (_templateObject3 = _taggedTemplateLiteral(["\n      &.", "-tabs {\n        .", "-tabs-content-holder {\n          display: none;\n        }\n\n        .", "-tabs-nav {\n          margin: 0;\n\n          &::before {\n            display: none;\n          }\n        }\n      }\n    "])), prefixCls, prefixCls, prefixCls),
+    margin: css(_templateObject4 || (_templateObject4 = _taggedTemplateLiteral(["\n      &.", "-tabs {\n        .", "-tabs-tab {\n          margin: 8px;\n\n          + .", "-tabs-tab {\n            margin: 8px;\n          }\n        }\n      }\n    "])), prefixCls, prefixCls, prefixCls),
+    point: css(_templateObject5 || (_templateObject5 = _taggedTemplateLiteral(["\n      &.", "-tabs {\n        &.", "-tabs-top {\n          .", "-tabs-ink-bar {\n            width: 8px !important;\n            height: 4px;\n            border-start-start-radius: 4px;\n            border-start-end-radius: 4px;\n          }\n        }\n\n        &.", "-tabs-bottom {\n          .", "-tabs-ink-bar {\n            width: 8px !important;\n            height: 4px;\n            border-end-start-radius: 4px;\n            border-end-end-radius: 4px;\n          }\n        }\n\n        &.", "-tabs-left {\n          .", "-tabs-ink-bar {\n            width: 4px;\n            height: 8px !important;\n            border-start-start-radius: 4px;\n            border-end-start-radius: 4px;\n          }\n        }\n\n        &.", "-tabs-right {\n          .", "-tabs-ink-bar {\n            width: 4px;\n            height: 8px !important;\n            border-start-end-radius: 4px;\n            border-end-end-radius: 4px;\n          }\n        }\n      }\n    "])), prefixCls, prefixCls, prefixCls, prefixCls, prefixCls, prefixCls, prefixCls, prefixCls, prefixCls),
+    root: css(_templateObject6 || (_templateObject6 = _taggedTemplateLiteral(["\n      &.", "-tabs {\n        .", "-tabs-tab {\n          padding-block: 8px;\n          padding-inline: 12px;\n          color: ", ";\n          transition: background-color 100ms ease-out;\n\n          &:hover {\n            color: ", ";\n            background: ", ";\n            border-radius: ", "px;\n          }\n        }\n      }\n    "])), prefixCls, prefixCls, token.colorTextSecondary, token.colorText, token.colorFillTertiary, token.borderRadius),
+    rounded: css(_templateObject7 || (_templateObject7 = _taggedTemplateLiteral(["\n      &.", "-tabs {\n        &.", "-tabs-top {\n          .", "-tabs-ink-bar {\n            height: 3px;\n            border-start-start-radius: 3px;\n            border-start-end-radius: 3px;\n          }\n        }\n\n        &.", "-tabs-bottom {\n          .", "-tabs-ink-bar {\n            height: 3px;\n            border-end-start-radius: 3px;\n            border-end-end-radius: 3px;\n          }\n        }\n\n        &.", "-tabs-left {\n          .", "-tabs-ink-bar {\n            width: 3px;\n            border-start-start-radius: 3px;\n            border-end-start-radius: 3px;\n          }\n        }\n\n        &.", "-tabs-right {\n          .", "-tabs-ink-bar {\n            width: 3px;\n            border-start-end-radius: 3px;\n            border-end-end-radius: 3px;\n          }\n        }\n      }\n    "])), prefixCls, prefixCls, prefixCls, prefixCls, prefixCls, prefixCls, prefixCls, prefixCls, prefixCls)
+  };
+});

package/es/Tabs/type.d.ts

@@ -0,0 +1,5 @@
+import type { TabsProps as AntdTabsProps } from 'antd';
+export interface TabsProps extends AntdTabsProps {
+    compact?: boolean;
+    variant?: 'square' | 'rounded' | 'point';
+}

package/es/Tabs/type.js

@@ -0,0 +1 @@
+export {};

package/es/Tag/Tag.d.ts

@@ -0,0 +1,4 @@
+/// <reference types="react" />
+import type { TagProps } from './type';
+declare const Tag: import("react").NamedExoticComponent<TagProps>;
+export default Tag;

package/es/Tag/Tag.js

@@ -0,0 +1,104 @@
+'use client';
+
+function _typeof(o) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (o) { return typeof o; } : function (o) { return o && "function" == typeof Symbol && o.constructor === Symbol && o !== Symbol.prototype ? "symbol" : typeof o; }, _typeof(o); }
+var _excluded = ["className", "ref", "size", "color", "variant", "children", "onClick", "style"];
+function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
+function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
+function _defineProperty(obj, key, value) { key = _toPropertyKey(key); if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
+function _toPropertyKey(t) { var i = _toPrimitive(t, "string"); return "symbol" == _typeof(i) ? i : String(i); }
+function _toPrimitive(t, r) { if ("object" != _typeof(t) || !t) return t; var e = t[Symbol.toPrimitive]; if (void 0 !== e) { var i = e.call(t, r || "default"); if ("object" != _typeof(i)) return i; throw new TypeError("@@toPrimitive must return a primitive value."); } return ("string" === r ? String : Number)(t); }
+function _objectWithoutProperties(source, excluded) { if (source == null) return {}; var target = _objectWithoutPropertiesLoose(source, excluded); var key, i; if (Object.getOwnPropertySymbols) { var sourceSymbolKeys = Object.getOwnPropertySymbols(source); for (i = 0; i < sourceSymbolKeys.length; i++) { key = sourceSymbolKeys[i]; if (excluded.indexOf(key) >= 0) continue; if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue; target[key] = source[key]; } } return target; }
+function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }
+import { Tag as AntTag } from 'antd';
+import { cva } from 'class-variance-authority';
+import { memo, useMemo } from 'react';
+import { colorsPreset, colorsPresetSystem, presetColors, presetSystemColors } from "./utils";
+import { useStyles } from "./styles";
+import { jsx as _jsx } from "react/jsx-runtime";
+var Tag = /*#__PURE__*/memo(function (_ref) {
+  var className = _ref.className,
+    ref = _ref.ref,
+    _ref$size = _ref.size,
+    size = _ref$size === void 0 ? 'middle' : _ref$size,
+    color = _ref.color,
+    _ref$variant = _ref.variant,
+    variant = _ref$variant === void 0 ? 'filled' : _ref$variant,
+    children = _ref.children,
+    onClick = _ref.onClick,
+    style = _ref.style,
+    rest = _objectWithoutProperties(_ref, _excluded);
+  var _useStyles = useStyles(),
+    styles = _useStyles.styles,
+    cx = _useStyles.cx,
+    theme = _useStyles.theme;
+  var variants = useMemo(function () {
+    return cva(styles.root, {
+      defaultVariants: {
+        size: 'middle',
+        variant: 'filled'
+      },
+      /* eslint-disable sort-keys-fix/sort-keys-fix */
+      variants: {
+        variant: {
+          filled: styles.filled,
+          outlined: styles.outlined,
+          borderless: styles.borderless
+        },
+        size: {
+          small: styles.small,
+          middle: null,
+          large: styles.large
+        }
+      }
+      /* eslint-enable sort-keys-fix/sort-keys-fix */
+    });
+  }, [styles]);
+  var colors = useMemo(function () {
+    var textColor = theme.colorTextSecondary;
+    var backgroundColor;
+    var borderColor;
+    var isFilled = variant === 'filled';
+    var isPresetColor = color && presetColors.includes(color);
+    var isPresetSystemColors = color && presetSystemColors.has(color);
+    var isHexColor = color && color.startsWith('#');
+    if (isPresetColor) {
+      textColor = colorsPreset(theme, color);
+      backgroundColor = colorsPreset(theme, color, 'fillTertiary');
+      borderColor = colorsPreset(theme, color, isFilled ? 'fillQuaternary' : 'fillTertiary');
+    }
+    if (isPresetSystemColors) {
+      textColor = colorsPresetSystem(theme, color);
+      backgroundColor = colorsPresetSystem(theme, color, 'fillTertiary');
+      borderColor = colorsPresetSystem(theme, color, isFilled ? 'fillQuaternary' : 'fillTertiary');
+    }
+    if (isHexColor) {
+      textColor = theme.colorBgLayout;
+      backgroundColor = color;
+    }
+    return {
+      backgroundColor: backgroundColor,
+      borderColor: borderColor,
+      textColor: textColor
+    };
+  }, [color, theme, variant]);
+  return /*#__PURE__*/_jsx(AntTag, _objectSpread(_objectSpread({
+    bordered: false,
+    className: cx(variants({
+      size: size,
+      variant: variant
+    }), className),
+    color: color,
+    onClick: onClick,
+    ref: ref,
+    style: _objectSpread({
+      background: colors === null || colors === void 0 ? void 0 : colors.backgroundColor,
+      borderColor: colors === null || colors === void 0 ? void 0 : colors.borderColor,
+      color: colors === null || colors === void 0 ? void 0 : colors.textColor,
+      cursor: onClick ? 'pointer' : undefined
+    }, style)
+  }, rest), {}, {
+    children: children
+  }));
+});
+Tag.displayName = 'Tag';
+export default Tag;

package/es/Tag/index.d.ts

@@ -1,8 +1,2 @@
-import { type TagProps as AntTagProps } from 'antd';
-import { ReactNode } from 'react';
-export interface TagProps extends AntTagProps {
-    icon?: ReactNode;
-    size?: 'default' | 'small';
-}
-declare const Tag: import("react").NamedExoticComponent<TagProps>;
-export default Tag;
+export { default } from './Tag';
+export type * from './type';

package/es/Tag/index.js

@@ -1,50 +1 @@
-'use client';
-
-function _typeof(o) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (o) { return typeof o; } : function (o) { return o && "function" == typeof Symbol && o.constructor === Symbol && o !== Symbol.prototype ? "symbol" : typeof o; }, _typeof(o); }
-var _excluded = ["icon", "children", "size"];
-var _templateObject, _templateObject2;
-function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
-function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
-function _defineProperty(obj, key, value) { key = _toPropertyKey(key); if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
-function _toPropertyKey(t) { var i = _toPrimitive(t, "string"); return "symbol" == _typeof(i) ? i : String(i); }
-function _toPrimitive(t, r) { if ("object" != _typeof(t) || !t) return t; var e = t[Symbol.toPrimitive]; if (void 0 !== e) { var i = e.call(t, r || "default"); if ("object" != _typeof(i)) return i; throw new TypeError("@@toPrimitive must return a primitive value."); } return ("string" === r ? String : Number)(t); }
-function _objectWithoutProperties(source, excluded) { if (source == null) return {}; var target = _objectWithoutPropertiesLoose(source, excluded); var key, i; if (Object.getOwnPropertySymbols) { var sourceSymbolKeys = Object.getOwnPropertySymbols(source); for (i = 0; i < sourceSymbolKeys.length; i++) { key = sourceSymbolKeys[i]; if (excluded.indexOf(key) >= 0) continue; if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue; target[key] = source[key]; } } return target; }
-function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }
-function _taggedTemplateLiteral(strings, raw) { if (!raw) { raw = strings.slice(0); } return Object.freeze(Object.defineProperties(strings, { raw: { value: Object.freeze(raw) } })); }
-import { Tag as AntTag } from 'antd';
-import { createStyles } from 'antd-style';
-import { memo } from 'react';
-import { Flexbox } from 'react-layout-kit';
-import { jsxs as _jsxs } from "react/jsx-runtime";
-import { jsx as _jsx } from "react/jsx-runtime";
-var useStyles = createStyles(function (_ref) {
-  var cx = _ref.cx,
-    css = _ref.css,
-    token = _ref.token;
-  return {
-    small: css(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n    padding-block: 2px;\n    padding-inline: 6px;\n    line-height: 1;\n  "]))),
-    tag: cx(css(_templateObject2 || (_templateObject2 = _taggedTemplateLiteral(["\n    user-select: none;\n    color: ", " !important;\n    background: ", ";\n    border: ", "px;\n\n    &:hover {\n      color: ", ";\n      background: ", ";\n    }\n  "])), token.colorTextSecondary, token.colorFillSecondary, token.borderRadius, token.colorText, token.colorFill))
-  };
-});
-var Tag = /*#__PURE__*/memo(function (_ref2) {
-  var icon = _ref2.icon,
-    children = _ref2.children,
-    _ref2$size = _ref2.size,
-    size = _ref2$size === void 0 ? 'default' : _ref2$size,
-    rest = _objectWithoutProperties(_ref2, _excluded);
-  var _useStyles = useStyles(),
-    styles = _useStyles.styles,
-    cx = _useStyles.cx;
-  return /*#__PURE__*/_jsx(AntTag, _objectSpread(_objectSpread({
-    bordered: false,
-    className: cx(styles.tag, size === 'small' && styles.small)
-  }, rest), {}, {
-    children: /*#__PURE__*/_jsxs(Flexbox, {
-      align: 'center',
-      gap: 4,
-      horizontal: true,
-      children: [icon, children]
-    })
-  }));
-});
-export default Tag;
+export { default } from "./Tag";

package/es/Tag/styles.d.ts

@@ -0,0 +1,8 @@
+export declare const useStyles: (props?: unknown) => import("antd-style").ReturnStyles<{
+    borderless: string;
+    filled: string;
+    large: import("antd-style").SerializedStyles;
+    outlined: string;
+    root: import("antd-style").SerializedStyles;
+    small: import("antd-style").SerializedStyles;
+}>;

package/es/Tag/styles.js

@@ -0,0 +1,17 @@
+var _templateObject, _templateObject2, _templateObject3;
+function _taggedTemplateLiteral(strings, raw) { if (!raw) { raw = strings.slice(0); } return Object.freeze(Object.defineProperties(strings, { raw: { value: Object.freeze(raw) } })); }
+import { createStyles } from 'antd-style';
+export var useStyles = createStyles(function (_ref) {
+  var stylish = _ref.stylish,
+    prefixCls = _ref.prefixCls,
+    css = _ref.css,
+    token = _ref.token;
+  return {
+    borderless: stylish.variantBorderlessWithoutHover,
+    filled: stylish.variantFilledWithoutHover,
+    large: css(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n    &.", "-tag {\n      height: 28px;\n      padding-inline: 12px;\n      border-radius: 6px;\n    }\n  "])), prefixCls),
+    outlined: stylish.variantOutlinedWithoutHover,
+    root: css(_templateObject2 || (_templateObject2 = _taggedTemplateLiteral(["\n    color: ", ";\n    &.", "-tag {\n      user-select: none;\n\n      display: flex;\n      gap: 0.4em;\n      align-items: center;\n      justify-content: center;\n\n      width: fit-content;\n      height: 22px;\n      margin: 0;\n\n      line-height: 1.2;\n\n      border-radius: 3px;\n\n      span {\n        margin: 0;\n      }\n\n      span:not(.anticon) {\n        height: unset;\n        line-height: inherit;\n      }\n    }\n  "])), token.colorTextSecondary, prefixCls),
+    small: css(_templateObject3 || (_templateObject3 = _taggedTemplateLiteral(["\n    &.", "-tag {\n      height: 20px;\n      padding-inline: 4px;\n    }\n  "])), prefixCls)
+  };
+});

package/es/Tag/type.d.ts

@@ -0,0 +1,8 @@
+import type { TagProps as AntTagProps } from 'antd';
+import type { Ref } from 'react';
+export interface TagProps extends Omit<AntTagProps, 'color'> {
+    color?: AntTagProps['color'] | 'info';
+    ref?: Ref<HTMLDivElement>;
+    size?: 'small' | 'middle' | 'large';
+    variant?: 'filled' | 'outlined' | 'borderless';
+}

package/es/Tag/type.js

@@ -0,0 +1 @@
+export {};

package/es/Tag/utils.d.ts

@@ -0,0 +1,4 @@
+export declare const presetColors: string[];
+export declare const presetSystemColors: Set<string>;
+export declare const colorsPreset: (theme: any, type: string, ...keys: string[]) => string;
+export declare const colorsPresetSystem: (theme: any, type: string, ...keys: string[]) => string;