@anker-in/headless-ui 0.0.27-alpha.68 → 0.0.27-alpha.72

package/dist/esm/stories/mediaplayerMulti.stories.js

@@ -1,2 +1,2 @@
-import t from"../biz-components/MediaPlayerMulti/index.js";const e=[{title:"MKBHD",name:"MKBHD",description:"18.2 Million Youtube subscribers",quote:'"If efficiency means something to you, then definitely check out Anker, who makes these chargers and cables that I really like."',img:{url:"https://cdn.shopify.com/s/files/1/0819/5735/5793/files/9b8ef5a9-97c5-4b81-9fdd-1c2805a12702_dca27557ea115cd0c51fa8ee0d7ebd7b.jpg?v=1745464110",alt:"MKBHD"},video:{url:"https://cdn.shopify.com/videos/c/o/v/97144231c93943c4aae54f8056b1073b.mp4"}},{title:"Unbox Therapy",name:"Unbox Therapy",description:"18.2 Million Youtube subscribers",quote:'"I highly recommend the Anker Nano Pro. This truly is a no-brainer."',img:{url:"https://cdn.shopify.com/s/files/1/0819/5735/5793/files/1dd1b39c-1206-48a5-96ec-1083627f51bb_3a34a11a40cbfb857cec1f91eeeaff29.jpg?v=1745464094",alt:"Unbox Therapy"},video:{url:"https://cdn.shopify.com/videos/c/o/v/97144231c93943c4aae54f8056b1073b.mp4"}}],o={title:"Biz-Components/MediaPlayerMulti",component:t,parameters:{layout:"fullscreen"},tags:["autodocs"]};var i=o;const s={args:{data:{items:e}}},c={args:{data:{items:e?.concat(e)}}};export{s as Default,c as Multi,i as default};
+import r from"../biz-components/MediaPlayerMulti/index.js";import{gsap as t}from"gsap";import{useGSAP as o}from"@gsap/react";import{ScrollTrigger as a}from"gsap/dist/ScrollTrigger";import{SplitText as i}from"gsap/dist/SplitText";const e=[{title:"MKBHD",name:"MKBHD",description:"18.2 Million Youtube subscribers",quote:'"If efficiency means something to you, then definitely check out Anker, who makes these chargers and cables that I really like."',img:{url:"https://cdn.shopify.com/s/files/1/0819/5735/5793/files/9b8ef5a9-97c5-4b81-9fdd-1c2805a12702_dca27557ea115cd0c51fa8ee0d7ebd7b.jpg?v=1745464110",alt:"MKBHD"},video:{url:"https://cdn.shopify.com/videos/c/o/v/97144231c93943c4aae54f8056b1073b.mp4"}},{title:"Unbox Therapy",name:"Unbox Therapy",description:"18.2 Million Youtube subscribers",quote:'"I highly recommend the Anker Nano Pro. This truly is a no-brainer."',img:{url:"https://cdn.shopify.com/s/files/1/0819/5735/5793/files/1dd1b39c-1206-48a5-96ec-1083627f51bb_3a34a11a40cbfb857cec1f91eeeaff29.jpg?v=1745464094",alt:"Unbox Therapy"},video:{url:"https://cdn.shopify.com/videos/c/o/v/97144231c93943c4aae54f8056b1073b.mp4"}}],s={title:"Biz-Components/MediaPlayerMulti",component:r,parameters:{layout:"fullscreen"},tags:["autodocs"]};var f=s;const d={args:{GSAP:{gsap:t,ScrollTrigger:a,SplitText:i,useGSAP:o},data:{items:e}}},b={args:{GSAP:{gsap:t,ScrollTrigger:a,SplitText:i,useGSAP:o},data:{items:e?.concat(e)}}};export{d as Default,b as Multi,f as default};
 //# sourceMappingURL=mediaplayerMulti.stories.js.map

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

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../src/stories/mediaplayerMulti.stories.tsx"],
-  "sourcesContent": ["import type { Meta, StoryObj } from '@storybook/react'\nimport MediaPlayerMulti from '../biz-components/MediaPlayerMulti/index.js'\n\nconst testimonialItems = [\n  {\n    title: 'MKBHD',\n    name: 'MKBHD',\n    description: '18.2 Million Youtube subscribers',\n    quote:\n      '\"If efficiency means something to you, then definitely check out Anker, who makes these chargers and cables that I really like.\"',\n    img: {\n      url: 'https://cdn.shopify.com/s/files/1/0819/5735/5793/files/9b8ef5a9-97c5-4b81-9fdd-1c2805a12702_dca27557ea115cd0c51fa8ee0d7ebd7b.jpg?v=1745464110',\n      alt: 'MKBHD',\n    },\n    video: {\n      url: 'https://cdn.shopify.com/videos/c/o/v/97144231c93943c4aae54f8056b1073b.mp4',\n    },\n  },\n  {\n    title: 'Unbox Therapy',\n    name: 'Unbox Therapy',\n    description: '18.2 Million Youtube subscribers',\n    quote: '\"I highly recommend the Anker Nano Pro. This truly is a no-brainer.\"',\n    img: {\n      url: 'https://cdn.shopify.com/s/files/1/0819/5735/5793/files/1dd1b39c-1206-48a5-96ec-1083627f51bb_3a34a11a40cbfb857cec1f91eeeaff29.jpg?v=1745464094',\n      alt: 'Unbox Therapy',\n    },\n    video: {\n      url: 'https://cdn.shopify.com/videos/c/o/v/97144231c93943c4aae54f8056b1073b.mp4',\n    },\n  },\n]\n\nconst meta = {\n  title: 'Biz-Components/MediaPlayerMulti',\n  component: MediaPlayerMulti,\n  parameters: {\n    layout: 'fullscreen',\n  },\n  tags: ['autodocs'],\n} satisfies Meta<typeof MediaPlayerMulti>\n\nexport default meta\ntype Story = StoryObj<typeof meta>\n\nexport const Default: Story = {\n  args: {\n    data: {\n      items: testimonialItems,\n    },\n  },\n}\n\nexport const Multi: Story = {\n  args: {\n    data: {\n      items: testimonialItems?.concat(testimonialItems),\n    },\n  },\n}\n"],
-  "mappings": "AACA,OAAOA,MAAsB,8CAE7B,MAAMC,EAAmB,CACvB,CACE,MAAO,QACP,KAAM,QACN,YAAa,mCACb,MACE,mIACF,IAAK,CACH,IAAK,gJACL,IAAK,OACP,EACA,MAAO,CACL,IAAK,2EACP,CACF,EACA,CACE,MAAO,gBACP,KAAM,gBACN,YAAa,mCACb,MAAO,uEACP,IAAK,CACH,IAAK,gJACL,IAAK,eACP,EACA,MAAO,CACL,IAAK,2EACP,CACF,CACF,EAEMC,EAAO,CACX,MAAO,kCACP,UAAWF,EACX,WAAY,CACV,OAAQ,YACV,EACA,KAAM,CAAC,UAAU,CACnB,EAEA,IAAOG,EAAQD,EAGR,MAAME,EAAiB,CAC5B,KAAM,CACJ,KAAM,CACJ,MAAOH,CACT,CACF,CACF,EAEaI,EAAe,CAC1B,KAAM,CACJ,KAAM,CACJ,MAAOJ,GAAkB,OAAOA,CAAgB,CAClD,CACF,CACF",
-  "names": ["MediaPlayerMulti", "testimonialItems", "meta", "mediaplayerMulti_stories_default", "Default", "Multi"]
+  "sourcesContent": ["import type { Meta, StoryObj } from '@storybook/react'\nimport MediaPlayerMulti from '../biz-components/MediaPlayerMulti/index.js'\nimport { gsap } from 'gsap'\nimport { useGSAP } from '@gsap/react'\nimport { ScrollTrigger } from 'gsap/dist/ScrollTrigger'\nimport { SplitText } from 'gsap/dist/SplitText'\n\nconst testimonialItems = [\n  {\n    title: 'MKBHD',\n    name: 'MKBHD',\n    description: '18.2 Million Youtube subscribers',\n    quote:\n      '\"If efficiency means something to you, then definitely check out Anker, who makes these chargers and cables that I really like.\"',\n    img: {\n      url: 'https://cdn.shopify.com/s/files/1/0819/5735/5793/files/9b8ef5a9-97c5-4b81-9fdd-1c2805a12702_dca27557ea115cd0c51fa8ee0d7ebd7b.jpg?v=1745464110',\n      alt: 'MKBHD',\n    },\n    video: {\n      url: 'https://cdn.shopify.com/videos/c/o/v/97144231c93943c4aae54f8056b1073b.mp4',\n    },\n  },\n  {\n    title: 'Unbox Therapy',\n    name: 'Unbox Therapy',\n    description: '18.2 Million Youtube subscribers',\n    quote: '\"I highly recommend the Anker Nano Pro. This truly is a no-brainer.\"',\n    img: {\n      url: 'https://cdn.shopify.com/s/files/1/0819/5735/5793/files/1dd1b39c-1206-48a5-96ec-1083627f51bb_3a34a11a40cbfb857cec1f91eeeaff29.jpg?v=1745464094',\n      alt: 'Unbox Therapy',\n    },\n    video: {\n      url: 'https://cdn.shopify.com/videos/c/o/v/97144231c93943c4aae54f8056b1073b.mp4',\n    },\n  },\n]\n\nconst meta = {\n  title: 'Biz-Components/MediaPlayerMulti',\n  component: MediaPlayerMulti,\n  parameters: {\n    layout: 'fullscreen',\n  },\n  tags: ['autodocs'],\n} satisfies Meta<typeof MediaPlayerMulti>\n\nexport default meta\ntype Story = StoryObj<typeof meta>\n\nexport const Default: Story = {\n  args: {\n    GSAP: { gsap, ScrollTrigger, SplitText, useGSAP },\n    data: {\n      items: testimonialItems,\n    },\n  },\n}\n\nexport const Multi: Story = {\n  args: {\n    GSAP: { gsap, ScrollTrigger, SplitText, useGSAP },\n    data: {\n      items: testimonialItems?.concat(testimonialItems),\n    },\n  },\n}\n"],
+  "mappings": "AACA,OAAOA,MAAsB,8CAC7B,OAAS,QAAAC,MAAY,OACrB,OAAS,WAAAC,MAAe,cACxB,OAAS,iBAAAC,MAAqB,0BAC9B,OAAS,aAAAC,MAAiB,sBAE1B,MAAMC,EAAmB,CACvB,CACE,MAAO,QACP,KAAM,QACN,YAAa,mCACb,MACE,mIACF,IAAK,CACH,IAAK,gJACL,IAAK,OACP,EACA,MAAO,CACL,IAAK,2EACP,CACF,EACA,CACE,MAAO,gBACP,KAAM,gBACN,YAAa,mCACb,MAAO,uEACP,IAAK,CACH,IAAK,gJACL,IAAK,eACP,EACA,MAAO,CACL,IAAK,2EACP,CACF,CACF,EAEMC,EAAO,CACX,MAAO,kCACP,UAAWN,EACX,WAAY,CACV,OAAQ,YACV,EACA,KAAM,CAAC,UAAU,CACnB,EAEA,IAAOO,EAAQD,EAGR,MAAME,EAAiB,CAC5B,KAAM,CACJ,KAAM,CAAE,KAAAP,EAAM,cAAAE,EAAe,UAAAC,EAAW,QAAAF,CAAQ,EAChD,KAAM,CACJ,MAAOG,CACT,CACF,CACF,EAEaI,EAAe,CAC1B,KAAM,CACJ,KAAM,CAAE,KAAAR,EAAM,cAAAE,EAAe,UAAAC,EAAW,QAAAF,CAAQ,EAChD,KAAM,CACJ,MAAOG,GAAkB,OAAOA,CAAgB,CAClD,CACF,CACF",
+  "names": ["MediaPlayerMulti", "gsap", "useGSAP", "ScrollTrigger", "SplitText", "testimonialItems", "meta", "mediaplayerMulti_stories_default", "Default", "Multi"]
 }

