@anker-in/headless-ui 1.0.26-alpha.1762872688412 → 1.0.26-alpha.1762914443262

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (146) hide show
  1. package/dist/cjs/biz-components/AiuiProvider/index.d.ts +1 -1
  2. package/dist/cjs/biz-components/AiuiProvider/index.js.map +1 -1
  3. package/dist/cjs/biz-components/CollectionShelves/CollectionShelvesItem.d.ts +4 -0
  4. package/dist/cjs/biz-components/CollectionShelves/CollectionShelvesItem.js +2 -0
  5. package/dist/cjs/biz-components/CollectionShelves/CollectionShelvesItem.js.map +7 -0
  6. package/dist/cjs/biz-components/CollectionShelves/index.d.ts +7 -0
  7. package/dist/cjs/biz-components/CollectionShelves/index.js +2 -0
  8. package/dist/cjs/biz-components/CollectionShelves/index.js.map +7 -0
  9. package/dist/cjs/biz-components/CollectionsBanner/index.d.ts +7 -0
  10. package/dist/cjs/biz-components/CollectionsBanner/index.js +2 -0
  11. package/dist/cjs/biz-components/CollectionsBanner/index.js.map +7 -0
  12. package/dist/cjs/biz-components/CollectionsBanner/types.d.ts +43 -0
  13. package/dist/cjs/biz-components/CollectionsBanner/types.js +2 -0
  14. package/dist/cjs/biz-components/CollectionsBanner/types.js.map +7 -0
  15. package/dist/cjs/biz-components/CollectionsFilters/FilterCardWrap.d.ts +19 -0
  16. package/dist/cjs/biz-components/CollectionsFilters/FilterCardWrap.js +2 -0
  17. package/dist/cjs/biz-components/CollectionsFilters/FilterCardWrap.js.map +7 -0
  18. package/dist/cjs/biz-components/CollectionsFilters/FilterCardWrapItem.d.ts +10 -0
  19. package/dist/cjs/biz-components/CollectionsFilters/FilterCardWrapItem.js +2 -0
  20. package/dist/cjs/biz-components/CollectionsFilters/FilterCardWrapItem.js.map +7 -0
  21. package/dist/cjs/biz-components/CollectionsFilters/FilterHeader.d.ts +13 -0
  22. package/dist/cjs/biz-components/CollectionsFilters/FilterHeader.js +2 -0
  23. package/dist/cjs/biz-components/CollectionsFilters/FilterHeader.js.map +7 -0
  24. package/dist/cjs/biz-components/CollectionsFilters/FilterList.d.ts +14 -0
  25. package/dist/cjs/biz-components/CollectionsFilters/FilterList.js +2 -0
  26. package/dist/cjs/biz-components/CollectionsFilters/FilterList.js.map +7 -0
  27. package/dist/cjs/biz-components/CollectionsFilters/component/AnimatedUL.d.ts +5 -0
  28. package/dist/cjs/biz-components/CollectionsFilters/component/AnimatedUL.js +2 -0
  29. package/dist/cjs/biz-components/CollectionsFilters/component/AnimatedUL.js.map +7 -0
  30. package/dist/cjs/biz-components/CollectionsFilters/component/TabFilter.d.ts +12 -0
  31. package/dist/cjs/biz-components/CollectionsFilters/component/TabFilter.js +2 -0
  32. package/dist/cjs/biz-components/CollectionsFilters/component/TabFilter.js.map +7 -0
  33. package/dist/cjs/biz-components/CollectionsFilters/component/filtersFun.d.ts +12 -0
  34. package/dist/cjs/biz-components/CollectionsFilters/component/filtersFun.js +2 -0
  35. package/dist/cjs/biz-components/CollectionsFilters/component/filtersFun.js.map +7 -0
  36. package/dist/cjs/biz-components/CollectionsFilters/component/helper.d.ts +81 -0
  37. package/dist/cjs/biz-components/CollectionsFilters/component/helper.js +2 -0
  38. package/dist/cjs/biz-components/CollectionsFilters/component/helper.js.map +7 -0
  39. package/dist/cjs/biz-components/CollectionsFilters/component/price.d.ts +25 -0
  40. package/dist/cjs/biz-components/CollectionsFilters/component/price.js +2 -0
  41. package/dist/cjs/biz-components/CollectionsFilters/component/price.js.map +7 -0
  42. package/dist/cjs/biz-components/CollectionsFilters/component/priceProps.d.ts +215 -0
  43. package/dist/cjs/biz-components/CollectionsFilters/component/priceProps.js +2 -0
  44. package/dist/cjs/biz-components/CollectionsFilters/component/priceProps.js.map +7 -0
  45. package/dist/cjs/biz-components/CollectionsFilters/index.d.ts +24 -0
  46. package/dist/cjs/biz-components/CollectionsFilters/index.js +2 -0
  47. package/dist/cjs/biz-components/CollectionsFilters/index.js.map +7 -0
  48. package/dist/cjs/biz-components/Paginator/index.d.ts +7 -0
  49. package/dist/cjs/biz-components/Paginator/index.js +7 -0
  50. package/dist/cjs/biz-components/Paginator/index.js.map +7 -0
  51. package/dist/cjs/biz-components/TextMarquee/index.d.ts +10 -0
  52. package/dist/cjs/biz-components/TextMarquee/index.js +2 -0
  53. package/dist/cjs/biz-components/TextMarquee/index.js.map +7 -0
  54. package/dist/cjs/biz-components/Title/index.js +1 -1
  55. package/dist/cjs/biz-components/Title/index.js.map +3 -3
  56. package/dist/cjs/biz-components/Title/types.d.ts +1 -0
  57. package/dist/cjs/biz-components/Title/types.js +1 -1
  58. package/dist/cjs/biz-components/Title/types.js.map +1 -1
  59. package/dist/cjs/biz-components/index.d.ts +9 -0
  60. package/dist/cjs/biz-components/index.js +1 -1
  61. package/dist/cjs/biz-components/index.js.map +3 -3
  62. package/dist/cjs/components/breadcrumb.d.ts +12 -0
  63. package/dist/cjs/components/breadcrumb.js +2 -0
  64. package/dist/cjs/components/breadcrumb.js.map +7 -0
  65. package/dist/cjs/components/index.d.ts +1 -0
  66. package/dist/cjs/components/index.js +1 -1
  67. package/dist/cjs/components/index.js.map +3 -3
  68. package/dist/cjs/helpers/utils.d.ts +1 -0
  69. package/dist/cjs/helpers/utils.js +1 -1
  70. package/dist/cjs/helpers/utils.js.map +3 -3
  71. package/dist/cjs/hooks/useRollout.d.ts +2 -14
  72. package/dist/cjs/hooks/useRollout.js +1 -1
  73. package/dist/cjs/hooks/useRollout.js.map +3 -3
  74. package/dist/esm/biz-components/AiuiProvider/index.d.ts +1 -1
  75. package/dist/esm/biz-components/AiuiProvider/index.js.map +1 -1
  76. package/dist/esm/biz-components/CollectionShelves/CollectionShelvesItem.d.ts +4 -0
  77. package/dist/esm/biz-components/CollectionShelves/CollectionShelvesItem.js +2 -0
  78. package/dist/esm/biz-components/CollectionShelves/CollectionShelvesItem.js.map +7 -0
  79. package/dist/esm/biz-components/CollectionShelves/index.d.ts +7 -0
  80. package/dist/esm/biz-components/CollectionShelves/index.js +2 -0
  81. package/dist/esm/biz-components/CollectionShelves/index.js.map +7 -0
  82. package/dist/esm/biz-components/CollectionsBanner/index.d.ts +7 -0
  83. package/dist/esm/biz-components/CollectionsBanner/index.js +2 -0
  84. package/dist/esm/biz-components/CollectionsBanner/index.js.map +7 -0
  85. package/dist/esm/biz-components/CollectionsBanner/types.d.ts +43 -0
  86. package/dist/esm/biz-components/CollectionsBanner/types.js +1 -0
  87. package/dist/esm/biz-components/CollectionsBanner/types.js.map +7 -0
  88. package/dist/esm/biz-components/CollectionsFilters/FilterCardWrap.d.ts +19 -0
  89. package/dist/esm/biz-components/CollectionsFilters/FilterCardWrap.js +2 -0
  90. package/dist/esm/biz-components/CollectionsFilters/FilterCardWrap.js.map +7 -0
  91. package/dist/esm/biz-components/CollectionsFilters/FilterCardWrapItem.d.ts +10 -0
  92. package/dist/esm/biz-components/CollectionsFilters/FilterCardWrapItem.js +2 -0
  93. package/dist/esm/biz-components/CollectionsFilters/FilterCardWrapItem.js.map +7 -0
  94. package/dist/esm/biz-components/CollectionsFilters/FilterHeader.d.ts +13 -0
  95. package/dist/esm/biz-components/CollectionsFilters/FilterHeader.js +2 -0
  96. package/dist/esm/biz-components/CollectionsFilters/FilterHeader.js.map +7 -0
  97. package/dist/esm/biz-components/CollectionsFilters/FilterList.d.ts +14 -0
  98. package/dist/esm/biz-components/CollectionsFilters/FilterList.js +2 -0
  99. package/dist/esm/biz-components/CollectionsFilters/FilterList.js.map +7 -0
  100. package/dist/esm/biz-components/CollectionsFilters/component/AnimatedUL.d.ts +5 -0
  101. package/dist/esm/biz-components/CollectionsFilters/component/AnimatedUL.js +2 -0
  102. package/dist/esm/biz-components/CollectionsFilters/component/AnimatedUL.js.map +7 -0
  103. package/dist/esm/biz-components/CollectionsFilters/component/TabFilter.d.ts +12 -0
  104. package/dist/esm/biz-components/CollectionsFilters/component/TabFilter.js +2 -0
  105. package/dist/esm/biz-components/CollectionsFilters/component/TabFilter.js.map +7 -0
  106. package/dist/esm/biz-components/CollectionsFilters/component/filtersFun.d.ts +12 -0
  107. package/dist/esm/biz-components/CollectionsFilters/component/filtersFun.js +2 -0
  108. package/dist/esm/biz-components/CollectionsFilters/component/filtersFun.js.map +7 -0
  109. package/dist/esm/biz-components/CollectionsFilters/component/helper.d.ts +81 -0
  110. package/dist/esm/biz-components/CollectionsFilters/component/helper.js +2 -0
  111. package/dist/esm/biz-components/CollectionsFilters/component/helper.js.map +7 -0
  112. package/dist/esm/biz-components/CollectionsFilters/component/price.d.ts +25 -0
  113. package/dist/esm/biz-components/CollectionsFilters/component/price.js +2 -0
  114. package/dist/esm/biz-components/CollectionsFilters/component/price.js.map +7 -0
  115. package/dist/esm/biz-components/CollectionsFilters/component/priceProps.d.ts +215 -0
  116. package/dist/esm/biz-components/CollectionsFilters/component/priceProps.js +2 -0
  117. package/dist/esm/biz-components/CollectionsFilters/component/priceProps.js.map +7 -0
  118. package/dist/esm/biz-components/CollectionsFilters/index.d.ts +24 -0
  119. package/dist/esm/biz-components/CollectionsFilters/index.js +2 -0
  120. package/dist/esm/biz-components/CollectionsFilters/index.js.map +7 -0
  121. package/dist/esm/biz-components/Paginator/index.d.ts +7 -0
  122. package/dist/esm/biz-components/Paginator/index.js +7 -0
  123. package/dist/esm/biz-components/Paginator/index.js.map +7 -0
  124. package/dist/esm/biz-components/TextMarquee/index.d.ts +10 -0
  125. package/dist/esm/biz-components/TextMarquee/index.js +2 -0
  126. package/dist/esm/biz-components/TextMarquee/index.js.map +7 -0
  127. package/dist/esm/biz-components/Title/index.js +1 -1
  128. package/dist/esm/biz-components/Title/index.js.map +3 -3
  129. package/dist/esm/biz-components/Title/types.d.ts +1 -0
  130. package/dist/esm/biz-components/index.d.ts +9 -0
  131. package/dist/esm/biz-components/index.js +1 -1
  132. package/dist/esm/biz-components/index.js.map +2 -2
  133. package/dist/esm/components/breadcrumb.d.ts +12 -0
  134. package/dist/esm/components/breadcrumb.js +2 -0
  135. package/dist/esm/components/breadcrumb.js.map +7 -0
  136. package/dist/esm/components/index.d.ts +1 -0
  137. package/dist/esm/components/index.js +1 -1
  138. package/dist/esm/components/index.js.map +2 -2
  139. package/dist/esm/helpers/utils.d.ts +1 -0
  140. package/dist/esm/helpers/utils.js +1 -1
  141. package/dist/esm/helpers/utils.js.map +3 -3
  142. package/dist/esm/hooks/useRollout.d.ts +2 -14
  143. package/dist/esm/hooks/useRollout.js +1 -1
  144. package/dist/esm/hooks/useRollout.js.map +3 -3
  145. package/package.json +1 -1
  146. package/style.css +23 -0
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "version": 3,
3
3
  "sources": ["../../../src/helpers/utils.ts"],
4
- "sourcesContent": ["import { clsx, type ClassValue } from 'clsx'\nimport { extendTailwindMerge } from 'tailwind-merge'\n\nconst twMerge = extendTailwindMerge({\n extend: {\n theme: {\n borderRadius: ['btn'],\n },\n classGroups: {\n 'font-size': [\n 'text-heading-1',\n 'text-heading-2',\n 'text-heading-3',\n 'text-heading-4',\n 'text-heading-5',\n 'text-text-3',\n 'text-text-2',\n 'text-text-1',\n ],\n 'text-color': [\n 'text-info-primary',\n 'text-info-secondary',\n 'text-info-tertiary',\n 'text-info-quaternary',\n 'text-info-white',\n ],\n leading: ['leading-tight', 'leading-normal', 'leading-loose'],\n },\n },\n})\n\nexport function cn(...inputs: ClassValue[]) {\n return twMerge(clsx(inputs))\n}\n\nexport function noop(): any {}\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}\nexport const spaceToHyphen = (str: string) => str?.replace(/\\s+/g, '-')\n\nexport const highlightSearchWord = (text: string, searchText: string) => {\n try {\n const wordIndex = text?.search(new RegExp(searchText, 'i'))\n if (searchText && wordIndex !== -1) {\n const word = text.slice(wordIndex, wordIndex + searchText.length)\n return text.replace(word, `<span class='text-brand-0 font-bold'>${word}</span>`)\n } else {\n return text\n }\n } catch (e) {\n console.log('e', e)\n return text\n }\n}"],
5
- "mappings": "yaAAA,IAAAA,EAAA,GAAAC,EAAAD,EAAA,YAAAE,EAAA,OAAAC,EAAA,wBAAAC,EAAA,SAAAC,EAAA,kBAAAC,IAAA,eAAAC,EAAAP,GAAA,IAAAQ,EAAsC,gBACtCC,EAAoC,0BAEpC,MAAMC,KAAU,uBAAoB,CAClC,OAAQ,CACN,MAAO,CACL,aAAc,CAAC,KAAK,CACtB,EACA,YAAa,CACX,YAAa,CACX,iBACA,iBACA,iBACA,iBACA,iBACA,cACA,cACA,aACF,EACA,aAAc,CACZ,oBACA,sBACA,qBACA,uBACA,iBACF,EACA,QAAS,CAAC,gBAAiB,iBAAkB,eAAe,CAC9D,CACF,CACF,CAAC,EAEM,SAASP,KAAMQ,EAAsB,CAC1C,OAAOD,KAAQ,QAAKC,CAAM,CAAC,CAC7B,CAEO,SAASN,GAAY,CAAC,CAEtB,SAASH,EAAOU,EAAY,CACjC,OAAIA,GAAM,OAAOA,GAAO,UAAYA,EAAG,SAAS,GAAG,EAC1CA,EAAG,MAAM,GAAG,EAAE,IAAI,GAAG,MAAM,GAAG,GAAG,MAAM,EAEvCA,CAEX,CACO,MAAMN,EAAiBO,GAAgBA,GAAK,QAAQ,OAAQ,GAAG,EAEzDT,EAAsB,CAACU,EAAcC,IAAuB,CACvE,GAAI,CACF,MAAMC,EAAYF,GAAM,OAAO,IAAI,OAAOC,EAAY,GAAG,CAAC,EAC1D,GAAIA,GAAcC,IAAc,GAAI,CAClC,MAAMC,EAAOH,EAAK,MAAME,EAAWA,EAAYD,EAAW,MAAM,EAChE,OAAOD,EAAK,QAAQG,EAAM,wCAAwCA,CAAI,SAAS,CACjF,KACE,QAAOH,CAEX,OAASI,EAAG,CACV,eAAQ,IAAI,IAAKA,CAAC,EACXJ,CACT,CACF",
6
- "names": ["utils_exports", "__export", "atobID", "cn", "highlightSearchWord", "noop", "spaceToHyphen", "__toCommonJS", "import_clsx", "import_tailwind_merge", "twMerge", "inputs", "id", "str", "text", "searchText", "wordIndex", "word", "e"]
4
+ "sourcesContent": ["import { clsx, type ClassValue } from 'clsx'\nimport { extendTailwindMerge } from 'tailwind-merge'\n\nconst twMerge = extendTailwindMerge({\n extend: {\n theme: {\n borderRadius: ['btn'],\n },\n classGroups: {\n 'font-size': [\n 'text-heading-1',\n 'text-heading-2',\n 'text-heading-3',\n 'text-heading-4',\n 'text-heading-5',\n 'text-text-3',\n 'text-text-2',\n 'text-text-1',\n ],\n 'text-color': [\n 'text-info-primary',\n 'text-info-secondary',\n 'text-info-tertiary',\n 'text-info-quaternary',\n 'text-info-white',\n ],\n leading: ['leading-tight', 'leading-normal', 'leading-loose'],\n },\n },\n})\n\nexport function cn(...inputs: ClassValue[]) {\n return twMerge(clsx(inputs))\n}\n\nexport function noop(): any {}\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 const spaceToHyphen = (str: string) => str?.replace(/\\s+/g, '-')\n\nexport const highlightSearchWord = (text: string, searchText: string) => {\n try {\n const wordIndex = text?.search(new RegExp(searchText, 'i'))\n if (searchText && wordIndex !== -1) {\n const word = text.slice(wordIndex, wordIndex + searchText.length)\n return text.replace(word, `<span class='text-brand-0 font-bold'>${word}</span>`)\n } else {\n return text\n }\n } catch (e) {\n console.log('e', e)\n return text\n }\n}\nexport const yotpoInstanceId = (locale = 'us') =>\n ({\n us: '1126311',\n uk: '638361',\n ca: '638351',\n }[locale] || '')\n"],
5
+ "mappings": "yaAAA,IAAAA,EAAA,GAAAC,EAAAD,EAAA,YAAAE,EAAA,OAAAC,EAAA,wBAAAC,EAAA,SAAAC,EAAA,kBAAAC,EAAA,oBAAAC,IAAA,eAAAC,EAAAR,GAAA,IAAAS,EAAsC,gBACtCC,EAAoC,0BAEpC,MAAMC,KAAU,uBAAoB,CAClC,OAAQ,CACN,MAAO,CACL,aAAc,CAAC,KAAK,CACtB,EACA,YAAa,CACX,YAAa,CACX,iBACA,iBACA,iBACA,iBACA,iBACA,cACA,cACA,aACF,EACA,aAAc,CACZ,oBACA,sBACA,qBACA,uBACA,iBACF,EACA,QAAS,CAAC,gBAAiB,iBAAkB,eAAe,CAC9D,CACF,CACF,CAAC,EAEM,SAASR,KAAMS,EAAsB,CAC1C,OAAOD,KAAQ,QAAKC,CAAM,CAAC,CAC7B,CAEO,SAASP,GAAY,CAAC,CAEtB,SAASH,EAAOW,EAAY,CACjC,OAAIA,GAAM,OAAOA,GAAO,UAAYA,EAAG,SAAS,GAAG,EAC1CA,EAAG,MAAM,GAAG,EAAE,IAAI,GAAG,MAAM,GAAG,GAAG,MAAM,EAEvCA,CAEX,CAEO,MAAMP,EAAiBQ,GAAgBA,GAAK,QAAQ,OAAQ,GAAG,EAEzDV,EAAsB,CAACW,EAAcC,IAAuB,CACvE,GAAI,CACF,MAAMC,EAAYF,GAAM,OAAO,IAAI,OAAOC,EAAY,GAAG,CAAC,EAC1D,GAAIA,GAAcC,IAAc,GAAI,CAClC,MAAMC,EAAOH,EAAK,MAAME,EAAWA,EAAYD,EAAW,MAAM,EAChE,OAAOD,EAAK,QAAQG,EAAM,wCAAwCA,CAAI,SAAS,CACjF,KACE,QAAOH,CAEX,OAASI,EAAG,CACV,eAAQ,IAAI,IAAKA,CAAC,EACXJ,CACT,CACF,EACaR,EAAkB,CAACa,EAAS,QACtC,CACC,GAAI,UACJ,GAAI,SACJ,GAAI,QACN,GAAEA,CAAM,GAAK",
6
+ "names": ["utils_exports", "__export", "atobID", "cn", "highlightSearchWord", "noop", "spaceToHyphen", "yotpoInstanceId", "__toCommonJS", "import_clsx", "import_tailwind_merge", "twMerge", "inputs", "id", "str", "text", "searchText", "wordIndex", "word", "e", "locale"]
7
7
  }
