@sledge-app/react-instant-search 0.0.106 → 0.0.108

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.
@@ -1,4 +1,4 @@
1
- import { j as jsxRuntimeExports, $ as $cb5cc270b50c6fcd$export$be92b6f5f03c0fe9, a as $cb5cc270b50c6fcd$export$41fb9f06171c75f4, b as $cb5cc270b50c6fcd$export$602eac185826482c, c as $cb5cc270b50c6fcd$export$7c6e2c02157bb7d2, d as $cb5cc270b50c6fcd$export$f39c2d165cd861fe, e as $cb5cc270b50c6fcd$export$21b07c8f274aebd5, f as $67824d98245208a0$export$be92b6f5f03c0fe9, g as $67824d98245208a0$export$adb584737d712b70, h as $e698a72e93240346$export$be92b6f5f03c0fe9, i as $e698a72e93240346$export$adb584737d712b70, k as $faa2e61a3361514f$export$be92b6f5f03c0fe9, l as $faa2e61a3361514f$export$13921ac0cc260818, m as $faa2e61a3361514f$export$9a58ef0d7ad3278c, n as $faa2e61a3361514f$export$6521433ed15a34db, o as $f99a8c78507165f7$export$be92b6f5f03c0fe9, p as $f99a8c78507165f7$export$6d08773d2e66f8f2, q as $f99a8c78507165f7$export$adb584737d712b70, r as $cc7e05a45900e73f$export$6d08773d2e66f8f2, s as $cc7e05a45900e73f$export$d6e5bf9c43ea9319, t as $cc7e05a45900e73f$export$c3468e2714d175fa, u as $cc7e05a45900e73f$export$be92b6f5f03c0fe9, v as $cc7e05a45900e73f$export$41fb9f06171c75f4, w as $cc7e05a45900e73f$export$4c8d1a57a761ef94, x as $cc7e05a45900e73f$export$f04a61298a47a40f, y as $cc7e05a45900e73f$export$602eac185826482c, z as $cc7e05a45900e73f$export$7c6e2c02157bb7d2, A as $cc7e05a45900e73f$export$2f60d3ec9ad468f2, B as $cc7e05a45900e73f$export$d5c6c08dc2d3ca7, C as $cc7e05a45900e73f$export$bf1aedc3039c8d63, D as client, E as motion, F as $a093c7e1ec25a057$export$2881499e37b75b9a, G as $a093c7e1ec25a057$export$be92b6f5f03c0fe9, H as $a093c7e1ec25a057$export$41fb9f06171c75f4, I as $a093c7e1ec25a057$export$602eac185826482c, J as $a093c7e1ec25a057$export$7c6e2c02157bb7d2, K as $a093c7e1ec25a057$export$21b07c8f274aebd5, L as $57acba87d6e25586$export$be92b6f5f03c0fe9, M as $57acba87d6e25586$export$d5c6c08dc2d3ca7, N as $57acba87d6e25586$export$9a4e88b92edfce6b, O as $57acba87d6e25586$export$6521433ed15a34db, P as $57acba87d6e25586$export$ac61190d9fc311a9, Q as MasonryResponsive, R as Masonry, S as $5d3850c4d0b4e6c7$export$be92b6f5f03c0fe9, T as $5d3850c4d0b4e6c7$export$602eac185826482c, U as $5d3850c4d0b4e6c7$export$c6fdb837b070b4ff, V as $5d3850c4d0b4e6c7$export$7c6e2c02157bb7d2 } from "./vendor-1f00eb2b.js";
1
+ import { j as jsxRuntimeExports, $ as $cb5cc270b50c6fcd$export$be92b6f5f03c0fe9, a as $cb5cc270b50c6fcd$export$41fb9f06171c75f4, b as $cb5cc270b50c6fcd$export$602eac185826482c, c as $cb5cc270b50c6fcd$export$7c6e2c02157bb7d2, d as $cb5cc270b50c6fcd$export$f39c2d165cd861fe, e as $cb5cc270b50c6fcd$export$21b07c8f274aebd5, f as $67824d98245208a0$export$be92b6f5f03c0fe9, g as $67824d98245208a0$export$adb584737d712b70, h as $e698a72e93240346$export$be92b6f5f03c0fe9, i as $e698a72e93240346$export$adb584737d712b70, k as $faa2e61a3361514f$export$be92b6f5f03c0fe9, l as $faa2e61a3361514f$export$13921ac0cc260818, m as $faa2e61a3361514f$export$9a58ef0d7ad3278c, n as $faa2e61a3361514f$export$6521433ed15a34db, o as $f99a8c78507165f7$export$be92b6f5f03c0fe9, p as $f99a8c78507165f7$export$6d08773d2e66f8f2, q as $f99a8c78507165f7$export$adb584737d712b70, r as $cc7e05a45900e73f$export$6d08773d2e66f8f2, s as $cc7e05a45900e73f$export$d6e5bf9c43ea9319, t as $cc7e05a45900e73f$export$c3468e2714d175fa, u as $cc7e05a45900e73f$export$be92b6f5f03c0fe9, v as $cc7e05a45900e73f$export$41fb9f06171c75f4, w as $cc7e05a45900e73f$export$4c8d1a57a761ef94, x as $cc7e05a45900e73f$export$f04a61298a47a40f, y as $cc7e05a45900e73f$export$602eac185826482c, z as $cc7e05a45900e73f$export$7c6e2c02157bb7d2, A as $cc7e05a45900e73f$export$2f60d3ec9ad468f2, B as $cc7e05a45900e73f$export$d5c6c08dc2d3ca7, C as $cc7e05a45900e73f$export$bf1aedc3039c8d63, D as motion, E as client, F as $a093c7e1ec25a057$export$2881499e37b75b9a, G as $a093c7e1ec25a057$export$be92b6f5f03c0fe9, H as $a093c7e1ec25a057$export$41fb9f06171c75f4, I as $a093c7e1ec25a057$export$602eac185826482c, J as $a093c7e1ec25a057$export$7c6e2c02157bb7d2, K as $a093c7e1ec25a057$export$21b07c8f274aebd5, L as $57acba87d6e25586$export$be92b6f5f03c0fe9, M as $57acba87d6e25586$export$d5c6c08dc2d3ca7, N as $57acba87d6e25586$export$9a4e88b92edfce6b, O as $57acba87d6e25586$export$6521433ed15a34db, P as MasonryResponsive, Q as Masonry, R as $5d3850c4d0b4e6c7$export$be92b6f5f03c0fe9, S as $5d3850c4d0b4e6c7$export$602eac185826482c, T as $5d3850c4d0b4e6c7$export$c6fdb837b070b4ff, U as $5d3850c4d0b4e6c7$export$7c6e2c02157bb7d2 } from "./vendor-efe38901.js";
2
2
  import React__default, { createElement } from "react";
3
3
  import { SledgeContext } from "@sledge-app/core";
4
4
  import "react-dom";
@@ -49,10 +49,18 @@ const DATASET_ATTRIBUTE_KEY = {
49
49
  RATING_AVERAGE: "data-rating-average"
50
50
  },
51
51
  INSTANT_SEARCH: {
52
+ ON_AFTER_RENDER_COLLECTION: "data-on-after-render-collection",
53
+ ON_AFTER_RENDER_PAGE: "data-on-after-render-page",
54
+ ON_AFTER_RENDER_BLOG: "data-on-after-render-blog",
55
+ ON_AFTER_RENDER_ARTICLE: "data-on-after-render-article",
52
56
  QUERY_KEYWORD: "data-query-keyword",
53
57
  RENDER_SUGGESTION_KEYWORD_LIST: "data-render-suggestion-keyword-list",
54
58
  RENDER_OTHER_INDEX_LIST: "data-render-other-index-list",
55
- RENDER_SEARCH_VIEW_MORE_RESULT: "data-render-search-view-more-result"
59
+ RENDER_SEARCH_VIEW_MORE_RESULT: "data-render-search-view-more-result",
60
+ RENDER_COLLECTION_CARD: "data-render-collection-card",
61
+ RENDER_PAGE_CARD: "data-render-page-card",
62
+ RENDER_BLOG_CARD: "data-render-blog-card",
63
+ RENDER_ARTICLE_CARD: "data-render-article-card"
56
64
  }
57
65
  };
58
66
  const LOCAL_STORAGE_KEY = {
@@ -189,6 +197,12 @@ const fetchApi = async (url, method, authorization, payload = {}, headers = {},
189
197
  };
190
198
  return await fetch(`${url}`, requestOptions).then((response) => response.json()).then((result) => result);
191
199
  };
200
+ const convertDate = (date, options = {
201
+ timeZone: "Asia/Jakarta",
202
+ year: "numeric",
203
+ month: "numeric",
204
+ day: "numeric"
205
+ }) => new Date(date).toLocaleString("en-US", options);
192
206
  const root = "";
193
207
  const Loading = "";
194
208
  const ConfirmationPopup = "";
@@ -336,7 +350,7 @@ const Slider = (props) => {
336
350
  Tooltip,
337
351
  {
338
352
  content: value[0],
339
- customArrow: `<svg width="19" height="5" viewBox="0 0 19 5" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M9 4.99998C9 9.48298e-05 16.4996 1.99678e-05 18.4999 0L9 2.2985e-06L0.5 2.04891e-06C9 2.2985e-06 9 4.99998 9 4.99998Z" fill="#23BC45"/></svg>`,
353
+ customArrow: `<svg width="19" height="5" viewBox="0 0 19 5" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M9 4.99998C9 9.48298e-05 16.4996 1.99678e-05 18.4999 0L9 2.2985e-06L0.5 2.04891e-06C9 2.2985e-06 9 4.99998 9 4.99998Z" fill="#43c6ac"/></svg>`,
340
354
  wrapTrigger: false,
341
355
  children: /* @__PURE__ */ jsxRuntimeExports.jsx($faa2e61a3361514f$export$6521433ed15a34db, { className: "sledge__SliderThumb" })
342
356
  }
@@ -345,7 +359,7 @@ const Slider = (props) => {
345
359
  Tooltip,
346
360
  {
347
361
  content: value[1],
348
- customArrow: `<svg width="19" height="5" viewBox="0 0 19 5" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M9 4.99998C9 9.48298e-05 16.4996 1.99678e-05 18.4999 0L9 2.2985e-06L0.5 2.04891e-06C9 2.2985e-06 9 4.99998 9 4.99998Z" fill="#23BC45"/></svg>`,
362
+ customArrow: `<svg width="19" height="5" viewBox="0 0 19 5" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M9 4.99998C9 9.48298e-05 16.4996 1.99678e-05 18.4999 0L9 2.2985e-06L0.5 2.04891e-06C9 2.2985e-06 9 4.99998 9 4.99998Z" fill="#43c6ac"/></svg>`,
349
363
  wrapTrigger: false,
350
364
  children: /* @__PURE__ */ jsxRuntimeExports.jsx($faa2e61a3361514f$export$6521433ed15a34db, { className: "sledge__SliderThumb" })
351
365
  }
@@ -369,7 +383,7 @@ const Pagination = ({ currentPage, totalPage, totalResult, onChange }) => {
369
383
  } : {
370
384
  onClick: () => onChange(currentPage - 1)
371
385
  },
372
- children: /* @__PURE__ */ jsxRuntimeExports.jsx(ChevronArrowLeftIcon, { width: 17, height: 17, color: "black" })
386
+ children: /* @__PURE__ */ jsxRuntimeExports.jsx(ChevronArrowLeftIcon, { width: 16, height: 16, color: "black" })
373
387
  }
374
388
  ),
375
389
  /* @__PURE__ */ jsxRuntimeExports.jsxs("span", { children: [
@@ -391,7 +405,7 @@ const Pagination = ({ currentPage, totalPage, totalResult, onChange }) => {
391
405
  } : {
392
406
  onClick: () => onChange(currentPage + 1)
393
407
  },
394
- children: /* @__PURE__ */ jsxRuntimeExports.jsx(ChevronArrowRightIcon, { width: 17, height: 17, color: "black" })
408
+ children: /* @__PURE__ */ jsxRuntimeExports.jsx(ChevronArrowRightIcon, { width: 16, height: 16, color: "black" })
395
409
  }
396
410
  )
397
411
  ] });
@@ -537,12 +551,20 @@ const ChevronArrowRightIcon = ({ width, height, color }) => {
537
551
  ) }) });
538
552
  };