package/dist/esm/stories/slogan.stories.js

@@ -1,4 +1,4 @@
-import{jsx as o}from"react/jsx-runtime";import"react";import{Slogan as e}from"../biz-components/index.js";const t={title:"Biz Components/Slogan",component:e,parameters:{layout:"fullscreen"},tags:["autodocs"]};var i=t;const n={args:{data:{title:"The World's No.1 Mobile Charging Brand*",features:[{title:"47%<br/>R&D Employees"},{title:"100 Million<br/>Global Customers"},{title:"Pioneering in Charging<br/>Technology for 12 Years"}]}}},s={args:{data:{title:"The World's No.1 Mobile Charging Brand*"}}},g={args:{data:{title:"The World's No.1 Mobile Charging Brand*",features:[{title:"47%<br/>R&D Employees"}]}}},d={args:{data:{title:"The World's No.1 Mobile Charging Brand*",features:[{title:"47%<br/>R&D Employees"},{title:"100 Million<br/>Global Customers"}]}}},f={args:{data:{title:"The World's No.1 Mobile Charging Brand*",features:[{title:"47%<br/>R&D Employees"},{title:"100 Million<br/>Global Customers"},{title:"Pioneering in Charging<br/>Technology for 12 Years"}]},className:"bg-gray-100"}},b=()=>o(e,{data:{title:"The World's No.1 Mobile Charging Brand*",features:[{title:"47%<br/>R&D Employees"},{title:"100 Million<br/>Global Customers"},{title:"Pioneering in Charging<br/>Technology for 12 Years"}]},className:"bg-gray-100",style:`
+import{jsx as i}from"react/jsx-runtime";import"react";import{Slogan as a}from"../biz-components/index.js";import{gsap as t}from"gsap";import{useGSAP as e}from"@gsap/react";import{ScrollTrigger as o}from"gsap/dist/ScrollTrigger";import{SplitText as r}from"gsap/dist/SplitText";const l={title:"Biz Components/Slogan",component:a,parameters:{layout:"fullscreen"},tags:["autodocs"]};var b=l;const y={args:{GSAP:{gsap:t,ScrollTrigger:o,SplitText:r,useGSAP:e},data:{title:"The World's No.1 Mobile Charging Brand*",features:[{title:"47%<br/>R&D Employees"},{title:"100 Million<br/>Global Customers"},{title:"Pioneering in Charging<br/>Technology for 12 Years"}]}}},c={args:{GSAP:{gsap:t,ScrollTrigger:o,SplitText:r,useGSAP:e},data:{title:"The World's No.1 Mobile Charging Brand*"}}},u={args:{GSAP:{gsap:t,ScrollTrigger:o,SplitText:r,useGSAP:e},data:{title:"The World's No.1 Mobile Charging Brand*",features:[{title:"47%<br/>R&D Employees"}]}}},S={args:{GSAP:{gsap:t,ScrollTrigger:o,SplitText:r,useGSAP:e},data:{title:"The World's No.1 Mobile Charging Brand*",features:[{title:"47%<br/>R&D Employees"},{title:"100 Million<br/>Global Customers"}]}}},h={args:{GSAP:{gsap:t,ScrollTrigger:o,SplitText:r,useGSAP:e},data:{title:"The World's No.1 Mobile Charging Brand*",features:[{title:"47%<br/>R&D Employees"},{title:"100 Million<br/>Global Customers"},{title:"Pioneering in Charging<br/>Technology for 12 Years"}]},className:"bg-gray-100"}},C=()=>i(a,{GSAP:{gsap:t,ScrollTrigger:o,SplitText:r,useGSAP:e},data:{title:"The World's No.1 Mobile Charging Brand*",features:[{title:"47%<br/>R&D Employees"},{title:"100 Million<br/>Global Customers"},{title:"Pioneering in Charging<br/>Technology for 12 Years"}]},className:"bg-gray-100",style:`
         
         .slogan-title{
           background: linear-gradient(90deg, #ff0000, #00ff00, #0000ff);
@@ -22,5 +22,5 @@ import{jsx as o}from"react/jsx-runtime";import"react";import{Slogan as e}from"..
           border-radius: 10px;
           animation: fadeIn 1s ease-in forwards;
         }
-      `});export{f as CustomClassName,b as CustomStyle,n as Default,g as SingleFeature,s as TitleOnly,d as TwoFeatures,i as default};
+      `});export{h as CustomClassName,C as CustomStyle,y as Default,u as SingleFeature,c as TitleOnly,S as TwoFeatures,b as default};
 //# sourceMappingURL=slogan.stories.js.map

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

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../src/stories/slogan.stories.tsx"],
-  "sourcesContent": ["import React from 'react'\nimport type { Meta, StoryObj } from '@storybook/react'\nimport { Slogan } from '../biz-components/index.js'\n\nconst meta = {\n  title: 'Biz Components/Slogan',\n  component: Slogan,\n  parameters: {\n    layout: 'fullscreen',\n  },\n  tags: ['autodocs'],\n} satisfies Meta<typeof Slogan>\n\nexport default meta\n\ntype Story = StoryObj<typeof meta>\n\nexport const Default: Story = {\n  args: {\n    data: {\n      title: \"The World's No.1 Mobile Charging Brand*\",\n      features: [\n        {\n          title: '47%<br/>R&D Employees',\n        },\n        {\n          title: '100 Million<br/>Global Customers',\n        },\n        {\n          title: 'Pioneering in Charging<br/>Technology for 12 Years',\n        },\n      ],\n    },\n  },\n}\n\nexport const TitleOnly: Story = {\n  args: {\n    data: {\n      title: \"The World's No.1 Mobile Charging Brand*\",\n    },\n  },\n}\n\nexport const SingleFeature: Story = {\n  args: {\n    data: {\n      title: \"The World's No.1 Mobile Charging Brand*\",\n      features: [\n        {\n          title: '47%<br/>R&D Employees',\n        },\n      ],\n    },\n  },\n}\n\nexport const TwoFeatures: Story = {\n  args: {\n    data: {\n      title: \"The World's No.1 Mobile Charging Brand*\",\n      features: [\n        {\n          title: '47%<br/>R&D Employees',\n        },\n        {\n          title: '100 Million<br/>Global Customers',\n        },\n      ],\n    },\n  },\n}\n\nexport const CustomClassName: Story = {\n  args: {\n    data: {\n      title: \"The World's No.1 Mobile Charging Brand*\",\n      features: [\n        {\n          title: '47%<br/>R&D Employees',\n        },\n        {\n          title: '100 Million<br/>Global Customers',\n        },\n        {\n          title: 'Pioneering in Charging<br/>Technology for 12 Years',\n        },\n      ],\n    },\n    className: 'bg-gray-100',\n  },\n}\n\nexport const CustomStyle = () => {\n  return (\n    <Slogan\n      data={{\n        title: \"The World's No.1 Mobile Charging Brand*\",\n        features: [\n          {\n            title: '47%<br/>R&D Employees',\n          },\n          {\n            title: '100 Million<br/>Global Customers',\n          },\n          {\n            title: 'Pioneering in Charging<br/>Technology for 12 Years',\n          },\n        ],\n      }}\n      className=\"bg-gray-100\"\n      style={`\n        \n        .slogan-title{\n          background: linear-gradient(90deg, #ff0000, #00ff00, #0000ff);\n          -webkit-background-clip: text;\n          background-clip: text;\n          color: transparent;\n          animation: fadeIn 1s ease-in forwards;\n        }\n\n        @keyframes fadeIn {\n          from {\n            opacity: 0;\n          }\n          to {\n            opacity: 1;\n          }\n        }\n        .slogan-feature-text {\n          background-color: #f0f0f0;\n          padding: 10px;\n          border-radius: 10px;\n          animation: fadeIn 1s ease-in forwards;\n        }\n      `}\n    />\n  )\n}\n"],
-  "mappings": "AA+FI,cAAAA,MAAA,oBA/FJ,MAAkB,QAElB,OAAS,UAAAC,MAAc,6BAEvB,MAAMC,EAAO,CACX,MAAO,wBACP,UAAWD,EACX,WAAY,CACV,OAAQ,YACV,EACA,KAAM,CAAC,UAAU,CACnB,EAEA,IAAOE,EAAQD,EAIR,MAAME,EAAiB,CAC5B,KAAM,CACJ,KAAM,CACJ,MAAO,0CACP,SAAU,CACR,CACE,MAAO,uBACT,EACA,CACE,MAAO,kCACT,EACA,CACE,MAAO,oDACT,CACF,CACF,CACF,CACF,EAEaC,EAAmB,CAC9B,KAAM,CACJ,KAAM,CACJ,MAAO,yCACT,CACF,CACF,EAEaC,EAAuB,CAClC,KAAM,CACJ,KAAM,CACJ,MAAO,0CACP,SAAU,CACR,CACE,MAAO,uBACT,CACF,CACF,CACF,CACF,EAEaC,EAAqB,CAChC,KAAM,CACJ,KAAM,CACJ,MAAO,0CACP,SAAU,CACR,CACE,MAAO,uBACT,EACA,CACE,MAAO,kCACT,CACF,CACF,CACF,CACF,EAEaC,EAAyB,CACpC,KAAM,CACJ,KAAM,CACJ,MAAO,0CACP,SAAU,CACR,CACE,MAAO,uBACT,EACA,CACE,MAAO,kCACT,EACA,CACE,MAAO,oDACT,CACF,CACF,EACA,UAAW,aACb,CACF,EAEaC,EAAc,IAEvBT,EAACC,EAAA,CACC,KAAM,CACJ,MAAO,0CACP,SAAU,CACR,CACE,MAAO,uBACT,EACA,CACE,MAAO,kCACT,EACA,CACE,MAAO,oDACT,CACF,CACF,EACA,UAAU,cACV,MAAO;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,QAyBT",
-  "names": ["jsx", "Slogan", "meta", "slogan_stories_default", "Default", "TitleOnly", "SingleFeature", "TwoFeatures", "CustomClassName", "CustomStyle"]
+  "sourcesContent": ["import React from 'react'\nimport type { Meta, StoryObj } from '@storybook/react'\nimport { Slogan } from '../biz-components/index.js'\nimport { gsap } from 'gsap'\nimport { useGSAP } from '@gsap/react'\nimport { ScrollTrigger } from 'gsap/dist/ScrollTrigger'\nimport { SplitText } from 'gsap/dist/SplitText'\n\nconst meta = {\n  title: 'Biz Components/Slogan',\n  component: Slogan,\n  parameters: {\n    layout: 'fullscreen',\n  },\n  tags: ['autodocs'],\n} satisfies Meta<typeof Slogan>\n\nexport default meta\n\ntype Story = StoryObj<typeof meta>\n\nexport const Default: Story = {\n  args: {\n    GSAP: { gsap, ScrollTrigger, SplitText, useGSAP },\n    data: {\n      title: \"The World's No.1 Mobile Charging Brand*\",\n      features: [\n        {\n          title: '47%<br/>R&D Employees',\n        },\n        {\n          title: '100 Million<br/>Global Customers',\n        },\n        {\n          title: 'Pioneering in Charging<br/>Technology for 12 Years',\n        },\n      ],\n    },\n  },\n}\n\nexport const TitleOnly: Story = {\n  args: {\n    GSAP: { gsap, ScrollTrigger, SplitText, useGSAP },\n    data: {\n      title: \"The World's No.1 Mobile Charging Brand*\",\n    },\n  },\n}\n\nexport const SingleFeature: Story = {\n  args: {\n    GSAP: { gsap, ScrollTrigger, SplitText, useGSAP },\n    data: {\n      title: \"The World's No.1 Mobile Charging Brand*\",\n      features: [\n        {\n          title: '47%<br/>R&D Employees',\n        },\n      ],\n    },\n  },\n}\n\nexport const TwoFeatures: Story = {\n  args: {\n    GSAP: { gsap, ScrollTrigger, SplitText, useGSAP },\n    data: {\n      title: \"The World's No.1 Mobile Charging Brand*\",\n      features: [\n        {\n          title: '47%<br/>R&D Employees',\n        },\n        {\n          title: '100 Million<br/>Global Customers',\n        },\n      ],\n    },\n  },\n}\n\nexport const CustomClassName: Story = {\n  args: {\n    GSAP: { gsap, ScrollTrigger, SplitText, useGSAP },\n    data: {\n      title: \"The World's No.1 Mobile Charging Brand*\",\n      features: [\n        {\n          title: '47%<br/>R&D Employees',\n        },\n        {\n          title: '100 Million<br/>Global Customers',\n        },\n        {\n          title: 'Pioneering in Charging<br/>Technology for 12 Years',\n        },\n      ],\n    },\n    className: 'bg-gray-100',\n  },\n}\n\nexport const CustomStyle = () => {\n  return (\n    <Slogan\n      GSAP={{ gsap, ScrollTrigger, SplitText, useGSAP }}\n      data={{\n        title: \"The World's No.1 Mobile Charging Brand*\",\n        features: [\n          {\n            title: '47%<br/>R&D Employees',\n          },\n          {\n            title: '100 Million<br/>Global Customers',\n          },\n          {\n            title: 'Pioneering in Charging<br/>Technology for 12 Years',\n          },\n        ],\n      }}\n      className=\"bg-gray-100\"\n      style={`\n        \n        .slogan-title{\n          background: linear-gradient(90deg, #ff0000, #00ff00, #0000ff);\n          -webkit-background-clip: text;\n          background-clip: text;\n          color: transparent;\n          animation: fadeIn 1s ease-in forwards;\n        }\n\n        @keyframes fadeIn {\n          from {\n            opacity: 0;\n          }\n          to {\n            opacity: 1;\n          }\n        }\n        .slogan-feature-text {\n          background-color: #f0f0f0;\n          padding: 10px;\n          border-radius: 10px;\n          animation: fadeIn 1s ease-in forwards;\n        }\n      `}\n    />\n  )\n}\n"],
+  "mappings": "AAwGI,cAAAA,MAAA,oBAxGJ,MAAkB,QAElB,OAAS,UAAAC,MAAc,6BACvB,OAAS,QAAAC,MAAY,OACrB,OAAS,WAAAC,MAAe,cACxB,OAAS,iBAAAC,MAAqB,0BAC9B,OAAS,aAAAC,MAAiB,sBAE1B,MAAMC,EAAO,CACX,MAAO,wBACP,UAAWL,EACX,WAAY,CACV,OAAQ,YACV,EACA,KAAM,CAAC,UAAU,CACnB,EAEA,IAAOM,EAAQD,EAIR,MAAME,EAAiB,CAC5B,KAAM,CACJ,KAAM,CAAE,KAAAN,EAAM,cAAAE,EAAe,UAAAC,EAAW,QAAAF,CAAQ,EAChD,KAAM,CACJ,MAAO,0CACP,SAAU,CACR,CACE,MAAO,uBACT,EACA,CACE,MAAO,kCACT,EACA,CACE,MAAO,oDACT,CACF,CACF,CACF,CACF,EAEaM,EAAmB,CAC9B,KAAM,CACJ,KAAM,CAAE,KAAAP,EAAM,cAAAE,EAAe,UAAAC,EAAW,QAAAF,CAAQ,EAChD,KAAM,CACJ,MAAO,yCACT,CACF,CACF,EAEaO,EAAuB,CAClC,KAAM,CACJ,KAAM,CAAE,KAAAR,EAAM,cAAAE,EAAe,UAAAC,EAAW,QAAAF,CAAQ,EAChD,KAAM,CACJ,MAAO,0CACP,SAAU,CACR,CACE,MAAO,uBACT,CACF,CACF,CACF,CACF,EAEaQ,EAAqB,CAChC,KAAM,CACJ,KAAM,CAAE,KAAAT,EAAM,cAAAE,EAAe,UAAAC,EAAW,QAAAF,CAAQ,EAChD,KAAM,CACJ,MAAO,0CACP,SAAU,CACR,CACE,MAAO,uBACT,EACA,CACE,MAAO,kCACT,CACF,CACF,CACF,CACF,EAEaS,EAAyB,CACpC,KAAM,CACJ,KAAM,CAAE,KAAAV,EAAM,cAAAE,EAAe,UAAAC,EAAW,QAAAF,CAAQ,EAChD,KAAM,CACJ,MAAO,0CACP,SAAU,CACR,CACE,MAAO,uBACT,EACA,CACE,MAAO,kCACT,EACA,CACE,MAAO,oDACT,CACF,CACF,EACA,UAAW,aACb,CACF,EAEaU,EAAc,IAEvBb,EAACC,EAAA,CACC,KAAM,CAAE,KAAAC,EAAM,cAAAE,EAAe,UAAAC,EAAW,QAAAF,CAAQ,EAChD,KAAM,CACJ,MAAO,0CACP,SAAU,CACR,CACE,MAAO,uBACT,EACA,CACE,MAAO,kCACT,EACA,CACE,MAAO,oDACT,CACF,CACF,EACA,UAAU,cACV,MAAO;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,QAyBT",
+  "names": ["jsx", "Slogan", "gsap", "useGSAP", "ScrollTrigger", "SplitText", "meta", "slogan_stories_default", "Default", "TitleOnly", "SingleFeature", "TwoFeatures", "CustomClassName", "CustomStyle"]
 }

