@anker-in/headless-ui 0.0.27-alpha.4 → 0.0.27-alpha.6

package/dist/cjs/biz-components/HeroBanner/HeroBanner.js

@@ -1,2 +1,2 @@
-"use strict";var w=Object.create;var m=Object.defineProperty;var u=Object.getOwnPropertyDescriptor;var y=Object.getOwnPropertyNames;var D=Object.getPrototypeOf,F=Object.prototype.hasOwnProperty;var H=(e,a)=>{for(var r in a)m(e,r,{get:a[r],enumerable:!0})},g=(e,a,r,l)=>{if(a&&typeof a=="object"||typeof a=="function")for(let n of y(a))!F.call(e,n)&&n!==r&&m(e,n,{get:()=>a[n],enumerable:!(l=u(a,n))||l.enumerable});return e};var z=(e,a,r)=>(r=e!=null?w(D(e)):{},g(a||!e||!e.__esModule?m(r,"default",{value:e,enumerable:!0}):r,e)),C=e=>g(m({},"__esModule",{value:!0}),e);var R={};H(R,{default:()=>B});module.exports=C(R);var t=require("react/jsx-runtime"),x=z(require("react")),s=require("../../components/index.js"),o=require("../../helpers/index.js"),f=require("../../shared/Styles.js");const b=x.default.forwardRef(({title:e,subtitle:a,background:r,primaryButton:l,secondaryButton:n,theme:i="light",className:v,products:c=[]},h)=>{const d=i==="dark"?"text-white":"text-[#1D1D1F]",N=i==="dark"?"bg-white":"bg-[#1D1D1F]";return(0,t.jsxs)("div",{ref:h,className:(0,o.cn)("relative flex min-h-[720px] w-full flex-col justify-between overflow-hidden bg-cover bg-center bg-no-repeat",v),style:{backgroundImage:`url(${r})`},children:[(0,t.jsxs)("div",{className:"relative z-10 flex flex-col gap-8 px-32 pt-[307px]",children:[(0,t.jsxs)("div",{className:"max-w-[686px] space-y-4",children:[(0,t.jsx)("h1",{className:(0,o.cn)("hero-banner-title font-mont text-[64px] font-bold leading-none tracking-[-0.04em]",d),children:e}),(0,t.jsx)("p",{className:(0,o.cn)("hero-banner-subtitle text-lg font-medium leading-[1.2] tracking-[-0.02em]",d),children:a})]}),(0,t.jsxs)("div",{className:"flex items-center gap-4",children:[n&&(0,t.jsx)(s.Button,{size:"lg",variant:"nature",theme:i,className:"hero-banner-primary-button",...n,children:n.text}),l&&(0,t.jsx)(s.Button,{size:"lg",variant:"secondary",theme:i,...l,className:"hero-banner-secondary-button bg-transparent border-black text-black hover:bg-black hover:text-white",children:l.text})]})]}),c.length>0&&(0,t.jsx)("div",{className:"relative z-10 flex items-center gap-3 px-32 pb-6",children:c.map((k,p)=>(0,t.jsxs)(x.default.Fragment,{children:[(0,t.jsx)(s.Text,{className:(0,o.cn)("hero-banner-product-text text-sm font-medium leading-[1.2] tracking-[-0.02em]",i==="dark"?"text-white":"text-[#1D1D1F]"),children:k.title}),p<c.length-1&&(0,t.jsx)("div",{className:(0,o.cn)("h-4 w-px",N)})]},p))})]})});b.displayName="HeroBanner";var B=(0,f.withStyles)(b);
+"use strict";var w=Object.create;var m=Object.defineProperty;var u=Object.getOwnPropertyDescriptor;var y=Object.getOwnPropertyNames;var D=Object.getPrototypeOf,F=Object.prototype.hasOwnProperty;var H=(e,a)=>{for(var r in a)m(e,r,{get:a[r],enumerable:!0})},g=(e,a,r,l)=>{if(a&&typeof a=="object"||typeof a=="function")for(let n of y(a))!F.call(e,n)&&n!==r&&m(e,n,{get:()=>a[n],enumerable:!(l=u(a,n))||l.enumerable});return e};var z=(e,a,r)=>(r=e!=null?w(D(e)):{},g(a||!e||!e.__esModule?m(r,"default",{value:e,enumerable:!0}):r,e)),C=e=>g(m({},"__esModule",{value:!0}),e);var R={};H(R,{default:()=>B});module.exports=C(R);var t=require("react/jsx-runtime"),p=z(require("react")),s=require("../../components/index.js"),i=require("../../helpers/index.js"),f=require("../../shared/Styles.js");const b=p.default.forwardRef(({title:e,subtitle:a,background:r,primaryButton:l,secondaryButton:n,theme:o="light",className:v,products:c=[]},h)=>{const x=o==="dark"?"text-white":"text-[#1D1D1F]",N=o==="dark"?"bg-white":"bg-[#1D1D1F]";return(0,t.jsxs)("div",{ref:h,className:(0,i.cn)("relative flex min-h-[720px] w-full flex-col justify-between overflow-hidden bg-cover bg-center bg-no-repeat",v),style:{backgroundImage:`url(${r})`},children:[(0,t.jsxs)("div",{className:"relative z-10 flex flex-col gap-8 px-32 pt-[307px]",children:[(0,t.jsxs)("div",{className:"max-w-[686px] space-y-4",children:[(0,t.jsx)("h1",{className:(0,i.cn)("hero-banner-title font-mont text-[64px] font-bold leading-none tracking-[-0.04em]",x),children:e}),(0,t.jsx)("p",{className:(0,i.cn)("hero-banner-subtitle text-lg font-medium leading-[1.2] tracking-[-0.02em]",x),children:a})]}),(0,t.jsxs)("div",{className:"flex items-center gap-4",children:[n&&(0,t.jsx)(s.Button,{size:"lg",variant:"primary",theme:o,className:"hero-banner-primary-button",...n,children:n.text}),l&&(0,t.jsx)(s.Button,{size:"lg",variant:"secondary",theme:o,...l,className:"hero-banner-secondary-button bg-transparent border-black text-black hover:bg-black hover:text-white",children:l.text})]})]}),c.length>0&&(0,t.jsx)("div",{className:"relative z-10 flex items-center gap-3 px-32 pb-6",children:c.map((k,d)=>(0,t.jsxs)(p.default.Fragment,{children:[(0,t.jsx)(s.Text,{className:(0,i.cn)("hero-banner-product-text text-sm font-medium leading-[1.2] tracking-[-0.02em]",o==="dark"?"text-white":"text-[#1D1D1F]"),children:k.title}),d<c.length-1&&(0,t.jsx)("div",{className:(0,i.cn)("h-4 w-px",N)})]},d))})]})});b.displayName="HeroBanner";var B=(0,f.withStyles)(b);
 //# sourceMappingURL=HeroBanner.js.map

package/dist/cjs/biz-components/HeroBanner/HeroBanner.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../../src/biz-components/HeroBanner/HeroBanner.tsx"],
-  "sourcesContent": ["import React from \"react\"\nimport type { HeroBannerProps } from \"./types.js\"\nimport { Button, Text } from \"../../components/index.js\"\nimport { cn } from \"../../helpers/index.js\"\nimport { withStyles } from \"../../shared/Styles.js\"\n\nconst HeroBanner = React.forwardRef<HTMLDivElement, HeroBannerProps>(\n  ({ \n    title, \n    subtitle, \n    background,\n    primaryButton,\n    secondaryButton,\n    theme = \"light\",\n    className,\n    products = [] \n  }, ref) => {\n    const textColorClass = theme === \"dark\" ? \"text-white\" : \"text-[#1D1D1F]\"\n    const dividerColorClass = theme === \"dark\" ? \"bg-white\" : \"bg-[#1D1D1F]\"\n\n    return (\n      <div \n        ref={ref} \n        className={cn(\n          \"relative flex min-h-[720px] w-full flex-col justify-between overflow-hidden bg-cover bg-center bg-no-repeat\",\n          className\n        )}\n        style={{ backgroundImage: `url(${background})` }}\n      >\n        {/* \u5185\u5BB9\u533A\u57DF */}\n        <div className=\"relative z-10 flex flex-col gap-8 px-32 pt-[307px]\">\n          <div className=\"max-w-[686px] space-y-4\">\n            <h1 className={cn(\n              \"hero-banner-title font-mont text-[64px] font-bold leading-none tracking-[-0.04em]\",\n              textColorClass\n            )}>\n              {title}\n            </h1>\n            <p className={cn(\n              \"hero-banner-subtitle text-lg font-medium leading-[1.2] tracking-[-0.02em]\",\n              textColorClass\n            )}>\n              {subtitle}\n            </p>\n          </div>\n          \n          {/* \u6309\u94AE\u7EC4 */}\n          <div className=\"flex items-center gap-4\">\n            {secondaryButton && (\n              <Button\n                size=\"lg\"\n                variant=\"nature\"\n                theme={theme}\n                className=\"hero-banner-primary-button\"\n                {...secondaryButton}\n              >\n                {secondaryButton.text}\n              </Button>\n            )}\n            {primaryButton && (\n              <Button\n                size=\"lg\"\n                variant=\"secondary\"\n                theme={theme}\n                {...primaryButton}\n                className=\"hero-banner-secondary-button bg-transparent border-black text-black hover:bg-black hover:text-white\"\n              >\n                {primaryButton.text}\n              </Button>\n            )}\n          </div>\n        </div>\n\n        {/* \u5E95\u90E8\u4EA7\u54C1\u5217\u8868 */}\n        {products.length > 0 && (\n          <div className=\"relative z-10 flex items-center gap-3 px-32 pb-6\">\n            {products.map((product, index) => (\n              <React.Fragment key={index}>\n                <Text\n                  className={cn(\n                    \"hero-banner-product-text text-sm font-medium leading-[1.2] tracking-[-0.02em]\",\n                    theme === \"dark\" ? \"text-white\" : \"text-[#1D1D1F]\"\n                  )}\n                >\n                  {product.title}\n                </Text>\n                {index < products.length - 1 && (\n                  <div className={cn(\"h-4 w-px\", dividerColorClass)} />\n                )}\n              </React.Fragment>\n            ))}\n          </div>\n        )}\n      </div>\n    )\n  }\n)\n\nHeroBanner.displayName = \"HeroBanner\"\n\nexport default withStyles(HeroBanner)\n\n\n"],
-  "mappings": "0jBAAA,IAAAA,EAAA,GAAAC,EAAAD,EAAA,aAAAE,IAAA,eAAAC,EAAAH,GA+BU,IAAAI,EAAA,6BA/BVC,EAAkB,oBAElBC,EAA6B,qCAC7BC,EAAmB,kCACnBC,EAA2B,kCAE3B,MAAMC,EAAa,EAAAC,QAAM,WACvB,CAAC,CACC,MAAAC,EACA,SAAAC,EACA,WAAAC,EACA,cAAAC,EACA,gBAAAC,EACA,MAAAC,EAAQ,QACR,UAAAC,EACA,SAAAC,EAAW,CAAC,CACd,EAAGC,IAAQ,CACT,MAAMC,EAAiBJ,IAAU,OAAS,aAAe,iBACnDK,EAAoBL,IAAU,OAAS,WAAa,eAE1D,SACE,QAAC,OACC,IAAKG,EACL,aAAW,MACT,8GACAF,CACF,EACA,MAAO,CAAE,gBAAiB,OAAOJ,CAAU,GAAI,EAG/C,qBAAC,OAAI,UAAU,qDACb,qBAAC,OAAI,UAAU,0BACb,oBAAC,MAAG,aAAW,MACb,oFACAO,CACF,EACG,SAAAT,EACH,KACA,OAAC,KAAE,aAAW,MACZ,4EACAS,CACF,EACG,SAAAR,EACH,GACF,KAGA,QAAC,OAAI,UAAU,0BACZ,UAAAG,MACC,OAAC,UACC,KAAK,KACL,QAAQ,SACR,MAAOC,EACP,UAAU,6BACT,GAAGD,EAEH,SAAAA,EAAgB,KACnB,EAEDD,MACC,OAAC,UACC,KAAK,KACL,QAAQ,YACR,MAAOE,EACN,GAAGF,EACJ,UAAU,sGAET,SAAAA,EAAc,KACjB,GAEJ,GACF,EAGCI,EAAS,OAAS,MACjB,OAAC,OAAI,UAAU,mDACZ,SAAAA,EAAS,IAAI,CAACI,EAASC,OACtB,QAAC,EAAAb,QAAM,SAAN,CACC,oBAAC,QACC,aAAW,MACT,gFACAM,IAAU,OAAS,aAAe,gBACpC,EAEC,SAAAM,EAAQ,MACX,EACCC,EAAQL,EAAS,OAAS,MACzB,OAAC,OAAI,aAAW,MAAG,WAAYG,CAAiB,EAAG,IAVlCE,CAYrB,CACD,EACH,GAEJ,CAEJ,CACF,EAEAd,EAAW,YAAc,aAEzB,IAAOP,KAAQ,cAAWO,CAAU",
+  "sourcesContent": ["import React from \"react\"\nimport type { HeroBannerProps } from \"./types.js\"\nimport { Button, Text } from \"../../components/index.js\"\nimport { cn } from \"../../helpers/index.js\"\nimport { withStyles } from \"../../shared/Styles.js\"\n\nconst HeroBanner = React.forwardRef<HTMLDivElement, HeroBannerProps>(\n  ({ \n    title, \n    subtitle, \n    background,\n    primaryButton,\n    secondaryButton,\n    theme = \"light\",\n    className,\n    products = [] \n  }, ref) => {\n    const textColorClass = theme === \"dark\" ? \"text-white\" : \"text-[#1D1D1F]\"\n    const dividerColorClass = theme === \"dark\" ? \"bg-white\" : \"bg-[#1D1D1F]\"\n\n    return (\n      <div \n        ref={ref} \n        className={cn(\n          \"relative flex min-h-[720px] w-full flex-col justify-between overflow-hidden bg-cover bg-center bg-no-repeat\",\n          className\n        )}\n        style={{ backgroundImage: `url(${background})` }}\n      >\n        {/* \u5185\u5BB9\u533A\u57DF */}\n        <div className=\"relative z-10 flex flex-col gap-8 px-32 pt-[307px]\">\n          <div className=\"max-w-[686px] space-y-4\">\n            <h1 className={cn(\n              \"hero-banner-title font-mont text-[64px] font-bold leading-none tracking-[-0.04em]\",\n              textColorClass\n            )}>\n              {title}\n            </h1>\n            <p className={cn(\n              \"hero-banner-subtitle text-lg font-medium leading-[1.2] tracking-[-0.02em]\",\n              textColorClass\n            )}>\n              {subtitle}\n            </p>\n          </div>\n          \n          {/* \u6309\u94AE\u7EC4 */}\n          <div className=\"flex items-center gap-4\">\n            {secondaryButton && (\n              <Button\n                size=\"lg\"\n                variant=\"primary\"\n                theme={theme}\n                className=\"hero-banner-primary-button\"\n                {...secondaryButton}\n              >\n                {secondaryButton.text}\n              </Button>\n            )}\n            {primaryButton && (\n              <Button\n                size=\"lg\"\n                variant=\"secondary\"\n                theme={theme}\n                {...primaryButton}\n                className=\"hero-banner-secondary-button bg-transparent border-black text-black hover:bg-black hover:text-white\"\n              >\n                {primaryButton.text}\n              </Button>\n            )}\n          </div>\n        </div>\n\n        {/* \u5E95\u90E8\u4EA7\u54C1\u5217\u8868 */}\n        {products.length > 0 && (\n          <div className=\"relative z-10 flex items-center gap-3 px-32 pb-6\">\n            {products.map((product, index) => (\n              <React.Fragment key={index}>\n                <Text\n                  className={cn(\n                    \"hero-banner-product-text text-sm font-medium leading-[1.2] tracking-[-0.02em]\",\n                    theme === \"dark\" ? \"text-white\" : \"text-[#1D1D1F]\"\n                  )}\n                >\n                  {product.title}\n                </Text>\n                {index < products.length - 1 && (\n                  <div className={cn(\"h-4 w-px\", dividerColorClass)} />\n                )}\n              </React.Fragment>\n            ))}\n          </div>\n        )}\n      </div>\n    )\n  }\n)\n\nHeroBanner.displayName = \"HeroBanner\"\n\nexport default withStyles(HeroBanner)\n\n\n"],
+  "mappings": "0jBAAA,IAAAA,EAAA,GAAAC,EAAAD,EAAA,aAAAE,IAAA,eAAAC,EAAAH,GA+BU,IAAAI,EAAA,6BA/BVC,EAAkB,oBAElBC,EAA6B,qCAC7BC,EAAmB,kCACnBC,EAA2B,kCAE3B,MAAMC,EAAa,EAAAC,QAAM,WACvB,CAAC,CACC,MAAAC,EACA,SAAAC,EACA,WAAAC,EACA,cAAAC,EACA,gBAAAC,EACA,MAAAC,EAAQ,QACR,UAAAC,EACA,SAAAC,EAAW,CAAC,CACd,EAAGC,IAAQ,CACT,MAAMC,EAAiBJ,IAAU,OAAS,aAAe,iBACnDK,EAAoBL,IAAU,OAAS,WAAa,eAE1D,SACE,QAAC,OACC,IAAKG,EACL,aAAW,MACT,8GACAF,CACF,EACA,MAAO,CAAE,gBAAiB,OAAOJ,CAAU,GAAI,EAG/C,qBAAC,OAAI,UAAU,qDACb,qBAAC,OAAI,UAAU,0BACb,oBAAC,MAAG,aAAW,MACb,oFACAO,CACF,EACG,SAAAT,EACH,KACA,OAAC,KAAE,aAAW,MACZ,4EACAS,CACF,EACG,SAAAR,EACH,GACF,KAGA,QAAC,OAAI,UAAU,0BACZ,UAAAG,MACC,OAAC,UACC,KAAK,KACL,QAAQ,UACR,MAAOC,EACP,UAAU,6BACT,GAAGD,EAEH,SAAAA,EAAgB,KACnB,EAEDD,MACC,OAAC,UACC,KAAK,KACL,QAAQ,YACR,MAAOE,EACN,GAAGF,EACJ,UAAU,sGAET,SAAAA,EAAc,KACjB,GAEJ,GACF,EAGCI,EAAS,OAAS,MACjB,OAAC,OAAI,UAAU,mDACZ,SAAAA,EAAS,IAAI,CAACI,EAASC,OACtB,QAAC,EAAAb,QAAM,SAAN,CACC,oBAAC,QACC,aAAW,MACT,gFACAM,IAAU,OAAS,aAAe,gBACpC,EAEC,SAAAM,EAAQ,MACX,EACCC,EAAQL,EAAS,OAAS,MACzB,OAAC,OAAI,aAAW,MAAG,WAAYG,CAAiB,EAAG,IAVlCE,CAYrB,CACD,EACH,GAEJ,CAEJ,CACF,EAEAd,EAAW,YAAc,aAEzB,IAAOP,KAAQ,cAAWO,CAAU",
   "names": ["HeroBanner_exports", "__export", "HeroBanner_default", "__toCommonJS", "import_jsx_runtime", "import_react", "import_components", "import_helpers", "import_Styles", "HeroBanner", "React", "title", "subtitle", "background", "primaryButton", "secondaryButton", "theme", "className", "products", "ref", "textColorClass", "dividerColorClass", "product", "index"]
 }

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

@@ -1,7 +1,7 @@
 import * as React from 'react';
 import { type VariantProps } from 'class-variance-authority';
 declare const badgeVariants: (props?: ({
-    size?: "sm" | "base" | null | undefined;
+    size?: "sm" | "lg" | null | undefined;
 } & import("class-variance-authority/dist/types.js").ClassProp) | undefined) => string;
 export interface BadgeProps extends React.HTMLAttributes<HTMLDivElement>, VariantProps<typeof badgeVariants> {
 }

package/dist/cjs/components/badge.js

@@ -1,2 +1,2 @@
-"use strict";var n=Object.defineProperty;var d=Object.getOwnPropertyDescriptor;var m=Object.getOwnPropertyNames;var f=Object.prototype.hasOwnProperty;var x=(e,t)=>{for(var r in t)n(e,r,{get:t[r],enumerable:!0})},c=(e,t,r,s)=>{if(t&&typeof t=="object"||typeof t=="function")for(let a of m(t))!f.call(e,a)&&a!==r&&n(e,a,{get:()=>t[a],enumerable:!(s=d(t,a))||s.enumerable});return e};var b=e=>c(n({},"__esModule",{value:!0}),e);var g={};x(g,{default:()=>y});module.exports=b(g);var p=require("react/jsx-runtime"),v=require("react"),i=require("class-variance-authority"),o=require("../helpers/index.js");const u=(0,i.cva)("inline-flex justify-center text-btn-primary border-btn-primary items-center font-medium rounded-[20px] border px-[10px] py-1 text-xs transition-colors focus:outline-none",{variants:{size:{sm:"text-xs",base:"text-sm"}},defaultVariants:{size:"base"}});function l({className:e,size:t,...r}){return(0,p.jsx)("div",{className:(0,o.cn)(u({size:t}),e),...r})}var y=l;
+"use strict";var i=Object.defineProperty;var x=Object.getOwnPropertyDescriptor;var d=Object.getOwnPropertyNames;var l=Object.prototype.hasOwnProperty;var c=(e,t)=>{for(var r in t)i(e,r,{get:t[r],enumerable:!0})},f=(e,t,r,n)=>{if(t&&typeof t=="object"||typeof t=="function")for(let a of d(t))!l.call(e,a)&&a!==r&&i(e,a,{get:()=>t[a],enumerable:!(n=x(t,a))||n.enumerable});return e};var m=e=>f(i({},"__esModule",{value:!0}),e);var y={};c(y,{default:()=>u});module.exports=m(y);var s=require("react/jsx-runtime"),v=require("react"),o=require("class-variance-authority"),p=require("../helpers/index.js");const g=(0,o.cva)("inline-flex justify-center rounded-[16px] font-bold text-btn-primary border-btn-primary border-[1.6px] items-center text-xs transition-colors focus:outline-none backdrop-blur-sm",{variants:{size:{sm:"px-[6px] py-[4px] text-[14px] leading-tight",lg:"px-[8px] py-[4px] text-[16px] leading-tight"}},defaultVariants:{size:"lg"}});function b({className:e,size:t,...r}){return(0,s.jsx)("div",{className:(0,p.cn)(g({size:t}),e),...r})}var u=b;
 //# sourceMappingURL=badge.js.map

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

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../src/components/badge.tsx"],
-  "sourcesContent": ["import * as React from 'react'\nimport { type VariantProps, cva } from 'class-variance-authority'\n\nimport { cn } from '../helpers/index.js'\n\nconst badgeVariants = cva(\n  'inline-flex justify-center text-btn-primary border-btn-primary items-center font-medium rounded-[20px] border px-[10px] py-1 text-xs transition-colors focus:outline-none',\n  {\n    variants: {\n      size: {\n        sm: 'text-xs',\n        base: 'text-sm',\n      }\n    },\n    defaultVariants: {\n      size: 'base',\n    },\n  }\n)\n\nexport interface BadgeProps extends React.HTMLAttributes<HTMLDivElement>, VariantProps<typeof badgeVariants> { }\n\nfunction Badge({ className, size, ...props }: BadgeProps) {\n  return <div className={cn(badgeVariants({ size }), className)} {...props} />\n}\n\nexport default Badge\n"],
-  "mappings": "yaAAA,IAAAA,EAAA,GAAAC,EAAAD,EAAA,aAAAE,IAAA,eAAAC,EAAAH,GAuBS,IAAAI,EAAA,6BAvBTC,EAAuB,iBACvBC,EAAuC,oCAEvCC,EAAmB,+BAEnB,MAAMC,KAAgB,OACpB,4KACA,CACE,SAAU,CACR,KAAM,CACJ,GAAI,UACJ,KAAM,SACR,CACF,EACA,gBAAiB,CACf,KAAM,MACR,CACF,CACF,EAIA,SAASC,EAAM,CAAE,UAAAC,EAAW,KAAAC,EAAM,GAAGC,CAAM,EAAe,CACxD,SAAO,OAAC,OAAI,aAAW,MAAGJ,EAAc,CAAE,KAAAG,CAAK,CAAC,EAAGD,CAAS,EAAI,GAAGE,EAAO,CAC5E,CAEA,IAAOV,EAAQO",
+  "sourcesContent": ["import * as React from 'react'\nimport { type VariantProps, cva } from 'class-variance-authority'\n\nimport { cn } from '../helpers/index.js'\n\nconst badgeVariants = cva(\n  'inline-flex justify-center rounded-[16px] font-bold text-btn-primary border-btn-primary border-[1.6px] items-center text-xs transition-colors focus:outline-none backdrop-blur-sm',\n  {\n    variants: {\n      size: {\n        sm: 'px-[6px] py-[4px] text-[14px] leading-tight',\n        lg: 'px-[8px] py-[4px] text-[16px] leading-tight',\n      }\n    },\n    defaultVariants: {\n      size: 'lg',\n    },\n  }\n)\n\nexport interface BadgeProps extends React.HTMLAttributes<HTMLDivElement>, VariantProps<typeof badgeVariants> { }\n\nfunction Badge({ className, size, ...props }: BadgeProps) {\n  return <div className={cn(badgeVariants({ size }), className)} {...props} />\n}\n\nexport default Badge\n"],
+  "mappings": "yaAAA,IAAAA,EAAA,GAAAC,EAAAD,EAAA,aAAAE,IAAA,eAAAC,EAAAH,GAuBS,IAAAI,EAAA,6BAvBTC,EAAuB,iBACvBC,EAAuC,oCAEvCC,EAAmB,+BAEnB,MAAMC,KAAgB,OACpB,oLACA,CACE,SAAU,CACR,KAAM,CACJ,GAAI,8CACJ,GAAI,6CACN,CACF,EACA,gBAAiB,CACf,KAAM,IACR,CACF,CACF,EAIA,SAASC,EAAM,CAAE,UAAAC,EAAW,KAAAC,EAAM,GAAGC,CAAM,EAAe,CACxD,SAAO,OAAC,OAAI,aAAW,MAAGJ,EAAc,CAAE,KAAAG,CAAK,CAAC,EAAGD,CAAS,EAAI,GAAGE,EAAO,CAC5E,CAEA,IAAOV,EAAQO",
   "names": ["badge_exports", "__export", "badge_default", "__toCommonJS", "import_jsx_runtime", "React", "import_class_variance_authority", "import_helpers", "badgeVariants", "Badge", "className", "size", "props"]
 }

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