539
553
  const BagIcon = ({ width, height, color }) => {
540
- return /* @__PURE__ */ jsxRuntimeExports.jsx("span", { className: "sledge-icon__bag", children: /* @__PURE__ */ jsxRuntimeExports.jsx("svg", { width, height, viewBox: "0 0 40 40", fill: "none", xmlns: "http://www.w3.org/2000/svg", children: /* @__PURE__ */ jsxRuntimeExports.jsx(
554
+ return /* @__PURE__ */ jsxRuntimeExports.jsx("span", { className: "sledge-icon__bag", children: /* @__PURE__ */ jsxRuntimeExports.jsx("svg", { width, height, viewBox: "0 0 18 17", fill: "none", xmlns: "http://www.w3.org/2000/svg", children: /* @__PURE__ */ jsxRuntimeExports.jsx("g", { id: "vuesax/bold/bag-2", children: /* @__PURE__ */ jsxRuntimeExports.jsx("g", { id: "bag-2", children: /* @__PURE__ */ jsxRuntimeExports.jsx(
541
555
  "path",
542
556
  {
543
- fillRule: "evenodd",
544
- clipRule: "evenodd",
545
- d: "M19.6334 3.33398C23.9899 3.33398 27.5887 6.65342 28.0324 10.8989L28.1562 10.9003C30.5729 10.9003 33.5112 12.5053 34.5029 17.007L35.8179 27.1853C36.2896 30.4703 35.6996 33.1053 34.0612 34.9953C32.4312 36.8753 29.8512 37.8703 26.5996 37.8703H12.6862C9.11458 37.8703 6.62625 36.9953 5.07792 35.197C3.52292 33.3936 3.00292 30.6886 3.53292 27.1586L4.82625 17.1153C5.67625 12.5103 8.78458 10.9003 11.1912 10.9003C11.399 8.98444 12.2629 7.16182 13.6334 5.79565C15.2084 4.23065 17.3801 3.33398 19.5984 3.33398H19.6334ZM28.1562 13.4003H11.1912C10.4562 13.4003 7.99958 13.697 7.29458 17.5036L6.00792 27.5036C5.58958 30.3086 5.91292 32.3386 6.97125 33.567C8.01625 34.7803 9.88625 35.3703 12.6862 35.3703H26.5996C28.3462 35.3703 30.7312 35.022 32.1712 33.3586C33.3146 32.0403 33.7079 30.077 33.3412 27.522L32.0429 17.4353C31.4896 14.9503 30.0296 13.4003 28.1562 13.4003ZM24.4942 18.0405C25.1842 18.0405 25.7826 18.6005 25.7826 19.2905C25.7826 19.9805 25.2609 20.5405 24.5709 20.5405H24.4942C23.8042 20.5405 23.2442 19.9805 23.2442 19.2905C23.2442 18.6005 23.8042 18.0405 24.4942 18.0405ZM14.7774 18.0405C15.4674 18.0405 16.0657 18.6005 16.0657 19.2905C16.0657 19.9805 15.5424 20.5405 14.8524 20.5405H14.7774C14.0874 20.5405 13.5274 19.9805 13.5274 19.2905C13.5274 18.6005 14.0874 18.0405 14.7774 18.0405ZM19.6284 5.83398H19.6034C18.0351 5.83398 16.5067 6.46565 15.3984 7.56732C14.4956 8.46609 13.9051 9.64764 13.7141 10.8995L25.5129 10.9C25.0846 8.03628 22.6082 5.83398 19.6284 5.83398Z",
557
+ id: "Vector",
558
+ d: "M14.3711 6.04627C13.919 5.54693 13.2374 5.25677 12.2927 5.15555V4.64271C12.2927 3.71824 11.9013 2.82752 11.2131 2.20671C10.518 1.57241 9.6138 1.2755 8.67584 1.36322C7.06309 1.51842 5.70676 3.07719 5.70676 4.76417V5.15555C4.76205 5.25677 4.08051 5.54693 3.6284 6.04627C2.97385 6.77505 2.9941 7.74674 3.06833 8.42154L3.54068 12.1801C3.68238 13.496 4.21547 14.8455 7.11707 14.8455H10.8824C13.784 14.8455 14.3171 13.496 14.4588 12.1869L14.9312 8.41479C15.0054 7.74674 15.0189 6.77505 14.3711 6.04627ZM8.77031 2.30118C9.4451 2.24045 10.0862 2.44963 10.5855 2.90174C11.0781 3.34711 11.3548 3.98141 11.3548 4.64271V5.11506H6.64472V4.76417C6.64472 3.56304 7.63666 2.40915 8.77031 2.30118ZM6.58399 8.87365H6.57724C6.2061 8.87365 5.90245 8.56999 5.90245 8.19885C5.90245 7.82772 6.2061 7.52406 6.57724 7.52406C6.95512 7.52406 7.25878 7.82772 7.25878 8.19885C7.25878 8.56999 6.95512 8.87365 6.58399 8.87365ZM11.3075 8.87365H11.3008C10.9296 8.87365 10.626 8.56999 10.626 8.19885C10.626 7.82772 10.9296 7.52406 11.3008 7.52406C11.6787 7.52406 11.9823 7.82772 11.9823 8.19885C11.9823 8.56999 11.6787 8.87365 11.3075 8.87365Z",
559
+ fill: color
560
+ }
561
+ ) }) }) }) });
562
+ };
563
+ const CloseIcon = ({ width, height, color }) => {
564
+ return /* @__PURE__ */ jsxRuntimeExports.jsx("span", { className: "sledge-icon__close", children: /* @__PURE__ */ jsxRuntimeExports.jsx("svg", { viewBox: "0 0 20 20", focusable: "false", "aria-hidden": "true", width, height, children: /* @__PURE__ */ jsxRuntimeExports.jsx(
565
+ "path",
566
+ {
567
+ d: "m11.414 10 6.293-6.293a1 1 0 1 0-1.414-1.414l-6.293 6.293-6.293-6.293a1 1 0 0 0-1.414 1.414l6.293 6.293-6.293 6.293a1 1 0 1 0 1.414 1.414l6.293-6.293 6.293 6.293a.998.998 0 0 0 1.707-.707.999.999 0 0 0-.293-.707l-6.293-6.293z",
546
568
  fill: color
547
569
  }
548
570
  ) }) });
@@ -558,6 +580,46 @@ const SearchIcon = ({ width, height, color }) => {
558
580
  }
559
581
  ) }) });
560
582
  };
583
+ const MessageAddIcon = ({ width, height, color }) => {
584
+ return /* @__PURE__ */ jsxRuntimeExports.jsx("span", { className: "sledge-icon__message-add", children: /* @__PURE__ */ jsxRuntimeExports.jsx("svg", { width, height, viewBox: "0 0 17 16", fill: "none", xmlns: "http://www.w3.org/2000/svg", children: /* @__PURE__ */ jsxRuntimeExports.jsx("g", { id: "vuesax/bold/message-add", children: /* @__PURE__ */ jsxRuntimeExports.jsx("g", { id: "message-add", children: /* @__PURE__ */ jsxRuntimeExports.jsx(
585
+ "path",
586
+ {
587
+ id: "Vector",
588
+ d: "M11.1666 1.33301H5.83325C3.16659 1.33301 1.83325 2.66634 1.83325 5.33301V13.9997C1.83325 14.3663 2.13325 14.6663 2.49992 14.6663H11.1666C13.8333 14.6663 15.1666 13.333 15.1666 10.6663V5.33301C15.1666 2.66634 13.8333 1.33301 11.1666 1.33301ZM10.8333 8.49967H8.99992V10.333C8.99992 10.6063 8.77325 10.833 8.49992 10.833C8.22658 10.833 7.99992 10.6063 7.99992 10.333V8.49967H6.16658C5.89325 8.49967 5.66658 8.27301 5.66658 7.99967C5.66658 7.72634 5.89325 7.49967 6.16658 7.49967H7.99992V5.66634C7.99992 5.39301 8.22658 5.16634 8.49992 5.16634C8.77325 5.16634 8.99992 5.39301 8.99992 5.66634V7.49967H10.8333C11.1066 7.49967 11.3333 7.72634 11.3333 7.99967C11.3333 8.27301 11.1066 8.49967 10.8333 8.49967Z",
589
+ fill: color
590
+ }
591
+ ) }) }) }) });
592
+ };
593
+ const SwapIcon = ({ width, height, color }) => {
594
+ return /* @__PURE__ */ jsxRuntimeExports.jsx("span", { className: "sledge-icon__swap", children: /* @__PURE__ */ jsxRuntimeExports.jsx("svg", { width, height, viewBox: "0 0 17 16", fill: "none", xmlns: "http://www.w3.org/2000/svg", children: /* @__PURE__ */ jsxRuntimeExports.jsx("g", { id: "Swap", children: /* @__PURE__ */ jsxRuntimeExports.jsx("g", { id: "Iconly/Light-Outline/Swap", children: /* @__PURE__ */ jsxRuntimeExports.jsx("g", { id: "Swap_2", children: /* @__PURE__ */ jsxRuntimeExports.jsx(
595
+ "path",
596
+ {
597
+ id: "Combined-Shape",
598
+ d: "M11.7263 3.864C11.9795 3.864 12.1887 4.0521 12.2218 4.29616L12.2263 4.364L12.2262 12.2307L14.0904 10.359C14.2852 10.1633 14.6018 10.1626 14.7975 10.3574C14.9754 10.5345 14.9922 10.8122 14.8474 11.0083L14.7991 11.0645L12.0806 13.7956C12.0642 13.8117 12.0476 13.8263 12.03 13.8398L12.0806 13.7956C12.0561 13.8203 12.0296 13.8418 12.0017 13.8603C11.992 13.8663 11.9819 13.8725 11.9715 13.8784C11.9619 13.8842 11.9522 13.8892 11.9423 13.894C11.9325 13.8983 11.9226 13.9027 11.9125 13.9067C11.8998 13.9122 11.8866 13.9168 11.8734 13.9209C11.8656 13.9229 11.8576 13.9252 11.8495 13.9272C11.8351 13.9312 11.8206 13.9342 11.8061 13.9365C11.7993 13.9373 11.7921 13.9383 11.7849 13.9391C11.7685 13.9414 11.7522 13.9425 11.7359 13.9428C11.7327 13.9425 11.7295 13.9425 11.7263 13.9425L11.7166 13.9428C11.7003 13.9425 11.684 13.9414 11.6678 13.9395L11.7263 13.9425C11.6991 13.9425 11.6724 13.9403 11.6463 13.9362C11.6319 13.9342 11.6174 13.9312 11.6031 13.9276C11.5955 13.9253 11.5879 13.9232 11.5804 13.9209C11.566 13.9169 11.5518 13.9118 11.5378 13.9061C11.5301 13.9026 11.5227 13.8994 11.5154 13.896C11.5038 13.891 11.4923 13.8851 11.4809 13.8787C11.4707 13.8725 11.4606 13.8663 11.4508 13.8598C11.4431 13.8552 11.4355 13.8499 11.428 13.8443L11.4227 13.8398C11.4051 13.8263 11.3884 13.8117 11.3728 13.7961L11.3719 13.7956L8.65336 11.0645C8.45855 10.8688 8.45928 10.5522 8.65499 10.3574C8.83292 10.1803 9.11073 10.1648 9.30613 10.3105L9.3621 10.359L11.2262 12.232L11.2263 4.364C11.2263 4.08786 11.4502 3.864 11.7263 3.864ZM5.10736 2.05497L5.1171 2.05469C5.13339 2.055 5.14967 2.05611 5.16588 2.058L5.10736 2.05497C5.1346 2.05497 5.16133 2.05714 5.18739 2.06133C5.20164 2.06328 5.21594 2.06623 5.23012 2.0698C5.23846 2.07225 5.24696 2.07463 5.25536 2.07723C5.26849 2.08093 5.2812 2.08543 5.29374 2.09046C5.30281 2.0945 5.31199 2.09851 5.32103 2.10279C5.33176 2.10743 5.34234 2.11289 5.35274 2.11876C5.36166 2.12425 5.37048 2.12959 5.37912 2.1352C5.38801 2.14048 5.39691 2.14667 5.40565 2.15318L5.4618 2.20186L8.18032 4.93297C8.37513 5.12868 8.3744 5.44527 8.17869 5.64008C8.00077 5.81718 7.72295 5.83267 7.52755 5.68698L7.47158 5.63844L5.60692 3.76469L5.60736 11.6335C5.60736 11.9096 5.3835 12.1335 5.10736 12.1335C4.85423 12.1335 4.64503 11.9454 4.61192 11.7013L4.60736 11.6335L4.60692 3.76535L2.74329 5.63844C2.56618 5.81636 2.28845 5.83314 2.09237 5.68836L2.03618 5.64008C1.85826 5.46298 1.84148 5.18524 1.98626 4.98916L2.03455 4.93297L4.75306 2.20186L4.78251 2.17486C4.78942 2.16895 4.7965 2.16322 4.80373 2.15768L4.75306 2.20186C4.77759 2.17722 4.80405 2.15567 4.83195 2.13721C4.84168 2.13115 4.8518 2.12496 4.86214 2.11912C4.87175 2.11333 4.88152 2.10825 4.8914 2.10352C4.90117 2.0992 4.91107 2.09484 4.92114 2.09079C4.93393 2.08533 4.94704 2.0807 4.9603 2.07663C4.96836 2.07446 4.97662 2.07215 4.98496 2.07006C4.99839 2.06637 5.01197 2.06355 5.02562 2.06129C5.03383 2.06027 5.04188 2.05915 5.04999 2.05822C5.06542 2.0561 5.08126 2.05503 5.0971 2.0547C5.1006 2.055 5.10398 2.05497 5.10736 2.05497Z",
599
+ fill: color
600
+ }
601
+ ) }) }) }) }) });
602
+ };
603
+ const NoteIcon = ({ width, height, color }) => {
604
+ return /* @__PURE__ */ jsxRuntimeExports.jsx("span", { className: "sledge-icon__note", children: /* @__PURE__ */ jsxRuntimeExports.jsx("svg", { width, height, viewBox: "0 0 17 16", fill: "none", xmlns: "http://www.w3.org/2000/svg", children: /* @__PURE__ */ jsxRuntimeExports.jsxs("g", { id: "vuesax/bold/note-2", children: [
605
+ /* @__PURE__ */ jsxRuntimeExports.jsx(
606
+ "path",
607
+ {
608
+ id: "Vector",
609
+ d: "M8.95178 13.3046C9.13494 13.3473 9.15172 13.5871 8.97332 13.6466L7.91998 13.9933C5.27332 14.8466 3.87998 14.1333 3.01998 11.4866L2.16665 8.85328C1.31332 6.20661 2.01998 4.80661 4.66665 3.95328L4.67731 3.94975C5.08018 3.81633 5.48102 4.22359 5.37901 4.63553C5.37264 4.66126 5.3663 4.68718 5.35998 4.71328L4.70665 7.50661C3.97332 10.6466 5.04665 12.3799 8.18665 13.1266L8.95178 13.3046Z",
610
+ fill: color
611
+ }
612
+ ),
613
+ /* @__PURE__ */ jsxRuntimeExports.jsx(
614
+ "path",
615
+ {
616
+ id: "Vector_2",
617
+ d: "M11.9467 2.14033L10.8334 1.88033C8.6067 1.35366 7.28004 1.787 6.50004 3.40033C6.30004 3.807 6.14004 4.30033 6.00671 4.867L5.35337 7.66033C4.70004 10.447 5.56004 11.8203 8.34004 12.4803L9.46004 12.747C9.8467 12.8403 10.2067 12.9003 10.54 12.927C12.62 13.127 13.7267 12.1537 14.2867 9.747L14.94 6.96033C15.5934 4.17366 14.74 2.79366 11.9467 2.14033ZM10.6934 8.887C10.6334 9.11366 10.4334 9.26033 10.2067 9.26033C10.1667 9.26033 10.1267 9.25366 10.08 9.247L8.14004 8.75366C7.87337 8.687 7.71337 8.41366 7.78004 8.147C7.84671 7.88033 8.12004 7.72033 8.38671 7.787L10.3267 8.28033C10.6 8.347 10.76 8.62033 10.6934 8.887ZM12.6467 6.63366C12.5867 6.86033 12.3867 7.007 12.16 7.007C12.12 7.007 12.08 7.00033 12.0334 6.99366L8.80004 6.17366C8.53337 6.107 8.37337 5.83366 8.44004 5.567C8.50671 5.30033 8.78004 5.14033 9.04671 5.207L12.28 6.027C12.5534 6.087 12.7134 6.36033 12.6467 6.63366Z",
618
+ fill: color
619
+ }
620
+ )
621
+ ] }) }) });
622
+ };
561
623
  const Button$1 = "";
