deepsea-components 5.7.7 → 5.7.9

package/dist/cjs/components/CircleText.js

@@ -1,3 +1,4 @@
+"use client";
 var __defProp = Object.defineProperty;
 var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
 var __getOwnPropNames = Object.getOwnPropertyNames;

package/dist/cjs/components/CircleText.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../src/components/CircleText.tsx"],
-  "sourcesContent": ["import { FC, Fragment, HTMLAttributes } from \"react\"\n\nexport interface CircleTextProps extends Omit<HTMLAttributes<HTMLSpanElement>, \"children\"> {\n    /** 每一个方块的宽度 */\n    width: number\n    /** 每一个方块的高度 */\n    height: number\n    /** 圆弧的半径，不包含方块的高度 */\n    radius: number\n    /** 开始旋转的弧度，逆时针增加，0 为 x 轴方向 */\n    startAngel?: number\n    /** 每一个方块之间间隔的弧度 */\n    gapAngel?: number\n    /** 文字对齐的方式，默认居中 */\n    align?: \"left\" | \"center\" | \"right\"\n    /** 文字朝向圆心还是外侧，默认外侧 */\n    direction?: \"inner\" | \"outer\"\n    /** 是否反转文字顺序 */\n    reverse?: boolean\n    /** 分割文字的方法 */\n    separator?: string | RegExp | ((text: string) => string[])\n    /** 显示的文字 */\n    children: string\n}\n\n/** 环形文字 */\nexport const CircleText: FC<CircleTextProps> = props => {\n    const {\n        width,\n        height,\n        radius,\n        startAngel = 0,\n        gapAngel = 0,\n        align = \"center\",\n        style,\n        direction = \"outer\",\n        reverse = false,\n        separator,\n        children,\n        ...rest\n    } = props\n    const unitAngle = Math.atan(width / 2 / radius) * 2\n    const totalAngle = (unitAngle + gapAngel) * children.length - gapAngel\n    const offsetAngle = align === \"left\" ? 0 : align === \"right\" ? totalAngle : totalAngle / 2\n\n    function getTransform(idx: number) {\n        const angle = startAngel - idx * (unitAngle + gapAngel) + offsetAngle - unitAngle / 2\n        const x = (radius + height / 2) * Math.cos(angle) - width / 2\n        const y = (radius + height / 2) * Math.sin(angle) * -1 - height / 2\n        const z = Math.PI / 2 - angle + (direction === \"inner\" ? Math.PI : 0)\n        return `translateX(${x}px) translateY(${y}px) rotateZ(${(z / Math.PI) * 180}deg)`\n    }\n\n    const words = typeof separator === \"function\" ? separator(children) : children.split(separator ?? \"\")\n\n    if (reverse) words.reverse()\n\n    return (\n        <Fragment>\n            {words.map((w, idx) => (\n                <span\n                    key={idx}\n                    style={{\n                        position: \"absolute\",\n                        ...style,\n                        transform: getTransform(idx),\n                        textAlign: \"center\",\n                        width,\n                        lineHeight: `${height}px`,\n                        height: height,\n                    }}\n                    {...rest}\n                >\n                    {w}\n                </span>\n            ))}\n        </Fragment>\n    )\n}\n"],
-  "mappings": ";;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,mBAA6C;AA0BtC,IAAM,aAAkC,WAAS;AACpD,QAAM;AAAA,IACF;AAAA,IACA;AAAA,IACA;AAAA,IACA,aAAa;AAAA,IACb,WAAW;AAAA,IACX,QAAQ;AAAA,IACR;AAAA,IACA,YAAY;AAAA,IACZ,UAAU;AAAA,IACV;AAAA,IACA;AAAA,IACA,GAAG;AAAA,EACP,IAAI;AACJ,QAAM,YAAY,KAAK,KAAK,QAAQ,IAAI,MAAM,IAAI;AAClD,QAAM,cAAc,YAAY,YAAY,SAAS,SAAS;AAC9D,QAAM,cAAc,UAAU,SAAS,IAAI,UAAU,UAAU,aAAa,aAAa;AAEzF,WAAS,aAAa,KAAa;AAC/B,UAAM,QAAQ,aAAa,OAAO,YAAY,YAAY,cAAc,YAAY;AACpF,UAAM,KAAK,SAAS,SAAS,KAAK,KAAK,IAAI,KAAK,IAAI,QAAQ;AAC5D,UAAM,KAAK,SAAS,SAAS,KAAK,KAAK,IAAI,KAAK,IAAI,KAAK,SAAS;AAClE,UAAM,IAAI,KAAK,KAAK,IAAI,SAAS,cAAc,UAAU,KAAK,KAAK;AACnE,WAAO,cAAc,mBAAmB,gBAAiB,IAAI,KAAK,KAAM;AAAA,EAC5E;AAEA,QAAM,QAAQ,OAAO,cAAc,aAAa,UAAU,QAAQ,IAAI,SAAS,MAAM,aAAa,EAAE;AAEpG,MAAI;AAAS,UAAM,QAAQ;AAE3B,SACI,oCAAC,6BACI,MAAM,IAAI,CAAC,GAAG,QACX;AAAA,IAAC;AAAA;AAAA,MACG,KAAK;AAAA,MACL,OAAO;AAAA,QACH,UAAU;AAAA,QACV,GAAG;AAAA,QACH,WAAW,aAAa,GAAG;AAAA,QAC3B,WAAW;AAAA,QACX;AAAA,QACA,YAAY,GAAG;AAAA,QACf;AAAA,MACJ;AAAA,MACC,GAAG;AAAA;AAAA,IAEH;AAAA,EACL,CACH,CACL;AAER;",
+  "sourcesContent": ["\"use client\"\n\nimport { FC, Fragment, HTMLAttributes } from \"react\"\n\nexport interface CircleTextProps extends Omit<HTMLAttributes<HTMLSpanElement>, \"children\"> {\n    /** 每一个方块的宽度 */\n    width: number\n    /** 每一个方块的高度 */\n    height: number\n    /** 圆弧的半径，不包含方块的高度 */\n    radius: number\n    /** 开始旋转的弧度，逆时针增加，0 为 x 轴方向 */\n    startAngel?: number\n    /** 每一个方块之间间隔的弧度 */\n    gapAngel?: number\n    /** 文字对齐的方式，默认居中 */\n    align?: \"left\" | \"center\" | \"right\"\n    /** 文字朝向圆心还是外侧，默认外侧 */\n    direction?: \"inner\" | \"outer\"\n    /** 是否反转文字顺序 */\n    reverse?: boolean\n    /** 分割文字的方法 */\n    separator?: string | RegExp | ((text: string) => string[])\n    /** 显示的文字 */\n    children: string\n}\n\n/** 环形文字 */\nexport const CircleText: FC<CircleTextProps> = props => {\n    const {\n        width,\n        height,\n        radius,\n        startAngel = 0,\n        gapAngel = 0,\n        align = \"center\",\n        style,\n        direction = \"outer\",\n        reverse = false,\n        separator,\n        children,\n        ...rest\n    } = props\n    const unitAngle = Math.atan(width / 2 / radius) * 2\n    const totalAngle = (unitAngle + gapAngel) * children.length - gapAngel\n    const offsetAngle = align === \"left\" ? 0 : align === \"right\" ? totalAngle : totalAngle / 2\n\n    function getTransform(idx: number) {\n        const angle = startAngel - idx * (unitAngle + gapAngel) + offsetAngle - unitAngle / 2\n        const x = (radius + height / 2) * Math.cos(angle) - width / 2\n        const y = (radius + height / 2) * Math.sin(angle) * -1 - height / 2\n        const z = Math.PI / 2 - angle + (direction === \"inner\" ? Math.PI : 0)\n        return `translateX(${x}px) translateY(${y}px) rotateZ(${(z / Math.PI) * 180}deg)`\n    }\n\n    const words = typeof separator === \"function\" ? separator(children) : children.split(separator ?? \"\")\n\n    if (reverse) words.reverse()\n\n    return (\n        <Fragment>\n            {words.map((w, idx) => (\n                <span\n                    key={idx}\n                    style={{\n                        position: \"absolute\",\n                        ...style,\n                        transform: getTransform(idx),\n                        textAlign: \"center\",\n                        width,\n                        lineHeight: `${height}px`,\n                        height: height,\n                    }}\n                    {...rest}\n                >\n                    {w}\n                </span>\n            ))}\n        </Fragment>\n    )\n}\n"],
+  "mappings": ";;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA,mBAA6C;AA0BtC,IAAM,aAAkC,WAAS;AACpD,QAAM;AAAA,IACF;AAAA,IACA;AAAA,IACA;AAAA,IACA,aAAa;AAAA,IACb,WAAW;AAAA,IACX,QAAQ;AAAA,IACR;AAAA,IACA,YAAY;AAAA,IACZ,UAAU;AAAA,IACV;AAAA,IACA;AAAA,IACA,GAAG;AAAA,EACP,IAAI;AACJ,QAAM,YAAY,KAAK,KAAK,QAAQ,IAAI,MAAM,IAAI;AAClD,QAAM,cAAc,YAAY,YAAY,SAAS,SAAS;AAC9D,QAAM,cAAc,UAAU,SAAS,IAAI,UAAU,UAAU,aAAa,aAAa;AAEzF,WAAS,aAAa,KAAa;AAC/B,UAAM,QAAQ,aAAa,OAAO,YAAY,YAAY,cAAc,YAAY;AACpF,UAAM,KAAK,SAAS,SAAS,KAAK,KAAK,IAAI,KAAK,IAAI,QAAQ;AAC5D,UAAM,KAAK,SAAS,SAAS,KAAK,KAAK,IAAI,KAAK,IAAI,KAAK,SAAS;AAClE,UAAM,IAAI,KAAK,KAAK,IAAI,SAAS,cAAc,UAAU,KAAK,KAAK;AACnE,WAAO,cAAc,mBAAmB,gBAAiB,IAAI,KAAK,KAAM;AAAA,EAC5E;AAEA,QAAM,QAAQ,OAAO,cAAc,aAAa,UAAU,QAAQ,IAAI,SAAS,MAAM,aAAa,EAAE;AAEpG,MAAI;AAAS,UAAM,QAAQ;AAE3B,SACI,oCAAC,6BACI,MAAM,IAAI,CAAC,GAAG,QACX;AAAA,IAAC;AAAA;AAAA,MACG,KAAK;AAAA,MACL,OAAO;AAAA,QACH,UAAU;AAAA,QACV,GAAG;AAAA,QACH,WAAW,aAAa,GAAG;AAAA,QAC3B,WAAW;AAAA,QACX;AAAA,QACA,YAAY,GAAG;AAAA,QACf;AAAA,MACJ;AAAA,MACC,GAAG;AAAA;AAAA,IAEH;AAAA,EACL,CACH,CACL;AAER;",
   "names": []
 }

package/dist/cjs/components/FormLabel.d.ts