@@ -1,14 +1,2 @@
1
- import { type MutableRefObject } from 'react';
2
- type UseRolloutOptions = IntersectionObserverInit & {
3
- /**
4
- * When true, once the target enters the viewport the first time,
5
- * the observer disconnects and `inView` stays true.
6
- */
7
- once?: boolean;
8
- };
9
- /**
10
- * Observe when an element enters the viewport.
11
- * Returns a ref to attach to the element and a boolean indicating visibility.
12
- */
13
- export declare function useRollout<T extends HTMLElement = HTMLElement>(options?: UseRolloutOptions): [MutableRefObject<T | null>, boolean];
14
- export {};
1
+ /// <reference types="react" />
2
+ export declare function useRollout<T extends Element>(options: any): (boolean | import("react").RefObject<T>)[];
@@ -1,2 +1,2 @@
1
- "use strict";var c=Object.defineProperty;var I=Object.getOwnPropertyDescriptor;var O=Object.getOwnPropertyNames;var R=Object.prototype.hasOwnProperty;var g=(e,t)=>{for(var r in t)c(e,r,{get:t[r],enumerable:!0})},y=(e,t,r,o)=>{if(t&&typeof t=="object"||typeof t=="function")for(let n of O(t))!R.call(e,n)&&n!==r&&c(e,n,{get:()=>t[n],enumerable:!(o=I(t,n))||o.enumerable});return e};var M=e=>y(c({},"__esModule",{value:!0}),e);var v={};g(v,{useRollout:()=>p});module.exports=M(v);var s=require("react");function p(e={}){const t=(0,s.useRef)(null),[r,o]=(0,s.useState)(!1);return(0,s.useEffect)(()=>{if(typeof window>"u"||typeof IntersectionObserver>"u"){o(!0);return}const{root:n=null,rootMargin:a="0px",threshold:d=0,once:i=!1}=e,u=t.current;if(!u)return;let f=!1;const l=new IntersectionObserver(b=>{b[0]?.isIntersecting??!1?(o(!0),i&&!f&&(f=!0,l.disconnect())):i||o(!1)},{root:n,rootMargin:a,threshold:d});return l.observe(u),()=>{l.disconnect()}},[t.current,e.root,e.rootMargin,e.threshold,e.once]),[t,r]}
1
+ "use strict";var i=Object.defineProperty;var f=Object.getOwnPropertyDescriptor;var l=Object.getOwnPropertyNames;var d=Object.prototype.hasOwnProperty;var b=(n,e)=>{for(var t in e)i(n,t,{get:e[t],enumerable:!0})},v=(n,e,t,o)=>{if(e&&typeof e=="object"||typeof e=="function")for(let r of l(e))!d.call(n,r)&&r!==t&&i(n,r,{get:()=>e[r],enumerable:!(o=f(e,r))||o.enumerable});return n};var I=n=>v(i({},"__esModule",{value:!0}),n);var m={};b(m,{useRollout:()=>a});module.exports=I(m);var s=require("react");function a(n){const e=(0,s.useRef)(null),[t,o]=(0,s.useState)(!1);return(0,s.useEffect)(()=>{if(t)return;const r=e.current;if(!r||typeof IntersectionObserver>"u")return;const c=new IntersectionObserver(([u])=>{u.isIntersecting&&(o(!0),c.disconnect())},n);return c.observe(r),()=>c.disconnect()},[t,n]),[e,t]}
2
2
  //# sourceMappingURL=useRollout.js.map
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "version": 3,
3
3
  "sources": ["../../../src/hooks/useRollout.ts"],
4
- "sourcesContent": ["import { useEffect, useRef, useState, type MutableRefObject } from 'react'\n\ntype UseRolloutOptions = IntersectionObserverInit & {\n /**\n * When true, once the target enters the viewport the first time,\n * the observer disconnects and `inView` stays true.\n */\n once?: boolean\n}\n\n/**\n * Observe when an element enters the viewport.\n * Returns a ref to attach to the element and a boolean indicating visibility.\n */\nexport function useRollout<T extends HTMLElement = HTMLElement>(\n options: UseRolloutOptions = {}\n): [MutableRefObject<T | null>, boolean] {\n const targetRef = useRef<T | null>(null)\n const [inView, setInView] = useState<boolean>(false)\n\n useEffect(() => {\n // Guard for SSR or unsupported environments\n if (typeof window === 'undefined' || typeof IntersectionObserver === 'undefined') {\n setInView(true)\n return\n }\n\n const { root = null, rootMargin = '0px', threshold = 0, once = false } = options\n\n const node = targetRef.current\n if (!node) return\n\n let didDisconnect = false\n\n const observer = new IntersectionObserver(\n entries => {\n const entry = entries[0]\n const isIntersecting = entry?.isIntersecting ?? false\n if (isIntersecting) {\n setInView(true)\n if (once && !didDisconnect) {\n didDisconnect = true\n observer.disconnect()\n }\n } else if (!once) {\n setInView(false)\n }\n },\n { root, rootMargin, threshold }\n )\n\n observer.observe(node)\n\n return () => {\n observer.disconnect()\n }\n // It's important that we only recreate when options or node change\n // eslint-disable-next-line react-hooks/exhaustive-deps\n }, [targetRef.current, options.root, options.rootMargin, options.threshold, options.once])\n\n return [targetRef, inView]\n}\n\n\n"],
5
- "mappings": "yaAAA,IAAAA,EAAA,GAAAC,EAAAD,EAAA,gBAAAE,IAAA,eAAAC,EAAAH,GAAA,IAAAI,EAAmE,iBAc5D,SAASF,EACdG,EAA6B,CAAC,EACS,CACvC,MAAMC,KAAY,UAAiB,IAAI,EACjC,CAACC,EAAQC,CAAS,KAAI,YAAkB,EAAK,EAEnD,sBAAU,IAAM,CAEd,GAAI,OAAO,OAAW,KAAe,OAAO,qBAAyB,IAAa,CAChFA,EAAU,EAAI,EACd,MACF,CAEA,KAAM,CAAE,KAAAC,EAAO,KAAM,WAAAC,EAAa,MAAO,UAAAC,EAAY,EAAG,KAAAC,EAAO,EAAM,EAAIP,EAEnEQ,EAAOP,EAAU,QACvB,GAAI,CAACO,EAAM,OAEX,IAAIC,EAAgB,GAEpB,MAAMC,EAAW,IAAI,qBACnBC,GAAW,CACKA,EAAQ,CAAC,GACO,gBAAkB,IAE9CR,EAAU,EAAI,EACVI,GAAQ,CAACE,IACXA,EAAgB,GAChBC,EAAS,WAAW,IAEZH,GACVJ,EAAU,EAAK,CAEnB,EACA,CAAE,KAAAC,EAAM,WAAAC,EAAY,UAAAC,CAAU,CAChC,EAEA,OAAAI,EAAS,QAAQF,CAAI,EAEd,IAAM,CACXE,EAAS,WAAW,CACtB,CAGF,EAAG,CAACT,EAAU,QAASD,EAAQ,KAAMA,EAAQ,WAAYA,EAAQ,UAAWA,EAAQ,IAAI,CAAC,EAElF,CAACC,EAAWC,CAAM,CAC3B",
6
- "names": ["useRollout_exports", "__export", "useRollout", "__toCommonJS", "import_react", "options", "targetRef", "inView", "setInView", "root", "rootMargin", "threshold", "once", "node", "didDisconnect", "observer", "entries"]
4
+ "sourcesContent": ["import { useState, useEffect, useRef } from 'react'\n\nexport function useRollout<T extends Element>(options: any) {\n const ref = useRef<T>(null)\n const [inView, setInView] = useState(false)\n useEffect(() => {\n if (inView) return // \u5DF2\u8FDB\u5165\u8FC7\uFF0C\u5219\u4E0D\u518D\u89C2\u5BDF\n const el = ref.current\n if (!el || typeof IntersectionObserver === 'undefined') return\n\n const observer = new IntersectionObserver(([entry]) => {\n if (entry.isIntersecting) {\n setInView(true)\n observer.disconnect() // \u505C\u6B62\u89C2\u5BDF\n }\n }, options)\n\n observer.observe(el)\n return () => observer.disconnect()\n }, [inView, options])\n\n return [ref, inView]\n}\n"],
5
+ "mappings": "yaAAA,IAAAA,EAAA,GAAAC,EAAAD,EAAA,gBAAAE,IAAA,eAAAC,EAAAH,GAAA,IAAAI,EAA4C,iBAErC,SAASF,EAA8BG,EAAc,CAC1D,MAAMC,KAAM,UAAU,IAAI,EACpB,CAACC,EAAQC,CAAS,KAAI,YAAS,EAAK,EAC1C,sBAAU,IAAM,CACd,GAAID,EAAQ,OACZ,MAAME,EAAKH,EAAI,QACf,GAAI,CAACG,GAAM,OAAO,qBAAyB,IAAa,OAExD,MAAMC,EAAW,IAAI,qBAAqB,CAAC,CAACC,CAAK,IAAM,CACjDA,EAAM,iBACRH,EAAU,EAAI,EACdE,EAAS,WAAW,EAExB,EAAGL,CAAO,EAEV,OAAAK,EAAS,QAAQD,CAAE,EACZ,IAAMC,EAAS,WAAW,CACnC,EAAG,CAACH,EAAQF,CAAO,CAAC,EAEb,CAACC,EAAKC,CAAM,CACrB",
6
+ "names": ["useRollout_exports", "__export", "useRollout", "__toCommonJS", "import_react", "options", "ref", "inView", "setInView", "el", "observer", "entry"]
7
7
  }
@@ -2,11 +2,11 @@ import React from 'react';
2
2
  interface AiuiContextType {
3
3
  trackingData: Record<string, any>;
4
4
  locale?: string;
5
- copyWriting?: Record<string, string>;
6
5
  pathname?: string;
7
6
  storeDomain?: string;
8
7
  isLogin?: boolean;
9
8
  currencyCode?: string;
9
+ copyWriting?: Record<string, string>;
10
10
  }
11
11
  export declare const AiuiContext: React.Context<AiuiContextType>;
12
12
  export declare const useAiuiContext: () => AiuiContextType;
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "version": 3,
3
3
  "sources": ["../../../../src/biz-components/AiuiProvider/index.tsx"],