562
624
  const Button = React__default.forwardRef((props, buttonRef) => {
563
625
  const { className = "", children, colorType = "light", fullWidth = false, elementType = "button", link = "", ...otherProps } = props;
@@ -581,10 +643,32 @@ const SearchInputField = (props) => {
581
643
  return /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: `sledge__search-input-field-wrapper ${className || ""}`, children: [
582
644
  !icon ? null : /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "sledge__search-input-field-icon", children: icon }),
583
645
  /* @__PURE__ */ jsxRuntimeExports.jsx("input", { className: "sledge__search-input-field", value, onChange: (e) => handleChangeField(e), ref: fieldRef, ...otherProps }),
584
- isVisibleClearField && withClearField ? /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "sledge__clear-field-wrapper", children: /* @__PURE__ */ jsxRuntimeExports.jsx("button", { className: "sledge__clear-field", type: "button", onClick: handleResetField, children: /* @__PURE__ */ jsxRuntimeExports.jsx("svg", { viewBox: "0 0 20 20", focusable: "false", "aria-hidden": "true", width: 14, height: 14, children: /* @__PURE__ */ jsxRuntimeExports.jsx("path", { d: "m11.414 10 6.293-6.293a1 1 0 1 0-1.414-1.414l-6.293 6.293-6.293-6.293a1 1 0 0 0-1.414 1.414l6.293 6.293-6.293 6.293a1 1 0 1 0 1.414 1.414l6.293-6.293 6.293 6.293a.998.998 0 0 0 1.707-.707.999.999 0 0 0-.293-.707l-6.293-6.293z" }) }) }) }) : null
646
+ isVisibleClearField && withClearField ? /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "sledge__clear-field-wrapper", children: /* @__PURE__ */ jsxRuntimeExports.jsx("button", { className: "sledge__clear-field", type: "button", onClick: handleResetField, children: /* @__PURE__ */ jsxRuntimeExports.jsx(CloseIcon, { width: 14, height: 14, color: "#393d4e" }) }) }) : null
585
647
  ] });
586
648
  };
587
649
  const SelectField$1 = "";