@@ -1,5 +1,5 @@
-import { ComponentPropsWithoutRef, FC } from "react";
-export type FormLabelProps = ComponentPropsWithoutRef<"div"> & {
+import { ComponentPropsWithoutRef, FC, ReactNode } from "react";
+export type FormLabelConfig = {
     /**
      * Label 的宽度.
      */
@@ -7,8 +7,14 @@ export type FormLabelProps = ComponentPropsWithoutRef<"div"> & {
     /**
      * 是否在 Label 前面添加一个空白区域，只有当前 Label 为非必选，而存在其他 Label 为必选的时候开启
      */
-    before?: boolean;
+    before?: boolean | number;
 };
+export type FormLabelProps = ComponentPropsWithoutRef<"div"> & FormLabelConfig;
+export declare const FormLabelConfigContext: import("react").Context<Partial<FormLabelConfig>>;
+export type FormLabelConfigProviderProps = FormLabelConfig & {
+    children?: ReactNode;
+};
+export declare const FormLabelConfigProvider: FC<FormLabelConfigProviderProps>;
 /**
  * 为 Ant Design 的 FormItem 设计的 Label 组件
  */

package/dist/cjs/components/FormLabel.js

@@ -1,3 +1,4 @@
+"use client";
 var __defProp = Object.defineProperty;
 var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
 var __getOwnPropNames = Object.getOwnPropertyNames;
@@ -19,28 +20,23 @@ var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: tru
 // src/components/FormLabel.tsx
 var FormLabel_exports = {};
 __export(FormLabel_exports, {
-  FormLabel: () => FormLabel
+  FormLabel: () => FormLabel,
+  FormLabelConfigContext: () => FormLabelConfigContext,
+  FormLabelConfigProvider: () => FormLabelConfigProvider
 });
 module.exports = __toCommonJS(FormLabel_exports);
-var import_deepsea_tools = require("deepsea-tools");
 var import_react = require("react");
-var import_css = require("@emotion/css");
-var FormLabel = ({ className, style, before, width, ...rest }) => /* @__PURE__ */ React.createElement(import_react.Fragment, null, !!before && /* @__PURE__ */ React.createElement("div", { style: { width: 11 } }, " "), /* @__PURE__ */ React.createElement(
-  "div",
-  {
-    className: (0, import_deepsea_tools.clsx)(
-      import_css.css`
-                    text-align: justify;
-                    text-align-last: justify;
-                `,
-      className
-    ),
-    style: { width, ...style },
-    ...rest
-  }
-));
+var FormLabelConfigContext = (0, import_react.createContext)({});
+var FormLabelConfigProvider = ({ width, before, children }) => /* @__PURE__ */ React.createElement(FormLabelConfigContext.Provider, { value: { width, before } }, children);
+var FormLabel = (props) => {
+  const { width: _width, before: _before } = (0, import_react.useContext)(FormLabelConfigContext);
+  const { style, width = _width, before = _before, ...rest } = props;
+  return /* @__PURE__ */ React.createElement(import_react.Fragment, null, !!before && /* @__PURE__ */ React.createElement("div", { style: { width: 11, color: "transparent" } }, " "), /* @__PURE__ */ React.createElement("div", { style: { width, textAlign: "justify", textAlignLast: "justify", ...style }, ...rest }));
+};
 // Annotate the CommonJS export names for ESM import in node:
 0 && (module.exports = {
-  FormLabel
+  FormLabel,
+  FormLabelConfigContext,
+  FormLabelConfigProvider
 });
 //# sourceMappingURL=FormLabel.js.map

package/dist/cjs/components/FormLabel.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../src/components/FormLabel.tsx"],
-  "sourcesContent": ["import { clsx } from \"deepsea-tools\"\nimport { ComponentPropsWithoutRef, FC, Fragment } from \"react\"\n\nimport { css } from \"@emotion/css\"\n\nexport type FormLabelProps = ComponentPropsWithoutRef<\"div\"> & {\n    /**\n     * Label 的宽度.\n     */\n    width: number\n    /**\n     * 是否在 Label 前面添加一个空白区域，只有当前 Label 为非必选，而存在其他 Label 为必选的时候开启\n     */\n    before?: boolean\n}\n\n/**\n * 为 Ant Design 的 FormItem 设计的 Label 组件\n */\nexport const FormLabel: FC<FormLabelProps> = ({ className, style, before, width, ...rest }) => (\n    <Fragment>\n        {!!before && <div style={{ width: 11 }}>&ensp;</div>}\n        <div\n            className={clsx(\n                css`\n                    text-align: justify;\n                    text-align-last: justify;\n                `,\n                className,\n            )}\n            style={{ width, ...style }}\n            {...rest}\n        />\n    </Fragment>\n)\n"],
-  "mappings": ";;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,2BAAqB;AACrB,mBAAuD;AAEvD,iBAAoB;AAgBb,IAAM,YAAgC,CAAC,EAAE,WAAW,OAAO,QAAQ,OAAO,GAAG,KAAK,MACrF,oCAAC,6BACI,CAAC,CAAC,UAAU,oCAAC,SAAI,OAAO,EAAE,OAAO,GAAG,KAAG,GAAM,GAC9C;AAAA,EAAC;AAAA;AAAA,IACG,eAAW;AAAA,MACP;AAAA;AAAA;AAAA;AAAA,MAIA;AAAA,IACJ;AAAA,IACA,OAAO,EAAE,OAAO,GAAG,MAAM;AAAA,IACxB,GAAG;AAAA;AACR,CACJ;",
+  "sourcesContent": ["\"use client\"\n\nimport { ComponentPropsWithoutRef, FC, Fragment, ReactNode, createContext, useContext } from \"react\"\n\nexport type FormLabelConfig = {\n    /**\n     * Label 的宽度.\n     */\n    width: number\n    /**\n     * 是否在 Label 前面添加一个空白区域，只有当前 Label 为非必选，而存在其他 Label 为必选的时候开启\n     */\n    before?: boolean | number\n}\n\nexport type FormLabelProps = ComponentPropsWithoutRef<\"div\"> & FormLabelConfig\n\nexport const FormLabelConfigContext = createContext<Partial<FormLabelConfig>>({})\n\nexport type FormLabelConfigProviderProps = FormLabelConfig & {\n    children?: ReactNode\n}\n\nexport const FormLabelConfigProvider: FC<FormLabelConfigProviderProps> = ({ width, before, children }) => (\n    <FormLabelConfigContext.Provider value={{ width, before }}>{children}</FormLabelConfigContext.Provider>\n)\n\n/**\n * 为 Ant Design 的 FormItem 设计的 Label 组件\n */\nexport const FormLabel: FC<FormLabelProps> = props => {\n    const { width: _width, before: _before } = useContext(FormLabelConfigContext)\n    const { style, width = _width, before = _before, ...rest } = props\n\n    return (\n        <Fragment>\n            {!!before && <div style={{ width: 11, color: \"transparent\" }}>&ensp;</div>}\n            <div style={{ width, textAlign: \"justify\", textAlignLast: \"justify\", ...style }} {...rest} />\n        </Fragment>\n    )\n}\n"],
+  "mappings": ";;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA,mBAA6F;AAetF,IAAM,6BAAyB,4BAAwC,CAAC,CAAC;AAMzE,IAAM,0BAA4D,CAAC,EAAE,OAAO,QAAQ,SAAS,MAChG,oCAAC,uBAAuB,UAAvB,EAAgC,OAAO,EAAE,OAAO,OAAO,KAAI,QAAS;AAMlE,IAAM,YAAgC,WAAS;AAClD,QAAM,EAAE,OAAO,QAAQ,QAAQ,QAAQ,QAAI,yBAAW,sBAAsB;AAC5E,QAAM,EAAE,OAAO,QAAQ,QAAQ,SAAS,SAAS,GAAG,KAAK,IAAI;AAE7D,SACI,oCAAC,6BACI,CAAC,CAAC,UAAU,oCAAC,SAAI,OAAO,EAAE,OAAO,IAAI,OAAO,cAAc,KAAG,GAAM,GACpE,oCAAC,SAAI,OAAO,EAAE,OAAO,WAAW,WAAW,eAAe,WAAW,GAAG,MAAM,GAAI,GAAG,MAAM,CAC/F;AAER;",
   "names": []
 }

package/dist/cjs/components/Ring.js

@@ -1,3 +1,4 @@
+"use client";
 var __defProp = Object.defineProperty;
 var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
 var __getOwnPropNames = Object.getOwnPropertyNames;

package/dist/cjs/components/Ring.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../src/components/Ring.tsx"],
-  "sourcesContent": ["import { HTMLAttributes, forwardRef } from \"react\"\n\nexport interface RingProps extends HTMLAttributes<HTMLDivElement> {\n    outerWidth: number\n    innerWidth: number\n}\n\n/** 环形组件 */\nexport const Ring = forwardRef<HTMLDivElement, RingProps>((props, ref) => {\n    const { outerWidth, innerWidth, style, ...rest } = props\n\n    const outerRadius = outerWidth / 2\n\n    const innerRadius = innerWidth / 2\n\n    return (\n        <div\n            ref={ref}\n            style={{\n                ...style,\n                width: `${outerWidth}px`,\n                height: `${outerWidth}px`,\n                clipPath: `path(\"M0,${outerRadius} a${outerRadius},${outerRadius},0,1,0,${outerWidth},0 a${outerRadius},${outerRadius},0,1,0,-${outerWidth},0 l${outerRadius - innerRadius},0 a${innerRadius},${innerRadius},0,0,1,${innerRadius * 2},0 a${innerRadius},${innerRadius},0,0,1,-${innerRadius * 2},0 Z\")`,\n            }}\n            {...rest}\n        />\n    )\n})\n"],
-  "mappings": ";;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,mBAA2C;AAQpC,IAAM,WAAO,yBAAsC,CAAC,OAAO,QAAQ;AACtE,QAAM,EAAE,YAAY,YAAY,OAAO,GAAG,KAAK,IAAI;AAEnD,QAAM,cAAc,aAAa;AAEjC,QAAM,cAAc,aAAa;AAEjC,SACI;AAAA,IAAC;AAAA;AAAA,MACG;AAAA,MACA,OAAO;AAAA,QACH,GAAG;AAAA,QACH,OAAO,GAAG;AAAA,QACV,QAAQ,GAAG;AAAA,QACX,UAAU,YAAY,gBAAgB,eAAe,qBAAqB,iBAAiB,eAAe,sBAAsB,iBAAiB,cAAc,kBAAkB,eAAe,qBAAqB,cAAc,QAAQ,eAAe,sBAAsB,cAAc;AAAA,MAClS;AAAA,MACC,GAAG;AAAA;AAAA,EACR;AAER,CAAC;",
+  "sourcesContent": ["\"use client\"\n\nimport { HTMLAttributes, forwardRef } from \"react\"\n\nexport interface RingProps extends HTMLAttributes<HTMLDivElement> {\n    outerWidth: number\n    innerWidth: number\n}\n\n/** 环形组件 */\nexport const Ring = forwardRef<HTMLDivElement, RingProps>((props, ref) => {\n    const { outerWidth, innerWidth, style, ...rest } = props\n\n    const outerRadius = outerWidth / 2\n\n    const innerRadius = innerWidth / 2\n\n    return (\n        <div\n            ref={ref}\n            style={{\n                ...style,\n                width: `${outerWidth}px`,\n                height: `${outerWidth}px`,\n                clipPath: `path(\"M0,${outerRadius} a${outerRadius},${outerRadius},0,1,0,${outerWidth},0 a${outerRadius},${outerRadius},0,1,0,-${outerWidth},0 l${outerRadius - innerRadius},0 a${innerRadius},${innerRadius},0,0,1,${innerRadius * 2},0 a${innerRadius},${innerRadius},0,0,1,-${innerRadius * 2},0 Z\")`,\n            }}\n            {...rest}\n        />\n    )\n})\n"],
+  "mappings": ";;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA,mBAA2C;AAQpC,IAAM,WAAO,yBAAsC,CAAC,OAAO,QAAQ;AACtE,QAAM,EAAE,YAAY,YAAY,OAAO,GAAG,KAAK,IAAI;AAEnD,QAAM,cAAc,aAAa;AAEjC,QAAM,cAAc,aAAa;AAEjC,SACI;AAAA,IAAC;AAAA;AAAA,MACG;AAAA,MACA,OAAO;AAAA,QACH,GAAG;AAAA,QACH,OAAO,GAAG;AAAA,QACV,QAAQ,GAAG;AAAA,QACX,UAAU,YAAY,gBAAgB,eAAe,qBAAqB,iBAAiB,eAAe,sBAAsB,iBAAiB,cAAc,kBAAkB,eAAe,qBAAqB,cAAc,QAAQ,eAAe,sBAAsB,cAAc;AAAA,MAClS;AAAA,MACC,GAAG;AAAA;AAAA,EACR;AAER,CAAC;",
   "names": []
 }

