@anker-in/headless-ui 1.0.19 → 1.0.20-alpha.102201

package/dist/cjs/biz-components/Listing/types/product.d.ts

@@ -0,0 +1,141 @@
+import type { CurrencyCode, Image, Media, Product as ShopifyProduct, ProductVariant as ShopifyProductVariant } from './graphql';
+import { DiscountType } from '../const';
+export type ProductPrice = {
+    amount: number;
+    currencyCode: CurrencyCode;
+};
+export type ProductOption = {
+    __typename?: 'MultipleChoiceOption';
+    id: string;
+    name: string;
+    values: ProductOptionValues[];
+};
+export type ProductOptionValues = {
+    label: string;
+    hexColors?: string[];
+};
+export type ProductVariant = {
+    id: string | number;
+    options: ProductOption[];
+    sku: string;
+    metafields?: Record<string, any>;
+    price: ProductPrice;
+    product: Product;
+    coupons: VariantCoupon[];
+    weight?: number;
+    payload?: any;
+} & Omit<ShopifyProductVariant, 'options' | 'metafields' | 'price'>;
+export type Product = {
+    path?: string;
+    images: Image[];
+    media: ProductMedia[];
+    variants: ProductVariant[];
+    price: ProductPrice;
+    options: ProductOption[];
+    metafields?: {
+        [key: string]: any;
+    };
+    slug: string;
+    payload?: any;
+} & Omit<ShopifyProduct, 'metafields' | 'images' | 'variants' | 'price' | 'options' | 'media'>;
+export type GetProductBody = {
+    handles: string;
+    locale?: string;
+};
+export type ProductTypes = {
+    product: Product;
+    getBody: GetProductBody;
+};
+export type GetAllProductPathsOperation<T extends ProductTypes = ProductTypes> = {
+    data: {
+        products: Pick<T['product'], 'path'>[];
+    };
+    variables: {
+        first?: number;
+    };
+};
+export type GetAllProductsOperation<T extends ProductTypes = ProductTypes> = {
+    data: {
+        products: T['product'][];
+    };
+    variables: {
+        relevance?: 'featured' | 'best_selling' | 'newest';
+        ids?: string[];
+        first?: number;
+    };
+};
+export type GetProductOperation<T extends ProductTypes = ProductTypes> = {
+    data: {
+        product?: T['product'];
+    };
+    variables: {
+        path: string;
+        slug?: never;
+    } | {
+        path?: never;
+        slug: string;
+    };
+};
+export type Options = Record<string, string>;
+export type ProductMedia = Media & {
+    sources?: {
+        url: string;
+        altText: string;
+    }[];
+    image?: {
+        url: string;
+        altText: string;
+    };
+};
+export type VariantCoupon = {
+    title: string;
+    starts_at: string;
+    ends_at: string | null;
+    variant_shopify_id: number;
+    value_type: DiscountType;
+    value: string;
+    currency: string;
+    fixed_value: string;
+    value_style: string;
+    variant_price4wscode: number;
+    discount_type: string;
+    amazon_deal: boolean;
+    cdi_id: number;
+    cdi_updated_at: string;
+};
+export type ScriptDiscount = {
+    type: DiscountType;
+    excludeSkus: string[];
+    discount: number;
+};
+export type FreeGift = {
+    title: string;
+    note: string;
+    soldOutLabel: string;
+    freeLabel: string;
+    giftList: ProductVariant[];
+    count: number;
+    showCoupon: boolean;
+    [key: string]: any;
+};
+export type BundleListItem = {
+    id: string;
+    price: number;
+    comparePrice: number;
+    savings: number;
+    variants: {
+        price: number;
+        quantity: number;
+        label: string;
+        variant: ProductVariant;
+    }[];
+};
+export type Bundle = {
+    title: string;
+    soldOutLabel: string;
+    youSaveText: string;
+    showCoupon: boolean;
+    bundleList: BundleListItem[];
+    showAtListing: boolean;
+    [key: string]: any;
+};

package/dist/cjs/biz-components/Listing/types/product.js

@@ -0,0 +1,2 @@
+"use strict";var o=Object.defineProperty;var s=Object.getOwnPropertyDescriptor;var a=Object.getOwnPropertyNames;var u=Object.prototype.hasOwnProperty;var p=(e,t,n,i)=>{if(t&&typeof t=="object"||typeof t=="function")for(let r of a(t))!u.call(e,r)&&r!==n&&o(e,r,{get:()=>t[r],enumerable:!(i=s(t,r))||i.enumerable});return e};var d=e=>p(o({},"__esModule",{value:!0}),e);var c={};module.exports=d(c);var y=require("../const");
+//# sourceMappingURL=product.js.map

package/dist/cjs/biz-components/Listing/types/product.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../../../../src/biz-components/Listing/types/product.ts"],
+  "sourcesContent": ["import type {\n  CurrencyCode,\n  Image,\n  Media,\n  Product as ShopifyProduct,\n  ProductVariant as ShopifyProductVariant,\n} from './graphql'\nimport { DiscountType } from '../const'\n\nexport type ProductPrice = {\n  amount: number\n  currencyCode: CurrencyCode\n}\n\nexport type ProductOption = {\n  __typename?: 'MultipleChoiceOption'\n  id: string\n  name: string\n  values: ProductOptionValues[]\n}\n\nexport type ProductOptionValues = {\n  label: string\n  hexColors?: string[]\n}\n\nexport type ProductVariant = {\n  id: string | number\n  options: ProductOption[]\n  sku: string\n  metafields?: Record<string, any>\n  price: ProductPrice\n  product: Product\n  coupons: VariantCoupon[]\n  weight?: number\n  payload?: any\n} & Omit<ShopifyProductVariant, 'options' | 'metafields' | 'price'>\n\nexport type Product = {\n  path?: string\n  images: Image[]\n  media: ProductMedia[]\n  variants: ProductVariant[]\n  price: ProductPrice\n  options: ProductOption[]\n  metafields?: { [key: string]: any }\n  slug: string\n  payload?: any\n} & Omit<ShopifyProduct, 'metafields' | 'images' | 'variants' | 'price' | 'options' | 'media'>\n\nexport type GetProductBody = {\n  handles: string\n  locale?: string\n}\n\nexport type ProductTypes = {\n  product: Product\n  getBody: GetProductBody\n}\n\nexport type GetAllProductPathsOperation<T extends ProductTypes = ProductTypes> = {\n  data: { products: Pick<T['product'], 'path'>[] }\n  variables: { first?: number }\n}\n\nexport type GetAllProductsOperation<T extends ProductTypes = ProductTypes> = {\n  data: { products: T['product'][] }\n  variables: {\n    relevance?: 'featured' | 'best_selling' | 'newest'\n    ids?: string[]\n    first?: number\n  }\n}\n\nexport type GetProductOperation<T extends ProductTypes = ProductTypes> = {\n  data: { product?: T['product'] }\n  variables: { path: string; slug?: never } | { path?: never; slug: string }\n}\n\nexport type Options = Record<string, string>\n\nexport type ProductMedia = Media & {\n  sources?: {\n    url: string\n    altText: string\n  }[]\n  image?: {\n    url: string\n    altText: string\n  }\n}\n\nexport type VariantCoupon = {\n  title: string\n  starts_at: string // ISO 8601 \u65E5\u671F\u5B57\u7B26\u4E32\n  ends_at: string | null // ISO 8601 \u65E5\u671F\u5B57\u7B26\u4E32\u6216 null\n  variant_shopify_id: number\n  value_type: DiscountType\n  value: string // \u8D1F\u6570\u7684\u767E\u5206\u6BD4\u503C\n  currency: string\n  fixed_value: string // \u56FA\u5B9A\u503C\n  value_style: string // \u5E26\u6709\u8D27\u5E01\u7B26\u53F7\u7684\u503C\n  variant_price4wscode: number\n  discount_type: string // \u5047\u8BBE discount_type \u662F\u4E00\u4E2A\u5B57\u7B26\u4E32\n  amazon_deal: boolean\n  cdi_id: number\n  cdi_updated_at: string // ISO 8601 \u65E5\u671F\u5B57\u7B26\u4E32\n}\n\nexport type ScriptDiscount = {\n  type: DiscountType\n  excludeSkus: string[]\n  discount: number\n}\n\nexport type FreeGift = {\n  title: string\n  note: string\n  soldOutLabel: string\n  freeLabel: string\n  giftList: ProductVariant[]\n  count: number\n  showCoupon: boolean\n  [key: string]: any\n}\n\nexport type BundleListItem = {\n  id: string\n  price: number\n  comparePrice: number\n  savings: number\n  variants: {\n    price: number\n    quantity: number\n    label: string\n    variant: ProductVariant\n  }[]\n}\n\nexport type Bundle = {\n  title: string\n  soldOutLabel: string\n  youSaveText: string\n  showCoupon: boolean\n  bundleList: BundleListItem[]\n  showAtListing: boolean\n  [key: string]: any\n}"],
+  "mappings": "+WAAA,IAAAA,EAAA,kBAAAC,EAAAD,GAOA,IAAAE,EAA6B",
+  "names": ["product_exports", "__toCommonJS", "import_const"]
+}

package/dist/cjs/biz-components/Listing/types/productMetafields.d.js

@@ -0,0 +1,2 @@
+"use strict";var i=Object.defineProperty;var o=Object.getOwnPropertyDescriptor;var l=Object.getOwnPropertyNames;var a=Object.prototype.hasOwnProperty;var u=(t,e,r,n)=>{if(e&&typeof e=="object"||typeof e=="function")for(let s of l(e))!a.call(t,s)&&s!==r&&i(t,s,{get:()=>e[s],enumerable:!(n=o(e,s))||n.enumerable});return t};var p=t=>u(i({},"__esModule",{value:!0}),t);var b={};module.exports=p(b);var g=require("@projectTypes/product");
+//# sourceMappingURL=productMetafields.d.js.map

package/dist/cjs/biz-components/Listing/types/productMetafields.d.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../../../../src/biz-components/Listing/types/productMetafields.d.ts"],
+  "sourcesContent": ["import { DiscountType } from '@projectTypes/product'\n\n// \u6EE1\u8D60\nexport type VariantFreeGiftMetafields = {\n  count: number // \u6700\u591A\u9009\u62E9\u793C\u54C1\u6570\u91CF\uFF0C\u4E70\u4E00\u8D60X\n  showDiscounts: boolean\n  list: {\n    handle: string\n    sku: string\n  }[]\n  labels: string[]\n}\n\n// bundle\nexport type VariantBundleMetafields = {\n  list: {\n    handle: string\n    sku: string\n    price: number\n    qty: number\n    label: string\n  }[][]\n  title: string\n  discount_type: DiscountType\n  showDiscounts: boolean\n  labels: string[]\n}\n\n// \u6EE1\u51CF\\\u5C0Fb\u6298\u6263 metafields\nexport type VariantPriceDropMetafields = {\n  showDiscounts: boolean\n  discountType: DiscountType\n  rules: {\n    value: number\n  }[]\n  labels: string[]\n}\n"],
+  "mappings": "+WAAA,IAAAA,EAAA,kBAAAC,EAAAD,GAAA,IAAAE,EAA6B",
+  "names": ["productMetafields_d_exports", "__toCommonJS", "import_product"]
+}

package/dist/cjs/biz-components/Listing/types/type-helper.d.ts

@@ -0,0 +1,5 @@
+export type PartialRecord<K extends string | number | symbol, T> = Partial<Record<K, T>>;
+export type Optional<T, K extends keyof T> = Pick<Partial<T>, K> & Omit<T, K>;
+export type Replace<T, K extends keyof T, V> = Omit<T, K> & {
+    [P in K]: V;
+};

package/dist/cjs/biz-components/Listing/types/type-helper.js

@@ -0,0 +1,2 @@
+"use strict";var o=Object.defineProperty;var a=Object.getOwnPropertyDescriptor;var p=Object.getOwnPropertyNames;var K=Object.prototype.hasOwnProperty;var n=(t,e,T,i)=>{if(e&&typeof e=="object"||typeof e=="function")for(let r of p(e))!K.call(t,r)&&r!==T&&o(t,r,{get:()=>e[r],enumerable:!(i=a(e,r))||i.enumerable});return t};var l=t=>n(o({},"__esModule",{value:!0}),t);var x={};module.exports=l(x);
+//# sourceMappingURL=type-helper.js.map

package/dist/cjs/biz-components/Listing/types/type-helper.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../../../../src/biz-components/Listing/types/type-helper.ts"],
+  "sourcesContent": ["export type PartialRecord<K extends string | number | symbol, T> = Partial<Record<K, T>>\n\nexport type Optional<T, K extends keyof T> = Pick<Partial<T>, K> & Omit<T, K>\n\nexport type Replace<T, K extends keyof T, V> = Omit<T, K> & { [P in K]: V }\n"],
+  "mappings": "+WAAA,IAAAA,EAAA,kBAAAC,EAAAD",
+  "names": ["type_helper_exports", "__toCommonJS"]
+}

package/dist/cjs/biz-components/Listing/types.d.ts

@@ -0,0 +1,21 @@
+import type { Product } from './types/product';
+export type CompareProductItem = {
+    handle: string;
+    shortName: string;
+    compareProductCollection?: string;
+};
+export type CompareItem = {
+    product: Product;
+} & CompareProductItem;
+export type CompareData = {
+    data: {
+        availableCompareList: Array<CompareItem>;
+        currentProductCompareData?: CompareItem;
+        options: {
+            value: string;
+            text: string;
+        }[];
+        specificationKeys?: string[];
+    };
+    show: boolean;
+};

package/dist/cjs/biz-components/Listing/types.js

@@ -0,0 +1,2 @@
+"use strict";var a=Object.defineProperty;var m=Object.getOwnPropertyDescriptor;var i=Object.getOwnPropertyNames;var c=Object.prototype.hasOwnProperty;var s=(r,t,p,o)=>{if(t&&typeof t=="object"||typeof t=="function")for(let e of i(t))!c.call(r,e)&&e!==p&&a(r,e,{get:()=>t[e],enumerable:!(o=m(t,e))||o.enumerable});return r};var n=r=>s(a({},"__esModule",{value:!0}),r);var d={};module.exports=n(d);
+//# sourceMappingURL=types.js.map

