@anker-in/headless-ui 0.0.27-alpha.88 → 0.0.27-alpha.89
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 +8 -23
- 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/index.d.ts +1 -2
- package/dist/cjs/biz-components/Marquee/index.js +1 -1
- package/dist/cjs/biz-components/Marquee/index.js.map +1 -1
- package/dist/cjs/biz-components/Marquee/type.d.ts +30 -0
- package/dist/cjs/biz-components/Marquee/type.js +2 -0
- package/dist/cjs/biz-components/Marquee/type.js.map +7 -0
- package/dist/cjs/biz-components/MultiLayoutGraphicBlock/MultiLayoutGraphicBlock.js +1 -1
- package/dist/cjs/biz-components/MultiLayoutGraphicBlock/MultiLayoutGraphicBlock.js.map +2 -2
- package/dist/cjs/biz-components/index.d.ts +1 -1
- package/dist/cjs/biz-components/index.js +1 -1
- package/dist/cjs/biz-components/index.js.map +2 -2
- package/dist/cjs/stories/marquee.stories.d.ts +3 -25
- 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 +8 -23
- package/dist/esm/biz-components/Marquee/Marquee.js +1 -1
- package/dist/esm/biz-components/Marquee/Marquee.js.map +3 -3
- package/dist/esm/biz-components/Marquee/index.d.ts +1 -2
- package/dist/esm/biz-components/Marquee/index.js +1 -1
- package/dist/esm/biz-components/Marquee/index.js.map +2 -2
- package/dist/esm/biz-components/Marquee/type.d.ts +30 -0
- package/dist/esm/biz-components/Marquee/type.js +1 -0
- package/dist/esm/biz-components/Marquee/type.js.map +7 -0
- package/dist/esm/biz-components/MultiLayoutGraphicBlock/MultiLayoutGraphicBlock.js +1 -1
- package/dist/esm/biz-components/MultiLayoutGraphicBlock/MultiLayoutGraphicBlock.js.map +2 -2
- package/dist/esm/biz-components/index.d.ts +1 -1
- package/dist/esm/biz-components/index.js +1 -1
- package/dist/esm/biz-components/index.js.map +3 -3
- package/dist/esm/stories/marquee.stories.d.ts +3 -25
- 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,35 +1,20 @@
|
|
|
1
1
|
import React from 'react';
|
|
2
|
-
import {
|
|
3
|
-
|
|
4
|
-
|
|
5
|
-
|
|
6
|
-
|
|
7
|
-
}
|
|
8
|
-
declare const MarqueeList: React.ForwardRefExoticComponent<MarqueeListProps & React.RefAttributes<HTMLDivElement>>;
|
|
9
|
-
interface MarqueeImageContentProps {
|
|
10
|
-
data: {
|
|
11
|
-
image: Img;
|
|
12
|
-
};
|
|
13
|
-
className?: string;
|
|
14
|
-
}
|
|
2
|
+
import type { MarqueeProps, MarqueeItemProps, MarqueeImageContentProps, MarqueeTextContentProps } from './type.js';
|
|
3
|
+
declare const MarqueeItem: {
|
|
4
|
+
({ data, configuration }: MarqueeItemProps): import("react/jsx-runtime").JSX.Element;
|
|
5
|
+
displayName: string;
|
|
6
|
+
};
|
|
15
7
|
declare const MarqueeImageContent: {
|
|
16
|
-
({
|
|
8
|
+
({ image, imageClassName }: MarqueeImageContentProps): import("react/jsx-runtime").JSX.Element;
|
|
17
9
|
displayName: string;
|
|
18
10
|
};
|
|
19
|
-
interface MarqueeTextContentProps {
|
|
20
|
-
data: {
|
|
21
|
-
text: string;
|
|
22
|
-
};
|
|
23
|
-
className?: string;
|
|
24
|
-
}
|
|
25
11
|
declare const MarqueeTextContent: React.ForwardRefExoticComponent<MarqueeTextContentProps & React.RefAttributes<HTMLDivElement>>;
|
|
26
12
|
declare const _default: {
|
|
27
|
-
(props: Omit<
|
|
13
|
+
(props: Omit<MarqueeProps & React.RefAttributes<HTMLDivElement>, keyof import("../../shared/Styles.js").StylesProps> & Partial<import("../../shared/Styles.js").StylesProps> & {
|
|
28
14
|
className?: string;
|
|
29
15
|
data?: Record<string, any>;
|
|
30
16
|
}): import("react/jsx-runtime").JSX.Element;
|
|
31
17
|
displayName: string;
|
|
32
18
|
};
|
|
33
19
|
export default _default;
|
|
34
|
-
export {
|
|
35
|
-
export type { FastMarqueeProps, MarqueeListProps, MarqueeImageContentProps, MarqueeTextContentProps };
|
|
20
|
+
export { MarqueeItem, MarqueeImageContent, MarqueeTextContent };
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
"use strict";"use client";var
|
|
1
|
+
"use strict";"use client";var q=Object.create;var s=Object.defineProperty;var y=Object.getOwnPropertyDescriptor;var C=Object.getOwnPropertyNames;var N=Object.getPrototypeOf,S=Object.prototype.hasOwnProperty;var P=(e,t)=>{for(var a in t)s(e,a,{get:t[a],enumerable:!0})},w=(e,t,a,p)=>{if(t&&typeof t=="object"||typeof t=="function")for(let o of C(t))!S.call(e,o)&&o!==a&&s(e,o,{get:()=>t[o],enumerable:!(p=y(t,o))||p.enumerable});return e};var g=(e,t,a)=>(a=e!=null?q(N(e)):{},w(t||!e||!e.__esModule?s(a,"default",{value:e,enumerable:!0}):a,e)),I=e=>w(s({},"__esModule",{value:!0}),e);var h={};P(h,{MarqueeImageContent:()=>l,MarqueeItem:()=>m,MarqueeTextContent:()=>n,default:()=>T});module.exports=I(h);var r=require("react/jsx-runtime"),c=g(require("react")),u=require("../../components/index.js"),i=require("../../helpers/utils.js"),M=require("../../shared/Styles.js"),D=require("../SwiperBox/index.js"),x=require("swiper/react"),d=require("swiper/modules");const f=c.default.forwardRef(({data:e,className:t},a)=>(0,r.jsx)(x.Swiper,{className:(0,i.cn)("laptop:h-[80px] h-[48px] w-full [&_.swiper-slide]:!w-auto [&_.swiper-wrapper]:!ease-linear",t),id:"Marquee"+e?.key,modules:[d.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,o)=>(0,r.jsx)(x.SwiperSlide,{children:(0,r.jsx)(m,{data:p})},p?.id+"SwiperSlide"+o))}));f.displayName="Marquee";const m=({data:e,configuration:t})=>(0,r.jsxs)(r.Fragment,{children:[e.type==="image"&&(0,r.jsx)(l,{image:e?.image,imageClassName:t?.imageClassName}),e.type==="text"&&(0,r.jsx)(n,{text:e?.text,textClassName:t?.textClassName})]});m.displayName="MarqueeItem";const l=({image:e,imageClassName:t})=>(0,r.jsx)(u.Picture,{source:e?.url,alt:e?.alt||"",className:(0,i.cn)("laptop:h-[80px] laptop:w-[120px] h-[48px] w-[72px]",t),imgClassName:"object-cover"});l.displayName="MarqueeImageContent";const n=c.default.forwardRef(({text:e,textClassName:t},a)=>(0,r.jsx)(u.Text,{as:"div",ref:a,html:e,className:(0,i.cn)("text-lines-2 flex size-14 items-center justify-center text-nowrap font-medium leading-[1.2]",t)}));n.displayName="MarqueeTextContent";var T=(0,M.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
|
|
5
|
-
"mappings": "ukBAAA,IAAAA,EAAA,GAAAC,EAAAD,EAAA,yBAAAE,EAAA,gBAAAC,EAAA,uBAAAC,EAAA,YAAAC,IAAA,eAAAC,EAAAN,
|
|
6
|
-
"names": ["Marquee_exports", "__export", "MarqueeImageContent", "
|
|
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 SwiperBox from '../SwiperBox/index.js'\nimport type { MarqueeProps, MarqueeItemProps, MarqueeImageContentProps, MarqueeTextContentProps } from './type.js'\n\nimport { Swiper, SwiperSlide } from 'swiper/react'\nimport { Autoplay } from 'swiper/modules'\n\nconst Marquee = React.forwardRef<HTMLDivElement, MarqueeProps>(({ data, className }, ref) => {\n return (\n <Swiper\n className={cn(\n 'laptop:h-[80px] h-[48px] w-full [&_.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 <Picture\n source={image?.url}\n alt={image?.alt || ''}\n className={cn('laptop:h-[80px] laptop:w-[120px] h-[48px] w-[72px]', imageClassName)}\n imgClassName=\"object-cover\"\n />\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(\n 'text-lines-2 flex size-14 items-center justify-center text-nowrap font-medium leading-[1.2]',\n textClassName\n )}\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,GAyCU,IAAAO,EAAA,6BAxCVC,EAAkB,oBAClBC,EAA8B,qCAC9BC,EAAmB,kCACnBC,EAA2B,kCAC3BC,EAAsB,iCAGtBJ,EAAoC,wBACpCK,EAAyB,0BAEzB,MAAMC,EAAU,EAAAC,QAAM,WAAyC,CAAC,CAAE,KAAAC,EAAM,UAAAC,CAAU,EAAGC,OAEjF,OAAC,UACC,aAAW,MACT,6FACAD,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,cAAe,OACf,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,mBAACjB,EAAA,CAAY,KAAMgB,EAAM,GADTA,GAAM,GAAK,cAAgBC,CAE7C,CACD,EACH,CAEH,EACDN,EAAQ,YAAc,UAEtB,MAAMX,EAAc,CAAC,CAAE,KAAAa,EAAM,cAAAK,CAAc,OAEvC,oBACG,UAAAL,EAAK,OAAS,YACb,OAACd,EAAA,CAAoB,MAAOc,GAAM,MAAO,eAAgBK,GAAe,eAAgB,EAEzFL,EAAK,OAAS,WAAU,OAACZ,EAAA,CAAmB,KAAMY,GAAM,KAAM,cAAeK,GAAe,cAAe,GAC9G,EAIJlB,EAAY,YAAc,cAE1B,MAAMD,EAAsB,CAAC,CAAE,MAAAoB,EAAO,eAAAC,CAAe,OAEjD,OAAC,WACC,OAAQD,GAAO,IACf,IAAKA,GAAO,KAAO,GACnB,aAAW,MAAG,qDAAsDC,CAAc,EAClF,aAAa,eACf,EAIJrB,EAAoB,YAAc,sBAElC,MAAME,EAAqB,EAAAW,QAAM,WAAoD,CAAC,CAAE,KAAAS,EAAM,cAAAC,CAAc,EAAGP,OAE3G,OAAC,QACC,GAAG,MACH,IAAKA,EACL,KAAMM,EACN,aAAW,MACT,8FACAC,CACF,EACF,CAEH,EAEDrB,EAAmB,YAAc,qBAEjC,IAAOC,KAAQ,cAAWS,CAAO",
|
|
6
|
+
"names": ["Marquee_exports", "__export", "MarqueeImageContent", "MarqueeItem", "MarqueeTextContent", "Marquee_default", "__toCommonJS", "import_jsx_runtime", "import_react", "import_components", "import_utils", "import_Styles", "import_SwiperBox", "import_modules", "Marquee", "React", "data", "className", "ref", "item", "index", "configuration", "image", "imageClassName", "text", "textClassName"]
|
|
7
7
|
}
|
|
@@ -1,3 +1,2 @@
|
|
|
1
1
|
export { default } from './Marquee.js';
|
|
2
|
-
export {
|
|
3
|
-
export type { FastMarqueeProps, MarqueeListProps, MarqueeImageContentProps, MarqueeTextContentProps, } from './Marquee.js';
|
|
2
|
+
export { MarqueeItem, MarqueeImageContent, MarqueeTextContent } from './Marquee.js';
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
"use strict";var
|
|
1
|
+
"use strict";var q=Object.create;var m=Object.defineProperty;var x=Object.getOwnPropertyDescriptor;var M=Object.getOwnPropertyNames;var p=Object.getPrototypeOf,C=Object.prototype.hasOwnProperty;var I=(e,t)=>{for(var r in t)m(e,r,{get:t[r],enumerable:!0})},u=(e,t,r,n)=>{if(t&&typeof t=="object"||typeof t=="function")for(let a of M(t))!C.call(e,a)&&a!==r&&m(e,a,{get:()=>t[a],enumerable:!(n=x(t,a))||n.enumerable});return e};var d=(e,t,r)=>(r=e!=null?q(p(e)):{},u(t||!e||!e.__esModule?m(r,"default",{value:e,enumerable:!0}):r,e)),g=e=>u(m({},"__esModule",{value:!0}),e);var l={};I(l,{MarqueeImageContent:()=>o.MarqueeImageContent,MarqueeItem:()=>o.MarqueeItem,MarqueeTextContent:()=>o.MarqueeTextContent,default:()=>f.default});module.exports=g(l);var f=d(require("./Marquee.js")),o=require("./Marquee.js");
|
|
2
2
|
//# sourceMappingURL=index.js.map
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../../src/biz-components/Marquee/index.ts"],
|
|
4
|
-
"sourcesContent": ["export { default } from './Marquee.js'\nexport {
|
|
4
|
+
"sourcesContent": ["export { default } from './Marquee.js'\nexport { MarqueeItem, MarqueeImageContent, MarqueeTextContent } from './Marquee.js'\n"],
|
|
5
5
|
"mappings": "0jBAAA,IAAAA,EAAA,GAAAC,EAAAD,EAAA,gKAAAE,EAAAF,GAAA,IAAAG,EAAwB,2BACxBA,EAAqE",
|
|
6
6
|
"names": ["Marquee_exports", "__export", "__toCommonJS", "import_Marquee"]
|
|
7
7
|
}
|
|
@@ -0,0 +1,30 @@
|
|
|
1
|
+
import type { Img } from '../../types/props.js';
|
|
2
|
+
interface MarqueeProps {
|
|
3
|
+
data: {
|
|
4
|
+
key?: string;
|
|
5
|
+
/** 是否反向 */
|
|
6
|
+
reverseDirection?: boolean;
|
|
7
|
+
/** 速度 */
|
|
8
|
+
speed?: number;
|
|
9
|
+
/** 跑马灯内容 */
|
|
10
|
+
items: any[];
|
|
11
|
+
};
|
|
12
|
+
className?: string;
|
|
13
|
+
}
|
|
14
|
+
interface MarqueeItemProps {
|
|
15
|
+
data: {
|
|
16
|
+
type: 'image' | 'text';
|
|
17
|
+
image?: Img;
|
|
18
|
+
text?: string;
|
|
19
|
+
};
|
|
20
|
+
configuration?: any;
|
|
21
|
+
}
|
|
22
|
+
interface MarqueeImageContentProps {
|
|
23
|
+
image?: Img;
|
|
24
|
+
imageClassName?: string;
|
|
25
|
+
}
|
|
26
|
+
interface MarqueeTextContentProps {
|
|
27
|
+
text?: string;
|
|
28
|
+
textClassName?: string;
|
|
29
|
+
}
|
|
30
|
+
export type { MarqueeProps, MarqueeItemProps, MarqueeImageContentProps, MarqueeTextContentProps };
|
|
@@ -0,0 +1,2 @@
|
|
|
1
|
+
"use strict";var s=Object.defineProperty;var o=Object.getOwnPropertyDescriptor;var i=Object.getOwnPropertyNames;var m=Object.prototype.hasOwnProperty;var p=(t,e,n,a)=>{if(e&&typeof e=="object"||typeof e=="function")for(let r of i(e))!m.call(t,r)&&r!==n&&s(t,r,{get:()=>e[r],enumerable:!(a=o(e,r))||a.enumerable});return t};var g=t=>p(s({},"__esModule",{value:!0}),t);var u={};module.exports=g(u);
|
|
2
|
+
//# sourceMappingURL=type.js.map
|
|
@@ -0,0 +1,7 @@
|
|
|
1
|
+
{
|
|
2
|
+
"version": 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?: any\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
|
+
"mappings": "+WAAA,IAAAA,EAAA,kBAAAC,EAAAD",
|
|
6
|
+
"names": ["type_exports", "__toCommonJS"]
|
|
7
|
+
}
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
"use strict";var L=Object.create;var y=Object.defineProperty;var S=Object.getOwnPropertyDescriptor;var P=Object.getOwnPropertyNames;var R=Object.getPrototypeOf,q=Object.prototype.hasOwnProperty;var z=(s,o)=>{for(var a in o)y(s,a,{get:o[a],enumerable:!0})},C=(s,o,a,m)=>{if(o&&typeof o=="object"||typeof o=="function")for(let i of P(o))!q.call(s,i)&&i!==a&&y(s,i,{get:()=>o[i],enumerable:!(m=S(o,i))||m.enumerable});return s};var N=(s,o,a)=>(a=s!=null?L(R(s)):{},C(o||!s||!s.__esModule?y(a,"default",{value:s,enumerable:!0}):a,s)),H=s=>C(y({},"__esModule",{value:!0}),s);var O={};z(O,{default:()=>E});module.exports=H(O);var e=require("react/jsx-runtime"),v=N(require("react")),T=require("react-responsive"),w=require("../../shared/Styles.js"),B=N(require("../../components/picture.js")),g=N(require("../../components/button.js")),I=require("../../components/heading.js"),G=require("../../components/text.js"),r=require("../../components/carousel.js"),d=require("../../components/gird.js"),$=N(require("../Title/index.js")),M=require("../../helpers/utils.js"),u=require("../../components/tabs.js");const x=({item:s,shape:o="square",isTab:a=!1})=>{const m=(0,T.useMediaQuery)({query:"(max-width: 1024px)"}),{theme:i="light",title:h,description:n,imageUrl:f,primaryButton:c,secondaryButton:b}=s,t="lg-desktop:px-7 lg-desktop:pb-[14px] lg-desktop:pt-[15px] lg-desktop:text-[16px]";return(0,e.jsxs)("div",{className:(0,M.cn)("item-wrapper group relative w-full overflow-hidden",{"rounded-
|
|
1
|
+
"use strict";var L=Object.create;var y=Object.defineProperty;var S=Object.getOwnPropertyDescriptor;var P=Object.getOwnPropertyNames;var R=Object.getPrototypeOf,q=Object.prototype.hasOwnProperty;var z=(s,o)=>{for(var a in o)y(s,a,{get:o[a],enumerable:!0})},C=(s,o,a,m)=>{if(o&&typeof o=="object"||typeof o=="function")for(let i of P(o))!q.call(s,i)&&i!==a&&y(s,i,{get:()=>o[i],enumerable:!(m=S(o,i))||m.enumerable});return s};var N=(s,o,a)=>(a=s!=null?L(R(s)):{},C(o||!s||!s.__esModule?y(a,"default",{value:s,enumerable:!0}):a,s)),H=s=>C(y({},"__esModule",{value:!0}),s);var O={};z(O,{default:()=>E});module.exports=H(O);var e=require("react/jsx-runtime"),v=N(require("react")),T=require("react-responsive"),w=require("../../shared/Styles.js"),B=N(require("../../components/picture.js")),g=N(require("../../components/button.js")),I=require("../../components/heading.js"),G=require("../../components/text.js"),r=require("../../components/carousel.js"),d=require("../../components/gird.js"),$=N(require("../Title/index.js")),M=require("../../helpers/utils.js"),u=require("../../components/tabs.js");const x=({item:s,shape:o="square",isTab:a=!1})=>{const m=(0,T.useMediaQuery)({query:"(max-width: 1024px)"}),{theme:i="light",title:h,description:n,imageUrl:f,primaryButton:c,secondaryButton:b}=s,t="lg-desktop:px-7 lg-desktop:pb-[14px] lg-desktop:pt-[15px] lg-desktop:text-[16px]";return(0,e.jsxs)("div",{className:(0,M.cn)("item-wrapper group relative box-border w-full overflow-hidden",{"rounded-2xl":o==="rounded","aiui-dark":i==="dark","h-[480px]":m&&!a,"h-[400px]":m&&a},"text-info-primary"),children:[(0,e.jsx)(B.default,{source:f?.url,className:"inset-0 h-full overflow-hidden",imgClassName:"h-full transition-all duration-300 group-hover:scale-105 object-cover",style:{aspectRatio:`${f?.width}/${f?.height}`}}),(0,e.jsxs)("div",{className:"laptop:p-6 desktop:p-[32px] absolute inset-x-0 bottom-0 flex flex-col gap-6 p-3",children:[(0,e.jsxs)("div",{children:[(0,e.jsx)(I.Heading,{size:3,className:"item-title",html:h}),(0,e.jsx)(G.Text,{className:"item-description desktop:mt-1 text-text-2 lg-desktop:text-text-3",html:n})]}),(0,e.jsxs)("div",{className:"flex gap-[16px]",children:[b&&(0,e.jsx)(g.default,{className:t,variant:"secondary",asChild:!0,children:(0,e.jsx)("a",{href:b.link,children:b.text})}),c&&(0,e.jsx)(g.default,{className:t,variant:"primary",asChild:!0,children:(0,e.jsx)("a",{href:c.link,children:c.text})})]})]})]})},D=v.default.forwardRef((s,o)=>{const{shape:a,sectionTitle:m,groupByTab:i=!1,items:h=[],carousel:n}=s.data,f=t=>{switch(t){case"full":return 12;case"half":return 6;case"one-third":return 4}},c=h.map(t=>t.tabName).filter(Boolean).filter((t,l,p)=>p.indexOf(t)===l),b=c.map(t=>({tabName:t,items:h.filter(l=>l.tabName===t)})).reduce((t,l)=>(t[l.tabName]=l.items,t),{});return(0,e.jsxs)("section",{"data-ui-component-id":"MultiLayoutGraphicBlock",ref:o,className:"text-info-primary",children:[m&&(0,e.jsx)($.default,{data:{title:m},className:"section-title"}),i?(0,e.jsxs)(u.Tabs,{shape:a,align:"left",defaultValue:c[0],children:[(0,e.jsx)(u.TabsList,{children:c.map((t,l)=>(0,e.jsx)(u.TabsTrigger,{value:t,children:t},l))}),c.map((t,l)=>(0,e.jsx)(u.TabsContent,{value:t,className:"desktop:mt-[36px] mt-[24px] w-full",children:(0,e.jsxs)(e.Fragment,{children:[(0,e.jsxs)(d.Grid,{className:"w-full",children:[b[t].map((p,k)=>(0,e.jsx)(d.GridItem,{span:f(p.width??"full"),className:"laptop:block hidden",children:(0,e.jsx)(x,{item:p,shape:a,isTab:i})},`${p?.title||""}${k}`)),(0,e.jsx)(d.GridItem,{className:"laptop:hidden block",span:12,children:(0,e.jsx)(r.Carousel,{className:"",children:(0,e.jsx)(r.CarouselContent,{className:"flex",children:b[t].map((p,k)=>(0,e.jsx)(r.CarouselItem,{className:"tablet:basis-2/5 laptop:basis-[32%] flex basis-4/5",children:(0,e.jsx)(x,{item:p,shape:a,isTab:i})},`${p?.title||""}${k}`))})})})]}),n&&n?.items.length>0?(0,e.jsx)(r.Carousel,{className:"laptop:mt-4 mt-3",children:(0,e.jsx)(r.CarouselContent,{className:"flex",children:n.items.map((p,k)=>(0,e.jsx)(r.CarouselItem,{className:"tablet:basis-2/5 laptop:basis-[32%] flex basis-4/5",children:(0,e.jsx)(x,{item:p,shape:a,isTab:i})},k))})}):null]})},l))]}):(0,e.jsxs)(e.Fragment,{children:[(0,e.jsxs)(d.Grid,{className:"w-full",children:[h.map((t,l)=>(0,e.jsx)(d.GridItem,{span:f(t.width??"full"),className:"laptop:block hidden",children:(0,e.jsx)(x,{item:t,shape:a})},`${t?.title||""}${l}`)),h.map((t,l)=>(0,e.jsx)(d.GridItem,{span:f("full"),className:"laptop:hidden block",children:(0,e.jsx)(x,{item:t,shape:a})},`${t?.title||""}${l}`))]}),n&&n?.items.length>0?(0,e.jsx)(r.Carousel,{className:"laptop:mt-4 mt-3",children:(0,e.jsx)(r.CarouselContent,{className:"flex",children:n.items.map((t,l)=>(0,e.jsx)(r.CarouselItem,{className:"tablet:basis-2/5 laptop:basis-[32%] flex basis-4/5",children:(0,e.jsx)(x,{item:t,shape:a})},`${t?.title||""}${l}`))})}):null]})]})});var E=(0,w.withStyles)(D);
|
|
2
2
|
//# sourceMappingURL=MultiLayoutGraphicBlock.js.map
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../../src/biz-components/MultiLayoutGraphicBlock/MultiLayoutGraphicBlock.tsx"],
|
|
4
|
-
"sourcesContent": ["import React from 'react'\nimport { useMediaQuery } from 'react-responsive'\nimport type { MultiLayoutGraphicBlockProps, Item } from './types'\nimport { withStyles } from '../../shared/Styles.js'\nimport Picture from '../../components/picture.js'\nimport Button from '../../components/button.js'\nimport { Heading } from '../../components/heading.js'\nimport { Text } from '../../components/text.js'\nimport { Carousel, CarouselContent, CarouselItem } from '../../components/carousel.js'\nimport { Grid, GridItem } from '../../components/gird.js'\nimport Title from '../Title/index.js'\nimport type { Shape } from '../../types/props'\nimport { cn } from '../../helpers/utils.js'\nimport { Tabs, TabsList, TabsTrigger, TabsContent } from '../../components/tabs.js'\nconst ItemBlock = ({\n item,\n shape = 'square',\n isTab = false,\n}: { item: Item } & { shape?: Shape } & { isTab?: boolean }) => {\n const isMobile = useMediaQuery({ query: '(max-width: 1024px)' })\n\n const { theme = 'light', title, description, imageUrl, primaryButton, secondaryButton } = item\n const lgButtonSize = 'lg-desktop:px-7 lg-desktop:pb-[14px] lg-desktop:pt-[15px] lg-desktop:text-[16px]'\n\n return (\n <div\n className={cn(\n
|
|
5
|
-
"mappings": "0jBAAA,IAAAA,EAAA,GAAAC,EAAAD,EAAA,aAAAE,IAAA,eAAAC,EAAAH,GAqCM,IAAAI,EAAA,6BArCNC,EAAkB,oBAClBC,EAA8B,4BAE9BC,EAA2B,kCAC3BC,EAAoB,0CACpBC,EAAmB,yCACnBC,EAAwB,uCACxBC,EAAqB,oCACrBC,EAAwD,wCACxDC,EAA+B,oCAC/BC,EAAkB,gCAElBC,EAAmB,kCACnBC,EAAyD,oCACzD,MAAMC,EAAY,CAAC,CACjB,KAAAC,EACA,MAAAC,EAAQ,SACR,MAAAC,EAAQ,EACV,IAAgE,CAC9D,MAAMC,KAAW,iBAAc,CAAE,MAAO,qBAAsB,CAAC,EAEzD,CAAE,MAAAC,EAAQ,QAAS,MAAAC,EAAO,YAAAC,EAAa,SAAAC,EAAU,cAAAC,EAAe,gBAAAC,CAAgB,EAAIT,EACpFU,EAAe,mFAErB,SACE,QAAC,OACC,aAAW,MACT,
|
|
4
|
+
"sourcesContent": ["import React from 'react'\nimport { useMediaQuery } from 'react-responsive'\nimport type { MultiLayoutGraphicBlockProps, Item } from './types'\nimport { withStyles } from '../../shared/Styles.js'\nimport Picture from '../../components/picture.js'\nimport Button from '../../components/button.js'\nimport { Heading } from '../../components/heading.js'\nimport { Text } from '../../components/text.js'\nimport { Carousel, CarouselContent, CarouselItem } from '../../components/carousel.js'\nimport { Grid, GridItem } from '../../components/gird.js'\nimport Title from '../Title/index.js'\nimport type { Shape } from '../../types/props'\nimport { cn } from '../../helpers/utils.js'\nimport { Tabs, TabsList, TabsTrigger, TabsContent } from '../../components/tabs.js'\nconst ItemBlock = ({\n item,\n shape = 'square',\n isTab = false,\n}: { item: Item } & { shape?: Shape } & { isTab?: boolean }) => {\n const isMobile = useMediaQuery({ query: '(max-width: 1024px)' })\n\n const { theme = 'light', title, description, imageUrl, primaryButton, secondaryButton } = item\n const lgButtonSize = 'lg-desktop:px-7 lg-desktop:pb-[14px] lg-desktop:pt-[15px] lg-desktop:text-[16px]'\n\n return (\n <div\n className={cn(\n 'item-wrapper group relative box-border w-full overflow-hidden',\n {\n 'rounded-2xl': shape === 'rounded',\n 'aiui-dark': theme === 'dark',\n 'h-[480px]': isMobile && !isTab,\n 'h-[400px]': isMobile && isTab,\n },\n `text-info-primary`\n )}\n >\n <Picture\n source={imageUrl?.url}\n className=\"inset-0 h-full overflow-hidden\"\n imgClassName=\"h-full transition-all duration-300 group-hover:scale-105 object-cover\"\n style={{ aspectRatio: `${imageUrl?.width}/${imageUrl?.height}` }}\n />\n <div className=\"laptop:p-6 desktop:p-[32px] absolute inset-x-0 bottom-0 flex flex-col gap-6 p-3\">\n <div>\n <Heading size={3} className=\"item-title\" html={title} />\n <Text className=\"item-description desktop:mt-1 text-text-2 lg-desktop:text-text-3\" html={description} />\n </div>\n <div className=\"flex gap-[16px]\">\n {secondaryButton && (\n <Button className={lgButtonSize} variant=\"secondary\" asChild>\n <a href={secondaryButton.link}>{secondaryButton.text}</a>\n </Button>\n )}\n {primaryButton && (\n <Button className={lgButtonSize} variant=\"primary\" asChild>\n <a href={primaryButton.link}>{primaryButton.text}</a>\n </Button>\n )}\n </div>\n </div>\n </div>\n )\n}\n\nconst MultiLayoutGraphicBlock = React.forwardRef<HTMLDivElement, MultiLayoutGraphicBlockProps>((props, ref) => {\n const { shape, sectionTitle, groupByTab = false, items = [], carousel } = props.data\n const getSpan = (width: 'full' | 'half' | 'one-third') => {\n switch (width) {\n case 'full':\n return 12\n case 'half':\n return 6\n case 'one-third':\n return 4\n }\n }\n\n const tabNames = items\n .map(item => item.tabName)\n .filter(Boolean)\n .filter((item, index, arr) => arr.indexOf(item) === index) as string[]\n\n const tabItemsMaps = tabNames\n .map(tabName => ({\n tabName,\n items: items.filter(item => item.tabName === tabName),\n }))\n .reduce(\n (acc, cur) => {\n acc[cur.tabName] = cur.items\n return acc\n },\n {} as Record<string, (Item & { width?: 'full' | 'half' | 'one-third' })[]>\n )\n\n return (\n <section data-ui-component-id=\"MultiLayoutGraphicBlock\" ref={ref} className=\"text-info-primary\">\n {sectionTitle && <Title data={{ title: sectionTitle }} className=\"section-title\" />}\n\n {groupByTab ? (\n <Tabs shape={shape} align=\"left\" defaultValue={tabNames[0]!}>\n <TabsList>\n {tabNames.map((tabName, index) => (\n <TabsTrigger key={index} value={tabName!}>\n {tabName}\n </TabsTrigger>\n ))}\n </TabsList>\n {tabNames.map((tabName, index) => (\n <TabsContent key={index} value={tabName!} className=\"desktop:mt-[36px] mt-[24px] w-full\">\n <>\n <Grid className=\"w-full\">\n {tabItemsMaps[tabName].map((item, index) => (\n <GridItem\n key={`${item?.title || ''}${index}`}\n span={getSpan(item.width ?? 'full')}\n className=\"laptop:block hidden\"\n >\n <ItemBlock item={item} shape={shape} isTab={groupByTab} />\n </GridItem>\n ))}\n {\n <GridItem className=\"laptop:hidden block\" span={12}>\n <Carousel className=\"\">\n <CarouselContent className=\"flex\">\n {tabItemsMaps[tabName].map((item, index) => (\n <CarouselItem\n key={`${item?.title || ''}${index}`}\n className=\"tablet:basis-2/5 laptop:basis-[32%] flex basis-4/5\"\n >\n <ItemBlock item={item} shape={shape} isTab={groupByTab} />\n </CarouselItem>\n ))}\n </CarouselContent>\n </Carousel>\n </GridItem>\n }\n </Grid>\n {carousel && carousel?.items.length > 0 ? (\n <Carousel className=\"laptop:mt-4 mt-3\">\n <CarouselContent className=\"flex\">\n {carousel.items.map((item, index) => (\n <CarouselItem key={index} className=\"tablet:basis-2/5 laptop:basis-[32%] flex basis-4/5\">\n <ItemBlock item={item} shape={shape} isTab={groupByTab} />\n </CarouselItem>\n ))}\n </CarouselContent>\n </Carousel>\n ) : null}\n </>\n </TabsContent>\n ))}\n </Tabs>\n ) : (\n <>\n <Grid className=\"w-full\">\n {items.map((item, index) => (\n <GridItem\n key={`${item?.title || ''}${index}`}\n span={getSpan(item.width ?? 'full')}\n className=\"laptop:block hidden\"\n >\n <ItemBlock item={item} shape={shape} />\n </GridItem>\n ))}\n {items.map((item, index) => (\n <GridItem key={`${item?.title || ''}${index}`} span={getSpan('full')} className=\"laptop:hidden block\">\n <ItemBlock item={item} shape={shape} />\n </GridItem>\n ))}\n </Grid>\n {carousel && carousel?.items.length > 0 ? (\n <Carousel className=\"laptop:mt-4 mt-3\">\n <CarouselContent className=\"flex\">\n {carousel.items.map((item, index) => (\n <CarouselItem\n key={`${item?.title || ''}${index}`}\n className=\"tablet:basis-2/5 laptop:basis-[32%] flex basis-4/5\"\n >\n <ItemBlock item={item} shape={shape} />\n </CarouselItem>\n ))}\n </CarouselContent>\n </Carousel>\n ) : null}\n </>\n )}\n </section>\n )\n})\n\nexport default withStyles(MultiLayoutGraphicBlock)\nexport type { MultiLayoutGraphicBlockProps }\n"],
|
|
5
|
+
"mappings": "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",
|
|
6
6
|
"names": ["MultiLayoutGraphicBlock_exports", "__export", "MultiLayoutGraphicBlock_default", "__toCommonJS", "import_jsx_runtime", "import_react", "import_react_responsive", "import_Styles", "import_picture", "import_button", "import_heading", "import_text", "import_carousel", "import_gird", "import_Title", "import_utils", "import_tabs", "ItemBlock", "item", "shape", "isTab", "isMobile", "theme", "title", "description", "imageUrl", "primaryButton", "secondaryButton", "lgButtonSize", "Picture", "Button", "MultiLayoutGraphicBlock", "React", "props", "ref", "sectionTitle", "groupByTab", "items", "carousel", "getSpan", "width", "tabNames", "index", "arr", "tabItemsMaps", "tabName", "acc", "cur", "Title"]
|
|
7
7
|
}
|
|
@@ -14,7 +14,7 @@ export { default as MediaPlayerBase } from './MediaPlayerBase/index.js';
|
|
|
14
14
|
export { default as MediaPlayerSticky } from './MediaPlayerSticky/index.js';
|
|
15
15
|
export { default as MediaPlayerMulti } from './MediaPlayerMulti/index.js';
|
|
16
16
|
export { default as Marquee } from './Marquee/index.js';
|
|
17
|
-
export {
|
|
17
|
+
export { MarqueeItem, MarqueeImageContent, MarqueeTextContent } from './Marquee/index.js';
|
|
18
18
|
export { default as MultiLayoutGraphicBlock } from './MultiLayoutGraphicBlock/index.js';
|
|
19
19
|
export type { MultiLayoutGraphicBlockProps } from './MultiLayoutGraphicBlock/index.js';
|
|
20
20
|
export { default as GraphicAttractionBlock } from './GraphicAttractionBlock/index.js';
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
"use strict";var g=Object.create;var
|
|
1
|
+
"use strict";var g=Object.create;var l=Object.defineProperty;var E=Object.getOwnPropertyDescriptor;var L=Object.getOwnPropertyNames;var j=Object.getPrototypeOf,I=Object.prototype.hasOwnProperty;var T=(a,r)=>{for(var t in r)l(a,t,{get:r[t],enumerable:!0})},u=(a,r,t,p)=>{if(r&&typeof r=="object"||typeof r=="function")for(let f of L(r))!I.call(a,f)&&f!==t&&l(a,f,{get:()=>r[f],enumerable:!(p=E(r,f))||p.enumerable});return a};var e=(a,r,t)=>(t=a!=null?g(j(a)):{},u(r||!a||!a.__esModule?l(t,"default",{value:a,enumerable:!0}):t,a)),b=a=>u(l({},"__esModule",{value:!0}),a);var v={};T(v,{AccordionCards:()=>B.default,BrandEquity:()=>i.default,Category:()=>M.default,Evaluate:()=>y.default,Graphic:()=>k.default,GraphicAttractionBlock:()=>C.default,HeroBanner:()=>h.default,Marquee:()=>S.default,MarqueeImageContent:()=>o.MarqueeImageContent,MarqueeItem:()=>o.MarqueeItem,MarqueeTextContent:()=>o.MarqueeTextContent,MediaPlayerBase:()=>G.default,MediaPlayerMulti:()=>P.default,MediaPlayerSticky:()=>q.default,MemberEquity:()=>s.default,MultiLayoutGraphicBlock:()=>A.default,Shelf:()=>d.default,ShelfDisplay:()=>n.default,Slogan:()=>m.default,Spacer:()=>c.default,Title:()=>x.default});module.exports=b(v);var d=e(require("./Shelf/index.js")),i=e(require("./BrandEquity/index.js")),s=e(require("./MemberEquity/index.js")),m=e(require("./Slogan/index.js")),x=e(require("./Title/index.js")),c=e(require("./Spacer/index.js")),n=e(require("./ShelfDisplay/index.js")),y=e(require("./Evaluate/index.js")),M=e(require("./Category/index.js")),h=e(require("./HeroBanner/index.js")),B=e(require("./AccordionCards/index.js")),k=e(require("./Graphic/index.js")),G=e(require("./MediaPlayerBase/index.js")),q=e(require("./MediaPlayerSticky/index.js")),P=e(require("./MediaPlayerMulti/index.js")),S=e(require("./Marquee/index.js")),o=require("./Marquee/index.js"),A=e(require("./MultiLayoutGraphicBlock/index.js")),C=e(require("./GraphicAttractionBlock/index.js"));
|
|
2
2
|
//# sourceMappingURL=index.js.map
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../src/biz-components/index.ts"],
|
|
4
|
-
"sourcesContent": ["export { default as Shelf } from './Shelf/index.js'\nexport { default as BrandEquity } from './BrandEquity/index.js'\nexport { default as MemberEquity } from './MemberEquity/index.js'\nexport { default as Slogan } from './Slogan/index.js'\nexport { default as Title } from './Title/index.js'\nexport { default as Spacer } from './Spacer/index.js'\nexport { default as ShelfDisplay } from './ShelfDisplay/index.js'\nexport { default as Evaluate } from './Evaluate/index.js'\nexport { default as Category } from './Category/index.js'\nexport { default as HeroBanner } from './HeroBanner/index.js'\nexport { default as AccordionCards } from './AccordionCards/index.js'\nexport { default as Graphic } from './Graphic/index.js'\nexport { default as MediaPlayerBase } from './MediaPlayerBase/index.js'\nexport { default as MediaPlayerSticky } from './MediaPlayerSticky/index.js'\nexport { default as MediaPlayerMulti } from './MediaPlayerMulti/index.js'\nexport { default as Marquee } from './Marquee/index.js'\nexport {
|
|
5
|
-
"mappings": "0jBAAA,IAAAA,EAAA,GAAAC,EAAAD,EAAA,omBAAAE,EAAAF,GAAA,IAAAG,EAAiC,+BACjCC,EAAuC,qCACvCC,EAAwC,sCACxCC,EAAkC,gCAClCC,EAAiC,+BACjCC,EAAkC,gCAClCC,EAAwC,sCACxCC,EAAoC,kCACpCC,EAAoC,kCACpCC,EAAsC,oCACtCC,EAA0C,wCAC1CC,EAAmC,iCACnCC,EAA2C,yCAC3CC,EAA6C,2CAC7CC,EAA4C,0CAC5CC,EAAmC,iCACnCA,
|
|
4
|
+
"sourcesContent": ["export { default as Shelf } from './Shelf/index.js'\nexport { default as BrandEquity } from './BrandEquity/index.js'\nexport { default as MemberEquity } from './MemberEquity/index.js'\nexport { default as Slogan } from './Slogan/index.js'\nexport { default as Title } from './Title/index.js'\nexport { default as Spacer } from './Spacer/index.js'\nexport { default as ShelfDisplay } from './ShelfDisplay/index.js'\nexport { default as Evaluate } from './Evaluate/index.js'\nexport { default as Category } from './Category/index.js'\nexport { default as HeroBanner } from './HeroBanner/index.js'\nexport { default as AccordionCards } from './AccordionCards/index.js'\nexport { default as Graphic } from './Graphic/index.js'\nexport { default as MediaPlayerBase } from './MediaPlayerBase/index.js'\nexport { default as MediaPlayerSticky } from './MediaPlayerSticky/index.js'\nexport { default as MediaPlayerMulti } from './MediaPlayerMulti/index.js'\nexport { default as Marquee } from './Marquee/index.js'\nexport { MarqueeItem, MarqueeImageContent, MarqueeTextContent } from './Marquee/index.js'\nexport { default as MultiLayoutGraphicBlock } from './MultiLayoutGraphicBlock/index.js'\nexport type { MultiLayoutGraphicBlockProps } from './MultiLayoutGraphicBlock/index.js'\nexport { default as GraphicAttractionBlock } from './GraphicAttractionBlock/index.js'\nexport type { GraphicAttractionBlockProps } from './GraphicAttractionBlock/index.js'\n"],
|
|
5
|
+
"mappings": "0jBAAA,IAAAA,EAAA,GAAAC,EAAAD,EAAA,omBAAAE,EAAAF,GAAA,IAAAG,EAAiC,+BACjCC,EAAuC,qCACvCC,EAAwC,sCACxCC,EAAkC,gCAClCC,EAAiC,+BACjCC,EAAkC,gCAClCC,EAAwC,sCACxCC,EAAoC,kCACpCC,EAAoC,kCACpCC,EAAsC,oCACtCC,EAA0C,wCAC1CC,EAAmC,iCACnCC,EAA2C,yCAC3CC,EAA6C,2CAC7CC,EAA4C,0CAC5CC,EAAmC,iCACnCA,EAAqE,8BACrEC,EAAmD,iDAEnDC,EAAkD",
|
|
6
6
|
"names": ["biz_components_exports", "__export", "__toCommonJS", "import_Shelf", "import_BrandEquity", "import_MemberEquity", "import_Slogan", "import_Title", "import_Spacer", "import_ShelfDisplay", "import_Evaluate", "import_Category", "import_HeroBanner", "import_AccordionCards", "import_Graphic", "import_MediaPlayerBase", "import_MediaPlayerSticky", "import_MediaPlayerMulti", "import_Marquee", "import_MultiLayoutGraphicBlock", "import_GraphicAttractionBlock"]
|
|
7
7
|
}
|
|
@@ -1,16 +1,17 @@
|
|
|
1
1
|
import React, { type ComponentType } from 'react';
|
|
2
2
|
import type { StoryObj } from '@storybook/react';
|
|
3
|
+
import type { MarqueeProps } from '../biz-components/Marquee/type.js';
|
|
3
4
|
declare const meta: {
|
|
4
5
|
title: string;
|
|
5
6
|
component: {
|
|
6
|
-
(props: Omit<
|
|
7
|
+
(props: Omit<MarqueeProps & React.RefAttributes<HTMLDivElement>, keyof import("../shared/Styles.js").StylesProps> & Partial<import("../shared/Styles.js").StylesProps> & {
|
|
7
8
|
className?: string;
|
|
8
9
|
data?: Record<string, any>;
|
|
9
10
|
}): import("react/jsx-runtime").JSX.Element;
|
|
10
11
|
displayName: string;
|
|
11
12
|
};
|
|
12
13
|
subcomponents: {
|
|
13
|
-
|
|
14
|
+
MarqueeItem: ComponentType<unknown>;
|
|
14
15
|
MarqueeImageContent: ComponentType<unknown>;
|
|
15
16
|
MarqueeTextContent: ComponentType<unknown>;
|
|
16
17
|
};
|
|
@@ -23,29 +24,6 @@ declare const meta: {
|
|
|
23
24
|
};
|
|
24
25
|
};
|
|
25
26
|
tags: string[];
|
|
26
|
-
args: {
|
|
27
|
-
speed: number;
|
|
28
|
-
};
|
|
29
|
-
argTypes: {
|
|
30
|
-
direction: {
|
|
31
|
-
control: {
|
|
32
|
-
type: "inline-radio";
|
|
33
|
-
};
|
|
34
|
-
options: string[];
|
|
35
|
-
description: string;
|
|
36
|
-
table: {
|
|
37
|
-
defaultValue: {
|
|
38
|
-
summary: string;
|
|
39
|
-
};
|
|
40
|
-
};
|
|
41
|
-
};
|
|
42
|
-
speed: {
|
|
43
|
-
control: {
|
|
44
|
-
type: "number";
|
|
45
|
-
};
|
|
46
|
-
description: string;
|
|
47
|
-
};
|
|
48
|
-
};
|
|
49
27
|
};
|
|
50
28
|
export default meta;
|
|
51
29
|
type Story = StoryObj<typeof meta>;
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
"use strict";var l=Object.create;var n=Object.defineProperty;var
|
|
1
|
+
"use strict";var l=Object.create;var n=Object.defineProperty;var y=Object.getOwnPropertyDescriptor;var u=Object.getOwnPropertyNames;var f=Object.getPrototypeOf,d=Object.prototype.hasOwnProperty;var M=(e,a)=>{for(var o in a)n(e,o,{get:a[o],enumerable:!0})},m=(e,a,o,i)=>{if(a&&typeof a=="object"||typeof a=="function")for(let s of u(a))!d.call(e,s)&&s!==o&&n(e,s,{get:()=>a[s],enumerable:!(i=y(a,s))||i.enumerable});return e};var q=(e,a,o)=>(o=e!=null?l(f(e)):{},m(a||!e||!e.__esModule?n(o,"default",{value:e,enumerable:!0}):o,e)),h=e=>m(n({},"__esModule",{value:!0}),e);var _={};M(_,{Default:()=>R,MarqueeDirection:()=>b,MarqueeImage:()=>v,MarqueeText:()=>T,default:()=>C});module.exports=h(_);var r=require("react/jsx-runtime"),D=require("react"),t=q(require("../biz-components/Marquee/index.js"));const x={title:"Biz Components/Marquee",component:t.default,subcomponents:{MarqueeItem:t.MarqueeItem,MarqueeImageContent:t.MarqueeImageContent,MarqueeTextContent:t.MarqueeTextContent},parameters:{layout:"fullscreen",docs:{description:{component:"\u8DD1\u9A6C\u706FMarquee\uFF0C\u57FA\u4E8Ehttps://swiperjs.com/swiper-api"}}},tags:["autodocs"]};var C=x;const p={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"}}]},R={args:{data:p},render:()=>(0,r.jsx)(t.default,{data:p})},g={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"}}]},v={args:{data:g},render:()=>(0,r.jsx)(t.default,{data:g})},c={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"}]},T={args:{data:c},render:()=>(0,r.jsx)(t.default,{data:c})},b={args:{data:{...p,reverseDirection:!0}},render:()=>(0,r.jsx)(t.default,{data:p})};
|
|
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, {
|
|
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", "import_jsx_runtime", "import_react", "import_Marquee", "meta", "Marquee", "
|
|
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 render: () => <Marquee data={MarqueeData} />,\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 render: () => <Marquee data={MarqueeImageData} />,\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 render: () => <Marquee data={MarqueeTextData} />,\n}\n\nexport const MarqueeDirection: Story = {\n args: {\n data: {\n ...MarqueeData,\n reverseDirection: true,\n },\n },\n render: () => <Marquee data={MarqueeData} />,\n}\n"],
|
|
5
|
+
"mappings": "0jBAAA,IAAAA,EAAA,GAAAC,EAAAD,EAAA,aAAAE,EAAA,qBAAAC,EAAA,iBAAAC,EAAA,gBAAAC,EAAA,YAAAC,IAAA,eAAAC,EAAAP,GAoDgB,IAAAQ,EAAA,6BApDhBC,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,IAAON,EAAQK,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,EAEaX,EAAiB,CAC5B,KAAM,CACJ,KAAMW,CACR,EACA,OAAQ,OAAM,OAAC,EAAAD,QAAA,CAAQ,KAAMC,EAAa,CAC5C,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,EAEaV,EAAsB,CACjC,KAAM,CACJ,KAAMU,CACR,EACA,OAAQ,OAAM,OAAC,EAAAF,QAAA,CAAQ,KAAME,EAAkB,CACjD,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,EACaV,EAAqB,CAChC,KAAM,CACJ,KAAMU,CACR,EACA,OAAQ,OAAM,OAAC,EAAAH,QAAA,CAAQ,KAAMG,EAAiB,CAChD,EAEaZ,EAA0B,CACrC,KAAM,CACJ,KAAM,CACJ,GAAGU,EACH,iBAAkB,EACpB,CACF,EACA,OAAQ,OAAM,OAAC,EAAAD,QAAA,CAAQ,KAAMC,EAAa,CAC5C",
|
|
6
|
+
"names": ["marquee_stories_exports", "__export", "Default", "MarqueeDirection", "MarqueeImage", "MarqueeText", "marquee_stories_default", "__toCommonJS", "import_jsx_runtime", "import_react", "import_Marquee", "meta", "Marquee", "MarqueeData", "MarqueeImageData", "MarqueeTextData"]
|
|
7
7
|
}
|
|
@@ -1,35 +1,20 @@
|
|
|
1
1
|
import React from 'react';
|
|
2
|
-
import {
|
|
3
|
-
|
|
4
|
-
|
|
5
|
-
|
|
6
|
-
|
|
7
|
-
}
|
|
8
|
-
declare const MarqueeList: React.ForwardRefExoticComponent<MarqueeListProps & React.RefAttributes<HTMLDivElement>>;
|
|
9
|
-
interface MarqueeImageContentProps {
|
|
10
|
-
data: {
|
|
11
|
-
image: Img;
|
|
12
|
-
};
|
|
13
|
-
className?: string;
|
|
14
|
-
}
|
|
2
|
+
import type { MarqueeProps, MarqueeItemProps, MarqueeImageContentProps, MarqueeTextContentProps } from './type.js';
|
|
3
|
+
declare const MarqueeItem: {
|
|
4
|
+
({ data, configuration }: MarqueeItemProps): import("react/jsx-runtime").JSX.Element;
|
|
5
|
+
displayName: string;
|
|
6
|
+
};
|
|
15
7
|
declare const MarqueeImageContent: {
|
|
16
|
-
({
|
|
8
|
+
({ image, imageClassName }: MarqueeImageContentProps): import("react/jsx-runtime").JSX.Element;
|
|
17
9
|
displayName: string;
|
|
18
10
|
};
|
|
19
|
-
interface MarqueeTextContentProps {
|
|
20
|
-
data: {
|
|
21
|
-
text: string;
|
|
22
|
-
};
|
|
23
|
-
className?: string;
|
|
24
|
-
}
|
|
25
11
|
declare const MarqueeTextContent: React.ForwardRefExoticComponent<MarqueeTextContentProps & React.RefAttributes<HTMLDivElement>>;
|
|
26
12
|
declare const _default: {
|
|
27
|
-
(props: Omit<
|
|
13
|
+
(props: Omit<MarqueeProps & React.RefAttributes<HTMLDivElement>, keyof import("../../shared/Styles.js").StylesProps> & Partial<import("../../shared/Styles.js").StylesProps> & {
|
|
28
14
|
className?: string;
|
|
29
15
|
data?: Record<string, any>;
|
|
30
16
|
}): import("react/jsx-runtime").JSX.Element;
|
|
31
17
|
displayName: string;
|
|
32
18
|
};
|
|
33
19
|
export default _default;
|
|
34
|
-
export {
|
|
35
|
-
export type { FastMarqueeProps, MarqueeListProps, MarqueeImageContentProps, MarqueeTextContentProps };
|
|
20
|
+
export { MarqueeItem, MarqueeImageContent, MarqueeTextContent };
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
"use client";import{jsx as
|
|
1
|
+
"use client";import{Fragment as q,jsx as r,jsxs as y}from"react/jsx-runtime";import l from"react";import{Picture as x,Text as c}from"../../components/index.js";import{cn as a}from"../../helpers/utils.js";import{withStyles as w}from"../../shared/Styles.js";import"../SwiperBox/index.js";import{Swiper as f,SwiperSlide as M}from"swiper/react";import{Autoplay as d}from"swiper/modules";const n=l.forwardRef(({data:e,className:t},i)=>r(f,{className:a("laptop:h-[80px] h-[48px] w-full [&_.swiper-slide]:!w-auto [&_.swiper-wrapper]:!ease-linear",t),id:"Marquee"+e?.key,modules:[d],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((m,u)=>r(M,{children:r(o,{data:m})},m?.id+"SwiperSlide"+u))}));n.displayName="Marquee";const o=({data:e,configuration:t})=>y(q,{children:[e.type==="image"&&r(p,{image:e?.image,imageClassName:t?.imageClassName}),e.type==="text"&&r(s,{text:e?.text,textClassName:t?.textClassName})]});o.displayName="MarqueeItem";const p=({image:e,imageClassName:t})=>r(x,{source:e?.url,alt:e?.alt||"",className:a("laptop:h-[80px] laptop:w-[120px] h-[48px] w-[72px]",t),imgClassName:"object-cover"});p.displayName="MarqueeImageContent";const s=l.forwardRef(({text:e,textClassName:t},i)=>r(c,{as:"div",ref:i,html:e,className:a("text-lines-2 flex size-14 items-center justify-center text-nowrap font-medium leading-[1.2]",t)}));s.displayName="MarqueeTextContent";var v=w(n);export{p as MarqueeImageContent,o as MarqueeItem,s as MarqueeTextContent,v 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
|
|
5
|
-
"mappings": "
|
|
6
|
-
"names": ["jsx", "
|
|
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 SwiperBox from '../SwiperBox/index.js'\nimport type { MarqueeProps, MarqueeItemProps, MarqueeImageContentProps, MarqueeTextContentProps } from './type.js'\n\nimport { Swiper, SwiperSlide } from 'swiper/react'\nimport { Autoplay } from 'swiper/modules'\n\nconst Marquee = React.forwardRef<HTMLDivElement, MarqueeProps>(({ data, className }, ref) => {\n return (\n <Swiper\n className={cn(\n 'laptop:h-[80px] h-[48px] w-full [&_.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 <Picture\n source={image?.url}\n alt={image?.alt || ''}\n className={cn('laptop:h-[80px] laptop:w-[120px] h-[48px] w-[72px]', imageClassName)}\n imgClassName=\"object-cover\"\n />\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(\n 'text-lines-2 flex size-14 items-center justify-center text-nowrap font-medium leading-[1.2]',\n textClassName\n )}\n />\n )\n})\n\nMarqueeTextContent.displayName = 'MarqueeTextContent'\n\nexport default withStyles(Marquee)\nexport { MarqueeItem, MarqueeImageContent, MarqueeTextContent }\n"],
|
|
5
|
+
"mappings": "aAyCU,OAUN,YAAAA,EAVM,OAAAC,EAUN,QAAAC,MAVM,oBAxCV,OAAOC,MAAW,QAClB,OAAS,WAAAC,EAAS,QAAAC,MAAY,4BAC9B,OAAS,MAAAC,MAAU,yBACnB,OAAS,cAAAC,MAAkB,yBAC3B,MAAsB,wBAGtB,OAAS,UAAAC,EAAQ,eAAAC,MAAmB,eACpC,OAAS,YAAAC,MAAgB,iBAEzB,MAAMC,EAAUR,EAAM,WAAyC,CAAC,CAAE,KAAAS,EAAM,UAAAC,CAAU,EAAGC,IAEjFb,EAACO,EAAA,CACC,UAAWF,EACT,6FACAO,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,cAAe,OACf,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,EAACG,EAAA,CACC,OAAQiB,GAAO,IACf,IAAKA,GAAO,KAAO,GACnB,UAAWf,EAAG,qDAAsDgB,CAAc,EAClF,aAAa,eACf,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,EACT,8FACAkB,CACF,EACF,CAEH,EAEDJ,EAAmB,YAAc,qBAEjC,IAAOK,EAAQlB,EAAWI,CAAO",
|
|
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
|
}
|
|
@@ -1,3 +1,2 @@
|
|
|
1
1
|
export { default } from './Marquee.js';
|
|
2
|
-
export {
|
|
3
|
-
export type { FastMarqueeProps, MarqueeListProps, MarqueeImageContentProps, MarqueeTextContentProps, } from './Marquee.js';
|
|
2
|
+
export { MarqueeItem, MarqueeImageContent, MarqueeTextContent } from './Marquee.js';
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import{default as
|
|
1
|
+
import{default as r}from"./Marquee.js";import{MarqueeItem as a,MarqueeImageContent as m,MarqueeTextContent as n}from"./Marquee.js";export{m as MarqueeImageContent,a as MarqueeItem,n as MarqueeTextContent,r as default};
|
|
2
2
|
//# sourceMappingURL=index.js.map
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../../src/biz-components/Marquee/index.ts"],
|
|
4
|
-
"sourcesContent": ["export { default } from './Marquee.js'\nexport {
|
|
4
|
+
"sourcesContent": ["export { default } from './Marquee.js'\nexport { MarqueeItem, MarqueeImageContent, MarqueeTextContent } from './Marquee.js'\n"],
|
|
5
5
|
"mappings": "AAAA,OAAS,WAAAA,MAAe,eACxB,OAAS,eAAAC,EAAa,uBAAAC,EAAqB,sBAAAC,MAA0B",
|
|
6
|
-
"names": ["default", "
|
|
6
|
+
"names": ["default", "MarqueeItem", "MarqueeImageContent", "MarqueeTextContent"]
|
|
7
7
|
}
|
|
@@ -0,0 +1,30 @@
|
|
|
1
|
+
import type { Img } from '../../types/props.js';
|
|
2
|
+
interface MarqueeProps {
|
|
3
|
+
data: {
|
|
4
|
+
key?: string;
|
|
5
|
+
/** 是否反向 */
|
|
6
|
+
reverseDirection?: boolean;
|
|
7
|
+
/** 速度 */
|
|
8
|
+
speed?: number;
|
|
9
|
+
/** 跑马灯内容 */
|
|
10
|
+
items: any[];
|
|
11
|
+
};
|
|
12
|
+
className?: string;
|
|
13
|
+
}
|
|
14
|
+
interface MarqueeItemProps {
|
|
15
|
+
data: {
|
|
16
|
+
type: 'image' | 'text';
|
|
17
|
+
image?: Img;
|
|
18
|
+
text?: string;
|
|
19
|
+
};
|
|
20
|
+
configuration?: any;
|
|
21
|
+
}
|
|
22
|
+
interface MarqueeImageContentProps {
|
|
23
|
+
image?: Img;
|
|
24
|
+
imageClassName?: string;
|
|
25
|
+
}
|
|
26
|
+
interface MarqueeTextContentProps {
|
|
27
|
+
text?: string;
|
|
28
|
+
textClassName?: string;
|
|
29
|
+
}
|
|
30
|
+
export type { MarqueeProps, MarqueeItemProps, MarqueeImageContentProps, MarqueeTextContentProps };
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
//# sourceMappingURL=type.js.map
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import{Fragment as v,jsx as t,jsxs as o}from"react/jsx-runtime";import T from"react";import{useMediaQuery as w}from"react-responsive";import{withStyles as B}from"../../shared/Styles.js";import I from"../../components/picture.js";import g from"../../components/button.js";import{Heading as G}from"../../components/heading.js";import{Text as $}from"../../components/text.js";import{Carousel as k,CarouselContent as y,CarouselItem as N}from"../../components/carousel.js";import{Grid as C,GridItem as h}from"../../components/gird.js";import M from"../Title/index.js";import{cn as L}from"../../helpers/utils.js";import{Tabs as S,TabsList as P,TabsTrigger as R,TabsContent as q}from"../../components/tabs.js";const d=({item:b,shape:x="square",isTab:s=!1})=>{const u=w({query:"(max-width: 1024px)"}),{theme:m="light",title:n,description:i,imageUrl:p,primaryButton:r,secondaryButton:c}=b,e="lg-desktop:px-7 lg-desktop:pb-[14px] lg-desktop:pt-[15px] lg-desktop:text-[16px]";return o("div",{className:L("item-wrapper group relative w-full overflow-hidden",{"rounded-
|
|
1
|
+
import{Fragment as v,jsx as t,jsxs as o}from"react/jsx-runtime";import T from"react";import{useMediaQuery as w}from"react-responsive";import{withStyles as B}from"../../shared/Styles.js";import I from"../../components/picture.js";import g from"../../components/button.js";import{Heading as G}from"../../components/heading.js";import{Text as $}from"../../components/text.js";import{Carousel as k,CarouselContent as y,CarouselItem as N}from"../../components/carousel.js";import{Grid as C,GridItem as h}from"../../components/gird.js";import M from"../Title/index.js";import{cn as L}from"../../helpers/utils.js";import{Tabs as S,TabsList as P,TabsTrigger as R,TabsContent as q}from"../../components/tabs.js";const d=({item:b,shape:x="square",isTab:s=!1})=>{const u=w({query:"(max-width: 1024px)"}),{theme:m="light",title:n,description:i,imageUrl:p,primaryButton:r,secondaryButton:c}=b,e="lg-desktop:px-7 lg-desktop:pb-[14px] lg-desktop:pt-[15px] lg-desktop:text-[16px]";return o("div",{className:L("item-wrapper group relative box-border w-full overflow-hidden",{"rounded-2xl":x==="rounded","aiui-dark":m==="dark","h-[480px]":u&&!s,"h-[400px]":u&&s},"text-info-primary"),children:[t(I,{source:p?.url,className:"inset-0 h-full overflow-hidden",imgClassName:"h-full transition-all duration-300 group-hover:scale-105 object-cover",style:{aspectRatio:`${p?.width}/${p?.height}`}}),o("div",{className:"laptop:p-6 desktop:p-[32px] absolute inset-x-0 bottom-0 flex flex-col gap-6 p-3",children:[o("div",{children:[t(G,{size:3,className:"item-title",html:n}),t($,{className:"item-description desktop:mt-1 text-text-2 lg-desktop:text-text-3",html:i})]}),o("div",{className:"flex gap-[16px]",children:[c&&t(g,{className:e,variant:"secondary",asChild:!0,children:t("a",{href:c.link,children:c.text})}),r&&t(g,{className:e,variant:"primary",asChild:!0,children:t("a",{href:r.link,children:r.text})})]})]})]})},z=T.forwardRef((b,x)=>{const{shape:s,sectionTitle:u,groupByTab:m=!1,items:n=[],carousel:i}=b.data,p=e=>{switch(e){case"full":return 12;case"half":return 6;case"one-third":return 4}},r=n.map(e=>e.tabName).filter(Boolean).filter((e,a,l)=>l.indexOf(e)===a),c=r.map(e=>({tabName:e,items:n.filter(a=>a.tabName===e)})).reduce((e,a)=>(e[a.tabName]=a.items,e),{});return o("section",{"data-ui-component-id":"MultiLayoutGraphicBlock",ref:x,className:"text-info-primary",children:[u&&t(M,{data:{title:u},className:"section-title"}),m?o(S,{shape:s,align:"left",defaultValue:r[0],children:[t(P,{children:r.map((e,a)=>t(R,{value:e,children:e},a))}),r.map((e,a)=>t(q,{value:e,className:"desktop:mt-[36px] mt-[24px] w-full",children:o(v,{children:[o(C,{className:"w-full",children:[c[e].map((l,f)=>t(h,{span:p(l.width??"full"),className:"laptop:block hidden",children:t(d,{item:l,shape:s,isTab:m})},`${l?.title||""}${f}`)),t(h,{className:"laptop:hidden block",span:12,children:t(k,{className:"",children:t(y,{className:"flex",children:c[e].map((l,f)=>t(N,{className:"tablet:basis-2/5 laptop:basis-[32%] flex basis-4/5",children:t(d,{item:l,shape:s,isTab:m})},`${l?.title||""}${f}`))})})})]}),i&&i?.items.length>0?t(k,{className:"laptop:mt-4 mt-3",children:t(y,{className:"flex",children:i.items.map((l,f)=>t(N,{className:"tablet:basis-2/5 laptop:basis-[32%] flex basis-4/5",children:t(d,{item:l,shape:s,isTab:m})},f))})}):null]})},a))]}):o(v,{children:[o(C,{className:"w-full",children:[n.map((e,a)=>t(h,{span:p(e.width??"full"),className:"laptop:block hidden",children:t(d,{item:e,shape:s})},`${e?.title||""}${a}`)),n.map((e,a)=>t(h,{span:p("full"),className:"laptop:hidden block",children:t(d,{item:e,shape:s})},`${e?.title||""}${a}`))]}),i&&i?.items.length>0?t(k,{className:"laptop:mt-4 mt-3",children:t(y,{className:"flex",children:i.items.map((e,a)=>t(N,{className:"tablet:basis-2/5 laptop:basis-[32%] flex basis-4/5",children:t(d,{item:e,shape:s})},`${e?.title||""}${a}`))})}):null]})]})});var W=B(z);export{W as default};
|
|
2
2
|
//# sourceMappingURL=MultiLayoutGraphicBlock.js.map
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../../src/biz-components/MultiLayoutGraphicBlock/MultiLayoutGraphicBlock.tsx"],
|
|
4
|
-
"sourcesContent": ["import React from 'react'\nimport { useMediaQuery } from 'react-responsive'\nimport type { MultiLayoutGraphicBlockProps, Item } from './types'\nimport { withStyles } from '../../shared/Styles.js'\nimport Picture from '../../components/picture.js'\nimport Button from '../../components/button.js'\nimport { Heading } from '../../components/heading.js'\nimport { Text } from '../../components/text.js'\nimport { Carousel, CarouselContent, CarouselItem } from '../../components/carousel.js'\nimport { Grid, GridItem } from '../../components/gird.js'\nimport Title from '../Title/index.js'\nimport type { Shape } from '../../types/props'\nimport { cn } from '../../helpers/utils.js'\nimport { Tabs, TabsList, TabsTrigger, TabsContent } from '../../components/tabs.js'\nconst ItemBlock = ({\n item,\n shape = 'square',\n isTab = false,\n}: { item: Item } & { shape?: Shape } & { isTab?: boolean }) => {\n const isMobile = useMediaQuery({ query: '(max-width: 1024px)' })\n\n const { theme = 'light', title, description, imageUrl, primaryButton, secondaryButton } = item\n const lgButtonSize = 'lg-desktop:px-7 lg-desktop:pb-[14px] lg-desktop:pt-[15px] lg-desktop:text-[16px]'\n\n return (\n <div\n className={cn(\n
|
|
5
|
-
"mappings": "AAqCM,OA0EQ,YAAAA,EA1ER,OAAAC,EAOE,QAAAC,MAPF,oBArCN,OAAOC,MAAW,QAClB,OAAS,iBAAAC,MAAqB,mBAE9B,OAAS,cAAAC,MAAkB,yBAC3B,OAAOC,MAAa,8BACpB,OAAOC,MAAY,6BACnB,OAAS,WAAAC,MAAe,8BACxB,OAAS,QAAAC,MAAY,2BACrB,OAAS,YAAAC,EAAU,mBAAAC,EAAiB,gBAAAC,MAAoB,+BACxD,OAAS,QAAAC,EAAM,YAAAC,MAAgB,2BAC/B,OAAOC,MAAW,oBAElB,OAAS,MAAAC,MAAU,yBACnB,OAAS,QAAAC,EAAM,YAAAC,EAAU,eAAAC,EAAa,eAAAC,MAAmB,2BACzD,MAAMC,EAAY,CAAC,CACjB,KAAAC,EACA,MAAAC,EAAQ,SACR,MAAAC,EAAQ,EACV,IAAgE,CAC9D,MAAMC,EAAWrB,EAAc,CAAE,MAAO,qBAAsB,CAAC,EAEzD,CAAE,MAAAsB,EAAQ,QAAS,MAAAC,EAAO,YAAAC,EAAa,SAAAC,EAAU,cAAAC,EAAe,gBAAAC,CAAgB,EAAIT,EACpFU,EAAe,mFAErB,OACE9B,EAAC,OACC,UAAWc,EACT,
|
|
4
|
+
"sourcesContent": ["import React from 'react'\nimport { useMediaQuery } from 'react-responsive'\nimport type { MultiLayoutGraphicBlockProps, Item } from './types'\nimport { withStyles } from '../../shared/Styles.js'\nimport Picture from '../../components/picture.js'\nimport Button from '../../components/button.js'\nimport { Heading } from '../../components/heading.js'\nimport { Text } from '../../components/text.js'\nimport { Carousel, CarouselContent, CarouselItem } from '../../components/carousel.js'\nimport { Grid, GridItem } from '../../components/gird.js'\nimport Title from '../Title/index.js'\nimport type { Shape } from '../../types/props'\nimport { cn } from '../../helpers/utils.js'\nimport { Tabs, TabsList, TabsTrigger, TabsContent } from '../../components/tabs.js'\nconst ItemBlock = ({\n item,\n shape = 'square',\n isTab = false,\n}: { item: Item } & { shape?: Shape } & { isTab?: boolean }) => {\n const isMobile = useMediaQuery({ query: '(max-width: 1024px)' })\n\n const { theme = 'light', title, description, imageUrl, primaryButton, secondaryButton } = item\n const lgButtonSize = 'lg-desktop:px-7 lg-desktop:pb-[14px] lg-desktop:pt-[15px] lg-desktop:text-[16px]'\n\n return (\n <div\n className={cn(\n 'item-wrapper group relative box-border w-full overflow-hidden',\n {\n 'rounded-2xl': shape === 'rounded',\n 'aiui-dark': theme === 'dark',\n 'h-[480px]': isMobile && !isTab,\n 'h-[400px]': isMobile && isTab,\n },\n `text-info-primary`\n )}\n >\n <Picture\n source={imageUrl?.url}\n className=\"inset-0 h-full overflow-hidden\"\n imgClassName=\"h-full transition-all duration-300 group-hover:scale-105 object-cover\"\n style={{ aspectRatio: `${imageUrl?.width}/${imageUrl?.height}` }}\n />\n <div className=\"laptop:p-6 desktop:p-[32px] absolute inset-x-0 bottom-0 flex flex-col gap-6 p-3\">\n <div>\n <Heading size={3} className=\"item-title\" html={title} />\n <Text className=\"item-description desktop:mt-1 text-text-2 lg-desktop:text-text-3\" html={description} />\n </div>\n <div className=\"flex gap-[16px]\">\n {secondaryButton && (\n <Button className={lgButtonSize} variant=\"secondary\" asChild>\n <a href={secondaryButton.link}>{secondaryButton.text}</a>\n </Button>\n )}\n {primaryButton && (\n <Button className={lgButtonSize} variant=\"primary\" asChild>\n <a href={primaryButton.link}>{primaryButton.text}</a>\n </Button>\n )}\n </div>\n </div>\n </div>\n )\n}\n\nconst MultiLayoutGraphicBlock = React.forwardRef<HTMLDivElement, MultiLayoutGraphicBlockProps>((props, ref) => {\n const { shape, sectionTitle, groupByTab = false, items = [], carousel } = props.data\n const getSpan = (width: 'full' | 'half' | 'one-third') => {\n switch (width) {\n case 'full':\n return 12\n case 'half':\n return 6\n case 'one-third':\n return 4\n }\n }\n\n const tabNames = items\n .map(item => item.tabName)\n .filter(Boolean)\n .filter((item, index, arr) => arr.indexOf(item) === index) as string[]\n\n const tabItemsMaps = tabNames\n .map(tabName => ({\n tabName,\n items: items.filter(item => item.tabName === tabName),\n }))\n .reduce(\n (acc, cur) => {\n acc[cur.tabName] = cur.items\n return acc\n },\n {} as Record<string, (Item & { width?: 'full' | 'half' | 'one-third' })[]>\n )\n\n return (\n <section data-ui-component-id=\"MultiLayoutGraphicBlock\" ref={ref} className=\"text-info-primary\">\n {sectionTitle && <Title data={{ title: sectionTitle }} className=\"section-title\" />}\n\n {groupByTab ? (\n <Tabs shape={shape} align=\"left\" defaultValue={tabNames[0]!}>\n <TabsList>\n {tabNames.map((tabName, index) => (\n <TabsTrigger key={index} value={tabName!}>\n {tabName}\n </TabsTrigger>\n ))}\n </TabsList>\n {tabNames.map((tabName, index) => (\n <TabsContent key={index} value={tabName!} className=\"desktop:mt-[36px] mt-[24px] w-full\">\n <>\n <Grid className=\"w-full\">\n {tabItemsMaps[tabName].map((item, index) => (\n <GridItem\n key={`${item?.title || ''}${index}`}\n span={getSpan(item.width ?? 'full')}\n className=\"laptop:block hidden\"\n >\n <ItemBlock item={item} shape={shape} isTab={groupByTab} />\n </GridItem>\n ))}\n {\n <GridItem className=\"laptop:hidden block\" span={12}>\n <Carousel className=\"\">\n <CarouselContent className=\"flex\">\n {tabItemsMaps[tabName].map((item, index) => (\n <CarouselItem\n key={`${item?.title || ''}${index}`}\n className=\"tablet:basis-2/5 laptop:basis-[32%] flex basis-4/5\"\n >\n <ItemBlock item={item} shape={shape} isTab={groupByTab} />\n </CarouselItem>\n ))}\n </CarouselContent>\n </Carousel>\n </GridItem>\n }\n </Grid>\n {carousel && carousel?.items.length > 0 ? (\n <Carousel className=\"laptop:mt-4 mt-3\">\n <CarouselContent className=\"flex\">\n {carousel.items.map((item, index) => (\n <CarouselItem key={index} className=\"tablet:basis-2/5 laptop:basis-[32%] flex basis-4/5\">\n <ItemBlock item={item} shape={shape} isTab={groupByTab} />\n </CarouselItem>\n ))}\n </CarouselContent>\n </Carousel>\n ) : null}\n </>\n </TabsContent>\n ))}\n </Tabs>\n ) : (\n <>\n <Grid className=\"w-full\">\n {items.map((item, index) => (\n <GridItem\n key={`${item?.title || ''}${index}`}\n span={getSpan(item.width ?? 'full')}\n className=\"laptop:block hidden\"\n >\n <ItemBlock item={item} shape={shape} />\n </GridItem>\n ))}\n {items.map((item, index) => (\n <GridItem key={`${item?.title || ''}${index}`} span={getSpan('full')} className=\"laptop:hidden block\">\n <ItemBlock item={item} shape={shape} />\n </GridItem>\n ))}\n </Grid>\n {carousel && carousel?.items.length > 0 ? (\n <Carousel className=\"laptop:mt-4 mt-3\">\n <CarouselContent className=\"flex\">\n {carousel.items.map((item, index) => (\n <CarouselItem\n key={`${item?.title || ''}${index}`}\n className=\"tablet:basis-2/5 laptop:basis-[32%] flex basis-4/5\"\n >\n <ItemBlock item={item} shape={shape} />\n </CarouselItem>\n ))}\n </CarouselContent>\n </Carousel>\n ) : null}\n </>\n )}\n </section>\n )\n})\n\nexport default withStyles(MultiLayoutGraphicBlock)\nexport type { MultiLayoutGraphicBlockProps }\n"],
|
|
5
|
+
"mappings": "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",
|
|
6
6
|
"names": ["Fragment", "jsx", "jsxs", "React", "useMediaQuery", "withStyles", "Picture", "Button", "Heading", "Text", "Carousel", "CarouselContent", "CarouselItem", "Grid", "GridItem", "Title", "cn", "Tabs", "TabsList", "TabsTrigger", "TabsContent", "ItemBlock", "item", "shape", "isTab", "isMobile", "theme", "title", "description", "imageUrl", "primaryButton", "secondaryButton", "lgButtonSize", "MultiLayoutGraphicBlock", "props", "ref", "sectionTitle", "groupByTab", "items", "carousel", "getSpan", "width", "tabNames", "index", "arr", "tabItemsMaps", "tabName", "acc", "cur", "MultiLayoutGraphicBlock_default"]
|
|
7
7
|
}
|
|
@@ -14,7 +14,7 @@ export { default as MediaPlayerBase } from './MediaPlayerBase/index.js';
|
|
|
14
14
|
export { default as MediaPlayerSticky } from './MediaPlayerSticky/index.js';
|
|
15
15
|
export { default as MediaPlayerMulti } from './MediaPlayerMulti/index.js';
|
|
16
16
|
export { default as Marquee } from './Marquee/index.js';
|
|
17
|
-
export {
|
|
17
|
+
export { MarqueeItem, MarqueeImageContent, MarqueeTextContent } from './Marquee/index.js';
|
|
18
18
|
export { default as MultiLayoutGraphicBlock } from './MultiLayoutGraphicBlock/index.js';
|
|
19
19
|
export type { MultiLayoutGraphicBlockProps } from './MultiLayoutGraphicBlock/index.js';
|
|
20
20
|
export { default as GraphicAttractionBlock } from './GraphicAttractionBlock/index.js';
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import{default as r}from"./Shelf/index.js";import{default as o}from"./BrandEquity/index.js";import{default as
|
|
1
|
+
import{default as r}from"./Shelf/index.js";import{default as o}from"./BrandEquity/index.js";import{default as l}from"./MemberEquity/index.js";import{default as u}from"./Slogan/index.js";import{default as i}from"./Title/index.js";import{default as m}from"./Spacer/index.js";import{default as c}from"./ShelfDisplay/index.js";import{default as y}from"./Evaluate/index.js";import{default as h}from"./Category/index.js";import{default as k}from"./HeroBanner/index.js";import{default as q}from"./AccordionCards/index.js";import{default as S}from"./Graphic/index.js";import{default as C}from"./MediaPlayerBase/index.js";import{default as E}from"./MediaPlayerSticky/index.js";import{default as j}from"./MediaPlayerMulti/index.js";import{default as T}from"./Marquee/index.js";import{MarqueeItem as v,MarqueeImageContent as D,MarqueeTextContent as H}from"./Marquee/index.js";import{default as z}from"./MultiLayoutGraphicBlock/index.js";import{default as J}from"./GraphicAttractionBlock/index.js";export{q as AccordionCards,o as BrandEquity,h as Category,y as Evaluate,S as Graphic,J as GraphicAttractionBlock,k as HeroBanner,T as Marquee,D as MarqueeImageContent,v as MarqueeItem,H as MarqueeTextContent,C as MediaPlayerBase,j as MediaPlayerMulti,E as MediaPlayerSticky,l as MemberEquity,z as MultiLayoutGraphicBlock,r as Shelf,c as ShelfDisplay,u as Slogan,m as Spacer,i as Title};
|
|
2
2
|
//# sourceMappingURL=index.js.map
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../src/biz-components/index.ts"],
|
|
4
|
-
"sourcesContent": ["export { default as Shelf } from './Shelf/index.js'\nexport { default as BrandEquity } from './BrandEquity/index.js'\nexport { default as MemberEquity } from './MemberEquity/index.js'\nexport { default as Slogan } from './Slogan/index.js'\nexport { default as Title } from './Title/index.js'\nexport { default as Spacer } from './Spacer/index.js'\nexport { default as ShelfDisplay } from './ShelfDisplay/index.js'\nexport { default as Evaluate } from './Evaluate/index.js'\nexport { default as Category } from './Category/index.js'\nexport { default as HeroBanner } from './HeroBanner/index.js'\nexport { default as AccordionCards } from './AccordionCards/index.js'\nexport { default as Graphic } from './Graphic/index.js'\nexport { default as MediaPlayerBase } from './MediaPlayerBase/index.js'\nexport { default as MediaPlayerSticky } from './MediaPlayerSticky/index.js'\nexport { default as MediaPlayerMulti } from './MediaPlayerMulti/index.js'\nexport { default as Marquee } from './Marquee/index.js'\nexport {
|
|
5
|
-
"mappings": "AAAA,OAAoB,WAAXA,MAAwB,mBACjC,OAAoB,WAAXA,MAA8B,yBACvC,OAAoB,WAAXA,MAA+B,0BACxC,OAAoB,WAAXA,MAAyB,oBAClC,OAAoB,WAAXA,MAAwB,mBACjC,OAAoB,WAAXA,MAAyB,oBAClC,OAAoB,WAAXA,MAA+B,0BACxC,OAAoB,WAAXA,MAA2B,sBACpC,OAAoB,WAAXA,MAA2B,sBACpC,OAAoB,WAAXA,MAA6B,wBACtC,OAAoB,WAAXA,MAAiC,4BAC1C,OAAoB,WAAXA,MAA0B,qBACnC,OAAoB,WAAXA,MAAkC,6BAC3C,OAAoB,WAAXA,MAAoC,+BAC7C,OAAoB,WAAXA,MAAmC,8BAC5C,OAAoB,WAAXA,MAA0B,qBACnC,
|
|
6
|
-
"names": ["default", "
|
|
4
|
+
"sourcesContent": ["export { default as Shelf } from './Shelf/index.js'\nexport { default as BrandEquity } from './BrandEquity/index.js'\nexport { default as MemberEquity } from './MemberEquity/index.js'\nexport { default as Slogan } from './Slogan/index.js'\nexport { default as Title } from './Title/index.js'\nexport { default as Spacer } from './Spacer/index.js'\nexport { default as ShelfDisplay } from './ShelfDisplay/index.js'\nexport { default as Evaluate } from './Evaluate/index.js'\nexport { default as Category } from './Category/index.js'\nexport { default as HeroBanner } from './HeroBanner/index.js'\nexport { default as AccordionCards } from './AccordionCards/index.js'\nexport { default as Graphic } from './Graphic/index.js'\nexport { default as MediaPlayerBase } from './MediaPlayerBase/index.js'\nexport { default as MediaPlayerSticky } from './MediaPlayerSticky/index.js'\nexport { default as MediaPlayerMulti } from './MediaPlayerMulti/index.js'\nexport { default as Marquee } from './Marquee/index.js'\nexport { MarqueeItem, MarqueeImageContent, MarqueeTextContent } from './Marquee/index.js'\nexport { default as MultiLayoutGraphicBlock } from './MultiLayoutGraphicBlock/index.js'\nexport type { MultiLayoutGraphicBlockProps } from './MultiLayoutGraphicBlock/index.js'\nexport { default as GraphicAttractionBlock } from './GraphicAttractionBlock/index.js'\nexport type { GraphicAttractionBlockProps } from './GraphicAttractionBlock/index.js'\n"],
|
|
5
|
+
"mappings": "AAAA,OAAoB,WAAXA,MAAwB,mBACjC,OAAoB,WAAXA,MAA8B,yBACvC,OAAoB,WAAXA,MAA+B,0BACxC,OAAoB,WAAXA,MAAyB,oBAClC,OAAoB,WAAXA,MAAwB,mBACjC,OAAoB,WAAXA,MAAyB,oBAClC,OAAoB,WAAXA,MAA+B,0BACxC,OAAoB,WAAXA,MAA2B,sBACpC,OAAoB,WAAXA,MAA2B,sBACpC,OAAoB,WAAXA,MAA6B,wBACtC,OAAoB,WAAXA,MAAiC,4BAC1C,OAAoB,WAAXA,MAA0B,qBACnC,OAAoB,WAAXA,MAAkC,6BAC3C,OAAoB,WAAXA,MAAoC,+BAC7C,OAAoB,WAAXA,MAAmC,8BAC5C,OAAoB,WAAXA,MAA0B,qBACnC,OAAS,eAAAC,EAAa,uBAAAC,EAAqB,sBAAAC,MAA0B,qBACrE,OAAoB,WAAXH,MAA0C,qCAEnD,OAAoB,WAAXA,MAAyC",
|
|
6
|
+
"names": ["default", "MarqueeItem", "MarqueeImageContent", "MarqueeTextContent"]
|
|
7
7
|
}
|
|
@@ -1,16 +1,17 @@
|
|
|
1
1
|
import React, { type ComponentType } from 'react';
|
|
2
2
|
import type { StoryObj } from '@storybook/react';
|
|
3
|
+
import type { MarqueeProps } from '../biz-components/Marquee/type.js';
|
|
3
4
|
declare const meta: {
|
|
4
5
|
title: string;
|
|
5
6
|
component: {
|
|
6
|
-
(props: Omit<
|
|
7
|
+
(props: Omit<MarqueeProps & React.RefAttributes<HTMLDivElement>, keyof import("../shared/Styles.js").StylesProps> & Partial<import("../shared/Styles.js").StylesProps> & {
|
|
7
8
|
className?: string;
|
|
8
9
|
data?: Record<string, any>;
|
|
9
10
|
}): import("react/jsx-runtime").JSX.Element;
|
|
10
11
|
displayName: string;
|
|
11
12
|
};
|
|
12
13
|
subcomponents: {
|
|
13
|
-
|
|
14
|
+
MarqueeItem: ComponentType<unknown>;
|
|
14
15
|
MarqueeImageContent: ComponentType<unknown>;
|
|
15
16
|
MarqueeTextContent: ComponentType<unknown>;
|
|
16
17
|
};
|
|
@@ -23,29 +24,6 @@ declare const meta: {
|
|
|
23
24
|
};
|
|
24
25
|
};
|
|
25
26
|
tags: string[];
|
|
26
|
-
args: {
|
|
27
|
-
speed: number;
|
|
28
|
-
};
|
|
29
|
-
argTypes: {
|
|
30
|
-
direction: {
|
|
31
|
-
control: {
|
|
32
|
-
type: "inline-radio";
|
|
33
|
-
};
|
|
34
|
-
options: string[];
|
|
35
|
-
description: string;
|
|
36
|
-
table: {
|
|
37
|
-
defaultValue: {
|
|
38
|
-
summary: string;
|
|
39
|
-
};
|
|
40
|
-
};
|
|
41
|
-
};
|
|
42
|
-
speed: {
|
|
43
|
-
control: {
|
|
44
|
-
type: "number";
|
|
45
|
-
};
|
|
46
|
-
description: string;
|
|
47
|
-
};
|
|
48
|
-
};
|
|
49
27
|
};
|
|
50
28
|
export default meta;
|
|
51
29
|
type Story = StoryObj<typeof meta>;
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import{jsx as
|
|
1
|
+
import{jsx as a}from"react/jsx-runtime";import"react";import e,{MarqueeItem as r,MarqueeImageContent as n,MarqueeTextContent as p}from"../biz-components/Marquee/index.js";const i={title:"Biz Components/Marquee",component:e,subcomponents:{MarqueeItem:r,MarqueeImageContent:n,MarqueeTextContent:p},parameters:{layout:"fullscreen",docs:{description:{component:"\u8DD1\u9A6C\u706FMarquee\uFF0C\u57FA\u4E8Ehttps://swiperjs.com/swiper-api"}}},tags:["autodocs"]};var l=i;const t={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"}}]},y={args:{data:t},render:()=>a(e,{data:t})},o={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"}}]},u={args:{data:o},render:()=>a(e,{data:o})},s={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"}]},f={args:{data:s},render:()=>a(e,{data:s})},d={args:{data:{...t,reverseDirection:!0}},render:()=>a(e,{data:t})};export{y as Default,d as MarqueeDirection,u as MarqueeImage,f as MarqueeText,l 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, {
|
|
5
|
-
"mappings": "
|
|
6
|
-
"names": ["jsx", "
|
|
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 render: () => <Marquee data={MarqueeData} />,\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 render: () => <Marquee data={MarqueeImageData} />,\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 render: () => <Marquee data={MarqueeTextData} />,\n}\n\nexport const MarqueeDirection: Story = {\n args: {\n data: {\n ...MarqueeData,\n reverseDirection: true,\n },\n },\n render: () => <Marquee data={MarqueeData} />,\n}\n"],
|
|
5
|
+
"mappings": "AAoDgB,cAAAA,MAAA,oBApDhB,MAA0C,QAE1C,OAAOC,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,EACA,OAAQ,IAAMP,EAACC,EAAA,CAAQ,KAAMM,EAAa,CAC5C,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,EACA,OAAQ,IAAMT,EAACC,EAAA,CAAQ,KAAMQ,EAAkB,CACjD,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,EACA,OAAQ,IAAMX,EAACC,EAAA,CAAQ,KAAMU,EAAiB,CAChD,EAEaE,EAA0B,CACrC,KAAM,CACJ,KAAM,CACJ,GAAGN,EACH,iBAAkB,EACpB,CACF,EACA,OAAQ,IAAMP,EAACC,EAAA,CAAQ,KAAMM,EAAa,CAC5C",
|
|
6
|
+
"names": ["jsx", "Marquee", "MarqueeItem", "MarqueeImageContent", "MarqueeTextContent", "meta", "marquee_stories_default", "MarqueeData", "Default", "MarqueeImageData", "MarqueeImage", "MarqueeTextData", "MarqueeText", "MarqueeDirection"]
|
|
7
7
|
}
|