650
+ const ROTATE_FILTER_ARROW_ANIMATION = {
651
+ open: { rotate: 180 },
652
+ closed: { rotate: 0 },
653
+ transition: {
654
+ type: "spring",
655
+ duration: 0.2
656
+ }
657
+ };
658
+ const VISIBLE_ANIMATION = {
659
+ hidden: { opacity: 0, scale: 0 },
660
+ visible: (custom) => {
661
+ const { duration } = custom || {};
662
+ return {
663
+ opacity: 1,
664
+ scale: 1,
665
+ transition: {
666
+ type: "spring",
667
+ duration: duration || 0.7
668
+ }
669
+ };
670
+ }
671
+ };
588
672
  const SelectField = (props) => {
589
673
  var _a;
590
674
  const { className = "", placeholder = null, prefixLabel = null, prefixSelectedLabel = "", align = "end", onChange, value = "", options = [], LinkComponent, link } = props;
@@ -599,7 +683,8 @@ const SelectField = (props) => {
599
683
  {
600
684
  trigger: /* @__PURE__ */ jsxRuntimeExports.jsxs("button", { type: "button", className: "sledge__button sledge__select-field", "data-button-color-type": "light", "data-button-full-width": "true", children: [
601
685
  !prefixLabel ? null : /* @__PURE__ */ jsxRuntimeExports.jsx("span", { className: "sledge__select-field-icon", children: prefixLabel }),
602
- /* @__PURE__ */ jsxRuntimeExports.jsx("span", { children: (prefixSelectedLabel == null ? void 0 : prefixSelectedLabel.length) ? `${prefixSelectedLabel} ${selectedLabel}` : selectedLabel })
686
+ /* @__PURE__ */ jsxRuntimeExports.jsx("span", { children: (prefixSelectedLabel == null ? void 0 : prefixSelectedLabel.length) ? `${prefixSelectedLabel} ${selectedLabel}` : selectedLabel }),
687
+ /* @__PURE__ */ jsxRuntimeExports.jsx(motion.div, { initial: "closed", animate: isOpen ? "open" : "closed", variants: ROTATE_FILTER_ARROW_ANIMATION, className: "sort-trigger-icon", children: /* @__PURE__ */ jsxRuntimeExports.jsx(ChevronArrowDownIcon, { width: 18, height: 18, color: "#000000" }) })
603
688
  ] }),
604
689
  content: /* @__PURE__ */ jsxRuntimeExports.jsx("ul", { className: "sledge__select-field-option", children: options == null ? void 0 : options.map((option, index) => {
605
690
  const { label, value: optionValue } = option;
@@ -627,7 +712,7 @@ const SelectField = (props) => {
627
712
  };
628
713
  const ProductGrid$1 = "";
629
714
  const addToCart = async (data) => {
630
- var _a;
715
+ var _a, _b;
631
716
  let items = [];
632
717
  data.map((item) => {
633
718
  const { id, quantity } = item;
@@ -636,7 +721,7 @@ const addToCart = async (data) => {
636
721
  quantity
637
722
  });
638
723
  });
639
- if (typeof window === "undefined" || !((_a = window == null ? void 0 : window.Shopify) == null ? void 0 : _a.routes))
724
+ if (typeof window === "undefined" || !((_b = (_a = window == null ? void 0 : window.Shopify) == null ? void 0 : _a.routes) == null ? void 0 : _b.root))
640
725
  return;
641
726
  let url = `${window.Shopify.routes.root}cart/add.js`;
642
727
  let headers = {
@@ -811,7 +896,7 @@ const bulkAddWishlist = async (data) => {
811
896
  });
812
897
  };
813
898
  const getWishlistInfo = async (token) => {
814
- let sledgeAuthApp = token || typeof localStorage !== "undefined" ? localStorage.getItem(LOCAL_STORAGE_KEY.AUTH_APP) || "" : "";
899
+ let sledgeAuthApp = token ? token : typeof localStorage !== "undefined" ? localStorage.getItem(LOCAL_STORAGE_KEY.AUTH_APP) || "" : "";
815
900
  let url = `${API_URL}/wishlist/info`;
816
901
  return await fetchApi(url, "GET", sledgeAuthApp).then((result) => {
817
902
  return result;
@@ -1242,9 +1327,14 @@ const WidgetHeaderShareTrigger = ({ wishlistData, buttonText, showShareTrigger,
1242
1327
  };
1243
1328
  const [isLoadingBulkAdd, setIsLoadingBulkAdd] = React__default.useState(false);
1244
1329
  let clipboardIcon = `<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
1245
- <path d="M15 17V20C15 20.2652 14.8946 20.5196 14.7071 20.7071C14.5196 20.8946 14.2652 21 14 21H4C3.73478 21 3.48043 20.8946 3.29289 20.7071C3.10536 20.5196 3 20.2652 3 20V8C3 7.73478 3.10536 7.48043 3.29289 7.29289C3.48043 7.10536 3.73478 7 4 7H7" stroke="currentColor" stroke-linecap="round" stroke-linejoin="round"/>
1246
- <path d="M18 3H8C7.44772 3 7 3.44772 7 4V16C7 16.5523 7.44772 17 8 17H18C18.5523 17 19 16.5523 19 16V4C19 3.44772 18.5523 3 18 3Z" stroke="currentColor" stroke-linecap="round" stroke-linejoin="round"/>
1247
- </svg>`;
1330
+ <g id="vuesax/linear/copy">
1331
+ <g id="copy">
1332
+ <path id="Vector" d="M16 12.9V17.1C16 20.6 14.6 22 11.1 22H6.9C3.4 22 2 20.6 2 17.1V12.9C2 9.4 3.4 8 6.9 8H11.1C14.6 8 16 9.4 16 12.9Z" stroke="#767676" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/>
1333
+ <path id="Vector_2" d="M22 6.9V11.1C22 14.6 20.6 16 17.1 16H16V12.9C16 9.4 14.6 8 11.1 8H8V6.9C8 3.4 9.4 2 12.9 2H17.1C20.6 2 22 3.4 22 6.9Z" stroke="#767676" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/>
1334
+ </g>
1335
+ </g>
1336
+ </svg>
1337
+ `;
1248
1338
  let checkIcon = `<svg width="20" height="20" viewBox="0 0 15 15" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M11.4669 3.72684C11.7558 3.91574 11.8369 4.30308 11.648 4.59198L7.39799 11.092C7.29783 11.2452 7.13556 11.3467 6.95402 11.3699C6.77247 11.3931 6.58989 11.3355 6.45446 11.2124L3.70446 8.71241C3.44905 8.48022 3.43023 8.08494 3.66242 7.82953C3.89461 7.57412 4.28989 7.55529 4.5453 7.78749L6.75292 9.79441L10.6018 3.90792C10.7907 3.61902 11.178 3.53795 11.4669 3.72684Z" fill="currentColor" fill-rule="evenodd" clip-rule="evenodd"></path></svg>`;
1249
1339
  const handleBulkAddWishlist = async () => {
1250
1340
  var _a2, _b2, _c2, _d2, _e2, _f2, _g;
@@ -1422,7 +1512,7 @@ const WidgetHeaderLimit = ({ options, defaultLimitOptions, selectedLimit, setSel
1422
1512
  React__default.useEffect(() => {
1423
1513
  setIsRequiredLogin(sledgeAnonymId && is_required_login);
1424
1514
  }, [sledgeAnonymId]);
1425
- return /* @__PURE__ */ jsxRuntimeExports.jsx(jsxRuntimeExports.Fragment, { children: !isRequiredLogin && /* @__PURE__ */ jsxRuntimeExports.jsx(jsxRuntimeExports.Fragment, { children: getOptions && Boolean(getOptions == null ? void 0 : getOptions.length) && /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "sledge-wishlist__widget-header-item", children: /* @__PURE__ */ jsxRuntimeExports.jsx(
1515
+ return /* @__PURE__ */ jsxRuntimeExports.jsx(jsxRuntimeExports.Fragment, { children: !isRequiredLogin ? /* @__PURE__ */ jsxRuntimeExports.jsx(jsxRuntimeExports.Fragment, { children: getOptions && Boolean(getOptions == null ? void 0 : getOptions.length) && /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "sledge-wishlist__widget-header-item", children: /* @__PURE__ */ jsxRuntimeExports.jsx(
1426
1516
  SelectField,
1427
1517
  {
1428
1518
  align: "end",
@@ -1435,7 +1525,7 @@ const WidgetHeaderLimit = ({ options, defaultLimitOptions, selectedLimit, setSel
1435
1525
  value: selectedLimit || getOptions[0],
1436
1526
  onChange: ({ value }) => handleChangeLimit(value)
1437
1527
  }
1438
- ) }) }) });
1528
+ ) }) }) : null });
1439
1529
  };
1440
1530
  const WidgetHeaderSort$1 = ({ wishlistSort, selectedSort, setSelectedSort, setIsRefreshWidgetList, dataSettings }) => {
1441
1531
  var _a, _b;
@@ -1449,7 +1539,7 @@ const WidgetHeaderSort$1 = ({ wishlistSort, selectedSort, setSelectedSort, setIs
1449
1539
  React__default.useEffect(() => {
1450
1540
  setIsRequiredLogin(sledgeAnonymId && is_required_login);
1451
1541
  }, [sledgeAnonymId]);
1452
- return /* @__PURE__ */ jsxRuntimeExports.jsx(jsxRuntimeExports.Fragment, { children: !isRequiredLogin && /* @__PURE__ */ jsxRuntimeExports.jsx(jsxRuntimeExports.Fragment, { children: wishlistSort && Boolean(wishlistSort == null ? void 0 : wishlistSort.length) && /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "sledge-wishlist__widget-header-item", children: /* @__PURE__ */ jsxRuntimeExports.jsx(
1542
+ return /* @__PURE__ */ jsxRuntimeExports.jsx(jsxRuntimeExports.Fragment, { children: !isRequiredLogin ? /* @__PURE__ */ jsxRuntimeExports.jsx(jsxRuntimeExports.Fragment, { children: wishlistSort && Boolean(wishlistSort == null ? void 0 : wishlistSort.length) && /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "sledge-wishlist__widget-header-item", children: /* @__PURE__ */ jsxRuntimeExports.jsx(
1453
1543
  SelectField,
1454
1544
  {
1455
1545
  align: "end",
@@ -1463,7 +1553,7 @@ const WidgetHeaderSort$1 = ({ wishlistSort, selectedSort, setSelectedSort, setIs
1463
1553
  value: selectedSort || ((_b = wishlistSort[0]) == null ? void 0 : _b.value),
1464
1554
  onChange: ({ value }) => handleChangeSort(value)
1465
1555
  }
1466
- ) }) }) });
1556
+ ) }) }) : null });
1467
1557
  };
1468
1558
  const WidgetHeader$1 = ({ isFirstLoading, ...props }) => {
1469
1559
  return /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "sledge-wishlist__widget-header", children: isFirstLoading ? /* @__PURE__ */ jsxRuntimeExports.jsxs(
@@ -1538,7 +1628,7 @@ const getReviewInfo = async (id) => {
1538
1628
  };
1539
1629
  const getProductsReviewInfo = async (ids, token) => {
1540
1630
  let convertIds = ids.map((v) => sanitizeDataId(v));
1541
- let sledgeAuthApp = token || typeof localStorage !== "undefined" ? localStorage.getItem(LOCAL_STORAGE_KEY.AUTH_APP) || "" : "";
1631
+ let sledgeAuthApp = token ? token : typeof localStorage !== "undefined" ? (localStorage == null ? void 0 : localStorage.getItem(LOCAL_STORAGE_KEY.AUTH_APP)) || "" : "";
1542
1632
  let url = `${API_URL}/review/info/ids/${convertIds.join(",")}`;
1543
1633
  return await fetchApi(url, "GET", sledgeAuthApp).then((result) => {
1544
1634
  return result;
@@ -1548,7 +1638,7 @@ const getProductsReviewInfo = async (ids, token) => {
1548
1638
  };
1549
1639
  const Rating = (props) => {
1550
1640
  var _a, _b;
1551
- const { total, average, size = "md", params, withSkeletonLoading = true, withTotal = true, isScrollToElementWidget = true, data: propsData, sledgeSettings } = props;
1641
+ const { total, average, size = "sm", params, withSkeletonLoading = true, withTotal = true, isScrollToElementWidget = true, data: propsData, sledgeSettings } = props;
1552
1642
  const { productId } = params || {};
1553
1643
  const { isRenderApp, triggerRenderMultipleComponent } = React__default.useContext(SledgeContext);
1554
1644
  const { productReview: isRenderAppProductReview } = isRenderApp || {};
@@ -1656,7 +1746,7 @@ const Rating = (props) => {
1656
1746
  }, [productId, triggerRenderMultipleComponent]);
1657
1747
  return /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "sledge-product-review__rating", onClick: handleOnClick, children: isFirstLoading && withSkeletonLoading ? /* @__PURE__ */ jsxRuntimeExports.jsx(SkeletonLoading.Item, { width: "230px", height: "28px", color: "lighten", rounded: "md" }) : /* @__PURE__ */ jsxRuntimeExports.jsxs(jsxRuntimeExports.Fragment, { children: [
1658
1748
  /* @__PURE__ */ jsxRuntimeExports.jsxs("svg", { xmlns: "http://www.w3.org/2000/svg", style: { display: "none" }, id: "sledge-product-review-rating-icon-svg-store", children: [
1659
- /* @__PURE__ */ jsxRuntimeExports.jsx("symbol", { id: "sledge-product-review-icons-rating-icon-fill", viewBox: "0 0 30 29", fill: fill_color || "#23BC45", children: /* @__PURE__ */ jsxRuntimeExports.jsx(
1749
+ /* @__PURE__ */ jsxRuntimeExports.jsx("symbol", { id: "sledge-product-review-icons-rating-icon-fill", viewBox: "0 0 30 29", fill: fill_color || "#43c6ac", children: /* @__PURE__ */ jsxRuntimeExports.jsx(
1660
1750
  "path",
1661
1751
  {
1662
1752
  fillRule: "evenodd",
@@ -1751,18 +1841,11 @@ const WidgetHeaderAddTrigger = ({ isFirstLoading, text, dataSettings, params, on
1751
1841
  {
1752
1842
  type: "button",
1753
1843
  colorType: "success",
1844
+ className: "sledge-product-review__widget-header-add-trigger",
1754
1845
  onClick: () => typeof window !== "undefined" && window.sledgeProductReviewWidgetFormAdd && window.sledgeProductReviewWidgetFormAdd(params, onAfterAddReview),
1755
1846
  style: display_button_write_review_style,
1756
1847
  children: [
1757
- /* @__PURE__ */ jsxRuntimeExports.jsx("svg", { width: 16, height: 17, viewBox: "0 0 16 17", fill: "none", xmlns: "http://www.w3.org/2000/svg", children: /* @__PURE__ */ jsxRuntimeExports.jsx(
1758
- "path",
1759
- {
1760
- fillRule: "evenodd",
1761
- clipRule: "evenodd",
1762
- d: "M13.8323 14.1264C14.1083 14.1264 14.3323 14.3504 14.3323 14.6264C14.3323 14.9024 14.1083 15.1264 13.8323 15.1264H8.99701C8.72101 15.1264 8.49701 14.9024 8.49701 14.6264C8.49701 14.3504 8.72101 14.1264 8.99701 14.1264H13.8323ZM10.7429 2.93576C10.7762 2.96176 11.8915 3.82843 11.8915 3.82843C12.2969 4.06976 12.6135 4.5011 12.7335 5.01176C12.8529 5.5171 12.7662 6.03843 12.4882 6.47909C12.4864 6.48203 12.4845 6.48494 12.4781 6.49358L12.4731 6.50025C12.4279 6.55972 12.2318 6.80776 11.2417 8.04815C11.2325 8.06441 11.2221 8.07963 11.2107 8.09443C11.1941 8.11624 11.1759 8.13628 11.1565 8.15453C11.089 8.23956 11.0176 8.3289 10.9426 8.42283L10.7907 8.61313C10.4772 9.00579 10.1053 9.47139 9.66407 10.0236L9.43764 10.3071C8.58586 11.3732 7.49499 12.7382 6.09755 14.4864C5.79155 14.8678 5.33288 15.0898 4.84021 15.0958L2.41421 15.1264H2.40755C2.17621 15.1264 1.97488 14.9678 1.92088 14.7418L1.37488 12.4278C1.26221 11.9484 1.37421 11.4538 1.68155 11.0698L7.96155 3.2151C7.96421 3.21243 7.96621 3.2091 7.96888 3.20643C8.65755 2.3831 9.90288 2.26176 10.7429 2.93576ZM7.26136 5.69133L2.46221 11.6944C2.34821 11.8371 2.30621 12.0211 2.34821 12.1978L2.80221 14.1211L4.82821 14.0958C5.02088 14.0938 5.19888 14.0078 5.31688 13.8611C5.92454 13.1008 6.68825 12.1452 7.47345 11.1627L7.75125 10.815L8.02952 10.4668C8.76591 9.54526 9.4934 8.63471 10.1021 7.87258L7.26136 5.69133ZM8.73888 3.84443L7.88603 4.91L10.7265 7.09062C11.2733 6.4058 11.633 5.95476 11.6662 5.91176C11.7755 5.73443 11.8182 5.48376 11.7609 5.24243C11.7022 4.9951 11.5482 4.78509 11.3262 4.65109C11.2789 4.61843 10.1555 3.74643 10.1209 3.71909C9.69821 3.38043 9.08155 3.4391 8.73888 3.84443Z",
1763
- fill: "currentColor"
1764
- }
1765
- ) }),
1848
+ /* @__PURE__ */ jsxRuntimeExports.jsx(MessageAddIcon, { width: 16, height: 16, color: "currentColor" }),
1766
1849
  text ? text : button_write_review || "Add review"
1767
1850
  ]
1768
1851
  }
@@ -1782,15 +1865,7 @@ const WidgetHeaderSort = ({ isFirstLoading, productReviewSort, dataSettings, set
1782
1865
  SelectField,
1783
1866
  {
1784
1867
  align: "end",
1785
- prefixLabel: /* @__PURE__ */ jsxRuntimeExports.jsx("svg", { width: 16, height: 16, viewBox: "0 0 16 16", fill: "none", xmlns: "http://www.w3.org/2000/svg", children: /* @__PURE__ */ jsxRuntimeExports.jsx(
1786
- "path",
1787
- {
1788
- fillRule: "evenodd",
1789
- clipRule: "evenodd",
1790
- d: "M11.5919 9.13869C12.7359 9.13869 13.6666 10.0647 13.6666 11.2027C13.6666 12.3407 12.7359 13.2667 11.5919 13.2667C10.4473 13.2667 9.51593 12.3407 9.51593 11.2027C9.51593 10.0647 10.4473 9.13869 11.5919 9.13869ZM11.5919 10.1387C10.9986 10.1387 10.5159 10.616 10.5159 11.2027C10.5159 11.79 10.9986 12.2667 11.5919 12.2667C12.1846 12.2667 12.6666 11.79 12.6666 11.2027C12.6666 10.616 12.1846 10.1387 11.5919 10.1387ZM6.7202 10.7286C6.9962 10.7286 7.2202 10.9526 7.2202 11.2286C7.2202 11.5046 6.9962 11.7286 6.7202 11.7286H2.51953C2.24353 11.7286 2.01953 11.5046 2.01953 11.2286C2.01953 10.9526 2.24353 10.7286 2.51953 10.7286H6.7202ZM4.07533 2.66669C5.22 2.66669 6.15067 3.59335 6.15067 4.73135C6.15067 5.86935 5.22 6.79469 4.07533 6.79469C2.93133 6.79469 2 5.86935 2 4.73135C2 3.59335 2.93133 2.66669 4.07533 2.66669ZM4.07533 3.66669C3.48267 3.66669 3 4.14402 3 4.73135C3 5.31802 3.48267 5.79469 4.07533 5.79469C4.66867 5.79469 5.15067 5.31802 5.15067 4.73135C5.15067 4.14402 4.66867 3.66669 4.07533 3.66669ZM12.7941 4.26695C13.0701 4.26695 13.2941 4.49095 13.2941 4.76695C13.2941 5.04295 13.0701 5.26695 12.7941 5.26695H8.59407C8.31807 5.26695 8.09407 5.04295 8.09407 4.76695C8.09407 4.49095 8.31807 4.26695 8.59407 4.26695H12.7941Z",
1791
- fill: "currentColor"
1792
- }
1793
- ) }),
1868
+ prefixLabel: /* @__PURE__ */ jsxRuntimeExports.jsx(SwapIcon, { width: 16, height: 16, color: "currentColor" }),
1794
1869
  prefixSelectedLabel: "Sort by",
1795
1870
  options: productReviewSort.map((item) => {
1796
1871
  const { name, value } = item;
@@ -1805,28 +1880,6 @@ const WidgetHeaderSort = ({ isFirstLoading, productReviewSort, dataSettings, set
1805
1880
  }
1806
1881
  ) }) });
1807
1882
  };
1808
- const ROTATE_FILTER_ARROW_ANIMATION = {
1809
- open: { rotate: 180 },
1810
- closed: { rotate: 0 },
1811
- transition: {
1812
- type: "spring",
1813
- duration: 0.2
1814
- }
1815
- };
1816
- const VISIBLE_ANIMATION = {
1817
- hidden: { opacity: 0, scale: 0 },
1818
- visible: (custom) => {
1819
- const { duration } = custom || {};
1820
- return {
1821
- opacity: 1,
1822
- scale: 1,
1823
- transition: {
1824
- type: "spring",
1825
- duration: duration || 0.7
1826
- }
1827
- };
1828
- }
1829
- };
1830
1883
  const WidgetHeaderSummary = (props) => {
1831
1884
  var _a, _b, _c, _d;
1832
1885
  const { params, dataSettings, summaryData, sledgeSettings } = props;
@@ -2018,7 +2071,7 @@ const search = async (index, payload) => {
2018
2071
  });
2019
2072
  };
2020
2073
  const multiSearch = async (payload, token) => {
2021
- let sledgeInstantSearchAuthApp = token || typeof localStorage !== "undefined" ? localStorage.getItem(LOCAL_STORAGE_KEY.INSTANT_SEARCH_AUTH_APP) || "" : "";
2074
+ let sledgeInstantSearchAuthApp = token ? token : typeof localStorage !== "undefined" ? localStorage.getItem(LOCAL_STORAGE_KEY.INSTANT_SEARCH_AUTH_APP) || "" : "";
2022
2075
  let url = `${INSTANT_SEARCH_ENGINE_URL}/multi-search`;
2023
2076
  let headers = {
2024
2077
  "Content-Type": "application/json"
@@ -2222,7 +2275,7 @@ const ProductGrid = ({
2222
2275
  wishlistChecked: dataWishlists == null ? void 0 : dataWishlists[id]
2223
2276
  }
2224
2277
  ),
2225
- /* @__PURE__ */ jsxRuntimeExports.jsx("img", { src: (image == null ? void 0 : image.src) || "", alt: "sledge-product-card-image", loading: "lazy", onError: (event) => event.currentTarget.src = `${API_URL}/img/blank-image.png` })
2278
+ /* @__PURE__ */ jsxRuntimeExports.jsx("img", { src: (image == null ? void 0 : image.src) || `${API_URL}/img/blank-image.png`, alt: "sledge-card-image", loading: "lazy" })
2226
2279
  ]
2227
2280
  }
2228
2281
  ),
@@ -2230,34 +2283,14 @@ const ProductGrid = ({
2230
2283
  ] }),
2231
2284
  /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "sledge__product-grid-card-desc", children: [
2232
2285
  /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "sledge__product-grid-card-title", children: [
2233
- title ? /* @__PURE__ */ jsxRuntimeExports.jsx(
2234
- "a",
2235
- {
2236
- href: url,
2237
- onClick: () => sourceApp === "instant-search" && productClickTrigger({
2238
- productId: id
2239
- }),
2240
- children: /* @__PURE__ */ jsxRuntimeExports.jsx("h3", { style: display_product_name_style, children: title })
2241
- }
2242
- ) : null,
2243
2286
  show_price ? /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "sledge__product-grid-card-price", children: /* @__PURE__ */ jsxRuntimeExports.jsxs("p", { style: display_price_style, children: [
2244
2287
  currency,
2245
2288
  price
2246
- ] }) }) : null
2247
- ] }),
2248
- /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "sledge__product-grid-card-text", children: [
2249
- /* @__PURE__ */ jsxRuntimeExports.jsx("div", { children: variant_title }),
2250
- /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { children: [
2251
- /* @__PURE__ */ jsxRuntimeExports.jsx(jsxRuntimeExports.Fragment, { children: show_vendor ? /* @__PURE__ */ jsxRuntimeExports.jsxs(jsxRuntimeExports.Fragment, { children: [
2252
- "Vendor: ",
2253
- vendor
2254
- ] }) : null }),
2255
- /* @__PURE__ */ jsxRuntimeExports.jsx(jsxRuntimeExports.Fragment, { children: " | " }),
2256
- /* @__PURE__ */ jsxRuntimeExports.jsx(jsxRuntimeExports.Fragment, { children: show_sku ? /* @__PURE__ */ jsxRuntimeExports.jsxs(jsxRuntimeExports.Fragment, { children: [
2257
- "SKU: ",
2258
- sku
2259
- ] }) : null })
2260
- ] })
2289
+ ] }) }) : null,
2290
+ show_vendor ? /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "sledge__product-grid-badge-vendor", children: [
2291
+ "Vendor: ",
2292
+ (vendor == null ? void 0 : vendor.length) > 5 ? `${String(vendor).substring(0, 5)}...` : vendor
2293
+ ] }) : null
2261
2294
  ] }),
2262
2295
  /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "sledge__product-grid-card-rating", children: /* @__PURE__ */ jsxRuntimeExports.jsx(
2263
2296
  Rating,
@@ -2270,7 +2303,21 @@ const ProductGrid = ({
2270
2303
  isScrollToElementWidget: false,
2271
2304
  data: dataReviews == null ? void 0 : dataReviews[id]
2272
2305
  }
2273
- ) })
2306
+ ) }),
2307
+ title ? /* @__PURE__ */ jsxRuntimeExports.jsx(
2308
+ "a",
2309
+ {
2310
+ href: url,
2311
+ onClick: () => sourceApp === "instant-search" && productClickTrigger({
2312
+ productId: id
2313
+ }),
2314
+ children: /* @__PURE__ */ jsxRuntimeExports.jsx("h3", { className: "sledge__product-grid-card-product-name", style: display_product_name_style, children: title })
2315
+ }
2316
+ ) : null,
2317
+ /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "sledge__product-grid-card-text", children: show_sku ? /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { children: [
2318
+ "SKU: ",
2319
+ sku
2320
+ ] }) : null })
2274
2321
  ] })
2275
2322
  ] }),
2276
2323
  show_add_to_cart ? /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "sledge__product-grid-button-wrapper", children: /* @__PURE__ */ jsxRuntimeExports.jsx(
@@ -2293,15 +2340,7 @@ const ProductGrid = ({
2293
2340
  })
2294
2341
  },
2295
2342
  children: isLoadingAddToCart ? "Adding..." : isOutOfStock ? "Sold out" : /* @__PURE__ */ jsxRuntimeExports.jsxs(jsxRuntimeExports.Fragment, { children: [
2296
- /* @__PURE__ */ jsxRuntimeExports.jsx("svg", { width: 18, height: 18, viewBox: "0 0 18 18", fill: "none", xmlns: "http://www.w3.org/2000/svg", children: /* @__PURE__ */ jsxRuntimeExports.jsx(
2297
- "path",
2298
- {
2299
- fillRule: "evenodd",
2300
- clipRule: "evenodd",
2301
- d: "M8.83562 1.50023C10.796 1.50023 12.4155 2.99397 12.6152 4.90442L12.6709 4.90507C13.7584 4.90507 15.0806 5.62732 15.5269 7.65307L16.1186 12.2333C16.3309 13.7116 16.0654 14.8973 15.3281 15.7478C14.5946 16.5938 13.4336 17.0416 11.9704 17.0416H5.7094C4.10215 17.0416 2.9824 16.6478 2.28565 15.8386C1.5859 15.0271 1.3519 13.8098 1.5904 12.2213L2.1724 7.70182C2.5549 5.62957 3.95365 4.90507 5.03665 4.90507C5.13014 4.04293 5.51889 3.22275 6.13562 2.60797C6.84437 1.90372 7.82162 1.50023 8.81987 1.50023H8.83562ZM12.6709 6.03007H5.03665C4.7059 6.03007 3.6004 6.16357 3.28315 7.87657L2.70415 12.3766C2.5159 13.6388 2.6614 14.5523 3.13765 15.1051C3.6079 15.6511 4.4494 15.9166 5.7094 15.9166H11.9704C12.7564 15.9166 13.8296 15.7598 14.4776 15.0113C14.9921 14.4181 15.1691 13.5346 15.0041 12.3848L14.4199 7.84582C14.1709 6.72757 13.5139 6.03007 12.6709 6.03007ZM11.023 8.11815C11.3335 8.11815 11.6027 8.37015 11.6027 8.68065C11.6027 8.99115 11.368 9.24315 11.0575 9.24315H11.023C10.7125 9.24315 10.4605 8.99115 10.4605 8.68065C10.4605 8.37015 10.7125 8.11815 11.023 8.11815ZM6.65042 8.11815C6.96092 8.11815 7.23017 8.37015 7.23017 8.68065C7.23017 8.99115 6.99467 9.24315 6.68417 9.24315H6.65042C6.33992 9.24315 6.08792 8.99115 6.08792 8.68065C6.08792 8.37015 6.33992 8.11815 6.65042 8.11815ZM8.83337 2.62522H8.82212C8.11637 2.62522 7.42862 2.90947 6.92987 3.40522C6.5236 3.80967 6.25789 4.34137 6.17193 4.90472L11.4814 4.90493C11.2887 3.61626 10.1743 2.62522 8.83337 2.62522Z",
2302
- fill: "#393D4E"
2303
- }
2304
- ) }),
2343
+ /* @__PURE__ */ jsxRuntimeExports.jsx(BagIcon, { width: 15, height: 15, color: "#393D4E" }),
2305
2344
  /* @__PURE__ */ jsxRuntimeExports.jsx("span", { children: language_button_add_to_cart ? language_button_add_to_cart : "Add To Cart" })
2306
2345
  ] })
2307
2346
  }