package/dist/cjs/biz-components/Listing/types.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../../../src/biz-components/Listing/types.ts"],
+  "sourcesContent": ["import type { Product } from './types/product'\n\nexport type CompareProductItem = {\n  handle: string\n  shortName: string\n  compareProductCollection?: string\n}\n\nexport type CompareItem = { product: Product } & CompareProductItem\n\nexport type CompareData = {\n  data: {\n    availableCompareList: Array<CompareItem>\n    currentProductCompareData?: CompareItem\n    options: { value: string; text: string }[]\n    specificationKeys?: string[]\n  }\n  show: boolean\n}\n"],
+  "mappings": "+WAAA,IAAAA,EAAA,kBAAAC,EAAAD",
+  "names": ["types_exports", "__toCommonJS"]
+}

package/dist/cjs/biz-components/Listing/utils/helper.d.ts

@@ -0,0 +1,21 @@
+import type { Product, ProductMedia, ProductVariant } from '../types/product';
+export declare function isObjEmpty(obj?: Record<string, any>): boolean;
+export declare function atobID(id: string): string | undefined;
+export declare function btoaID(id: string, type?: 'ProductVariant' | 'Product'): string;
+export declare const getThemeLocale: (locale: string) => string;
+/**
+ * 生成 metafieldIdentifiers 查询参数
+ */
+export declare const getNormalCoupon: ({ variant }: {
+    variant?: ProductVariant;
+}) => import("../types/product").VariantCoupon | undefined;
+export declare function replaceUmlaut(str: string): string;
+export declare function handle(str: string): string;
+export declare function getVariantImageIndex({ mediaList, variant, }: {
+    variant: ProductVariant;
+    mediaList: ProductMedia[];
+}): null | number;
+export declare function getVariantMediaList({ product, variant }: {
+    variant: ProductVariant;
+    product: Product;
+}): ProductMedia[];

package/dist/cjs/biz-components/Listing/utils/helper.js

@@ -0,0 +1,2 @@
+"use strict";var u=Object.defineProperty;var d=Object.getOwnPropertyDescriptor;var p=Object.getOwnPropertyNames;var f=Object.prototype.hasOwnProperty;var l=(t,e)=>{for(var r in e)u(t,r,{get:e[r],enumerable:!0})},m=(t,e,r,a)=>{if(e&&typeof e=="object"||typeof e=="function")for(let n of p(e))!f.call(t,n)&&n!==r&&u(t,n,{get:()=>e[n],enumerable:!(a=d(e,n))||a.enumerable});return t};var g=t=>m(u({},"__esModule",{value:!0}),t);var b={};l(b,{atobID:()=>y,btoaID:()=>P,getNormalCoupon:()=>h,getThemeLocale:()=>V,getVariantImageIndex:()=>o,getVariantMediaList:()=>L,handle:()=>I,isObjEmpty:()=>x,replaceUmlaut:()=>s});module.exports=g(b);var c=require("../const");function x(t){return t?Object.keys(t).length===0:!0}function y(t){return t&&typeof t=="string"&&t.includes("/")?t.split("/").pop()?.split("?")?.shift():t}function P(t,e="ProductVariant"){return`gid://shopify/${e}/${t}`}const V=t=>t==="eu-de"?"de":t==="eu-en"?"eu":t==="au"?"au":t,h=({variant:t})=>t?.coupons?.find(e=>e.discount_type!==c.CouponChannel.WSCH),i={\u00DC:"U",\u00C4:"A",\u00D6:"O",\u00FC:"u",\u00E4:"a",\u00F6:"o",\u00DF:"ss",\u00E8:"e"};function s(t){return t.replace(/[\u00dc|\u00c4|\u00d6][a-z]/g,e=>{const r=i[e.slice(0,1)];return r.charAt(0)+r.charAt(1).toLowerCase()+e.slice(1)}).replace(new RegExp("["+Object.keys(i).join("|")+"]","g"),e=>i[e])}function I(t){return s(t).replace(/ /g,"-").replace(/[^a-zA-Z0-9-]/g,"").toLowerCase()}function o({mediaList:t,variant:e}){const r=e?.image?.url;return r?t.map(a=>a.image?.url).findIndex(a=>a==r):null}function L({product:t,variant:e}){const r=o({mediaList:t.media,variant:e});if(r!==null){const a=t.variants.filter(n=>e.id!==n.id).map(n=>o({mediaList:t.media,variant:n})).find(n=>n!==null&&n>r)||-1;return t.media.slice(r,a===-1?t.media.length:a)}else return t.media}
+//# sourceMappingURL=helper.js.map

package/dist/cjs/biz-components/Listing/utils/helper.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../../../../src/biz-components/Listing/utils/helper.ts"],
+  "sourcesContent": ["// \u6539\u7EC4\u4EF6\u5BA2\u6237\u7AEF\u6267\u884C\n// import { SchemaVariant } from '@projectTypes/template'\nimport type { Product, ProductMedia, ProductVariant } from '../types/product'\nimport { CouponChannel } from '../const'\n// import Cookies from 'js-cookie'\n// import { Attribute, HasMetafieldsIdentifier } from 'lib/shopify/gql'\n// import { HasMetafieldQueryRoot } from 'lib/shopify/types/fetcher'\n// import { useEffect, useState } from 'react'\n\n// import { PartialRecord } from './type-helper'\n\n// \u5224\u65AD\u5BF9\u8C61\u662F\u5426\u4E3A\u7A7A\nexport function isObjEmpty(obj?: Record<string, any>) {\n  if (!obj) return true\n  else {\n    return Object.keys(obj).length === 0\n  }\n}\n\nexport function atobID(id: string) {\n  if (id && typeof id === 'string' && id.includes('/')) {\n    return id.split('/').pop()?.split('?')?.shift()\n  } else {\n    return id\n  }\n}\n\nexport function btoaID(id: string, type: 'ProductVariant' | 'Product' = 'ProductVariant') {\n  return `gid://shopify/${type}/${id}`\n}\n\n// \u76AE\u80A4\u7AD9\u4E09\u7EA7\u57DF\u540D\nexport const getThemeLocale = (locale: string) => {\n  if (locale === 'eu-de') return 'de'\n  if (locale === 'eu-en') return 'eu'\n  if (locale === 'au') return 'au'\n  return locale\n}\n\n/**\n * \u751F\u6210 metafieldIdentifiers \u67E5\u8BE2\u53C2\u6570\n */\n// export function constructMetafieldIdentifiersQueryParams<T extends HasMetafieldQueryRoot>(\n//   metafieldIdentifiers: PartialRecord<T, HasMetafieldsIdentifier[]> = {},\n// ): PartialRecord<`${T}MetafieldIdentifiers`, HasMetafieldsIdentifier[]> {\n//   const identifiers = Object.entries(metafieldIdentifiers).reduce(\n//     (queryInput, [key, value]) => {\n//       const metafieldIdentifiers = value as HasMetafieldsIdentifier[]\n//       queryInput[`${key}MetafieldIdentifiers`] = metafieldIdentifiers\n//         .filter((item) => !item.namespace.startsWith(metafieldNamespacePrefix))\n//         .map((item) => ({\n//           namespace: `${metafieldNamespacePrefix}combo`,\n//           key: item.namespace,\n//         }))\n//         .concat(metafieldIdentifiers)\n//       return queryInput\n//     },\n//     {} as PartialRecord<`${T}MetafieldIdentifiers`, HasMetafieldsIdentifier[]>,\n//   )\n//   return identifiers\n// }\n\n// export function cleanShopKey(shop: Shop) {\n//   const { privacyPolicy, refundPolicy, shippingPolicy, termsOfService, subscriptionPolicy, ...otherShop } = shop\n//   return otherShop\n// }\n\n// export const delHtmlTag = (str?: string) => {\n//   return str ? String(str).replace(/<[^>]+>/g, '') : ''\n// }\n\nexport const getNormalCoupon = ({ variant }: { variant?: ProductVariant }) => {\n  return variant?.coupons?.find(coupon => coupon.discount_type !== CouponChannel.WSCH)\n}\n\n// export const setCartSecretCookie = ({ cart }) => {\n//   const key = cart.id.split('?key=')[1]\n//   const id = cart.id.split('?key=')[0].split('gid://shopify/Cart/')[1]\n//   Cookies.set(id, key, {\n//     Domain: window.location.hostname.split('.').reverse().slice(0, 2).reverse().join('.'),\n//   })\n// }\n\n// export const languageCode = (locale: string) =>\n//   ({\n//     us: 'US',\n//     uk: 'GB',\n//     ca: 'CA',\n//     fr: 'FR',\n//     au: 'AU',\n//     my: 'MY',\n//     vn: 'VN',\n//     it: 'IT',\n//     de: 'DE',\n//     cl: 'CL',\n//   })[locale] || 'US'\n\n// shopify \u7684\u7279\u6B8A\u6587\u4EF6\u8F6C\u6362\u89C4\u5219\nconst umlautMap = {\n  '\\u00dc': 'U',\n  '\\u00c4': 'A',\n  '\\u00d6': 'O',\n  '\\u00fc': 'u',\n  '\\u00e4': 'a',\n  '\\u00f6': 'o',\n  '\\u00df': 'ss',\n  '\\u00E8': 'e',\n}\n\n// \u66FF\u6362\u5B57\u7B26\u4E32\u4E2D\u7684\u7279\u6B8A\u5B57\u7B26\nexport function replaceUmlaut(str: string) {\n  return str\n    .replace(/[\\u00dc|\\u00c4|\\u00d6][a-z]/g, a => {\n      const big = umlautMap[a.slice(0, 1) as keyof typeof umlautMap]\n      return big.charAt(0) + big.charAt(1).toLowerCase() + a.slice(1)\n    })\n    .replace(new RegExp('[' + Object.keys(umlautMap).join('|') + ']', 'g'), a => umlautMap[a as keyof typeof umlautMap])\n}\n\n// \u5C06\u5B57\u7B26\u4E32\u8F6C\u6362\u4E3A slug\nexport function handle(str: string) {\n  return replaceUmlaut(str)\n    .replace(/ /g, '-')\n    .replace(/[^a-zA-Z0-9-]/g, '')\n    .toLowerCase()\n}\n\n// get variant image index\nexport function getVariantImageIndex({\n  mediaList,\n  variant,\n}: {\n  variant: ProductVariant\n  mediaList: ProductMedia[]\n}): null | number {\n  const src = variant?.image?.url\n  return src ? mediaList.map(media => media.image?.url).findIndex(imageSrc => imageSrc == src) : null\n}\n\n// get images belong to variant\nexport function getVariantMediaList({ product, variant }: { variant: ProductVariant; product: Product }) {\n  const currentVariantImageIndex = getVariantImageIndex({ mediaList: product.media, variant })\n\n  if (currentVariantImageIndex !== null) {\n    const nextVariantImageIndex =\n      product.variants\n        .filter(v => variant.id !== v.id)\n        .map(v => getVariantImageIndex({ mediaList: product.media, variant: v }))\n        .find(index => index !== null && index > currentVariantImageIndex) || -1\n\n    // current variant images, if no next variant found, return images from current index to the end\n    return product.media.slice(\n      currentVariantImageIndex,\n      nextVariantImageIndex === -1 ? product.media.length : nextVariantImageIndex\n    )\n  } else {\n    // if no variant image found, return all images\n    return product.media\n  }\n}\n\n// // \u901A\u8FC7\u9009\u62E9 option \u83B7\u53D6 variant\n// export function getVariantFromSelectedOptions({\n//   product,\n//   selectedOptions,\n// }: {\n//   product: Product\n//   selectedOptions: Record<string, string>\n// }) {\n//   return product.variants.find((variant) => {\n//     return Object.entries(selectedOptions).every(([key, value]) =>\n//       variant.options.find((option) => {\n//         if (option.__typename === 'MultipleChoiceOption' && option.name === key) {\n//           return option.values.find((v) => v.label === value)\n//         }\n//       }),\n//     )\n//   })\n// }\n\n// export const getURLParameter = (name, url = window.location.href) => {\n//   name = name.replace(/[\\[\\]]/g, '\\\\$&') // \u5C06\u65B9\u62EC\u53F7\u8F6C\u4E49\uFF0C\u4EE5\u4FBF\u5728\u6B63\u5219\u8868\u8FBE\u5F0F\u4E2D\u4F7F\u7528\n//   var regex = new RegExp('[?&]' + name + '(=([^&#]*)|&|#|$)') // \u521B\u5EFA\u5339\u914D\u53C2\u6570\u7684\u6B63\u5219\u8868\u8FBE\u5F0F\n//   var results = regex.exec(url) // \u5728URL\u4E2D\u67E5\u627E\u5339\u914D\u7684\u53C2\u6570\n//   if (!results) return null // \u5982\u679C\u6CA1\u6709\u627E\u5230\u5339\u914D\u7684\u53C2\u6570\uFF0C\u5219\u8FD4\u56DEnull\n//   if (!results[2]) return '' // \u5982\u679C\u53C2\u6570\u7684\u503C\u4E3A\u7A7A\uFF0C\u5219\u8FD4\u56DE\u7A7A\u5B57\u7B26\u4E32\n//   return decodeURIComponent(results[2]) // \u8FD4\u56DE\u89E3\u7801\u540E\u7684\u53C2\u6570\u503C\n// }\n\n// export const checkItemAvailableForProduct = ({\n//   product,\n//   item,\n//   variant,\n// }: {\n//   product: Product\n//   variant: ProductVariant\n//   item?: {\n//     includeTags?: string[]\n//     includeProducts?: SchemaVariant[]\n//     excludeProducts?: SchemaVariant[]\n//   }\n// }) => {\n//   if (item) {\n//     if (Number(item?.includeTags?.length) > 0) {\n//       return product.tags?.find((tag) => item?.includeTags?.includes(tag))\n//     } else if (Number(item?.includeProducts?.length) > 0) {\n//       return item.includeProducts?.find((p) => p?.variant?.handle === product.handle && p?.variant?.sku === variant.sku)\n//     } else if (Number(item?.excludeProducts?.length) > 0) {\n//       return !item.excludeProducts?.find(\n//         (p) => p?.variant?.handle === product.handle && p?.variant?.sku === variant.sku,\n//       )\n//     } else {\n//       return true\n//     }\n//   } else {\n//     return false\n//   }\n// }\n// export const getReferralAttributes = () => {\n//   const inviteCode = Cookies.get('invite_code')\n//   const playModeId = Cookies.get('playModeId')\n//   const popup = Cookies.get('_popup')\n//   if (inviteCode && playModeId) {\n//     return popup\n//       ? [\n//           { key: '_invite_code', value: inviteCode ? inviteCode : '' },\n//           { key: '_play_mode_id', value: playModeId ? playModeId : '' },\n//           { key: '_popup', value: popup },\n//         ]\n//       : [\n//           { key: '_invite_code', value: inviteCode ? inviteCode : '' },\n//           { key: '_play_mode_id', value: playModeId ? playModeId : '' },\n//         ]\n//   }\n//   return []\n// }\n\n// export function useH2Toc(htmlContent: string) {\n//   const [toc, setToc] = useState<{ updatedHtmlContent: string; dataList: { url: string; text: string }[] }>({\n//     updatedHtmlContent: htmlContent,\n//     dataList: [],\n//   })\n\n//   useEffect(() => {\n//     if (typeof window === 'undefined' || typeof document === 'undefined') return\n//     const div = document.createElement('div')\n//     div.innerHTML = htmlContent\n//     const h2s = div.querySelectorAll('h2')\n//     const dataList: { url: string; text: string }[] = []\n//     h2s.forEach((h2, idx) => {\n//       const text = (h2.textContent || '').trim()\n//       if (!text) return\n//       const id = encodeURIComponent(text).replace(/'/g, '&#39;')\n//       h2.setAttribute('id', id)\n//       dataList.push({ url: id, text })\n//     })\n//     setToc({ updatedHtmlContent: div.innerHTML, dataList })\n//   }, [htmlContent])\n\n//   return toc\n// }\n\n// export const isAttributesEqual = (oldAttributes: Attribute[], newAttributes: Attribute[]) => {\n//   // \u6BD4\u5BF9\u4E24\u4E2A\u6570\u636E\u662F\u5426\u5B8C\u5168\u76F8\u540C\n//   // \u68C0\u67E5\u6570\u7EC4\u957F\u5EA6\u662F\u5426\u76F8\u540C\n//   if (oldAttributes?.length !== newAttributes?.length) {\n//     return false\n//   }\n\n//   // \u5C06\u6570\u7EC4\u8F6C\u6362\u4E3A Map \u4EE5\u4FBF\u5FEB\u901F\u67E5\u627E\n//   const oldMap = new Map(oldAttributes.map((attr) => [attr.key, attr.value]))\n//   const newMap = new Map(newAttributes.map((attr) => [attr.key, attr.value]))\n\n//   // \u68C0\u67E5\u6240\u6709 key \u662F\u5426\u90FD\u5B58\u5728\u4E14\u503C\u76F8\u540C\n//   for (const [key, value] of newMap) {\n//     if (!oldMap.has(key) || oldMap.get(key) !== value) {\n//       return false\n//     }\n//   }\n\n//   return true\n// }\n\n// // \u68C0\u67E5\u8F93\u5165\u6846\u4E2D\u7684\u7279\u6B8A\u7B26\u53F7\n// export function validateSpecialCharacters(input: string): { isValid: boolean; invalidChars: string[] } {\n//   // \u5B9A\u4E49\u4E0D\u5141\u8BB8\u7684\u7279\u6B8A\u7B26\u53F7\n//   const invalidSpecialChars = /[!@#$%^&*()_+\\-=\\[\\]{};':\"\\\\|,.<>\\/?`~]/g\n\n//   const matches = input.match(invalidSpecialChars)\n//   const invalidChars = matches ? [...new Set(matches)] : []\n\n//   return {\n//     isValid: invalidChars.length === 0,\n//     invalidChars,\n//   }\n// }\n\n// // \u83B7\u53D6\u7279\u6B8A\u7B26\u53F7\u7684\u9519\u8BEF\u63D0\u793A\u4FE1\u606F\n// export function getSpecialCharErrorMessage(invalidChars: string[]): string {\n//   if (invalidChars.length === 0) return ''\n\n//   const uniqueChars = [...new Set(invalidChars)]\n//   if (uniqueChars.length === 1) {\n//     return `\u4E0D\u5141\u8BB8\u4F7F\u7528\u7279\u6B8A\u7B26\u53F7: ${uniqueChars[0]}`\n//   } else {\n//     return `\u4E0D\u5141\u8BB8\u4F7F\u7528\u4EE5\u4E0B\u7279\u6B8A\u7B26\u53F7: ${uniqueChars.join(', ')}`\n//   }\n// }"],
+  "mappings": "yaAAA,IAAAA,EAAA,GAAAC,EAAAD,EAAA,YAAAE,EAAA,WAAAC,EAAA,oBAAAC,EAAA,mBAAAC,EAAA,yBAAAC,EAAA,wBAAAC,EAAA,WAAAC,EAAA,eAAAC,EAAA,kBAAAC,IAAA,eAAAC,EAAAX,GAGA,IAAAY,EAA8B,oBASvB,SAASH,EAAWI,EAA2B,CACpD,OAAKA,EAEI,OAAO,KAAKA,CAAG,EAAE,SAAW,EAFpB,EAInB,CAEO,SAASX,EAAOY,EAAY,CACjC,OAAIA,GAAM,OAAOA,GAAO,UAAYA,EAAG,SAAS,GAAG,EAC1CA,EAAG,MAAM,GAAG,EAAE,IAAI,GAAG,MAAM,GAAG,GAAG,MAAM,EAEvCA,CAEX,CAEO,SAASX,EAAOW,EAAYC,EAAqC,iBAAkB,CACxF,MAAO,iBAAiBA,CAAI,IAAID,CAAE,EACpC,CAGO,MAAMT,EAAkBW,GACzBA,IAAW,QAAgB,KAC3BA,IAAW,QAAgB,KAC3BA,IAAW,KAAa,KACrBA,EAmCIZ,EAAkB,CAAC,CAAE,QAAAa,CAAQ,IACjCA,GAAS,SAAS,KAAKC,GAAUA,EAAO,gBAAkB,gBAAc,IAAI,EA0B/EC,EAAY,CAChB,OAAU,IACV,OAAU,IACV,OAAU,IACV,OAAU,IACV,OAAU,IACV,OAAU,IACV,OAAU,KACV,OAAU,GACZ,EAGO,SAAST,EAAcU,EAAa,CACzC,OAAOA,EACJ,QAAQ,+BAAgCC,GAAK,CAC5C,MAAMC,EAAMH,EAAUE,EAAE,MAAM,EAAG,CAAC,CAA2B,EAC7D,OAAOC,EAAI,OAAO,CAAC,EAAIA,EAAI,OAAO,CAAC,EAAE,YAAY,EAAID,EAAE,MAAM,CAAC,CAChE,CAAC,EACA,QAAQ,IAAI,OAAO,IAAM,OAAO,KAAKF,CAAS,EAAE,KAAK,GAAG,EAAI,IAAK,GAAG,EAAGE,GAAKF,EAAUE,CAA2B,CAAC,CACvH,CAGO,SAASb,EAAOY,EAAa,CAClC,OAAOV,EAAcU,CAAG,EACrB,QAAQ,KAAM,GAAG,EACjB,QAAQ,iBAAkB,EAAE,EAC5B,YAAY,CACjB,CAGO,SAASd,EAAqB,CACnC,UAAAiB,EACA,QAAAN,CACF,EAGkB,CAChB,MAAMO,EAAMP,GAAS,OAAO,IAC5B,OAAOO,EAAMD,EAAU,IAAIE,GAASA,EAAM,OAAO,GAAG,EAAE,UAAUC,GAAYA,GAAYF,CAAG,EAAI,IACjG,CAGO,SAASjB,EAAoB,CAAE,QAAAoB,EAAS,QAAAV,CAAQ,EAAkD,CACvG,MAAMW,EAA2BtB,EAAqB,CAAE,UAAWqB,EAAQ,MAAO,QAAAV,CAAQ,CAAC,EAE3F,GAAIW,IAA6B,KAAM,CACrC,MAAMC,EACJF,EAAQ,SACL,OAAOG,GAAKb,EAAQ,KAAOa,EAAE,EAAE,EAC/B,IAAIA,GAAKxB,EAAqB,CAAE,UAAWqB,EAAQ,MAAO,QAASG,CAAE,CAAC,CAAC,EACvE,KAAKC,GAASA,IAAU,MAAQA,EAAQH,CAAwB,GAAK,GAG1E,OAAOD,EAAQ,MAAM,MACnBC,EACAC,IAA0B,GAAKF,EAAQ,MAAM,OAASE,CACxD,CACF,KAEE,QAAOF,EAAQ,KAEnB",
+  "names": ["helper_exports", "__export", "atobID", "btoaID", "getNormalCoupon", "getThemeLocale", "getVariantImageIndex", "getVariantMediaList", "handle", "isObjEmpty", "replaceUmlaut", "__toCommonJS", "import_const", "obj", "id", "type", "locale", "variant", "coupon", "umlautMap", "str", "a", "big", "mediaList", "src", "media", "imageSrc", "product", "currentVariantImageIndex", "nextVariantImageIndex", "v", "index"]
+}