4
- "sourcesContent": ["import { gaTrack } from '../../shared/track.js'\nimport React, { createContext, useContext, useEffect } from 'react'\n\ninterface AiuiContextType {\n trackingData: Record<string, any>\n locale?: string\n copyWriting?: Record<string, string>\n pathname?: string\n storeDomain?: string\n isLogin?: boolean\n currencyCode?: string\n}\n\nexport const AiuiContext = createContext<AiuiContextType>({\n trackingData: {},\n locale: undefined,\n copyWriting: {},\n})\n\nexport const useAiuiContext = () => {\n const context = useContext(AiuiContext)\n if (!context) {\n throw new Error('useAiui must be used in <AiuiProvider>')\n }\n return useContext(AiuiContext)\n}\n\nconst AiuiProvider = ({\n children,\n ...rest\n}: {\n children: React.ReactNode\n} & AiuiContextType) => {\n useEffect(() => {\n const handleTrackClick = (e: any, el: any) => {\n // e?.stopPropagation?.()\n const out: any = {}\n if (!el || !el.attributes) return out\n for (const attr of Array.from(el.attributes)) {\n const name = (attr as any)?.name\n if (name?.startsWith('data-headless-')) {\n out[name] = el.getAttribute(name)\n }\n }\n const sku = out?.['data-headless-sku']\n const nameType = out?.['data-headless-type-name']?.split?.('#')\n const titleDesc = out?.['data-headless-title-desc-button']?.split?.('#')\n const navPosition = out?.['data-headless-nav-postion']?.split?.('#')\n gaTrack({\n event: 'ga4Event',\n event_name: 'component_click',\n event_parameters: {\n page_group: rest?.trackingData?.pageGroup || 'Home Page',\n component_type: nameType?.[0] || '',\n component_name: nameType?.[1] || '',\n position: navPosition?.[1] || '',\n navigation: navPosition?.[0] || '',\n button_name: titleDesc?.[2] || '',\n SKU: sku || '',\n component_title: titleDesc?.[0] || '',\n component_description: titleDesc?.[1] || '',\n },\n })\n }\n const observer = new MutationObserver(() => {\n document.querySelectorAll('[data-headless-type-name]').forEach(el => {\n if (!el.hasAttribute('data-headless-track-bound')) {\n el.addEventListener('click', e => handleTrackClick(e, el))\n el.setAttribute('data-headless-track-bound', 'true') // \u907F\u514D\u91CD\u590D\u7ED1\u5B9A\n }\n })\n })\n observer.observe(document.body, { childList: true, subtree: true })\n // \u521D\u59CB\u5316\u4E00\u6B21\u73B0\u6709\u8282\u70B9\n document.querySelectorAll('[data-headless-type-name]').forEach(el => {\n if (!el.hasAttribute('data-headless-track-bound')) {\n el.addEventListener('click', e => handleTrackClick(e, el))\n el.setAttribute('data-headless-track-bound', 'true')\n }\n })\n return () => observer.disconnect()\n }, [])\n\n return <AiuiContext.Provider value={rest}>{children}</AiuiContext.Provider>\n}\n\nexport default AiuiProvider\n"],
4
+ "sourcesContent": ["import { gaTrack } from '../../shared/track.js'\nimport React, { createContext, useContext, useEffect } from 'react'\n\ninterface AiuiContextType {\n trackingData: Record<string, any>\n locale?: string\n pathname?: string\n storeDomain?: string\n isLogin?: boolean\n currencyCode?: string\n copyWriting?: Record<string, string>\n}\n\nexport const AiuiContext = createContext<AiuiContextType>({\n trackingData: {},\n locale: undefined,\n copyWriting: {},\n})\n\nexport const useAiuiContext = () => {\n const context = useContext(AiuiContext)\n if (!context) {\n throw new Error('useAiui must be used in <AiuiProvider>')\n }\n return useContext(AiuiContext)\n}\n\nconst AiuiProvider = ({\n children,\n ...rest\n}: {\n children: React.ReactNode\n} & AiuiContextType) => {\n useEffect(() => {\n const handleTrackClick = (e: any, el: any) => {\n // e?.stopPropagation?.()\n const out: any = {}\n if (!el || !el.attributes) return out\n for (const attr of Array.from(el.attributes)) {\n const name = (attr as any)?.name\n if (name?.startsWith('data-headless-')) {\n out[name] = el.getAttribute(name)\n }\n }\n const sku = out?.['data-headless-sku']\n const nameType = out?.['data-headless-type-name']?.split?.('#')\n const titleDesc = out?.['data-headless-title-desc-button']?.split?.('#')\n const navPosition = out?.['data-headless-nav-postion']?.split?.('#')\n gaTrack({\n event: 'ga4Event',\n event_name: 'component_click',\n event_parameters: {\n page_group: rest?.trackingData?.pageGroup || 'Home Page',\n component_type: nameType?.[0] || '',\n component_name: nameType?.[1] || '',\n position: navPosition?.[1] || '',\n navigation: navPosition?.[0] || '',\n button_name: titleDesc?.[2] || '',\n SKU: sku || '',\n component_title: titleDesc?.[0] || '',\n component_description: titleDesc?.[1] || '',\n },\n })\n }\n const observer = new MutationObserver(() => {\n document.querySelectorAll('[data-headless-type-name]').forEach(el => {\n if (!el.hasAttribute('data-headless-track-bound')) {\n el.addEventListener('click', e => handleTrackClick(e, el))\n el.setAttribute('data-headless-track-bound', 'true') // \u907F\u514D\u91CD\u590D\u7ED1\u5B9A\n }\n })\n })\n observer.observe(document.body, { childList: true, subtree: true })\n // \u521D\u59CB\u5316\u4E00\u6B21\u73B0\u6709\u8282\u70B9\n document.querySelectorAll('[data-headless-type-name]').forEach(el => {\n if (!el.hasAttribute('data-headless-track-bound')) {\n el.addEventListener('click', e => handleTrackClick(e, el))\n el.setAttribute('data-headless-track-bound', 'true')\n }\n })\n return () => observer.disconnect()\n }, [])\n\n return <AiuiContext.Provider value={rest}>{children}</AiuiContext.Provider>\n}\n\nexport default AiuiProvider\n"],
5
5
  "mappings": "AAmFS,cAAAA,MAAA,oBAnFT,OAAS,WAAAC,MAAe,wBACxB,OAAgB,iBAAAC,EAAe,cAAAC,EAAY,aAAAC,MAAiB,QAYrD,MAAMC,EAAcH,EAA+B,CACxD,aAAc,CAAC,EACf,OAAQ,OACR,YAAa,CAAC,CAChB,CAAC,EAEYI,EAAiB,IAAM,CAElC,GAAI,CADYH,EAAWE,CAAW,EAEpC,MAAM,IAAI,MAAM,wCAAwC,EAE1D,OAAOF,EAAWE,CAAW,CAC/B,EAEME,EAAe,CAAC,CACpB,SAAAC,EACA,GAAGC,CACL,KAGEL,EAAU,IAAM,CACd,MAAMM,EAAmB,CAACC,EAAQC,IAAY,CAE5C,MAAMC,EAAW,CAAC,EAClB,GAAI,CAACD,GAAM,CAACA,EAAG,WAAY,OAAOC,EAClC,UAAWC,KAAQ,MAAM,KAAKF,EAAG,UAAU,EAAG,CAC5C,MAAMG,EAAQD,GAAc,KACxBC,GAAM,WAAW,gBAAgB,IACnCF,EAAIE,CAAI,EAAIH,EAAG,aAAaG,CAAI,EAEpC,CACA,MAAMC,EAAMH,IAAM,mBAAmB,EAC/BI,EAAWJ,IAAM,yBAAyB,GAAG,QAAQ,GAAG,EACxDK,EAAYL,IAAM,iCAAiC,GAAG,QAAQ,GAAG,EACjEM,EAAcN,IAAM,2BAA2B,GAAG,QAAQ,GAAG,EACnEZ,EAAQ,CACN,MAAO,WACP,WAAY,kBACZ,iBAAkB,CAChB,WAAYQ,GAAM,cAAc,WAAa,YAC7C,eAAgBQ,IAAW,CAAC,GAAK,GACjC,eAAgBA,IAAW,CAAC,GAAK,GACjC,SAAUE,IAAc,CAAC,GAAK,GAC9B,WAAYA,IAAc,CAAC,GAAK,GAChC,YAAaD,IAAY,CAAC,GAAK,GAC/B,IAAKF,GAAO,GACZ,gBAAiBE,IAAY,CAAC,GAAK,GACnC,sBAAuBA,IAAY,CAAC,GAAK,EAC3C,CACF,CAAC,CACH,EACME,EAAW,IAAI,iBAAiB,IAAM,CAC1C,SAAS,iBAAiB,2BAA2B,EAAE,QAAQR,GAAM,CAC9DA,EAAG,aAAa,2BAA2B,IAC9CA,EAAG,iBAAiB,QAAS,GAAKF,EAAiB,EAAGE,CAAE,CAAC,EACzDA,EAAG,aAAa,4BAA6B,MAAM,EAEvD,CAAC,CACH,CAAC,EACD,OAAAQ,EAAS,QAAQ,SAAS,KAAM,CAAE,UAAW,GAAM,QAAS,EAAK,CAAC,EAElE,SAAS,iBAAiB,2BAA2B,EAAE,QAAQR,GAAM,CAC9DA,EAAG,aAAa,2BAA2B,IAC9CA,EAAG,iBAAiB,QAAS,GAAKF,EAAiB,EAAGE,CAAE,CAAC,EACzDA,EAAG,aAAa,4BAA6B,MAAM,EAEvD,CAAC,EACM,IAAMQ,EAAS,WAAW,CACnC,EAAG,CAAC,CAAC,EAEEpB,EAACK,EAAY,SAAZ,CAAqB,MAAOI,EAAO,SAAAD,EAAS,GAGtD,IAAOa,EAAQd",
6
6
  "names": ["jsx", "gaTrack", "createContext", "useContext", "useEffect", "AiuiContext", "useAiuiContext", "AiuiProvider", "children", "rest", "handleTrackClick", "e", "el", "out", "attr", "name", "sku", "nameType", "titleDesc", "navPosition", "observer", "AiuiProvider_default"]
7
7
  }