@@ -2312,72 +2351,83 @@ const ProductGrid = ({
2312
2351
  const TextAreaField = "";
2313
2352
  const InputField = "";
2314
2353
  const CollectionGrid$1 = "";
2315
- const CollectionGrid = ({ className = "", data }) => {
2354
+ const CollectionGrid = ({ className = "", data, cards, isComponentJsVersion, onAfterRenderCollection }) => {
2355
+ React__default.useEffect(() => {
2356
+ onAfterRenderCollection && onAfterRenderCollection("success");
2357
+ }, []);
2316
2358
  return /* @__PURE__ */ jsxRuntimeExports.jsx(jsxRuntimeExports.Fragment, { children: !(data == null ? void 0 : data.length) ? null : /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: `sledge__collection-grid ${className}`, children: data.map((item, index) => {
2317
- const { id, title, description, url, image } = item;
2318
- return /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "sledge__collection-grid-card", children: [
2319
- /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "sledge__collection-grid-card-image", children: /* @__PURE__ */ jsxRuntimeExports.jsx(
2320
- "img",
2321
- {
2322
- src: image || `${API_URL}/img/blank-image.png`,
2323
- alt: "sledge-product-card-image",
2324
- loading: "lazy",
2325
- onError: (event) => event.currentTarget.src = `${API_URL}/img/blank-image.png`
2326
- }
2327
- ) }),
2359
+ const { id, title, body_html, url, image } = item;
2360
+ const getCards = cards ? cards({ data: item }) : null;
2361
+ return cards ? /* @__PURE__ */ jsxRuntimeExports.jsx(React__default.Fragment, { children: isComponentJsVersion ? /* @__PURE__ */ jsxRuntimeExports.jsx("div", { dangerouslySetInnerHTML: { __html: getCards } }) : getCards }, index) : /* @__PURE__ */ jsxRuntimeExports.jsx("a", { href: url, children: /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "sledge__collection-grid-card", children: [
2362
+ /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "sledge__collection-grid-card-image-wrapper", children: /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "sledge__collection-grid-card-image", children: /* @__PURE__ */ jsxRuntimeExports.jsx("img", { src: (image == null ? void 0 : image.src) || `${API_URL}/img/blank-image.png`, alt: "sledge-card-image", loading: "lazy" }) }) }),
2328
2363
  /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "sledge__collection-grid-card-content", children: [
2329
- /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "sledge__collection-grid-card-text", children: [
2330
- /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "sledge__collection-grid-card-content-title", children: title }),
2331
- /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "sledge__collection-grid-card-content-description", children: description })
2332
- ] }),
2333
- /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "sledge__collection-grid-card-content-button-wrapper", children: /* @__PURE__ */ jsxRuntimeExports.jsx(Button, { type: "button", colorType: "success", elementType: "hyperlink", link: url, children: "Shop Now" }) })
2364
+ /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "sledge__collection-grid-card-content-title", children: title }),
2365
+ body_html ? /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "sledge__collection-grid-card-content-description", dangerouslySetInnerHTML: { __html: body_html } }) : null
2334
2366
  ] })