@@ -4,7 +4,7 @@ import { type VariantProps } from 'class-variance-authority';
  * Button Variants
  */
 declare const buttonVariants: (props?: ({
-    variant?: "link" | "nature" | "primary" | "secondary" | "ghost" | null | undefined;
+    variant?: "link" | "primary" | "secondary" | "ghost" | null | undefined;
     size?: "sm" | "base" | "lg" | "icon" | null | undefined;
     hoverEffect?: "none" | "slide" | null | undefined;
     state?: "default" | "disabled" | "loading" | null | undefined;

package/dist/cjs/components/button.js

@@ -1,2 +1,2 @@
-"use strict";"use client";var V=Object.create;var i=Object.defineProperty;var B=Object.getOwnPropertyDescriptor;var z=Object.getOwnPropertyNames;var w=Object.getPrototypeOf,E=Object.prototype.hasOwnProperty;var H=(e,t)=>{for(var r in t)i(e,r,{get:t[r],enumerable:!0})},f=(e,t,r,o)=>{if(t&&typeof t=="object"||typeof t=="function")for(let n of z(t))!E.call(e,n)&&n!==r&&i(e,n,{get:()=>t[n],enumerable:!(o=B(t,n))||o.enumerable});return e};var p=(e,t,r)=>(r=e!=null?V(w(e)):{},f(t||!e||!e.__esModule?i(r,"default",{value:e,enumerable:!0}):r,e)),N=e=>f(i({},"__esModule",{value:!0}),e);var M={};H(M,{default:()=>L});module.exports=N(M);var a=require("react/jsx-runtime"),P=p(require("react")),u=require("@radix-ui/react-slot"),m=require("@radix-ui/react-visually-hidden"),d=require("class-variance-authority"),y=p(require("../icons/spinner.js")),g=require("../helpers/index.js");const R=(0,d.cva)("ring-offset-background focus-visible:ring-ring rounded-btn inline-flex items-center justify-center text-sm font-medium transition-colors focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-offset-2 disabled:pointer-events-none",{variants:{variant:{nature:"border border-solid border-black",primary:"bg-btn-primary text-btn-primary-foreground hover:bg-btn-primary-active",secondary:"bg-btn-secondary text-btn-secondary-foreground hover:bg-btn-secondary-active hover:text-btn-secondary border border-solid",link:"text-primary underline-offset-4 hover:underline",ghost:"hover:bg-btn-primary hover:text-btn-primary-foreground"},size:{sm:"px-3 py-2 text-[12px]  leading-tight",base:"px-5 pt-[11px] pb-[10px] text-[14px]  leading-tight",lg:"px-7 pt-[15px] pb-[14px] text-[16px]  leading-tight",icon:"size-10 rounded-full  leading-tight"},hoverEffect:{none:"",slide:""},state:{default:"",disabled:"",loading:""},theme:{dark:"",light:""}},compoundVariants:[{variant:"primary",hoverEffect:"slide",class:'z-[1] before:-z-[1] before:rounded-btn hover:!bg-btn-primary before:bg-btn-primary-active relative overflow-hidden before:absolute before:inset-y-0  before:w-full before:-translate-x-full before:transition-transform before:duration-300 before:ease-in-out before:content-[""] hover:before:translate-x-0'},{variant:"secondary",hoverEffect:"slide",class:'z-[1] before:-z-[1] before:rounded-btn hover:!bg-btn-secondary before:bg-btn-secondary-active relative overflow-hidden before:absolute before:inset-y-0  before:w-full before:-translate-x-full before:transition-transform before:duration-300 before:ease-in-out before:content-[""] hover:before:translate-x-0'},{variant:"primary",state:"loading",class:"bg-btn-primary"},{variant:"secondary",state:"loading",class:"bg-btn-secondary disabled:bg-btn-secondary-disabled disabled:text-btn-secondary-disabled-foreground"},{variant:"primary",state:"disabled",class:"disabled:bg-btn-primary-disabled disabled:text-btn-primary-disabled-foreground"},{variant:"secondary",state:"disabled",class:"disabled:bg-btn-secondary-disabled disabled:text-btn-secondary-disabled-foreground"},{variant:"nature",theme:"dark",class:"bg-transparent text-info-primary"},{variant:"nature",theme:"light",class:"bg-info-primary text-info-white"}],defaultVariants:{variant:"primary",size:"base",hoverEffect:"none",state:"default",theme:"light"}}),C=(0,d.cva)("",{variants:{variant:{nature:"stroke-btn-primary-foreground",primary:"stroke-btn-primary-foreground",secondary:"stroke-btn-secondary-foreground",link:"stroke-primary",ghost:"stroke-primary"}},defaultVariants:{variant:"primary"}}),c=P.forwardRef(({asChild:e=!1,size:t="base",children:r,variant:o,theme:n="light",hoverEffect:v="none",className:h,disabled:b=!1,loading:s=!1,spinner:l,...x},k)=>(0,a.jsx)(e?u.Slot:"button",{disabled:b||s,className:(0,g.cn)(R({variant:o,size:t,hoverEffect:v,state:s?"loading":b?"disabled":"default",theme:n}),h),ref:k,...x,children:s?(0,a.jsxs)(a.Fragment,{children:[(0,a.jsx)("span",{style:{display:"contents",visibility:"hidden"},"aria-hidden":!0,children:r}),(0,a.jsx)("span",{className:"absolute",children:l||(0,a.jsx)(y.default,{className:C({variant:o})})}),(0,a.jsx)(m.VisuallyHidden,{children:r})]}):r}));c.displayName="Button";var L=c;
+"use strict";"use client";var w=Object.create;var i=Object.defineProperty;var V=Object.getOwnPropertyDescriptor;var B=Object.getOwnPropertyNames;var z=Object.getPrototypeOf,E=Object.prototype.hasOwnProperty;var H=(e,t)=>{for(var r in t)i(e,r,{get:t[r],enumerable:!0})},f=(e,t,r,o)=>{if(t&&typeof t=="object"||typeof t=="function")for(let n of B(t))!E.call(e,n)&&n!==r&&i(e,n,{get:()=>t[n],enumerable:!(o=V(t,n))||o.enumerable});return e};var c=(e,t,r)=>(r=e!=null?w(z(e)):{},f(t||!e||!e.__esModule?i(r,"default",{value:e,enumerable:!0}):r,e)),N=e=>f(i({},"__esModule",{value:!0}),e);var M={};H(M,{default:()=>L});module.exports=N(M);var a=require("react/jsx-runtime"),P=c(require("react")),m=require("@radix-ui/react-slot"),y=require("@radix-ui/react-visually-hidden"),d=require("class-variance-authority"),v=c(require("../icons/spinner.js")),g=require("../helpers/index.js");const R=(0,d.cva)("ring-offset-background border-[1.6px] border-solid focus-visible:ring-ring rounded-btn inline-flex items-center justify-center text-sm font-medium transition-colors focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-offset-2 disabled:pointer-events-none",{variants:{variant:{primary:"bg-btn-primary text-btn-primary-foreground hover:bg-btn-primary-active",secondary:"bg-btn-secondary border-info-primary text-btn-secondary-foreground hover:bg-btn-secondary-active hover:text-btn-secondary border border-solid",link:"text-info-primary underline-offset-4 hover:underline border-none hover:text-btn-primary-active",ghost:"hover:bg-btn-primary hover:text-btn-primary-foreground"},size:{sm:"px-3 py-2 text-[12px]  leading-tight",base:"px-5 pt-[11px] pb-[10px] text-[14px] leading-tight",lg:"px-7 pt-[15px] pb-[14px] text-[16px]  leading-tight",icon:"size-10 rounded-full  leading-tight"},hoverEffect:{none:"",slide:""},state:{default:"",disabled:"",loading:""},theme:{dark:"",light:""}},compoundVariants:[{variant:"primary",hoverEffect:"slide",class:'z-[1] before:-z-[1] before:rounded-btn hover:!bg-btn-primary before:bg-btn-primary-active relative overflow-hidden before:absolute before:inset-y-0 before:w-full before:-translate-x-full before:transition-transform before:duration-300 before:ease-in-out before:content-[""] hover:before:translate-x-0'},{variant:"secondary",hoverEffect:"slide",class:'z-[1] before:-z-[1] before:rounded-btn hover:!bg-btn-secondary before:bg-btn-secondary-active relative overflow-hidden before:absolute before:inset-y-0  before:w-full before:-translate-x-full before:transition-transform before:duration-300 before:ease-in-out before:content-[""] hover:before:translate-x-0'},{variant:"primary",state:"loading",class:"bg-btn-primary-active"},{variant:"secondary",state:"loading",class:"bg-btn-secondary disabled:bg-btn-secondary-disabled disabled:text-btn-secondary-disabled-foreground"},{variant:"primary",state:"disabled",class:"disabled:bg-btn-primary-disabled disabled:text-btn-primary-disabled-foreground"},{variant:"secondary",state:"disabled",class:"disabled:bg-btn-secondary-disabled disabled:text-btn-secondary-disabled-foreground disabled:border-btn-secondary-disabled-border"},{variant:"secondary",theme:"dark",class:"text-info-white bg-info-primary hover:border-info-white hover:text-info-primary hover:bg-info-white"},{variant:"secondary",theme:"dark",state:"loading",class:"bg-btn-info-white text-info-primary border-info-white"},{variant:"secondary",theme:"dark",state:"disabled",class:"disabled:bg-text-info-quaternary disabled:text-info-white"},{variant:"link",state:"disabled",class:"disabled:text-info-quaternary"},{variant:"primary",theme:"dark",class:"text-info-primary hover:text-info-white bg-info-white hover:border-brand-0"},{variant:"primary",theme:"dark",state:"loading",class:"bg-btn-primary-active text-info-white border-brand-0"},{variant:"secondary",theme:"dark",class:"border-info-white"},{variant:"secondary",theme:"light",class:""},{variant:"link",theme:"dark",class:"text-info-white"}],defaultVariants:{variant:"primary",size:"base",hoverEffect:"none",state:"default",theme:"light"}}),C=(0,d.cva)("",{variants:{variant:{primary:"stroke-btn-primary-foreground",secondary:"stroke-btn-secondary-foreground",link:"stroke-primary",ghost:"stroke-primary"},theme:{dark:"",light:""}},defaultVariants:{variant:"primary",theme:"light"}}),p=P.forwardRef(({asChild:e=!1,size:t="base",children:r,variant:o,theme:n="light",hoverEffect:u="none",className:h,disabled:b=!1,loading:s=!1,spinner:l,...x},k)=>(0,a.jsx)(e?m.Slot:"button",{disabled:b||s,className:(0,g.cn)(R({variant:o,size:t,hoverEffect:u,state:s?"loading":b?"disabled":"default",theme:n}),h),ref:k,...x,children:s?(0,a.jsxs)(a.Fragment,{children:[(0,a.jsx)("span",{style:{display:"contents",visibility:"hidden"},"aria-hidden":!0,children:r}),(0,a.jsx)("span",{className:"absolute",children:l||(0,a.jsx)(v.default,{className:C({variant:o,theme:n})})}),(0,a.jsx)(y.VisuallyHidden,{children:r})]}):r}));p.displayName="Button";var L=p;
 //# sourceMappingURL=button.js.map

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

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../src/components/button.tsx"],
-  "sourcesContent": ["'use client'\n\nimport * as React from 'react'\nimport { Slot } from '@radix-ui/react-slot'\nimport { VisuallyHidden } from '@radix-ui/react-visually-hidden'\nimport { type VariantProps, cva } from 'class-variance-authority'\nimport Spinner from '../icons/spinner.js'\nimport { cn } from '../helpers/index.js'\n\n/**\n * Button Variants\n */\nconst buttonVariants = cva(\n  'ring-offset-background focus-visible:ring-ring rounded-btn inline-flex items-center justify-center text-sm font-medium transition-colors focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-offset-2 disabled:pointer-events-none',\n  {\n    variants: {\n      variant: {\n        nature: 'border border-solid border-black',\n        primary: 'bg-btn-primary text-btn-primary-foreground hover:bg-btn-primary-active',\n        secondary:\n          'bg-btn-secondary text-btn-secondary-foreground hover:bg-btn-secondary-active hover:text-btn-secondary border border-solid',\n        link: 'text-primary underline-offset-4 hover:underline',\n        ghost: 'hover:bg-btn-primary hover:text-btn-primary-foreground',\n      },\n      size: {\n        sm: 'px-3 py-2 text-[12px]  leading-tight',\n        base: 'px-5 pt-[11px] pb-[10px] text-[14px]  leading-tight',\n        lg: 'px-7 pt-[15px] pb-[14px] text-[16px]  leading-tight',\n        icon: 'size-10 rounded-full  leading-tight',\n      },\n      /** hover \u72B6\u6001\u4E0B\u7684\u52A8\u753B\u6548\u679C,\u9700\u8981\u6CE8\u610F\u4E0D\u540Cvariant \u4E0B\u7684\u6548\u679C */\n      hoverEffect: {\n        none: '',\n        slide: '',\n      },\n      state: {\n        default: '',\n        disabled: '',\n        loading: '',\n      },\n      theme: {\n        dark: '',\n        light: '',\n      },\n    },\n    compoundVariants: [\n      {\n        variant: 'primary',\n        hoverEffect: 'slide',\n        class:\n          'z-[1] before:-z-[1] before:rounded-btn hover:!bg-btn-primary before:bg-btn-primary-active relative overflow-hidden before:absolute before:inset-y-0  before:w-full before:-translate-x-full before:transition-transform before:duration-300 before:ease-in-out before:content-[\"\"] hover:before:translate-x-0',\n      },\n      {\n        variant: 'secondary',\n        hoverEffect: 'slide',\n        class:\n          'z-[1] before:-z-[1] before:rounded-btn hover:!bg-btn-secondary before:bg-btn-secondary-active relative overflow-hidden before:absolute before:inset-y-0  before:w-full before:-translate-x-full before:transition-transform before:duration-300 before:ease-in-out before:content-[\"\"] hover:before:translate-x-0',\n      },\n      {\n        variant: 'primary',\n        state: 'loading',\n        class: 'bg-btn-primary',\n      },\n      {\n        variant: 'secondary',\n        state: 'loading',\n        class: 'bg-btn-secondary disabled:bg-btn-secondary-disabled disabled:text-btn-secondary-disabled-foreground',\n      },\n      {\n        variant: 'primary',\n        state: 'disabled',\n        class: 'disabled:bg-btn-primary-disabled disabled:text-btn-primary-disabled-foreground',\n      },\n      {\n        variant: 'secondary',\n        state: 'disabled',\n        class: 'disabled:bg-btn-secondary-disabled disabled:text-btn-secondary-disabled-foreground',\n      },\n      {\n        variant: 'nature',\n        theme: 'dark',\n        class: 'bg-transparent text-info-primary',\n      },\n      {\n        variant: 'nature',\n        theme: 'light',\n        class: 'bg-info-primary text-info-white',\n      },\n    ],\n    defaultVariants: {\n      variant: 'primary',\n      size: 'base',\n      hoverEffect: 'none',\n      state: 'default',\n      theme: 'light',\n    },\n  }\n)\n\nconst loadingSvgVariants = cva('', {\n  variants: {\n    variant: {\n      nature: 'stroke-btn-primary-foreground',\n      primary: 'stroke-btn-primary-foreground',\n      secondary: 'stroke-btn-secondary-foreground',\n      link: 'stroke-primary',\n      ghost: 'stroke-primary',\n    },\n  },\n  defaultVariants: {\n    variant: 'primary',\n  },\n})\n\nexport interface ButtonProps\n  extends React.ButtonHTMLAttributes<HTMLButtonElement>,\n  VariantProps<typeof buttonVariants> {\n  /** \u8BBE\u7F6E\u6309\u94AE\u8F7D\u5165\u72B6\u6001  */\n  loading?: boolean\n  /** \u8BBE\u7F6E\u6309\u94AE\u5931\u6548\u72B6\u6001  */\n  disabled?: boolean\n  /** \u5B9A\u4E49\u81EA\u7EC4\u4EF6\u4F5C\u4E3A\u7236\u7EC4\u4EF6\u7684\u7C7B\u578B\uFF0C \u8BE6\u7EC6\u4F7F\u7528\u65B9\u5F0F\u8BF7\u53C2\u8003radix-ui */\n  asChild?: boolean\n  /** \u81EA\u5B9A\u4E49loading  */\n  spinner?: React.ReactNode\n}\n\nconst Button = React.forwardRef<HTMLButtonElement, ButtonProps>(\n  (\n    {\n      asChild = false,\n      size = 'base',\n      children,\n      variant,\n      theme = 'light',\n      hoverEffect = 'none',\n      className,\n      disabled = false,\n      loading = false,\n      spinner,\n      ...props\n    }: ButtonProps,\n    ref\n  ) => {\n    const Comp = asChild ? Slot : 'button'\n    const isInactive = disabled || loading\n    const state = loading ? 'loading' : disabled ? 'disabled' : 'default'\n\n    return (\n      <Comp\n        disabled={isInactive}\n        className={cn(buttonVariants({ variant, size, hoverEffect, state, theme }), className)}\n        ref={ref}\n        {...props}\n      >\n        {loading ? (\n          <>\n            <span style={{ display: 'contents', visibility: 'hidden' }} aria-hidden>\n              {children}\n            </span>\n            <span className=\"absolute\">\n              {spinner ? (\n                spinner\n              ) : (\n                <Spinner\n                  className={loadingSvgVariants({\n                    variant,\n                  })}\n                />\n              )}\n            </span>\n            <VisuallyHidden>{children}</VisuallyHidden>\n          </>\n        ) : (\n          children\n        )}\n      </Comp>\n    )\n  }\n)\n\nButton.displayName = 'Button'\nexport default Button\n"],
-  "mappings": "ukBAAA,IAAAA,EAAA,GAAAC,EAAAD,EAAA,aAAAE,IAAA,eAAAC,EAAAH,GA4JU,IAAAI,EAAA,6BA1JVC,EAAuB,oBACvBC,EAAqB,gCACrBC,EAA+B,2CAC/BC,EAAuC,oCACvCC,EAAoB,kCACpBC,EAAmB,+BAKnB,MAAMC,KAAiB,OACrB,oPACA,CACE,SAAU,CACR,QAAS,CACP,OAAQ,mCACR,QAAS,yEACT,UACE,4HACF,KAAM,kDACN,MAAO,wDACT,EACA,KAAM,CACJ,GAAI,uCACJ,KAAM,sDACN,GAAI,sDACJ,KAAM,qCACR,EAEA,YAAa,CACX,KAAM,GACN,MAAO,EACT,EACA,MAAO,CACL,QAAS,GACT,SAAU,GACV,QAAS,EACX,EACA,MAAO,CACL,KAAM,GACN,MAAO,EACT,CACF,EACA,iBAAkB,CAChB,CACE,QAAS,UACT,YAAa,QACb,MACE,+SACJ,EACA,CACE,QAAS,YACT,YAAa,QACb,MACE,mTACJ,EACA,CACE,QAAS,UACT,MAAO,UACP,MAAO,gBACT,EACA,CACE,QAAS,YACT,MAAO,UACP,MAAO,qGACT,EACA,CACE,QAAS,UACT,MAAO,WACP,MAAO,gFACT,EACA,CACE,QAAS,YACT,MAAO,WACP,MAAO,oFACT,EACA,CACE,QAAS,SACT,MAAO,OACP,MAAO,kCACT,EACA,CACE,QAAS,SACT,MAAO,QACP,MAAO,iCACT,CACF,EACA,gBAAiB,CACf,QAAS,UACT,KAAM,OACN,YAAa,OACb,MAAO,UACP,MAAO,OACT,CACF,CACF,EAEMC,KAAqB,OAAI,GAAI,CACjC,SAAU,CACR,QAAS,CACP,OAAQ,gCACR,QAAS,gCACT,UAAW,kCACX,KAAM,iBACN,MAAO,gBACT,CACF,EACA,gBAAiB,CACf,QAAS,SACX,CACF,CAAC,EAeKC,EAASR,EAAM,WACnB,CACE,CACE,QAAAS,EAAU,GACV,KAAAC,EAAO,OACP,SAAAC,EACA,QAAAC,EACA,MAAAC,EAAQ,QACR,YAAAC,EAAc,OACd,UAAAC,EACA,SAAAC,EAAW,GACX,QAAAC,EAAU,GACV,QAAAC,EACA,GAAGC,CACL,EACAC,OAOE,OALWX,EAAU,OAAO,SAK3B,CACC,SALeO,GAAYC,EAM3B,aAAW,MAAGX,EAAe,CAAE,QAAAM,EAAS,KAAAF,EAAM,YAAAI,EAAa,MALjDG,EAAU,UAAYD,EAAW,WAAa,UAKU,MAAAH,CAAM,CAAC,EAAGE,CAAS,EACrF,IAAKK,EACJ,GAAGD,EAEH,SAAAF,KACC,oBACE,oBAAC,QAAK,MAAO,CAAE,QAAS,WAAY,WAAY,QAAS,EAAG,cAAW,GACpE,SAAAN,EACH,KACA,OAAC,QAAK,UAAU,WACb,SAAAO,MAGC,OAAC,EAAAG,QAAA,CACC,UAAWd,EAAmB,CAC5B,QAAAK,CACF,CAAC,EACH,EAEJ,KACA,OAAC,kBAAgB,SAAAD,EAAS,GAC5B,EAEAA,EAEJ,CAGN,EAEAH,EAAO,YAAc,SACrB,IAAOX,EAAQW",
+  "sourcesContent": ["'use client'\n\nimport * as React from 'react'\nimport { Slot } from '@radix-ui/react-slot'\nimport { VisuallyHidden } from '@radix-ui/react-visually-hidden'\nimport { type VariantProps, cva } from 'class-variance-authority'\nimport Spinner from '../icons/spinner.js'\nimport { cn } from '../helpers/index.js'\n\n/**\n * Button Variants\n */\nconst buttonVariants = cva(\n  'ring-offset-background border-[1.6px] border-solid focus-visible:ring-ring rounded-btn inline-flex items-center justify-center text-sm font-medium transition-colors focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-offset-2 disabled:pointer-events-none',\n  {\n    variants: {\n      variant: {\n        primary: 'bg-btn-primary text-btn-primary-foreground hover:bg-btn-primary-active',\n        secondary:\n          'bg-btn-secondary border-info-primary text-btn-secondary-foreground hover:bg-btn-secondary-active hover:text-btn-secondary border border-solid',\n        link: 'text-info-primary underline-offset-4 hover:underline border-none hover:text-btn-primary-active',\n        ghost: 'hover:bg-btn-primary hover:text-btn-primary-foreground',\n      },\n      size: {\n        sm: 'px-3 py-2 text-[12px]  leading-tight',\n        base: 'px-5 pt-[11px] pb-[10px] text-[14px] leading-tight',\n        lg: 'px-7 pt-[15px] pb-[14px] text-[16px]  leading-tight',\n        icon: 'size-10 rounded-full  leading-tight',\n      },\n      /** hover \u72B6\u6001\u4E0B\u7684\u52A8\u753B\u6548\u679C,\u9700\u8981\u6CE8\u610F\u4E0D\u540Cvariant \u4E0B\u7684\u6548\u679C */\n      hoverEffect: {\n        none: '',\n        slide: '',\n      },\n      state: {\n        default: '',\n        disabled: '',\n        loading: '',\n      },\n      theme: {\n        dark: '',\n        light: '',\n      },\n    },\n    compoundVariants: [\n      {\n        variant: 'primary',\n        hoverEffect: 'slide',\n        class:\n          'z-[1] before:-z-[1] before:rounded-btn hover:!bg-btn-primary before:bg-btn-primary-active relative overflow-hidden before:absolute before:inset-y-0 before:w-full before:-translate-x-full before:transition-transform before:duration-300 before:ease-in-out before:content-[\"\"] hover:before:translate-x-0',\n      },\n      {\n        variant: 'secondary',\n        hoverEffect: 'slide',\n        class:\n          'z-[1] before:-z-[1] before:rounded-btn hover:!bg-btn-secondary before:bg-btn-secondary-active relative overflow-hidden before:absolute before:inset-y-0  before:w-full before:-translate-x-full before:transition-transform before:duration-300 before:ease-in-out before:content-[\"\"] hover:before:translate-x-0',\n      },\n      {\n        variant: 'primary',\n        state: 'loading',\n        class: 'bg-btn-primary-active',\n      },\n      {\n        variant: 'secondary',\n        state: 'loading',\n        class: 'bg-btn-secondary disabled:bg-btn-secondary-disabled disabled:text-btn-secondary-disabled-foreground',\n      },\n      {\n        variant: 'primary',\n        state: 'disabled',\n        class: 'disabled:bg-btn-primary-disabled disabled:text-btn-primary-disabled-foreground',\n      },\n      {\n        variant: 'secondary',\n        state: 'disabled',\n        class: 'disabled:bg-btn-secondary-disabled disabled:text-btn-secondary-disabled-foreground disabled:border-btn-secondary-disabled-border',\n      },\n      {\n        variant: 'secondary',\n        theme: 'dark',\n        class: 'text-info-white bg-info-primary hover:border-info-white hover:text-info-primary hover:bg-info-white',\n      },\n      {\n        variant: 'secondary',\n        theme: 'dark',\n        state: 'loading',\n        class: 'bg-btn-info-white text-info-primary border-info-white',\n      },\n      {\n        variant: 'secondary',\n        theme: 'dark',\n        state: 'disabled',\n        class: 'disabled:bg-text-info-quaternary disabled:text-info-white',\n      },\n      {\n        variant: 'link',\n        state: 'disabled',\n        class: 'disabled:text-info-quaternary',\n      },\n      {\n        variant: 'primary',\n        theme: 'dark',\n        class: 'text-info-primary hover:text-info-white bg-info-white hover:border-brand-0',\n      },\n      {\n        variant: 'primary',\n        theme: 'dark',\n        state: 'loading',\n        class: 'bg-btn-primary-active text-info-white border-brand-0', \n      },\n      {\n        variant: 'secondary',\n        theme: 'dark',\n        class: 'border-info-white',\n      },\n      {\n        variant: 'secondary',\n        theme: 'light',\n        class: '',\n      },\n      {\n        variant: 'link',\n        theme: 'dark',\n        class: 'text-info-white',\n      },\n    ],\n    defaultVariants: {\n      variant: 'primary',\n      size: 'base',\n      hoverEffect: 'none',\n      state: 'default',\n      theme: 'light',\n    },\n  }\n)\n\nconst loadingSvgVariants = cva('', {\n  variants: {\n    variant: {\n      primary: 'stroke-btn-primary-foreground',\n      secondary: 'stroke-btn-secondary-foreground',\n      link: 'stroke-primary',\n      ghost: 'stroke-primary',\n    },\n    theme: {\n      dark: '',\n      light: '',\n    },\n  },\n  defaultVariants: {\n    variant: 'primary',\n    theme: 'light',\n  },\n})\n\nexport interface ButtonProps\n  extends React.ButtonHTMLAttributes<HTMLButtonElement>,\n  VariantProps<typeof buttonVariants> {\n  /** \u8BBE\u7F6E\u6309\u94AE\u8F7D\u5165\u72B6\u6001  */\n  loading?: boolean\n  /** \u8BBE\u7F6E\u6309\u94AE\u5931\u6548\u72B6\u6001  */\n  disabled?: boolean\n  /** \u5B9A\u4E49\u81EA\u7EC4\u4EF6\u4F5C\u4E3A\u7236\u7EC4\u4EF6\u7684\u7C7B\u578B\uFF0C \u8BE6\u7EC6\u4F7F\u7528\u65B9\u5F0F\u8BF7\u53C2\u8003radix-ui */\n  asChild?: boolean\n  /** \u81EA\u5B9A\u4E49loading  */\n  spinner?: React.ReactNode\n}\n\nconst Button = React.forwardRef<HTMLButtonElement, ButtonProps>(\n  (\n    {\n      asChild = false,\n      size = 'base',\n      children,\n      variant,\n      theme = 'light',\n      hoverEffect = 'none',\n      className,\n      disabled = false,\n      loading = false,\n      spinner,\n      ...props\n    }: ButtonProps,\n    ref\n  ) => {\n    const Comp = asChild ? Slot : 'button'\n    const isInactive = disabled || loading\n    const state = loading ? 'loading' : disabled ? 'disabled' : 'default'\n\n    return (\n      <Comp\n        disabled={isInactive}\n        className={cn(buttonVariants({ variant, size, hoverEffect, state, theme }), className)}\n        ref={ref}\n        {...props}\n      >\n        {loading ? (\n          <>\n            <span style={{ display: 'contents', visibility: 'hidden' }} aria-hidden>\n              {children}\n            </span>\n            <span className=\"absolute\">\n              {spinner ? (\n                spinner\n              ) : (\n                <Spinner\n                  className={loadingSvgVariants({\n                    variant,\n                    theme,\n                  })}\n                />\n              )}\n            </span>\n            <VisuallyHidden>{children}</VisuallyHidden>\n          </>\n        ) : (\n          children\n        )}\n      </Comp>\n    )\n  }\n)\n\nButton.displayName = 'Button'\nexport default Button\n"],
+  "mappings": "ukBAAA,IAAAA,EAAA,GAAAC,EAAAD,EAAA,aAAAE,IAAA,eAAAC,EAAAH,GAqMU,IAAAI,EAAA,6BAnMVC,EAAuB,oBACvBC,EAAqB,gCACrBC,EAA+B,2CAC/BC,EAAuC,oCACvCC,EAAoB,kCACpBC,EAAmB,+BAKnB,MAAMC,KAAiB,OACrB,gRACA,CACE,SAAU,CACR,QAAS,CACP,QAAS,yEACT,UACE,gJACF,KAAM,iGACN,MAAO,wDACT,EACA,KAAM,CACJ,GAAI,uCACJ,KAAM,qDACN,GAAI,sDACJ,KAAM,qCACR,EAEA,YAAa,CACX,KAAM,GACN,MAAO,EACT,EACA,MAAO,CACL,QAAS,GACT,SAAU,GACV,QAAS,EACX,EACA,MAAO,CACL,KAAM,GACN,MAAO,EACT,CACF,EACA,iBAAkB,CAChB,CACE,QAAS,UACT,YAAa,QACb,MACE,8SACJ,EACA,CACE,QAAS,YACT,YAAa,QACb,MACE,mTACJ,EACA,CACE,QAAS,UACT,MAAO,UACP,MAAO,uBACT,EACA,CACE,QAAS,YACT,MAAO,UACP,MAAO,qGACT,EACA,CACE,QAAS,UACT,MAAO,WACP,MAAO,gFACT,EACA,CACE,QAAS,YACT,MAAO,WACP,MAAO,kIACT,EACA,CACE,QAAS,YACT,MAAO,OACP,MAAO,qGACT,EACA,CACE,QAAS,YACT,MAAO,OACP,MAAO,UACP,MAAO,uDACT,EACA,CACE,QAAS,YACT,MAAO,OACP,MAAO,WACP,MAAO,2DACT,EACA,CACE,QAAS,OACT,MAAO,WACP,MAAO,+BACT,EACA,CACE,QAAS,UACT,MAAO,OACP,MAAO,4EACT,EACA,CACE,QAAS,UACT,MAAO,OACP,MAAO,UACP,MAAO,sDACT,EACA,CACE,QAAS,YACT,MAAO,OACP,MAAO,mBACT,EACA,CACE,QAAS,YACT,MAAO,QACP,MAAO,EACT,EACA,CACE,QAAS,OACT,MAAO,OACP,MAAO,iBACT,CACF,EACA,gBAAiB,CACf,QAAS,UACT,KAAM,OACN,YAAa,OACb,MAAO,UACP,MAAO,OACT,CACF,CACF,EAEMC,KAAqB,OAAI,GAAI,CACjC,SAAU,CACR,QAAS,CACP,QAAS,gCACT,UAAW,kCACX,KAAM,iBACN,MAAO,gBACT,EACA,MAAO,CACL,KAAM,GACN,MAAO,EACT,CACF,EACA,gBAAiB,CACf,QAAS,UACT,MAAO,OACT,CACF,CAAC,EAeKC,EAASR,EAAM,WACnB,CACE,CACE,QAAAS,EAAU,GACV,KAAAC,EAAO,OACP,SAAAC,EACA,QAAAC,EACA,MAAAC,EAAQ,QACR,YAAAC,EAAc,OACd,UAAAC,EACA,SAAAC,EAAW,GACX,QAAAC,EAAU,GACV,QAAAC,EACA,GAAGC,CACL,EACAC,OAOE,OALWX,EAAU,OAAO,SAK3B,CACC,SALeO,GAAYC,EAM3B,aAAW,MAAGX,EAAe,CAAE,QAAAM,EAAS,KAAAF,EAAM,YAAAI,EAAa,MALjDG,EAAU,UAAYD,EAAW,WAAa,UAKU,MAAAH,CAAM,CAAC,EAAGE,CAAS,EACrF,IAAKK,EACJ,GAAGD,EAEH,SAAAF,KACC,oBACE,oBAAC,QAAK,MAAO,CAAE,QAAS,WAAY,WAAY,QAAS,EAAG,cAAW,GACpE,SAAAN,EACH,KACA,OAAC,QAAK,UAAU,WACb,SAAAO,MAGC,OAAC,EAAAG,QAAA,CACC,UAAWd,EAAmB,CAC5B,QAAAK,EACA,MAAAC,CACF,CAAC,EACH,EAEJ,KACA,OAAC,kBAAgB,SAAAF,EAAS,GAC5B,EAEAA,EAEJ,CAGN,EAEAH,EAAO,YAAc,SACrB,IAAOX,EAAQW",
   "names": ["button_exports", "__export", "button_default", "__toCommonJS", "import_jsx_runtime", "React", "import_react_slot", "import_react_visually_hidden", "import_class_variance_authority", "import_spinner", "import_helpers", "buttonVariants", "loadingSvgVariants", "Button", "asChild", "size", "children", "variant", "theme", "hoverEffect", "className", "disabled", "loading", "spinner", "props", "ref", "Spinner"]
 }

package/dist/cjs/helpers/utils.js

@@ -1,2 +1,2 @@
-"use strict";var x=Object.defineProperty;var s=Object.getOwnPropertyDescriptor;var d=Object.getOwnPropertyNames;var f=Object.prototype.hasOwnProperty;var c=(t,e)=>{for(var o in e)x(t,o,{get:e[o],enumerable:!0})},l=(t,e,o,i)=>{if(e&&typeof e=="object"||typeof e=="function")for(let n of d(e))!f.call(t,n)&&n!==o&&x(t,n,{get:()=>e[n],enumerable:!(i=s(e,n))||i.enumerable});return t};var p=t=>l(x({},"__esModule",{value:!0}),t);var m={};c(m,{cn:()=>g,noop:()=>h});module.exports=p(m);var r=require("clsx"),a=require("tailwind-merge");const u=(0,a.extendTailwindMerge)({extend:{theme:{borderRadius:["btn"]},classGroups:{"font-size":["text-heading-1","text-heading-2","text-heading-3","text-heading-4","text-heading-5","text-text-3","text-text-2","text-text-1"],"text-color":["text-info-primary","text-info-secondary","text-info-tertiary","text-info-quaternary","text-info-white"]}}});function g(...t){return u((0,r.clsx)(t))}function h(){}
+"use strict";var o=Object.defineProperty;var d=Object.getOwnPropertyDescriptor;var l=Object.getOwnPropertyNames;var s=Object.prototype.hasOwnProperty;var g=(t,e)=>{for(var i in e)o(t,i,{get:e[i],enumerable:!0})},f=(t,e,i,a)=>{if(e&&typeof e=="object"||typeof e=="function")for(let n of l(e))!s.call(t,n)&&n!==i&&o(t,n,{get:()=>e[n],enumerable:!(a=d(e,n))||a.enumerable});return t};var c=t=>f(o({},"__esModule",{value:!0}),t);var m={};g(m,{cn:()=>p,noop:()=>u});module.exports=c(m);var r=require("clsx"),x=require("tailwind-merge");const h=(0,x.extendTailwindMerge)({extend:{theme:{borderRadius:["btn"]},classGroups:{"font-size":["text-heading-1","text-heading-2","text-heading-3","text-heading-4","text-heading-5","text-text-3","text-text-2","text-text-1"],"text-color":["text-info-primary","text-info-secondary","text-info-tertiary","text-info-quaternary","text-info-white"],leading:["leading-tight","leading-normal","leading-loose"]}}});function p(...t){return h((0,r.clsx)(t))}function u(){}
 //# sourceMappingURL=utils.js.map

package/dist/cjs/helpers/utils.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../src/helpers/utils.ts"],
-  "sourcesContent": ["import { clsx, type ClassValue } from 'clsx'\nimport { extendTailwindMerge } from 'tailwind-merge'\n\nconst twMerge = extendTailwindMerge({\n  extend: {\n      theme: {\n          borderRadius: ['btn'],\n      },\n      classGroups: {\n        'font-size': ['text-heading-1', 'text-heading-2', 'text-heading-3', 'text-heading-4', 'text-heading-5', 'text-text-3', 'text-text-2', 'text-text-1'], \n        'text-color': ['text-info-primary', 'text-info-secondary', 'text-info-tertiary', 'text-info-quaternary', 'text-info-white'],\n      }\n  },\n})\n\nexport function cn(...inputs: ClassValue[]) {\n  return twMerge(clsx(inputs))\n}\n\nexport function noop(): any {}\n"],
-  "mappings": "yaAAA,IAAAA,EAAA,GAAAC,EAAAD,EAAA,QAAAE,EAAA,SAAAC,IAAA,eAAAC,EAAAJ,GAAA,IAAAK,EAAsC,gBACtCC,EAAoC,0BAEpC,MAAMC,KAAU,uBAAoB,CAClC,OAAQ,CACJ,MAAO,CACH,aAAc,CAAC,KAAK,CACxB,EACA,YAAa,CACX,YAAa,CAAC,iBAAkB,iBAAkB,iBAAkB,iBAAkB,iBAAkB,cAAe,cAAe,aAAa,EACnJ,aAAc,CAAC,oBAAqB,sBAAuB,qBAAsB,uBAAwB,iBAAiB,CAC5H,CACJ,CACF,CAAC,EAEM,SAASL,KAAMM,EAAsB,CAC1C,OAAOD,KAAQ,QAAKC,CAAM,CAAC,CAC7B,CAEO,SAASL,GAAY,CAAC",
+  "sourcesContent": ["import { clsx, type ClassValue } from 'clsx'\nimport { extendTailwindMerge } from 'tailwind-merge'\n\nconst twMerge = extendTailwindMerge({\n  extend: {\n      theme: {\n          borderRadius: ['btn'],\n      },\n      classGroups: {\n        'font-size': ['text-heading-1', 'text-heading-2', 'text-heading-3', 'text-heading-4', 'text-heading-5', 'text-text-3', 'text-text-2', 'text-text-1'], \n        'text-color': ['text-info-primary', 'text-info-secondary', 'text-info-tertiary', 'text-info-quaternary', 'text-info-white'],\n        'leading': ['leading-tight', 'leading-normal', 'leading-loose'],\n      }\n  },\n})\n\nexport function cn(...inputs: ClassValue[]) {\n  return twMerge(clsx(inputs))\n}\n\nexport function noop(): any {}\n"],
+  "mappings": "yaAAA,IAAAA,EAAA,GAAAC,EAAAD,EAAA,QAAAE,EAAA,SAAAC,IAAA,eAAAC,EAAAJ,GAAA,IAAAK,EAAsC,gBACtCC,EAAoC,0BAEpC,MAAMC,KAAU,uBAAoB,CAClC,OAAQ,CACJ,MAAO,CACH,aAAc,CAAC,KAAK,CACxB,EACA,YAAa,CACX,YAAa,CAAC,iBAAkB,iBAAkB,iBAAkB,iBAAkB,iBAAkB,cAAe,cAAe,aAAa,EACnJ,aAAc,CAAC,oBAAqB,sBAAuB,qBAAsB,uBAAwB,iBAAiB,EAC1H,QAAW,CAAC,gBAAiB,iBAAkB,eAAe,CAChE,CACJ,CACF,CAAC,EAEM,SAASL,KAAMM,EAAsB,CAC1C,OAAOD,KAAQ,QAAKC,CAAM,CAAC,CAC7B,CAEO,SAASL,GAAY,CAAC",
   "names": ["utils_exports", "__export", "cn", "noop", "__toCommonJS", "import_clsx", "import_tailwind_merge", "twMerge", "inputs"]
 }

package/dist/cjs/stories/badge.stories.d.ts

@@ -7,8 +7,23 @@ declare const meta: {
         layout: string;
     };
     tags: string[];
-    argTypes: {};
-    args: {};
+    argTypes: {
+        size: {
+            control: {
+                type: "select";
+            };
+            options: string[];
+            description: string;
+            table: {
+                defaultValue: {
+                    summary: string;
+                };
+            };
+        };
+    };
+    args: {
+        size: "lg";
+    };
 };
 export default meta;
 type Story = StoryObj<typeof meta>;