@@ -0,0 +1,4 @@
1
+ export declare const CollectionShelvesWrapItem: ({ data, configuration }: {
2
+ data: any;
3
+ configuration?: any;
4
+ }) => import("react/jsx-runtime").JSX.Element;
@@ -0,0 +1,2 @@
1
+ import{Fragment as W,jsx as o,jsxs as r}from"react/jsx-runtime";import{cn as d}from"../../helpers/utils.js";import I from"../../components/badge.js";import{Text as E}from"../../components/text.js";import g from"../../components/button.js";import{gaTrack as j}from"../../shared/track.js";import{useState as v,useEffect as k}from"react";import S from"../../components/picture.js";import{Heading as A}from"../../components/heading.js";import{useAiuiContext as L}from"../AiuiProvider/index.js";import{trackUrlRef as U}from"../../shared/trackUrlRef.js";import{formatVariantPrice as H}from"../ShelfDisplay/shelfDisplay.js";const R="image",z="collectio_shelves",M=999999999e-2,le=({data:e,configuration:t})=>{const{itemShape:w}=t||{},{locale:a="us"}=L(),[_,N]=v(""),T=(l,i,n)=>t?.event?.primaryButton?.(l,i+1,n),B=(l,i,n)=>t?.event?.secondaryButton?.(l,i+1,n),s=e?.variants?.find(l=>l?.sku===e?.sku)||e?.variants?.[0]||{},p=!s?.availableForSale||s?.price?.amount===M,C=t?.isShowTag,h=t?.isShowOriginalPrice,[x,D]=v([]),[$,y]=v(!1),u=s?.coupons?.[0],{price:F,basePrice:O,discount:c}=H({locale:a,amount:h&&u?u.variant_price4wscode:s.price,baseAmount:h&&u?s.price:0,currencyCode:e?.price?.currencyCode||"USD"}),P=()=>{const l=e?.sku,i=e?.variants;return i?.find(f=>f?.sku===l)?.image?.url||i?.[0]?.image?.url||""},m=e?.custom_name||e?.title||e?.name,b=e?.custom_description||e?.description;return k(()=>{let l=[];if(c){const n=`${c}${t?.metafields?.discounts?.off||""}`;l.push(n)}const i=e?.tags?.filter?.(n=>n?.startsWith?.("CLtag"))?.map?.(n=>n?.replace?.("CLtag:",""))?.slice?.(0,c?1:2);D(l.concat(i))},[c,t?.metafields?.discounts,e?.tags]),k(()=>{const{infos:l}=s?.metafields||{},{productInfos:i,preRender:n}=e?.metafields||{},{shopCommon:f}=t?.metafields||{};N(l?.comingSoon||i?.comingSoon||n?.soldOut||f?.soldOut||"")},[e,s]),o("div",{className:d(w==="rounded"?"rounded-2xl":"rounded-none","bg-[#EAEAEC] tablet:hover:bg-[#FFFFFF] box-border w-full cursor-pointer overflow-hidden duration-300","collection-shelves-item",{"aiui-dark":e?.custom_theme==="dark"}),children:r("div",{className:"h-full box-border flex flex-col justify-between overflow-hidden",children:[o("div",{onMouseEnter:()=>y(!0),onMouseLeave:()=>y(!1),className:d("desktop:p-6 p-4 relative inline-block w-full lg-desktop:h-[288px] desktop:h-[234px] h-[182px] overflow-hidden cursor-pointer"),children:r("a",{"aria-label":m,target:t?.target,href:U(`${a==="us"||!a?"":`/${a}`}/products/${e?.handle}`,`${R}_${z}`),onClick:()=>{j({event:"ga4Event",event_name:"select_item",event_parameters:{page_group:"Home Page",item_list_name:"Home_Page_Bundle",items:[{item_id:e?.sku||s?.sku,item_name:e?.name,item_variant:s?.name,price:s?.price,index:t?.index+1}]}})},children:[o(S,{alt:"",source:P(),className:"flex h-full justify-center object-cover [&_img]:h-full [&_img]:w-auto"}),o(S,{alt:"",source:e?.custom_image,className:d($?"opacity-100":"opacity-0","absolute inset-x-0 top-0 h-full object-cover [&_img]:size-full transition-all duration-300")})]})}),r("div",{className:"overflow-hidden flex flex-col justify-end desktop:p-6 p-4 flex-1 box-border collection-shelves-product-content",children:[C&&x?.length?o("div",{className:"mb-2 box-border flex flex-wrap gap-1 overflow-hidden",children:x?.map?.((l,i)=>o(I,{children:l},i))}):null,m?o(A,{as:"h3",title:m||"",html:m||"",className:"lg-desktop:text-2xl lg-desktop:leading-7 tablet:text-xl collection-shelves-product-title line-clamp-2 text-info-primary font-bold tablet:leading-6 text-base"}):null,b?o(E,{size:2,html:b||"",className:"lg-desktop:text-lg desktop:text-base collection-shelves-product-description line-clamp-1 text-sm font-bold text-info-primary"}):null,o("div",{className:"mb-1 mt-4 flex items-center",children:p?o("div",{className:"tablet:text-2xl text-info-primary text-xl font-bold",children:_||""}):r(W,{children:[o("div",{className:"final-price tablet:text-2xl text-info-primary text-xl font-bold",children:s?.availableForSale&&F||""}),o("div",{className:"origin-price tablet:text-xl text-info-secondary ml-1 text-lg font-bold line-through",children:s?.availableForSale&&O||""})]})}),r("div",{className:d("shelf-flex-button-group","lg-desktop:gap-3 flex items-center gap-2",t.direction==="vertical"?"flex-col":""),children:[t?.secondaryButton?o(g,{variant:"secondary",onClick:()=>B(e,t?.index,t),className:`overflow-hidden font-bold ${t.direction==="vertical"?"w-full":""} ${t?.shape==="rounded"?"rounded-2xl":""}`,children:t?.secondaryButton||""}):null,t?.primaryButton&&!p?o(g,{variant:"primary",disabled:p,onClick:()=>T(e,t?.index,t),className:`overflow-hidden font-bold ${t.direction==="vertical"?"w-full":""} ${t?.shape==="rounded"?"rounded-2xl":""}`,children:t?.primaryButton||""}):null]})]})]})},e?.id||e?.handle)};export{le as CollectionShelvesWrapItem};
2
+ //# sourceMappingURL=CollectionShelvesItem.js.map
@@ -0,0 +1,7 @@
1
+ {
2
+ "version": 3,
3
+ "sources": ["../../../../src/biz-components/CollectionShelves/CollectionShelvesItem.tsx"],
4
+ "sourcesContent": ["import { cn } from '../../helpers/utils.js'\nimport Badge from '../../components/badge.js'\nimport { Text } from '../../components/text.js'\nimport Button from '../../components/button.js'\nimport { gaTrack } from '../../shared/track.js'\nimport { useState, useEffect } from 'react'\nimport Picture from '../../components/picture.js'\nimport { Heading } from '../../components/heading.js'\nimport { useAiuiContext } from '../AiuiProvider/index.js'\nimport { trackUrlRef } from '../../shared/trackUrlRef.js'\nimport { formatVariantPrice } from '../ShelfDisplay/shelfDisplay.js'\nimport type { ShelfDisplayItem, ShelfDisplayType } from '../ShelfDisplay/shelfDisplay.js'\n\nconst componentType = 'image'\nconst componentName = 'collectio_shelves'\n\nconst SOLD_OUT_PRICE = 9999999.99\n\nexport const CollectionShelvesWrapItem = ({ data, configuration }: { data: any; configuration?: any }) => {\n const { itemShape } = configuration || {}\n const { locale = 'us' } = useAiuiContext()\n\n const [soldOutText, setSoldOutText] = useState<string>('')\n\n const onPrimaryButton = (params: ShelfDisplayItem, index: number, data: ShelfDisplayType) =>\n configuration?.event?.primaryButton?.(params, index + 1, data)\n\n const onSecondaryButton = (params: ShelfDisplayItem, index: number, data: ShelfDisplayType) =>\n configuration?.event?.secondaryButton?.(params, index + 1, data)\n\n const variant = data?.variants?.find((item: any) => item?.sku === data?.sku) || data?.variants?.[0] || {}\n\n const isSoldOut = !variant?.availableForSale || variant?.price?.amount === SOLD_OUT_PRICE\n const isShowTag = configuration?.isShowTag\n const isShowOriginalPrice = configuration?.isShowOriginalPrice\n\n const [showTags, setShowTags] = useState<string[]>([])\n const [showImage, setShowImage] = useState<boolean>(false)\n\n // active \u7684 \u901A\u7528\u6298\u6263\n const coupon = variant?.coupons?.[0]\n\n const { price, basePrice, discount } = formatVariantPrice({\n locale: locale,\n amount: isShowOriginalPrice && coupon ? coupon.variant_price4wscode : variant.price,\n baseAmount: isShowOriginalPrice && coupon ? variant.price : 0,\n currencyCode: data?.price?.currencyCode || 'USD',\n })\n\n const handleUrl = () => {\n const sku = data?.sku\n const skuArray = data?.variants\n const findSku = skuArray?.find((item: any) => item?.sku === sku)\n return findSku?.image?.url || skuArray?.[0]?.image?.url || ''\n }\n\n const displayTitle = data?.custom_name || data?.title || data?.name\n const displayDescription = data?.custom_description || data?.description\n\n useEffect(() => {\n let handleTags: string[] = []\n if (discount) {\n const discountTag = `${discount}${configuration?.metafields?.discounts?.off || ''}`\n handleTags.push(discountTag)\n }\n const newTags = data?.tags\n ?.filter?.((item: string) => item?.startsWith?.('CLtag'))\n ?.map?.((item: string) => item?.replace?.('CLtag:', ''))\n ?.slice?.(0, discount ? 1 : 2)\n setShowTags(handleTags.concat(newTags))\n }, [discount, configuration?.metafields?.discounts, data?.tags])\n\n useEffect(() => {\n const { infos } = variant?.metafields || {}\n const { productInfos, preRender } = data?.metafields || {}\n const { shopCommon } = configuration?.metafields || {}\n setSoldOutText(infos?.comingSoon || productInfos?.comingSoon || preRender?.soldOut || shopCommon?.soldOut || '')\n }, [data, variant])\n\n return (\n <div\n key={data?.id || data?.handle}\n className={cn(\n itemShape === 'rounded' ? 'rounded-2xl' : 'rounded-none',\n 'bg-[#EAEAEC] tablet:hover:bg-[#FFFFFF] box-border w-full cursor-pointer overflow-hidden duration-300',\n 'collection-shelves-item',\n {\n 'aiui-dark': data?.custom_theme === 'dark',\n }\n )}\n >\n <div className=\"h-full box-border flex flex-col justify-between overflow-hidden\">\n <div\n onMouseEnter={() => setShowImage(true)}\n onMouseLeave={() => setShowImage(false)}\n className={cn(\n 'desktop:p-6 p-4 relative inline-block w-full lg-desktop:h-[288px] desktop:h-[234px] h-[182px] overflow-hidden cursor-pointer'\n )}\n >\n <a\n aria-label={displayTitle}\n target={configuration?.target}\n href={trackUrlRef(\n `${locale === 'us' || !locale ? '' : `/${locale}`}/products/${data?.handle}`,\n `${componentType}_${componentName}`\n )}\n onClick={() => {\n gaTrack({\n event: 'ga4Event',\n event_name: 'select_item',\n event_parameters: {\n page_group: 'Home Page',\n item_list_name: 'Home_Page_Bundle',\n items: [\n {\n item_id: data?.sku || variant?.sku,\n item_name: data?.name,\n item_variant: variant?.name,\n price: variant?.price,\n index: configuration?.index + 1,\n },\n ],\n },\n })\n }}\n >\n <Picture\n alt=\"\"\n source={handleUrl()}\n className=\"flex h-full justify-center object-cover [&_img]:h-full [&_img]:w-auto\"\n />\n <Picture\n alt=\"\"\n source={data?.custom_image}\n className={cn(\n showImage ? 'opacity-100' : 'opacity-0',\n 'absolute inset-x-0 top-0 h-full object-cover [&_img]:size-full transition-all duration-300'\n )}\n />\n </a>\n </div>\n <div className=\"overflow-hidden flex flex-col justify-end desktop:p-6 p-4 flex-1 box-border collection-shelves-product-content\">\n {isShowTag && showTags?.length ? (\n <div className=\"mb-2 box-border flex flex-wrap gap-1 overflow-hidden\">\n {showTags?.map?.((item: any, index: number) => <Badge key={index}>{item}</Badge>)}\n </div>\n ) : null}\n {displayTitle ? (\n <Heading\n as=\"h3\"\n title={displayTitle || ''}\n html={displayTitle || ''}\n className=\"lg-desktop:text-2xl lg-desktop:leading-7 tablet:text-xl collection-shelves-product-title line-clamp-2 text-info-primary font-bold tablet:leading-6 text-base\"\n />\n ) : null}\n {displayDescription ? (\n <Text\n size={2}\n html={displayDescription || ''}\n className=\"lg-desktop:text-lg desktop:text-base collection-shelves-product-description line-clamp-1 text-sm font-bold text-info-primary\"\n />\n ) : null}\n <div className=\"mb-1 mt-4 flex items-center\">\n {isSoldOut ? (\n <div className=\"tablet:text-2xl text-info-primary text-xl font-bold\">{soldOutText || ''}</div>\n ) : (\n <>\n <div className=\"final-price tablet:text-2xl text-info-primary text-xl font-bold\">\n {variant?.availableForSale ? price || '' : ''}\n </div>\n <div className=\"origin-price tablet:text-xl text-info-secondary ml-1 text-lg font-bold line-through\">\n {variant?.availableForSale ? basePrice || '' : ''}\n </div>\n </>\n )}\n </div>\n {/* \u6309\u94AE\u7EC4 */}\n <div\n className={cn(\n 'shelf-flex-button-group',\n 'lg-desktop:gap-3 flex items-center gap-2',\n configuration.direction === 'vertical' ? 'flex-col' : ''\n )}\n >\n {configuration?.secondaryButton ? (\n <Button\n variant=\"secondary\"\n onClick={() => onSecondaryButton(data, configuration?.index, configuration)}\n className={`overflow-hidden font-bold ${configuration.direction === 'vertical' ? 'w-full' : ''} ${configuration?.shape === 'rounded' ? 'rounded-2xl' : ''}`}\n >\n {configuration?.secondaryButton || ''}\n </Button>\n ) : null}\n {configuration?.primaryButton && !isSoldOut ? (\n <Button\n variant=\"primary\"\n disabled={isSoldOut}\n onClick={() => onPrimaryButton(data, configuration?.index, configuration)}\n className={`overflow-hidden font-bold ${configuration.direction === 'vertical' ? 'w-full' : ''} ${configuration?.shape === 'rounded' ? 'rounded-2xl' : ''}`}\n >\n {configuration?.primaryButton || ''}\n </Button>\n ) : null}\n </div>\n </div>\n </div>\n </div>\n )\n}\n"],
5
+ "mappings": "AAmGU,OAmEI,YAAAA,EAxCF,OAAAC,EA3BF,QAAAC,MAAA,oBAnGV,OAAS,MAAAC,MAAU,yBACnB,OAAOC,MAAW,4BAClB,OAAS,QAAAC,MAAY,2BACrB,OAAOC,MAAY,6BACnB,OAAS,WAAAC,MAAe,wBACxB,OAAS,YAAAC,EAAU,aAAAC,MAAiB,QACpC,OAAOC,MAAa,8BACpB,OAAS,WAAAC,MAAe,8BACxB,OAAS,kBAAAC,MAAsB,2BAC/B,OAAS,eAAAC,MAAmB,8BAC5B,OAAS,sBAAAC,MAA0B,kCAGnC,MAAMC,EAAgB,QAChBC,EAAgB,oBAEhBC,EAAiB,aAEVC,GAA4B,CAAC,CAAE,KAAAC,EAAM,cAAAC,CAAc,IAA0C,CACxG,KAAM,CAAE,UAAAC,CAAU,EAAID,GAAiB,CAAC,EAClC,CAAE,OAAAE,EAAS,IAAK,EAAIV,EAAe,EAEnC,CAACW,EAAaC,CAAc,EAAIhB,EAAiB,EAAE,EAEnDiB,EAAkB,CAACC,EAA0BC,EAAeR,IAChEC,GAAe,OAAO,gBAAgBM,EAAQC,EAAQ,EAAGR,CAAI,EAEzDS,EAAoB,CAACF,EAA0BC,EAAeR,IAClEC,GAAe,OAAO,kBAAkBM,EAAQC,EAAQ,EAAGR,CAAI,EAE3DU,EAAUV,GAAM,UAAU,KAAMW,GAAcA,GAAM,MAAQX,GAAM,GAAG,GAAKA,GAAM,WAAW,CAAC,GAAK,CAAC,EAElGY,EAAY,CAACF,GAAS,kBAAoBA,GAAS,OAAO,SAAWZ,EACrEe,EAAYZ,GAAe,UAC3Ba,EAAsBb,GAAe,oBAErC,CAACc,EAAUC,CAAW,EAAI3B,EAAmB,CAAC,CAAC,EAC/C,CAAC4B,EAAWC,CAAY,EAAI7B,EAAkB,EAAK,EAGnD8B,EAAST,GAAS,UAAU,CAAC,EAE7B,CAAE,MAAAU,EAAO,UAAAC,EAAW,SAAAC,CAAS,EAAI3B,EAAmB,CACxD,OAAQQ,EACR,OAAQW,GAAuBK,EAASA,EAAO,qBAAuBT,EAAQ,MAC9E,WAAYI,GAAuBK,EAAST,EAAQ,MAAQ,EAC5D,aAAcV,GAAM,OAAO,cAAgB,KAC7C,CAAC,EAEKuB,EAAY,IAAM,CACtB,MAAMC,EAAMxB,GAAM,IACZyB,EAAWzB,GAAM,SAEvB,OADgByB,GAAU,KAAMd,GAAcA,GAAM,MAAQa,CAAG,GAC/C,OAAO,KAAOC,IAAW,CAAC,GAAG,OAAO,KAAO,EAC7D,EAEMC,EAAe1B,GAAM,aAAeA,GAAM,OAASA,GAAM,KACzD2B,EAAqB3B,GAAM,oBAAsBA,GAAM,YAE7D,OAAAV,EAAU,IAAM,CACd,IAAIsC,EAAuB,CAAC,EAC5B,GAAIN,EAAU,CACZ,MAAMO,EAAc,GAAGP,CAAQ,GAAGrB,GAAe,YAAY,WAAW,KAAO,EAAE,GACjF2B,EAAW,KAAKC,CAAW,CAC7B,CACA,MAAMC,EAAU9B,GAAM,MAClB,SAAUW,GAAiBA,GAAM,aAAa,OAAO,CAAC,GACtD,MAAOA,GAAiBA,GAAM,UAAU,SAAU,EAAE,CAAC,GACrD,QAAQ,EAAGW,EAAW,EAAI,CAAC,EAC/BN,EAAYY,EAAW,OAAOE,CAAO,CAAC,CACxC,EAAG,CAACR,EAAUrB,GAAe,YAAY,UAAWD,GAAM,IAAI,CAAC,EAE/DV,EAAU,IAAM,CACd,KAAM,CAAE,MAAAyC,CAAM,EAAIrB,GAAS,YAAc,CAAC,EACpC,CAAE,aAAAsB,EAAc,UAAAC,CAAU,EAAIjC,GAAM,YAAc,CAAC,EACnD,CAAE,WAAAkC,CAAW,EAAIjC,GAAe,YAAc,CAAC,EACrDI,EAAe0B,GAAO,YAAcC,GAAc,YAAcC,GAAW,SAAWC,GAAY,SAAW,EAAE,CACjH,EAAG,CAAClC,EAAMU,CAAO,CAAC,EAGhB5B,EAAC,OAEC,UAAWE,EACTkB,IAAc,UAAY,cAAgB,eAC1C,uGACA,0BACA,CACE,YAAaF,GAAM,eAAiB,MACtC,CACF,EAEA,SAAAjB,EAAC,OAAI,UAAU,kEACb,UAAAD,EAAC,OACC,aAAc,IAAMoC,EAAa,EAAI,EACrC,aAAc,IAAMA,EAAa,EAAK,EACtC,UAAWlC,EACT,8HACF,EAEA,SAAAD,EAAC,KACC,aAAY2C,EACZ,OAAQzB,GAAe,OACvB,KAAMP,EACJ,GAAGS,IAAW,MAAQ,CAACA,EAAS,GAAK,IAAIA,CAAM,EAAE,aAAaH,GAAM,MAAM,GAC1E,GAAGJ,CAAa,IAAIC,CAAa,EACnC,EACA,QAAS,IAAM,CACbT,EAAQ,CACN,MAAO,WACP,WAAY,cACZ,iBAAkB,CAChB,WAAY,YACZ,eAAgB,mBAChB,MAAO,CACL,CACE,QAASY,GAAM,KAAOU,GAAS,IAC/B,UAAWV,GAAM,KACjB,aAAcU,GAAS,KACvB,MAAOA,GAAS,MAChB,MAAOT,GAAe,MAAQ,CAChC,CACF,CACF,CACF,CAAC,CACH,EAEA,UAAAnB,EAACS,EAAA,CACC,IAAI,GACJ,OAAQgC,EAAU,EAClB,UAAU,wEACZ,EACAzC,EAACS,EAAA,CACC,IAAI,GACJ,OAAQS,GAAM,aACd,UAAWhB,EACTiC,EAAY,cAAgB,YAC5B,4FACF,EACF,GACF,EACF,EACAlC,EAAC,OAAI,UAAU,iHACZ,UAAA8B,GAAaE,GAAU,OACtBjC,EAAC,OAAI,UAAU,uDACZ,SAAAiC,GAAU,MAAM,CAACJ,EAAWH,IAAkB1B,EAACG,EAAA,CAAmB,SAAA0B,GAARH,CAAa,CAAQ,EAClF,EACE,KACHkB,EACC5C,EAACU,EAAA,CACC,GAAG,KACH,MAAOkC,GAAgB,GACvB,KAAMA,GAAgB,GACtB,UAAU,+JACZ,EACE,KACHC,EACC7C,EAACI,EAAA,CACC,KAAM,EACN,KAAMyC,GAAsB,GAC5B,UAAU,+HACZ,EACE,KACJ7C,EAAC,OAAI,UAAU,8BACZ,SAAA8B,EACC9B,EAAC,OAAI,UAAU,sDAAuD,SAAAsB,GAAe,GAAG,EAExFrB,EAAAF,EAAA,CACE,UAAAC,EAAC,OAAI,UAAU,kEACZ,SAAA4B,GAAS,kBAAmBU,GAAS,GACxC,EACAtC,EAAC,OAAI,UAAU,sFACZ,SAAA4B,GAAS,kBAAmBW,GAAa,GAC5C,GACF,EAEJ,EAEAtC,EAAC,OACC,UAAWC,EACT,0BACA,2CACAiB,EAAc,YAAc,WAAa,WAAa,EACxD,EAEC,UAAAA,GAAe,gBACdnB,EAACK,EAAA,CACC,QAAQ,YACR,QAAS,IAAMsB,EAAkBT,EAAMC,GAAe,MAAOA,CAAa,EAC1E,UAAW,6BAA6BA,EAAc,YAAc,WAAa,SAAW,EAAE,IAAIA,GAAe,QAAU,UAAY,cAAgB,EAAE,GAExJ,SAAAA,GAAe,iBAAmB,GACrC,EACE,KACHA,GAAe,eAAiB,CAACW,EAChC9B,EAACK,EAAA,CACC,QAAQ,UACR,SAAUyB,EACV,QAAS,IAAMN,EAAgBN,EAAMC,GAAe,MAAOA,CAAa,EACxE,UAAW,6BAA6BA,EAAc,YAAc,WAAa,SAAW,EAAE,IAAIA,GAAe,QAAU,UAAY,cAAgB,EAAE,GAExJ,SAAAA,GAAe,eAAiB,GACnC,EACE,MACN,GACF,GACF,GA5HKD,GAAM,IAAMA,GAAM,MA6HzB,CAEJ",
6
+ "names": ["Fragment", "jsx", "jsxs", "cn", "Badge", "Text", "Button", "gaTrack", "useState", "useEffect", "Picture", "Heading", "useAiuiContext", "trackUrlRef", "formatVariantPrice", "componentType", "componentName", "SOLD_OUT_PRICE", "CollectionShelvesWrapItem", "data", "configuration", "itemShape", "locale", "soldOutText", "setSoldOutText", "onPrimaryButton", "params", "index", "onSecondaryButton", "variant", "item", "isSoldOut", "isShowTag", "isShowOriginalPrice", "showTags", "setShowTags", "showImage", "setShowImage", "coupon", "price", "basePrice", "discount", "handleUrl", "sku", "skuArray", "displayTitle", "displayDescription", "handleTags", "discountTag", "newTags", "infos", "productInfos", "preRender", "shopCommon"]
7
+ }
@@ -0,0 +1,7 @@
1
+ /// <reference types="react" />
2
+ import type { ShelfDisplayProps } from '../ShelfDisplay/shelfDisplay.js';
3
+ declare const _default: import("react").ForwardRefExoticComponent<Omit<Omit<ShelfDisplayProps & import("react").RefAttributes<HTMLDivElement>, keyof import("../../shared/Styles.js").StylesProps> & Partial<import("../../shared/Styles.js").StylesProps & import("../../shared/Styles.js").ContainerProps> & {
4
+ className?: string | undefined;
5
+ data?: Record<string, any> | undefined;
6
+ }, "ref"> & import("react").RefAttributes<any>>;
7
+ export default _default;
@@ -0,0 +1,2 @@
1
+ "use client";import{jsx as o}from"react/jsx-runtime";import{cn as g}from"../../helpers/utils.js";import T from"../SwiperBox/index.js";import"../../shared/track.js";import{withLayout as k}from"../../shared/Styles.js";import{useExposure as M}from"../../hooks/useExposure.js";import{useRollout as P}from"../../hooks/useRollout.js";import{CollectionShelvesWrapItem as E}from"./CollectionShelvesItem.js";import{forwardRef as I,useEffect as L,useRef as B,useImperativeHandle as C,useState as H}from"react";const R="image",V="collectio_shelves",N=I(({key:n,data:t,event:a,buildData:m,breakpoints:c,className:f="",target:p="_self",metafields:u},d)=>{const{productsCard:h=[],title:b,isShowTag:w=!1,isShowOriginalPrice:v=!0,...D}=t,s=B(null),[S,x]=P({threshold:0}),[i,y]=H([]);return C(d,()=>s.current),M(s,{componentType:R,componentName:V,componentTitle:t?.title}),L(()=>{const l=h?.map?.(e=>{const r=m?.products?.find(_=>_?.handle===e?.handle);if(r)return{sku:e.sku,custom_name:e.custom_name,custom_image:e.custom_image,custom_link:e.custom_link,custom_theme:e.custom_theme,custom_description:e.custom_description,...r}})?.filter(e=>e);y(l?.length?l||[]:[])},[]),o("div",{ref:s,className:g("collection-shelves-wrap w-full",f,{"aiui-dark":t?.theme==="dark"}),children:o("div",{ref:S,children:o(T,{data:{list:i,configuration:{...D,isShowTag:w,event:a,target:p,isShowOriginalPrice:v,metafields:u||{},itemLength:i?.length}},id:`CollectionShelves${n}`,className:"!overflow-visible",Slide:E,breakpoints:c||{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}}})})})});var J=k(N);export{J as default};
2
+ //# sourceMappingURL=index.js.map
@@ -0,0 +1,7 @@
1
+ {
2
+ "version": 3,
3
+ "sources": ["../../../../src/biz-components/CollectionShelves/index.tsx"],
4
+ "sourcesContent": ["'use client'\nimport { cn } from '../../helpers/utils.js'\nimport SwiperBox from '../SwiperBox/index.js'\nimport { gaTrack } from '../../shared/track.js'\nimport { withLayout } from '../../shared/Styles.js'\nimport { useExposure } from '../../hooks/useExposure.js'\nimport { useRollout } from '../../hooks/useRollout.js'\nimport { CollectionShelvesWrapItem } from './CollectionShelvesItem.js'\nimport { forwardRef, useEffect, useRef, useImperativeHandle, useState } from 'react'\nimport type { ShelfDisplayProps, ShelfDisplayItem } from '../ShelfDisplay/shelfDisplay.js'\n\nconst componentType = 'image'\nconst componentName = 'collectio_shelves'\n\nconst ShelfDisplay = forwardRef<HTMLDivElement, ShelfDisplayProps>(\n (\n {\n key,\n data,\n event,\n buildData,\n breakpoints,\n className = '',\n target = '_self',\n metafields,\n },\n ref\n ) => {\n const {\n productsCard = [],\n title,\n isShowTag = false,\n isShowOriginalPrice = true,\n ...other\n } = data\n\n const innerRef = useRef<HTMLDivElement>(null)\n\n const [viewRef, inView] = useRollout<HTMLDivElement>({ threshold: 0 })\n\n const [currentItems, setCurrentItems] = useState<ShelfDisplayItem[]>([])\n\n useImperativeHandle(ref, () => innerRef.current as HTMLDivElement)\n\n useExposure(innerRef, {\n componentType: componentType,\n componentName: componentName,\n componentTitle: data?.title,\n })\n\n useEffect(() => {\n const newCurrentData = productsCard\n ?.map?.(item => {\n const findData = buildData?.products?.find(params => params?.handle === item?.handle)\n if (findData) {\n return {\n sku: item.sku,\n custom_name: item.custom_name,\n custom_image: item.custom_image,\n custom_link: item.custom_link,\n custom_theme: item.custom_theme,\n custom_description: item.custom_description,\n ...findData,\n }\n }\n })\n ?.filter(item => item)\n setCurrentItems(newCurrentData?.length ? newCurrentData || [] : [])\n }, [])\n\n return (\n <div\n ref={innerRef}\n className={cn('collection-shelves-wrap w-full', className, { 'aiui-dark': data?.theme === 'dark' })}\n >\n <div ref={viewRef as any}>\n <SwiperBox\n data={{\n list: currentItems,\n configuration: {\n ...other,\n isShowTag,\n event: event,\n target: target,\n isShowOriginalPrice,\n metafields: metafields || {},\n itemLength: currentItems?.length,\n },\n }}\n id={`CollectionShelves${key}`}\n className={`!overflow-visible`}\n Slide={CollectionShelvesWrapItem}\n breakpoints={\n breakpoints || {\n 0: {\n spaceBetween: 12,\n freeMode: false,\n slidesPerView: 1,\n },\n 374: {\n spaceBetween: 12,\n freeMode: false,\n slidesPerView: 1.2,\n },\n 768: {\n spaceBetween: 16,\n freeMode: false,\n slidesPerView: 2.3,\n },\n 1024: {\n spaceBetween: 16,\n freeMode: false,\n slidesPerView: 3,\n },\n }\n }\n />\n </div>\n </div>\n )\n }\n)\n\nexport default withLayout(ShelfDisplay)\n"],
5
+ "mappings": "aA4EU,cAAAA,MAAA,oBA3EV,OAAS,MAAAC,MAAU,yBACnB,OAAOC,MAAe,wBACtB,MAAwB,wBACxB,OAAS,cAAAC,MAAkB,yBAC3B,OAAS,eAAAC,MAAmB,6BAC5B,OAAS,cAAAC,MAAkB,4BAC3B,OAAS,6BAAAC,MAAiC,6BAC1C,OAAS,cAAAC,EAAY,aAAAC,EAAW,UAAAC,EAAQ,uBAAAC,EAAqB,YAAAC,MAAgB,QAG7E,MAAMC,EAAgB,QAChBC,EAAgB,oBAEhBC,EAAeP,EACnB,CACE,CACE,IAAAQ,EACA,KAAAC,EACA,MAAAC,EACA,UAAAC,EACA,YAAAC,EACA,UAAAC,EAAY,GACZ,OAAAC,EAAS,QACT,WAAAC,CACF,EACAC,IACG,CACH,KAAM,CACJ,aAAAC,EAAe,CAAC,EAChB,MAAAC,EACA,UAAAC,EAAY,GACZ,oBAAAC,EAAsB,GACtB,GAAGC,CACL,EAAIZ,EAEEa,EAAWpB,EAAuB,IAAI,EAEtC,CAACqB,EAASC,CAAM,EAAI1B,EAA2B,CAAE,UAAW,CAAE,CAAC,EAE/D,CAAC2B,EAAcC,CAAe,EAAItB,EAA6B,CAAC,CAAC,EAEvE,OAAAD,EAAoBa,EAAK,IAAMM,EAAS,OAAyB,EAEjEzB,EAAYyB,EAAU,CACpB,cAAejB,EACf,cAAeC,EACf,eAAgBG,GAAM,KACxB,CAAC,EAEDR,EAAU,IAAM,CACd,MAAM0B,EAAiBV,GACnB,MAAMW,GAAQ,CACd,MAAMC,EAAWlB,GAAW,UAAU,KAAKmB,GAAUA,GAAQ,SAAWF,GAAM,MAAM,EACpF,GAAIC,EACF,MAAO,CACL,IAAKD,EAAK,IACV,YAAaA,EAAK,YAClB,aAAcA,EAAK,aACnB,YAAaA,EAAK,YAClB,aAAcA,EAAK,aACnB,mBAAoBA,EAAK,mBACzB,GAAGC,CACL,CAEJ,CAAC,GACC,OAAOD,GAAQA,CAAI,EACvBF,EAAgBC,GAAgB,OAASA,GAAkB,CAAC,EAAI,CAAC,CAAC,CACpE,EAAG,CAAC,CAAC,EAGHlC,EAAC,OACC,IAAK6B,EACL,UAAW5B,EAAG,iCAAkCmB,EAAW,CAAE,YAAaJ,GAAM,QAAU,MAAO,CAAC,EAElG,SAAAhB,EAAC,OAAI,IAAK8B,EACR,SAAA9B,EAACE,EAAA,CACC,KAAM,CACJ,KAAM8B,EACN,cAAe,CACb,GAAGJ,EACH,UAAAF,EACA,MAAOT,EACP,OAAQI,EACR,oBAAAM,EACA,WAAYL,GAAc,CAAC,EAC3B,WAAYU,GAAc,MAC5B,CACF,EACA,GAAI,oBAAoBjB,CAAG,GAC3B,UAAW,oBACX,MAAOT,EACP,YACEa,GAAe,CACb,EAAG,CACD,aAAc,GACd,SAAU,GACV,cAAe,CACjB,EACA,IAAK,CACH,aAAc,GACd,SAAU,GACV,cAAe,GACjB,EACA,IAAK,CACH,aAAc,GACd,SAAU,GACV,cAAe,GACjB,EACA,KAAM,CACJ,aAAc,GACd,SAAU,GACV,cAAe,CACjB,CACF,EAEJ,EACF,EACF,CAEJ,CACF,EAEA,IAAOmB,EAAQnC,EAAWW,CAAY",
6
+ "names": ["jsx", "cn", "SwiperBox", "withLayout", "useExposure", "useRollout", "CollectionShelvesWrapItem", "forwardRef", "useEffect", "useRef", "useImperativeHandle", "useState", "componentType", "componentName", "ShelfDisplay", "key", "data", "event", "buildData", "breakpoints", "className", "target", "metafields", "ref", "productsCard", "title", "isShowTag", "isShowOriginalPrice", "other", "innerRef", "viewRef", "inView", "currentItems", "setCurrentItems", "newCurrentData", "item", "findData", "params", "CollectionShelves_default"]
7
+ }
@@ -0,0 +1,7 @@
1
+ import React from 'react';
2
+ import type { CollectionsBannerProps } from './types.js';
3
+ declare const _default: React.ForwardRefExoticComponent<Omit<Omit<CollectionsBannerProps & React.RefAttributes<HTMLDivElement>, keyof import("../../shared/Styles.js").StylesProps> & Partial<import("../../shared/Styles.js").StylesProps & import("../../shared/Styles.js").ContainerProps> & {
4
+ className?: string | undefined;
5
+ data?: Record<string, any> | undefined;
6
+ }, "ref"> & React.RefAttributes<any>>;
7
+ export default _default;
@@ -0,0 +1,2 @@
1
+ "use client";import{jsx as e,jsxs as $}from"react/jsx-runtime";import U,{useImperativeHandle as j,useRef as s,useEffect as q}from"react";import c from"gsap";import{ScrollTrigger as p}from"gsap/dist/ScrollTrigger";import{useMediaQuery as R}from"react-responsive";import{useInView as _}from"react-intersection-observer";import Q from"../../helpers/ScrollLoadVideo.js";import{Heading as P,Picture as A}from"../../components/index.js";import{cn as u}from"../../helpers/index.js";import{withLayout as F}from"../../shared/Styles.js";import{useExposure as G}from"../../hooks/useExposure.js";import{trackUrlRef as J}from"../../shared/trackUrlRef.js";import"../../components/button.js";import"../VideoModal/index.js";const f="image",b="collections_banner",V=U.forwardRef(({data:I,className:M},C)=>{const{title:r,subtitle:n,pcImage:h,padImage:L,mobileImage:x,pcVideo:v,padVideo:y,mobileVideo:i,isShowVideo:S,theme:z="light",blockLink:k}=I,w=R({query:"(max-width: 768px)"}),T=R({query:"(max-width: 1024px)"}),{ref:B,inView:N}=_(),m=s(null),d=s(null),g=s(null),o=s(null),t=s(null);return G(t,{componentType:f,componentName:b,componentTitle:r,componentDescription:n}),j(C,()=>t.current),q(()=>{c.registerPlugin(p);function E(){if(!o.current)return;const D=t.current?.clientHeight||100;window.innerHeight<=D?m.current=p.create({trigger:t.current,start:"top bottom",end:"bottom top",scrub:!0,onUpdate:l=>{const a=l.progress*40-20;c.set(o.current,{yPercent:a})}}):(g.current=p.create({trigger:t.current,start:"top bottom",end:"bottom bottom",scrub:!0,onUpdate:l=>{const a=l.progress*20-20;c.set(o.current,{yPercent:a})}}),d.current=p.create({trigger:t.current,start:"top top",end:"bottom top",scrub:!0,onUpdate:l=>{const a=l.progress*20;c.set(o.current,{yPercent:a})}}))}return N&&E(),()=>{m.current&&m.current.kill(),g.current&&g.current.kill(),d.current&&d.current.kill()}},[N]),e("div",{ref:B,"data-ui-component-id":"CollectionsBanner",children:$("div",{ref:t,className:u(z==="dark"?"aiui-dark":"","text-info-primary relative w-full overflow-hidden","lg-desktop:aspect-[1920/480] desktop:aspect-[1440/384] laptop:aspect-[1024/400] tablet:aspect-[768/480] aspect-[390/430]",M),children:[k&&e("a",{tabIndex:-1,"aria-hidden":"true","aria-label":r,className:"absolute inset-0 z-10","data-headless-title-desc-button":`${r}#${n}`,"data-headless-type-name":`${f}#${b}`,href:J(k,`${f}_${b}`)}),e("div",{ref:o,className:u("absolute left-0 top-0 size-full"),children:S?e(Q,{poster:w?i?.url:T?y?.url||i?.url:v?.url,src:w?i?.url:T?y?.url||i?.url:v?.url,className:"laptop:w-full h-full",videoClassName:"h-full object-cover",muted:!0,loop:!0,playsInline:!0}):e(A,{loading:"eager",fetchPriority:"high",className:"laptop:w-full h-full",imgClassName:"h-full object-cover",alt:h?.alt||"",source:`${h?.url||""} , ${L?.url??(x?.url||"")} 1024, ${x?.url||""} 767`})}),e("div",{className:"laptop:top-1/2 laptop:-translate-y-1/2 tablet:px-8 laptop:px-16 lg-desktop:px-[calc(50%-832px)] lg-desktop:gap-8 absolute top-24 md-tablet:top-8 z-10 flex flex-col gap-6 px-4",children:$("div",{className:"laptop:text-left max-w-[686px]",children:[r&&e(P,{as:"h2",size:5,className:u("font-bold hero-banner-title"),html:r}),n&&e(P,{as:"h3",className:u("hero-banner-subtitle font-heading lg-desktop:text-lg desktop:text-base laptop:mt-2 lg-desktop:mt-4 mt-1 text-sm font-bold"),html:n})]})})]})})});V.displayName="CollectionsBanner";var de=F(V);export{de as default};
2
+ //# sourceMappingURL=index.js.map
@@ -0,0 +1,7 @@
1
+ {
2
+ "version": 3,
3
+ "sources": ["../../../../src/biz-components/CollectionsBanner/index.tsx"],
4
+ "sourcesContent": ["'use client'\nimport React, { useImperativeHandle, useRef, useState, useEffect } from 'react'\nimport gsap from 'gsap'\nimport { ScrollTrigger } from 'gsap/dist/ScrollTrigger'\nimport type { CollectionsBannerProps } from './types.js'\nimport { useMediaQuery } from 'react-responsive'\nimport { useInView } from 'react-intersection-observer'\nimport ScrollLoadVideo from '../../helpers/ScrollLoadVideo.js'\nimport { Button, Heading, Picture, Text } from '../../components/index.js'\nimport { cn } from '../../helpers/index.js'\nimport { withLayout } from '../../shared/Styles.js'\nimport { useExposure } from '../../hooks/useExposure.js'\nimport { trackUrlRef } from '../../shared/trackUrlRef.js'\nimport { sizeMap } from '../../components/button.js'\nimport { VideoModal } from '../VideoModal/index.js'\n\nconst componentType = 'image'\nconst componentName = 'collections_banner'\n\nconst CollectionsBanner = React.forwardRef<HTMLDivElement, CollectionsBannerProps>(({ data, className }, ref) => {\n const {\n title,\n subtitle,\n pcImage,\n padImage,\n mobileImage,\n pcVideo,\n padVideo,\n mobileVideo,\n isShowVideo,\n theme = 'light',\n blockLink,\n } = data\n\n const isMobile = useMediaQuery({ query: '(max-width: 768px)' })\n const isPad = useMediaQuery({ query: '(max-width: 1024px)' })\n const { ref: inViewRef, inView } = useInView()\n const scrollTriggerRef = useRef<ScrollTrigger | null>(null)\n const bgTriggerRef = useRef<ScrollTrigger | null>(null)\n const boxTriggerRef = useRef<ScrollTrigger | null>(null)\n\n const bgRef = useRef<HTMLImageElement>(null)\n const boxRef = useRef<HTMLDivElement>(null)\n\n useExposure(boxRef, {\n componentType,\n componentName,\n componentTitle: title,\n componentDescription: subtitle,\n })\n\n useImperativeHandle(ref, () => boxRef.current as HTMLDivElement)\n\n useEffect(() => {\n gsap.registerPlugin(ScrollTrigger)\n function gsapResize() {\n if (!bgRef.current) return\n const clientHeight = boxRef.current?.clientHeight || 100\n const screenHeight = window.innerHeight\n\n if (screenHeight <= clientHeight) {\n scrollTriggerRef.current = ScrollTrigger.create({\n trigger: boxRef.current,\n start: 'top bottom',\n end: 'bottom top',\n scrub: true,\n onUpdate: (self: any) => {\n const base = 40\n const value = self.progress * base - base / 2\n gsap.set(bgRef.current, { yPercent: value })\n },\n })\n } else {\n boxTriggerRef.current = ScrollTrigger.create({\n trigger: boxRef.current,\n start: 'top bottom',\n end: 'bottom bottom',\n scrub: true,\n onUpdate: (self: any) => {\n const base = 20\n const value = self.progress * base - base\n gsap.set(bgRef.current, { yPercent: value })\n },\n })\n bgTriggerRef.current = ScrollTrigger.create({\n trigger: boxRef.current,\n start: 'top top',\n end: 'bottom top',\n scrub: true,\n onUpdate: (self: any) => {\n const base = 20\n const value = self.progress * base\n gsap.set(bgRef.current, { yPercent: value })\n },\n })\n }\n }\n if (inView) gsapResize()\n return () => {\n scrollTriggerRef.current && scrollTriggerRef.current.kill()\n boxTriggerRef.current && boxTriggerRef.current.kill()\n bgTriggerRef.current && bgTriggerRef.current.kill()\n }\n }, [inView])\n\n return (\n <div ref={inViewRef} data-ui-component-id=\"CollectionsBanner\">\n <div\n ref={boxRef}\n className={cn(\n theme === 'dark' ? 'aiui-dark' : '',\n 'text-info-primary relative w-full overflow-hidden',\n 'lg-desktop:aspect-[1920/480] desktop:aspect-[1440/384] laptop:aspect-[1024/400] tablet:aspect-[768/480] aspect-[390/430]',\n className\n )}\n >\n {blockLink && (\n <a\n tabIndex={-1}\n aria-hidden=\"true\"\n aria-label={title}\n className=\"absolute inset-0 z-10\"\n data-headless-title-desc-button={`${title}#${subtitle}`}\n data-headless-type-name={`${componentType}#${componentName}`}\n href={trackUrlRef(blockLink, `${componentType}_${componentName}`)}\n />\n )}\n <div ref={bgRef} className={cn('absolute left-0 top-0 size-full')}>\n {isShowVideo ? (\n <ScrollLoadVideo\n poster={isMobile ? mobileVideo?.url : isPad ? padVideo?.url || mobileVideo?.url : pcVideo?.url}\n src={\n isMobile\n ? (mobileVideo?.url as string)\n : isPad\n ? (padVideo?.url as string) || (mobileVideo?.url as string)\n : (pcVideo?.url as string)\n }\n className=\"laptop:w-full h-full\"\n videoClassName=\"h-full object-cover\"\n muted\n loop\n playsInline\n />\n ) : (\n <Picture\n loading=\"eager\"\n fetchPriority=\"high\"\n className=\"laptop:w-full h-full\"\n imgClassName=\"h-full object-cover\"\n alt={pcImage?.alt || ''}\n source={`${pcImage?.url || ''} , ${padImage?.url ?? (mobileImage?.url || '')} 1024, ${mobileImage?.url || ''} 767`}\n />\n )}\n </div>\n\n {/* \u5185\u5BB9\u533A\u57DF */}\n <div className=\"laptop:top-1/2 laptop:-translate-y-1/2 tablet:px-8 laptop:px-16 lg-desktop:px-[calc(50%-832px)] lg-desktop:gap-8 absolute top-24 md-tablet:top-8 z-10 flex flex-col gap-6 px-4\">\n <div className=\"laptop:text-left max-w-[686px]\">\n {title && <Heading as=\"h2\" size={5} className={cn('font-bold hero-banner-title')} html={title} />}\n {subtitle && (\n <Heading\n as=\"h3\"\n className={cn(\n 'hero-banner-subtitle font-heading lg-desktop:text-lg desktop:text-base laptop:mt-2 lg-desktop:mt-4 mt-1 text-sm font-bold'\n )}\n html={subtitle}\n />\n )}\n </div>\n </div>\n </div>\n </div>\n )\n})\n\nCollectionsBanner.displayName = 'CollectionsBanner'\n\nexport default withLayout(CollectionsBanner)\n"],
5
+ "mappings": "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",
6
+ "names": ["jsx", "jsxs", "React", "useImperativeHandle", "useRef", "useEffect", "gsap", "ScrollTrigger", "useMediaQuery", "useInView", "ScrollLoadVideo", "Heading", "Picture", "cn", "withLayout", "useExposure", "trackUrlRef", "componentType", "componentName", "CollectionsBanner", "data", "className", "ref", "title", "subtitle", "pcImage", "padImage", "mobileImage", "pcVideo", "padVideo", "mobileVideo", "isShowVideo", "theme", "blockLink", "isMobile", "isPad", "inViewRef", "inView", "scrollTriggerRef", "bgTriggerRef", "boxTriggerRef", "bgRef", "boxRef", "gsapResize", "clientHeight", "self", "value", "CollectionsBanner_default"]
7
+ }
@@ -0,0 +1,43 @@
1
+ import type { ButtonProps } from '../../components/button.js';
2
+ import type { Media, Theme } from '../../types/props.js';
3
+ export interface CollectionsBannerProps {
4
+ data: {
5
+ /** 主标题 */
6
+ title: string;
7
+ /** 副标题/描述文本 */
8
+ subtitle: string;
9
+ pcImage: Media;
10
+ padImage?: Media;
11
+ mobileImage: Media;
12
+ pcVideo?: Media;
13
+ padVideo?: Media;
14
+ mobileVideo?: Media;
15
+ isShowVideo?: boolean;
16
+ blockLink?: string;
17
+ /** 主按钮文本和配置 */
18
+ primaryButton?: {
19
+ text: string;
20
+ link?: string;
21
+ } & Omit<ButtonProps, 'children'>;
22
+ /** 次要按钮文本和配置 */
23
+ secondaryButton?: {
24
+ text: string;
25
+ link?: string;
26
+ isShowPlayVideoButton?: boolean;
27
+ playVideoButtonText?: string;
28
+ playIcon?: boolean;
29
+ videoUrl?: Media;
30
+ youtubeId?: string;
31
+ } & Omit<ButtonProps, 'children'>;
32
+ /** 主题 */
33
+ theme?: Theme;
34
+ /** 大小, 默认default,单banner, 可选sm, 用于多banner场景 */
35
+ size?: 'default' | 'sm';
36
+ /** 底部产品列表 */
37
+ caption?: Array<{
38
+ title: string;
39
+ }>;
40
+ };
41
+ /** 自定义类名 */
42
+ className?: string;
43
+ }
@@ -0,0 +1 @@
1
+ //# sourceMappingURL=types.js.map
@@ -0,0 +1,7 @@
1
+ {
2
+ "version": 3,
3
+ "sources": [],
4
+ "sourcesContent": [],
5
+ "mappings": "",
6
+ "names": []
7
+ }
@@ -0,0 +1,19 @@
1
+ /// <reference types="react" />
2
+ type FilterCardWrapProps = {
3
+ isSale?: boolean;
4
+ result?: any;
5
+ total: number;
6
+ shopifyData?: any;
7
+ currentPage?: number;
8
+ closeFilter: boolean;
9
+ page: number;
10
+ metafields: any;
11
+ noResultNode?: React.ReactNode;
12
+ refreshStarRating?: () => void;
13
+ onPrimaryChange?: (item: any, sku: string) => void;
14
+ onSecondaryChange?: (item: any, sku: string) => void;
15
+ onNextPage?: (v: string) => void;
16
+ onPrevPage?: (v: string) => void;
17
+ };
18
+ declare const _default: import("react").ForwardRefExoticComponent<FilterCardWrapProps & import("react").RefAttributes<unknown>>;
19
+ export default _default;
@@ -0,0 +1,2 @@
1
+ import{jsx as r,jsxs as v}from"react/jsx-runtime";import{cn as h}from"../../helpers/utils.js";import{useMediaQuery as B}from"react-responsive";import q from"./FilterCardWrapItem";import{useRef as A,useState as O,useEffect as m,forwardRef as V,useImperativeHandle as Y}from"react";import{cloneDeep as E}from"es-toolkit";const H=(F,I)=>{const{shopifyData:w={},isSale:y=!1,total:N,result:o,closeFilter:p,page:f,metafields:x,noResultNode:D,refreshStarRating:L,onPrimaryChange:R,onSecondaryChange:M,onNextPage:b,onPrevPage:j}=F,{advertisingSpace:C}=x,{buttonText:T,loadMoreText:W}=w,c=C||w?.advertisingSpace,S=A(null),[i,u]=O([]),s=B({query:"(max-width: 1024px)"}),P=n=>{const e=E(n||[]);if(c){const t=e.findIndex(g=>g.mImage);if(t===-1){const g=Math.min(p?c?.maxLocation||7:c?.minLocation||5,e.length);e.splice(g,0,c)}else{e.splice(t,1);const g=Math.min(p?c?.maxLocation||7:c?.minLocation||5,e.length);e.splice(g,0,c)}}return e};Y(I,()=>({clearData(){u([])}}));const k=()=>{const n=S.current;if(!n)return;const e=n.getBoundingClientRect()?.top+window?.pageYOffset-120;window?.scrollTo?.({top:e,behavior:"smooth"})},z=n=>n?.metafields?.seoSetting?.noindex;return m(()=>{(o?.slug||o?.id)&&((f===1||!s)&&u([]),o?.products&&u(n=>{const e=o.products?.filter?.(a=>!n.some(l=>l.id===a.id));let t=[...n,...e];const g=t.filter?.(a=>!(!a?.metafields?.seoSetting?.noindex&&a.availableForSale&&a?.variants?.some(l=>l.availableForSale)));return t=t.filter?.(a=>!a?.metafields?.seoSetting?.noindex&&a.availableForSale&&a?.variants?.some(l=>l.availableForSale)),t.push(...g),y&&(t=t.filter?.(a=>{let l=!1;if(a?.options?.find(d=>d?.displayName==="color"))l=a?.variants?.find(d=>d?.coupons?.length&&d?.coupons?.[0]&&typeof d?.coupons?.[0]=="object");else{const d=a?.variants?.[0]?.coupons;l=d?.length&&d?.[0]&&typeof d?.[0]=="object"}return!!l})),t?.length&&(f===1&&!s||s)&&(t=P(t)),t}))},[o?.products,f,s,C,y]),m(()=>{i?.length&&f===1&&!s&&u(P(i))},[p]),m(()=>{const n=document?.querySelector?.(".yotpo-reviews-star-ratings-widget");i?.length&&(!n||s)&&L?.()},[i]),v("div",{className:"filter-card-wrap-container",ref:S,children:[r("div",{className:h("w-full grid gap-3 md-tablet:grid-cols-2 grid-cols-3",{"laptop:grid-cols-4 tablet:grid-cols-3":p&&!s,"laptop:grid-cols-3 tablet:grid-cols-2":!p&&!s},"filter-card-wrap"),children:i?.map?.(n=>z(n)?null:r(q,{data:n,buttonText:T,metafields:x,onPrimaryChange:(e,t)=>R?.(e,t),onSecondaryChange:(e,t)=>M?.(e,t)},n.id))}),!i?.length&&D,s&&o?.pageInfo?.hasNextPage?v("div",{onClick:()=>{b?.(o?.pageInfo?.endCursor)},className:"mt-6 text-sm font-bold cursor-pointer flex items-center justify-center gap-1 filter-card-wrap-more",children:[r("span",{children:W||"View More"}),r("svg",{xmlns:"http://www.w3.org/2000/svg",width:"12",height:"6",viewBox:"0 0 12 6",fill:"none",children:r("path",{d:"M9.96967 0.21967C10.2626 -0.0732232 10.7373 -0.073223 11.0302 0.21967C11.3231 0.512563 11.3231 0.987324 11.0302 1.28022L6.53022 5.78022C6.23732 6.07311 5.76256 6.07311 5.46967 5.78022L0.96967 1.28022C0.676777 0.987324 0.676777 0.512563 0.96967 0.21967C1.26256 -0.0732233 1.73732 -0.0732233 2.03022 0.21967L5.99994 4.1894L9.96967 0.21967Z",fill:"#1D1D1F"})})]}):null,!s&&N>18?v("div",{className:"mt-6 flex items-center justify-end gap-4 cursor-pointer",children:[r("button",{name:"perv page",disabled:!o?.pageInfo?.hasPreviousPage||!i?.length,className:h("flex items-center justify-center lg-desktop:size-14 size-10 rounded-full leading-tight overflow-hidden bg-transparent border-[1.5px] border-[#3D3D3F]",{"opacity-50 cursor-not-allowed":!o?.pageInfo?.hasPreviousPage||!i?.length}),onClick:()=>{k?.(),j?.(o?.pageInfo?.startCursor)},children:r("svg",{xmlns:"http://www.w3.org/2000/svg",width:"20",height:"20",viewBox:"0 0 20 20",fill:"none",children:r("path",{d:"M12 5L7 10L12 15",stroke:"#3D3D3F","stroke-width":"1.66667","stroke-linecap":"round","stroke-linejoin":"round"})})}),r("button",{name:"next page",className:h("flex items-center justify-center lg-desktop:size-14 size-10 rounded-full leading-tight overflow-hidden bg-transparent border-[1.5px] border-[#3D3D3F]",{"opacity-50 cursor-not-allowed":!o?.pageInfo?.hasNextPage||!i?.length}),disabled:!o?.pageInfo?.hasNextPage||!i?.length,onClick:()=>{k?.(),b?.(o?.pageInfo?.endCursor)},children:r("svg",{xmlns:"http://www.w3.org/2000/svg",width:"20",height:"20",viewBox:"0 0 20 20",fill:"none",children:r("path",{d:"M7.5 5L12.5 10L7.5 15",stroke:"#3D3D3F","stroke-width":"1.66667","stroke-linecap":"round","stroke-linejoin":"round"})})})]}):null]})};var X=V(H);export{X as default};
2
+ //# sourceMappingURL=FilterCardWrap.js.map
@@ -0,0 +1,7 @@
1
+ {
2
+ "version": 3,
3
+ "sources": ["../../../../src/biz-components/CollectionsFilters/FilterCardWrap.tsx"],
4
+ "sourcesContent": ["import { cn } from '../../helpers/utils.js'\nimport { useMediaQuery } from 'react-responsive'\nimport FilterCardWrapItem from './FilterCardWrapItem'\nimport { useRef, useState, useEffect, forwardRef, useImperativeHandle } from 'react'\nimport type { Ref } from 'react'\nimport { cloneDeep } from 'es-toolkit'\n\ntype FilterCardWrapProps = {\n isSale?: boolean\n result?: any\n total: number\n shopifyData?: any\n currentPage?: number\n closeFilter: boolean\n page: number\n metafields: any\n noResultNode?: React.ReactNode\n refreshStarRating?: () => void\n onPrimaryChange?: (item: any, sku: string) => void\n onSecondaryChange?: (item: any, sku: string) => void\n onNextPage?: (v: string) => void\n onPrevPage?: (v: string) => void\n}\n\nconst FilterCardWrap = (props: FilterCardWrapProps, ref: Ref<unknown> | undefined) => {\n const {\n shopifyData = {},\n isSale = false,\n total,\n result,\n closeFilter,\n page,\n metafields,\n noResultNode,\n refreshStarRating,\n onPrimaryChange,\n onSecondaryChange,\n onNextPage,\n onPrevPage,\n } = props\n const { advertisingSpace } = metafields\n const { buttonText, loadMoreText } = shopifyData\n\n const currentAdvertisingSpace = advertisingSpace || shopifyData?.advertisingSpace\n\n const filterCardWrapRef = useRef<any>(null)\n\n const [data, setData] = useState<any[]>([])\n\n const isMobile = useMediaQuery({ query: '(max-width: 1024px)' })\n\n const handleAdvertisingSpace = (products: any[]) => {\n const updatedProducts = cloneDeep(products || [])\n if (currentAdvertisingSpace) {\n const findIndex = updatedProducts.findIndex(item => item.mImage)\n if (findIndex === -1) {\n const insertIndex = closeFilter\n ? Math.min(currentAdvertisingSpace?.maxLocation || 7, updatedProducts.length)\n : Math.min(currentAdvertisingSpace?.minLocation || 5, updatedProducts.length)\n updatedProducts.splice(insertIndex, 0, currentAdvertisingSpace)\n } else {\n updatedProducts.splice(findIndex, 1)\n const insertIndex = closeFilter\n ? Math.min(currentAdvertisingSpace?.maxLocation || 7, updatedProducts.length)\n : Math.min(currentAdvertisingSpace?.minLocation || 5, updatedProducts.length)\n updatedProducts.splice(insertIndex, 0, currentAdvertisingSpace)\n }\n }\n return updatedProducts\n }\n\n useImperativeHandle(ref, () => ({\n clearData() {\n setData([])\n },\n }))\n\n const onScrollTop = () => {\n const target = filterCardWrapRef.current\n if (!target) return\n const targetY = target.getBoundingClientRect()?.top + window?.pageYOffset - 120\n window?.scrollTo?.({\n top: targetY,\n behavior: 'smooth',\n })\n }\n\n const hasNoIndex = (product: { metafields: { seoSetting: { noindex: any } } }) => {\n return product?.metafields?.seoSetting?.noindex\n }\n\n // \u5904\u7406\u4EA7\u54C1\u6570\u636E\n useEffect(() => {\n if (result?.slug || result?.id) {\n if (page === 1 || !isMobile) {\n setData([])\n }\n if (result?.products) {\n setData(prevProducts => {\n // \u68C0\u67E5\u662F\u5426\u5DF2\u7ECF\u5B58\u5728\u4E8E prevProducts \u4E2D\uFF0C\u907F\u514D\u91CD\u590D\u6DFB\u52A0\n const newProducts = result.products?.filter?.(\n (product: { id: any }) => !prevProducts.some(prev => prev.id === product.id)\n )\n let updatedProducts = [...prevProducts, ...newProducts]\n /** \u5DF2\u552E\u5B8C\u7684\u4EA7\u54C1 */\n const soldOutProducts = updatedProducts.filter?.(\n item =>\n !(\n !item?.metafields?.seoSetting?.noindex &&\n item.availableForSale &&\n item?.variants?.some((item: { availableForSale: any }) => item.availableForSale)\n )\n )\n // \u8FC7\u6EE4\u6389 availableForSale \u4E3A false \u7684\u4EA7\u54C1\n updatedProducts = updatedProducts.filter?.(\n item =>\n !item?.metafields?.seoSetting?.noindex &&\n item.availableForSale &&\n item?.variants?.some((item: { availableForSale: any }) => item.availableForSale)\n )\n // \u5C06\u5DF2\u552E\u5B8C\u7684\u4EA7\u54C1\u6DFB\u52A0\u5230\u6700\u540E\n updatedProducts.push(...soldOutProducts)\n // \u5982\u679C\u662F\u6709\u6298\u6263\u7684\u4EA7\u54C1\uFF0C\u5219\u8FC7\u6EE4\u6389\u6CA1\u6709\u6298\u6263\u7684\u4EA7\u54C1\n if (isSale) {\n updatedProducts = updatedProducts.filter?.((item: any) => {\n let isShow = false\n const isColor = item?.options?.find((item: any) => item?.displayName === 'color')\n if (isColor) {\n isShow = item?.variants?.find(\n (params: any) =>\n params?.coupons?.length && params?.coupons?.[0] && typeof params?.coupons?.[0] === 'object'\n )\n } else {\n const isVariants = item?.variants?.[0]?.coupons\n isShow = isVariants?.length && isVariants?.[0] && typeof isVariants?.[0] === 'object'\n }\n return !!isShow\n })\n }\n // \u5982\u679C advertisingSpace \u5B58\u5728\u4E14\u5C1A\u672A\u6DFB\u52A0\u5230\u6570\u7EC4\u4E2D\n if (updatedProducts?.length && ((page === 1 && !isMobile) || isMobile)) {\n updatedProducts = handleAdvertisingSpace(updatedProducts)\n }\n return updatedProducts\n })\n }\n }\n }, [result?.products, page, isMobile, advertisingSpace, isSale])\n\n useEffect(() => {\n if (!data?.length) return\n if (page === 1 && !isMobile) {\n setData(handleAdvertisingSpace(data))\n }\n }, [closeFilter])\n\n useEffect(() => {\n const isClass = document?.querySelector?.('.yotpo-reviews-star-ratings-widget')\n if (data?.length && (!isClass || isMobile)) {\n refreshStarRating?.()\n }\n }, [data])\n return (\n <div className=\"filter-card-wrap-container\" ref={filterCardWrapRef}>\n <div\n className={cn(\n 'w-full grid gap-3 md-tablet:grid-cols-2 grid-cols-3',\n {\n 'laptop:grid-cols-4 tablet:grid-cols-3': closeFilter && !isMobile,\n 'laptop:grid-cols-3 tablet:grid-cols-2': !closeFilter && !isMobile,\n },\n 'filter-card-wrap'\n )}\n >\n {data?.map?.(item => {\n if (hasNoIndex(item)) return null\n return (\n <FilterCardWrapItem\n data={item}\n key={item.id}\n buttonText={buttonText}\n metafields={metafields}\n onPrimaryChange={(e, data) => onPrimaryChange?.(e, data)}\n onSecondaryChange={(e, data) => onSecondaryChange?.(e, data)}\n />\n )\n })}\n </div>\n {!data?.length && noResultNode}\n {isMobile && result?.pageInfo?.hasNextPage ? (\n <div\n onClick={() => {\n onNextPage?.(result?.pageInfo?.endCursor)\n }}\n className=\"mt-6 text-sm font-bold cursor-pointer flex items-center justify-center gap-1 filter-card-wrap-more\"\n >\n <span>{loadMoreText || 'View More'}</span>\n <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"12\" height=\"6\" viewBox=\"0 0 12 6\" fill=\"none\">\n <path\n d=\"M9.96967 0.21967C10.2626 -0.0732232 10.7373 -0.073223 11.0302 0.21967C11.3231 0.512563 11.3231 0.987324 11.0302 1.28022L6.53022 5.78022C6.23732 6.07311 5.76256 6.07311 5.46967 5.78022L0.96967 1.28022C0.676777 0.987324 0.676777 0.512563 0.96967 0.21967C1.26256 -0.0732233 1.73732 -0.0732233 2.03022 0.21967L5.99994 4.1894L9.96967 0.21967Z\"\n fill=\"#1D1D1F\"\n />\n </svg>\n </div>\n ) : null}\n {!isMobile && total > 18 ? (\n <div className=\"mt-6 flex items-center justify-end gap-4 cursor-pointer\">\n <button\n name=\"perv page\"\n disabled={!result?.pageInfo?.hasPreviousPage || !data?.length}\n className={cn(\n 'flex items-center justify-center lg-desktop:size-14 size-10 rounded-full leading-tight overflow-hidden bg-transparent border-[1.5px] border-[#3D3D3F]',\n {\n 'opacity-50 cursor-not-allowed': !result?.pageInfo?.hasPreviousPage || !data?.length,\n }\n )}\n onClick={() => {\n onScrollTop?.()\n onPrevPage?.(result?.pageInfo?.startCursor)\n }}\n >\n <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"20\" height=\"20\" viewBox=\"0 0 20 20\" fill=\"none\">\n <path\n d=\"M12 5L7 10L12 15\"\n stroke=\"#3D3D3F\"\n stroke-width=\"1.66667\"\n stroke-linecap=\"round\"\n stroke-linejoin=\"round\"\n />\n </svg>\n </button>\n <button\n name=\"next page\"\n className={cn(\n 'flex items-center justify-center lg-desktop:size-14 size-10 rounded-full leading-tight overflow-hidden bg-transparent border-[1.5px] border-[#3D3D3F]',\n {\n 'opacity-50 cursor-not-allowed': !result?.pageInfo?.hasNextPage || !data?.length,\n }\n )}\n disabled={!result?.pageInfo?.hasNextPage || !data?.length}\n onClick={() => {\n onScrollTop?.()\n onNextPage?.(result?.pageInfo?.endCursor)\n }}\n >\n <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"20\" height=\"20\" viewBox=\"0 0 20 20\" fill=\"none\">\n <path\n d=\"M7.5 5L12.5 10L7.5 15\"\n stroke=\"#3D3D3F\"\n stroke-width=\"1.66667\"\n stroke-linecap=\"round\"\n stroke-linejoin=\"round\"\n />\n </svg>\n </button>\n </div>\n ) : null}\n </div>\n )\n}\n\nexport default forwardRef(FilterCardWrap)\n"],
5
+ "mappings": "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",
6
+ "names": ["jsx", "jsxs", "cn", "useMediaQuery", "FilterCardWrapItem", "useRef", "useState", "useEffect", "forwardRef", "useImperativeHandle", "cloneDeep", "FilterCardWrap", "props", "ref", "shopifyData", "isSale", "total", "result", "closeFilter", "page", "metafields", "noResultNode", "refreshStarRating", "onPrimaryChange", "onSecondaryChange", "onNextPage", "onPrevPage", "advertisingSpace", "buttonText", "loadMoreText", "currentAdvertisingSpace", "filterCardWrapRef", "data", "setData", "isMobile", "handleAdvertisingSpace", "products", "updatedProducts", "findIndex", "item", "insertIndex", "onScrollTop", "target", "targetY", "hasNoIndex", "product", "prevProducts", "newProducts", "prev", "soldOutProducts", "isShow", "params", "isVariants", "isClass", "FilterCardWrap_default"]
7
+ }
@@ -0,0 +1,10 @@
1
+ type FilterCardWrapItemProps = {
2
+ data: any;
3
+ buttonText?: any;
4
+ itemShape?: string;
5
+ metafields: any;
6
+ onPrimaryChange?: (item: any, sku: string) => void;
7
+ onSecondaryChange?: (item: any, sku: string) => void;
8
+ };
9
+ declare const FilterCardWrapItem: ({ data, buttonText, itemShape, metafields, onPrimaryChange, onSecondaryChange, }: FilterCardWrapItemProps) => import("react/jsx-runtime").JSX.Element;
10
+ export default FilterCardWrapItem;
@@ -0,0 +1,2 @@
1
+ import{Fragment as Ne,jsx as t,jsxs as m}from"react/jsx-runtime";import{cn as b,atobID as fe,yotpoInstanceId as be}from"../../helpers/utils.js";import{useAiuiContext as ge}from"../AiuiProvider/index.js";import{formatVariantPrice as xe}from"../ShelfDisplay/shelfDisplay.js";import ye from"../../components/badge.js";import{Text as ve}from"../../components/text.js";import R from"../../components/button.js";import V from"../../components/picture.js";import{trackUrlRef as N}from"../../shared/trackUrlRef.js";import{getFunctionMemberPrice as he}from"./component/price.js";import{useState as n,useEffect as w}from"react";const S="image",$="product_shelf",_e=999999999e-2,ke=e=>{let u;return e?.includes("products")?u=e?.split("products")[0]+"files/":u=e?.replace(e?.split("files")?.pop()||"","")+"/",u},Ce=({data:e,buttonText:u,itemShape:q,metafields:G,onPrimaryChange:J,onSecondaryChange:K})=>{const{memberPriceDiscount:Q,memberSetting:P,discounts:I,shopCommon:X}=G,[p,T]=n(""),[Y,B]=n(""),[f,M]=n(""),[z,Z]=n(!1),[L,ee]=n({}),[te,oe]=n(!1),[W,se]=n({price:"",basePrice:""}),[j,re]=n([]),[ne,le]=n([]),[g,ie]=n(""),[ae,ce]=n(""),{locale:l="us",currencyCode:de,isLogin:F}=ge(),v=e?.custom_name||e?.title||e?.name,O=e?.custom_description||e?.description||e?.descriptionHtml,a=e?.filter_variants||e?.variants||[],D=fe(e?.id||""),H=e?.images?.[0]?.url,me=o=>M(o),h=(o,r,s,i)=>{oe(i),ie(o||""),se({basePrice:r||"",price:s||""})};return w(()=>{if(f){const s=a?.find(i=>i?.name?.includes?.(f));T(s?.sku||a?.[0]?.sku||""),B(s?.image?.url||a?.[0]?.image?.url||"");return}const o=e?.options?.find(s=>s?.displayName==="color")?.values?.[0]?.label;o&&M(o);const r=a?.find(s=>s?.name?.includes?.(o));T(r?.sku||a?.[0]?.sku||""),B(r?.image?.url||a?.[0]?.image?.url||"")},[f]),w(()=>{if(!p)return;re(e?.tags||[]);const o=a?.find(c=>c?.sku===p)||a?.[0]||{};ee(o),Z(!o?.availableForSale||o?.price?.amount===_e);const{infos:r}=o?.metafields||{},{productInfos:s,preRender:i}=e?.metafields||{};ce(r?.comingSoon||s?.comingSoon||i?.soldOut||X?.soldOut||"");const x=o?.coupons?.[0],{price:A,basePrice:U,discount:ue,discountAmount:pe}=xe({locale:l,amount:x?x.variant_price4wscode:o.price,baseAmount:x?o.price:0,currencyCode:e?.price?.currencyCode||"USD"}),E=(()=>{if(x?.value_type==="fixed_amount"){const c=pe||"",y=c.match(/^(.*?)(\d[\d.,]*)(.*)$/);if(y){const[,_,d,k]=y;let C=d;return d.endsWith(".00")?C=d.replace(/\.00$/,""):d.endsWith(",00")&&(C=d.replace(/,00$/,"")),`${_}${C}${k}`}return c}return ue||""})();if(F){const c=he({locale:l,variant:o,shopMemberPriceDiscountConfig:Q,currencyCode:de||e?.price?.currencyCode||"USD"});if(c){const{hasMemberPrice:y,salePriceWithCurrency:_,originalPriceWithCurrency:d,savePriceWithCurrency:k}=c;h(k||"",d||"",y?_:"",c?.hasMemberPrice)}else h(E,U||"",A||"",!1)}else h(E,U||"",A||"",!1)},[e,p]),w(()=>{let o=[];if(g){const s=`${g} ${I?.off}`;o.push(s)}const r=j?.filter?.(s=>s?.startsWith?.("CLtag"))?.map?.(s=>s?.replace?.("CLtag:",""))?.slice?.(0,g?1:2);le(o.concat(r))},[j,g]),t("div",{className:b(q==="round"?"rounded-2xl":"rounded-none","tablet:hover:bg-info-white bg-container-secondary-1 box-border w-full cursor-pointer overflow-hidden duration-300",{"aiui-dark":e.theme==="dark"}),children:e?.mImage?t("div",{className:"size-full box-border overflow-hidden hover:[&_img]:scale-105",children:t("div",{className:"relative inset-0 size-full",children:m("a",{className:"size-full",href:N(e?.link,`${S}_${$}`),children:[t(V,{alt:"",source:e?.mImage?.url||e?.mImage,className:"size-full [&_img]:object-cover [&_img]:size-full",imgClassName:"size-full object-cover transition-all duration-300"}),m("div",{className:"desktop:p-6 absolute inset-x-0 top-0 box-border overflow-hidden p-4",children:[t("p",{className:"desktop:mb-2 mb-1 text-info-primary desktop:text-base text-sm font-bold",dangerouslySetInnerHTML:{__html:e?.subTitle}}),t("span",{className:"text-info-secondary desktop:text-[32px] text-[20px] font-bold desktop:leading-9 line-clamp-4 leading-6",dangerouslySetInnerHTML:{__html:e?.title}})]})]})})}):m("div",{className:"size-full desktop:p-6 desktop:pt-4 box-border overflow-hidden flex flex-col justify-between tablet:p-4 p-2 pb-4",children:[t("div",{className:"min-h-6 flex flex-wrap gap-1 overflow-hidden collection-filter-tags",children:ne?.map?.((o,r)=>t(ye,{className:"whitespace-nowrap max-w-full truncate px-1 box-border font-bold item-badge",children:o},r))}),t("a",{target:"_blank","aria-label":v,className:"my-1",href:N(`${l==="us"||!l?"":`/${l}`}/products/${e?.handle}`,`${S}_${$}`),children:t("div",{className:b("m-auto desktop:size-[196px] size-[120px] overflow-hidden"),children:t(V,{alt:"",source:Y,className:"h-full [&_img]:object-cover [&_img]:h-full [&_img]:w-fit"})})}),e?.options?.map(o=>{if(o?.displayName==="color")return t("div",{className:"flex items-center gap-1",children:o?.values?.map(r=>{const s=r?.hexColors?r.hexColors?.[0]:r?.label,i=s.startsWith("#")?s:"";return t("button",{onClick:()=>me(r?.label),className:b("size-4 rounded-full cursor-pointer overflow-hidden",`${f===r?.label?"border-[#00BEFA]":""}`),children:t("span",{className:b("h-full w-full overflow-hidden border-[0.5px] border-transparent","relative flex items-center justify-center overflow-hidden rounded-full",f===r?.label&&"border-[#ddd]"),style:i?{backgroundColor:i}:{},children:!i&&H&&t("img",{alt:s,className:"h-full w-full object-cover",src:`${ke(H)}${s?.toLowerCase().split(" ")?.join("-")}_50x.png`})})},r?.label)})})}),m("div",{children:[v?t("span",{dangerouslySetInnerHTML:{__html:v||""},className:"shelf-display-product-title line-clamp-2 lg-desktop:text-2xl laptop:text-xl text-base font-bold"}):null,e?.metafields?.judgemeBadge?t("a",{target:"_blank",className:"font-bold text-xs [&_.jdgm-star]:text-[#F77234]",dangerouslySetInnerHTML:{__html:e?.metafields?.judgemeBadge},href:N(`${l==="us"||!l?"":`/${l}`}/products/${e?.handle}`,`${S}_${$}`)}):t("div",{className:"w-full truncate font-bold yotpo-widget-instance [&_.yotpo-sr-bottom-line-new-review]:hidden [&_.yotpo-sr-bottom-line-text]:!text-xs [&_.yotpo-sr-bottom-line-text]:!pt-0 [&_.yotpo-sr-bottom-line-summary]:!items-center [&_.yotpo-sr-bottom-line-summary_span]:!h-auto [&_.yotpo-sr-bottom-line-summary_svg]:!mr-[3px]","data-yotpo-instance-id":be(l),"data-yotpo-product-id":D,"data-yotpo-cart-product-id":D,"data-yotpo-section-id":""}),O?t(ve,{size:2,html:O||"",className:"desktop:text-base laptop:text-sm shelf-display-product-description line-clamp-1 text-xs font-bold"}):null,m("div",{className:"mt-3 mb-2",children:[t("p",{dangerouslySetInnerHTML:{__html:F&&te&&(I?.memberPrice||P?.member_price||P?.plus_member_price)||""},className:"text-info-primary lg-desktop:text-lg desktop:text-base laptop:text-sm text-xs font-bold"}),t("div",{className:"flex items-center",children:z?t("div",{className:"desktop:text-2xl tablet:text-xl text-info-primary text-base font-bold",children:ae||""}):m(Ne,{children:[t("div",{className:"final-price desktop:text-2xl tablet:text-xl text-info-primary text-base font-bold",children:L?.availableForSale&&W?.price||""}),t("div",{className:"origin-price desktop:text-xl tablet:text-lg text-info-secondary ml-1 text-sm font-bold line-through",children:L?.availableForSale&&W?.basePrice||""})]})})]}),m("div",{className:b("shelf-flex-button-group","lg-desktop:gap-3 flex items-center gap-2 m-tablet:flex-col"),children:[t(R,{variant:"secondary",className:"m-tablet:w-full font-bold",onClick:()=>K?.(e,p),children:u?.secondaryButton||"Learn More"}),t(R,{variant:"primary",className:"m-tablet:w-full font-bold",disabled:z,onClick:()=>J?.(e,p),children:u?.primaryButton||"Shop Now"})]})]})]})},e?.id||e?.handle)};var We=Ce;export{We as default};
2
+ //# sourceMappingURL=FilterCardWrapItem.js.map
@@ -0,0 +1,7 @@
1
+ {
2
+ "version": 3,
3
+ "sources": ["../../../../src/biz-components/CollectionsFilters/FilterCardWrapItem.tsx"],
4
+ "sourcesContent": ["import { cn, atobID, yotpoInstanceId } from '../../helpers/utils.js'\nimport { useAiuiContext } from '../AiuiProvider/index.js'\nimport { formatVariantPrice } from '../ShelfDisplay/shelfDisplay.js'\nimport Badge from '../../components/badge.js'\nimport { Text } from '../../components/text.js'\nimport Button from '../../components/button.js'\nimport Picture from '../../components/picture.js'\nimport { trackUrlRef } from '../../shared/trackUrlRef.js'\nimport { getFunctionMemberPrice } from './component/price.js'\nimport { useState, useEffect } from 'react'\n\nconst componentType = 'image'\nconst componentName = 'product_shelf'\n\nconst SOLD_OUT_PRICE = 9999999.99\n\nconst getShopifyCdnBaseUrl = (imagePath: string | null) => {\n // \u76EE\u524D\u77E5\u9053\u7684 shopify \u56FE\u7247\u8DEF\u7531\u7684\u5F62\u5F0F\n // https://cdn.shopify.com/s/files/1/0493/9834/9974/files/Group_5581_2.jpg?v=1662379184\n // https://cdn.shopify.com/s/files/1/0493/9834/9974/products/B2633123.jpg?v=1631264041_3840x\n // \u8FD4\u56DE https://cdn.shopify.com/s/files/1/0493/9834/9974/files/\n let path\n if (imagePath?.includes('products')) {\n path = imagePath?.split('products')[0] + 'files/'\n } else {\n path = imagePath?.replace(imagePath?.split('files')?.pop() || '', '') + '/'\n }\n return path\n}\n\ntype FilterCardWrapItemProps = {\n data: any\n buttonText?: any\n itemShape?: string\n metafields: any\n onPrimaryChange?: (item: any, sku: string) => void\n onSecondaryChange?: (item: any, sku: string) => void\n}\n\nconst FilterCardWrapItem = ({\n data,\n buttonText,\n itemShape,\n metafields,\n onPrimaryChange,\n onSecondaryChange,\n}: FilterCardWrapItemProps) => {\n const { memberPriceDiscount, memberSetting, discounts, shopCommon } = metafields\n const [currentSku, setCurrentSku] = useState<string>('')\n const [currentImage, setCurrentImage] = useState<string>('')\n const [selectedColor, setSelectedColor] = useState<string>('')\n const [isSoldOut, setIsSoldOut] = useState<boolean>(false)\n const [currentVariant, setCurrentVariant] = useState<any>({})\n const [plusMemberStatus, setPlusMemberStatus] = useState<boolean>(false)\n const [priceCollection, setPriceCollection] = useState<{ price: string; basePrice: string }>({\n price: '',\n basePrice: '',\n })\n const [tags, setTags] = useState<string[]>([])\n const [showTags, setShowTags] = useState<string[]>([])\n const [discountCollection, setDiscountCollection] = useState<string>('')\n const [soldOutText, setSoldOutText] = useState<string>('')\n\n const { locale = 'us', currencyCode, isLogin } = useAiuiContext()\n\n const displayTitle = data?.custom_name || data?.title || data?.name\n const displayDescription = data?.custom_description || data?.description || data?.descriptionHtml\n const skuArray = data?.filter_variants || data?.variants || []\n const id = atobID(data?.id || '')\n\n const imagePath = data?.images?.[0]?.url\n\n const onColorClick = (color: string) => setSelectedColor(color)\n\n const handleBasePrice = (discount: string, priceCurrency: string, salePrice: string, status: boolean) => {\n setPlusMemberStatus(status)\n setDiscountCollection(discount || '')\n setPriceCollection({\n basePrice: priceCurrency || '',\n price: salePrice || '',\n })\n }\n\n useEffect(() => {\n if (selectedColor) {\n const findSku = skuArray?.find((item: any) => item?.name?.includes?.(selectedColor))\n setCurrentSku(findSku?.sku || skuArray?.[0]?.sku || '')\n setCurrentImage(findSku?.image?.url || skuArray?.[0]?.image?.url || '')\n return\n }\n const firstOption = data?.options?.find((item: any) => item?.displayName === 'color')?.values?.[0]?.label\n firstOption && setSelectedColor(firstOption)\n const findSku = skuArray?.find((item: any) => item?.name?.includes?.(firstOption))\n setCurrentSku(findSku?.sku || skuArray?.[0]?.sku || '')\n setCurrentImage(findSku?.image?.url || skuArray?.[0]?.image?.url || '')\n }, [selectedColor])\n\n useEffect(() => {\n if (!currentSku) return\n setTags(data?.tags || [])\n const variant = skuArray?.find((item: any) => item?.sku === currentSku) || skuArray?.[0] || {}\n setCurrentVariant(variant)\n setIsSoldOut(!variant?.availableForSale || variant?.price?.amount === SOLD_OUT_PRICE)\n const { infos } = variant?.metafields || {}\n const { productInfos, preRender } = data?.metafields || {}\n setSoldOutText(infos?.comingSoon || productInfos?.comingSoon || preRender?.soldOut || shopCommon?.soldOut || '')\n // active \u7684 \u901A\u7528\u6298\u6263\n const coupon = variant?.coupons?.[0]\n const { price, basePrice, discount, discountAmount } = formatVariantPrice({\n locale: locale,\n amount: coupon ? coupon.variant_price4wscode : variant.price,\n baseAmount: coupon ? variant.price : 0,\n currencyCode: data?.price?.currencyCode || 'USD',\n })\n const showPrice = (() => {\n if (coupon?.value_type === 'fixed_amount') {\n const amountStr = discountAmount || ''\n const match = amountStr.match(/^(.*?)(\\d[\\d.,]*)(.*)$/)\n if (match) {\n const [, prefix, numeric, suffix] = match\n let updatedNumeric = numeric\n if (numeric.endsWith('.00')) {\n updatedNumeric = numeric.replace(/\\.00$/, '')\n } else if (numeric.endsWith(',00')) {\n updatedNumeric = numeric.replace(/,00$/, '')\n }\n return `${prefix}${updatedNumeric}${suffix}`\n }\n return amountStr\n }\n return discount || ''\n })()\n // \u4F1A\u5458\u6298\u6263\n if (isLogin) {\n const result = getFunctionMemberPrice({\n locale: locale,\n variant: variant,\n shopMemberPriceDiscountConfig: memberPriceDiscount,\n currencyCode: currencyCode || data?.price?.currencyCode || 'USD',\n })\n if (result) {\n const { hasMemberPrice, salePriceWithCurrency, originalPriceWithCurrency, savePriceWithCurrency } = result\n handleBasePrice(\n savePriceWithCurrency || '',\n originalPriceWithCurrency || '',\n hasMemberPrice ? salePriceWithCurrency : '',\n result?.hasMemberPrice\n )\n } else {\n handleBasePrice(showPrice, basePrice || '', price || '', false)\n }\n } else {\n handleBasePrice(showPrice, basePrice || '', price || '', false)\n }\n }, [data, currentSku])\n\n // \u5904\u7406\u6807\u7B7E\n useEffect(() => {\n let handleTags: string[] = []\n if (discountCollection) {\n const discountTag = `${discountCollection} ${discounts?.off}`\n handleTags.push(discountTag)\n }\n const newTags = tags\n ?.filter?.((item: string) => item?.startsWith?.('CLtag'))\n ?.map?.((item: string) => item?.replace?.('CLtag:', ''))\n ?.slice?.(0, discountCollection ? 1 : 2)\n setShowTags(handleTags.concat(newTags))\n }, [tags, discountCollection])\n\n return (\n <div\n key={data?.id || data?.handle}\n className={cn(\n itemShape === 'round' ? 'rounded-2xl' : 'rounded-none',\n 'tablet:hover:bg-info-white bg-container-secondary-1 box-border w-full cursor-pointer overflow-hidden duration-300',\n {\n 'aiui-dark': data.theme === 'dark',\n }\n )}\n >\n {data?.mImage ? (\n <div className=\"size-full box-border overflow-hidden hover:[&_img]:scale-105\">\n <div className=\"relative inset-0 size-full\">\n <a className=\"size-full\" href={trackUrlRef(data?.link, `${componentType}_${componentName}`)}>\n <Picture\n alt=\"\"\n source={data?.mImage?.url || data?.mImage}\n className=\"size-full [&_img]:object-cover [&_img]:size-full\"\n imgClassName=\"size-full object-cover transition-all duration-300\"\n />\n <div className=\"desktop:p-6 absolute inset-x-0 top-0 box-border overflow-hidden p-4\">\n <p\n className=\"desktop:mb-2 mb-1 text-info-primary desktop:text-base text-sm font-bold\"\n dangerouslySetInnerHTML={{ __html: data?.subTitle }}\n />\n <span\n className=\"text-info-secondary desktop:text-[32px] text-[20px] font-bold desktop:leading-9 line-clamp-4 leading-6\"\n dangerouslySetInnerHTML={{ __html: data?.title }}\n />\n </div>\n </a>\n </div>\n </div>\n ) : (\n <div className=\"size-full desktop:p-6 desktop:pt-4 box-border overflow-hidden flex flex-col justify-between tablet:p-4 p-2 pb-4\">\n <div className=\"min-h-6 flex flex-wrap gap-1 overflow-hidden collection-filter-tags\">\n {showTags?.map?.((item: string, index: number) => (\n <Badge key={index} className=\"whitespace-nowrap max-w-full truncate px-1 box-border font-bold item-badge\">\n {item}\n </Badge>\n ))}\n </div>\n <a\n target=\"_blank\"\n aria-label={displayTitle}\n className=\"my-1\"\n href={trackUrlRef(\n `${locale === 'us' || !locale ? '' : `/${locale}`}/products/${data?.handle}`,\n `${componentType}_${componentName}`\n )}\n >\n <div className={cn('m-auto desktop:size-[196px] size-[120px] overflow-hidden')}>\n <Picture\n alt=\"\"\n source={currentImage}\n className=\"h-full [&_img]:object-cover [&_img]:h-full [&_img]:w-fit\"\n />\n </div>\n </a>\n {data?.options?.map((option: any) => {\n if (option?.displayName === 'color') {\n return (\n <div className=\"flex items-center gap-1\">\n {option?.values?.map((item: any) => {\n const color = item?.hexColors ? item.hexColors?.[0] : item?.label\n const hexColor = color.startsWith('#') ? color : ''\n return (\n <button\n key={item?.label}\n onClick={() => onColorClick(item?.label)}\n className={cn(\n 'size-4 rounded-full cursor-pointer overflow-hidden',\n `${selectedColor === item?.label ? 'border-[#00BEFA]' : ''}`\n )}\n >\n <span\n className={cn(\n 'h-full w-full overflow-hidden border-[0.5px] border-transparent',\n 'relative flex items-center justify-center overflow-hidden rounded-full',\n selectedColor === item?.label && 'border-[#ddd]'\n )}\n style={hexColor ? { backgroundColor: hexColor } : {}}\n >\n {!hexColor && imagePath && (\n <img\n alt={color}\n className=\"h-full w-full object-cover\"\n src={`${getShopifyCdnBaseUrl(imagePath)}${color\n ?.toLowerCase()\n .split(' ')\n ?.join('-')}_${'50x'}.png`}\n />\n )}\n </span>\n </button>\n )\n })}\n </div>\n )\n }\n })}\n <div>\n {displayTitle ? (\n <span\n dangerouslySetInnerHTML={{ __html: displayTitle || '' }}\n className=\"shelf-display-product-title line-clamp-2 lg-desktop:text-2xl laptop:text-xl text-base font-bold\"\n />\n ) : null}\n {data?.metafields?.judgemeBadge ? (\n <a\n target=\"_blank\"\n className=\"font-bold text-xs [&_.jdgm-star]:text-[#F77234]\"\n dangerouslySetInnerHTML={{ __html: data?.metafields?.judgemeBadge }}\n href={trackUrlRef(\n `${locale === 'us' || !locale ? '' : `/${locale}`}/products/${data?.handle}`,\n `${componentType}_${componentName}`\n )}\n />\n ) : (\n <div\n className=\"w-full truncate font-bold yotpo-widget-instance [&_.yotpo-sr-bottom-line-new-review]:hidden [&_.yotpo-sr-bottom-line-text]:!text-xs [&_.yotpo-sr-bottom-line-text]:!pt-0 [&_.yotpo-sr-bottom-line-summary]:!items-center [&_.yotpo-sr-bottom-line-summary_span]:!h-auto [&_.yotpo-sr-bottom-line-summary_svg]:!mr-[3px]\"\n data-yotpo-instance-id={yotpoInstanceId(locale)}\n data-yotpo-product-id={id}\n data-yotpo-cart-product-id={id}\n data-yotpo-section-id=\"\"\n />\n )}\n {displayDescription ? (\n <Text\n size={2}\n html={displayDescription || ''}\n className=\"desktop:text-base laptop:text-sm shelf-display-product-description line-clamp-1 text-xs font-bold\"\n />\n ) : null}\n <div className=\"mt-3 mb-2\">\n <p\n dangerouslySetInnerHTML={{\n __html:\n isLogin && plusMemberStatus\n ? discounts?.memberPrice || memberSetting?.member_price || memberSetting?.plus_member_price || ''\n : '',\n }}\n className=\"text-info-primary lg-desktop:text-lg desktop:text-base laptop:text-sm text-xs font-bold\"\n />\n <div className=\"flex items-center\">\n {isSoldOut ? (\n <div className=\"desktop:text-2xl tablet:text-xl text-info-primary text-base font-bold\">\n {soldOutText || ''}\n </div>\n ) : (\n <>\n <div className=\"final-price desktop:text-2xl tablet:text-xl text-info-primary text-base font-bold\">\n {currentVariant?.availableForSale ? priceCollection?.price || '' : ''}\n </div>\n <div className=\"origin-price desktop:text-xl tablet:text-lg text-info-secondary ml-1 text-sm font-bold line-through\">\n {currentVariant?.availableForSale ? priceCollection?.basePrice || '' : ''}\n </div>\n </>\n )}\n </div>\n </div>\n {/* \u6309\u94AE\u7EC4 */}\n <div\n className={cn('shelf-flex-button-group', 'lg-desktop:gap-3 flex items-center gap-2 m-tablet:flex-col')}\n >\n <Button\n variant=\"secondary\"\n className=\"m-tablet:w-full font-bold\"\n onClick={() => onSecondaryChange?.(data, currentSku)}\n >\n {buttonText?.secondaryButton || 'Learn More'}\n </Button>\n <Button\n variant=\"primary\"\n className=\"m-tablet:w-full font-bold\"\n disabled={isSoldOut}\n onClick={() => onPrimaryChange?.(data, currentSku)}\n >\n {buttonText?.primaryButton || 'Shop Now'}\n </Button>\n </div>\n </div>\n </div>\n )}\n </div>\n )\n}\nexport default FilterCardWrapItem\n"],
5
+ "mappings": "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",
6
+ "names": ["Fragment", "jsx", "jsxs", "cn", "atobID", "yotpoInstanceId", "useAiuiContext", "formatVariantPrice", "Badge", "Text", "Button", "Picture", "trackUrlRef", "getFunctionMemberPrice", "useState", "useEffect", "componentType", "componentName", "SOLD_OUT_PRICE", "getShopifyCdnBaseUrl", "imagePath", "path", "FilterCardWrapItem", "data", "buttonText", "itemShape", "metafields", "onPrimaryChange", "onSecondaryChange", "memberPriceDiscount", "memberSetting", "discounts", "shopCommon", "currentSku", "setCurrentSku", "currentImage", "setCurrentImage", "selectedColor", "setSelectedColor", "isSoldOut", "setIsSoldOut", "currentVariant", "setCurrentVariant", "plusMemberStatus", "setPlusMemberStatus", "priceCollection", "setPriceCollection", "tags", "setTags", "showTags", "setShowTags", "discountCollection", "setDiscountCollection", "soldOutText", "setSoldOutText", "locale", "currencyCode", "isLogin", "displayTitle", "displayDescription", "skuArray", "id", "onColorClick", "color", "handleBasePrice", "discount", "priceCurrency", "salePrice", "status", "findSku", "item", "firstOption", "variant", "infos", "productInfos", "preRender", "coupon", "price", "basePrice", "discountAmount", "showPrice", "amountStr", "match", "prefix", "numeric", "suffix", "updatedNumeric", "result", "hasMemberPrice", "salePriceWithCurrency", "originalPriceWithCurrency", "savePriceWithCurrency", "handleTags", "discountTag", "newTags", "index", "option", "hexColor", "FilterCardWrapItem_default"]
7
+ }
@@ -0,0 +1,13 @@
1
+ type FilterHeaderProps = {
2
+ total?: number;
3
+ sortKeyIndx: number;
4
+ metafields: any;
5
+ closeFilter: boolean;
6
+ shopifyData?: any;
7
+ onClearFiltered: () => void;
8
+ onSortChange: (sortKeyIndx: number) => void;
9
+ onCloseFilter: (closeFilter: boolean) => void;
10
+ onMobileOpenDrawer: (openDrawer: boolean) => void;
11
+ };
12
+ export default function FilterHeader(props: FilterHeaderProps): import("react/jsx-runtime").JSX.Element;
13
+ export {};
@@ -0,0 +1,2 @@
1
+ import{jsx as e,jsxs as l}from"react/jsx-runtime";import{cn as i}from"../../helpers/utils";import{Picture as c,Text as n}from"../../components/index.js";import{useState as y,useEffect as _,useRef as w}from"react";function k(p){const{total:a,closeFilter:m,metafields:u,shopifyData:v,onSortChange:h,onCloseFilter:C,onClearFiltered:N,onMobileOpenDrawer:F,sortKeyIndx:b}=p,{drawerText:g}=v,{shop_filters_pair:t}=u,f=w(null),[r,d]=y(!1),x=s=>C?.(s);return _(()=>{const s=o=>{!f.current?.contains(o?.target)&&d(!1)};return document.addEventListener("click",s),()=>document.removeEventListener("click",s)},[]),l("div",{className:"filter-header",children:[l("div",{className:i("desktop:gap-x-16 tablet:gap-x-8","relative flex l-tablet:p-0 text-base font-bold box-border tablet:mb-4 mb-2"),children:[!m&&l("div",{className:i("l-tablet:hidden flex-shrink-0 flex justify-between items-center","desktop:w-60 tablet:w-48 laptop:w-[210px] l-tablet:w-fit box-border"),children:[l("div",{className:"flex items-center cursor-pointer",onClick:()=>x?.(!0),children:[e(c,{className:"mb-0.5 size-5",source:"https://cdn.shopify.com/s/files/1/0508/1815/4652/files/icon_table-of-contents.svg?v=1694054638"}),e("span",{className:"font-bold inline-block pl-2 leading-none",children:t?.filter_txt?.filter||"Close Filter"})]}),e("span",{onClick:()=>N?.(),className:"text-center text-base decoration-1 underline md:hidden font-bold text-[#1D1D1F] cursor-pointer box-border",children:g?.secondaryButton||"Clear"})]}),l("div",{className:"flex-1 flex items-center justify-between",children:[l("div",{className:"l-tablet:hidden flex items-center gap-x-4",children:[m&&l("div",{className:"flex items-center cursor-pointer",onClick:()=>x?.(!1),children:[e(c,{className:"mb-0.5 size-5",source:"https://cdn.shopify.com/s/files/1/0508/1815/4652/files/icon_table-of-contents.svg?v=1694054638"}),e("span",{className:"font-bold inline-block pl-2 leading-none",children:t?.filter_txt?.filter||"Open Filter"})]}),t?.filter_txt?.found?e(n,{className:"text-base font-bold text-[#86868C] md:hidden",html:t?.filter_txt?.found?.replace("${number}",a||0)}):e(n,{className:"text-base font-bold text-[#86868C] md:hidden",html:`${a||0} Item(s) Found`})]}),e("div",{className:"hidden l-tablet:block",children:l("div",{className:"flex items-center",onClick:()=>F?.(!0),children:[e(c,{className:"inline-block size-[20px]",source:"https://cdn.shopify.com/s/files/1/0508/1815/4652/files/icon_table-of-contents.svg?v=1694054638"}),e("span",{className:"font-bold inline-block pl-2 leading-none tablet:text-base text-sm",children:t?.filter_txt?.filter||"Close Filter"})]})}),l("div",{ref:f,className:"flex items-center relative cursor-pointer",onClick:()=>d(!r),children:[e("span",{className:"tablet:text-base text-sm pr-1 text-[#777]",dangerouslySetInnerHTML:{__html:`${t?.filter_txt?.sort||"Sort by"}: `}}),e(n,{html:t?.filter_txt?.sortList?.[b]?.txt||"Recommended",className:"tablet:text-base text-sm font-bold text-[#333]"}),e("div",{className:`ml-1 duration-300 ease-in-out ${r&&"rotate-180"}`,children:e("svg",{xmlns:"http://www.w3.org/2000/svg",width:"12",height:"8",viewBox:"0 0 12 8",fill:"none",children:e("path",{d:"M10.412 0.910826C10.7375 0.585389 11.265 0.585389 11.5904 0.910826C11.9159 1.23626 11.9159 1.76377 11.5904 2.08921L6.59043 7.08921C6.265 7.41465 5.73748 7.41465 5.41205 7.08921L0.412046 2.08921C0.0866095 1.76377 0.0866095 1.23626 0.412046 0.910826C0.737483 0.585389 1.26499 0.585389 1.59043 0.910826L6.00124 5.32163L10.412 0.910826Z",fill:"#1D1D1F"})})}),e("ul",{className:i("w-full bg-[#FFFFFF] z-10 py-2 px-0 transition-all duration-400 ease-in-out","l-tablet:left-0 l-tablet:top-[120%] l-tablet:text-left absolute top-[110%] right-0",r?"visibility opacity-100":"invisible opacity-0"),children:t?.filter_txt?.sortList?.map?.((s,o)=>e("li",{className:i("cursor-pointer w-full p-4 text-base font-bold text-[#333] [&:hover]:bg-[#EAEAEC]",o===b?"bg-[#EAEAEC]":""),children:e("button",{name:s?.txt,className:"l-tablet:text-left",dangerouslySetInnerHTML:{__html:s?.txt},onClick:()=>{d(!1),h?.(o)}})},s?.txt+o))})]})]})]}),e("div",{className:"mb-2 hidden l-tablet:block",children:t?.filter_txt?.found?e(n,{className:"tablet:text-base text-sm font-bold text-[#86868C]",html:t?.filter_txt?.found?.replace("${number}",a||0)}):e(n,{className:"tablet:text-base text-sm font-bold text-[#86868C]",html:`${a||0} Item(s) Found`})})]})}export{k as default};
2
+ //# sourceMappingURL=FilterHeader.js.map