2335
- ] }, index);
2367
+ ] }) }, index);
2336
2368
  }) }) });
2337
2369
  };
2338
2370
  const PageGrid$1 = "";
2339
- const PageGrid = ({ className = "", data }) => {
2371
+ const PageGrid = ({ className = "", data, cards, isComponentJsVersion, onAfterRenderPage }) => {
2372
+ React__default.useEffect(() => {
2373
+ onAfterRenderPage && onAfterRenderPage("success");
2374
+ }, []);
2340
2375
  return /* @__PURE__ */ jsxRuntimeExports.jsx(jsxRuntimeExports.Fragment, { children: !(data == null ? void 0 : data.length) ? null : /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: `sledge__page-grid ${className}`, children: data.map((item, index) => {
2341
- const { id, title, description, url, image } = item;
2342
- return /* @__PURE__ */ jsxRuntimeExports.jsx("a", { href: url, children: /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "sledge__page-grid-card", children: [
2343
- /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "sledge__page-grid-card-image", children: /* @__PURE__ */ jsxRuntimeExports.jsx(
2344
- "img",
2345
- {
2346
- src: image || `${API_URL}/img/blank-image.png`,
2347
- alt: "sledge-product-card-image",
2348
- loading: "lazy",
2349
- onError: (event) => event.currentTarget.src = `${API_URL}/img/blank-image.png`
2350
- }
2351
- ) }),
2376
+ const { id, title, body_html, url, image } = item;
2377
+ const getCards = cards ? cards({ data: item }) : null;
2378
+ return cards ? /* @__PURE__ */ jsxRuntimeExports.jsx(React__default.Fragment, { children: isComponentJsVersion ? /* @__PURE__ */ jsxRuntimeExports.jsx("div", { dangerouslySetInnerHTML: { __html: getCards } }) : getCards }, index) : /* @__PURE__ */ jsxRuntimeExports.jsx("a", { href: url, children: /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "sledge__page-grid-card", children: [
2379
+ /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "sledge__page-grid-card-image-wrapper", children: /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "sledge__page-grid-card-image", children: /* @__PURE__ */ jsxRuntimeExports.jsx("img", { src: (image == null ? void 0 : image.src) || `${API_URL}/img/blank-image.png`, alt: "sledge-card-image", loading: "lazy" }) }) }),
2352
2380
  /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "sledge__page-grid-card-content", children: [
2353
2381
  /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "sledge__page-grid-card-content-title", children: title }),
2354
- /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "sledge__page-grid-card-content-description", children: description })
2382
+ body_html ? /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "sledge__page-grid-card-content-description", dangerouslySetInnerHTML: { __html: body_html } }) : null
2355
2383
  ] })
2356
2384
  ] }) }, index);
2357
2385
  }) }) });
2358
2386
  };
2359
2387
  const BlogGrid$1 = "";
2360
- const BlogGrid = ({ className = "", data }) => {
2388
+ const BlogGrid = ({ className = "", data, cards, isComponentJsVersion, onAfterRenderBlog }) => {
2389
+ React__default.useEffect(() => {
2390
+ onAfterRenderBlog && onAfterRenderBlog("success");
2391
+ }, []);
2361
2392
  return /* @__PURE__ */ jsxRuntimeExports.jsx(jsxRuntimeExports.Fragment, { children: !(data == null ? void 0 : data.length) ? null : /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: `sledge__blog-grid ${className}`, children: data == null ? void 0 : data.map((item, index) => {
2362
- const { id, title, date, description, url, image } = item;
2363
- return /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "sledge__blog-grid-card", children: [
2393
+ const { id, title, created_at, url, image } = item;
2394
+ const getCards = cards ? cards({ data: item }) : null;
2395
+ return cards ? /* @__PURE__ */ jsxRuntimeExports.jsx(React__default.Fragment, { children: isComponentJsVersion ? /* @__PURE__ */ jsxRuntimeExports.jsx("div", { dangerouslySetInnerHTML: { __html: getCards } }) : getCards }, index) : /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "sledge__blog-grid-card", children: [
2364
2396
  /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "sledge__blog-grid-content", children: [
2365
- /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "sledge__blog-grid-card-image", children: /* @__PURE__ */ jsxRuntimeExports.jsx("a", { href: url, children: /* @__PURE__ */ jsxRuntimeExports.jsx(
2366
- "img",
2367
- {
2368
- src: image || `${API_URL}/img/blank-image.png`,
2369
- alt: "sledge-blog-card-image",
2370
- loading: "lazy",
2371
- onError: (event) => event.currentTarget.src = `${API_URL}/img/blank-image.png`
2372
- }
2373
- ) }) }),
2397
+ /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "sledge__blog-grid-card-image", children: /* @__PURE__ */ jsxRuntimeExports.jsx("a", { href: url, children: /* @__PURE__ */ jsxRuntimeExports.jsx("img", { src: (image == null ? void 0 : image.src) || `${API_URL}/img/blank-image.png`, alt: "sledge-card-image", loading: "lazy" }) }) }),
2374
2398
  /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "sledge__blog-grid-card-desc", children: [
2375
- /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "sledge__blog-grid-card-title", children: /* @__PURE__ */ jsxRuntimeExports.jsx("div", { children: /* @__PURE__ */ jsxRuntimeExports.jsx("a", { href: url, children: /* @__PURE__ */ jsxRuntimeExports.jsx("div", { children: title }) }) }) }),
2376
- !(date == null ? void 0 : date.length) ? null : /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "sledge__blog-grid-card-date", children: date }),
2377
- /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "sledge__blog-grid-card-text", children: description })
2399
+ /* @__PURE__ */ jsxRuntimeExports.jsx("a", { href: url, children: /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "sledge__blog-grid-card-title", children: title }) }),
2400
+ created_at ? /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "sledge__blog-grid-badge-vendor", children: convertDate(created_at) }) : null
2401
+ ] })
2402
+ ] }),
2403
+ /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "sledge__blog-grid-button-wrapper", children: /* @__PURE__ */ jsxRuntimeExports.jsx("a", { href: url, children: /* @__PURE__ */ jsxRuntimeExports.jsxs(Button, { type: "button", colorType: "light", children: [
2404
+ /* @__PURE__ */ jsxRuntimeExports.jsx(NoteIcon, { width: 16, height: 16, color: "#000000" }),
2405
+ /* @__PURE__ */ jsxRuntimeExports.jsx("span", { children: "View Blog" })
2406
+ ] }) }) })
2407
+ ] }, index);
2408
+ }) }) });
2409
+ };
2410
+ const ArticleGrid$1 = "";
2411
+ const ArticleGrid = ({ className = "", data, cards, isComponentJsVersion, onAfterRenderArticle }) => {
2412
+ React__default.useEffect(() => {
2413
+ onAfterRenderArticle && onAfterRenderArticle("success");
2414
+ }, []);
2415
+ return /* @__PURE__ */ jsxRuntimeExports.jsx(jsxRuntimeExports.Fragment, { children: !(data == null ? void 0 : data.length) ? null : /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: `sledge__article-grid ${className}`, children: data == null ? void 0 : data.map((item, index) => {
2416
+ const { id, title, created_at, summary_html, url, image } = item;
2417
+ const getCards = cards ? cards({ data: item }) : null;
2418
+ return cards ? /* @__PURE__ */ jsxRuntimeExports.jsx(React__default.Fragment, { children: isComponentJsVersion ? /* @__PURE__ */ jsxRuntimeExports.jsx("div", { dangerouslySetInnerHTML: { __html: getCards } }) : getCards }, index) : /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "sledge__article-grid-card", children: [
2419
+ /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "sledge__article-grid-content", children: [
2420
+ /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "sledge__article-grid-card-image", children: /* @__PURE__ */ jsxRuntimeExports.jsx("a", { href: url, children: /* @__PURE__ */ jsxRuntimeExports.jsx("img", { src: (image == null ? void 0 : image.src) || `${API_URL}/img/blank-image.png`, alt: "sledge-card-image", loading: "lazy" }) }) }),
2421
+ /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "sledge__article-grid-card-desc", children: [
2422
+ /* @__PURE__ */ jsxRuntimeExports.jsx("a", { href: url, children: /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "sledge__article-grid-card-title", children: title }) }),
2423
+ created_at ? /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "sledge__article-grid-badge-vendor", children: convertDate(created_at) }) : null,
2424
+ summary_html ? /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "sledge__article-grid-card-text", dangerouslySetInnerHTML: { __html: summary_html } }) : null
2378
2425
  ] })
2379
2426
  ] }),
2380
- /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "sledge__blog-grid-button-wrapper", children: /* @__PURE__ */ jsxRuntimeExports.jsx(Button, { type: "button", colorType: "light", elementType: "hyperlink", link: url, children: "Learn More" }) })
2427
+ /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "sledge__article-grid-button-wrapper", children: /* @__PURE__ */ jsxRuntimeExports.jsx("a", { href: url, children: /* @__PURE__ */ jsxRuntimeExports.jsxs(Button, { type: "button", colorType: "light", children: [
2428
+ /* @__PURE__ */ jsxRuntimeExports.jsx(NoteIcon, { width: 16, height: 16, color: "#000000" }),
2429
+ /* @__PURE__ */ jsxRuntimeExports.jsx("span", { children: "View Article" })
2430
+ ] }) }) })
2381
2431
  ] }, index);
2382
2432
  }) }) });
2383
2433
  };
@@ -2401,13 +2451,12 @@ const Tooltip = ({ children, content, withArrow = true, customArrow = "", sideOf
2401
2451
  ] }) });
2402
2452
  };
2403
2453
  const ScrollArea$1 = "";
2404
- const ScrollArea = ({ children, isLoading = false, className = "", withCorner = true }) => {
2454
+ const ScrollArea = ({ children, isLoading = false, className = "" }) => {
2405
2455
  return /* @__PURE__ */ jsxRuntimeExports.jsxs($57acba87d6e25586$export$be92b6f5f03c0fe9, { className: `sledge__scroll-area-root ${className}`, children: [
2406
2456
  /* @__PURE__ */ jsxRuntimeExports.jsx($57acba87d6e25586$export$d5c6c08dc2d3ca7, { className: `sledge__scroll-area-viewport ${isLoading ? "sledge__scroll-area-viewport-loading" : ""}`, children }),
2407
2457
  !isLoading && /* @__PURE__ */ jsxRuntimeExports.jsxs(jsxRuntimeExports.Fragment, { children: [
2408
2458
  /* @__PURE__ */ jsxRuntimeExports.jsx($57acba87d6e25586$export$9a4e88b92edfce6b, { className: "sledge__scroll-area-scrollbar", orientation: "vertical", children: /* @__PURE__ */ jsxRuntimeExports.jsx($57acba87d6e25586$export$6521433ed15a34db, { className: "sledge__scroll-area-thumb" }) }),
2409
- /* @__PURE__ */ jsxRuntimeExports.jsx($57acba87d6e25586$export$9a4e88b92edfce6b, { className: "sledge__scroll-area-scrollbar", orientation: "horizontal", children: /* @__PURE__ */ jsxRuntimeExports.jsx($57acba87d6e25586$export$6521433ed15a34db, { className: "sledge__scroll-area-thumb" }) }),
2410
- withCorner && /* @__PURE__ */ jsxRuntimeExports.jsx($57acba87d6e25586$export$ac61190d9fc311a9, { className: "sledge__scroll-area-corner" })
2459
+ /* @__PURE__ */ jsxRuntimeExports.jsx($57acba87d6e25586$export$9a4e88b92edfce6b, { className: "sledge__scroll-area-scrollbar", orientation: "horizontal", children: /* @__PURE__ */ jsxRuntimeExports.jsx($57acba87d6e25586$export$6521433ed15a34db, { className: "sledge__scroll-area-thumb" }) })
2411
2460
  ] })
2412
2461
  ] });
2413
2462
  };
@@ -2452,19 +2501,32 @@ const SkeletonProductGrid = ({ count, type }) => {
2452
2501
  /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "sledge__product-grid-card", children: [
2453
2502
  /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "sledge__product-grid-content", children: [
2454
2503
  /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "sledge__product-grid-card-image sledge__skeleton-product-grid-card-image", children: [
2455
- /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "sledge-wishlist__trigger-block", children: /* @__PURE__ */ jsxRuntimeExports.jsx(SkeletonItem, { width: "40px", height: "40px", color: "darken", rounded: "sm" }) }),
2456
- /* @__PURE__ */ jsxRuntimeExports.jsx(SkeletonItem, { width: "100%", height: "100%", color: "lighten", rounded: "md" })
2504
+ /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "sledge-wishlist__trigger-block", children: /* @__PURE__ */ jsxRuntimeExports.jsx(SkeletonItem, { width: "32px", height: "32px", color: "darken", rounded: "sm" }) }),
2505
+ /* @__PURE__ */ jsxRuntimeExports.jsx(
2506
+ SkeletonItem,
2507
+ {
2508
+ width: "100%",
2509
+ height: "100%",
2510
+ color: "lighten",
2511
+ rounded: "md",
2512
+ style: {
2513
+ borderBottomLeftRadius: 0,
2514
+ borderBottomRightRadius: 0
2515
+ }
2516
+ }
2517
+ )
2457
2518
  ] }),