package/dist/cjs/stories/badge.stories.js

@@ -1,2 +1,2 @@
-"use strict";var p=Object.defineProperty;var l=Object.getOwnPropertyDescriptor;var y=Object.getOwnPropertyNames;var m=Object.prototype.hasOwnProperty;var c=(t,e)=>{for(var r in e)p(t,r,{get:e[r],enumerable:!0})},n=(t,e,r,d)=>{if(e&&typeof e=="object"||typeof e=="function")for(let o of y(e))!m.call(t,o)&&o!==r&&p(t,o,{get:()=>e[o],enumerable:!(d=l(e,o))||d.enumerable});return t};var f=t=>n(p({},"__esModule",{value:!0}),t);var x={};c(x,{Default:()=>B,Examples:()=>u,default:()=>i});module.exports=f(x);var a=require("react/jsx-runtime"),s=require("../components/index.js"),b=require("react");const g={title:"Components/Badge",component:s.Badge,parameters:{layout:"centered"},tags:["autodocs"],argTypes:{},args:{}};var i=g;const B={args:{children:"Badge"}},u={render(){return(0,a.jsxs)("div",{className:"flex flex-col space-y-4",children:[(0,a.jsx)(s.Badge,{children:"Outline"}),(0,a.jsx)(s.Badge,{children:"Fill"})]})}};
+"use strict";var r=Object.defineProperty;var m=Object.getOwnPropertyDescriptor;var y=Object.getOwnPropertyNames;var c=Object.prototype.hasOwnProperty;var d=(t,e)=>{for(var a in e)r(t,a,{get:e[a],enumerable:!0})},i=(t,e,a,l)=>{if(e&&typeof e=="object"||typeof e=="function")for(let o of y(e))!c.call(t,o)&&o!==a&&r(t,o,{get:()=>e[o],enumerable:!(l=m(e,o))||l.enumerable});return t};var n=t=>i(r({},"__esModule",{value:!0}),t);var B={};d(B,{Default:()=>u,Examples:()=>x,default:()=>f});module.exports=n(B);var p=require("react/jsx-runtime"),s=require("../components/index.js"),b=require("react");const g={title:"Components/Badge",component:s.Badge,parameters:{layout:"centered"},tags:["autodocs"],argTypes:{size:{control:{type:"select"},options:["sm","lg"],description:"Badge \u5C3A\u5BF8",table:{defaultValue:{summary:"lg"}}}},args:{size:"lg"}};var f=g;const u={args:{children:"New"}},x={render(){return(0,p.jsx)("div",{className:"flex flex-col space-y-4",children:(0,p.jsx)(s.Badge,{children:"New"})})}};
 //# sourceMappingURL=badge.stories.js.map

package/dist/cjs/stories/badge.stories.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../src/stories/badge.stories.tsx"],
-  "sourcesContent": ["import type { Meta, StoryObj } from '@storybook/react'\n\nimport { Badge } from '../components/index.js'\nimport React from 'react'\n\nconst meta = {\n  title: 'Components/Badge',\n  component: Badge,\n  parameters: {\n    layout: 'centered',\n  },\n  tags: ['autodocs'],\n  argTypes: {\n\n  },\n  args: {\n\n  },\n} satisfies Meta<typeof Badge>\n\nexport default meta\n\ntype Story = StoryObj<typeof meta>\n\nexport const Default: Story = {\n  args: {\n    children: 'Badge',\n  }\n}\n\nexport const Examples: Story = {\n  render() {\n    return (\n      <div className=\"flex flex-col space-y-4\">\n        <Badge>Outline</Badge>\n        <Badge>Fill</Badge>\n      </div>\n    )\n  },\n}\n"],
-  "mappings": "yaAAA,IAAAA,EAAA,GAAAC,EAAAD,EAAA,aAAAE,EAAA,aAAAC,EAAA,YAAAC,IAAA,eAAAC,EAAAL,GAiCM,IAAAM,EAAA,6BA/BNC,EAAsB,kCACtBC,EAAkB,iBAElB,MAAMC,EAAO,CACX,MAAO,mBACP,UAAW,QACX,WAAY,CACV,OAAQ,UACV,EACA,KAAM,CAAC,UAAU,EACjB,SAAU,CAEV,EACA,KAAM,CAEN,CACF,EAEA,IAAOL,EAAQK,EAIR,MAAMP,EAAiB,CAC5B,KAAM,CACJ,SAAU,OACZ,CACF,EAEaC,EAAkB,CAC7B,QAAS,CACP,SACE,QAAC,OAAI,UAAU,0BACb,oBAAC,SAAM,mBAAO,KACd,OAAC,SAAM,gBAAI,GACb,CAEJ,CACF",
+  "sourcesContent": ["import type { Meta, StoryObj } from '@storybook/react'\n\nimport { Badge } from '../components/index.js'\nimport React from 'react'\n\nconst meta = {\n  title: 'Components/Badge',\n  component: Badge,\n  parameters: {\n    layout: 'centered',\n  },\n  tags: ['autodocs'],\n  argTypes: {\n    size: {\n      control: {\n        type: 'select',\n      },\n      options: ['sm', 'lg'],\n      description: 'Badge \u5C3A\u5BF8',\n      table: {\n        defaultValue: { summary: 'lg' },\n      },\n    },\n  },\n  args: {\n    size: 'lg'\n  },\n} satisfies Meta<typeof Badge>\n\nexport default meta\n\ntype Story = StoryObj<typeof meta>\n\nexport const Default: Story = {\n  args: {\n    children: 'New',\n  }\n}\n\nexport const Examples: Story = {\n  render() {\n    return (\n      <div className=\"flex flex-col space-y-4\">\n        <Badge>New</Badge>\n      </div>\n    )\n  },\n}\n"],
+  "mappings": "yaAAA,IAAAA,EAAA,GAAAC,EAAAD,EAAA,aAAAE,EAAA,aAAAC,EAAA,YAAAC,IAAA,eAAAC,EAAAL,GA2CQ,IAAAM,EAAA,6BAzCRC,EAAsB,kCACtBC,EAAkB,iBAElB,MAAMC,EAAO,CACX,MAAO,mBACP,UAAW,QACX,WAAY,CACV,OAAQ,UACV,EACA,KAAM,CAAC,UAAU,EACjB,SAAU,CACR,KAAM,CACJ,QAAS,CACP,KAAM,QACR,EACA,QAAS,CAAC,KAAM,IAAI,EACpB,YAAa,qBACb,MAAO,CACL,aAAc,CAAE,QAAS,IAAK,CAChC,CACF,CACF,EACA,KAAM,CACJ,KAAM,IACR,CACF,EAEA,IAAOL,EAAQK,EAIR,MAAMP,EAAiB,CAC5B,KAAM,CACJ,SAAU,KACZ,CACF,EAEaC,EAAkB,CAC7B,QAAS,CACP,SACE,OAAC,OAAI,UAAU,0BACb,mBAAC,SAAM,eAAG,EACZ,CAEJ,CACF",
   "names": ["badge_stories_exports", "__export", "Default", "Examples", "badge_stories_default", "__toCommonJS", "import_jsx_runtime", "import_components", "import_react", "meta"]
 }

package/dist/cjs/stories/button.stories.d.ts

@@ -25,12 +25,14 @@ declare const meta: {
                 type: "select";
             };
             options: string[];