package/dist/cjs/biz-components/Listing/utils/index.d.ts

@@ -0,0 +1,37 @@
+import type { Options, Product, ProductOption, ProductVariant } from '../types/product';
+export declare function optionsConstructor(options: ProductOption[]): Options;
+/**
+ * Returns the first available variant of a product.
+ * If no variant is available, it returns the first variant in the list.
+ *
+ * @param product - The product object.
+ * @returns The first available variant of the product.
+ */
+export declare const getFirstAvailableVariant: (product: Product) => ProductVariant;
+export declare const getVariantBySku: (product: Product, sku: string) => ProductVariant | undefined;
+export declare const languageTerritory: (locale: string) => string;
+export declare function formatPrice({ amount, currencyCode, locale, maximumFractionDigits, minimumFractionDigits, removeTrailingZeros, }: {
+    amount: number;
+    currencyCode: string;
+    locale: string;
+    maximumFractionDigits?: number;
+    minimumFractionDigits?: number;
+    removeTrailingZeros?: boolean;
+}): string;
+export declare function formatVariantPrice({ amount, baseAmount, currencyCode, locale, maximumFractionDigits, minimumFractionDigits, removeTrailingZeros, }: {
+    baseAmount: number;
+    amount: number;
+    currencyCode: string;
+    locale: string;
+    maximumFractionDigits?: number;
+    minimumFractionDigits?: number;
+    removeTrailingZeros?: boolean;
+}): {
+    price: string;
+    basePrice: string | undefined;
+    discount: string | null;
+};
+export declare function getVariantFromSelectedOptions({ product, selectedOptions, }: {
+    product: Product;
+    selectedOptions: Record<string, string>;
+}): ProductVariant | undefined;

package/dist/cjs/biz-components/Listing/utils/index.js

@@ -0,0 +1,2 @@
+"use strict";var c=Object.defineProperty;var y=Object.getOwnPropertyDescriptor;var b=Object.getOwnPropertyNames;var P=Object.prototype.hasOwnProperty;var v=(r,e)=>{for(var n in e)c(r,n,{get:e[n],enumerable:!0})},O=(r,e,n,t)=>{if(e&&typeof e=="object"||typeof e=="function")for(let i of b(e))!P.call(r,i)&&i!==n&&c(r,i,{get:()=>e[i],enumerable:!(t=y(e,i))||t.enumerable});return r};var C=r=>O(c({},"__esModule",{value:!0}),r);var $={};v($,{formatPrice:()=>d,formatVariantPrice:()=>x,getFirstAvailableVariant:()=>S,getVariantBySku:()=>k,getVariantFromSelectedOptions:()=>V,languageTerritory:()=>f,optionsConstructor:()=>F});module.exports=C($);var u=require("../const");function F(r){return r.reduce((e,n)=>(e[n.name]=n.values[0].label,e),{})}const S=r=>r.variants.find(e=>e.availableForSale)||r.variants[0],k=(r,e)=>r.variants.find(n=>n.sku===e),f=r=>({us:"en-us",uk:"en-gb",ca:"en-ca",au:"en-au",eu:"en-eu",pl:"pl-pl",fr:"fr-fr",de:"de-de",vn:"vi-vn",sg:"en-sg","ae-en":"en-ae",plus:"en-us",cl:"es-cl",es:"es-es",se:"en-se",dk:"en-dk",is:"en-is",no:"en-no",fi:"en-fi"})[r]||"";function d({amount:r,currencyCode:e,locale:n,maximumFractionDigits:t,minimumFractionDigits:i,removeTrailingZeros:a=!1}){let o=new Intl.NumberFormat(f(n),{style:"currency",currency:e||"USD",minimumFractionDigits:t===0?0:i,maximumFractionDigits:t}).format(r);return["eu-de","eu-en","de","eu"].includes(n)&&(o=o?.toString()?.replace(/[\s]/g,"")),a&&(o=o.replace(/(\.\d*?[1-9])0+\b/,"$1").replace(/\.0+\b/,"").replace(/(\,\d*?[1-9])0+\b/,"$1").replace(/\,0+\b/,"")),o}function x({amount:r,baseAmount:e,currencyCode:n,locale:t,maximumFractionDigits:i,minimumFractionDigits:a,removeTrailingZeros:s}){if(typeof Intl>"u")return{price:`${u.PRICE_SYMBOL[t]}${r}`,basePrice:`${u.PRICE_SYMBOL[t]}${e}`,discount:`${u.PRICE_SYMBOL[t]}${e-r||0}`};const o=e>r,p=new Intl.NumberFormat(f(t),{style:"percent"}),m=o?p.format((e-r)/e):null,l=d({amount:r,currencyCode:n,locale:t,removeTrailingZeros:s}),g=o?d({amount:e,currencyCode:n,locale:t,maximumFractionDigits:i,minimumFractionDigits:a,removeTrailingZeros:s}):void 0;return{price:l,basePrice:g,discount:m}}function V({product:r,selectedOptions:e}){return r.variants.find(n=>Object.entries(e).every(([t,i])=>n.options.find(a=>{if(a.__typename==="MultipleChoiceOption"&&a.name===t)return a.values.find(s=>s.label===i)})))}
+//# sourceMappingURL=index.js.map

