@anker-in/headless-ui 0.0.27-alpha.105 → 0.0.27-alpha.106
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/MemberEquity/index.js +6 -5
- package/dist/cjs/biz-components/MemberEquity/index.js.map +3 -3
- package/dist/cjs/biz-components/MemberEquity/types.d.ts +2 -0
- package/dist/cjs/biz-components/MemberEquity/types.js +1 -1
- package/dist/cjs/biz-components/MemberEquity/types.js.map +1 -1
- package/dist/cjs/biz-components/MultiLayoutGraphicBlock/MultiLayoutGraphicBlock.js +1 -1
- package/dist/cjs/biz-components/MultiLayoutGraphicBlock/MultiLayoutGraphicBlock.js.map +1 -1
- package/dist/cjs/shared/mimeType.d.ts +1 -0
- package/dist/cjs/shared/mimeType.js +2 -0
- package/dist/cjs/shared/mimeType.js.map +7 -0
- package/dist/esm/biz-components/MemberEquity/index.js +7 -6
- package/dist/esm/biz-components/MemberEquity/index.js.map +3 -3
- package/dist/esm/biz-components/MemberEquity/types.d.ts +2 -0
- package/dist/esm/biz-components/MultiLayoutGraphicBlock/MultiLayoutGraphicBlock.js +1 -1
- package/dist/esm/biz-components/MultiLayoutGraphicBlock/MultiLayoutGraphicBlock.js.map +1 -1
- package/dist/esm/shared/mimeType.d.ts +1 -0
- package/dist/esm/shared/mimeType.js +2 -0
- package/dist/esm/shared/mimeType.js.map +7 -0
- package/package.json +1 -1
|
@@ -1,10 +1,11 @@
|
|
|
1
|
-
"use strict";"use client";var
|
|
2
|
-
aspect-[390/480] overflow-hidden`,t,{"aiui-dark":
|
|
1
|
+
"use strict";"use client";var m=Object.defineProperty;var k=Object.getOwnPropertyDescriptor;var h=Object.getOwnPropertyNames;var N=Object.prototype.hasOwnProperty;var B=(l,t)=>{for(var i in t)m(l,i,{get:t[i],enumerable:!0})},q=(l,t,i,s)=>{if(t&&typeof t=="object"||typeof t=="function")for(let a of h(t))!N.call(l,a)&&a!==i&&m(l,a,{get:()=>t[a],enumerable:!(s=k(t,a))||s.enumerable});return l};var z=l=>q(m({},"__esModule",{value:!0}),l);var j={};B(j,{default:()=>C});module.exports=z(j);var e=require("react/jsx-runtime"),E=require("react"),o=require("../../components/index.js"),u=require("../../shared/Styles.js"),c=require("../../helpers/utils.js"),d=require("../../shared/mimeType.js");const P=({data:l,className:t=""})=>{const{title:i,description:s,backgroundImage:a,mobileBackgroundImage:p,primaryButton:r,secondaryButton:n,theme:b,shape:y,primaryButtonHandler:g,secondaryButtonHandler:f}=l,v=()=>{g?.()},x=()=>{f?.()};return(0,e.jsxs)("section",{"data-ui-component-id":"MemberEquity",className:(0,c.cn)(`tablet:aspect-[740/480] laptop:aspect-[1664/485] text-info-primary relative
|
|
2
|
+
aspect-[390/480] overflow-hidden`,t,{"aiui-dark":b==="dark","rounded-box":y==="rounded"}),children:[(0,d.isVideo)(a?.mimeType)?(0,e.jsx)("video",{autoPlay:!0,muted:!0,playsInline:!0,loop:!0,className:"tablet:block absolute inset-0 hidden size-full object-cover",children:(0,e.jsx)("source",{src:a?.url,type:"video/mp4"})}):(0,e.jsx)(o.Picture,{source:a?.url,alt:a?.alt,className:"tablet:block absolute inset-0 hidden size-full object-cover"}),(0,d.isVideo)(p?.mimeType)?(0,e.jsx)("video",{autoPlay:!0,muted:!0,playsInline:!0,loop:!0,className:"tablet:hidden absolute inset-0 size-full object-cover",children:(0,e.jsx)("source",{src:p?.url,type:"video/mp4"})}):(0,e.jsx)(o.Picture,{source:p?.url,alt:p?.alt,className:"tablet:hidden absolute inset-0 size-full object-cover"}),(0,e.jsx)("div",{className:`
|
|
3
3
|
laptop:items-center
|
|
4
4
|
absolute
|
|
5
|
-
inset-0
|
|
5
|
+
inset-0
|
|
6
|
+
flex w-full items-end py-[16px]
|
|
6
7
|
`,children:(0,e.jsxs)("div",{className:`
|
|
7
8
|
tablet:px-6 laptop:px-[76px] desktop:px-[111px] lg-desktop:px-[139px] tablet:gap-5 laptop:gap-6
|
|
8
|
-
desktop:gap-7 lg-desktop:gap-8 flex w-full flex-col gap-
|
|
9
|
-
`,children:[(0,e.jsxs)("div",{className:"tablet:gap-2 laptop:gap-3 desktop:gap-3 lg-desktop:gap-4 flex flex-col gap-2",children:[(0,e.jsx)(
|
|
9
|
+
desktop:gap-7 lg-desktop:gap-8 flex w-full flex-col gap-6 px-4
|
|
10
|
+
`,children:[(0,e.jsxs)("div",{className:"tablet:gap-2 laptop:gap-3 desktop:gap-3 lg-desktop:gap-4 flex flex-col gap-2",children:[(0,e.jsx)(o.Heading,{as:"h2",size:3,className:"member-equity-title ",html:i}),(0,e.jsx)(o.Text,{size:2,className:"member-equity-description",html:s})]}),(0,e.jsxs)("div",{className:"tablet:gap-3 laptop:gap-4 desktop:gap-4 lg-desktop:gap-4 flex items-center gap-3",children:[n&&n.text&&(0,e.jsx)("a",{href:n.link,children:(0,e.jsx)(o.Button,{variant:"secondary",onClick:x,className:(0,c.cn)("member-equity-button-secondary"),children:n.text})}),r&&r.text&&(0,e.jsx)("a",{href:r.link,children:(0,e.jsx)(o.Button,{variant:"primary",onClick:v,className:(0,c.cn)("member-equity-button-primary"),children:r.text})})]})]})})]})};var C=(0,u.withStyles)(P);
|
|
10
11
|
//# sourceMappingURL=index.js.map
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../../src/biz-components/MemberEquity/index.tsx"],
|
|
4
|
-
"sourcesContent": ["'use client'\nimport React from 'react'\nimport { Button, Heading, Text } from '../../components/index.js'\nimport { withStyles } from '../../shared/Styles.js'\nimport type { MemberEquityProps } from './types.js'\nimport { cn } from '../../helpers/utils.js'\n\nconst MemberEquity: React.FC<MemberEquityProps> = ({ data, className = '' }) => {\n const {
|
|
5
|
-
"mappings": "sbAAA,IAAAA,EAAA,GAAAC,EAAAD,EAAA,aAAAE,IAAA,eAAAC,EAAAH,
|
|
6
|
-
"names": ["MemberEquity_exports", "__export", "MemberEquity_default", "__toCommonJS", "import_jsx_runtime", "import_react", "import_components", "import_Styles", "import_utils", "MemberEquity", "data", "className", "title", "description", "backgroundImage", "mobileBackgroundImage", "primaryButton", "secondaryButton", "theme", "shape", "handleButtonPrimaryClick", "handleButtonSecondaryClick"]
|
|
4
|
+
"sourcesContent": ["'use client'\nimport React from 'react'\nimport { Button, Heading, Picture, Text } from '../../components/index.js'\nimport { withStyles } from '../../shared/Styles.js'\nimport type { MemberEquityProps } from './types.js'\nimport { cn } from '../../helpers/utils.js'\nimport { isVideo } from '../../shared/mimeType.js'\n\nconst MemberEquity: React.FC<MemberEquityProps> = ({ data, className = '' }) => {\n const {\n title,\n description,\n backgroundImage,\n mobileBackgroundImage,\n primaryButton,\n secondaryButton,\n theme,\n shape,\n primaryButtonHandler,\n secondaryButtonHandler,\n } = data\n const handleButtonPrimaryClick = () => {\n // \u6267\u884C\u4E3B\u6309\u94AE\u7684\u70B9\u51FB\u4E8B\u4EF6\n primaryButtonHandler?.()\n }\n\n const handleButtonSecondaryClick = () => {\n // \u6267\u884C\u526F\u6309\u94AE\u7684\u70B9\u51FB\u4E8B\u4EF6\n secondaryButtonHandler?.()\n }\n\n return (\n <section\n data-ui-component-id=\"MemberEquity\"\n className={cn(\n `tablet:aspect-[740/480] laptop:aspect-[1664/485] text-info-primary relative\n aspect-[390/480] overflow-hidden`,\n className,\n {\n 'aiui-dark': theme === 'dark',\n 'rounded-box': shape === 'rounded',\n }\n )}\n >\n {isVideo(backgroundImage?.mimeType) ? (\n <video autoPlay muted playsInline loop className=\"tablet:block absolute inset-0 hidden size-full object-cover\">\n <source src={backgroundImage?.url} type=\"video/mp4\" />\n </video>\n ) : (\n <Picture\n source={backgroundImage?.url}\n alt={backgroundImage?.alt}\n className=\"tablet:block absolute inset-0 hidden size-full object-cover\"\n />\n )}\n {isVideo(mobileBackgroundImage?.mimeType) ? (\n <video autoPlay muted playsInline loop className=\"tablet:hidden absolute inset-0 size-full object-cover\">\n <source src={mobileBackgroundImage?.url} type=\"video/mp4\" />\n </video>\n ) : (\n <Picture\n source={mobileBackgroundImage?.url}\n alt={mobileBackgroundImage?.alt}\n className=\"tablet:hidden absolute inset-0 size-full object-cover\"\n />\n )}\n <div\n className={`\n laptop:items-center \n absolute\n inset-0\n flex w-full items-end py-[16px]\n `}\n >\n <div\n className={`\n tablet:px-6 laptop:px-[76px] desktop:px-[111px] lg-desktop:px-[139px] tablet:gap-5 laptop:gap-6\n desktop:gap-7 lg-desktop:gap-8 flex w-full flex-col gap-6 px-4\n `}\n >\n <div className=\"tablet:gap-2 laptop:gap-3 desktop:gap-3 lg-desktop:gap-4 flex flex-col gap-2\">\n <Heading as=\"h2\" size={3} className={`member-equity-title `} html={title} />\n <Text size={2} className={`member-equity-description`} html={description} />\n </div>\n {/* \u6309\u94AE\u7EC4 */}\n <div className=\"tablet:gap-3 laptop:gap-4 desktop:gap-4 lg-desktop:gap-4 flex items-center gap-3\">\n {secondaryButton && secondaryButton.text && (\n <a href={secondaryButton.link}>\n <Button\n variant=\"secondary\"\n onClick={handleButtonSecondaryClick}\n className={cn('member-equity-button-secondary')}\n >\n {secondaryButton.text}\n </Button>\n </a>\n )}\n {primaryButton && primaryButton.text && (\n <a href={primaryButton.link}>\n <Button\n variant=\"primary\"\n onClick={handleButtonPrimaryClick}\n className={cn('member-equity-button-primary')}\n >\n {primaryButton.text}\n </Button>\n </a>\n )}\n </div>\n </div>\n </div>\n </section>\n )\n}\n\nexport default withStyles(MemberEquity)\n"],
|
|
5
|
+
"mappings": "sbAAA,IAAAA,EAAA,GAAAC,EAAAD,EAAA,aAAAE,IAAA,eAAAC,EAAAH,GA8CU,IAAAI,EAAA,6BA7CVC,EAAkB,iBAClBC,EAA+C,qCAC/CC,EAA2B,kCAE3BC,EAAmB,kCACnBC,EAAwB,oCAExB,MAAMC,EAA4C,CAAC,CAAE,KAAAC,EAAM,UAAAC,EAAY,EAAG,IAAM,CAC9E,KAAM,CACJ,MAAAC,EACA,YAAAC,EACA,gBAAAC,EACA,sBAAAC,EACA,cAAAC,EACA,gBAAAC,EACA,MAAAC,EACA,MAAAC,EACA,qBAAAC,EACA,uBAAAC,CACF,EAAIX,EACEY,EAA2B,IAAM,CAErCF,IAAuB,CACzB,EAEMG,EAA6B,IAAM,CAEvCF,IAAyB,CAC3B,EAEA,SACE,QAAC,WACC,uBAAqB,eACrB,aAAW,MACT;AAAA,0CAEAV,EACA,CACE,YAAaO,IAAU,OACvB,cAAeC,IAAU,SAC3B,CACF,EAEC,wBAAQL,GAAiB,QAAQ,KAChC,OAAC,SAAM,SAAQ,GAAC,MAAK,GAAC,YAAW,GAAC,KAAI,GAAC,UAAU,8DAC/C,mBAAC,UAAO,IAAKA,GAAiB,IAAK,KAAK,YAAY,EACtD,KAEA,OAAC,WACC,OAAQA,GAAiB,IACzB,IAAKA,GAAiB,IACtB,UAAU,8DACZ,KAED,WAAQC,GAAuB,QAAQ,KACtC,OAAC,SAAM,SAAQ,GAAC,MAAK,GAAC,YAAW,GAAC,KAAI,GAAC,UAAU,wDAC/C,mBAAC,UAAO,IAAKA,GAAuB,IAAK,KAAK,YAAY,EAC5D,KAEA,OAAC,WACC,OAAQA,GAAuB,IAC/B,IAAKA,GAAuB,IAC5B,UAAU,wDACZ,KAEF,OAAC,OACC,UAAW;AAAA;AAAA;AAAA;AAAA;AAAA,QAOX,oBAAC,OACC,UAAW;AAAA;AAAA;AAAA,UAKX,qBAAC,OAAI,UAAU,+EACb,oBAAC,WAAQ,GAAG,KAAK,KAAM,EAAG,UAAW,uBAAwB,KAAMH,EAAO,KAC1E,OAAC,QAAK,KAAM,EAAG,UAAW,4BAA6B,KAAMC,EAAa,GAC5E,KAEA,QAAC,OAAI,UAAU,mFACZ,UAAAI,GAAmBA,EAAgB,SAClC,OAAC,KAAE,KAAMA,EAAgB,KACvB,mBAAC,UACC,QAAQ,YACR,QAASM,EACT,aAAW,MAAG,gCAAgC,EAE7C,SAAAN,EAAgB,KACnB,EACF,EAEDD,GAAiBA,EAAc,SAC9B,OAAC,KAAE,KAAMA,EAAc,KACrB,mBAAC,UACC,QAAQ,UACR,QAASM,EACT,aAAW,MAAG,8BAA8B,EAE3C,SAAAN,EAAc,KACjB,EACF,GAEJ,GACF,EACF,GACF,CAEJ,EAEA,IAAOf,KAAQ,cAAWQ,CAAY",
|
|
6
|
+
"names": ["MemberEquity_exports", "__export", "MemberEquity_default", "__toCommonJS", "import_jsx_runtime", "import_react", "import_components", "import_Styles", "import_utils", "import_mimeType", "MemberEquity", "data", "className", "title", "description", "backgroundImage", "mobileBackgroundImage", "primaryButton", "secondaryButton", "theme", "shape", "primaryButtonHandler", "secondaryButtonHandler", "handleButtonPrimaryClick", "handleButtonSecondaryClick"]
|
|
7
7
|
}
|
|
@@ -13,11 +13,13 @@ export interface MemberEquityProps extends ComponentCommonProps {
|
|
|
13
13
|
text: string;
|
|
14
14
|
link?: string;
|
|
15
15
|
};
|
|
16
|
+
primaryButtonHandler?: () => void;
|
|
16
17
|
/** 副按钮配置 */
|
|
17
18
|
secondaryButton: {
|
|
18
19
|
text: string;
|
|
19
20
|
link?: string;
|
|
20
21
|
};
|
|
22
|
+
secondaryButtonHandler?: () => void;
|
|
21
23
|
/** 形状 */
|
|
22
24
|
shape?: Shape;
|
|
23
25
|
/** 主题 */
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
"use strict";var r=Object.defineProperty;var
|
|
1
|
+
"use strict";var r=Object.defineProperty;var a=Object.getOwnPropertyDescriptor;var s=Object.getOwnPropertyNames;var m=Object.prototype.hasOwnProperty;var p=(t,e,i,o)=>{if(e&&typeof e=="object"||typeof e=="function")for(let n of s(e))!m.call(t,n)&&n!==i&&r(t,n,{get:()=>e[n],enumerable:!(o=a(e,n))||o.enumerable});return t};var d=t=>p(r({},"__esModule",{value:!0}),t);var g={};module.exports=d(g);
|
|
2
2
|
//# sourceMappingURL=types.js.map
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../../src/biz-components/MemberEquity/types.ts"],
|
|
4
|
-
"sourcesContent": ["import type { ComponentCommonProps, Media, Shape, Theme } from '../../types/props.js'\n\nexport interface MemberEquityProps extends ComponentCommonProps {\n data: {\n /** \u6807\u9898 */\n title: string\n /** \u63CF\u8FF0\u6587\u672C */\n description: string\n /** \u80CC\u666F\u56FE\u7247/\u89C6\u9891 URL */\n backgroundImage?: Media\n mobileBackgroundImage?: Media\n /** \u4E3B\u6309\u94AE\u914D\u7F6E */\n primaryButton: {\n text: string\n link?: string\n }\n /** \u526F\u6309\u94AE\u914D\u7F6E */\n secondaryButton: {\n text: string\n link?: string\n }\n /** \u5F62\u72B6 */\n shape?: Shape\n /** \u4E3B\u9898 */\n theme?: Theme\n }\n /** \u81EA\u5B9A\u4E49\u7C7B\u540D */\n className?: string\n}\n"],
|
|
4
|
+
"sourcesContent": ["import type { ComponentCommonProps, Media, Shape, Theme } from '../../types/props.js'\n\nexport interface MemberEquityProps extends ComponentCommonProps {\n data: {\n /** \u6807\u9898 */\n title: string\n /** \u63CF\u8FF0\u6587\u672C */\n description: string\n /** \u80CC\u666F\u56FE\u7247/\u89C6\u9891 URL */\n backgroundImage?: Media\n mobileBackgroundImage?: Media\n /** \u4E3B\u6309\u94AE\u914D\u7F6E */\n primaryButton: {\n text: string\n link?: string\n }\n primaryButtonHandler?: () => void\n /** \u526F\u6309\u94AE\u914D\u7F6E */\n secondaryButton: {\n text: string\n link?: string\n }\n secondaryButtonHandler?: () => void\n /** \u5F62\u72B6 */\n shape?: Shape\n /** \u4E3B\u9898 */\n theme?: Theme\n }\n /** \u81EA\u5B9A\u4E49\u7C7B\u540D */\n className?: string\n}\n"],
|
|
5
5
|
"mappings": "+WAAA,IAAAA,EAAA,kBAAAC,EAAAD",
|
|
6
6
|
"names": ["types_exports", "__toCommonJS"]
|
|
7
7
|
}
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
"use strict";var L=Object.create;var N=Object.defineProperty;var S=Object.getOwnPropertyDescriptor;var P=Object.getOwnPropertyNames;var R=Object.getPrototypeOf,z=Object.prototype.hasOwnProperty;var q=(l,o)=>{for(var s in o)N(l,s,{get:o[s],enumerable:!0})},v=(l,o,s,m)=>{if(o&&typeof o=="object"||typeof o=="function")for(let r of P(o))!z.call(l,r)&&r!==s&&N(l,r,{get:()=>o[r],enumerable:!(m=S(o,r))||m.enumerable});return l};var g=(l,o,s)=>(s=l!=null?L(R(l)):{},v(o||!l||!l.__esModule?N(s,"default",{value:l,enumerable:!0}):s,l)),E=l=>v(N({},"__esModule",{value:!0}),l);var D={};q(D,{default:()=>Q});module.exports=E(D);var e=require("react/jsx-runtime"),x=g(require("react")),T=require("react-responsive"),w=require("../../shared/Styles.js"),I=g(require("../../components/picture.js")),C=g(require("../../components/button.js")),B=require("../../components/heading.js"),G=require("../../components/text.js"),p=require("../../components/carousel.js"),c=require("../../components/gird.js"),$=g(require("../Title/index.js")),M=require("../../helpers/utils.js"),u=require("../../components/tabs.js");const b=({item:l,shape:o="square",isTab:s=!1})=>{const[m,r]=(0,x.useState)(!1),d=(0,T.useMediaQuery)({query:"(max-width: 1024px)"});(0,x.useEffect)(()=>{r(d)},[d]);const{theme:n="light",title:k,description:f,imageUrl:h,primaryButton:t,secondaryButton:a}=l,i="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":n==="dark","h-[480px]":m&&!s,"h-[400px]":m&&s},"text-info-primary"),children:[(0,e.jsx)(I.default,{source:h?.url,className:"inset-0 h-full overflow-hidden",imgClassName:"h-full transition-all duration-300 group-hover:scale-105 object-cover",style:{aspectRatio:`${h?.width}/${h?.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)(B.Heading,{size:3,className:"item-title",html:k}),(0,e.jsx)(G.Text,{size:3,className:"item-description desktop:mt-1 text-text-2 lg-desktop:text-text-
|
|
1
|
+
"use strict";var L=Object.create;var N=Object.defineProperty;var S=Object.getOwnPropertyDescriptor;var P=Object.getOwnPropertyNames;var R=Object.getPrototypeOf,z=Object.prototype.hasOwnProperty;var q=(l,o)=>{for(var s in o)N(l,s,{get:o[s],enumerable:!0})},v=(l,o,s,m)=>{if(o&&typeof o=="object"||typeof o=="function")for(let r of P(o))!z.call(l,r)&&r!==s&&N(l,r,{get:()=>o[r],enumerable:!(m=S(o,r))||m.enumerable});return l};var g=(l,o,s)=>(s=l!=null?L(R(l)):{},v(o||!l||!l.__esModule?N(s,"default",{value:l,enumerable:!0}):s,l)),E=l=>v(N({},"__esModule",{value:!0}),l);var D={};q(D,{default:()=>Q});module.exports=E(D);var e=require("react/jsx-runtime"),x=g(require("react")),T=require("react-responsive"),w=require("../../shared/Styles.js"),I=g(require("../../components/picture.js")),C=g(require("../../components/button.js")),B=require("../../components/heading.js"),G=require("../../components/text.js"),p=require("../../components/carousel.js"),c=require("../../components/gird.js"),$=g(require("../Title/index.js")),M=require("../../helpers/utils.js"),u=require("../../components/tabs.js");const b=({item:l,shape:o="square",isTab:s=!1})=>{const[m,r]=(0,x.useState)(!1),d=(0,T.useMediaQuery)({query:"(max-width: 1024px)"});(0,x.useEffect)(()=>{r(d)},[d]);const{theme:n="light",title:k,description:f,imageUrl:h,primaryButton:t,secondaryButton:a}=l,i="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":n==="dark","h-[480px]":m&&!s,"h-[400px]":m&&s},"text-info-primary"),children:[(0,e.jsx)(I.default,{source:h?.url,className:"inset-0 h-full overflow-hidden",imgClassName:"h-full transition-all duration-300 group-hover:scale-105 object-cover",style:{aspectRatio:`${h?.width}/${h?.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)(B.Heading,{size:3,className:"item-title",html:k}),(0,e.jsx)(G.Text,{size:3,className:"item-description desktop:mt-1 text-text-2 lg-desktop:text-text-4",html:f})]}),(0,e.jsxs)("div",{className:"flex gap-[16px]",children:[a&&a.text&&(0,e.jsx)("a",{href:a.link,children:(0,e.jsx)(C.default,{className:i,variant:"secondary",children:a.text})}),t&&t.text&&(0,e.jsx)("a",{href:t.link,children:(0,e.jsx)(C.default,{className:i,variant:"primary",children:t.text})})]})]})]})},H=x.default.forwardRef((l,o)=>{const{shape:s,sectionTitle:m,groupByTab:r=!1,items:d=[],carousel:n}=l.data,k=t=>{switch(t){case"full":return 12;case"half":return 6;case"one-third":return 4}},f=d.map(t=>t.tabName).filter(Boolean).filter((t,a,i)=>i.indexOf(t)===a),h=f.map(t=>({tabName:t,items:d.filter(a=>a.tabName===t)})).reduce((t,a)=>(t[a.tabName]=a.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"}),r?(0,e.jsxs)(u.Tabs,{shape:s,align:"left",defaultValue:f[0],children:[(0,e.jsx)(u.TabsList,{children:f.map((t,a)=>(0,e.jsx)(u.TabsTrigger,{value:t,children:t},a))}),f.map((t,a)=>(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)(c.Grid,{className:"w-full",children:[h[t].map((i,y)=>(0,e.jsx)(c.GridItem,{span:k(i.width??"full"),className:"laptop:block hidden",children:(0,e.jsx)(b,{item:i,shape:s,isTab:r})},`${i?.title||""}${y}`)),(0,e.jsx)(c.GridItem,{className:"laptop:hidden block",span:12,children:(0,e.jsx)(p.Carousel,{className:"",children:(0,e.jsx)(p.CarouselContent,{className:"flex",children:h[t].map((i,y)=>(0,e.jsx)(p.CarouselItem,{className:"tablet:basis-2/5 laptop:basis-[32%] flex basis-4/5",children:(0,e.jsx)(b,{item:i,shape:s,isTab:r})},`${i?.title||""}${y}`))})})})]}),n&&n?.items.length>0?(0,e.jsx)(p.Carousel,{className:"laptop:mt-4 mt-3",children:(0,e.jsx)(p.CarouselContent,{className:"flex",children:n.items.map((i,y)=>(0,e.jsx)(p.CarouselItem,{className:"tablet:basis-2/5 laptop:basis-[32%] flex basis-4/5",children:(0,e.jsx)(b,{item:i,shape:s,isTab:r})},y))})}):null]})},a))]}):(0,e.jsxs)(e.Fragment,{children:[(0,e.jsxs)(c.Grid,{className:"w-full",children:[d.map((t,a)=>(0,e.jsx)(c.GridItem,{span:k(t.width??"full"),className:"laptop:block hidden",children:(0,e.jsx)(b,{item:t,shape:s})},`${t?.title||""}${a}`)),d.map((t,a)=>(0,e.jsx)(c.GridItem,{span:k("full"),className:"laptop:hidden block",children:(0,e.jsx)(b,{item:t,shape:s})},`${t?.title||""}${a}`))]}),n&&n?.items.length>0?(0,e.jsx)(p.Carousel,{className:"laptop:mt-4 mt-3",children:(0,e.jsx)(p.CarouselContent,{className:"flex",children:n.items.map((t,a)=>(0,e.jsx)(p.CarouselItem,{className:"tablet:basis-2/5 laptop:basis-[32%] flex basis-4/5",children:(0,e.jsx)(b,{item:t,shape:s})},`${t?.title||""}${a}`))})}):null]})]})});var Q=(0,w.withStyles)(H);
|
|
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, { useState, useEffect } 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, setIsMobile] = useState(false)\n const mediaQuery = useMediaQuery({ query: '(max-width: 1024px)' })\n\n useEffect(() => {\n setIsMobile(mediaQuery)\n }, [mediaQuery])\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\n size={3}\n className=\"item-description desktop:mt-1 text-text-2 lg-desktop:text-text-
|
|
4
|
+
"sourcesContent": ["import React, { useState, useEffect } 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, setIsMobile] = useState(false)\n const mediaQuery = useMediaQuery({ query: '(max-width: 1024px)' })\n\n useEffect(() => {\n setIsMobile(mediaQuery)\n }, [mediaQuery])\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\n size={3}\n className=\"item-description desktop:mt-1 text-text-2 lg-desktop:text-text-4\"\n html={description}\n />\n </div>\n <div className=\"flex gap-[16px]\">\n {secondaryButton && secondaryButton.text && (\n <a href={secondaryButton.link}>\n <Button className={lgButtonSize} variant=\"secondary\">\n {secondaryButton.text}\n </Button>\n </a>\n )}\n {primaryButton && primaryButton.text && (\n <a href={primaryButton.link}>\n <Button className={lgButtonSize} variant=\"primary\">\n {primaryButton.text}\n </Button>\n </a>\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
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", "setIsMobile", "mediaQuery", "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
|
}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export declare const isVideo: (mimeType?: string) => boolean;
|
|
@@ -0,0 +1,2 @@
|
|
|
1
|
+
"use strict";var e=Object.defineProperty;var d=Object.getOwnPropertyDescriptor;var n=Object.getOwnPropertyNames;var a=Object.prototype.hasOwnProperty;var c=(t,i)=>{for(var o in i)e(t,o,{get:i[o],enumerable:!0})},g=(t,i,o,r)=>{if(i&&typeof i=="object"||typeof i=="function")for(let s of n(i))!a.call(t,s)&&s!==o&&e(t,s,{get:()=>i[s],enumerable:!(r=d(i,s))||r.enumerable});return t};var h=t=>g(e({},"__esModule",{value:!0}),t);var v={};c(v,{isVideo:()=>p});module.exports=h(v);const p=(t="")=>t?.startsWith("video/");
|
|
2
|
+
//# sourceMappingURL=mimeType.js.map
|
|
@@ -0,0 +1,7 @@
|
|
|
1
|
+
{
|
|
2
|
+
"version": 3,
|
|
3
|
+
"sources": ["../../../src/shared/mimeType.ts"],
|
|
4
|
+
"sourcesContent": ["export const isVideo = (mimeType: string = '') => mimeType?.startsWith('video/')\n"],
|
|
5
|
+
"mappings": "yaAAA,IAAAA,EAAA,GAAAC,EAAAD,EAAA,aAAAE,IAAA,eAAAC,EAAAH,GAAO,MAAME,EAAU,CAACE,EAAmB,KAAOA,GAAU,WAAW,QAAQ",
|
|
6
|
+
"names": ["mimeType_exports", "__export", "isVideo", "__toCommonJS", "mimeType"]
|
|
7
|
+
}
|
|
@@ -1,10 +1,11 @@
|
|
|
1
|
-
"use client";import{jsx as e,jsxs as
|
|
2
|
-
aspect-[390/480] overflow-hidden`,
|
|
1
|
+
"use client";import{jsx as e,jsxs as i}from"react/jsx-runtime";import"react";import{Button as p,Heading as k,Picture as r,Text as h}from"../../components/index.js";import{withStyles as N}from"../../shared/Styles.js";import{cn as s}from"../../helpers/utils.js";import{isVideo as n}from"../../shared/mimeType.js";const B=({data:c,className:m=""})=>{const{title:d,description:u,backgroundImage:t,mobileBackgroundImage:a,primaryButton:o,secondaryButton:l,theme:b,shape:y,primaryButtonHandler:g,secondaryButtonHandler:f}=c,v=()=>{g?.()},x=()=>{f?.()};return i("section",{"data-ui-component-id":"MemberEquity",className:s(`tablet:aspect-[740/480] laptop:aspect-[1664/485] text-info-primary relative
|
|
2
|
+
aspect-[390/480] overflow-hidden`,m,{"aiui-dark":b==="dark","rounded-box":y==="rounded"}),children:[n(t?.mimeType)?e("video",{autoPlay:!0,muted:!0,playsInline:!0,loop:!0,className:"tablet:block absolute inset-0 hidden size-full object-cover",children:e("source",{src:t?.url,type:"video/mp4"})}):e(r,{source:t?.url,alt:t?.alt,className:"tablet:block absolute inset-0 hidden size-full object-cover"}),n(a?.mimeType)?e("video",{autoPlay:!0,muted:!0,playsInline:!0,loop:!0,className:"tablet:hidden absolute inset-0 size-full object-cover",children:e("source",{src:a?.url,type:"video/mp4"})}):e(r,{source:a?.url,alt:a?.alt,className:"tablet:hidden absolute inset-0 size-full object-cover"}),e("div",{className:`
|
|
3
3
|
laptop:items-center
|
|
4
4
|
absolute
|
|
5
|
-
inset-0
|
|
6
|
-
|
|
5
|
+
inset-0
|
|
6
|
+
flex w-full items-end py-[16px]
|
|
7
|
+
`,children:i("div",{className:`
|
|
7
8
|
tablet:px-6 laptop:px-[76px] desktop:px-[111px] lg-desktop:px-[139px] tablet:gap-5 laptop:gap-6
|
|
8
|
-
desktop:gap-7 lg-desktop:gap-8 flex w-full flex-col gap-
|
|
9
|
-
`,children:[
|
|
9
|
+
desktop:gap-7 lg-desktop:gap-8 flex w-full flex-col gap-6 px-4
|
|
10
|
+
`,children:[i("div",{className:"tablet:gap-2 laptop:gap-3 desktop:gap-3 lg-desktop:gap-4 flex flex-col gap-2",children:[e(k,{as:"h2",size:3,className:"member-equity-title ",html:d}),e(h,{size:2,className:"member-equity-description",html:u})]}),i("div",{className:"tablet:gap-3 laptop:gap-4 desktop:gap-4 lg-desktop:gap-4 flex items-center gap-3",children:[l&&l.text&&e("a",{href:l.link,children:e(p,{variant:"secondary",onClick:x,className:s("member-equity-button-secondary"),children:l.text})}),o&&o.text&&e("a",{href:o.link,children:e(p,{variant:"primary",onClick:v,className:s("member-equity-button-primary"),children:o.text})})]})]})})]})};var E=N(B);export{E as default};
|
|
10
11
|
//# sourceMappingURL=index.js.map
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../../src/biz-components/MemberEquity/index.tsx"],
|
|
4
|
-
"sourcesContent": ["'use client'\nimport React from 'react'\nimport { Button, Heading, Text } from '../../components/index.js'\nimport { withStyles } from '../../shared/Styles.js'\nimport type { MemberEquityProps } from './types.js'\nimport { cn } from '../../helpers/utils.js'\n\nconst MemberEquity: React.FC<MemberEquityProps> = ({ data, className = '' }) => {\n const {
|
|
5
|
-
"mappings": "
|
|
6
|
-
"names": ["jsx", "jsxs", "Button", "Heading", "Text", "withStyles", "cn", "MemberEquity", "data", "className", "title", "description", "backgroundImage", "mobileBackgroundImage", "primaryButton", "secondaryButton", "theme", "shape", "handleButtonPrimaryClick", "handleButtonSecondaryClick", "MemberEquity_default"]
|
|
4
|
+
"sourcesContent": ["'use client'\nimport React from 'react'\nimport { Button, Heading, Picture, Text } from '../../components/index.js'\nimport { withStyles } from '../../shared/Styles.js'\nimport type { MemberEquityProps } from './types.js'\nimport { cn } from '../../helpers/utils.js'\nimport { isVideo } from '../../shared/mimeType.js'\n\nconst MemberEquity: React.FC<MemberEquityProps> = ({ data, className = '' }) => {\n const {\n title,\n description,\n backgroundImage,\n mobileBackgroundImage,\n primaryButton,\n secondaryButton,\n theme,\n shape,\n primaryButtonHandler,\n secondaryButtonHandler,\n } = data\n const handleButtonPrimaryClick = () => {\n // \u6267\u884C\u4E3B\u6309\u94AE\u7684\u70B9\u51FB\u4E8B\u4EF6\n primaryButtonHandler?.()\n }\n\n const handleButtonSecondaryClick = () => {\n // \u6267\u884C\u526F\u6309\u94AE\u7684\u70B9\u51FB\u4E8B\u4EF6\n secondaryButtonHandler?.()\n }\n\n return (\n <section\n data-ui-component-id=\"MemberEquity\"\n className={cn(\n `tablet:aspect-[740/480] laptop:aspect-[1664/485] text-info-primary relative\n aspect-[390/480] overflow-hidden`,\n className,\n {\n 'aiui-dark': theme === 'dark',\n 'rounded-box': shape === 'rounded',\n }\n )}\n >\n {isVideo(backgroundImage?.mimeType) ? (\n <video autoPlay muted playsInline loop className=\"tablet:block absolute inset-0 hidden size-full object-cover\">\n <source src={backgroundImage?.url} type=\"video/mp4\" />\n </video>\n ) : (\n <Picture\n source={backgroundImage?.url}\n alt={backgroundImage?.alt}\n className=\"tablet:block absolute inset-0 hidden size-full object-cover\"\n />\n )}\n {isVideo(mobileBackgroundImage?.mimeType) ? (\n <video autoPlay muted playsInline loop className=\"tablet:hidden absolute inset-0 size-full object-cover\">\n <source src={mobileBackgroundImage?.url} type=\"video/mp4\" />\n </video>\n ) : (\n <Picture\n source={mobileBackgroundImage?.url}\n alt={mobileBackgroundImage?.alt}\n className=\"tablet:hidden absolute inset-0 size-full object-cover\"\n />\n )}\n <div\n className={`\n laptop:items-center \n absolute\n inset-0\n flex w-full items-end py-[16px]\n `}\n >\n <div\n className={`\n tablet:px-6 laptop:px-[76px] desktop:px-[111px] lg-desktop:px-[139px] tablet:gap-5 laptop:gap-6\n desktop:gap-7 lg-desktop:gap-8 flex w-full flex-col gap-6 px-4\n `}\n >\n <div className=\"tablet:gap-2 laptop:gap-3 desktop:gap-3 lg-desktop:gap-4 flex flex-col gap-2\">\n <Heading as=\"h2\" size={3} className={`member-equity-title `} html={title} />\n <Text size={2} className={`member-equity-description`} html={description} />\n </div>\n {/* \u6309\u94AE\u7EC4 */}\n <div className=\"tablet:gap-3 laptop:gap-4 desktop:gap-4 lg-desktop:gap-4 flex items-center gap-3\">\n {secondaryButton && secondaryButton.text && (\n <a href={secondaryButton.link}>\n <Button\n variant=\"secondary\"\n onClick={handleButtonSecondaryClick}\n className={cn('member-equity-button-secondary')}\n >\n {secondaryButton.text}\n </Button>\n </a>\n )}\n {primaryButton && primaryButton.text && (\n <a href={primaryButton.link}>\n <Button\n variant=\"primary\"\n onClick={handleButtonPrimaryClick}\n className={cn('member-equity-button-primary')}\n >\n {primaryButton.text}\n </Button>\n </a>\n )}\n </div>\n </div>\n </div>\n </section>\n )\n}\n\nexport default withStyles(MemberEquity)\n"],
|
|
5
|
+
"mappings": "aA8CU,cAAAA,EAkCA,QAAAC,MAlCA,oBA7CV,MAAkB,QAClB,OAAS,UAAAC,EAAQ,WAAAC,EAAS,WAAAC,EAAS,QAAAC,MAAY,4BAC/C,OAAS,cAAAC,MAAkB,yBAE3B,OAAS,MAAAC,MAAU,yBACnB,OAAS,WAAAC,MAAe,2BAExB,MAAMC,EAA4C,CAAC,CAAE,KAAAC,EAAM,UAAAC,EAAY,EAAG,IAAM,CAC9E,KAAM,CACJ,MAAAC,EACA,YAAAC,EACA,gBAAAC,EACA,sBAAAC,EACA,cAAAC,EACA,gBAAAC,EACA,MAAAC,EACA,MAAAC,EACA,qBAAAC,EACA,uBAAAC,CACF,EAAIX,EACEY,EAA2B,IAAM,CAErCF,IAAuB,CACzB,EAEMG,EAA6B,IAAM,CAEvCF,IAAyB,CAC3B,EAEA,OACEpB,EAAC,WACC,uBAAqB,eACrB,UAAWM,EACT;AAAA,0CAEAI,EACA,CACE,YAAaO,IAAU,OACvB,cAAeC,IAAU,SAC3B,CACF,EAEC,UAAAX,EAAQM,GAAiB,QAAQ,EAChCd,EAAC,SAAM,SAAQ,GAAC,MAAK,GAAC,YAAW,GAAC,KAAI,GAAC,UAAU,8DAC/C,SAAAA,EAAC,UAAO,IAAKc,GAAiB,IAAK,KAAK,YAAY,EACtD,EAEAd,EAACI,EAAA,CACC,OAAQU,GAAiB,IACzB,IAAKA,GAAiB,IACtB,UAAU,8DACZ,EAEDN,EAAQO,GAAuB,QAAQ,EACtCf,EAAC,SAAM,SAAQ,GAAC,MAAK,GAAC,YAAW,GAAC,KAAI,GAAC,UAAU,wDAC/C,SAAAA,EAAC,UAAO,IAAKe,GAAuB,IAAK,KAAK,YAAY,EAC5D,EAEAf,EAACI,EAAA,CACC,OAAQW,GAAuB,IAC/B,IAAKA,GAAuB,IAC5B,UAAU,wDACZ,EAEFf,EAAC,OACC,UAAW;AAAA;AAAA;AAAA;AAAA;AAAA,QAOX,SAAAC,EAAC,OACC,UAAW;AAAA;AAAA;AAAA,UAKX,UAAAA,EAAC,OAAI,UAAU,+EACb,UAAAD,EAACG,EAAA,CAAQ,GAAG,KAAK,KAAM,EAAG,UAAW,uBAAwB,KAAMS,EAAO,EAC1EZ,EAACK,EAAA,CAAK,KAAM,EAAG,UAAW,4BAA6B,KAAMQ,EAAa,GAC5E,EAEAZ,EAAC,OAAI,UAAU,mFACZ,UAAAgB,GAAmBA,EAAgB,MAClCjB,EAAC,KAAE,KAAMiB,EAAgB,KACvB,SAAAjB,EAACE,EAAA,CACC,QAAQ,YACR,QAASqB,EACT,UAAWhB,EAAG,gCAAgC,EAE7C,SAAAU,EAAgB,KACnB,EACF,EAEDD,GAAiBA,EAAc,MAC9BhB,EAAC,KAAE,KAAMgB,EAAc,KACrB,SAAAhB,EAACE,EAAA,CACC,QAAQ,UACR,QAASoB,EACT,UAAWf,EAAG,8BAA8B,EAE3C,SAAAS,EAAc,KACjB,EACF,GAEJ,GACF,EACF,GACF,CAEJ,EAEA,IAAOQ,EAAQlB,EAAWG,CAAY",
|
|
6
|
+
"names": ["jsx", "jsxs", "Button", "Heading", "Picture", "Text", "withStyles", "cn", "isVideo", "MemberEquity", "data", "className", "title", "description", "backgroundImage", "mobileBackgroundImage", "primaryButton", "secondaryButton", "theme", "shape", "primaryButtonHandler", "secondaryButtonHandler", "handleButtonPrimaryClick", "handleButtonSecondaryClick", "MemberEquity_default"]
|
|
7
7
|
}
|
|
@@ -13,11 +13,13 @@ export interface MemberEquityProps extends ComponentCommonProps {
|
|
|
13
13
|
text: string;
|
|
14
14
|
link?: string;
|
|
15
15
|
};
|
|
16
|
+
primaryButtonHandler?: () => void;
|
|
16
17
|
/** 副按钮配置 */
|
|
17
18
|
secondaryButton: {
|
|
18
19
|
text: string;
|
|
19
20
|
link?: string;
|
|
20
21
|
};
|
|
22
|
+
secondaryButtonHandler?: () => void;
|
|
21
23
|
/** 形状 */
|
|
22
24
|
shape?: Shape;
|
|
23
25
|
/** 主题 */
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import{Fragment as v,jsx as t,jsxs as o}from"react/jsx-runtime";import T,{useState as w,useEffect as I}from"react";import{useMediaQuery as B}from"react-responsive";import{withStyles as G}from"../../shared/Styles.js";import $ from"../../components/picture.js";import g from"../../components/button.js";import{Heading as M}from"../../components/heading.js";import{Text as L}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 S from"../Title/index.js";import{cn as P}from"../../helpers/utils.js";import{Tabs as R,TabsList as z,TabsTrigger as q,TabsContent as E}from"../../components/tabs.js";const c=({item:b,shape:x="square",isTab:l=!1})=>{const[u,p]=w(!1),r=B({query:"(max-width: 1024px)"});I(()=>{p(r)},[r]);const{theme:i="light",title:d,description:m,imageUrl:n,primaryButton:e,secondaryButton:a}=b,s="lg-desktop:px-7 lg-desktop:pb-[14px] lg-desktop:pt-[15px] lg-desktop:text-[16px]";return o("div",{className:P("item-wrapper group relative box-border w-full overflow-hidden",{"rounded-2xl":x==="rounded","aiui-dark":i==="dark","h-[480px]":u&&!l,"h-[400px]":u&&l},"text-info-primary"),children:[t($,{source:n?.url,className:"inset-0 h-full overflow-hidden",imgClassName:"h-full transition-all duration-300 group-hover:scale-105 object-cover",style:{aspectRatio:`${n?.width}/${n?.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(M,{size:3,className:"item-title",html:d}),t(L,{size:3,className:"item-description desktop:mt-1 text-text-2 lg-desktop:text-text-
|
|
1
|
+
import{Fragment as v,jsx as t,jsxs as o}from"react/jsx-runtime";import T,{useState as w,useEffect as I}from"react";import{useMediaQuery as B}from"react-responsive";import{withStyles as G}from"../../shared/Styles.js";import $ from"../../components/picture.js";import g from"../../components/button.js";import{Heading as M}from"../../components/heading.js";import{Text as L}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 S from"../Title/index.js";import{cn as P}from"../../helpers/utils.js";import{Tabs as R,TabsList as z,TabsTrigger as q,TabsContent as E}from"../../components/tabs.js";const c=({item:b,shape:x="square",isTab:l=!1})=>{const[u,p]=w(!1),r=B({query:"(max-width: 1024px)"});I(()=>{p(r)},[r]);const{theme:i="light",title:d,description:m,imageUrl:n,primaryButton:e,secondaryButton:a}=b,s="lg-desktop:px-7 lg-desktop:pb-[14px] lg-desktop:pt-[15px] lg-desktop:text-[16px]";return o("div",{className:P("item-wrapper group relative box-border w-full overflow-hidden",{"rounded-2xl":x==="rounded","aiui-dark":i==="dark","h-[480px]":u&&!l,"h-[400px]":u&&l},"text-info-primary"),children:[t($,{source:n?.url,className:"inset-0 h-full overflow-hidden",imgClassName:"h-full transition-all duration-300 group-hover:scale-105 object-cover",style:{aspectRatio:`${n?.width}/${n?.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(M,{size:3,className:"item-title",html:d}),t(L,{size:3,className:"item-description desktop:mt-1 text-text-2 lg-desktop:text-text-4",html:m})]}),o("div",{className:"flex gap-[16px]",children:[a&&a.text&&t("a",{href:a.link,children:t(g,{className:s,variant:"secondary",children:a.text})}),e&&e.text&&t("a",{href:e.link,children:t(g,{className:s,variant:"primary",children:e.text})})]})]})]})},H=T.forwardRef((b,x)=>{const{shape:l,sectionTitle:u,groupByTab:p=!1,items:r=[],carousel:i}=b.data,d=e=>{switch(e){case"full":return 12;case"half":return 6;case"one-third":return 4}},m=r.map(e=>e.tabName).filter(Boolean).filter((e,a,s)=>s.indexOf(e)===a),n=m.map(e=>({tabName:e,items:r.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(S,{data:{title:u},className:"section-title"}),p?o(R,{shape:l,align:"left",defaultValue:m[0],children:[t(z,{children:m.map((e,a)=>t(q,{value:e,children:e},a))}),m.map((e,a)=>t(E,{value:e,className:"desktop:mt-[36px] mt-[24px] w-full",children:o(v,{children:[o(C,{className:"w-full",children:[n[e].map((s,f)=>t(h,{span:d(s.width??"full"),className:"laptop:block hidden",children:t(c,{item:s,shape:l,isTab:p})},`${s?.title||""}${f}`)),t(h,{className:"laptop:hidden block",span:12,children:t(k,{className:"",children:t(y,{className:"flex",children:n[e].map((s,f)=>t(N,{className:"tablet:basis-2/5 laptop:basis-[32%] flex basis-4/5",children:t(c,{item:s,shape:l,isTab:p})},`${s?.title||""}${f}`))})})})]}),i&&i?.items.length>0?t(k,{className:"laptop:mt-4 mt-3",children:t(y,{className:"flex",children:i.items.map((s,f)=>t(N,{className:"tablet:basis-2/5 laptop:basis-[32%] flex basis-4/5",children:t(c,{item:s,shape:l,isTab:p})},f))})}):null]})},a))]}):o(v,{children:[o(C,{className:"w-full",children:[r.map((e,a)=>t(h,{span:d(e.width??"full"),className:"laptop:block hidden",children:t(c,{item:e,shape:l})},`${e?.title||""}${a}`)),r.map((e,a)=>t(h,{span:d("full"),className:"laptop:hidden block",children:t(c,{item:e,shape:l})},`${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(c,{item:e,shape:l})},`${e?.title||""}${a}`))})}):null]})]})});var Y=G(H);export{Y 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, { useState, useEffect } 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, setIsMobile] = useState(false)\n const mediaQuery = useMediaQuery({ query: '(max-width: 1024px)' })\n\n useEffect(() => {\n setIsMobile(mediaQuery)\n }, [mediaQuery])\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\n size={3}\n className=\"item-description desktop:mt-1 text-text-2 lg-desktop:text-text-
|
|
4
|
+
"sourcesContent": ["import React, { useState, useEffect } 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, setIsMobile] = useState(false)\n const mediaQuery = useMediaQuery({ query: '(max-width: 1024px)' })\n\n useEffect(() => {\n setIsMobile(mediaQuery)\n }, [mediaQuery])\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\n size={3}\n className=\"item-description desktop:mt-1 text-text-2 lg-desktop:text-text-4\"\n html={description}\n />\n </div>\n <div className=\"flex gap-[16px]\">\n {secondaryButton && secondaryButton.text && (\n <a href={secondaryButton.link}>\n <Button className={lgButtonSize} variant=\"secondary\">\n {secondaryButton.text}\n </Button>\n </a>\n )}\n {primaryButton && primaryButton.text && (\n <a href={primaryButton.link}>\n <Button className={lgButtonSize} variant=\"primary\">\n {primaryButton.text}\n </Button>\n </a>\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
5
|
"mappings": "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",
|
|
6
6
|
"names": ["Fragment", "jsx", "jsxs", "React", "useState", "useEffect", "useMediaQuery", "withStyles", "Picture", "Button", "Heading", "Text", "Carousel", "CarouselContent", "CarouselItem", "Grid", "GridItem", "Title", "cn", "Tabs", "TabsList", "TabsTrigger", "TabsContent", "ItemBlock", "item", "shape", "isTab", "isMobile", "setIsMobile", "mediaQuery", "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
|
}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export declare const isVideo: (mimeType?: string) => boolean;
|
|
@@ -0,0 +1,7 @@
|
|
|
1
|
+
{
|
|
2
|
+
"version": 3,
|
|
3
|
+
"sources": ["../../../src/shared/mimeType.ts"],
|
|
4
|
+
"sourcesContent": ["export const isVideo = (mimeType: string = '') => mimeType?.startsWith('video/')\n"],
|
|
5
|
+
"mappings": "AAAO,MAAMA,EAAU,CAACC,EAAmB,KAAOA,GAAU,WAAW,QAAQ",
|
|
6
|
+
"names": ["isVideo", "mimeType"]
|
|
7
|
+
}
|