+            description: string;
         };
         size: {
             control: {
                 type: "select";
             };
             options: string[];
+            description: string;
         };
         hoverEffect: {
             description: string;
@@ -53,10 +55,10 @@ declare const meta: {
 };
 export default meta;
 type Story = StoryObj<typeof meta>;
-export declare const Nature: Story;
 export declare const Primary: Story;
 export declare const Secondary: Story;
 export declare const Link: Story;
 export declare const WithIcon: Story;
+export declare const Loading: Story;
 export declare const Aschild: Story;
 export declare const Spinner: Story;

package/dist/cjs/stories/button.stories.js

@@ -1,2 +1,2 @@
-"use strict";var n=Object.defineProperty;var l=Object.getOwnPropertyDescriptor;var p=Object.getOwnPropertyNames;var d=Object.prototype.hasOwnProperty;var h=(a,e)=>{for(var r in e)n(a,r,{get:e[r],enumerable:!0})},g=(a,e,r,s)=>{if(e&&typeof e=="object"||typeof e=="function")for(let o of p(e))!d.call(a,o)&&o!==r&&n(a,o,{get:()=>e[o],enumerable:!(s=l(e,o))||s.enumerable});return a};var m=a=>g(n({},"__esModule",{value:!0}),a);var w={};h(w,{Aschild:()=>M,Link:()=>S,Nature:()=>v,Primary:()=>z,Secondary:()=>u,Spinner:()=>b,WithIcon:()=>x,default:()=>f});module.exports=m(w);var t=require("react/jsx-runtime"),i=require("@storybook/icons"),c=require("../components/index.js"),B=require("react");const y={title:"Components/Button",component:c.Button,parameters:{layout:"centered",docs:{description:{component:"\u6309\u94AE\u7EC4\u4EF6, \u5206\u4E3A\u591A\u79CD\u53D8\u4F53\u548C\u5927\u5C0F, \u652F\u6301 loading \u72B6\u6001\u548C\u56FE\u6807"}}},tags:["autodocs"],argTypes:{theme:{control:{type:"select"},options:["dark","light"],description:"\u4E3B\u9898, \u9ED8\u8BA4\u662F light"},variant:{control:{type:"select"},options:["nature","primary","secondary","link","ghost"]},size:{control:{type:"select"},options:["sm","base","lg","icon"]},hoverEffect:{description:"hover \u72B6\u6001\u4E0B\u7684\u52A8\u753B\u6548\u679C\uFF0C\u4EC5\u5728variant\u662Fprimary \u548C secondary \u65F6\u751F\u6548",control:{type:"select"},options:["none","slide"]}},args:{theme:"light",variant:"primary",size:"base",children:"Button",asChild:!1,disabled:!1,loading:!1,hoverEffect:"none"}};var f=y;const v={args:{size:"lg",variant:"nature",children:"Default"}},z={args:{size:"lg",children:"Primary"}},u={args:{size:"lg",variant:"secondary",children:"Secondary"}},S={args:{size:"lg",variant:"link",children:"Link"}},x={args:{size:"lg",children:(0,t.jsxs)(t.Fragment,{children:["WithIcon ",(0,t.jsx)(i.SearchIcon,{className:"ml-2"})]})}},M={args:{size:"lg",asChild:!0,children:(0,t.jsx)("a",{href:"http://example.com",children:"as a a tag"})}},b={args:{size:"lg",loading:!0,spinner:(0,t.jsxs)("div",{className:"flex animate-pulse flex-row font-bold text-neutral-900",children:[(0,t.jsx)("svg",{viewBox:"0 0 1024 1024",version:"1.1",xmlns:"http://www.w3.org/2000/svg","p-id":"2625",width:"1rem",className:"align-middle",children:(0,t.jsx)("path",{d:"M511.882596 287.998081h-0.361244a31.998984 31.998984 0 0 1-31.659415-31.977309v-0.361244c0-0.104761 0.115598-11.722364 0.115598-63.658399V96.000564a31.998984 31.998984 0 1 1 64.001581 0V192.001129c0 52.586273-0.111986 63.88237-0.119211 64.337537a32.002596 32.002596 0 0 1-31.977309 31.659415zM511.998194 959.99842a31.998984 31.998984 0 0 1-31.998984-31.998984v-96.379871c0-51.610915-0.111986-63.174332-0.115598-63.286318s0-0.242033 0-0.361243a31.998984 31.998984 0 0 1 63.997968-0.314283c0 0.455167 0.11921 11.711527 0.11921 64.034093v96.307622a31.998984 31.998984 0 0 1-32.002596 31.998984zM330.899406 363.021212a31.897836 31.897836 0 0 1-22.866739-9.612699c-0.075861-0.075861-8.207461-8.370021-44.931515-45.094076L195.198137 240.429485a31.998984 31.998984 0 0 1 45.256635-45.253022L308.336112 263.057803c37.182834 37.182834 45.090463 45.253022 45.41197 45.578141A31.998984 31.998984 0 0 1 330.899406 363.021212zM806.137421 838.11473a31.901448 31.901448 0 0 1-22.628318-9.374279L715.624151 760.859111c-36.724054-36.724054-45.018214-44.859267-45.097687-44.93874a31.998984 31.998984 0 0 1 44.77618-45.729864c0.32512 0.317895 8.395308 8.229136 45.578142 45.411969l67.88134 67.88134a31.998984 31.998984 0 0 1-22.624705 54.630914zM224.000113 838.11473a31.901448 31.901448 0 0 0 22.628317-9.374279l67.88134-67.88134c36.724054-36.724054 45.021826-44.859267 45.097688-44.93874a31.998984 31.998984 0 0 0-44.776181-45.729864c-0.32512 0.317895-8.395308 8.229136-45.578142 45.411969l-67.88134 67.884953a31.998984 31.998984 0 0 0 22.628318 54.627301zM255.948523 544.058589h-0.361244c-0.104761 0-11.722364-0.115598-63.658399-0.115598H95.942765a31.998984 31.998984 0 1 1 0-64.00158h95.996952c52.586273 0 63.88237 0.111986 64.337538 0.11921a31.998984 31.998984 0 0 1 31.659414 31.97731v0.361244a32.002596 32.002596 0 0 1-31.988146 31.659414zM767.939492 544.058589a32.002596 32.002596 0 0 1-31.995372-31.666639v-0.361244a31.998984 31.998984 0 0 1 31.659415-31.970085c0.455167 0 11.754876-0.11921 64.34115-0.11921h96.000564a31.998984 31.998984 0 0 1 0 64.00158H831.944685c-51.936034 0-63.553638 0.111986-63.665624 0.115598h-0.335957zM692.999446 363.0176a31.998984 31.998984 0 0 1-22.863126-54.381656c0.317895-0.32512 8.229136-8.395308 45.41197-45.578141l67.88134-67.884953A31.998984 31.998984 0 1 1 828.693489 240.429485l-67.892177 67.88134c-31.020013 31.023625-41.644196 41.759794-44.241539 44.393262l-0.697201 0.722488a31.908673 31.908673 0 0 1-22.863126 9.591025z",fill:"","p-id":"2626"})}),"\xA0loading..."]})}};
+"use strict";var s=Object.defineProperty;var l=Object.getOwnPropertyDescriptor;var p=Object.getOwnPropertyNames;var d=Object.prototype.hasOwnProperty;var g=(o,e)=>{for(var r in e)s(o,r,{get:e[r],enumerable:!0})},y=(o,e,r,i)=>{if(e&&typeof e=="object"||typeof e=="function")for(let a of p(e))!d.call(o,a)&&a!==r&&s(o,a,{get:()=>e[a],enumerable:!(i=l(e,a))||i.enumerable});return o};var h=o=>y(s({},"__esModule",{value:!0}),o);var k={};g(k,{Aschild:()=>b,Link:()=>S,Loading:()=>u,Primary:()=>v,Secondary:()=>z,Spinner:()=>M,WithIcon:()=>x,default:()=>f});module.exports=h(k);var t=require("react/jsx-runtime"),n=require("@storybook/icons"),c=require("../components/index.js"),L=require("react");const m={title:"Components/Button",component:c.Button,parameters:{layout:"centered",docs:{description:{component:"\u6309\u94AE\u7EC4\u4EF6, \u5206\u4E3A\u591A\u79CD\u53D8\u4F53\u548C\u5927\u5C0F, \u652F\u6301 loading \u72B6\u6001\u548C\u56FE\u6807"}}},tags:["autodocs"],argTypes:{theme:{control:{type:"select"},options:["dark","light"],description:"\u4E3B\u9898, \u9ED8\u8BA4\u662F light"},variant:{control:{type:"select"},options:["primary","secondary","link","ghost"],description:"\u6309\u94AE\u7C7B\u578B, \u63A8\u8350\u4F7F\u7528 primary \u548C secondary\uFF0C link ; ghost \u5C06\u4F1A\u5E9F\u5F03\uFF0C\u8BF7\u4F7F\u7528 secondary\uFF0C \u4EE3\u66FF"},size:{control:{type:"select"},options:["sm","base","lg","icon"],description:"\u6309\u94AE\u5927\u5C0F \u9ED8\u8BA4\u662F base, \u53EF\u9009\u503C: sm, base, lg, icon"},hoverEffect:{description:"hover \u72B6\u6001\u4E0B\u7684\u52A8\u753B\u6548\u679C\uFF0C\u4EC5\u5728variant\u662Fprimary \u548C secondary \u65F6\u751F\u6548",control:{type:"select"},options:["none","slide"]}},args:{theme:"light",variant:"primary",size:"base",children:"Button",asChild:!1,disabled:!1,loading:!1,hoverEffect:"none"}};var f=m;const v={args:{size:"lg",children:"Primary"}},z={args:{size:"lg",variant:"secondary",children:"Secondary"}},S={args:{size:"lg",variant:"link",children:"Link"}},x={args:{size:"lg",children:(0,t.jsxs)(t.Fragment,{children:["WithIcon ",(0,t.jsx)(n.SearchIcon,{className:"ml-2"})]})}},u={args:{size:"lg",loading:!0}},b={args:{size:"lg",asChild:!0,children:(0,t.jsx)("a",{href:"http://example.com",children:"as a a tag"})}},M={args:{size:"lg",loading:!0,spinner:(0,t.jsxs)("div",{className:"flex animate-pulse flex-row font-bold text-neutral-900",children:[(0,t.jsx)("svg",{viewBox:"0 0 1024 1024",version:"1.1",xmlns:"http://www.w3.org/2000/svg","p-id":"2625",width:"1rem",className:"align-middle",children:(0,t.jsx)("path",{d:"M511.882596 287.998081h-0.361244a31.998984 31.998984 0 0 1-31.659415-31.977309v-0.361244c0-0.104761 0.115598-11.722364 0.115598-63.658399V96.000564a31.998984 31.998984 0 1 1 64.001581 0V192.001129c0 52.586273-0.111986 63.88237-0.119211 64.337537a32.002596 32.002596 0 0 1-31.977309 31.659415zM511.998194 959.99842a31.998984 31.998984 0 0 1-31.998984-31.998984v-96.379871c0-51.610915-0.111986-63.174332-0.115598-63.286318s0-0.242033 0-0.361243a31.998984 31.998984 0 0 1 63.997968-0.314283c0 0.455167 0.11921 11.711527 0.11921 64.034093v96.307622a31.998984 31.998984 0 0 1-32.002596 31.998984zM330.899406 363.021212a31.897836 31.897836 0 0 1-22.866739-9.612699c-0.075861-0.075861-8.207461-8.370021-44.931515-45.094076L195.198137 240.429485a31.998984 31.998984 0 0 1 45.256635-45.253022L308.336112 263.057803c37.182834 37.182834 45.090463 45.253022 45.41197 45.578141A31.998984 31.998984 0 0 1 330.899406 363.021212zM806.137421 838.11473a31.901448 31.901448 0 0 1-22.628318-9.374279L715.624151 760.859111c-36.724054-36.724054-45.018214-44.859267-45.097687-44.93874a31.998984 31.998984 0 0 1 44.77618-45.729864c0.32512 0.317895 8.395308 8.229136 45.578142 45.411969l67.88134 67.88134a31.998984 31.998984 0 0 1-22.624705 54.630914zM224.000113 838.11473a31.901448 31.901448 0 0 0 22.628317-9.374279l67.88134-67.88134c36.724054-36.724054 45.021826-44.859267 45.097688-44.93874a31.998984 31.998984 0 0 0-44.776181-45.729864c-0.32512 0.317895-8.395308 8.229136-45.578142 45.411969l-67.88134 67.884953a31.998984 31.998984 0 0 0 22.628318 54.627301zM255.948523 544.058589h-0.361244c-0.104761 0-11.722364-0.115598-63.658399-0.115598H95.942765a31.998984 31.998984 0 1 1 0-64.00158h95.996952c52.586273 0 63.88237 0.111986 64.337538 0.11921a31.998984 31.998984 0 0 1 31.659414 31.97731v0.361244a32.002596 32.002596 0 0 1-31.988146 31.659414zM767.939492 544.058589a32.002596 32.002596 0 0 1-31.995372-31.666639v-0.361244a31.998984 31.998984 0 0 1 31.659415-31.970085c0.455167 0 11.754876-0.11921 64.34115-0.11921h96.000564a31.998984 31.998984 0 0 1 0 64.00158H831.944685c-51.936034 0-63.553638 0.111986-63.665624 0.115598h-0.335957zM692.999446 363.0176a31.998984 31.998984 0 0 1-22.863126-54.381656c0.317895-0.32512 8.229136-8.395308 45.41197-45.578141l67.88134-67.884953A31.998984 31.998984 0 1 1 828.693489 240.429485l-67.892177 67.88134c-31.020013 31.023625-41.644196 41.759794-44.241539 44.393262l-0.697201 0.722488a31.908673 31.908673 0 0 1-22.863126 9.591025z",fill:"","p-id":"2626"})}),"\xA0loading..."]})}};
 //# sourceMappingURL=button.stories.js.map

package/dist/cjs/stories/button.stories.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../src/stories/button.stories.tsx"],
-  "sourcesContent": ["import type { Meta, StoryObj } from '@storybook/react'\nimport { SearchIcon } from '@storybook/icons'\n\nimport { Button } from '../components/index.js'\nimport React from 'react'\n\n// More on how to set up stories at: https://storybook.js.org/docs/writing-stories#default-export\nconst meta = {\n  // \u540C\u65F6\u5B9A\u4E49\u4E86\u9875\u9762\u5DE6\u4FA7\u83DC\u5355\n  title: 'Components/Button',\n  component: Button,\n  parameters: {\n    // Optional parameter to center the component in the Canvas. More info: https://storybook.js.org/docs/configure/story-layout\n    layout: 'centered',\n    docs: {\n      description: {\n        component: `\u6309\u94AE\u7EC4\u4EF6, \u5206\u4E3A\u591A\u79CD\u53D8\u4F53\u548C\u5927\u5C0F, \u652F\u6301 loading \u72B6\u6001\u548C\u56FE\u6807`\n      }\n    }\n  },\n  // This component will have an automatically generated Autodocs entry: https://storybook.js.org/docs/writing-docs/autodocs\n  tags: ['autodocs'],\n  // More on argTypes: https://storybook.js.org/docs/api/argtypes\n  argTypes: {\n    theme: {\n      control: {\n        type: 'select',\n      },\n      options: ['dark', 'light'],\n      description: '\u4E3B\u9898, \u9ED8\u8BA4\u662F light',\n    },\n    variant: {\n      control: {\n        type: 'select',\n      },\n      options: ['nature', 'primary', 'secondary', 'link', 'ghost'],\n    },\n    size: {\n      control: {\n        type: 'select',\n      },\n      options: ['sm', 'base', 'lg', 'icon'],\n    },\n    hoverEffect: {\n      description: 'hover \u72B6\u6001\u4E0B\u7684\u52A8\u753B\u6548\u679C\uFF0C\u4EC5\u5728variant\u662Fprimary \u548C secondary \u65F6\u751F\u6548',\n      control: {\n        type: 'select',\n      },\n      options: ['none', 'slide'],\n    },\n  },\n  args: {\n    theme: 'light',\n    variant: 'primary',\n    size: 'base',\n    children: 'Button',\n    asChild: false,\n    disabled: false,\n    loading: false,\n    hoverEffect: 'none',\n  },\n} satisfies Meta<typeof Button>\n\nexport default meta\ntype Story = StoryObj<typeof meta>\n\n// More on writing stories with args: https://storybook.js.org/docs/writing-stories/args\n// args \u4F1A\u4F5C\u4E3A props \u4F20\u9012\u7ED9\u7EC4\u4EF6\n// Story\u7684\u540D\u4F1A\u4F5C\u4E3A\u83DC\u5355\u7684\u540D\u79F0 \u81EA\u52A8\u9996\u5B57\u6BCD\u5927\u5199\u5E76\u6309\u7167\u5927\u5199\u5B57\u6BCD\u62C6\u5206 UseAsButton => Use As Button\n\nexport const Nature: Story = {\n  args: {\n    size: 'lg',\n    variant: 'nature',\n    children: 'Default',\n  },\n}\n\nexport const Primary: Story = {\n  args: {\n    size: 'lg',\n    children: 'Primary',\n  },\n}\n\nexport const Secondary: Story = {\n  args: {\n    size: 'lg',\n    variant: 'secondary',\n    children: 'Secondary',\n  },\n}\n\nexport const Link: Story = {\n  args: {\n    size: 'lg',\n    variant: 'link',\n    children: 'Link',\n  },\n}\n\nexport const WithIcon: Story = {\n  args: {\n    size: 'lg',\n    children: (\n      <>\n        WithIcon <SearchIcon className=\"ml-2\" />\n      </>\n    ),\n  },\n}\n\nexport const Aschild: Story = {\n  args: {\n    size: 'lg',\n    asChild: true,\n    children: <a href=\"http://example.com\">as a a tag</a>,\n  },\n}\n\nexport const Spinner: Story = {\n  args: {\n    size: 'lg',\n    loading: true,\n    spinner: (\n      <div className=\"flex animate-pulse flex-row font-bold text-neutral-900\">\n        <svg\n          viewBox=\"0 0 1024 1024\"\n          version=\"1.1\"\n          xmlns=\"http://www.w3.org/2000/svg\"\n          p-id=\"2625\"\n          width=\"1rem\"\n          className=\"align-middle\"\n        >\n          <path\n            d=\"M511.882596 287.998081h-0.361244a31.998984 31.998984 0 0 1-31.659415-31.977309v-0.361244c0-0.104761 0.115598-11.722364 0.115598-63.658399V96.000564a31.998984 31.998984 0 1 1 64.001581 0V192.001129c0 52.586273-0.111986 63.88237-0.119211 64.337537a32.002596 32.002596 0 0 1-31.977309 31.659415zM511.998194 959.99842a31.998984 31.998984 0 0 1-31.998984-31.998984v-96.379871c0-51.610915-0.111986-63.174332-0.115598-63.286318s0-0.242033 0-0.361243a31.998984 31.998984 0 0 1 63.997968-0.314283c0 0.455167 0.11921 11.711527 0.11921 64.034093v96.307622a31.998984 31.998984 0 0 1-32.002596 31.998984zM330.899406 363.021212a31.897836 31.897836 0 0 1-22.866739-9.612699c-0.075861-0.075861-8.207461-8.370021-44.931515-45.094076L195.198137 240.429485a31.998984 31.998984 0 0 1 45.256635-45.253022L308.336112 263.057803c37.182834 37.182834 45.090463 45.253022 45.41197 45.578141A31.998984 31.998984 0 0 1 330.899406 363.021212zM806.137421 838.11473a31.901448 31.901448 0 0 1-22.628318-9.374279L715.624151 760.859111c-36.724054-36.724054-45.018214-44.859267-45.097687-44.93874a31.998984 31.998984 0 0 1 44.77618-45.729864c0.32512 0.317895 8.395308 8.229136 45.578142 45.411969l67.88134 67.88134a31.998984 31.998984 0 0 1-22.624705 54.630914zM224.000113 838.11473a31.901448 31.901448 0 0 0 22.628317-9.374279l67.88134-67.88134c36.724054-36.724054 45.021826-44.859267 45.097688-44.93874a31.998984 31.998984 0 0 0-44.776181-45.729864c-0.32512 0.317895-8.395308 8.229136-45.578142 45.411969l-67.88134 67.884953a31.998984 31.998984 0 0 0 22.628318 54.627301zM255.948523 544.058589h-0.361244c-0.104761 0-11.722364-0.115598-63.658399-0.115598H95.942765a31.998984 31.998984 0 1 1 0-64.00158h95.996952c52.586273 0 63.88237 0.111986 64.337538 0.11921a31.998984 31.998984 0 0 1 31.659414 31.97731v0.361244a32.002596 32.002596 0 0 1-31.988146 31.659414zM767.939492 544.058589a32.002596 32.002596 0 0 1-31.995372-31.666639v-0.361244a31.998984 31.998984 0 0 1 31.659415-31.970085c0.455167 0 11.754876-0.11921 64.34115-0.11921h96.000564a31.998984 31.998984 0 0 1 0 64.00158H831.944685c-51.936034 0-63.553638 0.111986-63.665624 0.115598h-0.335957zM692.999446 363.0176a31.998984 31.998984 0 0 1-22.863126-54.381656c0.317895-0.32512 8.229136-8.395308 45.41197-45.578141l67.88134-67.884953A31.998984 31.998984 0 1 1 828.693489 240.429485l-67.892177 67.88134c-31.020013 31.023625-41.644196 41.759794-44.241539 44.393262l-0.697201 0.722488a31.908673 31.908673 0 0 1-22.863126 9.591025z\"\n            fill=\"\"\n            p-id=\"2626\"\n          ></path>\n        </svg>\n        &nbsp;loading...\n      </div>\n    ),\n  },\n}\n"],
-  "mappings": "yaAAA,IAAAA,EAAA,GAAAC,EAAAD,EAAA,aAAAE,EAAA,SAAAC,EAAA,WAAAC,EAAA,YAAAC,EAAA,cAAAC,EAAA,YAAAC,EAAA,aAAAC,EAAA,YAAAC,IAAA,eAAAC,EAAAV,GAyGM,IAAAW,EAAA,6BAxGNC,EAA2B,4BAE3BC,EAAuB,kCACvBC,EAAkB,iBAGlB,MAAMC,EAAO,CAEX,MAAO,oBACP,UAAW,SACX,WAAY,CAEV,OAAQ,WACR,KAAM,CACJ,YAAa,CACX,UAAW,uIACb,CACF,CACF,EAEA,KAAM,CAAC,UAAU,EAEjB,SAAU,CACR,MAAO,CACL,QAAS,CACP,KAAM,QACR,EACA,QAAS,CAAC,OAAQ,OAAO,EACzB,YAAa,wCACf,EACA,QAAS,CACP,QAAS,CACP,KAAM,QACR,EACA,QAAS,CAAC,SAAU,UAAW,YAAa,OAAQ,OAAO,CAC7D,EACA,KAAM,CACJ,QAAS,CACP,KAAM,QACR,EACA,QAAS,CAAC,KAAM,OAAQ,KAAM,MAAM,CACtC,EACA,YAAa,CACX,YAAa,mIACb,QAAS,CACP,KAAM,QACR,EACA,QAAS,CAAC,OAAQ,OAAO,CAC3B,CACF,EACA,KAAM,CACJ,MAAO,QACP,QAAS,UACT,KAAM,OACN,SAAU,SACV,QAAS,GACT,SAAU,GACV,QAAS,GACT,YAAa,MACf,CACF,EAEA,IAAON,EAAQM,EAOR,MAAMX,EAAgB,CAC3B,KAAM,CACJ,KAAM,KACN,QAAS,SACT,SAAU,SACZ,CACF,EAEaC,EAAiB,CAC5B,KAAM,CACJ,KAAM,KACN,SAAU,SACZ,CACF,EAEaC,EAAmB,CAC9B,KAAM,CACJ,KAAM,KACN,QAAS,YACT,SAAU,WACZ,CACF,EAEaH,EAAc,CACzB,KAAM,CACJ,KAAM,KACN,QAAS,OACT,SAAU,MACZ,CACF,EAEaK,EAAkB,CAC7B,KAAM,CACJ,KAAM,KACN,YACE,oBAAE,yBACS,OAAC,cAAW,UAAU,OAAO,GACxC,CAEJ,CACF,EAEaN,EAAiB,CAC5B,KAAM,CACJ,KAAM,KACN,QAAS,GACT,YAAU,OAAC,KAAE,KAAK,qBAAqB,sBAAU,CACnD,CACF,EAEaK,EAAiB,CAC5B,KAAM,CACJ,KAAM,KACN,QAAS,GACT,WACE,QAAC,OAAI,UAAU,yDACb,oBAAC,OACC,QAAQ,gBACR,QAAQ,MACR,MAAM,6BACN,OAAK,OACL,MAAM,OACN,UAAU,eAEV,mBAAC,QACC,EAAE,o5EACF,KAAK,GACL,OAAK,OACN,EACH,EAAM,kBAER,CAEJ,CACF",
-  "names": ["button_stories_exports", "__export", "Aschild", "Link", "Nature", "Primary", "Secondary", "Spinner", "WithIcon", "button_stories_default", "__toCommonJS", "import_jsx_runtime", "import_icons", "import_components", "import_react", "meta"]
+  "sourcesContent": ["import type { Meta, StoryObj } from '@storybook/react'\nimport { SearchIcon } from '@storybook/icons'\n\nimport { Button } from '../components/index.js'\nimport React from 'react'\n\n// More on how to set up stories at: https://storybook.js.org/docs/writing-stories#default-export\nconst meta = {\n  // \u540C\u65F6\u5B9A\u4E49\u4E86\u9875\u9762\u5DE6\u4FA7\u83DC\u5355\n  title: 'Components/Button',\n  component: Button,\n  parameters: {\n    // Optional parameter to center the component in the Canvas. More info: https://storybook.js.org/docs/configure/story-layout\n    layout: 'centered',\n    docs: {\n      description: {\n        component: `\u6309\u94AE\u7EC4\u4EF6, \u5206\u4E3A\u591A\u79CD\u53D8\u4F53\u548C\u5927\u5C0F, \u652F\u6301 loading \u72B6\u6001\u548C\u56FE\u6807`\n      }\n    }\n  },\n  // This component will have an automatically generated Autodocs entry: https://storybook.js.org/docs/writing-docs/autodocs\n  tags: ['autodocs'],\n  // More on argTypes: https://storybook.js.org/docs/api/argtypes\n  argTypes: {\n    theme: {\n      control: {\n        type: 'select',\n      },\n      options: ['dark', 'light'],\n      description: '\u4E3B\u9898, \u9ED8\u8BA4\u662F light',\n    },\n    variant: {\n      control: {\n        type: 'select',\n      },\n      options: ['primary', 'secondary', 'link', 'ghost'],\n      description: '\u6309\u94AE\u7C7B\u578B, \u63A8\u8350\u4F7F\u7528 primary \u548C secondary\uFF0C link ; ghost \u5C06\u4F1A\u5E9F\u5F03\uFF0C\u8BF7\u4F7F\u7528 secondary\uFF0C \u4EE3\u66FF',\n    },\n    size: {\n      control: {\n        type: 'select',\n      },\n      options: ['sm', 'base', 'lg', 'icon'],\n      description: '\u6309\u94AE\u5927\u5C0F \u9ED8\u8BA4\u662F base, \u53EF\u9009\u503C: sm, base, lg, icon',\n    },\n    hoverEffect: {\n      description: 'hover \u72B6\u6001\u4E0B\u7684\u52A8\u753B\u6548\u679C\uFF0C\u4EC5\u5728variant\u662Fprimary \u548C secondary \u65F6\u751F\u6548',\n      control: {\n        type: 'select',\n      },\n      options: ['none', 'slide'],\n    },\n  },\n  args: {\n    theme: 'light',\n    variant: 'primary',\n    size: 'base',\n    children: 'Button',\n    asChild: false,\n    disabled: false,\n    loading: false,\n    hoverEffect: 'none',\n  },\n} satisfies Meta<typeof Button>\n\nexport default meta\ntype Story = StoryObj<typeof meta>\n\n// More on writing stories with args: https://storybook.js.org/docs/writing-stories/args\n// args \u4F1A\u4F5C\u4E3A props \u4F20\u9012\u7ED9\u7EC4\u4EF6\n// Story\u7684\u540D\u4F1A\u4F5C\u4E3A\u83DC\u5355\u7684\u540D\u79F0 \u81EA\u52A8\u9996\u5B57\u6BCD\u5927\u5199\u5E76\u6309\u7167\u5927\u5199\u5B57\u6BCD\u62C6\u5206 UseAsButton => Use As Button\n\nexport const Primary: Story = {\n  args: {\n    size: 'lg',\n    children: 'Primary',\n  },\n}\n\nexport const Secondary: Story = {\n  args: {\n    size: 'lg',\n    variant: 'secondary',\n    children: 'Secondary',\n  },\n}\n\nexport const Link: Story = {\n  args: {\n    size: 'lg',\n    variant: 'link',\n    children: 'Link',\n  },\n}\n\nexport const WithIcon: Story = {\n  args: {\n    size: 'lg',\n    children: (\n      <>\n        WithIcon <SearchIcon className=\"ml-2\" />\n      </>\n    ),\n  },\n}\n\nexport const Loading: Story = {\n  args: {\n    size: 'lg',\n    loading: true,\n  },\n}\n\nexport const Aschild: Story = {\n  args: {\n    size: 'lg',\n    asChild: true,\n    children: <a href=\"http://example.com\">as a a tag</a>,\n  },\n}\n\nexport const Spinner: Story = {\n  args: {\n    size: 'lg',\n    loading: true,\n    spinner: (\n      <div className=\"flex animate-pulse flex-row font-bold text-neutral-900\">\n        <svg\n          viewBox=\"0 0 1024 1024\"\n          version=\"1.1\"\n          xmlns=\"http://www.w3.org/2000/svg\"\n          p-id=\"2625\"\n          width=\"1rem\"\n          className=\"align-middle\"\n        >\n          <path\n            d=\"M511.882596 287.998081h-0.361244a31.998984 31.998984 0 0 1-31.659415-31.977309v-0.361244c0-0.104761 0.115598-11.722364 0.115598-63.658399V96.000564a31.998984 31.998984 0 1 1 64.001581 0V192.001129c0 52.586273-0.111986 63.88237-0.119211 64.337537a32.002596 32.002596 0 0 1-31.977309 31.659415zM511.998194 959.99842a31.998984 31.998984 0 0 1-31.998984-31.998984v-96.379871c0-51.610915-0.111986-63.174332-0.115598-63.286318s0-0.242033 0-0.361243a31.998984 31.998984 0 0 1 63.997968-0.314283c0 0.455167 0.11921 11.711527 0.11921 64.034093v96.307622a31.998984 31.998984 0 0 1-32.002596 31.998984zM330.899406 363.021212a31.897836 31.897836 0 0 1-22.866739-9.612699c-0.075861-0.075861-8.207461-8.370021-44.931515-45.094076L195.198137 240.429485a31.998984 31.998984 0 0 1 45.256635-45.253022L308.336112 263.057803c37.182834 37.182834 45.090463 45.253022 45.41197 45.578141A31.998984 31.998984 0 0 1 330.899406 363.021212zM806.137421 838.11473a31.901448 31.901448 0 0 1-22.628318-9.374279L715.624151 760.859111c-36.724054-36.724054-45.018214-44.859267-45.097687-44.93874a31.998984 31.998984 0 0 1 44.77618-45.729864c0.32512 0.317895 8.395308 8.229136 45.578142 45.411969l67.88134 67.88134a31.998984 31.998984 0 0 1-22.624705 54.630914zM224.000113 838.11473a31.901448 31.901448 0 0 0 22.628317-9.374279l67.88134-67.88134c36.724054-36.724054 45.021826-44.859267 45.097688-44.93874a31.998984 31.998984 0 0 0-44.776181-45.729864c-0.32512 0.317895-8.395308 8.229136-45.578142 45.411969l-67.88134 67.884953a31.998984 31.998984 0 0 0 22.628318 54.627301zM255.948523 544.058589h-0.361244c-0.104761 0-11.722364-0.115598-63.658399-0.115598H95.942765a31.998984 31.998984 0 1 1 0-64.00158h95.996952c52.586273 0 63.88237 0.111986 64.337538 0.11921a31.998984 31.998984 0 0 1 31.659414 31.97731v0.361244a32.002596 32.002596 0 0 1-31.988146 31.659414zM767.939492 544.058589a32.002596 32.002596 0 0 1-31.995372-31.666639v-0.361244a31.998984 31.998984 0 0 1 31.659415-31.970085c0.455167 0 11.754876-0.11921 64.34115-0.11921h96.000564a31.998984 31.998984 0 0 1 0 64.00158H831.944685c-51.936034 0-63.553638 0.111986-63.665624 0.115598h-0.335957zM692.999446 363.0176a31.998984 31.998984 0 0 1-22.863126-54.381656c0.317895-0.32512 8.229136-8.395308 45.41197-45.578141l67.88134-67.884953A31.998984 31.998984 0 1 1 828.693489 240.429485l-67.892177 67.88134c-31.020013 31.023625-41.644196 41.759794-44.241539 44.393262l-0.697201 0.722488a31.908673 31.908673 0 0 1-22.863126 9.591025z\"\n            fill=\"\"\n            p-id=\"2626\"\n          ></path>\n        </svg>\n        &nbsp;loading...\n      </div>\n    ),\n  },\n}\n"],
+  "mappings": "yaAAA,IAAAA,EAAA,GAAAC,EAAAD,EAAA,aAAAE,EAAA,SAAAC,EAAA,YAAAC,EAAA,YAAAC,EAAA,cAAAC,EAAA,YAAAC,EAAA,aAAAC,EAAA,YAAAC,IAAA,eAAAC,EAAAV,GAmGM,IAAAW,EAAA,6BAlGNC,EAA2B,4BAE3BC,EAAuB,kCACvBC,EAAkB,iBAGlB,MAAMC,EAAO,CAEX,MAAO,oBACP,UAAW,SACX,WAAY,CAEV,OAAQ,WACR,KAAM,CACJ,YAAa,CACX,UAAW,uIACb,CACF,CACF,EAEA,KAAM,CAAC,UAAU,EAEjB,SAAU,CACR,MAAO,CACL,QAAS,CACP,KAAM,QACR,EACA,QAAS,CAAC,OAAQ,OAAO,EACzB,YAAa,wCACf,EACA,QAAS,CACP,QAAS,CACP,KAAM,QACR,EACA,QAAS,CAAC,UAAW,YAAa,OAAQ,OAAO,EACjD,YAAa,8KACf,EACA,KAAM,CACJ,QAAS,CACP,KAAM,QACR,EACA,QAAS,CAAC,KAAM,OAAQ,KAAM,MAAM,EACpC,YAAa,0FACf,EACA,YAAa,CACX,YAAa,mIACb,QAAS,CACP,KAAM,QACR,EACA,QAAS,CAAC,OAAQ,OAAO,CAC3B,CACF,EACA,KAAM,CACJ,MAAO,QACP,QAAS,UACT,KAAM,OACN,SAAU,SACV,QAAS,GACT,SAAU,GACV,QAAS,GACT,YAAa,MACf,CACF,EAEA,IAAON,EAAQM,EAOR,MAAMV,EAAiB,CAC5B,KAAM,CACJ,KAAM,KACN,SAAU,SACZ,CACF,EAEaC,EAAmB,CAC9B,KAAM,CACJ,KAAM,KACN,QAAS,YACT,SAAU,WACZ,CACF,EAEaH,EAAc,CACzB,KAAM,CACJ,KAAM,KACN,QAAS,OACT,SAAU,MACZ,CACF,EAEaK,EAAkB,CAC7B,KAAM,CACJ,KAAM,KACN,YACE,oBAAE,yBACS,OAAC,cAAW,UAAU,OAAO,GACxC,CAEJ,CACF,EAEaJ,EAAiB,CAC5B,KAAM,CACJ,KAAM,KACN,QAAS,EACX,CACF,EAEaF,EAAiB,CAC5B,KAAM,CACJ,KAAM,KACN,QAAS,GACT,YAAU,OAAC,KAAE,KAAK,qBAAqB,sBAAU,CACnD,CACF,EAEaK,EAAiB,CAC5B,KAAM,CACJ,KAAM,KACN,QAAS,GACT,WACE,QAAC,OAAI,UAAU,yDACb,oBAAC,OACC,QAAQ,gBACR,QAAQ,MACR,MAAM,6BACN,OAAK,OACL,MAAM,OACN,UAAU,eAEV,mBAAC,QACC,EAAE,o5EACF,KAAK,GACL,OAAK,OACN,EACH,EAAM,kBAER,CAEJ,CACF",
+  "names": ["button_stories_exports", "__export", "Aschild", "Link", "Loading", "Primary", "Secondary", "Spinner", "WithIcon", "button_stories_default", "__toCommonJS", "import_jsx_runtime", "import_icons", "import_components", "import_react", "meta"]
 }

package/dist/esm/biz-components/HeroBanner/HeroBanner.js