package/dist/cjs/biz-components/Listing/utils/index.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../../../../src/biz-components/Listing/utils/index.ts"],
+  "sourcesContent": ["import { PRICE_SYMBOL } from '../const'\nimport type { Options, Product, ProductOption, ProductVariant } from '../types/product'\n\nexport function optionsConstructor(options: ProductOption[]): Options {\n  return options.reduce((pre: any, cur: any) => {\n    pre[cur.name] = cur.values[0].label\n    return pre\n  }, {})\n}\n\n/**\n * Returns the first available variant of a product.\n * If no variant is available, it returns the first variant in the list.\n *\n * @param product - The product object.\n * @returns The first available variant of the product.\n */\nexport const getFirstAvailableVariant = (product: Product) =>\n  product.variants.find((variant: ProductVariant) => variant.availableForSale) || product.variants[0]\n\nexport const getVariantBySku = (product: Product, sku: string) =>\n  product.variants.find((variant: ProductVariant) => variant.sku === sku)\n\nexport const languageTerritory = (locale: string) =>\n  // https://unicode-org.github.io/cldr-staging/charts/37/supplemental/language_territory_information.html\n  ({\n    us: 'en-us',\n    uk: 'en-gb',\n    ca: 'en-ca',\n    au: 'en-au',\n    eu: 'en-eu',\n    pl: 'pl-pl',\n    fr: 'fr-fr',\n    de: 'de-de',\n    vn: 'vi-vn',\n    sg: 'en-sg',\n    'ae-en': 'en-ae',\n    plus: 'en-us',\n    cl: 'es-cl',\n    es: 'es-es',\n    // Nordic countries\n    se: 'en-se',\n    dk: 'en-dk',\n    is: 'en-is',\n    no: 'en-no',\n    fi: 'en-fi',\n  })[locale] || ''\n\nexport function formatPrice({\n  amount,\n  currencyCode,\n  locale,\n  maximumFractionDigits,\n  minimumFractionDigits,\n  removeTrailingZeros = false,\n}: {\n  amount: number\n  currencyCode: string\n  locale: string\n  maximumFractionDigits?: number\n  minimumFractionDigits?: number\n  removeTrailingZeros?: boolean\n}) {\n  const formatCurrency = new Intl.NumberFormat(languageTerritory(locale), {\n    style: 'currency',\n    currency: currencyCode || 'USD',\n    minimumFractionDigits: maximumFractionDigits === 0 ? 0 : minimumFractionDigits,\n    maximumFractionDigits,\n  })\n\n  let formattedValue = formatCurrency.format(amount)\n\n  if (['eu-de', 'eu-en', 'de', 'eu'].includes(locale)) {\n    formattedValue = formattedValue?.toString()?.replace(/[\\s]/g, '')\n  }\n\n  if (removeTrailingZeros) {\n    // Adjust the regex to match comma as decimal separator\n    formattedValue = formattedValue\n      .replace(/(\\.\\d*?[1-9])0+\\b/, '$1')\n      .replace(/\\.0+\\b/, '')\n      .replace(/(\\,\\d*?[1-9])0+\\b/, '$1')\n      .replace(/\\,0+\\b/, '')\n  }\n\n  return formattedValue\n}\n\nexport function formatVariantPrice({\n  amount,\n  baseAmount,\n  currencyCode,\n  locale,\n  maximumFractionDigits,\n  minimumFractionDigits,\n  removeTrailingZeros,\n}: {\n  baseAmount: number\n  amount: number\n  currencyCode: string\n  locale: string\n  maximumFractionDigits?: number\n  minimumFractionDigits?: number\n  removeTrailingZeros?: boolean\n}) {\n  if (typeof Intl === 'undefined') {\n    return {\n      price: `${PRICE_SYMBOL[locale as keyof typeof PRICE_SYMBOL]}${amount}`,\n      basePrice: `${PRICE_SYMBOL[locale as keyof typeof PRICE_SYMBOL]}${baseAmount}`,\n      discount: `${PRICE_SYMBOL[locale as keyof typeof PRICE_SYMBOL]}${baseAmount - amount || 0}`,\n    }\n  }\n\n  const hasDiscount = baseAmount > amount\n  const formatDiscount = new Intl.NumberFormat(languageTerritory(locale), {\n    style: 'percent',\n  })\n  const discount = hasDiscount ? formatDiscount.format((baseAmount - amount) / baseAmount) : null\n\n  const price = formatPrice({ amount, currencyCode, locale, removeTrailingZeros })\n  const basePrice = hasDiscount\n    ? formatPrice({\n        amount: baseAmount,\n        currencyCode,\n        locale,\n        maximumFractionDigits,\n        minimumFractionDigits,\n        removeTrailingZeros,\n      })\n    : undefined\n\n  return { price, basePrice, discount }\n}\n\nexport function getVariantFromSelectedOptions({\n  product,\n  selectedOptions,\n}: {\n  product: Product\n  selectedOptions: Record<string, string>\n}) {\n  return product.variants.find(variant => {\n    return Object.entries(selectedOptions).every(([key, value]) =>\n      variant.options.find(option => {\n        if (option.__typename === 'MultipleChoiceOption' && option.name === key) {\n          return option.values.find(v => v.label === value)\n        }\n      })\n    )\n  })\n}"],
+  "mappings": "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",
+  "names": ["utils_exports", "__export", "formatPrice", "formatVariantPrice", "getFirstAvailableVariant", "getVariantBySku", "getVariantFromSelectedOptions", "languageTerritory", "optionsConstructor", "__toCommonJS", "import_const", "options", "pre", "cur", "product", "variant", "sku", "locale", "amount", "currencyCode", "maximumFractionDigits", "minimumFractionDigits", "removeTrailingZeros", "formattedValue", "baseAmount", "hasDiscount", "formatDiscount", "discount", "price", "basePrice", "selectedOptions", "key", "value", "option", "v"]
+}

package/dist/cjs/biz-components/MediaPlayerMulti/YouTubePlayer.d.ts

@@ -0,0 +1,3 @@
+export declare function YouTubePlayer({ youTubeId }: {
+    youTubeId: string;
+}): import("react/jsx-runtime").JSX.Element;

package/dist/cjs/biz-components/MediaPlayerSticky/index.js

@@ -1,2 +1,2 @@
-"use strict";"use client";var ae=Object.create;var y=Object.defineProperty;var oe=Object.getOwnPropertyDescriptor;var ne=Object.getOwnPropertyNames;var ie=Object.getPrototypeOf,le=Object.prototype.hasOwnProperty;var ce=(s,t)=>{for(var r in t)y(s,r,{get:t[r],enumerable:!0})},S=(s,t,r,n)=>{if(t&&typeof t=="object"||typeof t=="function")for(let o of ne(t))!le.call(s,o)&&o!==r&&y(s,o,{get:()=>t[o],enumerable:!(n=oe(t,o))||n.enumerable});return s};var i=(s,t,r)=>(r=s!=null?ae(ie(s)):{},S(t||!s||!s.__esModule?y(r,"default",{value:s,enumerable:!0}):r,s)),de=s=>S(y({},"__esModule",{value:!0}),s);var fe={};ce(fe,{default:()=>ue});module.exports=de(fe);var e=require("react/jsx-runtime"),a=i(require("react")),L=require("es-toolkit"),P=require("react-intersection-observer"),m=require("../../helpers/utils.js"),C=require("../../shared/Styles.js"),$=i(require("../Slogan/index.js")),B=require("../VideoModal/YouTubePlayer.js"),c=require("../../components/gird.js"),Y=require("../../components/container.js"),q=i(require("../BrandEquity/index.js")),F=i(require("../MemberEquity/index.js")),I=i(require("../Spacer/index.js")),j=i(require("gsap")),x=require("@payloadcms/richtext-lexical/html"),N=require("react-responsive"),G=i(require("../../helpers/ScrollLoadVideo.js"));const T=({defaultConverters:s})=>({...s,text:t=>{const{node:r}=t;return r.$&&r.$.color?`<span class="lexical-${r.$.color}">${r.text}</span>`:r.text}}),h=({children:s,spaceY:t,className:r})=>{const n=(0,N.useMediaQuery)({query:"(max-width: 768px)"});return(0,e.jsx)(Y.Container,{spaceY:t,className:(0,m.cn)("!bg-transparent",r),children:(0,e.jsxs)(c.Grid,{children:[!n&&(0,e.jsx)(c.GridItem,{span:1}),(0,e.jsx)(c.GridItem,{span:n?12:10,children:s}),!n&&(0,e.jsx)(c.GridItem,{span:1})]})})},pe=a.default.forwardRef(({children:s,id:t,components:r})=>{const n=(0,a.useRef)(null);return(0,e.jsxs)("div",{ref:n,className:"relative z-10",children:[(0,e.jsx)(e.Fragment,{children:s}),(0,e.jsx)(e.Fragment,{children:r?.map(o=>{switch(o.blockType){case"ipc-brand-equity":return(0,e.jsx)("div",{className:"relative z-20 bg-transparent",children:(0,e.jsx)(h,{spaceY:"none",children:(0,e.jsx)(q.default,{data:o,style:o?.style})})});case"ipc-member-equity":return(0,e.jsx)("div",{className:"relative z-20 w-full bg-transparent",children:(0,e.jsx)(h,{spaceY:"none",children:(0,e.jsx)(F.default,{data:o,className:"w-full",style:o?.style})})});case"ipc-spacer":return(0,e.jsx)(I.default,{data:o,style:o?.style,className:"!bg-transparent"});default:return null}})})]})}),me=(0,a.forwardRef)(({className:s="",id:t,data:{title:r,videoTitle:n,mobVideo:o,mobImg:u,img:f,isYouTube:V,youtubePcId:k,youtubeMobileId:Q,video:v,theme:M,shape:O,components:W}})=>{const R=(0,a.useRef)(null),b=(0,a.useRef)(null),{ref:_,inView:d}=(0,P.useInView)(),[ye,A]=(0,a.useState)(0),[H,J]=(0,a.useState)(!1),[K,U]=(0,a.useState)(!1),X=(0,a.useRef)(null),Z=typeof r=="string"?r:r&&(0,x.convertLexicalToHTML)({data:r,converters:T});typeof n=="string"||n&&(0,x.convertLexicalToHTML)({data:n,converters:T});const[D,ee]=(0,a.useState)(0),[l,te]=(0,a.useState)(!1),z=(0,N.useMediaQuery)({query:"(max-width: 768px)"});(0,a.useEffect)(()=>{te(z)},[z]);const w=(0,L.debounce)(()=>{if(b.current){const g=b.current.getBoundingClientRect(),p=l?window.screen.height:window.innerHeight,re=window.scrollY||window.pageYOffset,se=g.bottom+re,E=document.documentElement.scrollHeight-se;ee(E>p?p:E),A(p)}},2e3);return(0,a.useEffect)(()=>{d&&!H&&(R.current?.play(),J(!0))},[d,H]),(0,a.useEffect)(()=>(w(),window.addEventListener("resize",w),()=>{window.removeEventListener("resize",w)}),[]),(0,a.useEffect)(()=>{function g(){const p=l?window.screen.height:window.innerHeight;j.default.timeline({scrollTrigger:{trigger:`#${t}`,start:"top top",end:`top+=${p*1.8}px bottom`,scrub:.2}}).from(`#${t} .media-content`,{top:"50%",transform:"translate(-50%, -50%)"}).to(`.${t} .sticky-cover`,{backdropFilter:"blur(8px)",duration:.4}).to(`#${t} .media-content`,{top:"100%",transform:"translate(-50%, -100%)",duration:1},"<")}d&&g()},[d]),(0,e.jsxs)(e.Fragment,{children:[(0,e.jsx)("div",{id:t,className:(0,m.cn)("relative z-20 h-screen w-full",s,{"aiui-dark":M==="dark","rounded-box":O==="rounded"}),ref:X,children:(0,e.jsx)("div",{ref:_,className:"media-content translate-z-0 absolute left-1/2 top-1/2 z-10 w-full -translate-x-1/2 -translate-y-1/2",children:(0,e.jsx)(h,{spaceY:"tablet:my-[32px] my-[24px] space-y-4",children:(0,e.jsx)($.default,{className:"sticky-title",data:{title:Z||"",theme:M}})})})}),(0,e.jsxs)("div",{ref:b,style:{marginBottom:`-${D}px`,zIndex:d?2:1},className:(0,m.cn)(t,"relative mt-[-200vh]"),children:[(0,e.jsx)("div",{className:"sticky top-0 ",children:(0,e.jsxs)("div",{className:(0,m.cn)("media-cover","relative h-screen w-full"),children:[V?(0,e.jsx)(B.YouTubePlayer,{youTubeId:l&&Q||k}):v?.url&&(0,e.jsx)(G.default,{videoRef:R,poster:l&&u?.url?u?.url:f?.url,src:l&&o?.url?o?.url:v?.url,className:"lg-desktop:aspect-w-[1920] lg-desktop:aspect-h-[930] lg:aspect-w-[1440] lg:aspect-h-[700] desktop:aspect-w-[1024] desktop:aspect-h-[520] tablet:aspect-w-[768] tablet:aspect-h-[660] aspect-w-[390] aspect-h-[660]",videoClassName:" object-cover object-[82%]",muted:!0,loop:!1,playsInline:!0,onEnded:()=>{U(!0)}}),f?.url&&(!v?.url||K)&&(0,e.jsx)("img",{src:l&&u?.url?u?.url:f?.url,alt:f?.alt,className:"z-1 absolute left-0 top-0 size-full object-cover  object-[82%]"}),(0,e.jsx)("div",{className:"sticky-cover absolute left-0 top-0 z-10 size-full",style:{backdropFilter:"blur(0px)",WebkitBackdropFilter:"blur(0px)"}})]})}),(0,e.jsx)("div",{className:"relative h-screen w-full"}),(0,e.jsx)(pe,{components:W}),(0,e.jsx)("div",{className:"relative h-screen w-full"})]})]})});var ue=(0,C.withLayout)(me);
+"use strict";"use client";var ae=Object.create;var y=Object.defineProperty;var oe=Object.getOwnPropertyDescriptor;var ne=Object.getOwnPropertyNames;var ie=Object.getPrototypeOf,le=Object.prototype.hasOwnProperty;var ce=(s,t)=>{for(var r in t)y(s,r,{get:t[r],enumerable:!0})},S=(s,t,r,n)=>{if(t&&typeof t=="object"||typeof t=="function")for(let o of ne(t))!le.call(s,o)&&o!==r&&y(s,o,{get:()=>t[o],enumerable:!(n=oe(t,o))||n.enumerable});return s};var i=(s,t,r)=>(r=s!=null?ae(ie(s)):{},S(t||!s||!s.__esModule?y(r,"default",{value:s,enumerable:!0}):r,s)),de=s=>S(y({},"__esModule",{value:!0}),s);var fe={};ce(fe,{default:()=>ue});module.exports=de(fe);var e=require("react/jsx-runtime"),a=i(require("react")),L=require("es-toolkit"),P=require("react-intersection-observer"),m=require("../../helpers/utils.js"),C=require("../../shared/Styles.js"),$=i(require("../Slogan/index.js")),B=require("../VideoModal/YouTubePlayer.js"),c=require("../../components/gird.js"),Y=require("../../components/container.js"),q=i(require("../BrandEquity/index.js")),F=i(require("../MemberEquity/index.js")),I=i(require("../Spacer/index.js")),j=i(require("gsap")),x=require("@payloadcms/richtext-lexical/html"),N=require("react-responsive"),G=i(require("../../helpers/ScrollLoadVideo.js"));const T=({defaultConverters:s})=>({...s,text:t=>{const{node:r}=t;return r.$&&r.$.color?`<span class="lexical-${r.$.color}">${r.text}</span>`:r.text}}),h=({children:s,spaceY:t,className:r})=>{const n=(0,N.useMediaQuery)({query:"(max-width: 768px)"});return(0,e.jsx)(Y.Container,{spaceY:t,className:(0,m.cn)("!bg-transparent",r),children:(0,e.jsxs)(c.Grid,{children:[!n&&(0,e.jsx)(c.GridItem,{span:1}),(0,e.jsx)(c.GridItem,{span:n?12:10,children:s}),!n&&(0,e.jsx)(c.GridItem,{span:1})]})})},pe=a.default.forwardRef(({children:s,id:t,components:r})=>{const n=(0,a.useRef)(null);return(0,e.jsxs)("div",{ref:n,className:"relative z-10",children:[(0,e.jsx)(e.Fragment,{children:s}),(0,e.jsx)(e.Fragment,{children:r?.map(o=>{switch(o.blockType){case"ipc-brand-equity":return(0,e.jsx)("div",{className:"relative z-20 bg-transparent",children:(0,e.jsx)(h,{spaceY:"none",children:(0,e.jsx)(q.default,{data:o,style:o?.style})})});case"ipc-member-equity":return(0,e.jsx)("div",{className:"relative z-20 w-full bg-transparent",children:(0,e.jsx)(h,{spaceY:"none",children:(0,e.jsx)(F.default,{data:o,className:"w-full",style:o?.style})})});case"ipc-spacer":return(0,e.jsx)(I.default,{data:o,style:o?.style,className:"!bg-transparent"});default:return null}})})]})}),me=(0,a.forwardRef)(({className:s="",id:t,data:{title:r,videoTitle:n,mobVideo:o,mobImg:u,img:f,isYouTube:V,youtubePcId:k,youtubeMobileId:Q,video:v,theme:M,shape:O,components:W}})=>{const R=(0,a.useRef)(null),b=(0,a.useRef)(null),{ref:_,inView:d}=(0,P.useInView)(),[ye,A]=(0,a.useState)(0),[H,J]=(0,a.useState)(!1),[K,U]=(0,a.useState)(!1),X=(0,a.useRef)(null),Z=typeof r=="string"?r:r&&(0,x.convertLexicalToHTML)({data:r,converters:T});typeof n=="string"||n&&(0,x.convertLexicalToHTML)({data:n,converters:T});const[D,ee]=(0,a.useState)(0),[l,te]=(0,a.useState)(!1),z=(0,N.useMediaQuery)({query:"(max-width: 768px)"});(0,a.useEffect)(()=>{te(z)},[z]);const w=(0,L.debounce)(()=>{if(b.current){const g=b.current.getBoundingClientRect(),p=l?window.screen.height:window.innerHeight,re=window.scrollY||window.pageYOffset,se=g.bottom+re,E=document.documentElement.scrollHeight-se;ee(E>p?p:E),A(p)}},2e3);return(0,a.useEffect)(()=>{d&&!H&&(R.current?.play(),J(!0))},[d,H]),(0,a.useEffect)(()=>(w(),window.addEventListener("resize",w),()=>{window.removeEventListener("resize",w)}),[]),(0,a.useEffect)(()=>{function g(){const p=l?window.screen.height:window.innerHeight;j.default.timeline({scrollTrigger:{trigger:`#${t}`,start:"top top",end:`top+=${p*1.8}px bottom`,scrub:.2}}).from(`#${t} .media-content`,{top:"50%",transform:"translate(-50%, -50%)"}).to(`.${t} .sticky-cover`,{backdropFilter:"blur(8px)",duration:.4}).to(`#${t} .media-content`,{top:"100%",transform:"translate(-50%, -100%)",duration:1},"<")}d&&g()},[d]),(0,e.jsxs)("div",{className:"overflow-hidden",children:[(0,e.jsx)("div",{id:t,className:(0,m.cn)("relative z-20 h-screen w-full",s,{"aiui-dark":M==="dark","rounded-box":O==="rounded"}),ref:X,children:(0,e.jsx)("div",{ref:_,className:"media-content translate-z-0 absolute left-1/2 top-1/2 z-10 w-full -translate-x-1/2 -translate-y-1/2",children:(0,e.jsx)(h,{spaceY:"tablet:my-[32px] my-[24px] space-y-4",children:(0,e.jsx)($.default,{className:"sticky-title",data:{title:Z||"",theme:M}})})})}),(0,e.jsxs)("div",{ref:b,style:{marginBottom:`-${D}px`,zIndex:d?2:1},className:(0,m.cn)(t,"relative mt-[-200vh]"),children:[(0,e.jsx)("div",{className:"sticky top-0 ",children:(0,e.jsxs)("div",{className:(0,m.cn)("media-cover","relative h-screen w-full"),children:[V?(0,e.jsx)(B.YouTubePlayer,{youTubeId:l&&Q||k}):v?.url&&(0,e.jsx)(G.default,{videoRef:R,poster:l&&u?.url?u?.url:f?.url,src:l&&o?.url?o?.url:v?.url,className:"lg-desktop:aspect-w-[1920] lg-desktop:aspect-h-[930] lg:aspect-w-[1440] lg:aspect-h-[700] desktop:aspect-w-[1024] desktop:aspect-h-[520] tablet:aspect-w-[768] tablet:aspect-h-[660] aspect-w-[390] aspect-h-[660]",videoClassName:" object-cover object-[82%]",muted:!0,loop:!1,playsInline:!0,onEnded:()=>{U(!0)}}),f?.url&&(!v?.url||K)&&(0,e.jsx)("img",{src:l&&u?.url?u?.url:f?.url,alt:f?.alt,className:"z-1 absolute left-0 top-0 size-full object-cover  object-[82%]"}),(0,e.jsx)("div",{className:"sticky-cover absolute left-0 top-0 z-10 size-full",style:{backdropFilter:"blur(0px)",WebkitBackdropFilter:"blur(0px)"}})]})}),(0,e.jsx)("div",{className:"relative h-screen w-full"}),(0,e.jsx)(pe,{components:W}),(0,e.jsx)("div",{className:"relative h-screen w-full"})]})]})});var ue=(0,C.withLayout)(me);
 //# sourceMappingURL=index.js.map