package/dist/cjs/components/Skeleton.js

@@ -1,3 +1,4 @@
+"use client";
 var __defProp = Object.defineProperty;
 var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
 var __getOwnPropNames = Object.getOwnPropertyNames;

package/dist/cjs/components/Skeleton.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../src/components/Skeleton.tsx"],
-  "sourcesContent": ["import { clsx } from \"deepsea-tools\"\nimport { HTMLAttributes, forwardRef } from \"react\"\n\nimport { css } from \"@emotion/css\"\n\nexport interface SkeletonProps extends HTMLAttributes<HTMLDivElement> {\n    loading?: boolean\n}\n\nexport const Skeleton = forwardRef<HTMLDivElement, SkeletonProps>((props, ref) => {\n    const { className, children, loading = children === undefined || children === null, ...rest } = props\n\n    return (\n        <div\n            ref={ref}\n            className={clsx(\n                css`\n                    @keyframes shimmer {\n                        0% {\n                            background-position: -400px 0px;\n                        }\n                        100% {\n                            background-position: 400px 0px;\n                        }\n                    }\n                `,\n                loading &&\n                    css`\n                        background-image: linear-gradient(to right, rgba(0, 0, 0, 0.067) 8%, rgba(0, 0, 0, 0.133) 18%, rgba(0, 0, 0, 0.067) 33%);\n                        animation-duration: 1s;\n                        animation-fill-mode: forwards;\n                        animation-iteration-count: infinite;\n                        animation-name: shimmer;\n                        animation-timing-function: linear;\n                        background-size: 800px 104px;\n                    `,\n                className,\n            )}\n            {...rest}\n        >\n            {children}\n        </div>\n    )\n})\n"],
-  "mappings": ";;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,2BAAqB;AACrB,mBAA2C;AAE3C,iBAAoB;AAMb,IAAM,eAAW,yBAA0C,CAAC,OAAO,QAAQ;AAC9E,QAAM,EAAE,WAAW,UAAU,UAAU,aAAa,UAAa,aAAa,MAAM,GAAG,KAAK,IAAI;AAEhG,SACI;AAAA,IAAC;AAAA;AAAA,MACG;AAAA,MACA,eAAW;AAAA,QACP;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,QAUA,WACI;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,QASJ;AAAA,MACJ;AAAA,MACC,GAAG;AAAA;AAAA,IAEH;AAAA,EACL;AAER,CAAC;",
+  "sourcesContent": ["\"use client\"\n\nimport { clsx } from \"deepsea-tools\"\nimport { HTMLAttributes, forwardRef } from \"react\"\n\nimport { css } from \"@emotion/css\"\n\nexport interface SkeletonProps extends HTMLAttributes<HTMLDivElement> {\n    loading?: boolean\n}\n\nexport const Skeleton = forwardRef<HTMLDivElement, SkeletonProps>((props, ref) => {\n    const { className, children, loading = children === undefined || children === null, ...rest } = props\n\n    return (\n        <div\n            ref={ref}\n            className={clsx(\n                css`\n                    @keyframes shimmer {\n                        0% {\n                            background-position: -400px 0px;\n                        }\n                        100% {\n                            background-position: 400px 0px;\n                        }\n                    }\n                `,\n                loading &&\n                    css`\n                        background-image: linear-gradient(to right, rgba(0, 0, 0, 0.067) 8%, rgba(0, 0, 0, 0.133) 18%, rgba(0, 0, 0, 0.067) 33%);\n                        animation-duration: 1s;\n                        animation-fill-mode: forwards;\n                        animation-iteration-count: infinite;\n                        animation-name: shimmer;\n                        animation-timing-function: linear;\n                        background-size: 800px 104px;\n                    `,\n                className,\n            )}\n            {...rest}\n        >\n            {children}\n        </div>\n    )\n})\n"],
+  "mappings": ";;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA,2BAAqB;AACrB,mBAA2C;AAE3C,iBAAoB;AAMb,IAAM,eAAW,yBAA0C,CAAC,OAAO,QAAQ;AAC9E,QAAM,EAAE,WAAW,UAAU,UAAU,aAAa,UAAa,aAAa,MAAM,GAAG,KAAK,IAAI;AAEhG,SACI;AAAA,IAAC;AAAA;AAAA,MACG;AAAA,MACA,eAAW;AAAA,QACP;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,QAUA,WACI;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,QASJ;AAAA,MACJ;AAAA,MACC,GAAG;AAAA;AAAA,IAEH;AAAA,EACL;AAER,CAAC;",
   "names": []
 }

package/dist/cjs/components/Trapezium.js

@@ -1,3 +1,4 @@
+"use client";
 var __defProp = Object.defineProperty;
 var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
 var __getOwnPropNames = Object.getOwnPropertyNames;

package/dist/cjs/components/Trapezium.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../src/components/Trapezium.tsx"],
-  "sourcesContent": ["import { clsx } from \"deepsea-tools\"\nimport { HTMLAttributes, forwardRef } from \"react\"\n\nimport { css } from \"@emotion/css\"\nimport { px, transformCSSVariable } from \"../utils\"\n\nexport interface TrapeziumProps extends HTMLAttributes<HTMLDivElement> {\n    top: number\n    bottom: number\n    height: number\n    borderRadius: number\n}\n\n/** 梯形组件 */\nexport const Trapezium = forwardRef<HTMLDivElement, TrapeziumProps>((props, ref) => {\n    const { top, bottom, height, borderRadius, className, style, ...rest } = props\n\n    const diff = (bottom - top) / 2\n\n    const a = Math.atan(height / diff) / 2\n\n    const b = borderRadius / Math.tan(a)\n\n    const c = b * Math.cos(a * 2)\n\n    const d = b * Math.sin(a * 2)\n\n    const e = Math.PI / 2 - a\n\n    const f = borderRadius / Math.tan(e)\n\n    const g = f * Math.cos(a * 2)\n\n    const h = f * Math.sin(a * 2)\n\n    return (\n        <div\n            ref={ref}\n            className={clsx(\n                css`\n                    width: var(--width);\n                    height: var(--height);\n                    clip-path: var(--clip-path);\n                `,\n                className,\n            )}\n            style={transformCSSVariable(\n                {\n                    width: px(bottom),\n                    height: px(height),\n                    clipath: `path(\"M ${diff + f} ${0}  A ${borderRadius} ${borderRadius} 0 0 0 ${diff - g} ${h} L ${c} ${height - d} A ${borderRadius} ${borderRadius} 0 0 0 ${b} ${height} L ${bottom - b} ${height} A ${borderRadius} ${borderRadius} 0 0 0 ${bottom - c} ${height - d} L ${top + diff + g} ${h} A ${borderRadius} ${borderRadius} 0 0 0 ${top + diff - f} ${0} Z\")`,\n                },\n                style,\n            )}\n            {...rest}\n        />\n    )\n})\n"],
-  "mappings": ";;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,2BAAqB;AACrB,mBAA2C;AAE3C,iBAAoB;AACpB,mBAAyC;AAUlC,IAAM,gBAAY,yBAA2C,CAAC,OAAO,QAAQ;AAChF,QAAM,EAAE,KAAK,QAAQ,QAAQ,cAAc,WAAW,OAAO,GAAG,KAAK,IAAI;AAEzE,QAAM,QAAQ,SAAS,OAAO;AAE9B,QAAM,IAAI,KAAK,KAAK,SAAS,IAAI,IAAI;AAErC,QAAM,IAAI,eAAe,KAAK,IAAI,CAAC;AAEnC,QAAM,IAAI,IAAI,KAAK,IAAI,IAAI,CAAC;AAE5B,QAAM,IAAI,IAAI,KAAK,IAAI,IAAI,CAAC;AAE5B,QAAM,IAAI,KAAK,KAAK,IAAI;AAExB,QAAM,IAAI,eAAe,KAAK,IAAI,CAAC;AAEnC,QAAM,IAAI,IAAI,KAAK,IAAI,IAAI,CAAC;AAE5B,QAAM,IAAI,IAAI,KAAK,IAAI,IAAI,CAAC;AAE5B,SACI;AAAA,IAAC;AAAA;AAAA,MACG;AAAA,MACA,eAAW;AAAA,QACP;AAAA;AAAA;AAAA;AAAA;AAAA,QAKA;AAAA,MACJ;AAAA,MACA,WAAO;AAAA,QACH;AAAA,UACI,WAAO,iBAAG,MAAM;AAAA,UAChB,YAAQ,iBAAG,MAAM;AAAA,UACjB,SAAS,WAAW,OAAO,KAAK,QAAQ,gBAAgB,sBAAsB,OAAO,KAAK,OAAO,KAAK,SAAS,OAAO,gBAAgB,sBAAsB,KAAK,YAAY,SAAS,KAAK,YAAY,gBAAgB,sBAAsB,SAAS,KAAK,SAAS,OAAO,MAAM,OAAO,KAAK,OAAO,gBAAgB,sBAAsB,MAAM,OAAO,KAAK;AAAA,QAChW;AAAA,QACA;AAAA,MACJ;AAAA,MACC,GAAG;AAAA;AAAA,EACR;AAER,CAAC;",
+  "sourcesContent": ["\"use client\"\n\nimport { clsx } from \"deepsea-tools\"\nimport { HTMLAttributes, forwardRef } from \"react\"\n\nimport { css } from \"@emotion/css\"\nimport { px, transformCSSVariable } from \"../utils\"\n\nexport interface TrapeziumProps extends HTMLAttributes<HTMLDivElement> {\n    top: number\n    bottom: number\n    height: number\n    borderRadius: number\n}\n\n/** 梯形组件 */\nexport const Trapezium = forwardRef<HTMLDivElement, TrapeziumProps>((props, ref) => {\n    const { top, bottom, height, borderRadius, className, style, ...rest } = props\n\n    const diff = (bottom - top) / 2\n\n    const a = Math.atan(height / diff) / 2\n\n    const b = borderRadius / Math.tan(a)\n\n    const c = b * Math.cos(a * 2)\n\n    const d = b * Math.sin(a * 2)\n\n    const e = Math.PI / 2 - a\n\n    const f = borderRadius / Math.tan(e)\n\n    const g = f * Math.cos(a * 2)\n\n    const h = f * Math.sin(a * 2)\n\n    return (\n        <div\n            ref={ref}\n            className={clsx(\n                css`\n                    width: var(--width);\n                    height: var(--height);\n                    clip-path: var(--clip-path);\n                `,\n                className,\n            )}\n            style={transformCSSVariable(\n                {\n                    width: px(bottom),\n                    height: px(height),\n                    clipath: `path(\"M ${diff + f} ${0}  A ${borderRadius} ${borderRadius} 0 0 0 ${diff - g} ${h} L ${c} ${height - d} A ${borderRadius} ${borderRadius} 0 0 0 ${b} ${height} L ${bottom - b} ${height} A ${borderRadius} ${borderRadius} 0 0 0 ${bottom - c} ${height - d} L ${top + diff + g} ${h} A ${borderRadius} ${borderRadius} 0 0 0 ${top + diff - f} ${0} Z\")`,\n                },\n                style,\n            )}\n            {...rest}\n        />\n    )\n})\n"],
+  "mappings": ";;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA,2BAAqB;AACrB,mBAA2C;AAE3C,iBAAoB;AACpB,mBAAyC;AAUlC,IAAM,gBAAY,yBAA2C,CAAC,OAAO,QAAQ;AAChF,QAAM,EAAE,KAAK,QAAQ,QAAQ,cAAc,WAAW,OAAO,GAAG,KAAK,IAAI;AAEzE,QAAM,QAAQ,SAAS,OAAO;AAE9B,QAAM,IAAI,KAAK,KAAK,SAAS,IAAI,IAAI;AAErC,QAAM,IAAI,eAAe,KAAK,IAAI,CAAC;AAEnC,QAAM,IAAI,IAAI,KAAK,IAAI,IAAI,CAAC;AAE5B,QAAM,IAAI,IAAI,KAAK,IAAI,IAAI,CAAC;AAE5B,QAAM,IAAI,KAAK,KAAK,IAAI;AAExB,QAAM,IAAI,eAAe,KAAK,IAAI,CAAC;AAEnC,QAAM,IAAI,IAAI,KAAK,IAAI,IAAI,CAAC;AAE5B,QAAM,IAAI,IAAI,KAAK,IAAI,IAAI,CAAC;AAE5B,SACI;AAAA,IAAC;AAAA;AAAA,MACG;AAAA,MACA,eAAW;AAAA,QACP;AAAA;AAAA;AAAA;AAAA;AAAA,QAKA;AAAA,MACJ;AAAA,MACA,WAAO;AAAA,QACH;AAAA,UACI,WAAO,iBAAG,MAAM;AAAA,UAChB,YAAQ,iBAAG,MAAM;AAAA,UACjB,SAAS,WAAW,OAAO,KAAK,QAAQ,gBAAgB,sBAAsB,OAAO,KAAK,OAAO,KAAK,SAAS,OAAO,gBAAgB,sBAAsB,KAAK,YAAY,SAAS,KAAK,YAAY,gBAAgB,sBAAsB,SAAS,KAAK,SAAS,OAAO,MAAM,OAAO,KAAK,OAAO,gBAAgB,sBAAsB,MAAM,OAAO,KAAK;AAAA,QAChW;AAAA,QACA;AAAA,MACJ;AAAA,MACC,GAAG;AAAA;AAAA,EACR;AAER,CAAC;",
   "names": []
 }