@@ -1,2 +1,2 @@
-import{jsx as e,jsxs as r}from"react/jsx-runtime";import m from"react";import{Button as c,Text as N}from"../../components/index.js";import{cn as a}from"../../helpers/index.js";import{withStyles as k}from"../../shared/Styles.js";const x=m.forwardRef(({title:d,subtitle:p,background:g,primaryButton:n,secondaryButton:l,theme:t="light",className:b,products:o=[]},f)=>{const i=t==="dark"?"text-white":"text-[#1D1D1F]",v=t==="dark"?"bg-white":"bg-[#1D1D1F]";return r("div",{ref:f,className:a("relative flex min-h-[720px] w-full flex-col justify-between overflow-hidden bg-cover bg-center bg-no-repeat",b),style:{backgroundImage:`url(${g})`},children:[r("div",{className:"relative z-10 flex flex-col gap-8 px-32 pt-[307px]",children:[r("div",{className:"max-w-[686px] space-y-4",children:[e("h1",{className:a("hero-banner-title font-mont text-[64px] font-bold leading-none tracking-[-0.04em]",i),children:d}),e("p",{className:a("hero-banner-subtitle text-lg font-medium leading-[1.2] tracking-[-0.02em]",i),children:p})]}),r("div",{className:"flex items-center gap-4",children:[l&&e(c,{size:"lg",variant:"nature",theme:t,className:"hero-banner-primary-button",...l,children:l.text}),n&&e(c,{size:"lg",variant:"secondary",theme:t,...n,className:"hero-banner-secondary-button bg-transparent border-black text-black hover:bg-black hover:text-white",children:n.text})]})]}),o.length>0&&e("div",{className:"relative z-10 flex items-center gap-3 px-32 pb-6",children:o.map((h,s)=>r(m.Fragment,{children:[e(N,{className:a("hero-banner-product-text text-sm font-medium leading-[1.2] tracking-[-0.02em]",t==="dark"?"text-white":"text-[#1D1D1F]"),children:h.title}),s<o.length-1&&e("div",{className:a("h-4 w-px",v)})]},s))})]})});x.displayName="HeroBanner";var F=k(x);export{F as default};
+import{jsx as e,jsxs as r}from"react/jsx-runtime";import m from"react";import{Button as c,Text as N}from"../../components/index.js";import{cn as a}from"../../helpers/index.js";import{withStyles as k}from"../../shared/Styles.js";const p=m.forwardRef(({title:x,subtitle:d,background:g,primaryButton:n,secondaryButton:l,theme:t="light",className:b,products:i=[]},f)=>{const o=t==="dark"?"text-white":"text-[#1D1D1F]",v=t==="dark"?"bg-white":"bg-[#1D1D1F]";return r("div",{ref:f,className:a("relative flex min-h-[720px] w-full flex-col justify-between overflow-hidden bg-cover bg-center bg-no-repeat",b),style:{backgroundImage:`url(${g})`},children:[r("div",{className:"relative z-10 flex flex-col gap-8 px-32 pt-[307px]",children:[r("div",{className:"max-w-[686px] space-y-4",children:[e("h1",{className:a("hero-banner-title font-mont text-[64px] font-bold leading-none tracking-[-0.04em]",o),children:x}),e("p",{className:a("hero-banner-subtitle text-lg font-medium leading-[1.2] tracking-[-0.02em]",o),children:d})]}),r("div",{className:"flex items-center gap-4",children:[l&&e(c,{size:"lg",variant:"primary",theme:t,className:"hero-banner-primary-button",...l,children:l.text}),n&&e(c,{size:"lg",variant:"secondary",theme:t,...n,className:"hero-banner-secondary-button bg-transparent border-black text-black hover:bg-black hover:text-white",children:n.text})]})]}),i.length>0&&e("div",{className:"relative z-10 flex items-center gap-3 px-32 pb-6",children:i.map((h,s)=>r(m.Fragment,{children:[e(N,{className:a("hero-banner-product-text text-sm font-medium leading-[1.2] tracking-[-0.02em]",t==="dark"?"text-white":"text-[#1D1D1F]"),children:h.title}),s<i.length-1&&e("div",{className:a("h-4 w-px",v)})]},s))})]})});p.displayName="HeroBanner";var F=k(p);export{F as default};
 //# sourceMappingURL=HeroBanner.js.map

package/dist/esm/biz-components/HeroBanner/HeroBanner.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../../src/biz-components/HeroBanner/HeroBanner.tsx"],
-  "sourcesContent": ["import React from \"react\"\nimport type { HeroBannerProps } from \"./types.js\"\nimport { Button, Text } from \"../../components/index.js\"\nimport { cn } from \"../../helpers/index.js\"\nimport { withStyles } from \"../../shared/Styles.js\"\n\nconst HeroBanner = React.forwardRef<HTMLDivElement, HeroBannerProps>(\n  ({ \n    title, \n    subtitle, \n    background,\n    primaryButton,\n    secondaryButton,\n    theme = \"light\",\n    className,\n    products = [] \n  }, ref) => {\n    const textColorClass = theme === \"dark\" ? \"text-white\" : \"text-[#1D1D1F]\"\n    const dividerColorClass = theme === \"dark\" ? \"bg-white\" : \"bg-[#1D1D1F]\"\n\n    return (\n      <div \n        ref={ref} \n        className={cn(\n          \"relative flex min-h-[720px] w-full flex-col justify-between overflow-hidden bg-cover bg-center bg-no-repeat\",\n          className\n        )}\n        style={{ backgroundImage: `url(${background})` }}\n      >\n        {/* \u5185\u5BB9\u533A\u57DF */}\n        <div className=\"relative z-10 flex flex-col gap-8 px-32 pt-[307px]\">\n          <div className=\"max-w-[686px] space-y-4\">\n            <h1 className={cn(\n              \"hero-banner-title font-mont text-[64px] font-bold leading-none tracking-[-0.04em]\",\n              textColorClass\n            )}>\n              {title}\n            </h1>\n            <p className={cn(\n              \"hero-banner-subtitle text-lg font-medium leading-[1.2] tracking-[-0.02em]\",\n              textColorClass\n            )}>\n              {subtitle}\n            </p>\n          </div>\n          \n          {/* \u6309\u94AE\u7EC4 */}\n          <div className=\"flex items-center gap-4\">\n            {secondaryButton && (\n              <Button\n                size=\"lg\"\n                variant=\"nature\"\n                theme={theme}\n                className=\"hero-banner-primary-button\"\n                {...secondaryButton}\n              >\n                {secondaryButton.text}\n              </Button>\n            )}\n            {primaryButton && (\n              <Button\n                size=\"lg\"\n                variant=\"secondary\"\n                theme={theme}\n                {...primaryButton}\n                className=\"hero-banner-secondary-button bg-transparent border-black text-black hover:bg-black hover:text-white\"\n              >\n                {primaryButton.text}\n              </Button>\n            )}\n          </div>\n        </div>\n\n        {/* \u5E95\u90E8\u4EA7\u54C1\u5217\u8868 */}\n        {products.length > 0 && (\n          <div className=\"relative z-10 flex items-center gap-3 px-32 pb-6\">\n            {products.map((product, index) => (\n              <React.Fragment key={index}>\n                <Text\n                  className={cn(\n                    \"hero-banner-product-text text-sm font-medium leading-[1.2] tracking-[-0.02em]\",\n                    theme === \"dark\" ? \"text-white\" : \"text-[#1D1D1F]\"\n                  )}\n                >\n                  {product.title}\n                </Text>\n                {index < products.length - 1 && (\n                  <div className={cn(\"h-4 w-px\", dividerColorClass)} />\n                )}\n              </React.Fragment>\n            ))}\n          </div>\n        )}\n      </div>\n    )\n  }\n)\n\nHeroBanner.displayName = \"HeroBanner\"\n\nexport default withStyles(HeroBanner)\n\n\n"],
-  "mappings": "AA+BU,OACE,OAAAA,EADF,QAAAC,MAAA,oBA/BV,OAAOC,MAAW,QAElB,OAAS,UAAAC,EAAQ,QAAAC,MAAY,4BAC7B,OAAS,MAAAC,MAAU,yBACnB,OAAS,cAAAC,MAAkB,yBAE3B,MAAMC,EAAaL,EAAM,WACvB,CAAC,CACC,MAAAM,EACA,SAAAC,EACA,WAAAC,EACA,cAAAC,EACA,gBAAAC,EACA,MAAAC,EAAQ,QACR,UAAAC,EACA,SAAAC,EAAW,CAAC,CACd,EAAGC,IAAQ,CACT,MAAMC,EAAiBJ,IAAU,OAAS,aAAe,iBACnDK,EAAoBL,IAAU,OAAS,WAAa,eAE1D,OACEZ,EAAC,OACC,IAAKe,EACL,UAAWX,EACT,8GACAS,CACF,EACA,MAAO,CAAE,gBAAiB,OAAOJ,CAAU,GAAI,EAG/C,UAAAT,EAAC,OAAI,UAAU,qDACb,UAAAA,EAAC,OAAI,UAAU,0BACb,UAAAD,EAAC,MAAG,UAAWK,EACb,oFACAY,CACF,EACG,SAAAT,EACH,EACAR,EAAC,KAAE,UAAWK,EACZ,4EACAY,CACF,EACG,SAAAR,EACH,GACF,EAGAR,EAAC,OAAI,UAAU,0BACZ,UAAAW,GACCZ,EAACG,EAAA,CACC,KAAK,KACL,QAAQ,SACR,MAAOU,EACP,UAAU,6BACT,GAAGD,EAEH,SAAAA,EAAgB,KACnB,EAEDD,GACCX,EAACG,EAAA,CACC,KAAK,KACL,QAAQ,YACR,MAAOU,EACN,GAAGF,EACJ,UAAU,sGAET,SAAAA,EAAc,KACjB,GAEJ,GACF,EAGCI,EAAS,OAAS,GACjBf,EAAC,OAAI,UAAU,mDACZ,SAAAe,EAAS,IAAI,CAACI,EAASC,IACtBnB,EAACC,EAAM,SAAN,CACC,UAAAF,EAACI,EAAA,CACC,UAAWC,EACT,gFACAQ,IAAU,OAAS,aAAe,gBACpC,EAEC,SAAAM,EAAQ,MACX,EACCC,EAAQL,EAAS,OAAS,GACzBf,EAAC,OAAI,UAAWK,EAAG,WAAYa,CAAiB,EAAG,IAVlCE,CAYrB,CACD,EACH,GAEJ,CAEJ,CACF,EAEAb,EAAW,YAAc,aAEzB,IAAOc,EAAQf,EAAWC,CAAU",
+  "sourcesContent": ["import React from \"react\"\nimport type { HeroBannerProps } from \"./types.js\"\nimport { Button, Text } from \"../../components/index.js\"\nimport { cn } from \"../../helpers/index.js\"\nimport { withStyles } from \"../../shared/Styles.js\"\n\nconst HeroBanner = React.forwardRef<HTMLDivElement, HeroBannerProps>(\n  ({ \n    title, \n    subtitle, \n    background,\n    primaryButton,\n    secondaryButton,\n    theme = \"light\",\n    className,\n    products = [] \n  }, ref) => {\n    const textColorClass = theme === \"dark\" ? \"text-white\" : \"text-[#1D1D1F]\"\n    const dividerColorClass = theme === \"dark\" ? \"bg-white\" : \"bg-[#1D1D1F]\"\n\n    return (\n      <div \n        ref={ref} \n        className={cn(\n          \"relative flex min-h-[720px] w-full flex-col justify-between overflow-hidden bg-cover bg-center bg-no-repeat\",\n          className\n        )}\n        style={{ backgroundImage: `url(${background})` }}\n      >\n        {/* \u5185\u5BB9\u533A\u57DF */}\n        <div className=\"relative z-10 flex flex-col gap-8 px-32 pt-[307px]\">\n          <div className=\"max-w-[686px] space-y-4\">\n            <h1 className={cn(\n              \"hero-banner-title font-mont text-[64px] font-bold leading-none tracking-[-0.04em]\",\n              textColorClass\n            )}>\n              {title}\n            </h1>\n            <p className={cn(\n              \"hero-banner-subtitle text-lg font-medium leading-[1.2] tracking-[-0.02em]\",\n              textColorClass\n            )}>\n              {subtitle}\n            </p>\n          </div>\n          \n          {/* \u6309\u94AE\u7EC4 */}\n          <div className=\"flex items-center gap-4\">\n            {secondaryButton && (\n              <Button\n                size=\"lg\"\n                variant=\"primary\"\n                theme={theme}\n                className=\"hero-banner-primary-button\"\n                {...secondaryButton}\n              >\n                {secondaryButton.text}\n              </Button>\n            )}\n            {primaryButton && (\n              <Button\n                size=\"lg\"\n                variant=\"secondary\"\n                theme={theme}\n                {...primaryButton}\n                className=\"hero-banner-secondary-button bg-transparent border-black text-black hover:bg-black hover:text-white\"\n              >\n                {primaryButton.text}\n              </Button>\n            )}\n          </div>\n        </div>\n\n        {/* \u5E95\u90E8\u4EA7\u54C1\u5217\u8868 */}\n        {products.length > 0 && (\n          <div className=\"relative z-10 flex items-center gap-3 px-32 pb-6\">\n            {products.map((product, index) => (\n              <React.Fragment key={index}>\n                <Text\n                  className={cn(\n                    \"hero-banner-product-text text-sm font-medium leading-[1.2] tracking-[-0.02em]\",\n                    theme === \"dark\" ? \"text-white\" : \"text-[#1D1D1F]\"\n                  )}\n                >\n                  {product.title}\n                </Text>\n                {index < products.length - 1 && (\n                  <div className={cn(\"h-4 w-px\", dividerColorClass)} />\n                )}\n              </React.Fragment>\n            ))}\n          </div>\n        )}\n      </div>\n    )\n  }\n)\n\nHeroBanner.displayName = \"HeroBanner\"\n\nexport default withStyles(HeroBanner)\n\n\n"],
+  "mappings": "AA+BU,OACE,OAAAA,EADF,QAAAC,MAAA,oBA/BV,OAAOC,MAAW,QAElB,OAAS,UAAAC,EAAQ,QAAAC,MAAY,4BAC7B,OAAS,MAAAC,MAAU,yBACnB,OAAS,cAAAC,MAAkB,yBAE3B,MAAMC,EAAaL,EAAM,WACvB,CAAC,CACC,MAAAM,EACA,SAAAC,EACA,WAAAC,EACA,cAAAC,EACA,gBAAAC,EACA,MAAAC,EAAQ,QACR,UAAAC,EACA,SAAAC,EAAW,CAAC,CACd,EAAGC,IAAQ,CACT,MAAMC,EAAiBJ,IAAU,OAAS,aAAe,iBACnDK,EAAoBL,IAAU,OAAS,WAAa,eAE1D,OACEZ,EAAC,OACC,IAAKe,EACL,UAAWX,EACT,8GACAS,CACF,EACA,MAAO,CAAE,gBAAiB,OAAOJ,CAAU,GAAI,EAG/C,UAAAT,EAAC,OAAI,UAAU,qDACb,UAAAA,EAAC,OAAI,UAAU,0BACb,UAAAD,EAAC,MAAG,UAAWK,EACb,oFACAY,CACF,EACG,SAAAT,EACH,EACAR,EAAC,KAAE,UAAWK,EACZ,4EACAY,CACF,EACG,SAAAR,EACH,GACF,EAGAR,EAAC,OAAI,UAAU,0BACZ,UAAAW,GACCZ,EAACG,EAAA,CACC,KAAK,KACL,QAAQ,UACR,MAAOU,EACP,UAAU,6BACT,GAAGD,EAEH,SAAAA,EAAgB,KACnB,EAEDD,GACCX,EAACG,EAAA,CACC,KAAK,KACL,QAAQ,YACR,MAAOU,EACN,GAAGF,EACJ,UAAU,sGAET,SAAAA,EAAc,KACjB,GAEJ,GACF,EAGCI,EAAS,OAAS,GACjBf,EAAC,OAAI,UAAU,mDACZ,SAAAe,EAAS,IAAI,CAACI,EAASC,IACtBnB,EAACC,EAAM,SAAN,CACC,UAAAF,EAACI,EAAA,CACC,UAAWC,EACT,gFACAQ,IAAU,OAAS,aAAe,gBACpC,EAEC,SAAAM,EAAQ,MACX,EACCC,EAAQL,EAAS,OAAS,GACzBf,EAAC,OAAI,UAAWK,EAAG,WAAYa,CAAiB,EAAG,IAVlCE,CAYrB,CACD,EACH,GAEJ,CAEJ,CACF,EAEAb,EAAW,YAAc,aAEzB,IAAOc,EAAQf,EAAWC,CAAU",
   "names": ["jsx", "jsxs", "React", "Button", "Text", "cn", "withStyles", "HeroBanner", "title", "subtitle", "background", "primaryButton", "secondaryButton", "theme", "className", "products", "ref", "textColorClass", "dividerColorClass", "product", "index", "HeroBanner_default"]
 }

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

@@ -1,7 +1,7 @@
 import * as React from 'react';
 import { type VariantProps } from 'class-variance-authority';
 declare const badgeVariants: (props?: ({
-    size?: "sm" | "base" | null | undefined;
+    size?: "sm" | "lg" | null | undefined;
 } & import("class-variance-authority/dist/types.js").ClassProp) | undefined) => string;
 export interface BadgeProps extends React.HTMLAttributes<HTMLDivElement>, VariantProps<typeof badgeVariants> {
 }

package/dist/esm/components/badge.js

@@ -1,2 +1,2 @@
-import{jsx as o}from"react/jsx-runtime";import"react";import{cva as a}from"class-variance-authority";import{cn as n}from"../helpers/index.js";const s=a("inline-flex justify-center text-btn-primary border-btn-primary items-center font-medium rounded-[20px] border px-[10px] py-1 text-xs transition-colors focus:outline-none",{variants:{size:{sm:"text-xs",base:"text-sm"}},defaultVariants:{size:"base"}});function i({className:t,size:e,...r}){return o("div",{className:n(s({size:e}),t),...r})}var f=i;export{f as default};
+import{jsx as p}from"react/jsx-runtime";import"react";import{cva as a}from"class-variance-authority";import{cn as i}from"../helpers/index.js";const n=a("inline-flex justify-center rounded-[16px] font-bold text-btn-primary border-btn-primary border-[1.6px] items-center text-xs transition-colors focus:outline-none backdrop-blur-sm",{variants:{size:{sm:"px-[6px] py-[4px] text-[14px] leading-tight",lg:"px-[8px] py-[4px] text-[16px] leading-tight"}},defaultVariants:{size:"lg"}});function o({className:t,size:e,...r}){return p("div",{className:i(n({size:e}),t),...r})}var l=o;export{l as default};
 //# sourceMappingURL=badge.js.map

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

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../src/components/badge.tsx"],
-  "sourcesContent": ["import * as React from 'react'\nimport { type VariantProps, cva } from 'class-variance-authority'\n\nimport { cn } from '../helpers/index.js'\n\nconst badgeVariants = cva(\n  'inline-flex justify-center text-btn-primary border-btn-primary items-center font-medium rounded-[20px] border px-[10px] py-1 text-xs transition-colors focus:outline-none',\n  {\n    variants: {\n      size: {\n        sm: 'text-xs',\n        base: 'text-sm',\n      }\n    },\n    defaultVariants: {\n      size: 'base',\n    },\n  }\n)\n\nexport interface BadgeProps extends React.HTMLAttributes<HTMLDivElement>, VariantProps<typeof badgeVariants> { }\n\nfunction Badge({ className, size, ...props }: BadgeProps) {\n  return <div className={cn(badgeVariants({ size }), className)} {...props} />\n}\n\nexport default Badge\n"],
-  "mappings": "AAuBS,cAAAA,MAAA,oBAvBT,MAAuB,QACvB,OAA4B,OAAAC,MAAW,2BAEvC,OAAS,MAAAC,MAAU,sBAEnB,MAAMC,EAAgBF,EACpB,4KACA,CACE,SAAU,CACR,KAAM,CACJ,GAAI,UACJ,KAAM,SACR,CACF,EACA,gBAAiB,CACf,KAAM,MACR,CACF,CACF,EAIA,SAASG,EAAM,CAAE,UAAAC,EAAW,KAAAC,EAAM,GAAGC,CAAM,EAAe,CACxD,OAAOP,EAAC,OAAI,UAAWE,EAAGC,EAAc,CAAE,KAAAG,CAAK,CAAC,EAAGD,CAAS,EAAI,GAAGE,EAAO,CAC5E,CAEA,IAAOC,EAAQJ",
+  "sourcesContent": ["import * as React from 'react'\nimport { type VariantProps, cva } from 'class-variance-authority'\n\nimport { cn } from '../helpers/index.js'\n\nconst badgeVariants = cva(\n  'inline-flex justify-center rounded-[16px] font-bold text-btn-primary border-btn-primary border-[1.6px] items-center text-xs transition-colors focus:outline-none backdrop-blur-sm',\n  {\n    variants: {\n      size: {\n        sm: 'px-[6px] py-[4px] text-[14px] leading-tight',\n        lg: 'px-[8px] py-[4px] text-[16px] leading-tight',\n      }\n    },\n    defaultVariants: {\n      size: 'lg',\n    },\n  }\n)\n\nexport interface BadgeProps extends React.HTMLAttributes<HTMLDivElement>, VariantProps<typeof badgeVariants> { }\n\nfunction Badge({ className, size, ...props }: BadgeProps) {\n  return <div className={cn(badgeVariants({ size }), className)} {...props} />\n}\n\nexport default Badge\n"],
+  "mappings": "AAuBS,cAAAA,MAAA,oBAvBT,MAAuB,QACvB,OAA4B,OAAAC,MAAW,2BAEvC,OAAS,MAAAC,MAAU,sBAEnB,MAAMC,EAAgBF,EACpB,oLACA,CACE,SAAU,CACR,KAAM,CACJ,GAAI,8CACJ,GAAI,6CACN,CACF,EACA,gBAAiB,CACf,KAAM,IACR,CACF,CACF,EAIA,SAASG,EAAM,CAAE,UAAAC,EAAW,KAAAC,EAAM,GAAGC,CAAM,EAAe,CACxD,OAAOP,EAAC,OAAI,UAAWE,EAAGC,EAAc,CAAE,KAAAG,CAAK,CAAC,EAAGD,CAAS,EAAI,GAAGE,EAAO,CAC5E,CAEA,IAAOC,EAAQJ",
   "names": ["jsx", "cva", "cn", "badgeVariants", "Badge", "className", "size", "props", "badge_default"]
 }

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

