@anker-in/headless-ui 0.0.27-alpha.91 → 0.0.27-alpha.92
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/cjs/biz-components/Marquee/Marquee.d.ts +2 -1
- package/dist/cjs/biz-components/Marquee/Marquee.js +1 -1
- package/dist/cjs/biz-components/Marquee/Marquee.js.map +3 -3
- package/dist/cjs/biz-components/Marquee/type.d.ts +4 -1
- package/dist/cjs/biz-components/Marquee/type.js +1 -1
- package/dist/cjs/biz-components/Marquee/type.js.map +1 -1
- package/dist/cjs/stories/marquee.stories.d.ts +1 -1
- package/dist/cjs/stories/marquee.stories.js +1 -1
- package/dist/cjs/stories/marquee.stories.js.map +3 -3
- package/dist/esm/biz-components/Marquee/Marquee.d.ts +2 -1
- package/dist/esm/biz-components/Marquee/Marquee.js +1 -1
- package/dist/esm/biz-components/Marquee/Marquee.js.map +2 -2
- package/dist/esm/biz-components/Marquee/type.d.ts +4 -1
- package/dist/esm/stories/marquee.stories.d.ts +1 -1
- package/dist/esm/stories/marquee.stories.js +1 -1
- package/dist/esm/stories/marquee.stories.js.map +3 -3
- package/package.json +1 -1
|
@@ -1,5 +1,6 @@
|
|
|
1
1
|
import React from 'react';
|
|
2
2
|
import type { MarqueeProps, MarqueeItemProps, MarqueeImageContentProps, MarqueeTextContentProps } from './type.js';
|
|
3
|
+
import type { Swiper as SwiperType } from 'swiper/types';
|
|
3
4
|
declare const MarqueeItem: {
|
|
4
5
|
({ data, configuration }: MarqueeItemProps): import("react/jsx-runtime").JSX.Element;
|
|
5
6
|
displayName: string;
|
|
@@ -10,7 +11,7 @@ declare const MarqueeImageContent: {
|
|
|
10
11
|
};
|
|
11
12
|
declare const MarqueeTextContent: React.ForwardRefExoticComponent<MarqueeTextContentProps & React.RefAttributes<HTMLDivElement>>;
|
|
12
13
|
declare const _default: {
|
|
13
|
-
(props: Omit<MarqueeProps & React.RefAttributes<
|
|
14
|
+
(props: Omit<MarqueeProps & React.RefAttributes<SwiperType>, keyof import("../../shared/Styles.js").StylesProps> & Partial<import("../../shared/Styles.js").StylesProps> & {
|
|
14
15
|
className?: string;
|
|
15
16
|
data?: Record<string, any>;
|
|
16
17
|
}): import("react/jsx-runtime").JSX.Element;
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
"use strict";"use client";var
|
|
1
|
+
"use strict";"use client";var M=Object.create;var o=Object.defineProperty;var q=Object.getOwnPropertyDescriptor;var C=Object.getOwnPropertyNames;var S=Object.getPrototypeOf,N=Object.prototype.hasOwnProperty;var P=(e,r)=>{for(var a in r)o(e,a,{get:r[a],enumerable:!0})},d=(e,r,a,p)=>{if(r&&typeof r=="object"||typeof r=="function")for(let s of C(r))!N.call(e,s)&&s!==a&&o(e,s,{get:()=>r[s],enumerable:!(p=q(r,s))||p.enumerable});return e};var g=(e,r,a)=>(a=e!=null?M(S(e)):{},d(r||!e||!e.__esModule?o(a,"default",{value:e,enumerable:!0}):a,e)),I=e=>d(o({},"__esModule",{value:!0}),e);var h={};P(h,{MarqueeImageContent:()=>m,MarqueeItem:()=>l,MarqueeTextContent:()=>n,default:()=>T});module.exports=I(h);var t=require("react/jsx-runtime"),w=g(require("react")),u=require("../../components/index.js"),i=require("../../helpers/utils.js"),x=require("../../shared/Styles.js"),c=require("swiper/react"),y=require("swiper/modules");const f=w.default.forwardRef(({data:e,className:r},a)=>(0,t.jsx)(c.Swiper,{direction:"horizontal",className:(0,i.cn)("laptop:h-[80px] h-[48px] w-full items-center [&_.swiper-slide]:!w-auto [&_.swiper-wrapper]:!ease-linear",r),id:"Marquee"+e?.key,modules:[y.Autoplay],autoplay:{delay:1,disableOnInteraction:!1,reverseDirection:e?.reverseDirection},loop:!0,allowTouchMove:!1,centeredSlides:!0,slidesPerView:"auto",speed:e?.speed||3e3,breakpoints:{0:{spaceBetween:"24px"},1025:{spaceBetween:"64px"}},children:e?.items?.map((p,s)=>(0,t.jsx)(c.SwiperSlide,{children:(0,t.jsx)(l,{data:p})},p?.id+"SwiperSlide"+s))}));f.displayName="Marquee";const l=({data:e,configuration:r})=>(0,t.jsxs)(t.Fragment,{children:[e.type==="image"&&(0,t.jsx)(m,{image:e?.image,imageClassName:r?.imageClassName}),e.type==="text"&&(0,t.jsx)(n,{text:e?.text,textClassName:r?.textClassName})]});l.displayName="MarqueeItem";const m=({image:e,imageClassName:r})=>(0,t.jsx)("div",{className:"laptop:w-[120px] h-full w-[72px] shrink-0",children:(0,t.jsx)(u.Picture,{source:e?.url,alt:e?.alt||"",imgClassName:(0,i.cn)("object-cover",r)})});m.displayName="MarqueeImageContent";const n=w.default.forwardRef(({text:e,textClassName:r},a)=>(0,t.jsx)(u.Text,{as:"div",ref:a,html:e,className:(0,i.cn)("text-lines-2 flex size-full items-center justify-center font-medium leading-[1.2]",r)}));n.displayName="MarqueeTextContent";var T=(0,x.withStyles)(f);
|
|
2
2
|
//# sourceMappingURL=Marquee.js.map
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../../src/biz-components/Marquee/Marquee.tsx"],
|
|
4
|
-
"sourcesContent": ["'use client'\nimport React from 'react'\nimport { Picture, Text } from '../../components/index.js'\nimport { cn } from '../../helpers/utils.js'\nimport { withStyles } from '../../shared/Styles.js'\nimport
|
|
5
|
-
"mappings": "ukBAAA,IAAAA,EAAA,GAAAC,EAAAD,EAAA,yBAAAE,EAAA,gBAAAC,EAAA,uBAAAC,EAAA,YAAAC,IAAA,eAAAC,EAAAN,
|
|
6
|
-
"names": ["Marquee_exports", "__export", "MarqueeImageContent", "MarqueeItem", "MarqueeTextContent", "Marquee_default", "__toCommonJS", "import_jsx_runtime", "import_react", "import_components", "import_utils", "import_Styles", "
|
|
4
|
+
"sourcesContent": ["'use client'\nimport React from 'react'\nimport { Picture, Text } from '../../components/index.js'\nimport { cn } from '../../helpers/utils.js'\nimport { withStyles } from '../../shared/Styles.js'\nimport type { MarqueeProps, MarqueeItemProps, MarqueeImageContentProps, MarqueeTextContentProps } from './type.js'\n\nimport { Swiper, SwiperSlide } from 'swiper/react'\nimport type { Swiper as SwiperType } from 'swiper/types'\nimport { Autoplay } from 'swiper/modules'\n\nconst Marquee = React.forwardRef<SwiperType, MarqueeProps>(({ data, className }, ref) => {\n return (\n <Swiper\n direction=\"horizontal\"\n className={cn(\n 'laptop:h-[80px] h-[48px] w-full items-center [&_.swiper-slide]:!w-auto [&_.swiper-wrapper]:!ease-linear',\n className\n )}\n id={'Marquee' + data?.key}\n modules={[Autoplay]}\n autoplay={{\n delay: 1,\n disableOnInteraction: false,\n reverseDirection: data?.reverseDirection,\n }}\n loop={true}\n allowTouchMove={false}\n centeredSlides\n slidesPerView=\"auto\"\n speed={data?.speed || 3000}\n breakpoints={{\n 0: {\n spaceBetween: '24px',\n },\n 1025: {\n spaceBetween: '64px',\n },\n }}\n >\n {data?.items?.map((item, index) => (\n <SwiperSlide key={item?.id + 'SwiperSlide' + index}>\n <MarqueeItem data={item} />\n </SwiperSlide>\n ))}\n </Swiper>\n )\n})\nMarquee.displayName = 'Marquee'\n\nconst MarqueeItem = ({ data, configuration }: MarqueeItemProps) => {\n return (\n <>\n {data.type === 'image' && (\n <MarqueeImageContent image={data?.image} imageClassName={configuration?.imageClassName} />\n )}\n {data.type === 'text' && <MarqueeTextContent text={data?.text} textClassName={configuration?.textClassName} />}\n </>\n )\n}\n\nMarqueeItem.displayName = 'MarqueeItem'\n\nconst MarqueeImageContent = ({ image, imageClassName }: MarqueeImageContentProps) => {\n return (\n <div className=\"laptop:w-[120px] h-full w-[72px] shrink-0\">\n <Picture source={image?.url} alt={image?.alt || ''} imgClassName={cn('object-cover', imageClassName)} />\n </div>\n )\n}\n\nMarqueeImageContent.displayName = 'MarqueeImageContent'\n\nconst MarqueeTextContent = React.forwardRef<HTMLDivElement, MarqueeTextContentProps>(({ text, textClassName }, ref) => {\n return (\n <Text\n as=\"div\"\n ref={ref}\n html={text}\n className={cn('text-lines-2 flex size-full items-center justify-center font-medium leading-[1.2]', textClassName)}\n />\n )\n})\n\nMarqueeTextContent.displayName = 'MarqueeTextContent'\n\nexport default withStyles(Marquee)\nexport { MarqueeItem, MarqueeImageContent, MarqueeTextContent }\n"],
|
|
5
|
+
"mappings": "ukBAAA,IAAAA,EAAA,GAAAC,EAAAD,EAAA,yBAAAE,EAAA,gBAAAC,EAAA,uBAAAC,EAAA,YAAAC,IAAA,eAAAC,EAAAN,GA0CU,IAAAO,EAAA,6BAzCVC,EAAkB,oBAClBC,EAA8B,qCAC9BC,EAAmB,kCACnBC,EAA2B,kCAG3BH,EAAoC,wBAEpCI,EAAyB,0BAEzB,MAAMC,EAAU,EAAAC,QAAM,WAAqC,CAAC,CAAE,KAAAC,EAAM,UAAAC,CAAU,EAAGC,OAE7E,OAAC,UACC,UAAU,aACV,aAAW,MACT,0GACAD,CACF,EACA,GAAI,UAAYD,GAAM,IACtB,QAAS,CAAC,UAAQ,EAClB,SAAU,CACR,MAAO,EACP,qBAAsB,GACtB,iBAAkBA,GAAM,gBAC1B,EACA,KAAM,GACN,eAAgB,GAChB,eAAc,GACd,cAAc,OACd,MAAOA,GAAM,OAAS,IACtB,YAAa,CACX,EAAG,CACD,aAAc,MAChB,EACA,KAAM,CACJ,aAAc,MAChB,CACF,EAEC,SAAAA,GAAM,OAAO,IAAI,CAACG,EAAMC,OACvB,OAAC,eACC,mBAAChB,EAAA,CAAY,KAAMe,EAAM,GADTA,GAAM,GAAK,cAAgBC,CAE7C,CACD,EACH,CAEH,EACDN,EAAQ,YAAc,UAEtB,MAAMV,EAAc,CAAC,CAAE,KAAAY,EAAM,cAAAK,CAAc,OAEvC,oBACG,UAAAL,EAAK,OAAS,YACb,OAACb,EAAA,CAAoB,MAAOa,GAAM,MAAO,eAAgBK,GAAe,eAAgB,EAEzFL,EAAK,OAAS,WAAU,OAACX,EAAA,CAAmB,KAAMW,GAAM,KAAM,cAAeK,GAAe,cAAe,GAC9G,EAIJjB,EAAY,YAAc,cAE1B,MAAMD,EAAsB,CAAC,CAAE,MAAAmB,EAAO,eAAAC,CAAe,OAEjD,OAAC,OAAI,UAAU,4CACb,mBAAC,WAAQ,OAAQD,GAAO,IAAK,IAAKA,GAAO,KAAO,GAAI,gBAAc,MAAG,eAAgBC,CAAc,EAAG,EACxG,EAIJpB,EAAoB,YAAc,sBAElC,MAAME,EAAqB,EAAAU,QAAM,WAAoD,CAAC,CAAE,KAAAS,EAAM,cAAAC,CAAc,EAAGP,OAE3G,OAAC,QACC,GAAG,MACH,IAAKA,EACL,KAAMM,EACN,aAAW,MAAG,oFAAqFC,CAAa,EAClH,CAEH,EAEDpB,EAAmB,YAAc,qBAEjC,IAAOC,KAAQ,cAAWQ,CAAO",
|
|
6
|
+
"names": ["Marquee_exports", "__export", "MarqueeImageContent", "MarqueeItem", "MarqueeTextContent", "Marquee_default", "__toCommonJS", "import_jsx_runtime", "import_react", "import_components", "import_utils", "import_Styles", "import_modules", "Marquee", "React", "data", "className", "ref", "item", "index", "configuration", "image", "imageClassName", "text", "textClassName"]
|
|
7
7
|
}
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
"use strict";var s=Object.defineProperty;var
|
|
1
|
+
"use strict";var s=Object.defineProperty;var i=Object.getOwnPropertyDescriptor;var m=Object.getOwnPropertyNames;var o=Object.prototype.hasOwnProperty;var g=(t,e,n,a)=>{if(e&&typeof e=="object"||typeof e=="function")for(let r of m(e))!o.call(t,r)&&r!==n&&s(t,r,{get:()=>e[r],enumerable:!(a=i(e,r))||a.enumerable});return t};var p=t=>g(s({},"__esModule",{value:!0}),t);var u={};module.exports=p(u);
|
|
2
2
|
//# sourceMappingURL=type.js.map
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../../src/biz-components/Marquee/type.ts"],
|
|
4
|
-
"sourcesContent": ["import type { Img } from '../../types/props.js'\n\ninterface MarqueeProps {\n data: {\n key?: string\n /** \u662F\u5426\u53CD\u5411 */\n reverseDirection?: boolean\n /** \u901F\u5EA6 */\n speed?: number\n /** \u8DD1\u9A6C\u706F\u5185\u5BB9 */\n items: any[]\n }\n className?: string\n}\n\ninterface MarqueeItemProps {\n data: {\n type: 'image' | 'text'\n image?: Img\n text?: string\n }\n configuration?:
|
|
4
|
+
"sourcesContent": ["import type { Img } from '../../types/props.js'\n\ninterface MarqueeProps {\n data: {\n key?: string\n /** \u662F\u5426\u53CD\u5411 */\n reverseDirection?: boolean\n /** \u901F\u5EA6 */\n speed?: number\n /** \u8DD1\u9A6C\u706F\u5185\u5BB9 */\n items: any[]\n }\n className?: string\n}\n\ninterface MarqueeItemProps {\n data: {\n type: 'image' | 'text'\n image?: Img\n text?: string\n }\n configuration?: {\n imageClassName?: string\n textClassName?: string\n }\n}\n\ninterface MarqueeImageContentProps {\n image?: Img\n imageClassName?: string\n}\n\ninterface MarqueeTextContentProps {\n text?: string\n textClassName?: string\n}\n\nexport type { MarqueeProps, MarqueeItemProps, MarqueeImageContentProps, MarqueeTextContentProps }\n"],
|
|
5
5
|
"mappings": "+WAAA,IAAAA,EAAA,kBAAAC,EAAAD",
|
|
6
6
|
"names": ["type_exports", "__toCommonJS"]
|
|
7
7
|
}
|
|
@@ -4,7 +4,7 @@ import type { MarqueeProps } from '../biz-components/Marquee/type.js';
|
|
|
4
4
|
declare const meta: {
|
|
5
5
|
title: string;
|
|
6
6
|
component: {
|
|
7
|
-
(props: Omit<MarqueeProps & React.RefAttributes<
|
|
7
|
+
(props: Omit<MarqueeProps & React.RefAttributes<import("swiper/types").Swiper>, keyof import("../shared/Styles.js").StylesProps> & Partial<import("../shared/Styles.js").StylesProps> & {
|
|
8
8
|
className?: string;
|
|
9
9
|
data?: Record<string, any>;
|
|
10
10
|
}): import("react/jsx-runtime").JSX.Element;
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
"use strict";var
|
|
1
|
+
"use strict";var m=Object.create;var r=Object.defineProperty;var g=Object.getOwnPropertyDescriptor;var c=Object.getOwnPropertyNames;var l=Object.getPrototypeOf,y=Object.prototype.hasOwnProperty;var u=(e,t)=>{for(var a in t)r(e,a,{get:t[a],enumerable:!0})},n=(e,t,a,p)=>{if(t&&typeof t=="object"||typeof t=="function")for(let o of c(t))!y.call(e,o)&&o!==a&&r(e,o,{get:()=>t[o],enumerable:!(p=g(t,o))||p.enumerable});return e};var f=(e,t,a)=>(a=e!=null?m(l(e)):{},n(t||!e||!e.__esModule?r(a,"default",{value:e,enumerable:!0}):a,e)),M=e=>n(r({},"__esModule",{value:!0}),e);var b={};u(b,{Default:()=>d,MarqueeDirection:()=>T,MarqueeImage:()=>C,MarqueeText:()=>v,default:()=>h});module.exports=M(b);var k=require("react"),s=f(require("../biz-components/Marquee/index.js"));const q={title:"Biz Components/Marquee",component:s.default,subcomponents:{MarqueeItem:s.MarqueeItem,MarqueeImageContent:s.MarqueeImageContent,MarqueeTextContent:s.MarqueeTextContent},parameters:{layout:"fullscreen",docs:{description:{component:"\u8DD1\u9A6C\u706FMarquee\uFF0C\u57FA\u4E8Ehttps://swiperjs.com/swiper-api"}}},tags:["autodocs"]};var h=q;const i={key:"Marquee",items:[{type:"image",image:{url:"https://cdn.shopify.com/s/files/1/0521/9411/5753/files/Rectangle_6339.png?v=1745400317"}},{type:"text",text:"\u8DD1\u9A6C\u706F\u7EC4\u4EF6"},{type:"image",image:{url:"https://cdn.shopify.com/s/files/1/0521/9411/5753/files/Rectangle_224.png?v=1745400317"}},{type:"text",text:"\u53E6\u4E00\u4E2A\u8DD1\u9A6C\u706F\u7EC4\u4EF6"},{type:"image",image:{url:"https://cdn.shopify.com/s/files/1/0521/9411/5753/files/Rectangle_222.png?v=1745400317"}}]},d={args:{data:i}},x={key:"MarqueeImage",items:[{type:"image",image:{url:"https://cdn.shopify.com/s/files/1/0521/9411/5753/files/Rectangle_6339.png?v=1745400317"}},{type:"image",image:{url:"https://cdn.shopify.com/s/files/1/0521/9411/5753/files/Rectangle_224.png?v=1745400317"}},{type:"image",image:{url:"https://cdn.shopify.com/s/files/1/0521/9411/5753/files/Rectangle_222.png?v=1745400317"}},{type:"image",image:{url:"https://cdn.shopify.com/s/files/1/0521/9411/5753/files/Rectangle_6339.png?v=1745400317"}},{type:"image",image:{url:"https://cdn.shopify.com/s/files/1/0521/9411/5753/files/Rectangle_224.png?v=1745400317"}},{type:"image",image:{url:"https://cdn.shopify.com/s/files/1/0521/9411/5753/files/Rectangle_222.png?v=1745400317"}}]},C={args:{data:x}},R={key:"MarqueeText",items:[{type:"text",text:"47%<br>R&D Employees"},{type:"text",text:"100 Million<br>Global Customers"},{type:"text",text:"Pioneering in Charging<br>Technology for 12 Years"}]},v={args:{data:R}},T={args:{data:{...i,reverseDirection:!0}}};
|
|
2
2
|
//# sourceMappingURL=marquee.stories.js.map
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../src/stories/marquee.stories.tsx"],
|
|
4
|
-
"sourcesContent": ["import React, { type ComponentType } from 'react'\nimport type { Meta, StoryObj } from '@storybook/react'\nimport Marquee, { MarqueeItem, MarqueeImageContent, MarqueeTextContent } from '../biz-components/Marquee/index.js'\nimport type { MarqueeProps } from '../biz-components/Marquee/type.js'\n\nconst meta = {\n title: 'Biz Components/Marquee',\n component: Marquee,\n subcomponents: {\n MarqueeItem: MarqueeItem as ComponentType<unknown>,\n MarqueeImageContent: MarqueeImageContent as ComponentType<unknown>,\n MarqueeTextContent: MarqueeTextContent as ComponentType<unknown>,\n },\n parameters: {\n layout: 'fullscreen',\n docs: {\n description: {\n component: '\u8DD1\u9A6C\u706FMarquee\uFF0C\u57FA\u4E8Ehttps://swiperjs.com/swiper-api',\n },\n },\n },\n tags: ['autodocs'],\n} satisfies Meta<typeof Marquee>\n\nexport default meta\n\ntype Story = StoryObj<typeof meta>\n\nconst MarqueeData = {\n key: 'Marquee',\n items: [\n {\n type: 'image',\n image: { url: 'https://cdn.shopify.com/s/files/1/0521/9411/5753/files/Rectangle_6339.png?v=1745400317' },\n },\n { type: 'text', text: '\u8DD1\u9A6C\u706F\u7EC4\u4EF6' },\n {\n type: 'image',\n image: { url: 'https://cdn.shopify.com/s/files/1/0521/9411/5753/files/Rectangle_224.png?v=1745400317' },\n },\n { type: 'text', text: '\u53E6\u4E00\u4E2A\u8DD1\u9A6C\u706F\u7EC4\u4EF6' },\n {\n type: 'image',\n image: { url: 'https://cdn.shopify.com/s/files/1/0521/9411/5753/files/Rectangle_222.png?v=1745400317' },\n },\n ] as MarqueeProps['data']['items'],\n}\n\nexport const Default: Story = {\n args: {\n data: MarqueeData,\n },\n
|
|
5
|
-
"mappings": "0jBAAA,IAAAA,EAAA,GAAAC,EAAAD,EAAA,aAAAE,EAAA,qBAAAC,EAAA,iBAAAC,EAAA,gBAAAC,EAAA,YAAAC,IAAA,eAAAC,EAAAP,
|
|
6
|
-
"names": ["marquee_stories_exports", "__export", "Default", "MarqueeDirection", "MarqueeImage", "MarqueeText", "marquee_stories_default", "__toCommonJS", "
|
|
4
|
+
"sourcesContent": ["import React, { type ComponentType } from 'react'\nimport type { Meta, StoryObj } from '@storybook/react'\nimport Marquee, { MarqueeItem, MarqueeImageContent, MarqueeTextContent } from '../biz-components/Marquee/index.js'\nimport type { MarqueeProps } from '../biz-components/Marquee/type.js'\n\nconst meta = {\n title: 'Biz Components/Marquee',\n component: Marquee,\n subcomponents: {\n MarqueeItem: MarqueeItem as ComponentType<unknown>,\n MarqueeImageContent: MarqueeImageContent as ComponentType<unknown>,\n MarqueeTextContent: MarqueeTextContent as ComponentType<unknown>,\n },\n parameters: {\n layout: 'fullscreen',\n docs: {\n description: {\n component: '\u8DD1\u9A6C\u706FMarquee\uFF0C\u57FA\u4E8Ehttps://swiperjs.com/swiper-api',\n },\n },\n },\n tags: ['autodocs'],\n} satisfies Meta<typeof Marquee>\n\nexport default meta\n\ntype Story = StoryObj<typeof meta>\n\nconst MarqueeData = {\n key: 'Marquee',\n items: [\n {\n type: 'image',\n image: { url: 'https://cdn.shopify.com/s/files/1/0521/9411/5753/files/Rectangle_6339.png?v=1745400317' },\n },\n { type: 'text', text: '\u8DD1\u9A6C\u706F\u7EC4\u4EF6' },\n {\n type: 'image',\n image: { url: 'https://cdn.shopify.com/s/files/1/0521/9411/5753/files/Rectangle_224.png?v=1745400317' },\n },\n { type: 'text', text: '\u53E6\u4E00\u4E2A\u8DD1\u9A6C\u706F\u7EC4\u4EF6' },\n {\n type: 'image',\n image: { url: 'https://cdn.shopify.com/s/files/1/0521/9411/5753/files/Rectangle_222.png?v=1745400317' },\n },\n ] as MarqueeProps['data']['items'],\n}\n\nexport const Default: Story = {\n args: {\n data: MarqueeData,\n },\n}\n\nconst MarqueeImageData = {\n key: 'MarqueeImage',\n items: [\n {\n type: 'image',\n image: { url: 'https://cdn.shopify.com/s/files/1/0521/9411/5753/files/Rectangle_6339.png?v=1745400317' },\n },\n {\n type: 'image',\n image: { url: 'https://cdn.shopify.com/s/files/1/0521/9411/5753/files/Rectangle_224.png?v=1745400317' },\n },\n {\n type: 'image',\n image: { url: 'https://cdn.shopify.com/s/files/1/0521/9411/5753/files/Rectangle_222.png?v=1745400317' },\n },\n {\n type: 'image',\n image: { url: 'https://cdn.shopify.com/s/files/1/0521/9411/5753/files/Rectangle_6339.png?v=1745400317' },\n },\n {\n type: 'image',\n image: { url: 'https://cdn.shopify.com/s/files/1/0521/9411/5753/files/Rectangle_224.png?v=1745400317' },\n },\n {\n type: 'image',\n image: { url: 'https://cdn.shopify.com/s/files/1/0521/9411/5753/files/Rectangle_222.png?v=1745400317' },\n },\n ] as MarqueeProps['data']['items'],\n}\n\nexport const MarqueeImage: Story = {\n args: {\n data: MarqueeImageData,\n },\n}\n\nconst MarqueeTextData = {\n key: 'MarqueeText',\n items: [\n { type: 'text', text: '47%<br>R&D Employees' },\n { type: 'text', text: '100 Million<br>Global Customers' },\n { type: 'text', text: 'Pioneering in Charging<br>Technology for 12 Years' },\n ] as MarqueeProps['data']['items'],\n}\nexport const MarqueeText: Story = {\n args: {\n data: MarqueeTextData,\n },\n}\n\nexport const MarqueeDirection: Story = {\n args: {\n data: {\n ...MarqueeData,\n reverseDirection: true,\n },\n },\n}\n"],
|
|
5
|
+
"mappings": "0jBAAA,IAAAA,EAAA,GAAAC,EAAAD,EAAA,aAAAE,EAAA,qBAAAC,EAAA,iBAAAC,EAAA,gBAAAC,EAAA,YAAAC,IAAA,eAAAC,EAAAP,GAAA,IAAAQ,EAA0C,iBAE1CC,EAA8E,iDAG9E,MAAMC,EAAO,CACX,MAAO,yBACP,UAAW,EAAAC,QACX,cAAe,CACb,YAAa,cACb,oBAAqB,sBACrB,mBAAoB,oBACtB,EACA,WAAY,CACV,OAAQ,aACR,KAAM,CACJ,YAAa,CACX,UAAW,4EACb,CACF,CACF,EACA,KAAM,CAAC,UAAU,CACnB,EAEA,IAAOL,EAAQI,EAIf,MAAME,EAAc,CAClB,IAAK,UACL,MAAO,CACL,CACE,KAAM,QACN,MAAO,CAAE,IAAK,wFAAyF,CACzG,EACA,CAAE,KAAM,OAAQ,KAAM,gCAAQ,EAC9B,CACE,KAAM,QACN,MAAO,CAAE,IAAK,uFAAwF,CACxG,EACA,CAAE,KAAM,OAAQ,KAAM,kDAAW,EACjC,CACE,KAAM,QACN,MAAO,CAAE,IAAK,uFAAwF,CACxG,CACF,CACF,EAEaV,EAAiB,CAC5B,KAAM,CACJ,KAAMU,CACR,CACF,EAEMC,EAAmB,CACvB,IAAK,eACL,MAAO,CACL,CACE,KAAM,QACN,MAAO,CAAE,IAAK,wFAAyF,CACzG,EACA,CACE,KAAM,QACN,MAAO,CAAE,IAAK,uFAAwF,CACxG,EACA,CACE,KAAM,QACN,MAAO,CAAE,IAAK,uFAAwF,CACxG,EACA,CACE,KAAM,QACN,MAAO,CAAE,IAAK,wFAAyF,CACzG,EACA,CACE,KAAM,QACN,MAAO,CAAE,IAAK,uFAAwF,CACxG,EACA,CACE,KAAM,QACN,MAAO,CAAE,IAAK,uFAAwF,CACxG,CACF,CACF,EAEaT,EAAsB,CACjC,KAAM,CACJ,KAAMS,CACR,CACF,EAEMC,EAAkB,CACtB,IAAK,cACL,MAAO,CACL,CAAE,KAAM,OAAQ,KAAM,sBAAuB,EAC7C,CAAE,KAAM,OAAQ,KAAM,iCAAkC,EACxD,CAAE,KAAM,OAAQ,KAAM,mDAAoD,CAC5E,CACF,EACaT,EAAqB,CAChC,KAAM,CACJ,KAAMS,CACR,CACF,EAEaX,EAA0B,CACrC,KAAM,CACJ,KAAM,CACJ,GAAGS,EACH,iBAAkB,EACpB,CACF,CACF",
|
|
6
|
+
"names": ["marquee_stories_exports", "__export", "Default", "MarqueeDirection", "MarqueeImage", "MarqueeText", "marquee_stories_default", "__toCommonJS", "import_react", "import_Marquee", "meta", "Marquee", "MarqueeData", "MarqueeImageData", "MarqueeTextData"]
|
|
7
7
|
}
|
|
@@ -1,5 +1,6 @@
|
|
|
1
1
|
import React from 'react';
|
|
2
2
|
import type { MarqueeProps, MarqueeItemProps, MarqueeImageContentProps, MarqueeTextContentProps } from './type.js';
|
|
3
|
+
import type { Swiper as SwiperType } from 'swiper/types';
|
|
3
4
|
declare const MarqueeItem: {
|
|
4
5
|
({ data, configuration }: MarqueeItemProps): import("react/jsx-runtime").JSX.Element;
|
|
5
6
|
displayName: string;
|
|
@@ -10,7 +11,7 @@ declare const MarqueeImageContent: {
|
|
|
10
11
|
};
|
|
11
12
|
declare const MarqueeTextContent: React.ForwardRefExoticComponent<MarqueeTextContentProps & React.RefAttributes<HTMLDivElement>>;
|
|
12
13
|
declare const _default: {
|
|
13
|
-
(props: Omit<MarqueeProps & React.RefAttributes<
|
|
14
|
+
(props: Omit<MarqueeProps & React.RefAttributes<SwiperType>, keyof import("../../shared/Styles.js").StylesProps> & Partial<import("../../shared/Styles.js").StylesProps> & {
|
|
14
15
|
className?: string;
|
|
15
16
|
data?: Record<string, any>;
|
|
16
17
|
}): import("react/jsx-runtime").JSX.Element;
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
"use client";import{Fragment as
|
|
1
|
+
"use client";import{Fragment as M,jsx as t,jsxs as q}from"react/jsx-runtime";import m from"react";import{Picture as c,Text as w}from"../../components/index.js";import{cn as a}from"../../helpers/utils.js";import{withStyles as d}from"../../shared/Styles.js";import{Swiper as f,SwiperSlide as x}from"swiper/react";import{Autoplay as y}from"swiper/modules";const n=m.forwardRef(({data:e,className:r},i)=>t(f,{direction:"horizontal",className:a("laptop:h-[80px] h-[48px] w-full items-center [&_.swiper-slide]:!w-auto [&_.swiper-wrapper]:!ease-linear",r),id:"Marquee"+e?.key,modules:[y],autoplay:{delay:1,disableOnInteraction:!1,reverseDirection:e?.reverseDirection},loop:!0,allowTouchMove:!1,centeredSlides:!0,slidesPerView:"auto",speed:e?.speed||3e3,breakpoints:{0:{spaceBetween:"24px"},1025:{spaceBetween:"64px"}},children:e?.items?.map((l,u)=>t(x,{children:t(s,{data:l})},l?.id+"SwiperSlide"+u))}));n.displayName="Marquee";const s=({data:e,configuration:r})=>q(M,{children:[e.type==="image"&&t(p,{image:e?.image,imageClassName:r?.imageClassName}),e.type==="text"&&t(o,{text:e?.text,textClassName:r?.textClassName})]});s.displayName="MarqueeItem";const p=({image:e,imageClassName:r})=>t("div",{className:"laptop:w-[120px] h-full w-[72px] shrink-0",children:t(c,{source:e?.url,alt:e?.alt||"",imgClassName:a("object-cover",r)})});p.displayName="MarqueeImageContent";const o=m.forwardRef(({text:e,textClassName:r},i)=>t(w,{as:"div",ref:i,html:e,className:a("text-lines-2 flex size-full items-center justify-center font-medium leading-[1.2]",r)}));o.displayName="MarqueeTextContent";var T=d(n);export{p as MarqueeImageContent,s as MarqueeItem,o as MarqueeTextContent,T as default};
|
|
2
2
|
//# sourceMappingURL=Marquee.js.map
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../../src/biz-components/Marquee/Marquee.tsx"],
|
|
4
|
-
"sourcesContent": ["'use client'\nimport React from 'react'\nimport { Picture, Text } from '../../components/index.js'\nimport { cn } from '../../helpers/utils.js'\nimport { withStyles } from '../../shared/Styles.js'\nimport
|
|
5
|
-
"mappings": "
|
|
4
|
+
"sourcesContent": ["'use client'\nimport React from 'react'\nimport { Picture, Text } from '../../components/index.js'\nimport { cn } from '../../helpers/utils.js'\nimport { withStyles } from '../../shared/Styles.js'\nimport type { MarqueeProps, MarqueeItemProps, MarqueeImageContentProps, MarqueeTextContentProps } from './type.js'\n\nimport { Swiper, SwiperSlide } from 'swiper/react'\nimport type { Swiper as SwiperType } from 'swiper/types'\nimport { Autoplay } from 'swiper/modules'\n\nconst Marquee = React.forwardRef<SwiperType, MarqueeProps>(({ data, className }, ref) => {\n return (\n <Swiper\n direction=\"horizontal\"\n className={cn(\n 'laptop:h-[80px] h-[48px] w-full items-center [&_.swiper-slide]:!w-auto [&_.swiper-wrapper]:!ease-linear',\n className\n )}\n id={'Marquee' + data?.key}\n modules={[Autoplay]}\n autoplay={{\n delay: 1,\n disableOnInteraction: false,\n reverseDirection: data?.reverseDirection,\n }}\n loop={true}\n allowTouchMove={false}\n centeredSlides\n slidesPerView=\"auto\"\n speed={data?.speed || 3000}\n breakpoints={{\n 0: {\n spaceBetween: '24px',\n },\n 1025: {\n spaceBetween: '64px',\n },\n }}\n >\n {data?.items?.map((item, index) => (\n <SwiperSlide key={item?.id + 'SwiperSlide' + index}>\n <MarqueeItem data={item} />\n </SwiperSlide>\n ))}\n </Swiper>\n )\n})\nMarquee.displayName = 'Marquee'\n\nconst MarqueeItem = ({ data, configuration }: MarqueeItemProps) => {\n return (\n <>\n {data.type === 'image' && (\n <MarqueeImageContent image={data?.image} imageClassName={configuration?.imageClassName} />\n )}\n {data.type === 'text' && <MarqueeTextContent text={data?.text} textClassName={configuration?.textClassName} />}\n </>\n )\n}\n\nMarqueeItem.displayName = 'MarqueeItem'\n\nconst MarqueeImageContent = ({ image, imageClassName }: MarqueeImageContentProps) => {\n return (\n <div className=\"laptop:w-[120px] h-full w-[72px] shrink-0\">\n <Picture source={image?.url} alt={image?.alt || ''} imgClassName={cn('object-cover', imageClassName)} />\n </div>\n )\n}\n\nMarqueeImageContent.displayName = 'MarqueeImageContent'\n\nconst MarqueeTextContent = React.forwardRef<HTMLDivElement, MarqueeTextContentProps>(({ text, textClassName }, ref) => {\n return (\n <Text\n as=\"div\"\n ref={ref}\n html={text}\n className={cn('text-lines-2 flex size-full items-center justify-center font-medium leading-[1.2]', textClassName)}\n />\n )\n})\n\nMarqueeTextContent.displayName = 'MarqueeTextContent'\n\nexport default withStyles(Marquee)\nexport { MarqueeItem, MarqueeImageContent, MarqueeTextContent }\n"],
|
|
5
|
+
"mappings": "aA0CU,OAUN,YAAAA,EAVM,OAAAC,EAUN,QAAAC,MAVM,oBAzCV,OAAOC,MAAW,QAClB,OAAS,WAAAC,EAAS,QAAAC,MAAY,4BAC9B,OAAS,MAAAC,MAAU,yBACnB,OAAS,cAAAC,MAAkB,yBAG3B,OAAS,UAAAC,EAAQ,eAAAC,MAAmB,eAEpC,OAAS,YAAAC,MAAgB,iBAEzB,MAAMC,EAAUR,EAAM,WAAqC,CAAC,CAAE,KAAAS,EAAM,UAAAC,CAAU,EAAGC,IAE7Eb,EAACO,EAAA,CACC,UAAU,aACV,UAAWF,EACT,0GACAO,CACF,EACA,GAAI,UAAYD,GAAM,IACtB,QAAS,CAACF,CAAQ,EAClB,SAAU,CACR,MAAO,EACP,qBAAsB,GACtB,iBAAkBE,GAAM,gBAC1B,EACA,KAAM,GACN,eAAgB,GAChB,eAAc,GACd,cAAc,OACd,MAAOA,GAAM,OAAS,IACtB,YAAa,CACX,EAAG,CACD,aAAc,MAChB,EACA,KAAM,CACJ,aAAc,MAChB,CACF,EAEC,SAAAA,GAAM,OAAO,IAAI,CAACG,EAAMC,IACvBf,EAACQ,EAAA,CACC,SAAAR,EAACgB,EAAA,CAAY,KAAMF,EAAM,GADTA,GAAM,GAAK,cAAgBC,CAE7C,CACD,EACH,CAEH,EACDL,EAAQ,YAAc,UAEtB,MAAMM,EAAc,CAAC,CAAE,KAAAL,EAAM,cAAAM,CAAc,IAEvChB,EAAAF,EAAA,CACG,UAAAY,EAAK,OAAS,SACbX,EAACkB,EAAA,CAAoB,MAAOP,GAAM,MAAO,eAAgBM,GAAe,eAAgB,EAEzFN,EAAK,OAAS,QAAUX,EAACmB,EAAA,CAAmB,KAAMR,GAAM,KAAM,cAAeM,GAAe,cAAe,GAC9G,EAIJD,EAAY,YAAc,cAE1B,MAAME,EAAsB,CAAC,CAAE,MAAAE,EAAO,eAAAC,CAAe,IAEjDrB,EAAC,OAAI,UAAU,4CACb,SAAAA,EAACG,EAAA,CAAQ,OAAQiB,GAAO,IAAK,IAAKA,GAAO,KAAO,GAAI,aAAcf,EAAG,eAAgBgB,CAAc,EAAG,EACxG,EAIJH,EAAoB,YAAc,sBAElC,MAAMC,EAAqBjB,EAAM,WAAoD,CAAC,CAAE,KAAAoB,EAAM,cAAAC,CAAc,EAAGV,IAE3Gb,EAACI,EAAA,CACC,GAAG,MACH,IAAKS,EACL,KAAMS,EACN,UAAWjB,EAAG,oFAAqFkB,CAAa,EAClH,CAEH,EAEDJ,EAAmB,YAAc,qBAEjC,IAAOK,EAAQlB,EAAWI,CAAO",
|
|
6
6
|
"names": ["Fragment", "jsx", "jsxs", "React", "Picture", "Text", "cn", "withStyles", "Swiper", "SwiperSlide", "Autoplay", "Marquee", "data", "className", "ref", "item", "index", "MarqueeItem", "configuration", "MarqueeImageContent", "MarqueeTextContent", "image", "imageClassName", "text", "textClassName", "Marquee_default"]
|
|
7
7
|
}
|
|
@@ -4,7 +4,7 @@ import type { MarqueeProps } from '../biz-components/Marquee/type.js';
|
|
|
4
4
|
declare const meta: {
|
|
5
5
|
title: string;
|
|
6
6
|
component: {
|
|
7
|
-
(props: Omit<MarqueeProps & React.RefAttributes<
|
|
7
|
+
(props: Omit<MarqueeProps & React.RefAttributes<import("swiper/types").Swiper>, keyof import("../shared/Styles.js").StylesProps> & Partial<import("../shared/Styles.js").StylesProps> & {
|
|
8
8
|
className?: string;
|
|
9
9
|
data?: Record<string, any>;
|
|
10
10
|
}): import("react/jsx-runtime").JSX.Element;
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import
|
|
1
|
+
import"react";import t,{MarqueeItem as a,MarqueeImageContent as s,MarqueeTextContent as o}from"../biz-components/Marquee/index.js";const r={title:"Biz Components/Marquee",component:t,subcomponents:{MarqueeItem:a,MarqueeImageContent:s,MarqueeTextContent:o},parameters:{layout:"fullscreen",docs:{description:{component:"\u8DD1\u9A6C\u706FMarquee\uFF0C\u57FA\u4E8Ehttps://swiperjs.com/swiper-api"}}},tags:["autodocs"]};var c=r;const e={key:"Marquee",items:[{type:"image",image:{url:"https://cdn.shopify.com/s/files/1/0521/9411/5753/files/Rectangle_6339.png?v=1745400317"}},{type:"text",text:"\u8DD1\u9A6C\u706F\u7EC4\u4EF6"},{type:"image",image:{url:"https://cdn.shopify.com/s/files/1/0521/9411/5753/files/Rectangle_224.png?v=1745400317"}},{type:"text",text:"\u53E6\u4E00\u4E2A\u8DD1\u9A6C\u706F\u7EC4\u4EF6"},{type:"image",image:{url:"https://cdn.shopify.com/s/files/1/0521/9411/5753/files/Rectangle_222.png?v=1745400317"}}]},l={args:{data:e}},p={key:"MarqueeImage",items:[{type:"image",image:{url:"https://cdn.shopify.com/s/files/1/0521/9411/5753/files/Rectangle_6339.png?v=1745400317"}},{type:"image",image:{url:"https://cdn.shopify.com/s/files/1/0521/9411/5753/files/Rectangle_224.png?v=1745400317"}},{type:"image",image:{url:"https://cdn.shopify.com/s/files/1/0521/9411/5753/files/Rectangle_222.png?v=1745400317"}},{type:"image",image:{url:"https://cdn.shopify.com/s/files/1/0521/9411/5753/files/Rectangle_6339.png?v=1745400317"}},{type:"image",image:{url:"https://cdn.shopify.com/s/files/1/0521/9411/5753/files/Rectangle_224.png?v=1745400317"}},{type:"image",image:{url:"https://cdn.shopify.com/s/files/1/0521/9411/5753/files/Rectangle_222.png?v=1745400317"}}]},y={args:{data:p}},n={key:"MarqueeText",items:[{type:"text",text:"47%<br>R&D Employees"},{type:"text",text:"100 Million<br>Global Customers"},{type:"text",text:"Pioneering in Charging<br>Technology for 12 Years"}]},u={args:{data:n}},f={args:{data:{...e,reverseDirection:!0}}};export{l as Default,f as MarqueeDirection,y as MarqueeImage,u as MarqueeText,c as default};
|
|
2
2
|
//# sourceMappingURL=marquee.stories.js.map
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../src/stories/marquee.stories.tsx"],
|
|
4
|
-
"sourcesContent": ["import React, { type ComponentType } from 'react'\nimport type { Meta, StoryObj } from '@storybook/react'\nimport Marquee, { MarqueeItem, MarqueeImageContent, MarqueeTextContent } from '../biz-components/Marquee/index.js'\nimport type { MarqueeProps } from '../biz-components/Marquee/type.js'\n\nconst meta = {\n title: 'Biz Components/Marquee',\n component: Marquee,\n subcomponents: {\n MarqueeItem: MarqueeItem as ComponentType<unknown>,\n MarqueeImageContent: MarqueeImageContent as ComponentType<unknown>,\n MarqueeTextContent: MarqueeTextContent as ComponentType<unknown>,\n },\n parameters: {\n layout: 'fullscreen',\n docs: {\n description: {\n component: '\u8DD1\u9A6C\u706FMarquee\uFF0C\u57FA\u4E8Ehttps://swiperjs.com/swiper-api',\n },\n },\n },\n tags: ['autodocs'],\n} satisfies Meta<typeof Marquee>\n\nexport default meta\n\ntype Story = StoryObj<typeof meta>\n\nconst MarqueeData = {\n key: 'Marquee',\n items: [\n {\n type: 'image',\n image: { url: 'https://cdn.shopify.com/s/files/1/0521/9411/5753/files/Rectangle_6339.png?v=1745400317' },\n },\n { type: 'text', text: '\u8DD1\u9A6C\u706F\u7EC4\u4EF6' },\n {\n type: 'image',\n image: { url: 'https://cdn.shopify.com/s/files/1/0521/9411/5753/files/Rectangle_224.png?v=1745400317' },\n },\n { type: 'text', text: '\u53E6\u4E00\u4E2A\u8DD1\u9A6C\u706F\u7EC4\u4EF6' },\n {\n type: 'image',\n image: { url: 'https://cdn.shopify.com/s/files/1/0521/9411/5753/files/Rectangle_222.png?v=1745400317' },\n },\n ] as MarqueeProps['data']['items'],\n}\n\nexport const Default: Story = {\n args: {\n data: MarqueeData,\n },\n
|
|
5
|
-
"mappings": "
|
|
6
|
-
"names": ["
|
|
4
|
+
"sourcesContent": ["import React, { type ComponentType } from 'react'\nimport type { Meta, StoryObj } from '@storybook/react'\nimport Marquee, { MarqueeItem, MarqueeImageContent, MarqueeTextContent } from '../biz-components/Marquee/index.js'\nimport type { MarqueeProps } from '../biz-components/Marquee/type.js'\n\nconst meta = {\n title: 'Biz Components/Marquee',\n component: Marquee,\n subcomponents: {\n MarqueeItem: MarqueeItem as ComponentType<unknown>,\n MarqueeImageContent: MarqueeImageContent as ComponentType<unknown>,\n MarqueeTextContent: MarqueeTextContent as ComponentType<unknown>,\n },\n parameters: {\n layout: 'fullscreen',\n docs: {\n description: {\n component: '\u8DD1\u9A6C\u706FMarquee\uFF0C\u57FA\u4E8Ehttps://swiperjs.com/swiper-api',\n },\n },\n },\n tags: ['autodocs'],\n} satisfies Meta<typeof Marquee>\n\nexport default meta\n\ntype Story = StoryObj<typeof meta>\n\nconst MarqueeData = {\n key: 'Marquee',\n items: [\n {\n type: 'image',\n image: { url: 'https://cdn.shopify.com/s/files/1/0521/9411/5753/files/Rectangle_6339.png?v=1745400317' },\n },\n { type: 'text', text: '\u8DD1\u9A6C\u706F\u7EC4\u4EF6' },\n {\n type: 'image',\n image: { url: 'https://cdn.shopify.com/s/files/1/0521/9411/5753/files/Rectangle_224.png?v=1745400317' },\n },\n { type: 'text', text: '\u53E6\u4E00\u4E2A\u8DD1\u9A6C\u706F\u7EC4\u4EF6' },\n {\n type: 'image',\n image: { url: 'https://cdn.shopify.com/s/files/1/0521/9411/5753/files/Rectangle_222.png?v=1745400317' },\n },\n ] as MarqueeProps['data']['items'],\n}\n\nexport const Default: Story = {\n args: {\n data: MarqueeData,\n },\n}\n\nconst MarqueeImageData = {\n key: 'MarqueeImage',\n items: [\n {\n type: 'image',\n image: { url: 'https://cdn.shopify.com/s/files/1/0521/9411/5753/files/Rectangle_6339.png?v=1745400317' },\n },\n {\n type: 'image',\n image: { url: 'https://cdn.shopify.com/s/files/1/0521/9411/5753/files/Rectangle_224.png?v=1745400317' },\n },\n {\n type: 'image',\n image: { url: 'https://cdn.shopify.com/s/files/1/0521/9411/5753/files/Rectangle_222.png?v=1745400317' },\n },\n {\n type: 'image',\n image: { url: 'https://cdn.shopify.com/s/files/1/0521/9411/5753/files/Rectangle_6339.png?v=1745400317' },\n },\n {\n type: 'image',\n image: { url: 'https://cdn.shopify.com/s/files/1/0521/9411/5753/files/Rectangle_224.png?v=1745400317' },\n },\n {\n type: 'image',\n image: { url: 'https://cdn.shopify.com/s/files/1/0521/9411/5753/files/Rectangle_222.png?v=1745400317' },\n },\n ] as MarqueeProps['data']['items'],\n}\n\nexport const MarqueeImage: Story = {\n args: {\n data: MarqueeImageData,\n },\n}\n\nconst MarqueeTextData = {\n key: 'MarqueeText',\n items: [\n { type: 'text', text: '47%<br>R&D Employees' },\n { type: 'text', text: '100 Million<br>Global Customers' },\n { type: 'text', text: 'Pioneering in Charging<br>Technology for 12 Years' },\n ] as MarqueeProps['data']['items'],\n}\nexport const MarqueeText: Story = {\n args: {\n data: MarqueeTextData,\n },\n}\n\nexport const MarqueeDirection: Story = {\n args: {\n data: {\n ...MarqueeData,\n reverseDirection: true,\n },\n },\n}\n"],
|
|
5
|
+
"mappings": "AAAA,MAA0C,QAE1C,OAAOA,GAAW,eAAAC,EAAa,uBAAAC,EAAqB,sBAAAC,MAA0B,qCAG9E,MAAMC,EAAO,CACX,MAAO,yBACP,UAAWJ,EACX,cAAe,CACb,YAAaC,EACb,oBAAqBC,EACrB,mBAAoBC,CACtB,EACA,WAAY,CACV,OAAQ,aACR,KAAM,CACJ,YAAa,CACX,UAAW,4EACb,CACF,CACF,EACA,KAAM,CAAC,UAAU,CACnB,EAEA,IAAOE,EAAQD,EAIf,MAAME,EAAc,CAClB,IAAK,UACL,MAAO,CACL,CACE,KAAM,QACN,MAAO,CAAE,IAAK,wFAAyF,CACzG,EACA,CAAE,KAAM,OAAQ,KAAM,gCAAQ,EAC9B,CACE,KAAM,QACN,MAAO,CAAE,IAAK,uFAAwF,CACxG,EACA,CAAE,KAAM,OAAQ,KAAM,kDAAW,EACjC,CACE,KAAM,QACN,MAAO,CAAE,IAAK,uFAAwF,CACxG,CACF,CACF,EAEaC,EAAiB,CAC5B,KAAM,CACJ,KAAMD,CACR,CACF,EAEME,EAAmB,CACvB,IAAK,eACL,MAAO,CACL,CACE,KAAM,QACN,MAAO,CAAE,IAAK,wFAAyF,CACzG,EACA,CACE,KAAM,QACN,MAAO,CAAE,IAAK,uFAAwF,CACxG,EACA,CACE,KAAM,QACN,MAAO,CAAE,IAAK,uFAAwF,CACxG,EACA,CACE,KAAM,QACN,MAAO,CAAE,IAAK,wFAAyF,CACzG,EACA,CACE,KAAM,QACN,MAAO,CAAE,IAAK,uFAAwF,CACxG,EACA,CACE,KAAM,QACN,MAAO,CAAE,IAAK,uFAAwF,CACxG,CACF,CACF,EAEaC,EAAsB,CACjC,KAAM,CACJ,KAAMD,CACR,CACF,EAEME,EAAkB,CACtB,IAAK,cACL,MAAO,CACL,CAAE,KAAM,OAAQ,KAAM,sBAAuB,EAC7C,CAAE,KAAM,OAAQ,KAAM,iCAAkC,EACxD,CAAE,KAAM,OAAQ,KAAM,mDAAoD,CAC5E,CACF,EACaC,EAAqB,CAChC,KAAM,CACJ,KAAMD,CACR,CACF,EAEaE,EAA0B,CACrC,KAAM,CACJ,KAAM,CACJ,GAAGN,EACH,iBAAkB,EACpB,CACF,CACF",
|
|
6
|
+
"names": ["Marquee", "MarqueeItem", "MarqueeImageContent", "MarqueeTextContent", "meta", "marquee_stories_default", "MarqueeData", "Default", "MarqueeImageData", "MarqueeImage", "MarqueeTextData", "MarqueeText", "MarqueeDirection"]
|
|
7
7
|
}
|