package/dist/esm/components/CircleText.js

@@ -1,3 +1,5 @@
+"use client";
+
 import { Fragment } from "react";
 import { jsx as _jsx } from "react/jsx-runtime";
 /** 环形文字 */

package/dist/esm/components/CircleText.js.map

@@ -1 +1 @@
-{"version":3,"names":["Fragment","jsx","_jsx","CircleText","props","width","height","radius","startAngel","gapAngel","align","style","direction","reverse","separator","children","rest","unitAngle","Math","atan","totalAngle","length","offsetAngle","getTransform","idx","angle","x","cos","y","sin","z","PI","words","split","map","w","position","transform","textAlign","lineHeight"],"sources":["../../../src/components/CircleText.tsx"],"sourcesContent":["import { FC, Fragment, HTMLAttributes } from \"react\"\n\nexport interface CircleTextProps extends Omit<HTMLAttributes<HTMLSpanElement>, \"children\"> {\n    /** 每一个方块的宽度 */\n    width: number\n    /** 每一个方块的高度 */\n    height: number\n    /** 圆弧的半径，不包含方块的高度 */\n    radius: number\n    /** 开始旋转的弧度，逆时针增加，0 为 x 轴方向 */\n    startAngel?: number\n    /** 每一个方块之间间隔的弧度 */\n    gapAngel?: number\n    /** 文字对齐的方式，默认居中 */\n    align?: \"left\" | \"center\" | \"right\"\n    /** 文字朝向圆心还是外侧，默认外侧 */\n    direction?: \"inner\" | \"outer\"\n    /** 是否反转文字顺序 */\n    reverse?: boolean\n    /** 分割文字的方法 */\n    separator?: string | RegExp | ((text: string) => string[])\n    /** 显示的文字 */\n    children: string\n}\n\n/** 环形文字 */\nexport const CircleText: FC<CircleTextProps> = props => {\n    const {\n        width,\n        height,\n        radius,\n        startAngel = 0,\n        gapAngel = 0,\n        align = \"center\",\n        style,\n        direction = \"outer\",\n        reverse = false,\n        separator,\n        children,\n        ...rest\n    } = props\n    const unitAngle = Math.atan(width / 2 / radius) * 2\n    const totalAngle = (unitAngle + gapAngel) * children.length - gapAngel\n    const offsetAngle = align === \"left\" ? 0 : align === \"right\" ? totalAngle : totalAngle / 2\n\n    function getTransform(idx: number) {\n        const angle = startAngel - idx * (unitAngle + gapAngel) + offsetAngle - unitAngle / 2\n        const x = (radius + height / 2) * Math.cos(angle) - width / 2\n        const y = (radius + height / 2) * Math.sin(angle) * -1 - height / 2\n        const z = Math.PI / 2 - angle + (direction === \"inner\" ? Math.PI : 0)\n        return `translateX(${x}px) translateY(${y}px) rotateZ(${(z / Math.PI) * 180}deg)`\n    }\n\n    const words = typeof separator === \"function\" ? separator(children) : children.split(separator ?? \"\")\n\n    if (reverse) words.reverse()\n\n    return (\n        <Fragment>\n            {words.map((w, idx) => (\n                <span\n                    key={idx}\n                    style={{\n                        position: \"absolute\",\n                        ...style,\n                        transform: getTransform(idx),\n                        textAlign: \"center\",\n                        width,\n                        lineHeight: `${height}px`,\n                        height: height,\n                    }}\n                    {...rest}\n                >\n                    {w}\n                </span>\n            ))}\n        </Fragment>\n    )\n}\n"],"mappings":"AAAA,SAAaA,QAAQ,QAAwB,OAAO;AAAA,SAAAC,GAAA,IAAAC,IAAA;AAyBpD;AACA,OAAO,MAAMC,UAA+B,GAAGC,KAAK,IAAI;EACpD,MAAM;IACFC,KAAK;IACLC,MAAM;IACNC,MAAM;IACNC,UAAU,GAAG,CAAC;IACdC,QAAQ,GAAG,CAAC;IACZC,KAAK,GAAG,QAAQ;IAChBC,KAAK;IACLC,SAAS,GAAG,OAAO;IACnBC,OAAO,GAAG,KAAK;IACfC,SAAS;IACTC,QAAQ;IACR,GAAGC;EACP,CAAC,GAAGZ,KAAK;EACT,MAAMa,SAAS,GAAGC,IAAI,CAACC,IAAI,CAACd,KAAK,GAAG,CAAC,GAAGE,MAAM,CAAC,GAAG,CAAC;EACnD,MAAMa,UAAU,GAAG,CAACH,SAAS,GAAGR,QAAQ,IAAIM,QAAQ,CAACM,MAAM,GAAGZ,QAAQ;EACtE,MAAMa,WAAW,GAAGZ,KAAK,KAAK,MAAM,GAAG,CAAC,GAAGA,KAAK,KAAK,OAAO,GAAGU,UAAU,GAAGA,UAAU,GAAG,CAAC;EAE1F,SAASG,YAAYA,CAACC,GAAW,EAAE;IAC/B,MAAMC,KAAK,GAAGjB,UAAU,GAAGgB,GAAG,IAAIP,SAAS,GAAGR,QAAQ,CAAC,GAAGa,WAAW,GAAGL,SAAS,GAAG,CAAC;IACrF,MAAMS,CAAC,GAAG,CAACnB,MAAM,GAAGD,MAAM,GAAG,CAAC,IAAIY,IAAI,CAACS,GAAG,CAACF,KAAK,CAAC,GAAGpB,KAAK,GAAG,CAAC;IAC7D,MAAMuB,CAAC,GAAG,CAACrB,MAAM,GAAGD,MAAM,GAAG,CAAC,IAAIY,IAAI,CAACW,GAAG,CAACJ,KAAK,CAAC,GAAG,CAAC,CAAC,GAAGnB,MAAM,GAAG,CAAC;IACnE,MAAMwB,CAAC,GAAGZ,IAAI,CAACa,EAAE,GAAG,CAAC,GAAGN,KAAK,IAAIb,SAAS,KAAK,OAAO,GAAGM,IAAI,CAACa,EAAE,GAAG,CAAC,CAAC;IACrE,OAAQ,cAAaL,CAAE,kBAAiBE,CAAE,eAAeE,CAAC,GAAGZ,IAAI,CAACa,EAAE,GAAI,GAAI,MAAK;EACrF;EAEA,MAAMC,KAAK,GAAG,OAAOlB,SAAS,KAAK,UAAU,GAAGA,SAAS,CAACC,QAAQ,CAAC,GAAGA,QAAQ,CAACkB,KAAK,CAACnB,SAAS,IAAI,EAAE,CAAC;EAErG,IAAID,OAAO,EAAEmB,KAAK,CAACnB,OAAO,CAAC,CAAC;EAE5B,oBACIX,IAAA,CAACF,QAAQ;IAAAe,QAAA,EACJiB,KAAK,CAACE,GAAG,CAAC,CAACC,CAAC,EAAEX,GAAG,kBACdtB,IAAA;MAEIS,KAAK,EAAE;QACHyB,QAAQ,EAAE,UAAU;QACpB,GAAGzB,KAAK;QACR0B,SAAS,EAAEd,YAAY,CAACC,GAAG,CAAC;QAC5Bc,SAAS,EAAE,QAAQ;QACnBjC,KAAK;QACLkC,UAAU,EAAG,GAAEjC,MAAO,IAAG;QACzBA,MAAM,EAAEA;MACZ,CAAE;MAAA,GACEU,IAAI;MAAAD,QAAA,EAEPoB;IAAC,GAZGX,GAaH,CACT;EAAC,CACI,CAAC;AAEnB,CAAC"}
+{"version":3,"names":["Fragment","jsx","_jsx","CircleText","props","width","height","radius","startAngel","gapAngel","align","style","direction","reverse","separator","children","rest","unitAngle","Math","atan","totalAngle","length","offsetAngle","getTransform","idx","angle","x","cos","y","sin","z","PI","words","split","map","w","position","transform","textAlign","lineHeight"],"sources":["../../../src/components/CircleText.tsx"],"sourcesContent":["\"use client\"\n\nimport { FC, Fragment, HTMLAttributes } from \"react\"\n\nexport interface CircleTextProps extends Omit<HTMLAttributes<HTMLSpanElement>, \"children\"> {\n    /** 每一个方块的宽度 */\n    width: number\n    /** 每一个方块的高度 */\n    height: number\n    /** 圆弧的半径，不包含方块的高度 */\n    radius: number\n    /** 开始旋转的弧度，逆时针增加，0 为 x 轴方向 */\n    startAngel?: number\n    /** 每一个方块之间间隔的弧度 */\n    gapAngel?: number\n    /** 文字对齐的方式，默认居中 */\n    align?: \"left\" | \"center\" | \"right\"\n    /** 文字朝向圆心还是外侧，默认外侧 */\n    direction?: \"inner\" | \"outer\"\n    /** 是否反转文字顺序 */\n    reverse?: boolean\n    /** 分割文字的方法 */\n    separator?: string | RegExp | ((text: string) => string[])\n    /** 显示的文字 */\n    children: string\n}\n\n/** 环形文字 */\nexport const CircleText: FC<CircleTextProps> = props => {\n    const {\n        width,\n        height,\n        radius,\n        startAngel = 0,\n        gapAngel = 0,\n        align = \"center\",\n        style,\n        direction = \"outer\",\n        reverse = false,\n        separator,\n        children,\n        ...rest\n    } = props\n    const unitAngle = Math.atan(width / 2 / radius) * 2\n    const totalAngle = (unitAngle + gapAngel) * children.length - gapAngel\n    const offsetAngle = align === \"left\" ? 0 : align === \"right\" ? totalAngle : totalAngle / 2\n\n    function getTransform(idx: number) {\n        const angle = startAngel - idx * (unitAngle + gapAngel) + offsetAngle - unitAngle / 2\n        const x = (radius + height / 2) * Math.cos(angle) - width / 2\n        const y = (radius + height / 2) * Math.sin(angle) * -1 - height / 2\n        const z = Math.PI / 2 - angle + (direction === \"inner\" ? Math.PI : 0)\n        return `translateX(${x}px) translateY(${y}px) rotateZ(${(z / Math.PI) * 180}deg)`\n    }\n\n    const words = typeof separator === \"function\" ? separator(children) : children.split(separator ?? \"\")\n\n    if (reverse) words.reverse()\n\n    return (\n        <Fragment>\n            {words.map((w, idx) => (\n                <span\n                    key={idx}\n                    style={{\n                        position: \"absolute\",\n                        ...style,\n                        transform: getTransform(idx),\n                        textAlign: \"center\",\n                        width,\n                        lineHeight: `${height}px`,\n                        height: height,\n                    }}\n                    {...rest}\n                >\n                    {w}\n                </span>\n            ))}\n        </Fragment>\n    )\n}\n"],"mappings":"AAAA,YAAY;;AAEZ,SAAaA,QAAQ,QAAwB,OAAO;AAAA,SAAAC,GAAA,IAAAC,IAAA;AAyBpD;AACA,OAAO,MAAMC,UAA+B,GAAGC,KAAK,IAAI;EACpD,MAAM;IACFC,KAAK;IACLC,MAAM;IACNC,MAAM;IACNC,UAAU,GAAG,CAAC;IACdC,QAAQ,GAAG,CAAC;IACZC,KAAK,GAAG,QAAQ;IAChBC,KAAK;IACLC,SAAS,GAAG,OAAO;IACnBC,OAAO,GAAG,KAAK;IACfC,SAAS;IACTC,QAAQ;IACR,GAAGC;EACP,CAAC,GAAGZ,KAAK;EACT,MAAMa,SAAS,GAAGC,IAAI,CAACC,IAAI,CAACd,KAAK,GAAG,CAAC,GAAGE,MAAM,CAAC,GAAG,CAAC;EACnD,MAAMa,UAAU,GAAG,CAACH,SAAS,GAAGR,QAAQ,IAAIM,QAAQ,CAACM,MAAM,GAAGZ,QAAQ;EACtE,MAAMa,WAAW,GAAGZ,KAAK,KAAK,MAAM,GAAG,CAAC,GAAGA,KAAK,KAAK,OAAO,GAAGU,UAAU,GAAGA,UAAU,GAAG,CAAC;EAE1F,SAASG,YAAYA,CAACC,GAAW,EAAE;IAC/B,MAAMC,KAAK,GAAGjB,UAAU,GAAGgB,GAAG,IAAIP,SAAS,GAAGR,QAAQ,CAAC,GAAGa,WAAW,GAAGL,SAAS,GAAG,CAAC;IACrF,MAAMS,CAAC,GAAG,CAACnB,MAAM,GAAGD,MAAM,GAAG,CAAC,IAAIY,IAAI,CAACS,GAAG,CAACF,KAAK,CAAC,GAAGpB,KAAK,GAAG,CAAC;IAC7D,MAAMuB,CAAC,GAAG,CAACrB,MAAM,GAAGD,MAAM,GAAG,CAAC,IAAIY,IAAI,CAACW,GAAG,CAACJ,KAAK,CAAC,GAAG,CAAC,CAAC,GAAGnB,MAAM,GAAG,CAAC;IACnE,MAAMwB,CAAC,GAAGZ,IAAI,CAACa,EAAE,GAAG,CAAC,GAAGN,KAAK,IAAIb,SAAS,KAAK,OAAO,GAAGM,IAAI,CAACa,EAAE,GAAG,CAAC,CAAC;IACrE,OAAQ,cAAaL,CAAE,kBAAiBE,CAAE,eAAeE,CAAC,GAAGZ,IAAI,CAACa,EAAE,GAAI,GAAI,MAAK;EACrF;EAEA,MAAMC,KAAK,GAAG,OAAOlB,SAAS,KAAK,UAAU,GAAGA,SAAS,CAACC,QAAQ,CAAC,GAAGA,QAAQ,CAACkB,KAAK,CAACnB,SAAS,IAAI,EAAE,CAAC;EAErG,IAAID,OAAO,EAAEmB,KAAK,CAACnB,OAAO,CAAC,CAAC;EAE5B,oBACIX,IAAA,CAACF,QAAQ;IAAAe,QAAA,EACJiB,KAAK,CAACE,GAAG,CAAC,CAACC,CAAC,EAAEX,GAAG,kBACdtB,IAAA;MAEIS,KAAK,EAAE;QACHyB,QAAQ,EAAE,UAAU;QACpB,GAAGzB,KAAK;QACR0B,SAAS,EAAEd,YAAY,CAACC,GAAG,CAAC;QAC5Bc,SAAS,EAAE,QAAQ;QACnBjC,KAAK;QACLkC,UAAU,EAAG,GAAEjC,MAAO,IAAG;QACzBA,MAAM,EAAEA;MACZ,CAAE;MAAA,GACEU,IAAI;MAAAD,QAAA,EAEPoB;IAAC,GAZGX,GAaH,CACT;EAAC,CACI,CAAC;AAEnB,CAAC"}