2458
2519
  /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "sledge__product-grid-card-desc", children: [
2459
2520
  /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "sledge__product-grid-card-title", children: [
2460
- /* @__PURE__ */ jsxRuntimeExports.jsx(SkeletonItem, { width: "134px", height: "28px", color: "lighten", rounded: "md" }),
2521
+ /* @__PURE__ */ jsxRuntimeExports.jsx(SkeletonItem, { width: "79px", height: "28px", color: "lighten", rounded: "md" }),
2461
2522
  /* @__PURE__ */ jsxRuntimeExports.jsx(SkeletonItem, { width: "80px", height: "28px", color: "lighten", rounded: "md" })
2462
2523
  ] }),
2524
+ /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "sledge__product-grid-card-rating", children: /* @__PURE__ */ jsxRuntimeExports.jsx(SkeletonItem, { width: "134px", height: "25px", color: "lighten", rounded: "md" }) }),
2463
2525
  /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "sledge__product-grid-card-text", children: /* @__PURE__ */ jsxRuntimeExports.jsx(
2464
2526
  SkeletonItem,
2465
2527
  {
2466
- width: "190px",
2467
- height: "46px",
2528
+ width: "100%",
2529
+ height: "35px",
2468
2530
  color: "lighten",
2469
2531
  rounded: "md",
2470
2532
  style: {
@@ -2474,7 +2536,7 @@ const SkeletonProductGrid = ({ count, type }) => {
2474
2536
  ) })
2475
2537
  ] })
2476
2538
  ] }),
2477
- /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "sledge__product-grid-button-wrapper", children: /* @__PURE__ */ jsxRuntimeExports.jsx(SkeletonItem, { width: "117px", height: "40px", color: "lighten", rounded: "md" }) })
2539
+ /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "sledge__product-grid-button-wrapper", children: /* @__PURE__ */ jsxRuntimeExports.jsx(SkeletonItem, { width: "100%", height: "40px", color: "lighten", rounded: "md" }) })
2478
2540
  ] }, i)
2479
2541
  );
2480
2542
  }
@@ -2500,38 +2562,10 @@ const SkeletonCollectionGrid = ({ count }) => {
2500
2562
  let components = [];
2501
2563
  for (let i = 0; i < count; i++) {
2502
2564
  components.push(
2503
- /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "sledge__collection-grid-card", children: [
2504
- /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "sledge__collection-grid-card-image", children: /* @__PURE__ */ jsxRuntimeExports.jsx(SkeletonItem, { width: "246px", height: "246px", color: "darken", rounded: "md" }) }),
2505
- /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "sledge__collection-grid-card-content", children: [
2506
- /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "sledge__collection-grid-card-text", children: [
2507
- /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "sledge__collection-grid-card-content-title", children: /* @__PURE__ */ jsxRuntimeExports.jsx(SkeletonItem, { width: "100%", height: "70px", color: "darken", rounded: "lg" }) }),
2508
- /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "sledge__collection-grid-card-content-description", children: /* @__PURE__ */ jsxRuntimeExports.jsx(
2509
- SkeletonItem,
2510
- {
2511
- width: "100%",
2512
- height: "47px",
2513
- color: "darken",
2514
- rounded: "md",
2515
- style: {
2516
- maxWidth: "357px"
2517
- }
2518
- }
2519
- ) })
2520
- ] }),
2521
- /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "sledge__collection-grid-card-content-button-wrapper", children: /* @__PURE__ */ jsxRuntimeExports.jsx(
2522
- SkeletonItem,
2523
- {
2524
- width: "100%",
2525
- height: "40px",
2526
- color: "darken",
2527
- rounded: "md",
2528
- style: {
2529
- maxWidth: "117px"
2530
- }
2531
- }
2532
- ) })
2533
- ] })
2534
- ] }, i)
2565
+ /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "sledge__collection-grid-card", children: /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "sledge__collection-grid-card-content", children: [
2566
+ /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "sledge__collection-grid-card-content-title", children: /* @__PURE__ */ jsxRuntimeExports.jsx(SkeletonItem, { width: "139px", height: "32px", color: "darken", rounded: "md" }) }),
2567
+ /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "sledge__collection-grid-card-content-description", children: /* @__PURE__ */ jsxRuntimeExports.jsx(SkeletonItem, { width: "238px", height: "48px", color: "darken", rounded: "md" }) })
2568
+ ] }) }, i)
2535
2569
  );
2536
2570
  }
2537
2571
  return /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "sledge__collection-grid sledge__skeleton-collection-grid sledge__skeleton-pointer-events-none", children: components });
@@ -2540,36 +2574,10 @@ const SkeletonPageGrid = ({ count }) => {
2540
2574
  let components = [];
2541
2575
  for (let i = 0; i < count; i++) {
2542
2576
  components.push(
2543
- /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "sledge__page-grid-card", children: [
2544
- /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "sledge__page-grid-card-image", children: /* @__PURE__ */ jsxRuntimeExports.jsx(
2545
- SkeletonItem,
2546
- {
2547
- width: "100%",
2548
- height: "100%",
2549
- color: "darken",
2550
- rounded: "md",
2551
- style: {
2552
- borderTopRightRadius: 0,
2553
- borderBottomRightRadius: 0
2554
- }
2555
- }
2556
- ) }),
2557
- /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "sledge__page-grid-card-content", children: [
2558
- /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "sledge__page-grid-card-content-title", children: /* @__PURE__ */ jsxRuntimeExports.jsx(SkeletonItem, { width: "100%", height: "40px", color: "darken", rounded: "md" }) }),
2559
- /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "sledge__page-grid-card-content-description", children: /* @__PURE__ */ jsxRuntimeExports.jsx(
2560
- SkeletonItem,
2561
- {
2562
- width: "100%",
2563
- height: "40px",
2564
- color: "darken",
2565
- rounded: "md",
2566
- style: {
2567
- maxWidth: "115px"
2568
- }
2569
- }
2570
- ) })
2571
- ] })
2572
- ] }, i)
2577
+ /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "sledge__page-grid-card", children: /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "sledge__page-grid-card-content", children: [
2578
+ /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "sledge__page-grid-card-content-title", children: /* @__PURE__ */ jsxRuntimeExports.jsx(SkeletonItem, { width: "139px", height: "32px", color: "darken", rounded: "md" }) }),
2579
+ /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "sledge__page-grid-card-content-description", children: /* @__PURE__ */ jsxRuntimeExports.jsx(SkeletonItem, { width: "238px", height: "48px", color: "darken", rounded: "md" }) })
2580
+ ] }) }, i)
2573
2581
  );
2574
2582
  }
2575
2583
  return /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "sledge__page-grid sledge__skeleton-page-grid sledge__skeleton-pointer-events-none", children: components });
@@ -2578,66 +2586,87 @@ const SkeletonBlogGrid = ({ count }) => {
2578
2586
  let components = [];
2579
2587
  for (let i = 0; i < count; i++) {
2580
2588
  components.push(
2581
- /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "sledge__blog-grid-card", children: /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "sledge__blog-grid-content", children: [
2582
- /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "sledge__blog-grid-card-image", children: /* @__PURE__ */ jsxRuntimeExports.jsx(SkeletonItem, { width: "100%", height: "100%", color: "lighten", rounded: "md" }) }),
2583
- /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "sledge__blog-grid-card-desc", children: [
2584
- /* @__PURE__ */ jsxRuntimeExports.jsx(
2589
+ /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "sledge__blog-grid-card", children: [
2590
+ /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "sledge__blog-grid-content", children: [
2591
+ /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "sledge__blog-grid-card-image sledge__skeleton-blog-grid-card-image", children: /* @__PURE__ */ jsxRuntimeExports.jsx(
2585
2592
  SkeletonItem,
2586
2593
  {
2587
2594
  width: "100%",
2588
- height: "28px",
2595
+ height: "100%",
2589
2596
  color: "lighten",
2590
2597
  rounded: "md",
2591
2598
  style: {
2592
- maxWidth: "242px",
2593
- marginTop: "26px",
2594
- marginBottom: "12px"
2599
+ borderBottomLeftRadius: 0,
2600
+ borderBottomRightRadius: 0
2595
2601
  }
2596
2602
  }
2597
- ),
2598
- /* @__PURE__ */ jsxRuntimeExports.jsx(
2599
- SkeletonItem,
2600
- {
2601
- width: "100%",
2602
- height: "28px",
2603
- color: "lighten",
2604
- rounded: "md",
2605
- style: {
2606
- maxWidth: "80px",
2607
- marginBottom: "27px"
2603
+ ) }),
2604
+ /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "sledge__blog-grid-card-desc", children: [
2605
+ /* @__PURE__ */ jsxRuntimeExports.jsx(SkeletonItem, { width: "100%", height: "40px", color: "lighten", rounded: "md" }),
2606
+ /* @__PURE__ */ jsxRuntimeExports.jsx(
2607
+ SkeletonItem,
2608
+ {
2609
+ width: "79px",
2610
+ height: "26px",
2611
+ color: "lighten",
2612
+ rounded: "md",
2613
+ style: {
2614
+ marginTop: "12px",
2615
+ marginBottom: "16px"
2616
+ }
2608
2617
  }
2609
- }
2610
- ),
2611
- /* @__PURE__ */ jsxRuntimeExports.jsx(
2618
+ ),
2619
+ /* @__PURE__ */ jsxRuntimeExports.jsx(SkeletonItem, { width: "100%", height: "72px", color: "lighten", rounded: "md" })
2620
+ ] })
2621
+ ] }),
2622
+ /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "sledge__blog-grid-button-wrapper", children: /* @__PURE__ */ jsxRuntimeExports.jsx(SkeletonItem, { width: "100%", height: "40px", color: "lighten", rounded: "md" }) })
2623
+ ] }, i)
2624
+ );
2625
+ }
2626
+ return /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "sledge__blog-grid sledge__skeleton-blog-grid sledge__skeleton-pointer-events-none", children: components });
2627
+ };
2628
+ const SkeletonArticleGrid = ({ count }) => {
2629
+ let components = [];
2630
+ for (let i = 0; i < count; i++) {
2631
+ components.push(
2632
+ /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "sledge__article-grid-card", children: [
2633
+ /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "sledge__article-grid-content", children: [
2634
+ /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "sledge__article-grid-card-image sledge__skeleton-article-grid-card-image", children: /* @__PURE__ */ jsxRuntimeExports.jsx(
2612
2635
  SkeletonItem,
2613
2636
  {
2614
2637
  width: "100%",
2615
- height: "80px",
2638
+ height: "100%",
2616
2639
  color: "lighten",
2617
2640
  rounded: "md",
2618
2641
  style: {
2619
- maxWidth: "190px",
2620
- marginBottom: "27px"
2642
+ borderBottomLeftRadius: 0,
2643
+ borderBottomRightRadius: 0
2621
2644
  }
2622
2645
  }
2623
- ),
2624
- /* @__PURE__ */ jsxRuntimeExports.jsx(
2625
- SkeletonItem,
2626
- {
2627
- width: "100%",
2628
- height: "40px",
2629
- color: "lighten",
2630
- rounded: "md",
2631
- style: {
2632
- maxWidth: "117px"
2646
+ ) }),
2647
+ /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "sledge__article-grid-card-desc", children: [
2648
+ /* @__PURE__ */ jsxRuntimeExports.jsx(SkeletonItem, { width: "100%", height: "40px", color: "lighten", rounded: "md" }),
2649
+ /* @__PURE__ */ jsxRuntimeExports.jsx(
2650
+ SkeletonItem,
2651
+ {
2652
+ width: "79px",
2653
+ height: "26px",
2654
+ color: "lighten",
2655
+ rounded: "md",
2656
+ style: {
2657
+ marginTop: "12px",
2658
+ marginBottom: "16px"
2659
+ }
2633
2660
  }
2634
- }
2635
- )
2636
- ] })
2637
- ] }) }, i)
2661
+ ),
2662
+ /* @__PURE__ */ jsxRuntimeExports.jsx(SkeletonItem, { width: "100%", height: "72px", color: "lighten", rounded: "md" })
2663
+ ] })
2664
+ ] }),
2665
+ /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "sledge__article-grid-button-wrapper", children: /* @__PURE__ */ jsxRuntimeExports.jsx(SkeletonItem, { width: "100%", height: "40px", color: "lighten", rounded: "md" }) })
2666
+ ] }, i)
2638
2667
  );
2639
2668
  }
2640
- return /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "sledge__blog-grid sledge__skeleton-blog-grid sledge__skeleton-pointer-events-none", children: components });
2669
+ return /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "sledge__article-grid sledge__skeleton-article-grid sledge__skeleton-pointer-events-none", children: components });
2641
2670
  };