package/dist/esm/types/props.d.ts

@@ -26,3 +26,8 @@ export type Media = {
     focalX?: number;
     focalY?: number;
 };
+export type GSAPContext = {
+    gsap?: any;
+    ScrollTrigger?: any;
+    SplitText?: any;
+};

package/dist/tokens/anker.css

@@ -16,7 +16,7 @@
   --line-height-normal: 1.4;
   --line-height-loose: 1.6;
 
-
+  --brand-gradient-color-0: linear-gradient(90deg, var(--btn-bg-active-color) 0%, var(--btn-bg-active-color) 100%);
   /* 通用组件库anker品牌颜色 */
   --brand-color-0: #00befa;
 }

package/dist/tokens/base.css

@@ -37,7 +37,7 @@
   --info-white-color: #FFFFFF;
 
   --container-primary-color: #ffffff;
-  --container-secondary-color-0: #F7F8F9;
+  --container-secondary-color-0: #f5f5f7;
   --container-secondary-color-1: #EAEAEC;
   --bg-color-0: #f5f5f7;
   --bg-color-1: #ffffff;

package/dist/tokens/eufy.css

@@ -1,7 +1,9 @@
 :root {
-  --btn-text-color: #ffffff;
   --btn-bg-active-color: var(--brand-color-0);
 
+  --brand-gradient-color-0: linear-gradient(90deg, var(--btn-bg-active-color) 0%, var(--btn-bg-active-color) 100%);
+
+
   --btn-bg-secondary-color: transparent;
   --btn-bg-secondary-active-color: #555555;
   --btn-bg-secondary-disabled-color: #f5f5f550;

package/dist/tokens/eufyMake.css

@@ -1,8 +1,8 @@
 :root {
 
-  --btn-text-color: #fff;
   --btn-bg-active-color: var(--brand-color-0);
 
+  --brand-gradient-color-0: linear-gradient(90deg, var(--btn-bg-active-color) 0%, var(--btn-bg-active-color) 100%);
   --btn-radius: 24px;
   --radius: 0em;
 

package/dist/tokens/solix.css

@@ -1,5 +1,4 @@
 :root {
-  --btn-text-color: #fff;
   --btn-bg-active-color: var(--brand-color-0);
   
   --btn-radius: 24px;

package/dist/tokens/soundcore.css

@@ -1,7 +1,9 @@
 :root {
-  --btn-text-color: #ffffff;
   --btn-bg-active-color: var(--brand-color-0);
 
+  --brand-gradient-color-0: linear-gradient(90deg, var(--btn-bg-active-color) 0%, var(--btn-bg-active-color) 100%);
+
+
   --btn-bg-secondary-color: transparent;
   --btn-bg-secondary-active-color: #17bbef;
   --btn-bg-secondary-disabled-color: #f5f5f550;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@anker-in/headless-ui",
-  "version": "0.0.27-alpha.68",
+  "version": "0.0.27-alpha.72",
   "type": "commonjs",
   "main": "./dist/cjs/index.js",
   "types": "./dist/cjs/index.d.ts",
@@ -67,6 +67,7 @@
     "@babel/preset-env": "^7.24.6",
     "@babel/preset-react": "^7.24.6",
     "@babel/preset-typescript": "^7.24.6",
+    "@hyrious/esbuild-plugin-commonjs": "^0.2.6",
     "@testing-library/jest-dom": "^6.4.6",
     "@testing-library/react": "^14.3.1",
     "@types/jest": "^29.5.12",
@@ -115,11 +116,12 @@
     "swiper": "^11.1.3",
     "tailwind-merge": "^2.3.0",
     "tailwindcss": "^3.4.3",
-    "vaul": "^1.1.2"
+    "vaul": "^1.1.2",
+    "react-responsive": "10.0.1"
   },
   "peerDependencies": {
-    "gsap": "^3.13.0",
-    "@gsap/react": "^2.1.2"
+    "@gsap/react": "^2.1.2",
+    "gsap": "^3.13.0"
   },
   "publishConfig": {
     "access": "public",

package/style.css

@@ -729,10 +729,6 @@ video {
   width: 14px;
   height: 14px;
 }
-.size-\[72px\] {
-  width: 72px;
-  height: 72px;
-}
 .size-full {
   width: 100%;
   height: 100%;
@@ -792,9 +788,6 @@ video {
 .min-w-32 {
   min-width: 8rem;
 }
-.max-w-\[1772px\] {
-  max-width: 1772px;
-}
 .max-w-lg {
   max-width: 32rem;
 }
@@ -1007,9 +1000,6 @@ video {
 .bg-bg-1 {
   background-color: var(--bg-color-1);
 }
-.bg-bg-2 {
-  background-color: var(--bg-color-2);
-}
 .bg-black\/50 {
   background-color: rgb(0 0 0 / 0.5);
 }
@@ -1203,10 +1193,6 @@ video {
   padding-left: 1.75rem;
   padding-right: 1.75rem;
 }
-.px-8 {
-  padding-left: 2rem;
-  padding-right: 2rem;
-}
 .px-\[20px\] {
   padding-left: 20px;
   padding-right: 20px;
@@ -1288,12 +1274,6 @@ video {
 .text-right {
   text-align: right;
 }
-.font-body {
-  font-family: var(--font-inter), sans-serif;
-}
-.font-heading {
-  font-family: var(--font-montForAnker), sans-serif;
-}
 .text-2xl {
   font-size: 1.5rem;
   line-height: 2rem;
@@ -1328,12 +1308,12 @@ video {
 }
 .text-heading-4 {
   font-size: 32px;
-  line-height: 120%;
+  line-height: 100%;
   letter-spacing: -0.96px;
 }
 .text-heading-5 {
   font-size: 40px;
-  line-height: 120%;
+  line-height: 100%;
   letter-spacing: -1.12px;
 }
 .text-lg {
@@ -1346,17 +1326,17 @@ video {
 }
 .text-text-1 {
   font-size: var(--size-text-1);
-  line-height: var(--line-height-text-base);
+  line-height: var(--line-height-normal);
   letter-spacing: var(--letter-spacing-text-1);
 }
 .text-text-2 {
   font-size: var(--size-text-2);
-  line-height: var(--line-height-text-base);
+  line-height: var(--line-height-normal);
   letter-spacing: var(--letter-spacing-text-3);
 }
 .text-text-3 {
   font-size: var(--size-text-3);
-  line-height: var(--line-height-text-base);
+  line-height: var(--line-height-normal);
   letter-spacing: var(--letter-spacing-text-3);
 }
 .text-xs {
@@ -1596,6 +1576,9 @@ video {
 .hover\:bg-btn-secondary-active:hover {
   background-color: var(--info-primary-color);
 }
+.hover\:bg-gradient-brand:hover {
+  background-image: var(--brand-gradient-color-0);
+}
 .hover\:text-brand-0:hover {
   color: var(--brand-color-0);
 }
@@ -1860,10 +1843,6 @@ video {
   .lg-desktop\:p-6 {
     padding: 1.5rem;
   }
-  .lg-desktop\:px-32 {
-    padding-left: 8rem;
-    padding-right: 8rem;
-  }
   .lg-desktop\:px-6 {
     padding-left: 1.5rem;
     padding-right: 1.5rem;

package/tailwind.config.js

@@ -160,21 +160,21 @@ module.exports = {
         'text-1': [
           'var(--size-text-1)',
           {
-            lineHeight: 'var(--line-height-text-base)',
+            lineHeight: 'var(--line-height-normal)',
             letterSpacing: 'var(--letter-spacing-text-1)',
           },
         ],
         'text-2': [
           'var(--size-text-2)',
           {
-            lineHeight: 'var(--line-height-text-base)',
+            lineHeight: 'var(--line-height-normal)',
             letterSpacing: 'var(--letter-spacing-text-3)',
           },
         ],
         'text-3': [
           'var(--size-text-3)',
           {
-            lineHeight: 'var(--line-height-text-base)',
+            lineHeight: 'var(--line-height-normal)',
             letterSpacing: 'var(--letter-spacing-text-3)',
           },
         ],
@@ -202,22 +202,18 @@ module.exports = {
         'heading-4': [
           '32px',
           {
-            lineHeight: '120%',
+            lineHeight: '100%',
             letterSpacing: '-0.96px',
           },
         ],
         'heading-5': [
           '40px',
           {
-            lineHeight: '120%',
+            lineHeight: '100%',
             letterSpacing: '-1.12px',
           },
         ],
       },
-      fontFamily: {
-        heading: ['var(--font-montForAnker)', 'sans-serif'], // 标题字体
-        body: ['var(--font-inter)', 'sans-serif'], // 正文字体
-      },
     },
   },
 }