@@ -4,7 +4,7 @@ import { type VariantProps } from 'class-variance-authority';
  * Button Variants
  */
 declare const buttonVariants: (props?: ({
-    variant?: "link" | "nature" | "primary" | "secondary" | "ghost" | null | undefined;
+    variant?: "link" | "primary" | "secondary" | "ghost" | null | undefined;
     size?: "sm" | "base" | "lg" | "icon" | null | undefined;
     hoverEffect?: "none" | "slide" | null | undefined;
     state?: "default" | "disabled" | "loading" | null | undefined;

package/dist/esm/components/button.js

@@ -1,2 +1,2 @@
-"use client";import{Fragment as V,jsx as e,jsxs as B}from"react/jsx-runtime";import*as m from"react";import{Slot as y}from"@radix-ui/react-slot";import{VisuallyHidden as g}from"@radix-ui/react-visually-hidden";import{cva as i}from"class-variance-authority";import v from"../icons/spinner.js";import{cn as h}from"../helpers/index.js";const x=i("ring-offset-background focus-visible:ring-ring rounded-btn inline-flex items-center justify-center text-sm font-medium transition-colors focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-offset-2 disabled:pointer-events-none",{variants:{variant:{nature:"border border-solid border-black",primary:"bg-btn-primary text-btn-primary-foreground hover:bg-btn-primary-active",secondary:"bg-btn-secondary text-btn-secondary-foreground hover:bg-btn-secondary-active hover:text-btn-secondary border border-solid",link:"text-primary underline-offset-4 hover:underline",ghost:"hover:bg-btn-primary hover:text-btn-primary-foreground"},size:{sm:"px-3 py-2 text-[12px]  leading-tight",base:"px-5 pt-[11px] pb-[10px] text-[14px]  leading-tight",lg:"px-7 pt-[15px] pb-[14px] text-[16px]  leading-tight",icon:"size-10 rounded-full  leading-tight"},hoverEffect:{none:"",slide:""},state:{default:"",disabled:"",loading:""},theme:{dark:"",light:""}},compoundVariants:[{variant:"primary",hoverEffect:"slide",class:'z-[1] before:-z-[1] before:rounded-btn hover:!bg-btn-primary before:bg-btn-primary-active relative overflow-hidden before:absolute before:inset-y-0  before:w-full before:-translate-x-full before:transition-transform before:duration-300 before:ease-in-out before:content-[""] hover:before:translate-x-0'},{variant:"secondary",hoverEffect:"slide",class:'z-[1] before:-z-[1] before:rounded-btn hover:!bg-btn-secondary before:bg-btn-secondary-active relative overflow-hidden before:absolute before:inset-y-0  before:w-full before:-translate-x-full before:transition-transform before:duration-300 before:ease-in-out before:content-[""] hover:before:translate-x-0'},{variant:"primary",state:"loading",class:"bg-btn-primary"},{variant:"secondary",state:"loading",class:"bg-btn-secondary disabled:bg-btn-secondary-disabled disabled:text-btn-secondary-disabled-foreground"},{variant:"primary",state:"disabled",class:"disabled:bg-btn-primary-disabled disabled:text-btn-primary-disabled-foreground"},{variant:"secondary",state:"disabled",class:"disabled:bg-btn-secondary-disabled disabled:text-btn-secondary-disabled-foreground"},{variant:"nature",theme:"dark",class:"bg-transparent text-info-primary"},{variant:"nature",theme:"light",class:"bg-info-primary text-info-white"}],defaultVariants:{variant:"primary",size:"base",hoverEffect:"none",state:"default",theme:"light"}}),k=i("",{variants:{variant:{nature:"stroke-btn-primary-foreground",primary:"stroke-btn-primary-foreground",secondary:"stroke-btn-secondary-foreground",link:"stroke-primary",ghost:"stroke-primary"}},defaultVariants:{variant:"primary"}}),s=m.forwardRef(({asChild:d=!1,size:b="base",children:t,variant:a,theme:l="light",hoverEffect:f="none",className:p,disabled:n=!1,loading:r=!1,spinner:o,...c},u)=>e(d?y:"button",{disabled:n||r,className:h(x({variant:a,size:b,hoverEffect:f,state:r?"loading":n?"disabled":"default",theme:l}),p),ref:u,...c,children:r?B(V,{children:[e("span",{style:{display:"contents",visibility:"hidden"},"aria-hidden":!0,children:t}),e("span",{className:"absolute",children:o||e(v,{className:k({variant:a})})}),e(g,{children:t})]}):t}));s.displayName="Button";var L=s;export{L as default};
+"use client";import{Fragment as w,jsx as e,jsxs as V}from"react/jsx-runtime";import*as y from"react";import{Slot as v}from"@radix-ui/react-slot";import{VisuallyHidden as g}from"@radix-ui/react-visually-hidden";import{cva as s}from"class-variance-authority";import u from"../icons/spinner.js";import{cn as h}from"../helpers/index.js";const x=s("ring-offset-background border-[1.6px] border-solid focus-visible:ring-ring rounded-btn inline-flex items-center justify-center text-sm font-medium transition-colors focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-offset-2 disabled:pointer-events-none",{variants:{variant:{primary:"bg-btn-primary text-btn-primary-foreground hover:bg-btn-primary-active",secondary:"bg-btn-secondary border-info-primary text-btn-secondary-foreground hover:bg-btn-secondary-active hover:text-btn-secondary border border-solid",link:"text-info-primary underline-offset-4 hover:underline border-none hover:text-btn-primary-active",ghost:"hover:bg-btn-primary hover:text-btn-primary-foreground"},size:{sm:"px-3 py-2 text-[12px]  leading-tight",base:"px-5 pt-[11px] pb-[10px] text-[14px] leading-tight",lg:"px-7 pt-[15px] pb-[14px] text-[16px]  leading-tight",icon:"size-10 rounded-full  leading-tight"},hoverEffect:{none:"",slide:""},state:{default:"",disabled:"",loading:""},theme:{dark:"",light:""}},compoundVariants:[{variant:"primary",hoverEffect:"slide",class:'z-[1] before:-z-[1] before:rounded-btn hover:!bg-btn-primary before:bg-btn-primary-active relative overflow-hidden before:absolute before:inset-y-0 before:w-full before:-translate-x-full before:transition-transform before:duration-300 before:ease-in-out before:content-[""] hover:before:translate-x-0'},{variant:"secondary",hoverEffect:"slide",class:'z-[1] before:-z-[1] before:rounded-btn hover:!bg-btn-secondary before:bg-btn-secondary-active relative overflow-hidden before:absolute before:inset-y-0  before:w-full before:-translate-x-full before:transition-transform before:duration-300 before:ease-in-out before:content-[""] hover:before:translate-x-0'},{variant:"primary",state:"loading",class:"bg-btn-primary-active"},{variant:"secondary",state:"loading",class:"bg-btn-secondary disabled:bg-btn-secondary-disabled disabled:text-btn-secondary-disabled-foreground"},{variant:"primary",state:"disabled",class:"disabled:bg-btn-primary-disabled disabled:text-btn-primary-disabled-foreground"},{variant:"secondary",state:"disabled",class:"disabled:bg-btn-secondary-disabled disabled:text-btn-secondary-disabled-foreground disabled:border-btn-secondary-disabled-border"},{variant:"secondary",theme:"dark",class:"text-info-white bg-info-primary hover:border-info-white hover:text-info-primary hover:bg-info-white"},{variant:"secondary",theme:"dark",state:"loading",class:"bg-btn-info-white text-info-primary border-info-white"},{variant:"secondary",theme:"dark",state:"disabled",class:"disabled:bg-text-info-quaternary disabled:text-info-white"},{variant:"link",state:"disabled",class:"disabled:text-info-quaternary"},{variant:"primary",theme:"dark",class:"text-info-primary hover:text-info-white bg-info-white hover:border-brand-0"},{variant:"primary",theme:"dark",state:"loading",class:"bg-btn-primary-active text-info-white border-brand-0"},{variant:"secondary",theme:"dark",class:"border-info-white"},{variant:"secondary",theme:"light",class:""},{variant:"link",theme:"dark",class:"text-info-white"}],defaultVariants:{variant:"primary",size:"base",hoverEffect:"none",state:"default",theme:"light"}}),k=s("",{variants:{variant:{primary:"stroke-btn-primary-foreground",secondary:"stroke-btn-secondary-foreground",link:"stroke-primary",ghost:"stroke-primary"},theme:{dark:"",light:""}},defaultVariants:{variant:"primary",theme:"light"}}),d=y.forwardRef(({asChild:b=!1,size:l="base",children:t,variant:a,theme:n="light",hoverEffect:f="none",className:c,disabled:o=!1,loading:r=!1,spinner:i,...p},m)=>e(b?v:"button",{disabled:o||r,className:h(x({variant:a,size:l,hoverEffect:f,state:r?"loading":o?"disabled":"default",theme:n}),c),ref:m,...p,children:r?V(w,{children:[e("span",{style:{display:"contents",visibility:"hidden"},"aria-hidden":!0,children:t}),e("span",{className:"absolute",children:i||e(u,{className:k({variant:a,theme:n})})}),e(g,{children:t})]}):t}));d.displayName="Button";var L=d;export{L as default};
 //# sourceMappingURL=button.js.map

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

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../src/components/button.tsx"],
-  "sourcesContent": ["'use client'\n\nimport * as React from 'react'\nimport { Slot } from '@radix-ui/react-slot'\nimport { VisuallyHidden } from '@radix-ui/react-visually-hidden'\nimport { type VariantProps, cva } from 'class-variance-authority'\nimport Spinner from '../icons/spinner.js'\nimport { cn } from '../helpers/index.js'\n\n/**\n * Button Variants\n */\nconst buttonVariants = cva(\n  'ring-offset-background focus-visible:ring-ring rounded-btn inline-flex items-center justify-center text-sm font-medium transition-colors focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-offset-2 disabled:pointer-events-none',\n  {\n    variants: {\n      variant: {\n        nature: 'border border-solid border-black',\n        primary: 'bg-btn-primary text-btn-primary-foreground hover:bg-btn-primary-active',\n        secondary:\n          'bg-btn-secondary text-btn-secondary-foreground hover:bg-btn-secondary-active hover:text-btn-secondary border border-solid',\n        link: 'text-primary underline-offset-4 hover:underline',\n        ghost: 'hover:bg-btn-primary hover:text-btn-primary-foreground',\n      },\n      size: {\n        sm: 'px-3 py-2 text-[12px]  leading-tight',\n        base: 'px-5 pt-[11px] pb-[10px] text-[14px]  leading-tight',\n        lg: 'px-7 pt-[15px] pb-[14px] text-[16px]  leading-tight',\n        icon: 'size-10 rounded-full  leading-tight',\n      },\n      /** hover \u72B6\u6001\u4E0B\u7684\u52A8\u753B\u6548\u679C,\u9700\u8981\u6CE8\u610F\u4E0D\u540Cvariant \u4E0B\u7684\u6548\u679C */\n      hoverEffect: {\n        none: '',\n        slide: '',\n      },\n      state: {\n        default: '',\n        disabled: '',\n        loading: '',\n      },\n      theme: {\n        dark: '',\n        light: '',\n      },\n    },\n    compoundVariants: [\n      {\n        variant: 'primary',\n        hoverEffect: 'slide',\n        class:\n          'z-[1] before:-z-[1] before:rounded-btn hover:!bg-btn-primary before:bg-btn-primary-active relative overflow-hidden before:absolute before:inset-y-0  before:w-full before:-translate-x-full before:transition-transform before:duration-300 before:ease-in-out before:content-[\"\"] hover:before:translate-x-0',\n      },\n      {\n        variant: 'secondary',\n        hoverEffect: 'slide',\n        class:\n          'z-[1] before:-z-[1] before:rounded-btn hover:!bg-btn-secondary before:bg-btn-secondary-active relative overflow-hidden before:absolute before:inset-y-0  before:w-full before:-translate-x-full before:transition-transform before:duration-300 before:ease-in-out before:content-[\"\"] hover:before:translate-x-0',\n      },\n      {\n        variant: 'primary',\n        state: 'loading',\n        class: 'bg-btn-primary',\n      },\n      {\n        variant: 'secondary',\n        state: 'loading',\n        class: 'bg-btn-secondary disabled:bg-btn-secondary-disabled disabled:text-btn-secondary-disabled-foreground',\n      },\n      {\n        variant: 'primary',\n        state: 'disabled',\n        class: 'disabled:bg-btn-primary-disabled disabled:text-btn-primary-disabled-foreground',\n      },\n      {\n        variant: 'secondary',\n        state: 'disabled',\n        class: 'disabled:bg-btn-secondary-disabled disabled:text-btn-secondary-disabled-foreground',\n      },\n      {\n        variant: 'nature',\n        theme: 'dark',\n        class: 'bg-transparent text-info-primary',\n      },\n      {\n        variant: 'nature',\n        theme: 'light',\n        class: 'bg-info-primary text-info-white',\n      },\n    ],\n    defaultVariants: {\n      variant: 'primary',\n      size: 'base',\n      hoverEffect: 'none',\n      state: 'default',\n      theme: 'light',\n    },\n  }\n)\n\nconst loadingSvgVariants = cva('', {\n  variants: {\n    variant: {\n      nature: 'stroke-btn-primary-foreground',\n      primary: 'stroke-btn-primary-foreground',\n      secondary: 'stroke-btn-secondary-foreground',\n      link: 'stroke-primary',\n      ghost: 'stroke-primary',\n    },\n  },\n  defaultVariants: {\n    variant: 'primary',\n  },\n})\n\nexport interface ButtonProps\n  extends React.ButtonHTMLAttributes<HTMLButtonElement>,\n  VariantProps<typeof buttonVariants> {\n  /** \u8BBE\u7F6E\u6309\u94AE\u8F7D\u5165\u72B6\u6001  */\n  loading?: boolean\n  /** \u8BBE\u7F6E\u6309\u94AE\u5931\u6548\u72B6\u6001  */\n  disabled?: boolean\n  /** \u5B9A\u4E49\u81EA\u7EC4\u4EF6\u4F5C\u4E3A\u7236\u7EC4\u4EF6\u7684\u7C7B\u578B\uFF0C \u8BE6\u7EC6\u4F7F\u7528\u65B9\u5F0F\u8BF7\u53C2\u8003radix-ui */\n  asChild?: boolean\n  /** \u81EA\u5B9A\u4E49loading  */\n  spinner?: React.ReactNode\n}\n\nconst Button = React.forwardRef<HTMLButtonElement, ButtonProps>(\n  (\n    {\n      asChild = false,\n      size = 'base',\n      children,\n      variant,\n      theme = 'light',\n      hoverEffect = 'none',\n      className,\n      disabled = false,\n      loading = false,\n      spinner,\n      ...props\n    }: ButtonProps,\n    ref\n  ) => {\n    const Comp = asChild ? Slot : 'button'\n    const isInactive = disabled || loading\n    const state = loading ? 'loading' : disabled ? 'disabled' : 'default'\n\n    return (\n      <Comp\n        disabled={isInactive}\n        className={cn(buttonVariants({ variant, size, hoverEffect, state, theme }), className)}\n        ref={ref}\n        {...props}\n      >\n        {loading ? (\n          <>\n            <span style={{ display: 'contents', visibility: 'hidden' }} aria-hidden>\n              {children}\n            </span>\n            <span className=\"absolute\">\n              {spinner ? (\n                spinner\n              ) : (\n                <Spinner\n                  className={loadingSvgVariants({\n                    variant,\n                  })}\n                />\n              )}\n            </span>\n            <VisuallyHidden>{children}</VisuallyHidden>\n          </>\n        ) : (\n          children\n        )}\n      </Comp>\n    )\n  }\n)\n\nButton.displayName = 'Button'\nexport default Button\n"],
-  "mappings": "aA4JU,mBAAAA,EACE,OAAAC,EADF,QAAAC,MAAA,oBA1JV,UAAYC,MAAW,QACvB,OAAS,QAAAC,MAAY,uBACrB,OAAS,kBAAAC,MAAsB,kCAC/B,OAA4B,OAAAC,MAAW,2BACvC,OAAOC,MAAa,sBACpB,OAAS,MAAAC,MAAU,sBAKnB,MAAMC,EAAiBH,EACrB,oPACA,CACE,SAAU,CACR,QAAS,CACP,OAAQ,mCACR,QAAS,yEACT,UACE,4HACF,KAAM,kDACN,MAAO,wDACT,EACA,KAAM,CACJ,GAAI,uCACJ,KAAM,sDACN,GAAI,sDACJ,KAAM,qCACR,EAEA,YAAa,CACX,KAAM,GACN,MAAO,EACT,EACA,MAAO,CACL,QAAS,GACT,SAAU,GACV,QAAS,EACX,EACA,MAAO,CACL,KAAM,GACN,MAAO,EACT,CACF,EACA,iBAAkB,CAChB,CACE,QAAS,UACT,YAAa,QACb,MACE,+SACJ,EACA,CACE,QAAS,YACT,YAAa,QACb,MACE,mTACJ,EACA,CACE,QAAS,UACT,MAAO,UACP,MAAO,gBACT,EACA,CACE,QAAS,YACT,MAAO,UACP,MAAO,qGACT,EACA,CACE,QAAS,UACT,MAAO,WACP,MAAO,gFACT,EACA,CACE,QAAS,YACT,MAAO,WACP,MAAO,oFACT,EACA,CACE,QAAS,SACT,MAAO,OACP,MAAO,kCACT,EACA,CACE,QAAS,SACT,MAAO,QACP,MAAO,iCACT,CACF,EACA,gBAAiB,CACf,QAAS,UACT,KAAM,OACN,YAAa,OACb,MAAO,UACP,MAAO,OACT,CACF,CACF,EAEMI,EAAqBJ,EAAI,GAAI,CACjC,SAAU,CACR,QAAS,CACP,OAAQ,gCACR,QAAS,gCACT,UAAW,kCACX,KAAM,iBACN,MAAO,gBACT,CACF,EACA,gBAAiB,CACf,QAAS,SACX,CACF,CAAC,EAeKK,EAASR,EAAM,WACnB,CACE,CACE,QAAAS,EAAU,GACV,KAAAC,EAAO,OACP,SAAAC,EACA,QAAAC,EACA,MAAAC,EAAQ,QACR,YAAAC,EAAc,OACd,UAAAC,EACA,SAAAC,EAAW,GACX,QAAAC,EAAU,GACV,QAAAC,EACA,GAAGC,CACL,EACAC,IAOEtB,EALWW,EAAUR,EAAO,SAK3B,CACC,SALee,GAAYC,EAM3B,UAAWZ,EAAGC,EAAe,CAAE,QAAAM,EAAS,KAAAF,EAAM,YAAAI,EAAa,MALjDG,EAAU,UAAYD,EAAW,WAAa,UAKU,MAAAH,CAAM,CAAC,EAAGE,CAAS,EACrF,IAAKK,EACJ,GAAGD,EAEH,SAAAF,EACClB,EAAAF,EAAA,CACE,UAAAC,EAAC,QAAK,MAAO,CAAE,QAAS,WAAY,WAAY,QAAS,EAAG,cAAW,GACpE,SAAAa,EACH,EACAb,EAAC,QAAK,UAAU,WACb,SAAAoB,GAGCpB,EAACM,EAAA,CACC,UAAWG,EAAmB,CAC5B,QAAAK,CACF,CAAC,EACH,EAEJ,EACAd,EAACI,EAAA,CAAgB,SAAAS,EAAS,GAC5B,EAEAA,EAEJ,CAGN,EAEAH,EAAO,YAAc,SACrB,IAAOa,EAAQb",
+  "sourcesContent": ["'use client'\n\nimport * as React from 'react'\nimport { Slot } from '@radix-ui/react-slot'\nimport { VisuallyHidden } from '@radix-ui/react-visually-hidden'\nimport { type VariantProps, cva } from 'class-variance-authority'\nimport Spinner from '../icons/spinner.js'\nimport { cn } from '../helpers/index.js'\n\n/**\n * Button Variants\n */\nconst buttonVariants = cva(\n  'ring-offset-background border-[1.6px] border-solid focus-visible:ring-ring rounded-btn inline-flex items-center justify-center text-sm font-medium transition-colors focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-offset-2 disabled:pointer-events-none',\n  {\n    variants: {\n      variant: {\n        primary: 'bg-btn-primary text-btn-primary-foreground hover:bg-btn-primary-active',\n        secondary:\n          'bg-btn-secondary border-info-primary text-btn-secondary-foreground hover:bg-btn-secondary-active hover:text-btn-secondary border border-solid',\n        link: 'text-info-primary underline-offset-4 hover:underline border-none hover:text-btn-primary-active',\n        ghost: 'hover:bg-btn-primary hover:text-btn-primary-foreground',\n      },\n      size: {\n        sm: 'px-3 py-2 text-[12px]  leading-tight',\n        base: 'px-5 pt-[11px] pb-[10px] text-[14px] leading-tight',\n        lg: 'px-7 pt-[15px] pb-[14px] text-[16px]  leading-tight',\n        icon: 'size-10 rounded-full  leading-tight',\n      },\n      /** hover \u72B6\u6001\u4E0B\u7684\u52A8\u753B\u6548\u679C,\u9700\u8981\u6CE8\u610F\u4E0D\u540Cvariant \u4E0B\u7684\u6548\u679C */\n      hoverEffect: {\n        none: '',\n        slide: '',\n      },\n      state: {\n        default: '',\n        disabled: '',\n        loading: '',\n      },\n      theme: {\n        dark: '',\n        light: '',\n      },\n    },\n    compoundVariants: [\n      {\n        variant: 'primary',\n        hoverEffect: 'slide',\n        class:\n          'z-[1] before:-z-[1] before:rounded-btn hover:!bg-btn-primary before:bg-btn-primary-active relative overflow-hidden before:absolute before:inset-y-0 before:w-full before:-translate-x-full before:transition-transform before:duration-300 before:ease-in-out before:content-[\"\"] hover:before:translate-x-0',\n      },\n      {\n        variant: 'secondary',\n        hoverEffect: 'slide',\n        class:\n          'z-[1] before:-z-[1] before:rounded-btn hover:!bg-btn-secondary before:bg-btn-secondary-active relative overflow-hidden before:absolute before:inset-y-0  before:w-full before:-translate-x-full before:transition-transform before:duration-300 before:ease-in-out before:content-[\"\"] hover:before:translate-x-0',\n      },\n      {\n        variant: 'primary',\n        state: 'loading',\n        class: 'bg-btn-primary-active',\n      },\n      {\n        variant: 'secondary',\n        state: 'loading',\n        class: 'bg-btn-secondary disabled:bg-btn-secondary-disabled disabled:text-btn-secondary-disabled-foreground',\n      },\n      {\n        variant: 'primary',\n        state: 'disabled',\n        class: 'disabled:bg-btn-primary-disabled disabled:text-btn-primary-disabled-foreground',\n      },\n      {\n        variant: 'secondary',\n        state: 'disabled',\n        class: 'disabled:bg-btn-secondary-disabled disabled:text-btn-secondary-disabled-foreground disabled:border-btn-secondary-disabled-border',\n      },\n      {\n        variant: 'secondary',\n        theme: 'dark',\n        class: 'text-info-white bg-info-primary hover:border-info-white hover:text-info-primary hover:bg-info-white',\n      },\n      {\n        variant: 'secondary',\n        theme: 'dark',\n        state: 'loading',\n        class: 'bg-btn-info-white text-info-primary border-info-white',\n      },\n      {\n        variant: 'secondary',\n        theme: 'dark',\n        state: 'disabled',\n        class: 'disabled:bg-text-info-quaternary disabled:text-info-white',\n      },\n      {\n        variant: 'link',\n        state: 'disabled',\n        class: 'disabled:text-info-quaternary',\n      },\n      {\n        variant: 'primary',\n        theme: 'dark',\n        class: 'text-info-primary hover:text-info-white bg-info-white hover:border-brand-0',\n      },\n      {\n        variant: 'primary',\n        theme: 'dark',\n        state: 'loading',\n        class: 'bg-btn-primary-active text-info-white border-brand-0', \n      },\n      {\n        variant: 'secondary',\n        theme: 'dark',\n        class: 'border-info-white',\n      },\n      {\n        variant: 'secondary',\n        theme: 'light',\n        class: '',\n      },\n      {\n        variant: 'link',\n        theme: 'dark',\n        class: 'text-info-white',\n      },\n    ],\n    defaultVariants: {\n      variant: 'primary',\n      size: 'base',\n      hoverEffect: 'none',\n      state: 'default',\n      theme: 'light',\n    },\n  }\n)\n\nconst loadingSvgVariants = cva('', {\n  variants: {\n    variant: {\n      primary: 'stroke-btn-primary-foreground',\n      secondary: 'stroke-btn-secondary-foreground',\n      link: 'stroke-primary',\n      ghost: 'stroke-primary',\n    },\n    theme: {\n      dark: '',\n      light: '',\n    },\n  },\n  defaultVariants: {\n    variant: 'primary',\n    theme: 'light',\n  },\n})\n\nexport interface ButtonProps\n  extends React.ButtonHTMLAttributes<HTMLButtonElement>,\n  VariantProps<typeof buttonVariants> {\n  /** \u8BBE\u7F6E\u6309\u94AE\u8F7D\u5165\u72B6\u6001  */\n  loading?: boolean\n  /** \u8BBE\u7F6E\u6309\u94AE\u5931\u6548\u72B6\u6001  */\n  disabled?: boolean\n  /** \u5B9A\u4E49\u81EA\u7EC4\u4EF6\u4F5C\u4E3A\u7236\u7EC4\u4EF6\u7684\u7C7B\u578B\uFF0C \u8BE6\u7EC6\u4F7F\u7528\u65B9\u5F0F\u8BF7\u53C2\u8003radix-ui */\n  asChild?: boolean\n  /** \u81EA\u5B9A\u4E49loading  */\n  spinner?: React.ReactNode\n}\n\nconst Button = React.forwardRef<HTMLButtonElement, ButtonProps>(\n  (\n    {\n      asChild = false,\n      size = 'base',\n      children,\n      variant,\n      theme = 'light',\n      hoverEffect = 'none',\n      className,\n      disabled = false,\n      loading = false,\n      spinner,\n      ...props\n    }: ButtonProps,\n    ref\n  ) => {\n    const Comp = asChild ? Slot : 'button'\n    const isInactive = disabled || loading\n    const state = loading ? 'loading' : disabled ? 'disabled' : 'default'\n\n    return (\n      <Comp\n        disabled={isInactive}\n        className={cn(buttonVariants({ variant, size, hoverEffect, state, theme }), className)}\n        ref={ref}\n        {...props}\n      >\n        {loading ? (\n          <>\n            <span style={{ display: 'contents', visibility: 'hidden' }} aria-hidden>\n              {children}\n            </span>\n            <span className=\"absolute\">\n              {spinner ? (\n                spinner\n              ) : (\n                <Spinner\n                  className={loadingSvgVariants({\n                    variant,\n                    theme,\n                  })}\n                />\n              )}\n            </span>\n            <VisuallyHidden>{children}</VisuallyHidden>\n          </>\n        ) : (\n          children\n        )}\n      </Comp>\n    )\n  }\n)\n\nButton.displayName = 'Button'\nexport default Button\n"],
+  "mappings": "aAqMU,mBAAAA,EACE,OAAAC,EADF,QAAAC,MAAA,oBAnMV,UAAYC,MAAW,QACvB,OAAS,QAAAC,MAAY,uBACrB,OAAS,kBAAAC,MAAsB,kCAC/B,OAA4B,OAAAC,MAAW,2BACvC,OAAOC,MAAa,sBACpB,OAAS,MAAAC,MAAU,sBAKnB,MAAMC,EAAiBH,EACrB,gRACA,CACE,SAAU,CACR,QAAS,CACP,QAAS,yEACT,UACE,gJACF,KAAM,iGACN,MAAO,wDACT,EACA,KAAM,CACJ,GAAI,uCACJ,KAAM,qDACN,GAAI,sDACJ,KAAM,qCACR,EAEA,YAAa,CACX,KAAM,GACN,MAAO,EACT,EACA,MAAO,CACL,QAAS,GACT,SAAU,GACV,QAAS,EACX,EACA,MAAO,CACL,KAAM,GACN,MAAO,EACT,CACF,EACA,iBAAkB,CAChB,CACE,QAAS,UACT,YAAa,QACb,MACE,8SACJ,EACA,CACE,QAAS,YACT,YAAa,QACb,MACE,mTACJ,EACA,CACE,QAAS,UACT,MAAO,UACP,MAAO,uBACT,EACA,CACE,QAAS,YACT,MAAO,UACP,MAAO,qGACT,EACA,CACE,QAAS,UACT,MAAO,WACP,MAAO,gFACT,EACA,CACE,QAAS,YACT,MAAO,WACP,MAAO,kIACT,EACA,CACE,QAAS,YACT,MAAO,OACP,MAAO,qGACT,EACA,CACE,QAAS,YACT,MAAO,OACP,MAAO,UACP,MAAO,uDACT,EACA,CACE,QAAS,YACT,MAAO,OACP,MAAO,WACP,MAAO,2DACT,EACA,CACE,QAAS,OACT,MAAO,WACP,MAAO,+BACT,EACA,CACE,QAAS,UACT,MAAO,OACP,MAAO,4EACT,EACA,CACE,QAAS,UACT,MAAO,OACP,MAAO,UACP,MAAO,sDACT,EACA,CACE,QAAS,YACT,MAAO,OACP,MAAO,mBACT,EACA,CACE,QAAS,YACT,MAAO,QACP,MAAO,EACT,EACA,CACE,QAAS,OACT,MAAO,OACP,MAAO,iBACT,CACF,EACA,gBAAiB,CACf,QAAS,UACT,KAAM,OACN,YAAa,OACb,MAAO,UACP,MAAO,OACT,CACF,CACF,EAEMI,EAAqBJ,EAAI,GAAI,CACjC,SAAU,CACR,QAAS,CACP,QAAS,gCACT,UAAW,kCACX,KAAM,iBACN,MAAO,gBACT,EACA,MAAO,CACL,KAAM,GACN,MAAO,EACT,CACF,EACA,gBAAiB,CACf,QAAS,UACT,MAAO,OACT,CACF,CAAC,EAeKK,EAASR,EAAM,WACnB,CACE,CACE,QAAAS,EAAU,GACV,KAAAC,EAAO,OACP,SAAAC,EACA,QAAAC,EACA,MAAAC,EAAQ,QACR,YAAAC,EAAc,OACd,UAAAC,EACA,SAAAC,EAAW,GACX,QAAAC,EAAU,GACV,QAAAC,EACA,GAAGC,CACL,EACAC,IAOEtB,EALWW,EAAUR,EAAO,SAK3B,CACC,SALee,GAAYC,EAM3B,UAAWZ,EAAGC,EAAe,CAAE,QAAAM,EAAS,KAAAF,EAAM,YAAAI,EAAa,MALjDG,EAAU,UAAYD,EAAW,WAAa,UAKU,MAAAH,CAAM,CAAC,EAAGE,CAAS,EACrF,IAAKK,EACJ,GAAGD,EAEH,SAAAF,EACClB,EAAAF,EAAA,CACE,UAAAC,EAAC,QAAK,MAAO,CAAE,QAAS,WAAY,WAAY,QAAS,EAAG,cAAW,GACpE,SAAAa,EACH,EACAb,EAAC,QAAK,UAAU,WACb,SAAAoB,GAGCpB,EAACM,EAAA,CACC,UAAWG,EAAmB,CAC5B,QAAAK,EACA,MAAAC,CACF,CAAC,EACH,EAEJ,EACAf,EAACI,EAAA,CAAgB,SAAAS,EAAS,GAC5B,EAEAA,EAEJ,CAGN,EAEAH,EAAO,YAAc,SACrB,IAAOa,EAAQb",
   "names": ["Fragment", "jsx", "jsxs", "React", "Slot", "VisuallyHidden", "cva", "Spinner", "cn", "buttonVariants", "loadingSvgVariants", "Button", "asChild", "size", "children", "variant", "theme", "hoverEffect", "className", "disabled", "loading", "spinner", "props", "ref", "button_default"]
 }

package/dist/esm/helpers/utils.js

@@ -1,2 +1,2 @@
-import{clsx as e}from"clsx";import{extendTailwindMerge as n}from"tailwind-merge";const o=n({extend:{theme:{borderRadius:["btn"]},classGroups:{"font-size":["text-heading-1","text-heading-2","text-heading-3","text-heading-4","text-heading-5","text-text-3","text-text-2","text-text-1"],"text-color":["text-info-primary","text-info-secondary","text-info-tertiary","text-info-quaternary","text-info-white"]}}});function r(...t){return o(e(t))}function a(){}export{r as cn,a as noop};
+import{clsx as e}from"clsx";import{extendTailwindMerge as n}from"tailwind-merge";const i=n({extend:{theme:{borderRadius:["btn"]},classGroups:{"font-size":["text-heading-1","text-heading-2","text-heading-3","text-heading-4","text-heading-5","text-text-3","text-text-2","text-text-1"],"text-color":["text-info-primary","text-info-secondary","text-info-tertiary","text-info-quaternary","text-info-white"],leading:["leading-tight","leading-normal","leading-loose"]}}});function r(...t){return i(e(t))}function x(){}export{r as cn,x as noop};
 //# sourceMappingURL=utils.js.map

package/dist/esm/helpers/utils.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../src/helpers/utils.ts"],
-  "sourcesContent": ["import { clsx, type ClassValue } from 'clsx'\nimport { extendTailwindMerge } from 'tailwind-merge'\n\nconst twMerge = extendTailwindMerge({\n  extend: {\n      theme: {\n          borderRadius: ['btn'],\n      },\n      classGroups: {\n        'font-size': ['text-heading-1', 'text-heading-2', 'text-heading-3', 'text-heading-4', 'text-heading-5', 'text-text-3', 'text-text-2', 'text-text-1'], \n        'text-color': ['text-info-primary', 'text-info-secondary', 'text-info-tertiary', 'text-info-quaternary', 'text-info-white'],\n      }\n  },\n})\n\nexport function cn(...inputs: ClassValue[]) {\n  return twMerge(clsx(inputs))\n}\n\nexport function noop(): any {}\n"],
-  "mappings": "AAAA,OAAS,QAAAA,MAA6B,OACtC,OAAS,uBAAAC,MAA2B,iBAEpC,MAAMC,EAAUD,EAAoB,CAClC,OAAQ,CACJ,MAAO,CACH,aAAc,CAAC,KAAK,CACxB,EACA,YAAa,CACX,YAAa,CAAC,iBAAkB,iBAAkB,iBAAkB,iBAAkB,iBAAkB,cAAe,cAAe,aAAa,EACnJ,aAAc,CAAC,oBAAqB,sBAAuB,qBAAsB,uBAAwB,iBAAiB,CAC5H,CACJ,CACF,CAAC,EAEM,SAASE,KAAMC,EAAsB,CAC1C,OAAOF,EAAQF,EAAKI,CAAM,CAAC,CAC7B,CAEO,SAASC,GAAY,CAAC",
+  "sourcesContent": ["import { clsx, type ClassValue } from 'clsx'\nimport { extendTailwindMerge } from 'tailwind-merge'\n\nconst twMerge = extendTailwindMerge({\n  extend: {\n      theme: {\n          borderRadius: ['btn'],\n      },\n      classGroups: {\n        'font-size': ['text-heading-1', 'text-heading-2', 'text-heading-3', 'text-heading-4', 'text-heading-5', 'text-text-3', 'text-text-2', 'text-text-1'], \n        'text-color': ['text-info-primary', 'text-info-secondary', 'text-info-tertiary', 'text-info-quaternary', 'text-info-white'],\n        'leading': ['leading-tight', 'leading-normal', 'leading-loose'],\n      }\n  },\n})\n\nexport function cn(...inputs: ClassValue[]) {\n  return twMerge(clsx(inputs))\n}\n\nexport function noop(): any {}\n"],
+  "mappings": "AAAA,OAAS,QAAAA,MAA6B,OACtC,OAAS,uBAAAC,MAA2B,iBAEpC,MAAMC,EAAUD,EAAoB,CAClC,OAAQ,CACJ,MAAO,CACH,aAAc,CAAC,KAAK,CACxB,EACA,YAAa,CACX,YAAa,CAAC,iBAAkB,iBAAkB,iBAAkB,iBAAkB,iBAAkB,cAAe,cAAe,aAAa,EACnJ,aAAc,CAAC,oBAAqB,sBAAuB,qBAAsB,uBAAwB,iBAAiB,EAC1H,QAAW,CAAC,gBAAiB,iBAAkB,eAAe,CAChE,CACJ,CACF,CAAC,EAEM,SAASE,KAAMC,EAAsB,CAC1C,OAAOF,EAAQF,EAAKI,CAAM,CAAC,CAC7B,CAEO,SAASC,GAAY,CAAC",
   "names": ["clsx", "extendTailwindMerge", "twMerge", "cn", "inputs", "noop"]
 }

package/dist/esm/stories/badge.stories.d.ts

@@ -7,8 +7,23 @@ declare const meta: {
         layout: string;
     };
     tags: string[];
-    argTypes: {};
-    args: {};
+    argTypes: {
+        size: {
+            control: {
+                type: "select";
+            };
+            options: string[];
+            description: string;
+            table: {
+                defaultValue: {
+                    summary: string;
+                };
+            };
+        };
+    };
+    args: {
+        size: "lg";
+    };
 };
 export default meta;
 type Story = StoryObj<typeof meta>;