package/dist/cjs/biz-components/MediaPlayerSticky/index.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../../src/biz-components/MediaPlayerSticky/index.tsx"],
-  "sourcesContent": ["'use client'\nimport React, { useState, useRef, useEffect, forwardRef } from 'react'\nimport { debounce } from 'es-toolkit'\nimport { useInView } from 'react-intersection-observer'\nimport { cn } from '../../helpers/utils.js'\nimport { withLayout } from '../../shared/Styles.js'\nimport Slogan from '../Slogan/index.js'\nimport { YouTubePlayer } from '../VideoModal/YouTubePlayer.js'\nimport { Grid, GridItem } from '../../components/gird.js'\nimport { Container } from '../../components/container.js'\nimport BrandEquity from '../BrandEquity/index.js'\nimport MemberEquity from '../MemberEquity/index.js'\nimport Spacer from '../Spacer/index.js'\nimport gsap from 'gsap'\nimport { convertLexicalToHTML } from '@payloadcms/richtext-lexical/html'\n\nimport type { HTMLConvertersFunction } from '@payloadcms/richtext-lexical/html'\n\nimport { useMediaQuery } from 'react-responsive'\nimport type { MediaPlayerBaseProps, MediaPlayerComponent } from './types.js'\nimport ScrollLoadVideo from '../../helpers/ScrollLoadVideo.js'\n\nconst htmlConverters: HTMLConvertersFunction = ({ defaultConverters }) => ({\n  ...defaultConverters,\n  text: args => {\n    const { node } = args\n\n    // \u68C0\u67E5\u662F\u5426\u6709\u81EA\u5B9A\u4E49 color\n    if (node.$ && node.$.color) {\n      return `<span class=\"lexical-${node.$.color}\">${node.text}</span>`\n    }\n    return node.text\n  },\n})\n\nconst SubContainer = ({\n  children,\n  spaceY,\n  className,\n}: {\n  children: React.ReactNode\n  spaceY?: string\n  className?: string\n}) => {\n  const isMobile = useMediaQuery({ query: '(max-width: 768px)' })\n  return (\n    <Container spaceY={spaceY} className={cn('!bg-transparent', className)}>\n      <Grid>\n        {!isMobile && <GridItem span={1} />}\n        <GridItem span={isMobile ? 12 : 10}>{children}</GridItem>\n        {!isMobile && <GridItem span={1} />}\n      </Grid>\n    </Container>\n  )\n}\n\nconst SubBox = React.forwardRef<\n  {\n    mediaPlayerStickyRef: HTMLDivElement\n  },\n  {\n    children?: React.ReactNode\n    id?: string\n    components?: MediaPlayerComponent[]\n  }\n>(({ children, id, components }) => {\n  const mediaPlayerStickyRef = useRef<HTMLDivElement>(null)\n\n  return (\n    <div ref={mediaPlayerStickyRef} className=\"relative z-10\">\n      <>{children}</>\n      <>\n        {components?.map((componentData: any) => {\n          switch (componentData.blockType) {\n            case 'ipc-brand-equity': {\n              return (\n                <div className=\"relative z-20 bg-transparent\">\n                  <SubContainer spaceY=\"none\">\n                    <BrandEquity data={componentData} style={componentData?.style} />\n                  </SubContainer>\n                </div>\n              )\n            }\n            case 'ipc-member-equity': {\n              return (\n                <div className=\"relative z-20 w-full bg-transparent\">\n                  <SubContainer spaceY=\"none\">\n                    <MemberEquity data={componentData} className=\"w-full\" style={componentData?.style} />\n                  </SubContainer>\n                </div>\n              )\n            }\n            case 'ipc-spacer': {\n              return <Spacer data={componentData} style={componentData?.style} className=\"!bg-transparent\" />\n            }\n            default:\n              return null\n          }\n        })}\n      </>\n    </div>\n  )\n})\n\nconst MediaPlayerSticky = forwardRef<\n  {\n    mediaPlayerStickyRef: HTMLDivElement\n  },\n  MediaPlayerBaseProps\n>(\n  ({\n    className = '',\n    id,\n    data: {\n      title,\n      videoTitle,\n      mobVideo,\n      mobImg,\n      img,\n      isYouTube,\n      youtubePcId,\n      youtubeMobileId,\n      video,\n      theme,\n      shape,\n      components,\n    },\n  }) => {\n    const videoRef = useRef<HTMLVideoElement>(null)\n    const boxRef = useRef<HTMLDivElement>(null)\n    const { ref: inViewRef, inView } = useInView()\n    const [screenHeight, setScreenHeight] = useState(0)\n    const [isPlaying, setIsPlaying] = useState(false)\n    const [isEntered, setIsEntered] = useState(false)\n    const wrapperRef = useRef<HTMLDivElement>(null)\n\n    const title_html =\n      typeof title === 'string' ? title : title && convertLexicalToHTML({ data: title, converters: htmlConverters })\n    typeof videoTitle === 'string'\n      ? videoTitle\n      : videoTitle && convertLexicalToHTML({ data: videoTitle, converters: htmlConverters })\n\n    const [btb, setbtb] = useState(0)\n    const [isMobile, setIsMobile] = useState(false)\n    const mediaQuery = useMediaQuery({ query: '(max-width: 768px)' })\n\n    useEffect(() => {\n      setIsMobile(mediaQuery)\n    }, [mediaQuery])\n\n    const debouncedHandleResize = debounce(() => {\n      if (boxRef.current) {\n        const rect = boxRef.current.getBoundingClientRect()\n        const screenHeight = isMobile ? window.screen.height : window.innerHeight\n        const scrollTop = window.scrollY || window.pageYOffset\n        const elementBottomToPageTop = rect.bottom + scrollTop\n        const pageHeight = document.documentElement.scrollHeight\n        const distanceToPageBottom = pageHeight - elementBottomToPageTop\n        setbtb(distanceToPageBottom > screenHeight ? screenHeight : distanceToPageBottom)\n        setScreenHeight(screenHeight)\n      }\n    }, 2000)\n\n    useEffect(() => {\n      if (inView && !isPlaying) {\n        videoRef.current?.play()\n        setIsPlaying(true)\n      }\n    }, [inView, isPlaying])\n\n    useEffect(() => {\n      debouncedHandleResize()\n      window.addEventListener('resize', debouncedHandleResize)\n      return () => {\n        window.removeEventListener('resize', debouncedHandleResize)\n      }\n    }, [])\n\n    useEffect(() => {\n      function gsapResize() {\n        const height = isMobile ? window.screen.height : window.innerHeight\n        gsap\n          .timeline({\n            scrollTrigger: {\n              trigger: `#${id}`,\n              start: 'top top',\n              end: `top+=${height * 1.8}px bottom`,\n              scrub: 0.2,\n            },\n          })\n          .from(`#${id} .media-content`, { top: '50%', transform: 'translate(-50%, -50%)' })\n          .to(`.${id} .sticky-cover`, {\n            backdropFilter: 'blur(8px)',\n            duration: 0.4,\n          })\n          .to(\n            `#${id} .media-content`,\n            {\n              top: '100%',\n              transform: 'translate(-50%, -100%)',\n              duration: 1,\n            },\n            '<'\n          )\n      }\n      if (inView) {\n        gsapResize()\n      }\n    }, [inView])\n\n    return (\n      <>\n        <div\n          id={id}\n          className={cn('relative z-20 h-screen w-full', className, {\n            'aiui-dark': theme === 'dark',\n            'rounded-box': shape === 'rounded',\n          })}\n          ref={wrapperRef}\n        >\n          <div\n            ref={inViewRef}\n            className=\"media-content translate-z-0 absolute left-1/2 top-1/2 z-10 w-full -translate-x-1/2 -translate-y-1/2\"\n          >\n            <SubContainer spaceY=\"tablet:my-[32px] my-[24px] space-y-4\">\n              <Slogan className=\"sticky-title\" data={{ title: title_html || '', theme }} />\n            </SubContainer>\n          </div>\n        </div>\n\n        <div\n          ref={boxRef}\n          style={{ marginBottom: `-${btb}px`, zIndex: inView ? 2 : 1 }}\n          className={cn(id, 'relative mt-[-200vh]')}\n        >\n          <div className=\"sticky top-0 \">\n            <div className={cn('media-cover', 'relative h-screen w-full')}>\n              {isYouTube ? (\n                <YouTubePlayer youTubeId={isMobile ? youtubeMobileId || youtubePcId : youtubePcId} />\n              ) : (\n                video?.url && (\n                  <ScrollLoadVideo\n                    videoRef={videoRef}\n                    poster={isMobile && mobImg?.url ? mobImg?.url : img?.url}\n                    src={isMobile && mobVideo?.url ? mobVideo?.url : video?.url}\n                    className=\"lg-desktop:aspect-w-[1920] lg-desktop:aspect-h-[930] lg:aspect-w-[1440] lg:aspect-h-[700] desktop:aspect-w-[1024] desktop:aspect-h-[520] tablet:aspect-w-[768] tablet:aspect-h-[660] aspect-w-[390] aspect-h-[660]\"\n                    videoClassName=\" object-cover object-[82%]\"\n                    muted\n                    loop={false}\n                    playsInline\n                    onEnded={() => {\n                      setIsEntered(true)\n                    }}\n                  />\n                )\n              )}\n              {img?.url && (!video?.url || isEntered) && (\n                <img\n                  src={isMobile && mobImg?.url ? mobImg?.url : img?.url}\n                  alt={img?.alt}\n                  className=\"z-1 absolute left-0 top-0 size-full object-cover  object-[82%]\"\n                />\n              )}\n              <div\n                className=\"sticky-cover absolute left-0 top-0 z-10 size-full\"\n                style={{ backdropFilter: 'blur(0px)', WebkitBackdropFilter: 'blur(0px)' }}\n              />\n            </div>\n          </div>\n\n          <div className=\"relative h-screen w-full\" />\n          <SubBox components={components}></SubBox>\n          <div className=\"relative h-screen w-full\" />\n        </div>\n      </>\n    )\n  }\n)\n\nexport default withLayout(MediaPlayerSticky)\n"],
-  "mappings": "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",
+  "sourcesContent": ["'use client'\nimport React, { useState, useRef, useEffect, forwardRef } from 'react'\nimport { debounce } from 'es-toolkit'\nimport { useInView } from 'react-intersection-observer'\nimport { cn } from '../../helpers/utils.js'\nimport { withLayout } from '../../shared/Styles.js'\nimport Slogan from '../Slogan/index.js'\nimport { YouTubePlayer } from '../VideoModal/YouTubePlayer.js'\nimport { Grid, GridItem } from '../../components/gird.js'\nimport { Container } from '../../components/container.js'\nimport BrandEquity from '../BrandEquity/index.js'\nimport MemberEquity from '../MemberEquity/index.js'\nimport Spacer from '../Spacer/index.js'\nimport gsap from 'gsap'\nimport { convertLexicalToHTML } from '@payloadcms/richtext-lexical/html'\n\nimport type { HTMLConvertersFunction } from '@payloadcms/richtext-lexical/html'\n\nimport { useMediaQuery } from 'react-responsive'\nimport type { MediaPlayerBaseProps, MediaPlayerComponent } from './types.js'\nimport ScrollLoadVideo from '../../helpers/ScrollLoadVideo.js'\n\nconst htmlConverters: HTMLConvertersFunction = ({ defaultConverters }) => ({\n  ...defaultConverters,\n  text: args => {\n    const { node } = args\n\n    // \u68C0\u67E5\u662F\u5426\u6709\u81EA\u5B9A\u4E49 color\n    if (node.$ && node.$.color) {\n      return `<span class=\"lexical-${node.$.color}\">${node.text}</span>`\n    }\n    return node.text\n  },\n})\n\nconst SubContainer = ({\n  children,\n  spaceY,\n  className,\n}: {\n  children: React.ReactNode\n  spaceY?: string\n  className?: string\n}) => {\n  const isMobile = useMediaQuery({ query: '(max-width: 768px)' })\n  return (\n    <Container spaceY={spaceY} className={cn('!bg-transparent', className)}>\n      <Grid>\n        {!isMobile && <GridItem span={1} />}\n        <GridItem span={isMobile ? 12 : 10}>{children}</GridItem>\n        {!isMobile && <GridItem span={1} />}\n      </Grid>\n    </Container>\n  )\n}\n\nconst SubBox = React.forwardRef<\n  {\n    mediaPlayerStickyRef: HTMLDivElement\n  },\n  {\n    children?: React.ReactNode\n    id?: string\n    components?: MediaPlayerComponent[]\n  }\n>(({ children, id, components }) => {\n  const mediaPlayerStickyRef = useRef<HTMLDivElement>(null)\n\n  return (\n    <div ref={mediaPlayerStickyRef} className=\"relative z-10\">\n      <>{children}</>\n      <>\n        {components?.map((componentData: any) => {\n          switch (componentData.blockType) {\n            case 'ipc-brand-equity': {\n              return (\n                <div className=\"relative z-20 bg-transparent\">\n                  <SubContainer spaceY=\"none\">\n                    <BrandEquity data={componentData} style={componentData?.style} />\n                  </SubContainer>\n                </div>\n              )\n            }\n            case 'ipc-member-equity': {\n              return (\n                <div className=\"relative z-20 w-full bg-transparent\">\n                  <SubContainer spaceY=\"none\">\n                    <MemberEquity data={componentData} className=\"w-full\" style={componentData?.style} />\n                  </SubContainer>\n                </div>\n              )\n            }\n            case 'ipc-spacer': {\n              return <Spacer data={componentData} style={componentData?.style} className=\"!bg-transparent\" />\n            }\n            default:\n              return null\n          }\n        })}\n      </>\n    </div>\n  )\n})\n\nconst MediaPlayerSticky = forwardRef<\n  {\n    mediaPlayerStickyRef: HTMLDivElement\n  },\n  MediaPlayerBaseProps\n>(\n  ({\n    className = '',\n    id,\n    data: {\n      title,\n      videoTitle,\n      mobVideo,\n      mobImg,\n      img,\n      isYouTube,\n      youtubePcId,\n      youtubeMobileId,\n      video,\n      theme,\n      shape,\n      components,\n    },\n  }) => {\n    const videoRef = useRef<HTMLVideoElement>(null)\n    const boxRef = useRef<HTMLDivElement>(null)\n    const { ref: inViewRef, inView } = useInView()\n    const [screenHeight, setScreenHeight] = useState(0)\n    const [isPlaying, setIsPlaying] = useState(false)\n    const [isEntered, setIsEntered] = useState(false)\n    const wrapperRef = useRef<HTMLDivElement>(null)\n\n    const title_html =\n      typeof title === 'string' ? title : title && convertLexicalToHTML({ data: title, converters: htmlConverters })\n    typeof videoTitle === 'string'\n      ? videoTitle\n      : videoTitle && convertLexicalToHTML({ data: videoTitle, converters: htmlConverters })\n\n    const [btb, setbtb] = useState(0)\n    const [isMobile, setIsMobile] = useState(false)\n    const mediaQuery = useMediaQuery({ query: '(max-width: 768px)' })\n\n    useEffect(() => {\n      setIsMobile(mediaQuery)\n    }, [mediaQuery])\n\n    const debouncedHandleResize = debounce(() => {\n      if (boxRef.current) {\n        const rect = boxRef.current.getBoundingClientRect()\n        const screenHeight = isMobile ? window.screen.height : window.innerHeight\n        const scrollTop = window.scrollY || window.pageYOffset\n        const elementBottomToPageTop = rect.bottom + scrollTop\n        const pageHeight = document.documentElement.scrollHeight\n        const distanceToPageBottom = pageHeight - elementBottomToPageTop\n        setbtb(distanceToPageBottom > screenHeight ? screenHeight : distanceToPageBottom)\n        setScreenHeight(screenHeight)\n      }\n    }, 2000)\n\n    useEffect(() => {\n      if (inView && !isPlaying) {\n        videoRef.current?.play()\n        setIsPlaying(true)\n      }\n    }, [inView, isPlaying])\n\n    useEffect(() => {\n      debouncedHandleResize()\n      window.addEventListener('resize', debouncedHandleResize)\n      return () => {\n        window.removeEventListener('resize', debouncedHandleResize)\n      }\n    }, [])\n\n    useEffect(() => {\n      function gsapResize() {\n        const height = isMobile ? window.screen.height : window.innerHeight\n        gsap\n          .timeline({\n            scrollTrigger: {\n              trigger: `#${id}`,\n              start: 'top top',\n              end: `top+=${height * 1.8}px bottom`,\n              scrub: 0.2,\n            },\n          })\n          .from(`#${id} .media-content`, { top: '50%', transform: 'translate(-50%, -50%)' })\n          .to(`.${id} .sticky-cover`, {\n            backdropFilter: 'blur(8px)',\n            duration: 0.4,\n          })\n          .to(\n            `#${id} .media-content`,\n            {\n              top: '100%',\n              transform: 'translate(-50%, -100%)',\n              duration: 1,\n            },\n            '<'\n          )\n      }\n      if (inView) {\n        gsapResize()\n      }\n    }, [inView])\n\n    return (\n      <div className=\"overflow-hidden\">\n        <div\n          id={id}\n          className={cn('relative z-20 h-screen w-full', className, {\n            'aiui-dark': theme === 'dark',\n            'rounded-box': shape === 'rounded',\n          })}\n          ref={wrapperRef}\n        >\n          <div\n            ref={inViewRef}\n            className=\"media-content translate-z-0 absolute left-1/2 top-1/2 z-10 w-full -translate-x-1/2 -translate-y-1/2\"\n          >\n            <SubContainer spaceY=\"tablet:my-[32px] my-[24px] space-y-4\">\n              <Slogan className=\"sticky-title\" data={{ title: title_html || '', theme }} />\n            </SubContainer>\n          </div>\n        </div>\n\n        <div\n          ref={boxRef}\n          style={{ marginBottom: `-${btb}px`, zIndex: inView ? 2 : 1 }}\n          className={cn(id, 'relative mt-[-200vh]')}\n        >\n          <div className=\"sticky top-0 \">\n            <div className={cn('media-cover', 'relative h-screen w-full')}>\n              {isYouTube ? (\n                <YouTubePlayer youTubeId={isMobile ? youtubeMobileId || youtubePcId : youtubePcId} />\n              ) : (\n                video?.url && (\n                  <ScrollLoadVideo\n                    videoRef={videoRef}\n                    poster={isMobile && mobImg?.url ? mobImg?.url : img?.url}\n                    src={isMobile && mobVideo?.url ? mobVideo?.url : video?.url}\n                    className=\"lg-desktop:aspect-w-[1920] lg-desktop:aspect-h-[930] lg:aspect-w-[1440] lg:aspect-h-[700] desktop:aspect-w-[1024] desktop:aspect-h-[520] tablet:aspect-w-[768] tablet:aspect-h-[660] aspect-w-[390] aspect-h-[660]\"\n                    videoClassName=\" object-cover object-[82%]\"\n                    muted\n                    loop={false}\n                    playsInline\n                    onEnded={() => {\n                      setIsEntered(true)\n                    }}\n                  />\n                )\n              )}\n              {img?.url && (!video?.url || isEntered) && (\n                <img\n                  src={isMobile && mobImg?.url ? mobImg?.url : img?.url}\n                  alt={img?.alt}\n                  className=\"z-1 absolute left-0 top-0 size-full object-cover  object-[82%]\"\n                />\n              )}\n              <div\n                className=\"sticky-cover absolute left-0 top-0 z-10 size-full\"\n                style={{ backdropFilter: 'blur(0px)', WebkitBackdropFilter: 'blur(0px)' }}\n              />\n            </div>\n          </div>\n\n          <div className=\"relative h-screen w-full\" />\n          <SubBox components={components}></SubBox>\n          <div className=\"relative h-screen w-full\" />\n        </div>\n      </div>\n    )\n  }\n)\n\nexport default withLayout(MediaPlayerSticky)\n"],
+  "mappings": "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",
   "names": ["MediaPlayerSticky_exports", "__export", "MediaPlayerSticky_default", "__toCommonJS", "import_jsx_runtime", "import_react", "import_es_toolkit", "import_react_intersection_observer", "import_utils", "import_Styles", "import_Slogan", "import_YouTubePlayer", "import_gird", "import_container", "import_BrandEquity", "import_MemberEquity", "import_Spacer", "import_gsap", "import_html", "import_react_responsive", "import_ScrollLoadVideo", "htmlConverters", "defaultConverters", "args", "node", "SubContainer", "children", "spaceY", "className", "isMobile", "SubBox", "React", "id", "components", "mediaPlayerStickyRef", "componentData", "BrandEquity", "MemberEquity", "Spacer", "MediaPlayerSticky", "title", "videoTitle", "mobVideo", "mobImg", "img", "isYouTube", "youtubePcId", "youtubeMobileId", "video", "theme", "shape", "videoRef", "boxRef", "inViewRef", "inView", "screenHeight", "setScreenHeight", "isPlaying", "setIsPlaying", "isEntered", "setIsEntered", "wrapperRef", "title_html", "btb", "setbtb", "setIsMobile", "mediaQuery", "debouncedHandleResize", "rect", "scrollTop", "elementBottomToPageTop", "distanceToPageBottom", "gsapResize", "height", "gsap", "Slogan", "ScrollLoadVideo"]
 }

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