package/dist/esm/components/FormLabel.d.ts

@@ -1,5 +1,5 @@
-import { ComponentPropsWithoutRef, FC } from "react";
-export type FormLabelProps = ComponentPropsWithoutRef<"div"> & {
+import { ComponentPropsWithoutRef, FC, ReactNode } from "react";
+export type FormLabelConfig = {
     /**
      * Label 的宽度.
      */
@@ -7,8 +7,14 @@ export type FormLabelProps = ComponentPropsWithoutRef<"div"> & {
     /**
      * 是否在 Label 前面添加一个空白区域，只有当前 Label 为非必选，而存在其他 Label 为必选的时候开启
      */
-    before?: boolean;
+    before?: boolean | number;
 };
+export type FormLabelProps = ComponentPropsWithoutRef<"div"> & FormLabelConfig;
+export declare const FormLabelConfigContext: import("react").Context<Partial<FormLabelConfig>>;
+export type FormLabelConfigProviderProps = FormLabelConfig & {
+    children?: ReactNode;
+};
+export declare const FormLabelConfigProvider: FC<FormLabelConfigProviderProps>;
 /**
  * 为 Ant Design 的 FormItem 设计的 Label 组件
  */

package/dist/esm/components/FormLabel.js

@@ -1,33 +1,51 @@
-import { clsx } from "deepsea-tools";
-import { Fragment } from "react";
-import { css } from "@emotion/css";
+"use client";
+
+import { Fragment, createContext, useContext } from "react";
 import { jsx as _jsx } from "react/jsx-runtime";
 import { jsxs as _jsxs } from "react/jsx-runtime";
+export const FormLabelConfigContext = /*#__PURE__*/createContext({});
+export const FormLabelConfigProvider = ({
+  width,
+  before,
+  children
+}) => /*#__PURE__*/_jsx(FormLabelConfigContext.Provider, {
+  value: {
+    width,
+    before
+  },
+  children: children
+});
+
 /**
  * 为 Ant Design 的 FormItem 设计的 Label 组件
  */
-export const FormLabel = ({
-  className,
-  style,
-  before,
-  width,
-  ...rest
-}) => /*#__PURE__*/_jsxs(Fragment, {
-  children: [!!before && /*#__PURE__*/_jsx("div", {
-    style: {
-      width: 11
-    },
-    children: "\u2002"
-  }), /*#__PURE__*/_jsx("div", {
-    className: clsx(css`
-                    text-align: justify;
-                    text-align-last: justify;
-                `, className),
-    style: {
-      width,
-      ...style
-    },
+export const FormLabel = props => {
+  const {
+    width: _width,
+    before: _before
+  } = useContext(FormLabelConfigContext);
+  const {
+    style,
+    width = _width,
+    before = _before,
     ...rest
-  })]
-});
+  } = props;
+  return /*#__PURE__*/_jsxs(Fragment, {
+    children: [!!before && /*#__PURE__*/_jsx("div", {
+      style: {
+        width: 11,
+        color: "transparent"
+      },
+      children: "\u2002"
+    }), /*#__PURE__*/_jsx("div", {
+      style: {
+        width,
+        textAlign: "justify",
+        textAlignLast: "justify",
+        ...style
+      },
+      ...rest
+    })]
+  });
+};
 //# sourceMappingURL=FormLabel.js.map

package/dist/esm/components/FormLabel.js.map

@@ -1 +1 @@
-{"version":3,"names":["clsx","Fragment","css","jsx","_jsx","jsxs","_jsxs","FormLabel","className","style","before","width","rest","children"],"sources":["../../../src/components/FormLabel.tsx"],"sourcesContent":["import { clsx } from \"deepsea-tools\"\nimport { ComponentPropsWithoutRef, FC, Fragment } from \"react\"\n\nimport { css } from \"@emotion/css\"\n\nexport type FormLabelProps = ComponentPropsWithoutRef<\"div\"> & {\n    /**\n     * Label 的宽度.\n     */\n    width: number\n    /**\n     * 是否在 Label 前面添加一个空白区域，只有当前 Label 为非必选，而存在其他 Label 为必选的时候开启\n     */\n    before?: boolean\n}\n\n/**\n * 为 Ant Design 的 FormItem 设计的 Label 组件\n */\nexport const FormLabel: FC<FormLabelProps> = ({ className, style, before, width, ...rest }) => (\n    <Fragment>\n        {!!before && <div style={{ width: 11 }}>&ensp;</div>}\n        <div\n            className={clsx(\n                css`\n                    text-align: justify;\n                    text-align-last: justify;\n                `,\n                className,\n            )}\n            style={{ width, ...style }}\n            {...rest}\n        />\n    </Fragment>\n)\n"],"mappings":"AAAA,SAASA,IAAI,QAAQ,eAAe;AACpC,SAAuCC,QAAQ,QAAQ,OAAO;AAE9D,SAASC,GAAG,QAAQ,cAAc;AAAA,SAAAC,GAAA,IAAAC,IAAA;AAAA,SAAAC,IAAA,IAAAC,KAAA;AAalC;AACA;AACA;AACA,OAAO,MAAMC,SAA6B,GAAGA,CAAC;EAAEC,SAAS;EAAEC,KAAK;EAAEC,MAAM;EAAEC,KAAK;EAAE,GAAGC;AAAK,CAAC,kBACtFN,KAAA,CAACL,QAAQ;EAAAY,QAAA,GACJ,CAAC,CAACH,MAAM,iBAAIN,IAAA;IAAKK,KAAK,EAAE;MAAEE,KAAK,EAAE;IAAG,CAAE;IAAAE,QAAA,EAAC;EAAM,CAAK,CAAC,eACpDT,IAAA;IACII,SAAS,EAAER,IAAI,CACXE,GAAI;AACpB;AACA;AACA,iBAAiB,EACDM,SACJ,CAAE;IACFC,KAAK,EAAE;MAAEE,KAAK;MAAE,GAAGF;IAAM,CAAE;IAAA,GACvBG;EAAI,CACX,CAAC;AAAA,CACI,CACb"}
+{"version":3,"names":["Fragment","createContext","useContext","jsx","_jsx","jsxs","_jsxs","FormLabelConfigContext","FormLabelConfigProvider","width","before","children","Provider","value","FormLabel","props","_width","_before","style","rest","color","textAlign","textAlignLast"],"sources":["../../../src/components/FormLabel.tsx"],"sourcesContent":["\"use client\"\n\nimport { ComponentPropsWithoutRef, FC, Fragment, ReactNode, createContext, useContext } from \"react\"\n\nexport type FormLabelConfig = {\n    /**\n     * Label 的宽度.\n     */\n    width: number\n    /**\n     * 是否在 Label 前面添加一个空白区域，只有当前 Label 为非必选，而存在其他 Label 为必选的时候开启\n     */\n    before?: boolean | number\n}\n\nexport type FormLabelProps = ComponentPropsWithoutRef<\"div\"> & FormLabelConfig\n\nexport const FormLabelConfigContext = createContext<Partial<FormLabelConfig>>({})\n\nexport type FormLabelConfigProviderProps = FormLabelConfig & {\n    children?: ReactNode\n}\n\nexport const FormLabelConfigProvider: FC<FormLabelConfigProviderProps> = ({ width, before, children }) => (\n    <FormLabelConfigContext.Provider value={{ width, before }}>{children}</FormLabelConfigContext.Provider>\n)\n\n/**\n * 为 Ant Design 的 FormItem 设计的 Label 组件\n */\nexport const FormLabel: FC<FormLabelProps> = props => {\n    const { width: _width, before: _before } = useContext(FormLabelConfigContext)\n    const { style, width = _width, before = _before, ...rest } = props\n\n    return (\n        <Fragment>\n            {!!before && <div style={{ width: 11, color: \"transparent\" }}>&ensp;</div>}\n            <div style={{ width, textAlign: \"justify\", textAlignLast: \"justify\", ...style }} {...rest} />\n        </Fragment>\n    )\n}\n"],"mappings":"AAAA,YAAY;;AAEZ,SAAuCA,QAAQ,EAAaC,aAAa,EAAEC,UAAU,QAAQ,OAAO;AAAA,SAAAC,GAAA,IAAAC,IAAA;AAAA,SAAAC,IAAA,IAAAC,KAAA;AAepG,OAAO,MAAMC,sBAAsB,gBAAGN,aAAa,CAA2B,CAAC,CAAC,CAAC;AAMjF,OAAO,MAAMO,uBAAyD,GAAGA,CAAC;EAAEC,KAAK;EAAEC,MAAM;EAAEC;AAAS,CAAC,kBACjGP,IAAA,CAACG,sBAAsB,CAACK,QAAQ;EAACC,KAAK,EAAE;IAAEJ,KAAK;IAAEC;EAAO,CAAE;EAAAC,QAAA,EAAEA;AAAQ,CAAkC,CACzG;;AAED;AACA;AACA;AACA,OAAO,MAAMG,SAA6B,GAAGC,KAAK,IAAI;EAClD,MAAM;IAAEN,KAAK,EAAEO,MAAM;IAAEN,MAAM,EAAEO;EAAQ,CAAC,GAAGf,UAAU,CAACK,sBAAsB,CAAC;EAC7E,MAAM;IAAEW,KAAK;IAAET,KAAK,GAAGO,MAAM;IAAEN,MAAM,GAAGO,OAAO;IAAE,GAAGE;EAAK,CAAC,GAAGJ,KAAK;EAElE,oBACIT,KAAA,CAACN,QAAQ;IAAAW,QAAA,GACJ,CAAC,CAACD,MAAM,iBAAIN,IAAA;MAAKc,KAAK,EAAE;QAAET,KAAK,EAAE,EAAE;QAAEW,KAAK,EAAE;MAAc,CAAE;MAAAT,QAAA,EAAC;IAAM,CAAK,CAAC,eAC1EP,IAAA;MAAKc,KAAK,EAAE;QAAET,KAAK;QAAEY,SAAS,EAAE,SAAS;QAAEC,aAAa,EAAE,SAAS;QAAE,GAAGJ;MAAM,CAAE;MAAA,GAAKC;IAAI,CAAG,CAAC;EAAA,CACvF,CAAC;AAEnB,CAAC"}

package/dist/esm/components/Ring.js

@@ -1,3 +1,5 @@
+"use client";
+
 import { forwardRef } from "react";
 import { jsx as _jsx } from "react/jsx-runtime";
 /** 环形组件 */

package/dist/esm/components/Ring.js.map

@@ -1 +1 @@
-{"version":3,"names":["forwardRef","jsx","_jsx","Ring","props","ref","outerWidth","innerWidth","style","rest","outerRadius","innerRadius","width","height","clipPath"],"sources":["../../../src/components/Ring.tsx"],"sourcesContent":["import { HTMLAttributes, forwardRef } from \"react\"\n\nexport interface RingProps extends HTMLAttributes<HTMLDivElement> {\n    outerWidth: number\n    innerWidth: number\n}\n\n/** 环形组件 */\nexport const Ring = forwardRef<HTMLDivElement, RingProps>((props, ref) => {\n    const { outerWidth, innerWidth, style, ...rest } = props\n\n    const outerRadius = outerWidth / 2\n\n    const innerRadius = innerWidth / 2\n\n    return (\n        <div\n            ref={ref}\n            style={{\n                ...style,\n                width: `${outerWidth}px`,\n                height: `${outerWidth}px`,\n                clipPath: `path(\"M0,${outerRadius} a${outerRadius},${outerRadius},0,1,0,${outerWidth},0 a${outerRadius},${outerRadius},0,1,0,-${outerWidth},0 l${outerRadius - innerRadius},0 a${innerRadius},${innerRadius},0,0,1,${innerRadius * 2},0 a${innerRadius},${innerRadius},0,0,1,-${innerRadius * 2},0 Z\")`,\n            }}\n            {...rest}\n        />\n    )\n})\n"],"mappings":"AAAA,SAAyBA,UAAU,QAAQ,OAAO;AAAA,SAAAC,GAAA,IAAAC,IAAA;AAOlD;AACA,OAAO,MAAMC,IAAI,gBAAGH,UAAU,CAA4B,CAACI,KAAK,EAAEC,GAAG,KAAK;EACtE,MAAM;IAAEC,UAAU;IAAEC,UAAU;IAAEC,KAAK;IAAE,GAAGC;EAAK,CAAC,GAAGL,KAAK;EAExD,MAAMM,WAAW,GAAGJ,UAAU,GAAG,CAAC;EAElC,MAAMK,WAAW,GAAGJ,UAAU,GAAG,CAAC;EAElC,oBACIL,IAAA;IACIG,GAAG,EAAEA,GAAI;IACTG,KAAK,EAAE;MACH,GAAGA,KAAK;MACRI,KAAK,EAAG,GAAEN,UAAW,IAAG;MACxBO,MAAM,EAAG,GAAEP,UAAW,IAAG;MACzBQ,QAAQ,EAAG,YAAWJ,WAAY,KAAIA,WAAY,IAAGA,WAAY,UAASJ,UAAW,OAAMI,WAAY,IAAGA,WAAY,WAAUJ,UAAW,OAAMI,WAAW,GAAGC,WAAY,OAAMA,WAAY,IAAGA,WAAY,UAASA,WAAW,GAAG,CAAE,OAAMA,WAAY,IAAGA,WAAY,WAAUA,WAAW,GAAG,CAAE;IACpS,CAAE;IAAA,GACEF;EAAI,CACX,CAAC;AAEV,CAAC,CAAC"}
+{"version":3,"names":["forwardRef","jsx","_jsx","Ring","props","ref","outerWidth","innerWidth","style","rest","outerRadius","innerRadius","width","height","clipPath"],"sources":["../../../src/components/Ring.tsx"],"sourcesContent":["\"use client\"\n\nimport { HTMLAttributes, forwardRef } from \"react\"\n\nexport interface RingProps extends HTMLAttributes<HTMLDivElement> {\n    outerWidth: number\n    innerWidth: number\n}\n\n/** 环形组件 */\nexport const Ring = forwardRef<HTMLDivElement, RingProps>((props, ref) => {\n    const { outerWidth, innerWidth, style, ...rest } = props\n\n    const outerRadius = outerWidth / 2\n\n    const innerRadius = innerWidth / 2\n\n    return (\n        <div\n            ref={ref}\n            style={{\n                ...style,\n                width: `${outerWidth}px`,\n                height: `${outerWidth}px`,\n                clipPath: `path(\"M0,${outerRadius} a${outerRadius},${outerRadius},0,1,0,${outerWidth},0 a${outerRadius},${outerRadius},0,1,0,-${outerWidth},0 l${outerRadius - innerRadius},0 a${innerRadius},${innerRadius},0,0,1,${innerRadius * 2},0 a${innerRadius},${innerRadius},0,0,1,-${innerRadius * 2},0 Z\")`,\n            }}\n            {...rest}\n        />\n    )\n})\n"],"mappings":"AAAA,YAAY;;AAEZ,SAAyBA,UAAU,QAAQ,OAAO;AAAA,SAAAC,GAAA,IAAAC,IAAA;AAOlD;AACA,OAAO,MAAMC,IAAI,gBAAGH,UAAU,CAA4B,CAACI,KAAK,EAAEC,GAAG,KAAK;EACtE,MAAM;IAAEC,UAAU;IAAEC,UAAU;IAAEC,KAAK;IAAE,GAAGC;EAAK,CAAC,GAAGL,KAAK;EAExD,MAAMM,WAAW,GAAGJ,UAAU,GAAG,CAAC;EAElC,MAAMK,WAAW,GAAGJ,UAAU,GAAG,CAAC;EAElC,oBACIL,IAAA;IACIG,GAAG,EAAEA,GAAI;IACTG,KAAK,EAAE;MACH,GAAGA,KAAK;MACRI,KAAK,EAAG,GAAEN,UAAW,IAAG;MACxBO,MAAM,EAAG,GAAEP,UAAW,IAAG;MACzBQ,QAAQ,EAAG,YAAWJ,WAAY,KAAIA,WAAY,IAAGA,WAAY,UAASJ,UAAW,OAAMI,WAAY,IAAGA,WAAY,WAAUJ,UAAW,OAAMI,WAAW,GAAGC,WAAY,OAAMA,WAAY,IAAGA,WAAY,UAASA,WAAW,GAAG,CAAE,OAAMA,WAAY,IAAGA,WAAY,WAAUA,WAAW,GAAG,CAAE;IACpS,CAAE;IAAA,GACEF;EAAI,CACX,CAAC;AAEV,CAAC,CAAC"}

package/dist/esm/components/Skeleton.js

@@ -1,3 +1,5 @@
+"use client";
+
 import { clsx } from "deepsea-tools";
 import { forwardRef } from "react";
 import { css } from "@emotion/css";

package/dist/esm/components/Skeleton.js.map

@@ -1 +1 @@
-{"version":3,"names":["clsx","forwardRef","css","jsx","_jsx","Skeleton","props","ref","className","children","loading","undefined","rest"],"sources":["../../../src/components/Skeleton.tsx"],"sourcesContent":["import { clsx } from \"deepsea-tools\"\nimport { HTMLAttributes, forwardRef } from \"react\"\n\nimport { css } from \"@emotion/css\"\n\nexport interface SkeletonProps extends HTMLAttributes<HTMLDivElement> {\n    loading?: boolean\n}\n\nexport const Skeleton = forwardRef<HTMLDivElement, SkeletonProps>((props, ref) => {\n    const { className, children, loading = children === undefined || children === null, ...rest } = props\n\n    return (\n        <div\n            ref={ref}\n            className={clsx(\n                css`\n                    @keyframes shimmer {\n                        0% {\n                            background-position: -400px 0px;\n                        }\n                        100% {\n                            background-position: 400px 0px;\n                        }\n                    }\n                `,\n                loading &&\n                    css`\n                        background-image: linear-gradient(to right, rgba(0, 0, 0, 0.067) 8%, rgba(0, 0, 0, 0.133) 18%, rgba(0, 0, 0, 0.067) 33%);\n                        animation-duration: 1s;\n                        animation-fill-mode: forwards;\n                        animation-iteration-count: infinite;\n                        animation-name: shimmer;\n                        animation-timing-function: linear;\n                        background-size: 800px 104px;\n                    `,\n                className,\n            )}\n            {...rest}\n        >\n            {children}\n        </div>\n    )\n})\n"],"mappings":"AAAA,SAASA,IAAI,QAAQ,eAAe;AACpC,SAAyBC,UAAU,QAAQ,OAAO;AAElD,SAASC,GAAG,QAAQ,cAAc;AAAA,SAAAC,GAAA,IAAAC,IAAA;AAMlC,OAAO,MAAMC,QAAQ,gBAAGJ,UAAU,CAAgC,CAACK,KAAK,EAAEC,GAAG,KAAK;EAC9E,MAAM;IAAEC,SAAS;IAAEC,QAAQ;IAAEC,OAAO,GAAGD,QAAQ,KAAKE,SAAS,IAAIF,QAAQ,KAAK,IAAI;IAAE,GAAGG;EAAK,CAAC,GAAGN,KAAK;EAErG,oBACIF,IAAA;IACIG,GAAG,EAAEA,GAAI;IACTC,SAAS,EAAER,IAAI,CACXE,GAAI;AACpB;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,iBAAiB,EACDQ,OAAO,IACHR,GAAI;AACxB;AACA;AACA;AACA;AACA;AACA;AACA;AACA,qBAAqB,EACLM,SACJ,CAAE;IAAA,GACEI,IAAI;IAAAH,QAAA,EAEPA;EAAQ,CACR,CAAC;AAEd,CAAC,CAAC"}
+{"version":3,"names":["clsx","forwardRef","css","jsx","_jsx","Skeleton","props","ref","className","children","loading","undefined","rest"],"sources":["../../../src/components/Skeleton.tsx"],"sourcesContent":["\"use client\"\n\nimport { clsx } from \"deepsea-tools\"\nimport { HTMLAttributes, forwardRef } from \"react\"\n\nimport { css } from \"@emotion/css\"\n\nexport interface SkeletonProps extends HTMLAttributes<HTMLDivElement> {\n    loading?: boolean\n}\n\nexport const Skeleton = forwardRef<HTMLDivElement, SkeletonProps>((props, ref) => {\n    const { className, children, loading = children === undefined || children === null, ...rest } = props\n\n    return (\n        <div\n            ref={ref}\n            className={clsx(\n                css`\n                    @keyframes shimmer {\n                        0% {\n                            background-position: -400px 0px;\n                        }\n                        100% {\n                            background-position: 400px 0px;\n                        }\n                    }\n                `,\n                loading &&\n                    css`\n                        background-image: linear-gradient(to right, rgba(0, 0, 0, 0.067) 8%, rgba(0, 0, 0, 0.133) 18%, rgba(0, 0, 0, 0.067) 33%);\n                        animation-duration: 1s;\n                        animation-fill-mode: forwards;\n                        animation-iteration-count: infinite;\n                        animation-name: shimmer;\n                        animation-timing-function: linear;\n                        background-size: 800px 104px;\n                    `,\n                className,\n            )}\n            {...rest}\n        >\n            {children}\n        </div>\n    )\n})\n"],"mappings":"AAAA,YAAY;;AAEZ,SAASA,IAAI,QAAQ,eAAe;AACpC,SAAyBC,UAAU,QAAQ,OAAO;AAElD,SAASC,GAAG,QAAQ,cAAc;AAAA,SAAAC,GAAA,IAAAC,IAAA;AAMlC,OAAO,MAAMC,QAAQ,gBAAGJ,UAAU,CAAgC,CAACK,KAAK,EAAEC,GAAG,KAAK;EAC9E,MAAM;IAAEC,SAAS;IAAEC,QAAQ;IAAEC,OAAO,GAAGD,QAAQ,KAAKE,SAAS,IAAIF,QAAQ,KAAK,IAAI;IAAE,GAAGG;EAAK,CAAC,GAAGN,KAAK;EAErG,oBACIF,IAAA;IACIG,GAAG,EAAEA,GAAI;IACTC,SAAS,EAAER,IAAI,CACXE,GAAI;AACpB;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,iBAAiB,EACDQ,OAAO,IACHR,GAAI;AACxB;AACA;AACA;AACA;AACA;AACA;AACA;AACA,qBAAqB,EACLM,SACJ,CAAE;IAAA,GACEI,IAAI;IAAAH,QAAA,EAEPA;EAAQ,CACR,CAAC;AAEd,CAAC,CAAC"}

package/dist/esm/components/Trapezium.js

@@ -1,3 +1,5 @@
+"use client";
+
 import { clsx } from "deepsea-tools";
 import { forwardRef } from "react";
 import { css } from "@emotion/css";

package/dist/esm/components/Trapezium.js.map

@@ -1 +1 @@
-{"version":3,"names":["clsx","forwardRef","css","px","transformCSSVariable","jsx","_jsx","Trapezium","props","ref","top","bottom","height","borderRadius","className","style","rest","diff","a","Math","atan","b","tan","c","cos","d","sin","e","PI","f","g","h","width","clipath"],"sources":["../../../src/components/Trapezium.tsx"],"sourcesContent":["import { clsx } from \"deepsea-tools\"\nimport { HTMLAttributes, forwardRef } from \"react\"\n\nimport { css } from \"@emotion/css\"\nimport { px, transformCSSVariable } from \"../utils\"\n\nexport interface TrapeziumProps extends HTMLAttributes<HTMLDivElement> {\n    top: number\n    bottom: number\n    height: number\n    borderRadius: number\n}\n\n/** 梯形组件 */\nexport const Trapezium = forwardRef<HTMLDivElement, TrapeziumProps>((props, ref) => {\n    const { top, bottom, height, borderRadius, className, style, ...rest } = props\n\n    const diff = (bottom - top) / 2\n\n    const a = Math.atan(height / diff) / 2\n\n    const b = borderRadius / Math.tan(a)\n\n    const c = b * Math.cos(a * 2)\n\n    const d = b * Math.sin(a * 2)\n\n    const e = Math.PI / 2 - a\n\n    const f = borderRadius / Math.tan(e)\n\n    const g = f * Math.cos(a * 2)\n\n    const h = f * Math.sin(a * 2)\n\n    return (\n        <div\n            ref={ref}\n            className={clsx(\n                css`\n                    width: var(--width);\n                    height: var(--height);\n                    clip-path: var(--clip-path);\n                `,\n                className,\n            )}\n            style={transformCSSVariable(\n                {\n                    width: px(bottom),\n                    height: px(height),\n                    clipath: `path(\"M ${diff + f} ${0}  A ${borderRadius} ${borderRadius} 0 0 0 ${diff - g} ${h} L ${c} ${height - d} A ${borderRadius} ${borderRadius} 0 0 0 ${b} ${height} L ${bottom - b} ${height} A ${borderRadius} ${borderRadius} 0 0 0 ${bottom - c} ${height - d} L ${top + diff + g} ${h} A ${borderRadius} ${borderRadius} 0 0 0 ${top + diff - f} ${0} Z\")`,\n                },\n                style,\n            )}\n            {...rest}\n        />\n    )\n})\n"],"mappings":"AAAA,SAASA,IAAI,QAAQ,eAAe;AACpC,SAAyBC,UAAU,QAAQ,OAAO;AAElD,SAASC,GAAG,QAAQ,cAAc;AAClC,SAASC,EAAE,EAAEC,oBAAoB;AAAkB,SAAAC,GAAA,IAAAC,IAAA;AASnD;AACA,OAAO,MAAMC,SAAS,gBAAGN,UAAU,CAAiC,CAACO,KAAK,EAAEC,GAAG,KAAK;EAChF,MAAM;IAAEC,GAAG;IAAEC,MAAM;IAAEC,MAAM;IAAEC,YAAY;IAAEC,SAAS;IAAEC,KAAK;IAAE,GAAGC;EAAK,CAAC,GAAGR,KAAK;EAE9E,MAAMS,IAAI,GAAG,CAACN,MAAM,GAAGD,GAAG,IAAI,CAAC;EAE/B,MAAMQ,CAAC,GAAGC,IAAI,CAACC,IAAI,CAACR,MAAM,GAAGK,IAAI,CAAC,GAAG,CAAC;EAEtC,MAAMI,CAAC,GAAGR,YAAY,GAAGM,IAAI,CAACG,GAAG,CAACJ,CAAC,CAAC;EAEpC,MAAMK,CAAC,GAAGF,CAAC,GAAGF,IAAI,CAACK,GAAG,CAACN,CAAC,GAAG,CAAC,CAAC;EAE7B,MAAMO,CAAC,GAAGJ,CAAC,GAAGF,IAAI,CAACO,GAAG,CAACR,CAAC,GAAG,CAAC,CAAC;EAE7B,MAAMS,CAAC,GAAGR,IAAI,CAACS,EAAE,GAAG,CAAC,GAAGV,CAAC;EAEzB,MAAMW,CAAC,GAAGhB,YAAY,GAAGM,IAAI,CAACG,GAAG,CAACK,CAAC,CAAC;EAEpC,MAAMG,CAAC,GAAGD,CAAC,GAAGV,IAAI,CAACK,GAAG,CAACN,CAAC,GAAG,CAAC,CAAC;EAE7B,MAAMa,CAAC,GAAGF,CAAC,GAAGV,IAAI,CAACO,GAAG,CAACR,CAAC,GAAG,CAAC,CAAC;EAE7B,oBACIZ,IAAA;IACIG,GAAG,EAAEA,GAAI;IACTK,SAAS,EAAEd,IAAI,CACXE,GAAI;AACpB;AACA;AACA;AACA,iBAAiB,EACDY,SACJ,CAAE;IACFC,KAAK,EAAEX,oBAAoB,CACvB;MACI4B,KAAK,EAAE7B,EAAE,CAACQ,MAAM,CAAC;MACjBC,MAAM,EAAET,EAAE,CAACS,MAAM,CAAC;MAClBqB,OAAO,EAAG,WAAUhB,IAAI,GAAGY,CAAE,IAAG,CAAE,OAAMhB,YAAa,IAAGA,YAAa,UAASI,IAAI,GAAGa,CAAE,IAAGC,CAAE,MAAKR,CAAE,IAAGX,MAAM,GAAGa,CAAE,MAAKZ,YAAa,IAAGA,YAAa,UAASQ,CAAE,IAAGT,MAAO,MAAKD,MAAM,GAAGU,CAAE,IAAGT,MAAO,MAAKC,YAAa,IAAGA,YAAa,UAASF,MAAM,GAAGY,CAAE,IAAGX,MAAM,GAAGa,CAAE,MAAKf,GAAG,GAAGO,IAAI,GAAGa,CAAE,IAAGC,CAAE,MAAKlB,YAAa,IAAGA,YAAa,UAASH,GAAG,GAAGO,IAAI,GAAGY,CAAE,IAAG,CAAE;IAClW,CAAC,EACDd,KACJ,CAAE;IAAA,GACEC;EAAI,CACX,CAAC;AAEV,CAAC,CAAC"}
+{"version":3,"names":["clsx","forwardRef","css","px","transformCSSVariable","jsx","_jsx","Trapezium","props","ref","top","bottom","height","borderRadius","className","style","rest","diff","a","Math","atan","b","tan","c","cos","d","sin","e","PI","f","g","h","width","clipath"],"sources":["../../../src/components/Trapezium.tsx"],"sourcesContent":["\"use client\"\n\nimport { clsx } from \"deepsea-tools\"\nimport { HTMLAttributes, forwardRef } from \"react\"\n\nimport { css } from \"@emotion/css\"\nimport { px, transformCSSVariable } from \"../utils\"\n\nexport interface TrapeziumProps extends HTMLAttributes<HTMLDivElement> {\n    top: number\n    bottom: number\n    height: number\n    borderRadius: number\n}\n\n/** 梯形组件 */\nexport const Trapezium = forwardRef<HTMLDivElement, TrapeziumProps>((props, ref) => {\n    const { top, bottom, height, borderRadius, className, style, ...rest } = props\n\n    const diff = (bottom - top) / 2\n\n    const a = Math.atan(height / diff) / 2\n\n    const b = borderRadius / Math.tan(a)\n\n    const c = b * Math.cos(a * 2)\n\n    const d = b * Math.sin(a * 2)\n\n    const e = Math.PI / 2 - a\n\n    const f = borderRadius / Math.tan(e)\n\n    const g = f * Math.cos(a * 2)\n\n    const h = f * Math.sin(a * 2)\n\n    return (\n        <div\n            ref={ref}\n            className={clsx(\n                css`\n                    width: var(--width);\n                    height: var(--height);\n                    clip-path: var(--clip-path);\n                `,\n                className,\n            )}\n            style={transformCSSVariable(\n                {\n                    width: px(bottom),\n                    height: px(height),\n                    clipath: `path(\"M ${diff + f} ${0}  A ${borderRadius} ${borderRadius} 0 0 0 ${diff - g} ${h} L ${c} ${height - d} A ${borderRadius} ${borderRadius} 0 0 0 ${b} ${height} L ${bottom - b} ${height} A ${borderRadius} ${borderRadius} 0 0 0 ${bottom - c} ${height - d} L ${top + diff + g} ${h} A ${borderRadius} ${borderRadius} 0 0 0 ${top + diff - f} ${0} Z\")`,\n                },\n                style,\n            )}\n            {...rest}\n        />\n    )\n})\n"],"mappings":"AAAA,YAAY;;AAEZ,SAASA,IAAI,QAAQ,eAAe;AACpC,SAAyBC,UAAU,QAAQ,OAAO;AAElD,SAASC,GAAG,QAAQ,cAAc;AAClC,SAASC,EAAE,EAAEC,oBAAoB;AAAkB,SAAAC,GAAA,IAAAC,IAAA;AASnD;AACA,OAAO,MAAMC,SAAS,gBAAGN,UAAU,CAAiC,CAACO,KAAK,EAAEC,GAAG,KAAK;EAChF,MAAM;IAAEC,GAAG;IAAEC,MAAM;IAAEC,MAAM;IAAEC,YAAY;IAAEC,SAAS;IAAEC,KAAK;IAAE,GAAGC;EAAK,CAAC,GAAGR,KAAK;EAE9E,MAAMS,IAAI,GAAG,CAACN,MAAM,GAAGD,GAAG,IAAI,CAAC;EAE/B,MAAMQ,CAAC,GAAGC,IAAI,CAACC,IAAI,CAACR,MAAM,GAAGK,IAAI,CAAC,GAAG,CAAC;EAEtC,MAAMI,CAAC,GAAGR,YAAY,GAAGM,IAAI,CAACG,GAAG,CAACJ,CAAC,CAAC;EAEpC,MAAMK,CAAC,GAAGF,CAAC,GAAGF,IAAI,CAACK,GAAG,CAACN,CAAC,GAAG,CAAC,CAAC;EAE7B,MAAMO,CAAC,GAAGJ,CAAC,GAAGF,IAAI,CAACO,GAAG,CAACR,CAAC,GAAG,CAAC,CAAC;EAE7B,MAAMS,CAAC,GAAGR,IAAI,CAACS,EAAE,GAAG,CAAC,GAAGV,CAAC;EAEzB,MAAMW,CAAC,GAAGhB,YAAY,GAAGM,IAAI,CAACG,GAAG,CAACK,CAAC,CAAC;EAEpC,MAAMG,CAAC,GAAGD,CAAC,GAAGV,IAAI,CAACK,GAAG,CAACN,CAAC,GAAG,CAAC,CAAC;EAE7B,MAAMa,CAAC,GAAGF,CAAC,GAAGV,IAAI,CAACO,GAAG,CAACR,CAAC,GAAG,CAAC,CAAC;EAE7B,oBACIZ,IAAA;IACIG,GAAG,EAAEA,GAAI;IACTK,SAAS,EAAEd,IAAI,CACXE,GAAI;AACpB;AACA;AACA;AACA,iBAAiB,EACDY,SACJ,CAAE;IACFC,KAAK,EAAEX,oBAAoB,CACvB;MACI4B,KAAK,EAAE7B,EAAE,CAACQ,MAAM,CAAC;MACjBC,MAAM,EAAET,EAAE,CAACS,MAAM,CAAC;MAClBqB,OAAO,EAAG,WAAUhB,IAAI,GAAGY,CAAE,IAAG,CAAE,OAAMhB,YAAa,IAAGA,YAAa,UAASI,IAAI,GAAGa,CAAE,IAAGC,CAAE,MAAKR,CAAE,IAAGX,MAAM,GAAGa,CAAE,MAAKZ,YAAa,IAAGA,YAAa,UAASQ,CAAE,IAAGT,MAAO,MAAKD,MAAM,GAAGU,CAAE,IAAGT,MAAO,MAAKC,YAAa,IAAGA,YAAa,UAASF,MAAM,GAAGY,CAAE,IAAGX,MAAM,GAAGa,CAAE,MAAKf,GAAG,GAAGO,IAAI,GAAGa,CAAE,IAAGC,CAAE,MAAKlB,YAAa,IAAGA,YAAa,UAASH,GAAG,GAAGO,IAAI,GAAGY,CAAE,IAAG,CAAE;IAClW,CAAC,EACDd,KACJ,CAAE;IAAA,GACEC;EAAI,CACX,CAAC;AAEV,CAAC,CAAC"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "deepsea-components",
-  "version": "5.7.7",
+  "version": "5.7.9",
   "description": "格数科技自用组件库",
   "main": "dist/cjs/index.js",
   "module": "dist/esm/index.js",

package/src/components/CircleText.tsx

@@ -1,3 +1,5 @@
+"use client"
+
 import { FC, Fragment, HTMLAttributes } from "react"
 
 export interface CircleTextProps extends Omit<HTMLAttributes<HTMLSpanElement>, "children"> {

package/src/components/FormLabel.tsx

@@ -1,9 +1,8 @@
-import { clsx } from "deepsea-tools"
-import { ComponentPropsWithoutRef, FC, Fragment } from "react"
+"use client"
 
-import { css } from "@emotion/css"
+import { ComponentPropsWithoutRef, FC, Fragment, ReactNode, createContext, useContext } from "react"
 
-export type FormLabelProps = ComponentPropsWithoutRef<"div"> & {
+export type FormLabelConfig = {
     /**
      * Label 的宽度.
      */
@@ -11,25 +10,32 @@ export type FormLabelProps = ComponentPropsWithoutRef<"div"> & {
     /**
      * 是否在 Label 前面添加一个空白区域，只有当前 Label 为非必选，而存在其他 Label 为必选的时候开启
      */
-    before?: boolean
+    before?: boolean | number
 }
 
+export type FormLabelProps = ComponentPropsWithoutRef<"div"> & FormLabelConfig
+
+export const FormLabelConfigContext = createContext<Partial<FormLabelConfig>>({})
+
+export type FormLabelConfigProviderProps = FormLabelConfig & {
+    children?: ReactNode
+}
+
+export const FormLabelConfigProvider: FC<FormLabelConfigProviderProps> = ({ width, before, children }) => (
+    <FormLabelConfigContext.Provider value={{ width, before }}>{children}</FormLabelConfigContext.Provider>
+)
+
 /**
  * 为 Ant Design 的 FormItem 设计的 Label 组件
  */
-export const FormLabel: FC<FormLabelProps> = ({ className, style, before, width, ...rest }) => (
-    <Fragment>
-        {!!before && <div style={{ width: 11 }}>&ensp;</div>}
-        <div
-            className={clsx(
-                css`
-                    text-align: justify;
-                    text-align-last: justify;
-                `,
-                className,
-            )}
-            style={{ width, ...style }}
-            {...rest}
-        />
-    </Fragment>
-)
+export const FormLabel: FC<FormLabelProps> = props => {
+    const { width: _width, before: _before } = useContext(FormLabelConfigContext)
+    const { style, width = _width, before = _before, ...rest } = props
+
+    return (
+        <Fragment>
+            {!!before && <div style={{ width: 11, color: "transparent" }}>&ensp;</div>}
+            <div style={{ width, textAlign: "justify", textAlignLast: "justify", ...style }} {...rest} />
+        </Fragment>
+    )
+}

package/src/components/Ring.tsx

@@ -1,3 +1,5 @@
+"use client"
+
 import { HTMLAttributes, forwardRef } from "react"
 
 export interface RingProps extends HTMLAttributes<HTMLDivElement> {

package/src/components/Skeleton.tsx

@@ -1,3 +1,5 @@
+"use client"
+
 import { clsx } from "deepsea-tools"
 import { HTMLAttributes, forwardRef } from "react"
 

package/src/components/Trapezium.tsx

@@ -1,3 +1,5 @@
+"use client"
+
 import { clsx } from "deepsea-tools"
 import { HTMLAttributes, forwardRef } from "react"