package/dist/esm/stories/badge.stories.js

@@ -1,2 +1,2 @@
-import{jsx as t,jsxs as a}from"react/jsx-runtime";import{Badge as e}from"../components/index.js";import"react";const o={title:"Components/Badge",component:e,parameters:{layout:"centered"},tags:["autodocs"],argTypes:{},args:{}};var d=o;const l={args:{children:"Badge"}},y={render(){return a("div",{className:"flex flex-col space-y-4",children:[t(e,{children:"Outline"}),t(e,{children:"Fill"})]})}};export{l as Default,y as Examples,d as default};
+import{jsx as t}from"react/jsx-runtime";import{Badge as e}from"../components/index.js";import"react";const o={title:"Components/Badge",component:e,parameters:{layout:"centered"},tags:["autodocs"],argTypes:{size:{control:{type:"select"},options:["sm","lg"],description:"Badge \u5C3A\u5BF8",table:{defaultValue:{summary:"lg"}}}},args:{size:"lg"}};var p=o;const l={args:{children:"New"}},m={render(){return t("div",{className:"flex flex-col space-y-4",children:t(e,{children:"New"})})}};export{l as Default,m as Examples,p as default};
 //# sourceMappingURL=badge.stories.js.map

package/dist/esm/stories/badge.stories.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../src/stories/badge.stories.tsx"],
-  "sourcesContent": ["import type { Meta, StoryObj } from '@storybook/react'\n\nimport { Badge } from '../components/index.js'\nimport React from 'react'\n\nconst meta = {\n  title: 'Components/Badge',\n  component: Badge,\n  parameters: {\n    layout: 'centered',\n  },\n  tags: ['autodocs'],\n  argTypes: {\n\n  },\n  args: {\n\n  },\n} satisfies Meta<typeof Badge>\n\nexport default meta\n\ntype Story = StoryObj<typeof meta>\n\nexport const Default: Story = {\n  args: {\n    children: 'Badge',\n  }\n}\n\nexport const Examples: Story = {\n  render() {\n    return (\n      <div className=\"flex flex-col space-y-4\">\n        <Badge>Outline</Badge>\n        <Badge>Fill</Badge>\n      </div>\n    )\n  },\n}\n"],
-  "mappings": "AAiCM,OACE,OAAAA,EADF,QAAAC,MAAA,oBA/BN,OAAS,SAAAC,MAAa,yBACtB,MAAkB,QAElB,MAAMC,EAAO,CACX,MAAO,mBACP,UAAWD,EACX,WAAY,CACV,OAAQ,UACV,EACA,KAAM,CAAC,UAAU,EACjB,SAAU,CAEV,EACA,KAAM,CAEN,CACF,EAEA,IAAOE,EAAQD,EAIR,MAAME,EAAiB,CAC5B,KAAM,CACJ,SAAU,OACZ,CACF,EAEaC,EAAkB,CAC7B,QAAS,CACP,OACEL,EAAC,OAAI,UAAU,0BACb,UAAAD,EAACE,EAAA,CAAM,mBAAO,EACdF,EAACE,EAAA,CAAM,gBAAI,GACb,CAEJ,CACF",
-  "names": ["jsx", "jsxs", "Badge", "meta", "badge_stories_default", "Default", "Examples"]
+  "sourcesContent": ["import type { Meta, StoryObj } from '@storybook/react'\n\nimport { Badge } from '../components/index.js'\nimport React from 'react'\n\nconst meta = {\n  title: 'Components/Badge',\n  component: Badge,\n  parameters: {\n    layout: 'centered',\n  },\n  tags: ['autodocs'],\n  argTypes: {\n    size: {\n      control: {\n        type: 'select',\n      },\n      options: ['sm', 'lg'],\n      description: 'Badge \u5C3A\u5BF8',\n      table: {\n        defaultValue: { summary: 'lg' },\n      },\n    },\n  },\n  args: {\n    size: 'lg'\n  },\n} satisfies Meta<typeof Badge>\n\nexport default meta\n\ntype Story = StoryObj<typeof meta>\n\nexport const Default: Story = {\n  args: {\n    children: 'New',\n  }\n}\n\nexport const Examples: Story = {\n  render() {\n    return (\n      <div className=\"flex flex-col space-y-4\">\n        <Badge>New</Badge>\n      </div>\n    )\n  },\n}\n"],
+  "mappings": "AA2CQ,cAAAA,MAAA,oBAzCR,OAAS,SAAAC,MAAa,yBACtB,MAAkB,QAElB,MAAMC,EAAO,CACX,MAAO,mBACP,UAAWD,EACX,WAAY,CACV,OAAQ,UACV,EACA,KAAM,CAAC,UAAU,EACjB,SAAU,CACR,KAAM,CACJ,QAAS,CACP,KAAM,QACR,EACA,QAAS,CAAC,KAAM,IAAI,EACpB,YAAa,qBACb,MAAO,CACL,aAAc,CAAE,QAAS,IAAK,CAChC,CACF,CACF,EACA,KAAM,CACJ,KAAM,IACR,CACF,EAEA,IAAOE,EAAQD,EAIR,MAAME,EAAiB,CAC5B,KAAM,CACJ,SAAU,KACZ,CACF,EAEaC,EAAkB,CAC7B,QAAS,CACP,OACEL,EAAC,OAAI,UAAU,0BACb,SAAAA,EAACC,EAAA,CAAM,eAAG,EACZ,CAEJ,CACF",
+  "names": ["jsx", "Badge", "meta", "badge_stories_default", "Default", "Examples"]
 }

package/dist/esm/stories/button.stories.d.ts

@@ -25,12 +25,14 @@ declare const meta: {
                 type: "select";
             };
             options: string[];
+            description: string;
         };
         size: {
             control: {
                 type: "select";
             };
             options: string[];
+            description: string;
         };
         hoverEffect: {
             description: string;
@@ -53,10 +55,10 @@ declare const meta: {
 };
 export default meta;
 type Story = StoryObj<typeof meta>;
-export declare const Nature: Story;
 export declare const Primary: Story;
 export declare const Secondary: Story;
 export declare const Link: Story;
 export declare const WithIcon: Story;
+export declare const Loading: Story;
 export declare const Aschild: Story;
 export declare const Spinner: Story;

package/dist/esm/stories/button.stories.js

@@ -1,2 +1,2 @@
-import{Fragment as n,jsx as t,jsxs as e}from"react/jsx-runtime";import{SearchIcon as a}from"@storybook/icons";import{Button as o}from"../components/index.js";import"react";const r={title:"Components/Button",component:o,parameters:{layout:"centered",docs:{description:{component:"\u6309\u94AE\u7EC4\u4EF6, \u5206\u4E3A\u591A\u79CD\u53D8\u4F53\u548C\u5927\u5C0F, \u652F\u6301 loading \u72B6\u6001\u548C\u56FE\u6807"}}},tags:["autodocs"],argTypes:{theme:{control:{type:"select"},options:["dark","light"],description:"\u4E3B\u9898, \u9ED8\u8BA4\u662F light"},variant:{control:{type:"select"},options:["nature","primary","secondary","link","ghost"]},size:{control:{type:"select"},options:["sm","base","lg","icon"]},hoverEffect:{description:"hover \u72B6\u6001\u4E0B\u7684\u52A8\u753B\u6548\u679C\uFF0C\u4EC5\u5728variant\u662Fprimary \u548C secondary \u65F6\u751F\u6548",control:{type:"select"},options:["none","slide"]}},args:{theme:"light",variant:"primary",size:"base",children:"Button",asChild:!1,disabled:!1,loading:!1,hoverEffect:"none"}};var p=r;const d={args:{size:"lg",variant:"nature",children:"Default"}},h={args:{size:"lg",children:"Primary"}},g={args:{size:"lg",variant:"secondary",children:"Secondary"}},m={args:{size:"lg",variant:"link",children:"Link"}},y={args:{size:"lg",children:e(n,{children:["WithIcon ",t(a,{className:"ml-2"})]})}},f={args:{size:"lg",asChild:!0,children:t("a",{href:"http://example.com",children:"as a a tag"})}},v={args:{size:"lg",loading:!0,spinner:e("div",{className:"flex animate-pulse flex-row font-bold text-neutral-900",children:[t("svg",{viewBox:"0 0 1024 1024",version:"1.1",xmlns:"http://www.w3.org/2000/svg","p-id":"2625",width:"1rem",className:"align-middle",children:t("path",{d:"M511.882596 287.998081h-0.361244a31.998984 31.998984 0 0 1-31.659415-31.977309v-0.361244c0-0.104761 0.115598-11.722364 0.115598-63.658399V96.000564a31.998984 31.998984 0 1 1 64.001581 0V192.001129c0 52.586273-0.111986 63.88237-0.119211 64.337537a32.002596 32.002596 0 0 1-31.977309 31.659415zM511.998194 959.99842a31.998984 31.998984 0 0 1-31.998984-31.998984v-96.379871c0-51.610915-0.111986-63.174332-0.115598-63.286318s0-0.242033 0-0.361243a31.998984 31.998984 0 0 1 63.997968-0.314283c0 0.455167 0.11921 11.711527 0.11921 64.034093v96.307622a31.998984 31.998984 0 0 1-32.002596 31.998984zM330.899406 363.021212a31.897836 31.897836 0 0 1-22.866739-9.612699c-0.075861-0.075861-8.207461-8.370021-44.931515-45.094076L195.198137 240.429485a31.998984 31.998984 0 0 1 45.256635-45.253022L308.336112 263.057803c37.182834 37.182834 45.090463 45.253022 45.41197 45.578141A31.998984 31.998984 0 0 1 330.899406 363.021212zM806.137421 838.11473a31.901448 31.901448 0 0 1-22.628318-9.374279L715.624151 760.859111c-36.724054-36.724054-45.018214-44.859267-45.097687-44.93874a31.998984 31.998984 0 0 1 44.77618-45.729864c0.32512 0.317895 8.395308 8.229136 45.578142 45.411969l67.88134 67.88134a31.998984 31.998984 0 0 1-22.624705 54.630914zM224.000113 838.11473a31.901448 31.901448 0 0 0 22.628317-9.374279l67.88134-67.88134c36.724054-36.724054 45.021826-44.859267 45.097688-44.93874a31.998984 31.998984 0 0 0-44.776181-45.729864c-0.32512 0.317895-8.395308 8.229136-45.578142 45.411969l-67.88134 67.884953a31.998984 31.998984 0 0 0 22.628318 54.627301zM255.948523 544.058589h-0.361244c-0.104761 0-11.722364-0.115598-63.658399-0.115598H95.942765a31.998984 31.998984 0 1 1 0-64.00158h95.996952c52.586273 0 63.88237 0.111986 64.337538 0.11921a31.998984 31.998984 0 0 1 31.659414 31.97731v0.361244a32.002596 32.002596 0 0 1-31.988146 31.659414zM767.939492 544.058589a32.002596 32.002596 0 0 1-31.995372-31.666639v-0.361244a31.998984 31.998984 0 0 1 31.659415-31.970085c0.455167 0 11.754876-0.11921 64.34115-0.11921h96.000564a31.998984 31.998984 0 0 1 0 64.00158H831.944685c-51.936034 0-63.553638 0.111986-63.665624 0.115598h-0.335957zM692.999446 363.0176a31.998984 31.998984 0 0 1-22.863126-54.381656c0.317895-0.32512 8.229136-8.395308 45.41197-45.578141l67.88134-67.884953A31.998984 31.998984 0 1 1 828.693489 240.429485l-67.892177 67.88134c-31.020013 31.023625-41.644196 41.759794-44.241539 44.393262l-0.697201 0.722488a31.908673 31.908673 0 0 1-22.863126 9.591025z",fill:"","p-id":"2626"})}),"\xA0loading..."]})}};export{f as Aschild,m as Link,d as Nature,h as Primary,g as Secondary,v as Spinner,y as WithIcon,p as default};
+import{Fragment as s,jsx as t,jsxs as e}from"react/jsx-runtime";import{SearchIcon as o}from"@storybook/icons";import{Button as a}from"../components/index.js";import"react";const r={title:"Components/Button",component:a,parameters:{layout:"centered",docs:{description:{component:"\u6309\u94AE\u7EC4\u4EF6, \u5206\u4E3A\u591A\u79CD\u53D8\u4F53\u548C\u5927\u5C0F, \u652F\u6301 loading \u72B6\u6001\u548C\u56FE\u6807"}}},tags:["autodocs"],argTypes:{theme:{control:{type:"select"},options:["dark","light"],description:"\u4E3B\u9898, \u9ED8\u8BA4\u662F light"},variant:{control:{type:"select"},options:["primary","secondary","link","ghost"],description:"\u6309\u94AE\u7C7B\u578B, \u63A8\u8350\u4F7F\u7528 primary \u548C secondary\uFF0C link ; ghost \u5C06\u4F1A\u5E9F\u5F03\uFF0C\u8BF7\u4F7F\u7528 secondary\uFF0C \u4EE3\u66FF"},size:{control:{type:"select"},options:["sm","base","lg","icon"],description:"\u6309\u94AE\u5927\u5C0F \u9ED8\u8BA4\u662F base, \u53EF\u9009\u503C: sm, base, lg, icon"},hoverEffect:{description:"hover \u72B6\u6001\u4E0B\u7684\u52A8\u753B\u6548\u679C\uFF0C\u4EC5\u5728variant\u662Fprimary \u548C secondary \u65F6\u751F\u6548",control:{type:"select"},options:["none","slide"]}},args:{theme:"light",variant:"primary",size:"base",children:"Button",asChild:!1,disabled:!1,loading:!1,hoverEffect:"none"}};var p=r;const d={args:{size:"lg",children:"Primary"}},g={args:{size:"lg",variant:"secondary",children:"Secondary"}},y={args:{size:"lg",variant:"link",children:"Link"}},h={args:{size:"lg",children:e(s,{children:["WithIcon ",t(o,{className:"ml-2"})]})}},m={args:{size:"lg",loading:!0}},f={args:{size:"lg",asChild:!0,children:t("a",{href:"http://example.com",children:"as a a tag"})}},v={args:{size:"lg",loading:!0,spinner:e("div",{className:"flex animate-pulse flex-row font-bold text-neutral-900",children:[t("svg",{viewBox:"0 0 1024 1024",version:"1.1",xmlns:"http://www.w3.org/2000/svg","p-id":"2625",width:"1rem",className:"align-middle",children:t("path",{d:"M511.882596 287.998081h-0.361244a31.998984 31.998984 0 0 1-31.659415-31.977309v-0.361244c0-0.104761 0.115598-11.722364 0.115598-63.658399V96.000564a31.998984 31.998984 0 1 1 64.001581 0V192.001129c0 52.586273-0.111986 63.88237-0.119211 64.337537a32.002596 32.002596 0 0 1-31.977309 31.659415zM511.998194 959.99842a31.998984 31.998984 0 0 1-31.998984-31.998984v-96.379871c0-51.610915-0.111986-63.174332-0.115598-63.286318s0-0.242033 0-0.361243a31.998984 31.998984 0 0 1 63.997968-0.314283c0 0.455167 0.11921 11.711527 0.11921 64.034093v96.307622a31.998984 31.998984 0 0 1-32.002596 31.998984zM330.899406 363.021212a31.897836 31.897836 0 0 1-22.866739-9.612699c-0.075861-0.075861-8.207461-8.370021-44.931515-45.094076L195.198137 240.429485a31.998984 31.998984 0 0 1 45.256635-45.253022L308.336112 263.057803c37.182834 37.182834 45.090463 45.253022 45.41197 45.578141A31.998984 31.998984 0 0 1 330.899406 363.021212zM806.137421 838.11473a31.901448 31.901448 0 0 1-22.628318-9.374279L715.624151 760.859111c-36.724054-36.724054-45.018214-44.859267-45.097687-44.93874a31.998984 31.998984 0 0 1 44.77618-45.729864c0.32512 0.317895 8.395308 8.229136 45.578142 45.411969l67.88134 67.88134a31.998984 31.998984 0 0 1-22.624705 54.630914zM224.000113 838.11473a31.901448 31.901448 0 0 0 22.628317-9.374279l67.88134-67.88134c36.724054-36.724054 45.021826-44.859267 45.097688-44.93874a31.998984 31.998984 0 0 0-44.776181-45.729864c-0.32512 0.317895-8.395308 8.229136-45.578142 45.411969l-67.88134 67.884953a31.998984 31.998984 0 0 0 22.628318 54.627301zM255.948523 544.058589h-0.361244c-0.104761 0-11.722364-0.115598-63.658399-0.115598H95.942765a31.998984 31.998984 0 1 1 0-64.00158h95.996952c52.586273 0 63.88237 0.111986 64.337538 0.11921a31.998984 31.998984 0 0 1 31.659414 31.97731v0.361244a32.002596 32.002596 0 0 1-31.988146 31.659414zM767.939492 544.058589a32.002596 32.002596 0 0 1-31.995372-31.666639v-0.361244a31.998984 31.998984 0 0 1 31.659415-31.970085c0.455167 0 11.754876-0.11921 64.34115-0.11921h96.000564a31.998984 31.998984 0 0 1 0 64.00158H831.944685c-51.936034 0-63.553638 0.111986-63.665624 0.115598h-0.335957zM692.999446 363.0176a31.998984 31.998984 0 0 1-22.863126-54.381656c0.317895-0.32512 8.229136-8.395308 45.41197-45.578141l67.88134-67.884953A31.998984 31.998984 0 1 1 828.693489 240.429485l-67.892177 67.88134c-31.020013 31.023625-41.644196 41.759794-44.241539 44.393262l-0.697201 0.722488a31.908673 31.908673 0 0 1-22.863126 9.591025z",fill:"","p-id":"2626"})}),"\xA0loading..."]})}};export{f as Aschild,y as Link,m as Loading,d as Primary,g as Secondary,v as Spinner,h as WithIcon,p as default};
 //# sourceMappingURL=button.stories.js.map

package/dist/esm/stories/button.stories.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../src/stories/button.stories.tsx"],
-  "sourcesContent": ["import type { Meta, StoryObj } from '@storybook/react'\nimport { SearchIcon } from '@storybook/icons'\n\nimport { Button } from '../components/index.js'\nimport React from 'react'\n\n// More on how to set up stories at: https://storybook.js.org/docs/writing-stories#default-export\nconst meta = {\n  // \u540C\u65F6\u5B9A\u4E49\u4E86\u9875\u9762\u5DE6\u4FA7\u83DC\u5355\n  title: 'Components/Button',\n  component: Button,\n  parameters: {\n    // Optional parameter to center the component in the Canvas. More info: https://storybook.js.org/docs/configure/story-layout\n    layout: 'centered',\n    docs: {\n      description: {\n        component: `\u6309\u94AE\u7EC4\u4EF6, \u5206\u4E3A\u591A\u79CD\u53D8\u4F53\u548C\u5927\u5C0F, \u652F\u6301 loading \u72B6\u6001\u548C\u56FE\u6807`\n      }\n    }\n  },\n  // This component will have an automatically generated Autodocs entry: https://storybook.js.org/docs/writing-docs/autodocs\n  tags: ['autodocs'],\n  // More on argTypes: https://storybook.js.org/docs/api/argtypes\n  argTypes: {\n    theme: {\n      control: {\n        type: 'select',\n      },\n      options: ['dark', 'light'],\n      description: '\u4E3B\u9898, \u9ED8\u8BA4\u662F light',\n    },\n    variant: {\n      control: {\n        type: 'select',\n      },\n      options: ['nature', 'primary', 'secondary', 'link', 'ghost'],\n    },\n    size: {\n      control: {\n        type: 'select',\n      },\n      options: ['sm', 'base', 'lg', 'icon'],\n    },\n    hoverEffect: {\n      description: 'hover \u72B6\u6001\u4E0B\u7684\u52A8\u753B\u6548\u679C\uFF0C\u4EC5\u5728variant\u662Fprimary \u548C secondary \u65F6\u751F\u6548',\n      control: {\n        type: 'select',\n      },\n      options: ['none', 'slide'],\n    },\n  },\n  args: {\n    theme: 'light',\n    variant: 'primary',\n    size: 'base',\n    children: 'Button',\n    asChild: false,\n    disabled: false,\n    loading: false,\n    hoverEffect: 'none',\n  },\n} satisfies Meta<typeof Button>\n\nexport default meta\ntype Story = StoryObj<typeof meta>\n\n// More on writing stories with args: https://storybook.js.org/docs/writing-stories/args\n// args \u4F1A\u4F5C\u4E3A props \u4F20\u9012\u7ED9\u7EC4\u4EF6\n// Story\u7684\u540D\u4F1A\u4F5C\u4E3A\u83DC\u5355\u7684\u540D\u79F0 \u81EA\u52A8\u9996\u5B57\u6BCD\u5927\u5199\u5E76\u6309\u7167\u5927\u5199\u5B57\u6BCD\u62C6\u5206 UseAsButton => Use As Button\n\nexport const Nature: Story = {\n  args: {\n    size: 'lg',\n    variant: 'nature',\n    children: 'Default',\n  },\n}\n\nexport const Primary: Story = {\n  args: {\n    size: 'lg',\n    children: 'Primary',\n  },\n}\n\nexport const Secondary: Story = {\n  args: {\n    size: 'lg',\n    variant: 'secondary',\n    children: 'Secondary',\n  },\n}\n\nexport const Link: Story = {\n  args: {\n    size: 'lg',\n    variant: 'link',\n    children: 'Link',\n  },\n}\n\nexport const WithIcon: Story = {\n  args: {\n    size: 'lg',\n    children: (\n      <>\n        WithIcon <SearchIcon className=\"ml-2\" />\n      </>\n    ),\n  },\n}\n\nexport const Aschild: Story = {\n  args: {\n    size: 'lg',\n    asChild: true,\n    children: <a href=\"http://example.com\">as a a tag</a>,\n  },\n}\n\nexport const Spinner: Story = {\n  args: {\n    size: 'lg',\n    loading: true,\n    spinner: (\n      <div className=\"flex animate-pulse flex-row font-bold text-neutral-900\">\n        <svg\n          viewBox=\"0 0 1024 1024\"\n          version=\"1.1\"\n          xmlns=\"http://www.w3.org/2000/svg\"\n          p-id=\"2625\"\n          width=\"1rem\"\n          className=\"align-middle\"\n        >\n          <path\n            d=\"M511.882596 287.998081h-0.361244a31.998984 31.998984 0 0 1-31.659415-31.977309v-0.361244c0-0.104761 0.115598-11.722364 0.115598-63.658399V96.000564a31.998984 31.998984 0 1 1 64.001581 0V192.001129c0 52.586273-0.111986 63.88237-0.119211 64.337537a32.002596 32.002596 0 0 1-31.977309 31.659415zM511.998194 959.99842a31.998984 31.998984 0 0 1-31.998984-31.998984v-96.379871c0-51.610915-0.111986-63.174332-0.115598-63.286318s0-0.242033 0-0.361243a31.998984 31.998984 0 0 1 63.997968-0.314283c0 0.455167 0.11921 11.711527 0.11921 64.034093v96.307622a31.998984 31.998984 0 0 1-32.002596 31.998984zM330.899406 363.021212a31.897836 31.897836 0 0 1-22.866739-9.612699c-0.075861-0.075861-8.207461-8.370021-44.931515-45.094076L195.198137 240.429485a31.998984 31.998984 0 0 1 45.256635-45.253022L308.336112 263.057803c37.182834 37.182834 45.090463 45.253022 45.41197 45.578141A31.998984 31.998984 0 0 1 330.899406 363.021212zM806.137421 838.11473a31.901448 31.901448 0 0 1-22.628318-9.374279L715.624151 760.859111c-36.724054-36.724054-45.018214-44.859267-45.097687-44.93874a31.998984 31.998984 0 0 1 44.77618-45.729864c0.32512 0.317895 8.395308 8.229136 45.578142 45.411969l67.88134 67.88134a31.998984 31.998984 0 0 1-22.624705 54.630914zM224.000113 838.11473a31.901448 31.901448 0 0 0 22.628317-9.374279l67.88134-67.88134c36.724054-36.724054 45.021826-44.859267 45.097688-44.93874a31.998984 31.998984 0 0 0-44.776181-45.729864c-0.32512 0.317895-8.395308 8.229136-45.578142 45.411969l-67.88134 67.884953a31.998984 31.998984 0 0 0 22.628318 54.627301zM255.948523 544.058589h-0.361244c-0.104761 0-11.722364-0.115598-63.658399-0.115598H95.942765a31.998984 31.998984 0 1 1 0-64.00158h95.996952c52.586273 0 63.88237 0.111986 64.337538 0.11921a31.998984 31.998984 0 0 1 31.659414 31.97731v0.361244a32.002596 32.002596 0 0 1-31.988146 31.659414zM767.939492 544.058589a32.002596 32.002596 0 0 1-31.995372-31.666639v-0.361244a31.998984 31.998984 0 0 1 31.659415-31.970085c0.455167 0 11.754876-0.11921 64.34115-0.11921h96.000564a31.998984 31.998984 0 0 1 0 64.00158H831.944685c-51.936034 0-63.553638 0.111986-63.665624 0.115598h-0.335957zM692.999446 363.0176a31.998984 31.998984 0 0 1-22.863126-54.381656c0.317895-0.32512 8.229136-8.395308 45.41197-45.578141l67.88134-67.884953A31.998984 31.998984 0 1 1 828.693489 240.429485l-67.892177 67.88134c-31.020013 31.023625-41.644196 41.759794-44.241539 44.393262l-0.697201 0.722488a31.908673 31.908673 0 0 1-22.863126 9.591025z\"\n            fill=\"\"\n            p-id=\"2626\"\n          ></path>\n        </svg>\n        &nbsp;loading...\n      </div>\n    ),\n  },\n}\n"],
-  "mappings": "AAyGM,mBAAAA,EACW,OAAAC,EADX,QAAAC,MAAA,oBAxGN,OAAS,cAAAC,MAAkB,mBAE3B,OAAS,UAAAC,MAAc,yBACvB,MAAkB,QAGlB,MAAMC,EAAO,CAEX,MAAO,oBACP,UAAWD,EACX,WAAY,CAEV,OAAQ,WACR,KAAM,CACJ,YAAa,CACX,UAAW,uIACb,CACF,CACF,EAEA,KAAM,CAAC,UAAU,EAEjB,SAAU,CACR,MAAO,CACL,QAAS,CACP,KAAM,QACR,EACA,QAAS,CAAC,OAAQ,OAAO,EACzB,YAAa,wCACf,EACA,QAAS,CACP,QAAS,CACP,KAAM,QACR,EACA,QAAS,CAAC,SAAU,UAAW,YAAa,OAAQ,OAAO,CAC7D,EACA,KAAM,CACJ,QAAS,CACP,KAAM,QACR,EACA,QAAS,CAAC,KAAM,OAAQ,KAAM,MAAM,CACtC,EACA,YAAa,CACX,YAAa,mIACb,QAAS,CACP,KAAM,QACR,EACA,QAAS,CAAC,OAAQ,OAAO,CAC3B,CACF,EACA,KAAM,CACJ,MAAO,QACP,QAAS,UACT,KAAM,OACN,SAAU,SACV,QAAS,GACT,SAAU,GACV,QAAS,GACT,YAAa,MACf,CACF,EAEA,IAAOE,EAAQD,EAOR,MAAME,EAAgB,CAC3B,KAAM,CACJ,KAAM,KACN,QAAS,SACT,SAAU,SACZ,CACF,EAEaC,EAAiB,CAC5B,KAAM,CACJ,KAAM,KACN,SAAU,SACZ,CACF,EAEaC,EAAmB,CAC9B,KAAM,CACJ,KAAM,KACN,QAAS,YACT,SAAU,WACZ,CACF,EAEaC,EAAc,CACzB,KAAM,CACJ,KAAM,KACN,QAAS,OACT,SAAU,MACZ,CACF,EAEaC,EAAkB,CAC7B,KAAM,CACJ,KAAM,KACN,SACET,EAAAF,EAAA,CAAE,sBACSC,EAACE,EAAA,CAAW,UAAU,OAAO,GACxC,CAEJ,CACF,EAEaS,EAAiB,CAC5B,KAAM,CACJ,KAAM,KACN,QAAS,GACT,SAAUX,EAAC,KAAE,KAAK,qBAAqB,sBAAU,CACnD,CACF,EAEaY,EAAiB,CAC5B,KAAM,CACJ,KAAM,KACN,QAAS,GACT,QACEX,EAAC,OAAI,UAAU,yDACb,UAAAD,EAAC,OACC,QAAQ,gBACR,QAAQ,MACR,MAAM,6BACN,OAAK,OACL,MAAM,OACN,UAAU,eAEV,SAAAA,EAAC,QACC,EAAE,o5EACF,KAAK,GACL,OAAK,OACN,EACH,EAAM,kBAER,CAEJ,CACF",
-  "names": ["Fragment", "jsx", "jsxs", "SearchIcon", "Button", "meta", "button_stories_default", "Nature", "Primary", "Secondary", "Link", "WithIcon", "Aschild", "Spinner"]
+  "sourcesContent": ["import type { Meta, StoryObj } from '@storybook/react'\nimport { SearchIcon } from '@storybook/icons'\n\nimport { Button } from '../components/index.js'\nimport React from 'react'\n\n// More on how to set up stories at: https://storybook.js.org/docs/writing-stories#default-export\nconst meta = {\n  // \u540C\u65F6\u5B9A\u4E49\u4E86\u9875\u9762\u5DE6\u4FA7\u83DC\u5355\n  title: 'Components/Button',\n  component: Button,\n  parameters: {\n    // Optional parameter to center the component in the Canvas. More info: https://storybook.js.org/docs/configure/story-layout\n    layout: 'centered',\n    docs: {\n      description: {\n        component: `\u6309\u94AE\u7EC4\u4EF6, \u5206\u4E3A\u591A\u79CD\u53D8\u4F53\u548C\u5927\u5C0F, \u652F\u6301 loading \u72B6\u6001\u548C\u56FE\u6807`\n      }\n    }\n  },\n  // This component will have an automatically generated Autodocs entry: https://storybook.js.org/docs/writing-docs/autodocs\n  tags: ['autodocs'],\n  // More on argTypes: https://storybook.js.org/docs/api/argtypes\n  argTypes: {\n    theme: {\n      control: {\n        type: 'select',\n      },\n      options: ['dark', 'light'],\n      description: '\u4E3B\u9898, \u9ED8\u8BA4\u662F light',\n    },\n    variant: {\n      control: {\n        type: 'select',\n      },\n      options: ['primary', 'secondary', 'link', 'ghost'],\n      description: '\u6309\u94AE\u7C7B\u578B, \u63A8\u8350\u4F7F\u7528 primary \u548C secondary\uFF0C link ; ghost \u5C06\u4F1A\u5E9F\u5F03\uFF0C\u8BF7\u4F7F\u7528 secondary\uFF0C \u4EE3\u66FF',\n    },\n    size: {\n      control: {\n        type: 'select',\n      },\n      options: ['sm', 'base', 'lg', 'icon'],\n      description: '\u6309\u94AE\u5927\u5C0F \u9ED8\u8BA4\u662F base, \u53EF\u9009\u503C: sm, base, lg, icon',\n    },\n    hoverEffect: {\n      description: 'hover \u72B6\u6001\u4E0B\u7684\u52A8\u753B\u6548\u679C\uFF0C\u4EC5\u5728variant\u662Fprimary \u548C secondary \u65F6\u751F\u6548',\n      control: {\n        type: 'select',\n      },\n      options: ['none', 'slide'],\n    },\n  },\n  args: {\n    theme: 'light',\n    variant: 'primary',\n    size: 'base',\n    children: 'Button',\n    asChild: false,\n    disabled: false,\n    loading: false,\n    hoverEffect: 'none',\n  },\n} satisfies Meta<typeof Button>\n\nexport default meta\ntype Story = StoryObj<typeof meta>\n\n// More on writing stories with args: https://storybook.js.org/docs/writing-stories/args\n// args \u4F1A\u4F5C\u4E3A props \u4F20\u9012\u7ED9\u7EC4\u4EF6\n// Story\u7684\u540D\u4F1A\u4F5C\u4E3A\u83DC\u5355\u7684\u540D\u79F0 \u81EA\u52A8\u9996\u5B57\u6BCD\u5927\u5199\u5E76\u6309\u7167\u5927\u5199\u5B57\u6BCD\u62C6\u5206 UseAsButton => Use As Button\n\nexport const Primary: Story = {\n  args: {\n    size: 'lg',\n    children: 'Primary',\n  },\n}\n\nexport const Secondary: Story = {\n  args: {\n    size: 'lg',\n    variant: 'secondary',\n    children: 'Secondary',\n  },\n}\n\nexport const Link: Story = {\n  args: {\n    size: 'lg',\n    variant: 'link',\n    children: 'Link',\n  },\n}\n\nexport const WithIcon: Story = {\n  args: {\n    size: 'lg',\n    children: (\n      <>\n        WithIcon <SearchIcon className=\"ml-2\" />\n      </>\n    ),\n  },\n}\n\nexport const Loading: Story = {\n  args: {\n    size: 'lg',\n    loading: true,\n  },\n}\n\nexport const Aschild: Story = {\n  args: {\n    size: 'lg',\n    asChild: true,\n    children: <a href=\"http://example.com\">as a a tag</a>,\n  },\n}\n\nexport const Spinner: Story = {\n  args: {\n    size: 'lg',\n    loading: true,\n    spinner: (\n      <div className=\"flex animate-pulse flex-row font-bold text-neutral-900\">\n        <svg\n          viewBox=\"0 0 1024 1024\"\n          version=\"1.1\"\n          xmlns=\"http://www.w3.org/2000/svg\"\n          p-id=\"2625\"\n          width=\"1rem\"\n          className=\"align-middle\"\n        >\n          <path\n            d=\"M511.882596 287.998081h-0.361244a31.998984 31.998984 0 0 1-31.659415-31.977309v-0.361244c0-0.104761 0.115598-11.722364 0.115598-63.658399V96.000564a31.998984 31.998984 0 1 1 64.001581 0V192.001129c0 52.586273-0.111986 63.88237-0.119211 64.337537a32.002596 32.002596 0 0 1-31.977309 31.659415zM511.998194 959.99842a31.998984 31.998984 0 0 1-31.998984-31.998984v-96.379871c0-51.610915-0.111986-63.174332-0.115598-63.286318s0-0.242033 0-0.361243a31.998984 31.998984 0 0 1 63.997968-0.314283c0 0.455167 0.11921 11.711527 0.11921 64.034093v96.307622a31.998984 31.998984 0 0 1-32.002596 31.998984zM330.899406 363.021212a31.897836 31.897836 0 0 1-22.866739-9.612699c-0.075861-0.075861-8.207461-8.370021-44.931515-45.094076L195.198137 240.429485a31.998984 31.998984 0 0 1 45.256635-45.253022L308.336112 263.057803c37.182834 37.182834 45.090463 45.253022 45.41197 45.578141A31.998984 31.998984 0 0 1 330.899406 363.021212zM806.137421 838.11473a31.901448 31.901448 0 0 1-22.628318-9.374279L715.624151 760.859111c-36.724054-36.724054-45.018214-44.859267-45.097687-44.93874a31.998984 31.998984 0 0 1 44.77618-45.729864c0.32512 0.317895 8.395308 8.229136 45.578142 45.411969l67.88134 67.88134a31.998984 31.998984 0 0 1-22.624705 54.630914zM224.000113 838.11473a31.901448 31.901448 0 0 0 22.628317-9.374279l67.88134-67.88134c36.724054-36.724054 45.021826-44.859267 45.097688-44.93874a31.998984 31.998984 0 0 0-44.776181-45.729864c-0.32512 0.317895-8.395308 8.229136-45.578142 45.411969l-67.88134 67.884953a31.998984 31.998984 0 0 0 22.628318 54.627301zM255.948523 544.058589h-0.361244c-0.104761 0-11.722364-0.115598-63.658399-0.115598H95.942765a31.998984 31.998984 0 1 1 0-64.00158h95.996952c52.586273 0 63.88237 0.111986 64.337538 0.11921a31.998984 31.998984 0 0 1 31.659414 31.97731v0.361244a32.002596 32.002596 0 0 1-31.988146 31.659414zM767.939492 544.058589a32.002596 32.002596 0 0 1-31.995372-31.666639v-0.361244a31.998984 31.998984 0 0 1 31.659415-31.970085c0.455167 0 11.754876-0.11921 64.34115-0.11921h96.000564a31.998984 31.998984 0 0 1 0 64.00158H831.944685c-51.936034 0-63.553638 0.111986-63.665624 0.115598h-0.335957zM692.999446 363.0176a31.998984 31.998984 0 0 1-22.863126-54.381656c0.317895-0.32512 8.229136-8.395308 45.41197-45.578141l67.88134-67.884953A31.998984 31.998984 0 1 1 828.693489 240.429485l-67.892177 67.88134c-31.020013 31.023625-41.644196 41.759794-44.241539 44.393262l-0.697201 0.722488a31.908673 31.908673 0 0 1-22.863126 9.591025z\"\n            fill=\"\"\n            p-id=\"2626\"\n          ></path>\n        </svg>\n        &nbsp;loading...\n      </div>\n    ),\n  },\n}\n"],
+  "mappings": "AAmGM,mBAAAA,EACW,OAAAC,EADX,QAAAC,MAAA,oBAlGN,OAAS,cAAAC,MAAkB,mBAE3B,OAAS,UAAAC,MAAc,yBACvB,MAAkB,QAGlB,MAAMC,EAAO,CAEX,MAAO,oBACP,UAAWD,EACX,WAAY,CAEV,OAAQ,WACR,KAAM,CACJ,YAAa,CACX,UAAW,uIACb,CACF,CACF,EAEA,KAAM,CAAC,UAAU,EAEjB,SAAU,CACR,MAAO,CACL,QAAS,CACP,KAAM,QACR,EACA,QAAS,CAAC,OAAQ,OAAO,EACzB,YAAa,wCACf,EACA,QAAS,CACP,QAAS,CACP,KAAM,QACR,EACA,QAAS,CAAC,UAAW,YAAa,OAAQ,OAAO,EACjD,YAAa,8KACf,EACA,KAAM,CACJ,QAAS,CACP,KAAM,QACR,EACA,QAAS,CAAC,KAAM,OAAQ,KAAM,MAAM,EACpC,YAAa,0FACf,EACA,YAAa,CACX,YAAa,mIACb,QAAS,CACP,KAAM,QACR,EACA,QAAS,CAAC,OAAQ,OAAO,CAC3B,CACF,EACA,KAAM,CACJ,MAAO,QACP,QAAS,UACT,KAAM,OACN,SAAU,SACV,QAAS,GACT,SAAU,GACV,QAAS,GACT,YAAa,MACf,CACF,EAEA,IAAOE,EAAQD,EAOR,MAAME,EAAiB,CAC5B,KAAM,CACJ,KAAM,KACN,SAAU,SACZ,CACF,EAEaC,EAAmB,CAC9B,KAAM,CACJ,KAAM,KACN,QAAS,YACT,SAAU,WACZ,CACF,EAEaC,EAAc,CACzB,KAAM,CACJ,KAAM,KACN,QAAS,OACT,SAAU,MACZ,CACF,EAEaC,EAAkB,CAC7B,KAAM,CACJ,KAAM,KACN,SACER,EAAAF,EAAA,CAAE,sBACSC,EAACE,EAAA,CAAW,UAAU,OAAO,GACxC,CAEJ,CACF,EAEaQ,EAAiB,CAC5B,KAAM,CACJ,KAAM,KACN,QAAS,EACX,CACF,EAEaC,EAAiB,CAC5B,KAAM,CACJ,KAAM,KACN,QAAS,GACT,SAAUX,EAAC,KAAE,KAAK,qBAAqB,sBAAU,CACnD,CACF,EAEaY,EAAiB,CAC5B,KAAM,CACJ,KAAM,KACN,QAAS,GACT,QACEX,EAAC,OAAI,UAAU,yDACb,UAAAD,EAAC,OACC,QAAQ,gBACR,QAAQ,MACR,MAAM,6BACN,OAAK,OACL,MAAM,OACN,UAAU,eAEV,SAAAA,EAAC,QACC,EAAE,o5EACF,KAAK,GACL,OAAK,OACN,EACH,EAAM,kBAER,CAEJ,CACF",
+  "names": ["Fragment", "jsx", "jsxs", "SearchIcon", "Button", "meta", "button_stories_default", "Primary", "Secondary", "Link", "WithIcon", "Loading", "Aschild", "Spinner"]
 }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@anker-in/headless-ui",