2642
2671
  const SkeletonLoading = {
2643
2672
  Item: SkeletonItem,
@@ -2645,7 +2674,8 @@ const SkeletonLoading = {
2645
2674
  ProductGrid: SkeletonProductGrid,
2646
2675
  CollectionGrid: SkeletonCollectionGrid,
2647
2676
  PageGrid: SkeletonPageGrid,
2648
- BlogGrid: SkeletonBlogGrid
2677
+ BlogGrid: SkeletonBlogGrid,
2678
+ ArticleGrid: SkeletonArticleGrid
2649
2679
  };
2650
2680
  const SearchIconWidget = (props) => {
2651
2681
  const { isRenderApp, isJsVersion } = React__default.useContext(SledgeContext);
@@ -3098,15 +3128,42 @@ const SearchResultWidget = (props) => {
3098
3128
  var _a, _b, _c, _d, _e, _f, _g, _h, _i, _j, _k, _l, _m, _n, _o, _p, _q, _r, _s;
3099
3129
  const { isRenderApp, isJsVersion } = React__default.useContext(SledgeContext);
3100
3130
  const { instantSearch: isRenderAppInstantSearch } = isRenderApp || {};
3101
- const { layoutType = "default", query, params, children, onAfterAddToCart, onAfterAddWishlist, onAfterRemoveWishlist, onAfterRenderProduct, data: propsData, sledgeSettings } = props;
3131
+ const {
3132
+ layoutType = "default",
3133
+ query,
3134
+ params,
3135
+ children,
3136
+ onAfterAddToCart,
3137
+ onAfterAddWishlist,
3138
+ onAfterRemoveWishlist,
3139
+ onAfterRenderProduct,
3140
+ onAfterRenderCollection,
3141
+ onAfterRenderPage,
3142
+ onAfterRenderBlog,
3143
+ onAfterRenderArticle,
3144
+ data: propsData,
3145
+ sledgeSettings
3146
+ } = props;
3102
3147
  const { keyword: queryKeyword = "" } = query || {};
3103
3148
  const { collectionId } = params || {};
3104
3149
  let productCardsComponent = null;
3150
+ let collectionCardsComponent = null;
3151
+ let pageCardsComponent = null;
3152
+ let blogCardsComponent = null;
3153
+ let articleCardsComponent = null;
3105
3154
  React__default.Children.map(children, (child) => {
3106
3155
  if (React__default.isValidElement(child) && isFunction(child.type)) {
3107
- const { productCard } = (child == null ? void 0 : child.props) || {};
3156
+ const { productCard, collectionCard, pageCard, blogCard, articleCard } = (child == null ? void 0 : child.props) || {};
3108
3157
  if (productCard && isFunction(productCard))
3109
3158
  productCardsComponent = productCard;
3159
+ if (collectionCard && isFunction(collectionCard))
3160
+ collectionCardsComponent = collectionCard;
3161
+ if (pageCard && isFunction(pageCard))
3162
+ pageCardsComponent = pageCard;
3163
+ if (blogCard && isFunction(blogCard))
3164
+ blogCardsComponent = blogCard;
3165
+ if (articleCard && isFunction(articleCard))
3166
+ articleCardsComponent = articleCard;
3110
3167
  }
3111
3168
  });
3112
3169
  const searchParams = typeof document !== "undefined" ? new URLSearchParams((_a = document == null ? void 0 : document.location) == null ? void 0 : _a.search) : null;
@@ -3566,10 +3623,18 @@ const SearchResultWidget = (props) => {
3566
3623
  params,
3567
3624
  isJsVersion,
3568
3625
  productCardsComponent,
3626
+ collectionCardsComponent,
3627
+ pageCardsComponent,
3628
+ blogCardsComponent,
3629
+ articleCardsComponent,
3569
3630
  onAfterAddToCart,
3570
3631
  onAfterAddWishlist,
3571
3632
  onAfterRemoveWishlist,
3572
3633
  onAfterRenderProduct,
3634
+ onAfterRenderCollection,
3635
+ onAfterRenderPage,
3636
+ onAfterRenderBlog,
3637
+ onAfterRenderArticle,
3573
3638
  setIsLoading,
3574
3639
  setKeyword,
3575
3640
  filterHorizontalSkeleton,
@@ -4258,7 +4323,22 @@ const ResultProduct = (props) => {
4258
4323
  };
4259
4324
  const ResultCategory = (props) => {
4260
4325
  var _a, _b, _c, _d;
4261
- const { keyword, clickedTabIndexId, clickedTabIndexName, setKeyword, searchResultContainerRef } = props || {};
4326
+ const {
4327
+ keyword,
4328
+ clickedTabIndexId,
4329
+ clickedTabIndexName,
4330
+ isJsVersion,
4331
+ collectionCardsComponent,
4332
+ pageCardsComponent,
4333
+ blogCardsComponent,
4334
+ articleCardsComponent,
4335
+ setKeyword,
4336
+ searchResultContainerRef,
4337
+ onAfterRenderCollection,
4338
+ onAfterRenderPage,
4339
+ onAfterRenderBlog,
4340
+ onAfterRenderArticle
4341
+ } = props || {};
4262
4342
  const [isFirstLoading, setIsFirstLoading] = React__default.useState(true);
4263
4343
  const [isLoading, setIsLoading] = React__default.useState(true);
4264
4344
  const [clickedSortId, setClickedSortId] = React__default.useState("");
@@ -4339,7 +4419,7 @@ const ResultCategory = (props) => {
4339
4419
  }
4340
4420
  ) });
4341
4421
  const summaryTextSkeleton = /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "sledge-instant-search__result-data-summary", children: /* @__PURE__ */ jsxRuntimeExports.jsx(SkeletonLoading.Item, { width: "117px", height: "28px", color: "lighten", rounded: "md" }) });
4342
- const skeletonLoadingComponent = ((_a = String(clickedTabIndexId)) == null ? void 0 : _a.includes("collection")) ? /* @__PURE__ */ jsxRuntimeExports.jsx(SkeletonLoading.CollectionGrid, { count: 3 }) : ((_b = String(clickedTabIndexId)) == null ? void 0 : _b.includes("page")) ? /* @__PURE__ */ jsxRuntimeExports.jsx(SkeletonLoading.PageGrid, { count: 12 }) : ((_c = String(clickedTabIndexId)) == null ? void 0 : _c.includes("blog")) || ((_d = String(clickedTabIndexId)) == null ? void 0 : _d.includes("article")) ? /* @__PURE__ */ jsxRuntimeExports.jsx(SkeletonLoading.BlogGrid, { count: 12 }) : null;
4422
+ const skeletonLoadingComponent = ((_a = String(clickedTabIndexId)) == null ? void 0 : _a.includes("collection")) ? /* @__PURE__ */ jsxRuntimeExports.jsx(SkeletonLoading.CollectionGrid, { count: 6 }) : ((_b = String(clickedTabIndexId)) == null ? void 0 : _b.includes("page")) ? /* @__PURE__ */ jsxRuntimeExports.jsx(SkeletonLoading.PageGrid, { count: 6 }) : ((_c = String(clickedTabIndexId)) == null ? void 0 : _c.includes("blog")) ? /* @__PURE__ */ jsxRuntimeExports.jsx(SkeletonLoading.BlogGrid, { count: 12 }) : ((_d = String(clickedTabIndexId)) == null ? void 0 : _d.includes("article")) ? /* @__PURE__ */ jsxRuntimeExports.jsx(SkeletonLoading.ArticleGrid, { count: 12 }) : null;
4343
4423
  const ProvideElementFirstLoading = () => /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "sledge-instant-search__result-data-category-wrapper", children: [
4344
4424
  searchKeywordComponent,
4345
4425
  summaryTextSkeleton,
@@ -4352,27 +4432,13 @@ const ResultCategory = (props) => {
4352
4432
  ] });
4353
4433
  const ProvideElement = (elementProps) => {
4354
4434
  var _a2, _b2, _c2, _d2;
4355
- return ((_a2 = String(clickedTabIndexId)) == null ? void 0 : _a2.includes("collection")) ? /* @__PURE__ */ jsxRuntimeExports.jsx(CollectionGrid, { ...elementProps }) : ((_b2 = String(clickedTabIndexId)) == null ? void 0 : _b2.includes("page")) ? /* @__PURE__ */ jsxRuntimeExports.jsx(PageGrid, { ...elementProps }) : ((_c2 = String(clickedTabIndexId)) == null ? void 0 : _c2.includes("blog")) || ((_d2 = String(clickedTabIndexId)) == null ? void 0 : _d2.includes("article")) ? /* @__PURE__ */ jsxRuntimeExports.jsx(BlogGrid, { ...elementProps }) : null;
4435
+ return ((_a2 = String(clickedTabIndexId)) == null ? void 0 : _a2.includes("collection")) ? /* @__PURE__ */ jsxRuntimeExports.jsx(CollectionGrid, { cards: collectionCardsComponent, onAfterRenderCollection, ...elementProps }) : ((_b2 = String(clickedTabIndexId)) == null ? void 0 : _b2.includes("page")) ? /* @__PURE__ */ jsxRuntimeExports.jsx(PageGrid, { cards: pageCardsComponent, onAfterRenderPage, ...elementProps }) : ((_c2 = String(clickedTabIndexId)) == null ? void 0 : _c2.includes("blog")) ? /* @__PURE__ */ jsxRuntimeExports.jsx(BlogGrid, { cards: blogCardsComponent, onAfterRenderBlog, ...elementProps }) : ((_d2 = String(clickedTabIndexId)) == null ? void 0 : _d2.includes("article")) ? /* @__PURE__ */ jsxRuntimeExports.jsx(ArticleGrid, { cards: articleCardsComponent, onAfterRenderArticle, ...elementProps }) : null;
4356
4436
  };
4357
4437
  return /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "sledge-instant-search__result-wrapper", children: isFirstLoading ? /* @__PURE__ */ jsxRuntimeExports.jsx(ProvideElementFirstLoading, {}) : /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "sledge-instant-search__result-data-category-wrapper", children: isLoading ? /* @__PURE__ */ jsxRuntimeExports.jsx(ProvideElementLoading, {}) : /* @__PURE__ */ jsxRuntimeExports.jsxs(jsxRuntimeExports.Fragment, { children: [
4358
4438
  searchKeywordComponent,
4359
4439
  /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "sledge-instant-search__result-data-summary", children: summaryText }),
4360
4440
  (searchResult == null ? void 0 : searchResult.length) ? /* @__PURE__ */ jsxRuntimeExports.jsxs(jsxRuntimeExports.Fragment, { children: [
4361
- /* @__PURE__ */ jsxRuntimeExports.jsx(
4362
- ProvideElement,
4363
- {
4364
- data: searchResult.map((item) => {
4365
- const { id, title, url } = item;
4366
- return {
4367
- id,
4368
- title,
4369
- description: `${title}${clickedTabIndexName ? ` ${clickedTabIndexName.toLowerCase()}` : ""}`,
4370
- url,
4371
- image: ""
4372
- };
4373
- })
4374
- }
4375
- ),
4441
+ /* @__PURE__ */ jsxRuntimeExports.jsx(ProvideElement, { data: searchResult, isComponentJsVersion: isJsVersion }),
4376
4442
  /* @__PURE__ */ jsxRuntimeExports.jsx(Pagination, { currentPage, totalPage, totalResult: totalSearchResult, onChange: (page) => handlePageChange(page) })
4377
4443
  ] }) : /* @__PURE__ */ jsxRuntimeExports.jsx(ResultEmpty, {})
4378
4444
  ] }) }) });
@@ -4560,7 +4626,7 @@ const SearchWidget = (props) => {
4560
4626
  )
4561
4627
  ] }, index)) }),
4562
4628
  /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "sledge-instant-search__widget-search-form-result-flex-item-product", children: /* @__PURE__ */ jsxRuntimeExports.jsx(SkeletonLoading.ProductGrid, { count: 6, type: "small" }) })
4563
- ] }) }) : /* @__PURE__ */ jsxRuntimeExports.jsx(ScrollArea, { isLoading, withCorner: false, children: /* @__PURE__ */ jsxRuntimeExports.jsxs(jsxRuntimeExports.Fragment, { children: [
4629
+ ] }) }) : /* @__PURE__ */ jsxRuntimeExports.jsx(ScrollArea, { isLoading, children: /* @__PURE__ */ jsxRuntimeExports.jsxs(jsxRuntimeExports.Fragment, { children: [
4564
4630
  /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "sledge-instant-search__widget-search-form-result-flex", children: [
4565
4631
  /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "sledge-instant-search__widget-search-form-result-flex-item-other", children: [
4566
4632
  Object.keys(suggestionSettings).length && ((_b = (_a = suggestionSettings[suggestionIndex]) == null ? void 0 : _a.keywords) == null ? void 0 : _b.active) && ((_e = (_d = (_c = suggestionSettings[suggestionIndex]) == null ? void 0 : _c.keywords) == null ? void 0 : _d.list) == null ? void 0 : _e.length) ? /* @__PURE__ */ jsxRuntimeExports.jsx(