@@ -1,2 +1,2 @@
-"use strict";var A=Object.create;var N=Object.defineProperty;var O=Object.getOwnPropertyDescriptor;var Z=Object.getOwnPropertyNames;var F=Object.getPrototypeOf,J=Object.prototype.hasOwnProperty;var K=(s,l)=>{for(var o in l)N(s,o,{get:l[o],enumerable:!0})},U=(s,l,o,p)=>{if(l&&typeof l=="object"||typeof l=="function")for(let n of Z(l))!J.call(s,n)&&n!==o&&N(s,n,{get:()=>l[n],enumerable:!(p=O(l,n))||p.enumerable});return s};var T=(s,l,o)=>(o=s!=null?A(F(s)):{},U(l||!s||!s.__esModule?N(o,"default",{value:s,enumerable:!0}):o,s)),W=s=>U(N({},"__esModule",{value:!0}),s);var ee={};K(ee,{default:()=>X});module.exports=W(ee);var e=require("react/jsx-runtime"),c=T(require("react")),H=require("react-responsive"),j=require("../../shared/Styles.js"),C=T(require("../../components/picture.js")),_=T(require("../../components/button.js")),z=require("../../components/heading.js"),D=require("../VideoModal/index.js"),$=require("../../components/gird.js"),Q=T(require("../Title/index.js")),u=require("../../helpers/utils.js"),P=T(require("../SwiperBox/index.js")),S=require("../../shared/mimeType.js"),k=require("../../components/tabs.js"),Y=require("../../hooks/useExposure.js"),V=require("../../shared/trackUrlRef.js"),q=require("../../shared/track.js");const w="image",b="p1_banner",M=({data:s,configuration:l,jIndex:o,spanType:p,title:n})=>{const[y,f]=(0,c.useState)(!1),B=(0,H.useMediaQuery)({query:"(max-width: 768px)"}),x=(0,c.useRef)(null),L=()=>{if(p)switch(p){case"full":return"tablet:aspect-w-[704] tablet:aspect-h-[400] laptop:aspect-w-[896] laptop:aspect-h-[384] desktop:aspect-w-[1312] desktop:aspect-h-[512] lg-desktop:aspect-w-[1664] lg-desktop:aspect-h-[640]";case"half":return"tablet:aspect-w-[704] tablet:aspect-h-[480] laptop:aspect-w-[440] laptop:aspect-h-[384] desktop:aspect-w-[648] desktop:aspect-h-[512] lg-desktop:aspect-w-[824] lg-desktop:aspect-h-[640]";case"one-third":return"tablet:aspect-w-[296] tablet:aspect-h-[400] laptop:aspect-w-[288] laptop:aspect-h-[384] desktop:aspect-w-[427] desktop:aspect-h-[512] lg-desktop:aspect-w-[544] lg-desktop:aspect-h-[640]";default:return"tablet:aspect-w-[296] tablet:aspect-h-[400] laptop:aspect-w-[288] laptop:aspect-h-[384] desktop:aspect-w-[427] desktop:aspect-h-[512] lg-desktop:aspect-w-[544] lg-desktop:aspect-h-[640]"}else switch(l?.num){case 1:return"tablet:aspect-w-[704] tablet:aspect-h-[400] laptop:aspect-w-[896] laptop:aspect-h-[384] desktop:aspect-w-[1312] desktop:aspect-h-[512] lg-desktop:aspect-w-[1664] lg-desktop:aspect-h-[640]";case 2:return"tablet:aspect-w-[704] tablet:aspect-h-[480] laptop:aspect-w-[440] laptop:aspect-h-[384] desktop:aspect-w-[648] desktop:aspect-h-[512] lg-desktop:aspect-w-[824] lg-desktop:aspect-h-[640]";case 3:return"tablet:aspect-w-[296] tablet:aspect-h-[400] laptop:aspect-w-[288] laptop:aspect-h-[384] desktop:aspect-w-[427] desktop:aspect-h-[512] lg-desktop:aspect-w-[544] lg-desktop:aspect-h-[640]";default:return"tablet:aspect-w-[296] tablet:aspect-h-[400] laptop:aspect-w-[288] laptop:aspect-h-[384] desktop:aspect-w-[427] desktop:aspect-h-[512] lg-desktop:aspect-w-[544] lg-desktop:aspect-h-[640]"}};(0,Y.useExposure)(x,{componentType:w,componentName:b,position:o,componentTitle:s.title,componentDescription:s.description,navigation:l?.activeTab}),(0,c.useEffect)(()=>{f(B)},[B]);const{theme:I="light",title:m,description:h,imageUrl:r,primaryButton:d,secondaryButton:i,imageMobileUrl:g,blockLink:v,video:t,youtubeId:a,isYouTube:G}=s,R="lg-desktop:px-7 lg-desktop:pb-[14px] lg-desktop:pt-[15px] lg-desktop:text-[16px]";return(0,e.jsxs)("div",{className:(0,u.cn)("item-wrapper cursor-pointer","text-info-primary group relative box-border w-full overflow-hidden",L(),{"rounded-2xl":l?.shape==="rounded","aiui-dark":I==="dark","h-[400px]":y},"text-info-primary"),ref:x,children:[(v||i.link)&&(0,e.jsx)("a",{className:"absolute inset-0 z-10",href:(0,V.trackUrlRef)(v||i.link,`${w}_${b}`),"data-headless-type-name":`${w}#${b}`,"data-headless-title-desc-button":`${m}#${h}`,"data-headless-nav-postion":`${l?.activeTab}#${o}`,"aria-hidden":"true",tabIndex:-1}),(0,e.jsxs)("div",{className:"absolute inset-0",children:[(0,S.isVideo)(r?.mimeType)?(0,e.jsx)("video",{autoPlay:!0,muted:!0,playsInline:!0,loop:!0,className:"tablet:block hidden overflow-hidden w-full h-full object-cover",children:(0,e.jsx)("source",{src:r?.url,type:"video/mp4"})}):(0,e.jsx)(C.default,{source:r?.url,alt:r?.alt||"",className:"tablet:block hidden h-full overflow-hidden",imgClassName:"h-full transition-all duration-300 group-hover:scale-105 object-cover",style:{aspectRatio:`${r?.width}/${r?.height}`}}),(0,S.isVideo)(g?.mimeType)?(0,e.jsx)("video",{autoPlay:!0,muted:!0,playsInline:!0,loop:!0,className:"tablet:hidden block overflow-hidden w-full h-full object-cover",children:(0,e.jsx)("source",{src:g?.url,type:"video/mp4"})}):(0,e.jsx)(C.default,{source:g?.url||r?.url,alt:g?.alt||r?.alt||"",className:"tablet:hidden block h-full overflow-hidden",imgClassName:"h-full transition-all duration-300 object-cover"}),(0,e.jsxs)("div",{className:(0,u.cn)("laptop:p-6 desktop:p-[32px] laptop:gap-4 desktop:gap-6 absolute inset-x-0 bottom-0 z-20 flex w-fit flex-col gap-6 p-4",{"laptop:top-1/2 laptop:-translate-y-1/2 laptop:bottom-auto":s?.width==="full"}),children:[(0,e.jsxs)("div",{className:"flex flex-col gap-1",children:[(0,e.jsx)(z.Heading,{size:3,as:"h3",className:"item-title",html:m}),(0,e.jsx)(z.Heading,{as:"h4",className:"item-description desktop:text-[16px] lg-desktop:text-[18px] line-clamp-1 text-[14px]",html:h})]}),(0,e.jsxs)("div",{className:"lg-desktop:gap-3 flex gap-2",children:[i&&i.text&&(0,e.jsxs)(_.default,{"aria-label":m??h,className:(0,u.cn)(R,"link-left"),variant:"secondary",as:"a",href:(0,V.trackUrlRef)(i.link,`${w}_${b}`),"data-headless-type-name":`${w}#${b}`,"data-headless-title-desc-button":`${m}#${h}#${i.text}`,"data-headless-nav-postion":`${l?.activeTab}#${o}`,children:[i.text,(0,e.jsx)("span",{className:"sr-only",children:m??h})]}),d&&d.text&&(0,e.jsx)(_.default,{"aria-label":m??h,className:(0,u.cn)(R,"link-right"),variant:"primary",as:"a",href:(0,V.trackUrlRef)(d.link,`${w}_${b}`),"data-headless-type-name":`${w}#${b}`,"data-headless-title-desc-button":`${m}#${h}#${d.text}`,"data-headless-nav-postion":`${l?.activeTab}#${o}`,children:d.text})]})]})]}),(0,e.jsx)("div",{children:(0,e.jsx)("div",{className:"laptop:bottom-6 laptop:right-6 absolute bottom-4 right-4 z-20",children:(t?.url||a)&&(0,e.jsx)("button",{onClick:()=>{l?.onVideoPlayBtnClick?.(t?.url||a,G)},className:"laptop:size-12 flex size-8 items-center justify-center rounded-full bg-white bg-opacity-20 hover:bg-black/75",children:(0,e.jsx)("svg",{width:"12",height:"14",viewBox:"0 0 12 14",fill:"none",xmlns:"http://www.w3.org/2000/svg",children:(0,e.jsx)("path",{d:"M12 7L0 14L0 0L12 7Z",fill:"white"})})})})})]})},E=c.default.forwardRef((s,l)=>{const{shape:o,sectionTitle:p,groupByTab:n=!1,items:y=[],carousel:f}=s.data,[B,x]=(0,c.useState)(!1),[L,I]=(0,c.useState)(""),[m,h]=(0,c.useState)(""),r=t=>{switch(t){case"full":return 12;case"half":return 6;case"one-third":return 4}},d=y.map(t=>t.tabName).filter(Boolean).filter((t,a,G)=>G.indexOf(t)===a),i=(t,a)=>{x(!0),a?h?.(t||""):I?.(t||"")},g=(t,a)=>{switch(t){case 1:return 1;case 2:return 2;default:return a?2.3:3}},v=d.map(t=>({tabName:t,items:y.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:l,className:(0,u.cn)("multiLayoutGraphicBlock","text-info-primary",s.className),children:[p&&(0,e.jsx)(Q.default,{data:{title:p},className:"section-title"}),n?(0,e.jsxs)(k.Tabs,{shape:o,align:"left",defaultValue:(0,u.spaceToHyphen)(d[0]),children:[(0,e.jsx)(k.TabsList,{children:d.map((t,a)=>(0,e.jsx)(k.TabsTrigger,{value:(0,u.spaceToHyphen)(t),onClick:()=>{(0,q.gaTrack)({event:"ga4Event",event_name:"component_click",event_parameters:{page_group:"Home Page",component_type:w,component_name:b,component_title:p,component_position:1,navigation:t,button_name:t}})},children:t},a))}),d.map((t,a)=>(0,e.jsx)(k.TabsContent,{value:(0,u.spaceToHyphen)(t),className:"desktop:mt-[36px] mt-[24px] w-full",children:(0,e.jsxs)(e.Fragment,{children:[(0,e.jsx)(P.default,{className:"!overflow-visible",id:"MultiLayoutGraphicBlock1",data:{list:v?.[t]||[],configuration:{shape:o,isTab:n,activeTab:t,title:p,num:v?.[t]?.length||0,onVideoPlayBtnClick:i}},Slide:M,breakpoints:{0:{spaceBetween:12,freeMode:!1,slidesPerView:1},374:{spaceBetween:12,freeMode:!1,slidesPerView:1.2},768:{spaceBetween:16,freeMode:!1,slidesPerView:g(v?.[t]?.length||0,!0)},1024:{spaceBetween:16,freeMode:!1,slidesPerView:g(v?.[t]?.length||0)}}}),f&&f?.items.length>0?(0,e.jsx)(P.default,{className:"!overflow-visible",id:"MultiLayoutGraphicBlock2",data:{list:f?.items||[],configuration:{shape:o,isTab:n,onVideoPlayBtnClick:i,title:p}},Slide:M,breakpoints:{0:{spaceBetween:12,freeMode:!1,slidesPerView:1},374:{spaceBetween:12,freeMode:!1,slidesPerView:1.2},768:{spaceBetween:16,freeMode:!1,slidesPerView:2.3},1024:{spaceBetween:16,freeMode:!1,slidesPerView:3.1},1440:{spaceBetween:16,freeMode:!1,slidesPerView:4}}}):null]})},a))]}):(0,e.jsxs)(e.Fragment,{children:[(0,e.jsxs)($.Grid,{className:"w-full",children:[y.map((t,a)=>(0,e.jsx)($.GridItem,{span:r(t.width??"full"),className:"laptop:block hidden",children:(0,e.jsx)(M,{data:t,configuration:{shape:o,onVideoPlayBtnClick:i,title:p},jIndex:a,spanType:t.width})},`${t?.title||""}${a}`)),y.map((t,a)=>(0,e.jsx)($.GridItem,{span:r("full"),className:"laptop:hidden block",children:(0,e.jsx)(M,{data:t,configuration:{shape:o,onVideoPlayBtnClick:i,title:p},jIndex:a,spanType:"full"})},`${t?.title||""}${a}`))]}),f&&f?.items.length>0?(0,e.jsx)(P.default,{className:"!overflow-visible",id:"MultiLayoutGraphicBlock3",data:{list:f?.items||[],configuration:{shape:o,onVideoPlayBtnClick:i,title:p}},Slide:M,breakpoints:{0:{spaceBetween:12,freeMode:!1,slidesPerView:1},374:{spaceBetween:12,freeMode:!1,slidesPerView:1.2},768:{spaceBetween:16,freeMode:!1,slidesPerView:2.3},1024:{spaceBetween:16,freeMode:!1,slidesPerView:3.1},1440:{spaceBetween:16,freeMode:!1,slidesPerView:4}}}):null]}),B&&(0,e.jsx)(D.VideoModal,{visible:B,youTubeId:m,videoUrl:L,onCloseModal:()=>x(!1)})]})});E.displayName="MultiLayoutGraphicBlock";var X=(0,j.withLayout)(E);
+"use strict";var A=Object.create;var N=Object.defineProperty;var O=Object.getOwnPropertyDescriptor;var Z=Object.getOwnPropertyNames;var F=Object.getPrototypeOf,J=Object.prototype.hasOwnProperty;var K=(s,l)=>{for(var o in l)N(s,o,{get:l[o],enumerable:!0})},U=(s,l,o,p)=>{if(l&&typeof l=="object"||typeof l=="function")for(let n of Z(l))!J.call(s,n)&&n!==o&&N(s,n,{get:()=>l[n],enumerable:!(p=O(l,n))||p.enumerable});return s};var T=(s,l,o)=>(o=s!=null?A(F(s)):{},U(l||!s||!s.__esModule?N(o,"default",{value:s,enumerable:!0}):o,s)),W=s=>U(N({},"__esModule",{value:!0}),s);var ee={};K(ee,{default:()=>X});module.exports=W(ee);var e=require("react/jsx-runtime"),c=T(require("react")),H=require("react-responsive"),j=require("../../shared/Styles.js"),C=T(require("../../components/picture.js")),_=T(require("../../components/button.js")),z=require("../../components/heading.js"),D=require("../VideoModal/index.js"),$=require("../../components/gird.js"),Q=T(require("../Title/index.js")),u=require("../../helpers/utils.js"),P=T(require("../SwiperBox/index.js")),S=require("../../shared/mimeType.js"),k=require("../../components/tabs.js"),Y=require("../../hooks/useExposure.js"),V=require("../../shared/trackUrlRef.js"),q=require("../../shared/track.js");const w="image",b="p1_banner",M=({data:s,configuration:l,jIndex:o,spanType:p,title:n})=>{const[y,f]=(0,c.useState)(!1),B=(0,H.useMediaQuery)({query:"(max-width: 768px)"}),x=(0,c.useRef)(null),L=()=>{if(p)switch(p){case"full":return"tablet:aspect-w-[704] tablet:aspect-h-[400] laptop:aspect-w-[896] laptop:aspect-h-[384] desktop:aspect-w-[1312] desktop:aspect-h-[512] lg-desktop:aspect-w-[1664] lg-desktop:aspect-h-[640]";case"half":return"tablet:aspect-w-[704] tablet:aspect-h-[480] laptop:aspect-w-[440] laptop:aspect-h-[384] desktop:aspect-w-[648] desktop:aspect-h-[512] lg-desktop:aspect-w-[824] lg-desktop:aspect-h-[640]";case"one-third":return"tablet:aspect-w-[296] tablet:aspect-h-[400] laptop:aspect-w-[288] laptop:aspect-h-[384] desktop:aspect-w-[427] desktop:aspect-h-[512] lg-desktop:aspect-w-[544] lg-desktop:aspect-h-[640]";default:return"tablet:aspect-w-[296] tablet:aspect-h-[400] laptop:aspect-w-[288] laptop:aspect-h-[384] desktop:aspect-w-[427] desktop:aspect-h-[512] lg-desktop:aspect-w-[544] lg-desktop:aspect-h-[640]"}else switch(l?.num){case 1:return"tablet:aspect-w-[704] tablet:aspect-h-[400] laptop:aspect-w-[896] laptop:aspect-h-[384] desktop:aspect-w-[1312] desktop:aspect-h-[512] lg-desktop:aspect-w-[1664] lg-desktop:aspect-h-[640]";case 2:return"tablet:aspect-w-[704] tablet:aspect-h-[480] laptop:aspect-w-[440] laptop:aspect-h-[384] desktop:aspect-w-[648] desktop:aspect-h-[512] lg-desktop:aspect-w-[824] lg-desktop:aspect-h-[640]";case 3:return"tablet:aspect-w-[296] tablet:aspect-h-[400] laptop:aspect-w-[288] laptop:aspect-h-[384] desktop:aspect-w-[427] desktop:aspect-h-[512] lg-desktop:aspect-w-[544] lg-desktop:aspect-h-[640]";default:return"tablet:aspect-w-[296] tablet:aspect-h-[400] laptop:aspect-w-[288] laptop:aspect-h-[384] desktop:aspect-w-[427] desktop:aspect-h-[512] lg-desktop:aspect-w-[544] lg-desktop:aspect-h-[640]"}};(0,Y.useExposure)(x,{componentType:w,componentName:b,position:o,componentTitle:s.title,componentDescription:s.description,navigation:l?.activeTab}),(0,c.useEffect)(()=>{f(B)},[B]);const{theme:I="light",title:m,description:h,imageUrl:r,primaryButton:d,secondaryButton:i,imageMobileUrl:g,blockLink:v,video:t,youtubeId:a,isYouTube:G}=s,R="lg-desktop:px-7 lg-desktop:pb-[14px] lg-desktop:pt-[15px] lg-desktop:text-[16px]";return(0,e.jsxs)("div",{className:(0,u.cn)("item-wrapper cursor-pointer","text-info-primary group relative box-border w-full overflow-hidden",L(),{"rounded-2xl":l?.shape==="rounded","aiui-dark":I==="dark","h-[400px]":y},"text-info-primary"),ref:x,children:[(v||i.link)&&(0,e.jsx)("a",{className:"absolute inset-0 z-10",href:(0,V.trackUrlRef)(v||i.link,`${w}_${b}`),"data-headless-type-name":`${w}#${b}`,"data-headless-title-desc-button":`${m}#${h}`,"data-headless-nav-postion":`${l?.activeTab}#${o}`,"aria-hidden":"true",tabIndex:-1}),(0,e.jsxs)("div",{className:"absolute inset-0",children:[(0,S.isVideo)(r?.mimeType)?(0,e.jsx)("video",{autoPlay:!0,muted:!0,playsInline:!0,loop:!0,className:"tablet:block hidden overflow-hidden w-full h-full object-cover",children:(0,e.jsx)("source",{src:r?.url,type:"video/mp4"})}):(0,e.jsx)(C.default,{source:r?.url,alt:r?.alt||"",className:"tablet:block hidden h-full overflow-hidden",imgClassName:"h-full transition-all duration-300 group-hover:scale-105 object-cover",style:{aspectRatio:`${r?.width}/${r?.height}`}}),(0,S.isVideo)(g?.mimeType)?(0,e.jsx)("video",{autoPlay:!0,muted:!0,playsInline:!0,loop:!0,className:"tablet:hidden block overflow-hidden w-full h-full object-cover",children:(0,e.jsx)("source",{src:g?.url,type:"video/mp4"})}):(0,e.jsx)(C.default,{source:g?.url||r?.url,alt:g?.alt||r?.alt||"",className:"tablet:hidden block h-full overflow-hidden",imgClassName:"h-full transition-all duration-300 object-cover"}),(0,e.jsxs)("div",{className:(0,u.cn)("absolutestyle laptop:p-6 desktop:p-[32px] laptop:gap-4 desktop:gap-6 absolute inset-x-0 bottom-0 z-20 flex w-fit flex-col gap-6 p-4",{"fullstyle laptop:top-1/2 laptop:-translate-y-1/2 laptop:bottom-auto":s?.width==="full"}),children:[(0,e.jsxs)("div",{className:"flex flex-col gap-1",children:[(0,e.jsx)(z.Heading,{size:3,as:"h3",className:"item-title",html:m}),(0,e.jsx)(z.Heading,{as:"h4",className:"item-description desktop:text-[16px] lg-desktop:text-[18px] line-clamp-1 text-[14px]",html:h})]}),(0,e.jsxs)("div",{className:"lg-desktop:gap-3 flex gap-2",children:[i&&i.text&&(0,e.jsxs)(_.default,{"aria-label":m??h,className:(0,u.cn)(R,"link-left"),variant:"secondary",as:"a",href:(0,V.trackUrlRef)(i.link,`${w}_${b}`),"data-headless-type-name":`${w}#${b}`,"data-headless-title-desc-button":`${m}#${h}#${i.text}`,"data-headless-nav-postion":`${l?.activeTab}#${o}`,children:[i.text,(0,e.jsx)("span",{className:"sr-only",children:m??h})]}),d&&d.text&&(0,e.jsx)(_.default,{"aria-label":m??h,className:(0,u.cn)(R,"link-right"),variant:"primary",as:"a",href:(0,V.trackUrlRef)(d.link,`${w}_${b}`),"data-headless-type-name":`${w}#${b}`,"data-headless-title-desc-button":`${m}#${h}#${d.text}`,"data-headless-nav-postion":`${l?.activeTab}#${o}`,children:d.text})]})]})]}),(0,e.jsx)("div",{children:(0,e.jsx)("div",{className:"laptop:bottom-6 laptop:right-6 absolute bottom-4 right-4 z-20",children:(t?.url||a)&&(0,e.jsx)("button",{onClick:()=>{l?.onVideoPlayBtnClick?.(t?.url||a,G)},className:"laptop:size-12 flex size-8 items-center justify-center rounded-full bg-white bg-opacity-20 hover:bg-black/75",children:(0,e.jsx)("svg",{width:"12",height:"14",viewBox:"0 0 12 14",fill:"none",xmlns:"http://www.w3.org/2000/svg",children:(0,e.jsx)("path",{d:"M12 7L0 14L0 0L12 7Z",fill:"white"})})})})})]})},E=c.default.forwardRef((s,l)=>{const{shape:o,sectionTitle:p,groupByTab:n=!1,items:y=[],carousel:f}=s.data,[B,x]=(0,c.useState)(!1),[L,I]=(0,c.useState)(""),[m,h]=(0,c.useState)(""),r=t=>{switch(t){case"full":return 12;case"half":return 6;case"one-third":return 4}},d=y.map(t=>t.tabName).filter(Boolean).filter((t,a,G)=>G.indexOf(t)===a),i=(t,a)=>{x(!0),a?h?.(t||""):I?.(t||"")},g=(t,a)=>{switch(t){case 1:return 1;case 2:return 2;default:return a?2.3:3}},v=d.map(t=>({tabName:t,items:y.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:l,className:(0,u.cn)("multiLayoutGraphicBlock","text-info-primary",s.className),children:[p&&(0,e.jsx)(Q.default,{data:{title:p},className:"section-title"}),n?(0,e.jsxs)(k.Tabs,{shape:o,align:"left",defaultValue:(0,u.spaceToHyphen)(d[0]),children:[(0,e.jsx)(k.TabsList,{children:d.map((t,a)=>(0,e.jsx)(k.TabsTrigger,{value:(0,u.spaceToHyphen)(t),onClick:()=>{(0,q.gaTrack)({event:"ga4Event",event_name:"component_click",event_parameters:{page_group:"Home Page",component_type:w,component_name:b,component_title:p,component_position:1,navigation:t,button_name:t}})},children:t},a))}),d.map((t,a)=>(0,e.jsx)(k.TabsContent,{value:(0,u.spaceToHyphen)(t),className:"desktop:mt-[36px] mt-[24px] w-full",children:(0,e.jsxs)(e.Fragment,{children:[(0,e.jsx)(P.default,{className:"!overflow-visible",id:"MultiLayoutGraphicBlock1",data:{list:v?.[t]||[],configuration:{shape:o,isTab:n,activeTab:t,title:p,num:v?.[t]?.length||0,onVideoPlayBtnClick:i}},Slide:M,breakpoints:{0:{spaceBetween:12,freeMode:!1,slidesPerView:1},374:{spaceBetween:12,freeMode:!1,slidesPerView:1.2},768:{spaceBetween:16,freeMode:!1,slidesPerView:g(v?.[t]?.length||0,!0)},1024:{spaceBetween:16,freeMode:!1,slidesPerView:g(v?.[t]?.length||0)}}}),f&&f?.items.length>0?(0,e.jsx)(P.default,{className:"!overflow-visible",id:"MultiLayoutGraphicBlock2",data:{list:f?.items||[],configuration:{shape:o,isTab:n,onVideoPlayBtnClick:i,title:p}},Slide:M,breakpoints:{0:{spaceBetween:12,freeMode:!1,slidesPerView:1},374:{spaceBetween:12,freeMode:!1,slidesPerView:1.2},768:{spaceBetween:16,freeMode:!1,slidesPerView:2.3},1024:{spaceBetween:16,freeMode:!1,slidesPerView:3.1},1440:{spaceBetween:16,freeMode:!1,slidesPerView:4}}}):null]})},a))]}):(0,e.jsxs)(e.Fragment,{children:[(0,e.jsxs)($.Grid,{className:"w-full",children:[y.map((t,a)=>(0,e.jsx)($.GridItem,{span:r(t.width??"full"),className:"laptop:block hidden",children:(0,e.jsx)(M,{data:t,configuration:{shape:o,onVideoPlayBtnClick:i,title:p},jIndex:a,spanType:t.width})},`${t?.title||""}${a}`)),y.map((t,a)=>(0,e.jsx)($.GridItem,{span:r("full"),className:"laptop:hidden block",children:(0,e.jsx)(M,{data:t,configuration:{shape:o,onVideoPlayBtnClick:i,title:p},jIndex:a,spanType:"full"})},`${t?.title||""}${a}`))]}),f&&f?.items.length>0?(0,e.jsx)(P.default,{className:"!overflow-visible",id:"MultiLayoutGraphicBlock3",data:{list:f?.items||[],configuration:{shape:o,onVideoPlayBtnClick:i,title:p}},Slide:M,breakpoints:{0:{spaceBetween:12,freeMode:!1,slidesPerView:1},374:{spaceBetween:12,freeMode:!1,slidesPerView:1.2},768:{spaceBetween:16,freeMode:!1,slidesPerView:2.3},1024:{spaceBetween:16,freeMode:!1,slidesPerView:3.1},1440:{spaceBetween:16,freeMode:!1,slidesPerView:4}}}):null]}),B&&(0,e.jsx)(D.VideoModal,{visible:B,youTubeId:m,videoUrl:L,onCloseModal:()=>x(!1)})]})});E.displayName="MultiLayoutGraphicBlock";var X=(0,j.withLayout)(E);
 //# sourceMappingURL=MultiLayoutGraphicBlock.js.map