-  "version": "0.0.27-alpha.4",
+  "version": "0.0.27-alpha.6",
   "type": "commonjs",
   "main": "./dist/cjs/index.js",
   "types": "./dist/cjs/index.d.ts",

package/style.css

@@ -403,24 +403,44 @@ video {
 .container {
   width: 100%;
 }
-@media (min-width: var(--breakpoint-sm)) {
+@media (min-width: 640px) {
   .container {
-    max-width: var(--breakpoint-sm);
+    max-width: 640px;
   }
 }
-@media (min-width: var(--breakpoint-md)) {
+@media (min-width: 768px) {
   .container {
-    max-width: var(--breakpoint-md);
+    max-width: 768px;
   }
 }
-@media (min-width: var(--breakpoint-lg)) {
+@media (min-width: 1024px) {
   .container {
-    max-width: var(--breakpoint-lg);
+    max-width: 1024px;
   }
 }
-@media (min-width: var(--breakpoint-xl)) {
+@media (min-width: 1025px) {
   .container {
-    max-width: var(--breakpoint-xl);
+    max-width: 1025px;
+  }
+}
+@media (min-width: 1280px) {
+  .container {
+    max-width: 1280px;
+  }
+}
+@media (min-width: 1441px) {
+  .container {
+    max-width: 1441px;
+  }
+}
+@media (min-width: 1536px) {
+  .container {
+    max-width: 1536px;
+  }
+}
+@media (min-width: 1921px) {
+  .container {
+    max-width: 1921px;
   }
 }
 .sr-only {
@@ -898,8 +918,8 @@ video {
   text-overflow: ellipsis;
   white-space: nowrap;
 }
-.rounded-\[20px\] {
-  border-radius: 20px;
+.rounded-\[16px\] {
+  border-radius: 16px;
 }
 .rounded-btn {
   border-radius: var(--btn-radius);
@@ -919,6 +939,9 @@ video {
 .border {
   border-width: 1px;
 }
+.border-\[1\.6px\] {
+  border-width: 1.6px;
+}
 .border-b {
   border-bottom-width: 1px;
 }
@@ -928,12 +951,20 @@ video {
 .\!border-none {
   border-style: none !important;
 }
-.border-black {
-  --tw-border-opacity: 1;
-  border-color: rgb(0 0 0 / var(--tw-border-opacity, 1));
+.border-none {
+  border-style: none;
+}
+.border-brand-0 {
+  border-color: var(--brand-color-0);
 }
 .border-btn-primary {
-  border-color: var(--btn-bg-color);
+  border-color: var(--info-primary-color);
+}
+.border-info-primary {
+  border-color: var(--info-primary-color);
+}
+.border-info-white {
+  border-color: var(--info-white-color);
 }
 .border-lines-1 {
   border-color: var(--line-color-1);
@@ -948,7 +979,7 @@ video {
   border-color: var(--dark-error-color-0);
 }
 .border-primary {
-  border-color: var(--brand-color-1);
+  border-color: var(--brand-color-0);
 }
 .border-b-brand-0 {
   border-bottom-color: var(--brand-color-0);
@@ -986,7 +1017,10 @@ video {
   background-color: var(--brand-color-1);
 }
 .bg-btn-primary {
-  background-color: var(--btn-bg-color);
+  background-color: var(--info-primary-color);
+}
+.bg-btn-primary-active {
+  background-color: var(--brand-color-0);
 }
 .bg-btn-secondary {
   background-color: var(--btn-bg-secondary-color);
@@ -1125,7 +1159,7 @@ video {
   stroke: var(--btn-text-secondary-color);
 }
 .stroke-primary {
-  stroke: var(--brand-color-1);
+  stroke: var(--brand-color-0);
 }
 .p-1 {
   padding: 0.25rem;
@@ -1156,13 +1190,13 @@ video {
   padding-left: 1.75rem;
   padding-right: 1.75rem;
 }
-.px-\[10px\] {
-  padding-left: 10px;
-  padding-right: 10px;
+.px-\[6px\] {
+  padding-left: 6px;
+  padding-right: 6px;
 }
-.py-1 {
-  padding-top: 0.25rem;
-  padding-bottom: 0.25rem;
+.px-\[8px\] {
+  padding-left: 8px;
+  padding-right: 8px;
 }
 .py-1\.5 {
   padding-top: 0.375rem;
@@ -1176,6 +1210,10 @@ video {
   padding-top: 0.75rem;
   padding-bottom: 0.75rem;
 }
+.py-\[4px\] {
+  padding-top: 4px;
+  padding-bottom: 4px;
+}
 .\!pl-0 {
   padding-left: 0px !important;
 }
@@ -1337,7 +1375,7 @@ video {
   color: rgb(134 134 140 / var(--tw-text-opacity, 1));
 }
 .text-btn-primary {
-  color: var(--btn-bg-color);
+  color: var(--info-primary-color);
 }
 .text-btn-primary-foreground {
   color: var(--btn-text-color);
@@ -1370,7 +1408,7 @@ video {
   color: var(--dark-error-color-0);
 }
 .text-primary {
-  color: var(--brand-color-1);
+  color: var(--brand-color-0);
 }
 .underline {
   text-decoration-line: underline;
@@ -1421,6 +1459,11 @@ video {
 .filter {
   filter: var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow);
 }
+.backdrop-blur-sm {
+  --tw-backdrop-blur: blur(4px);
+  -webkit-backdrop-filter: var(--tw-backdrop-blur) var(--tw-backdrop-brightness) var(--tw-backdrop-contrast) var(--tw-backdrop-grayscale) var(--tw-backdrop-hue-rotate) var(--tw-backdrop-invert) var(--tw-backdrop-opacity) var(--tw-backdrop-saturate) var(--tw-backdrop-sepia);
+  backdrop-filter: var(--tw-backdrop-blur) var(--tw-backdrop-brightness) var(--tw-backdrop-contrast) var(--tw-backdrop-grayscale) var(--tw-backdrop-hue-rotate) var(--tw-backdrop-invert) var(--tw-backdrop-opacity) var(--tw-backdrop-saturate) var(--tw-backdrop-sepia);
+}
 .transition-colors {
   transition-property: color, background-color, border-color, text-decoration-color, fill, stroke;
   transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
@@ -1475,11 +1518,11 @@ video {
 }
 .before\:bg-btn-primary-active::before {
   content: var(--tw-content);
-  background-color: var(--btn-bg-active-color);
+  background-color: var(--brand-color-0);
 }
 .before\:bg-btn-secondary-active::before {
   content: var(--tw-content);
-  background-color: var(--btn-bg-secondary-active-color);
+  background-color: var(--info-primary-color);
 }
 .before\:transition-transform::before {
   content: var(--tw-content);
@@ -1506,30 +1549,48 @@ video {
 .empty\:block:empty {
   display: block;
 }
+.hover\:border-brand-0:hover {
+  border-color: var(--brand-color-0);
+}
+.hover\:border-info-white:hover {
+  border-color: var(--info-white-color);
+}
 .hover\:\!bg-btn-primary:hover {
-  background-color: var(--btn-bg-color) !important;
+  background-color: var(--info-primary-color) !important;
 }
 .hover\:\!bg-btn-secondary:hover {
   background-color: var(--btn-bg-secondary-color) !important;
 }
 .hover\:bg-btn-primary:hover {
-  background-color: var(--btn-bg-color);
+  background-color: var(--info-primary-color);
 }
 .hover\:bg-btn-primary-active:hover {
-  background-color: var(--btn-bg-active-color);
+  background-color: var(--brand-color-0);
 }
 .hover\:bg-btn-secondary-active:hover {
-  background-color: var(--btn-bg-secondary-active-color);
+  background-color: var(--info-primary-color);
+}
+.hover\:bg-info-white:hover {
+  background-color: var(--info-white-color);
 }
 .hover\:text-brand-0:hover {
   color: var(--brand-color-0);
 }
+.hover\:text-btn-primary-active:hover {
+  color: var(--brand-color-0);
+}
 .hover\:text-btn-primary-foreground:hover {
   color: var(--btn-text-color);
 }
 .hover\:text-btn-secondary:hover {
   color: var(--btn-bg-secondary-color);
 }
+.hover\:text-info-primary:hover {
+  color: var(--info-primary-color);
+}
+.hover\:text-info-white:hover {
+  color: var(--info-white-color);
+}
 .hover\:underline:hover {
   text-decoration-line: underline;
 }
@@ -1571,20 +1632,29 @@ video {
 .disabled\:cursor-not-allowed:disabled {
   cursor: not-allowed;
 }
+.disabled\:border-btn-secondary-disabled-border:disabled {
+  border-color: var(--info-quaternary-color);
+}
 .disabled\:bg-btn-primary-disabled:disabled {
-  background-color: var(--btn-bg-disabled-color);
+  background-color: var(--info-quaternary-color);
 }
 .disabled\:bg-btn-secondary-disabled:disabled {
-  background-color: var(--btn-bg-secondary-disabled-color);
+  background-color: var(--info-white-color);
 }
 .disabled\:text-btn-primary-disabled-foreground:disabled {
-  color: var(--quaternary-color);
+  color: var(--info-white-color);
 }
 .disabled\:text-btn-secondary-disabled:disabled {
-  color: var(--btn-bg-secondary-disabled-color);
+  color: var(--info-white-color);
 }
 .disabled\:text-btn-secondary-disabled-foreground:disabled {
-  color: var(--btn-border-secondary-border-color);
+  color: var(--info-quaternary-color);
+}
+.disabled\:text-info-quaternary:disabled {
+  color: var(--info-quaternary-color);
+}
+.disabled\:text-info-white:disabled {
+  color: var(--info-white-color);
 }
 .disabled\:opacity-50:disabled {
   opacity: 0.5;
@@ -1611,7 +1681,7 @@ video {
   border-bottom-width: 3px;
 }
 .data-\[state\=checked\]\:bg-primary[data-state="checked"] {
-  background-color: var(--brand-color-1);
+  background-color: var(--brand-color-0);
 }
 .data-\[inline-skeleton\=true\]\:leading-\[0\][data-inline-skeleton="true"] {
   line-height: 0;
@@ -1622,7 +1692,7 @@ video {
 .data-\[disabled\]\:opacity-50[data-disabled] {
   opacity: 0.5;
 }
-@media (min-width: var(--breakpoint-sm)) {
+@media (min-width: 768px) {
   .tablet\:mx-8 {
     margin-left: 2rem;
     margin-right: 2rem;
@@ -1645,7 +1715,7 @@ video {
     text-align: left;
   }
 }
-@media (min-width: var(--breakpoint-md)) {
+@media (min-width: 1025px) {
   .laptop\:-bottom-\[40px\] {
     bottom: -40px;
   }
@@ -1663,7 +1733,7 @@ video {
     gap: 1rem;
   }
 }
-@media (min-width: var(--breakpoint-lg)) {
+@media (min-width: 1441px) {
   .desktop\:mx-16 {
     margin-left: 4rem;
     margin-right: 4rem;
@@ -1675,7 +1745,7 @@ video {
     font-size: 48px;
   }
 }
-@media (min-width: var(--breakpoint-xl)) {
+@media (min-width: 1921px) {
   .lg-desktop\:mx-auto {
     margin-left: auto;
     margin-right: auto;