hasting-swatchcart-module 0.0.41 → 1.0.1

package/dist/src/shared/constants/selectedMaterials.js

@@ -1,4 +0,0 @@
-const o = 5;
-export {
-  o as MAX_SLOTS
-};

package/dist/src/shared/types/activeTab.js

@@ -1,7 +0,0 @@
-const t = {
-  SWATCH: "swatch",
-  CART: "cart"
-};
-export {
-  t as EActiveTab
-};

package/dist/src/shared/ui/Checkbox/Checkbox.js

@@ -1,31 +0,0 @@
-import { jsx as e } from "react/jsx-runtime";
-import { Checkbox as t, CheckboxIndicator as a } from "../../../../node_modules/@radix-ui/react-checkbox/dist/index.js";
-import { cn as o } from "../../utils/cn.js";
-import c from "../../../../node_modules/lucide-react/dist/esm/icons/check.js";
-function l({
-  className: r,
-  ...i
-}) {
-  return /* @__PURE__ */ e(
-    t,
-    {
-      "data-slot": "checkbox",
-      className: o(
-        "bg-white peer border-input dark:bg-input/30 data-[state=checked]:bg-black data-[state=checked]:text-primary-foreground dark:data-[state=checked]:bg-black data-[state=checked]:border-black focus-visible:border-ring focus-visible:ring-ring/50 aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive size-4 shrink-0 rounded-[4px] border shadow-xs transition-shadow outline-none focus-visible:ring-[3px] disabled:cursor-not-allowed disabled:opacity-50",
-        r
-      ),
-      ...i,
-      children: /* @__PURE__ */ e(
-        a,
-        {
-          "data-slot": "checkbox-indicator",
-          className: "flex items-center justify-center text-current transition-none",
-          children: /* @__PURE__ */ e(c, { className: "size-5" })
-        }
-      )
-    }
-  );
-}
-export {
-  l as Checkbox
-};

package/dist/src/shared/ui/CustomButton/CustomButton.js

@@ -1,16 +0,0 @@
-import { jsx as s } from "react/jsx-runtime";
-const c = ({
-  children: t,
-  disabled: o,
-  ...e
-}) => /* @__PURE__ */ s(
-  "button",
-  {
-    className: `w-full bg-[var(--main-accent-color)] text-white py-3 rounded-full font-bold transition-colors duration-300 ${o ? "bg-gray-400 text-gray-200 cursor-not-allowed opacity-70" : "cursor-pointer hover:opacity-90"}`,
-    ...e,
-    children: t
-  }
-);
-export {
-  c as CustomButton
-};

package/dist/src/shared/ui/CustomSidebar/CustomSidebar.js

@@ -1,59 +0,0 @@
-import { jsx as s } from "react/jsx-runtime";
-import { useRef as u, useLayoutEffect as v, useEffect as l } from "react";
-import { createPortal as y } from "react-dom";
-import { clsx as w } from "../../../../node_modules/clsx/dist/clsx.js";
-import r from "./CustomSidebar.module.scss.js";
-import { cn as b } from "../../utils/cn.js";
-const k = ({
-  children: d,
-  isOpen: e,
-  setIsOpen: a
-}) => {
-  const c = u(null), f = u(null), n = () => a(!1);
-  return v(() => {
-    e && typeof document < "u" && (f.current = document.activeElement);
-  }, [e]), l(() => {
-    e ? c.current?.focus() : f.current?.focus?.();
-  }, [e]), l(() => {
-    if (!e) return;
-    const o = (t) => {
-      t.key === "Escape" && n();
-    };
-    return window.addEventListener("keydown", o), () => window.removeEventListener("keydown", o);
-  }, [e]), l(() => {
-    if (!e) return;
-    const o = document.documentElement, t = document.body, m = o.style.overflow, i = t.style.overflow;
-    return o.style.overflow = "hidden", t.style.overflow = "hidden", () => {
-      o.style.overflow = m, t.style.overflow = i;
-    };
-  }, [e]), e ? y(
-    /* @__PURE__ */ s(
-      "div",
-      {
-        className: w(r.overlay),
-        onMouseDown: n,
-        onTouchStart: n,
-        children: /* @__PURE__ */ s(
-          "div",
-          {
-            ref: c,
-            tabIndex: -1,
-            className: b(
-              r.panel,
-              r.right,
-              e ? r.enter : r.exit,
-              "bg-[var(--sidebar-bg)]"
-            ),
-            onMouseDown: (o) => o.stopPropagation(),
-            onTouchStart: (o) => o.stopPropagation(),
-            children: d
-          }
-        )
-      }
-    ),
-    document.body
-  ) : null;
-};
-export {
-  k as default
-};

package/dist/src/shared/ui/CustomSidebar/CustomSidebar.module.scss.js

@@ -1,13 +0,0 @@
-const e = "_overlay_18vc6_1", t = "_panel_18vc6_10", _ = "_enter_18vc6_28", n = "_exit_18vc6_32", c = {
-  overlay: e,
-  panel: t,
-  enter: _,
-  exit: n
-};
-export {
-  c as default,
-  _ as enter,
-  n as exit,
-  e as overlay,
-  t as panel
-};

package/dist/src/shared/ui/Dialog/Dialog.js

@@ -1,81 +0,0 @@
-import { jsx as o, jsxs as n } from "react/jsx-runtime";
-import * as l from "react";
-import { Root as f, Portal as g, Content as r, Close as u, Title as d, Overlay as c, Description as m } from "../../../../node_modules/@radix-ui/react-dialog/dist/index.js";
-import { cn as s } from "../../utils/cn.js";
-import y from "../../../../node_modules/lucide-react/dist/esm/icons/x.js";
-const k = f, N = g, p = l.forwardRef(({ className: a, ...e }, t) => /* @__PURE__ */ o(
-  c,
-  {
-    ref: t,
-    className: s(
-      "fixed inset-0 z-10000 bg-black/80 data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0",
-      a
-    ),
-    ...e,
-    onClick: (i) => i.stopPropagation()
-  }
-));
-p.displayName = c.displayName;
-const x = l.forwardRef(({ className: a, children: e, ...t }, i) => /* @__PURE__ */ n(N, { container: document.querySelector(".root-app"), children: [
-  /* @__PURE__ */ o(p, {}),
-  /* @__PURE__ */ n(
-    r,
-    {
-      ref: i,
-      className: s(
-        "z-10001 data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 fixed top-[50%] left-[50%] w-full max-w-[calc(100%-2rem)] max-h-[80vh] translate-x-[-50%] translate-y-[-50%] duration-200 overflow-y-auto",
-        a
-      ),
-      ...t,
-      children: [
-        e,
-        /* @__PURE__ */ n(u, { className: "absolute right-4 top-4 cursor-pointer rounded-full bg-gray-200 transition-background hover:bg-gray-300 disabled:pointer-events-none duration-200 p-2", children: [
-          /* @__PURE__ */ o(y, { className: "h-8 w-8" }),
-          /* @__PURE__ */ o("span", { className: "sr-only", children: "Close" })
-        ] })
-      ]
-    }
-  )
-] }));
-x.displayName = r.displayName;
-const h = ({
-  className: a,
-  ...e
-}) => /* @__PURE__ */ o(
-  "div",
-  {
-    className: s("flex flex-col space-y-1.5 text-left", a),
-    ...e
-  }
-);
-h.displayName = "DialogHeader";
-const D = l.forwardRef(({ className: a, ...e }, t) => /* @__PURE__ */ o(
-  d,
-  {
-    ref: t,
-    className: s(
-      "text-3xl font-semibold leading-none tracking-tight",
-      a
-    ),
-    ...e
-  }
-));
-D.displayName = d.displayName;
-const b = l.forwardRef(({ className: a, ...e }, t) => /* @__PURE__ */ o(
-  m,
-  {
-    ref: t,
-    className: s("text-muted-foreground", a),
-    ...e
-  }
-));
-b.displayName = m.displayName;
-export {
-  k as Dialog,
-  x as DialogContent,
-  b as DialogDescription,
-  h as DialogHeader,
-  p as DialogOverlay,
-  N as DialogPortal,
-  D as DialogTitle
-};

package/dist/src/shared/ui/Label/Label.js

@@ -1,27 +0,0 @@
-import { jsx as a } from "react/jsx-runtime";
-const s = ({ text: o, isActive: r = !1, onClick: n }) => {
-  const t = () => {
-    n && n();
-  };
-  return /* @__PURE__ */ a(
-    "div",
-    {
-      role: "button",
-      tabIndex: 0,
-      onClick: t,
-      onKeyDown: (e) => {
-        (e.key === "Enter" || e.key === " ") && (e.preventDefault(), t());
-      },
-      className: `
-        flex justify-center items-center max-w-max px-4 py-2 capitalize rounded-full
-        font-medium text-sm cursor-pointer transition-all duration-[400ms] ease-in-out
-        outline-none focus:ring-2 focus:ring-[var(--main-accent-color)] focus:ring-offset-2
-        ${r ? "bg-[var(--main-accent-color)] text-white hover:brightness-90" : "bg-[var(--label-bg)] hover:brightness-95"}
-      `,
-      children: o
-    }
-  );
-};
-export {
-  s as Label
-};

package/dist/src/shared/ui/Markdown/MDWithAccordion.js

@@ -1,36 +0,0 @@
-import { jsx as i } from "react/jsx-runtime";
-import n from "./MDWithAccordion.module.scss.js";
-import { Markdown as p } from "../../../../node_modules/react-markdown/lib/index.js";
-import l from "../../../../node_modules/rehype-raw/lib/index.js";
-function d(r, { openFirst: o = !1 } = {}) {
-  if (!r) return "";
-  const s = /~H~~([\s\S]*?)~~\s*~M~~([\s\S]*?)~~/g;
-  let t = 0;
-  return r.replace(s, (e, c, a) => {
-    const m = o && t === 0 ? " open" : "";
-    return t += 1, `
-<details class="${n.mdAccordion}"${m}>
-<summary>${String(c).trim()}</summary>
-<div class="p-4">
-${String(a).trim()}
-</div>
-</details>`;
-  });
-}
-function A({
-  children: r,
-  className: o = "",
-  openFirst: s = !1
-}) {
-  const e = d(typeof r == "string" ? r : "", { openFirst: s });
-  return /* @__PURE__ */ i(
-    "div",
-    {
-      className: ["prose", n.prose, o].filter(Boolean).join(" "),
-      children: /* @__PURE__ */ i(p, { rehypePlugins: [l], children: e })
-    }
-  );
-}
-export {
-  A as default
-};

package/dist/src/shared/ui/Markdown/MDWithAccordion.module.scss.js

@@ -1,9 +0,0 @@
-const o = "_prose_1l8lv_1", c = "_mdAccordion_1l8lv_16", s = {
-  prose: o,
-  mdAccordion: c
-};
-export {
-  s as default,
-  c as mdAccordion,
-  o as prose
-};

package/dist/src/shared/ui/MaterialItem/MaterialItem.js

@@ -1,36 +0,0 @@
-import { jsxs as s, jsx as r } from "react/jsx-runtime";
-import { AttributeHelper as m } from "../../../features/swatches/lib/AttributeHelper.js";
-import { ImageGridZoom as n } from "../../../features/swatches/ui/ImageGridZoom/ImageGridZoom.js";
-import { CloseIconSVG as d } from "../../../app/assets/svg/CloseIconSVG.js";
-import { HexGridZoom as a } from "../../../features/swatches/ui/HexGridZoom/HexGridZoom.js";
-const b = "w-16 h-16 bg-[var(--sidebar-b)] border border-solid border-[var(--border)] rounded-sm aspect-square overflow-hidden transition", g = ({
-  val: e,
-  className: o,
-  isShowDeleteIcon: i = !1,
-  handleSelect: t
-}) => /* @__PURE__ */ s(
-  "button",
-  {
-    onClick: () => {
-      t && t(e);
-    },
-    className: `relative ${o || b}`,
-    "aria-label": `Selected swatch ${e.name ?? e.assetId}`,
-    title: "Click to remove",
-    children: [
-      m.getImage(e) ? /* @__PURE__ */ r(n, { item: e }) : /* @__PURE__ */ r(a, { item: e }),
-      i ? /* @__PURE__ */ r(
-        "div",
-        {
-          className: `absolute top-0 right-0 m-2 w-[16px] h-[16px] flex justify-center items-center\r
-          bg-[var(--background-grey)] rounded-2xl border-none pointer-events-none`,
-          children: /* @__PURE__ */ r(d, { className: "w-2 h-2 stroke-[var(--svg-dark)]" })
-        }
-      ) : null
-    ]
-  },
-  e.assetId
-);
-export {
-  g as MaterialItem
-};

package/dist/src/shared/ui/MultiSelect/MultiSelect.js

@@ -1,150 +0,0 @@
-import { jsxs as o, jsx as t } from "react/jsx-runtime";
-import * as i from "react";
-import { Root as S, Trigger as j, Content as L } from "../../../../node_modules/@radix-ui/react-popover/dist/index.js";
-import { PopoverTooltip as O } from "../PopoverTooltip/PopoverTooltip.js";
-import { cn as f } from "../../utils/cn.js";
-import { Checkbox as R } from "../Checkbox/Checkbox.js";
-import D from "../../../../node_modules/lucide-react/dist/esm/icons/chevron-down.js";
-import z from "../../../../node_modules/lucide-react/dist/esm/icons/x.js";
-const P = i.forwardRef(
-  ({
-    options: u,
-    values: a,
-    onValueChange: c,
-    placeholder: d = "Select options...",
-    className: y,
-    dropdownWidth: h,
-    align: N = "start",
-    getTooltipByMaterialAndSection: x,
-    sectionName: w
-  }, C) => {
-    const [l, m] = i.useState(!1), v = i.useRef(null);
-    i.useEffect(() => {
-      if (!l) return;
-      const e = (r) => {
-        const b = r.target, p = v.current;
-        p && (p.contains(b) || b === p) || m(!1);
-      }, n = (r) => {
-        r.key === "Escape" && m(!1);
-      };
-      return window.addEventListener("scroll", e, !0), window.addEventListener("resize", e), document.addEventListener("keydown", n), () => {
-        window.removeEventListener("scroll", e, !0), window.removeEventListener("resize", e), document.removeEventListener("keydown", n);
-      };
-    }, [l]);
-    const g = (e, n) => {
-      c(n ? [...a, e] : a.filter((r) => r !== e));
-    }, k = () => {
-      c([]);
-    }, s = a.length, E = s === 0 ? d : s === 1 ? u.find((e) => e.value === a[0])?.label || `${d} selected` : /* @__PURE__ */ o("div", { className: "flex flex-row items-center justify-between w-full", children: [
-      /* @__PURE__ */ t("span", { className: "truncate", children: d }),
-      /* @__PURE__ */ t("span", { className: "text-[0.8rem] text-white bg-[var(--main-accent-color)] px-1.5 py-0.5 ml-2 rounded-full whitespace-nowrap", children: s })
-    ] });
-    return /* @__PURE__ */ o(S, { open: l, onOpenChange: m, children: [
-      /* @__PURE__ */ o(
-        j,
-        {
-          ref: C,
-          className: f(
-            "flex flex-row items-center justify-between rounded-full border px-3 sm:px-5 py-2 bg-white cursor-pointer hover:bg-gray-50 data-[state=open]:border-primary hover:border-primary focus:border-primary",
-            y
-          ),
-          children: [
-            /* @__PURE__ */ t("div", { className: "w-full text-[0.9rem] truncate text-left", children: E }),
-            /* @__PURE__ */ t(
-              D,
-              {
-                className: f(
-                  "ml-2 h-4 w-4 transition-transform",
-                  l && "rotate-180"
-                )
-              }
-            )
-          ]
-        }
-      ),
-      /* @__PURE__ */ o(
-        L,
-        {
-          ref: v,
-          className: f(
-            "bg-white border rounded-lg shadow-lg z-50 max-h-80 overflow-y-auto overscroll-behavior-y-contain touch-pan-y p-2",
-            h || "w-[var(--radix-popover-trigger-width)]"
-          ),
-          align: N,
-          sideOffset: 4,
-          style: {
-            WebkitOverflowScrolling: "touch",
-            overscrollBehavior: "contain"
-          },
-          onTouchStart: (e) => {
-            e.stopPropagation();
-          },
-          onTouchMove: (e) => {
-            e.stopPropagation();
-          },
-          onWheel: (e) => {
-            e.stopPropagation();
-          },
-          children: [
-            s > 0 && /* @__PURE__ */ t("div", { className: "flex flex-row gap-2 items-center justify-between px-2 py-1 mb-2 border-b", children: /* @__PURE__ */ o(
-              "button",
-              {
-                onClick: k,
-                className: "text-[1.2rem] text-black hover:text-primary transition-color cursor-pointer duration-200 flex flex-row items-center gap-1",
-                children: [
-                  /* @__PURE__ */ t(z, { className: "h-3 w-3" }),
-                  "Clear all"
-                ]
-              }
-            ) }),
-            /* @__PURE__ */ t("div", { className: "flex flex-col gap-1", children: u.map((e) => {
-              const n = a.includes(e.value);
-              return /* @__PURE__ */ o(
-                "div",
-                {
-                  className: "flex flex-row items-start gap-2 px-2 py-1 hover:bg-gray-50 rounded transition-background duration-300 cursor-pointer",
-                  onClick: () => g(e.value, !n),
-                  children: [
-                    /* @__PURE__ */ t(
-                      R,
-                      {
-                        checked: n,
-                        className: "size-6",
-                        onCheckedChange: (r) => g(e.value, r)
-                      }
-                    ),
-                    /* @__PURE__ */ o("div", { className: "flex-1 flex flex-row items-start justify-between", children: [
-                      /* @__PURE__ */ o("div", { className: "flex flex-row items-center gap-2", children: [
-                        /* @__PURE__ */ t("span", { className: "text-[1.2rem]", children: e.label }),
-                        (() => {
-                          if (!x || !w)
-                            return null;
-                          const r = x(
-                            e.value,
-                            w
-                          );
-                          return r && r.Description ? /* @__PURE__ */ t(
-                            O,
-                            {
-                              tooltipData: r?.Description
-                            }
-                          ) : null;
-                        })()
-                      ] }),
-                      e.count !== void 0 && /* @__PURE__ */ t("span", { className: "text-[1rem] text-gray-800 bg-gray-100 px-2 py-0.5 ml-2 rounded-full whitespace-nowrap", children: e.count })
-                    ] })
-                  ]
-                },
-                e.value
-              );
-            }) })
-          ]
-        }
-      )
-    ] });
-  }
-);
-P.displayName = "MultiSelect";
-export {
-  P as MultiSelect
-};

package/dist/src/shared/ui/PopoverTooltip/InfoIcon.js

@@ -1,35 +0,0 @@
-import { jsxs as i, jsx as t } from "react/jsx-runtime";
-function h(e) {
-  return /* @__PURE__ */ i(
-    "svg",
-    {
-      width: "12",
-      height: "12",
-      viewBox: "0 0 12 12",
-      fill: "none",
-      xmlns: "http://www.w3.org/2000/svg",
-      "aria-hidden": !0,
-      className: "size-5",
-      ...e,
-      children: [
-        /* @__PURE__ */ t(
-          "rect",
-          {
-            x: "0.666667",
-            y: "0.666667",
-            width: "10.6667",
-            height: "10.6667",
-            rx: "5.33333",
-            stroke: "#B1B1B1",
-            strokeWidth: "1.33333"
-          }
-        ),
-        /* @__PURE__ */ t("circle", { cx: "6.00065", cy: "3.33268", r: "0.666667", fill: "#B1B1B1" }),
-        /* @__PURE__ */ t("rect", { x: "5.33398", y: "5.33398", width: "1.33333", height: "4", fill: "#B1B1B1" })
-      ]
-    }
-  );
-}
-export {
-  h as default
-};

package/dist/src/shared/ui/PopoverTooltip/PopoverTooltip.js

@@ -1,37 +0,0 @@
-import { jsxs as c, jsx as o } from "react/jsx-runtime";
-import { Popover as m, PopoverTrigger as p, PopoverContent as s } from "../../../../node_modules/@radix-ui/react-popover/dist/index.js";
-import a from "../Markdown/MDWithAccordion.js";
-import d from "./InfoIcon.js";
-import e from "./PopoverTooltip.module.scss.js";
-const v = ({
-  tooltipData: r,
-  openFirst: t = !1,
-  trigger: i
-}) => {
-  if (!r?.trim()) return null;
-  const n = (l) => {
-    l.stopPropagation();
-  };
-  return /* @__PURE__ */ c(m, { children: [
-    /* @__PURE__ */ o(p, { asChild: !0, children: i ?? /* @__PURE__ */ o(
-      "button",
-      {
-        className: e.iconBtn,
-        "aria-label": "Open tooltip",
-        onClick: n,
-        children: /* @__PURE__ */ o(d, { className: e.iconSvg })
-      }
-    ) }),
-    /* @__PURE__ */ o(
-      s,
-      {
-        className: "bg-[#000] text-white text-[1.1rem] leading-[1.45] w-auto max-w-[300px]",
-        side: "top",
-        children: /* @__PURE__ */ o(a, { openFirst: t, children: r })
-      }
-    )
-  ] });
-};
-export {
-  v as PopoverTooltip
-};

package/dist/src/shared/ui/PopoverTooltip/PopoverTooltip.module.scss.js

@@ -1,4 +0,0 @@
-const s = {};
-export {
-  s as default
-};

package/dist/src/shared/ui/Slider/Slider.js

@@ -1,117 +0,0 @@
-import { jsxs as a, jsx as r } from "react/jsx-runtime";
-import { useRef as k, useState as d, useCallback as x, useEffect as y } from "react";
-import { Label as L } from "../Label/Label.js";
-const R = ({
-  items: h,
-  activeId: f,
-  onSelect: u,
-  className: g = "",
-  stepRatio: m = 0.8
-}) => {
-  const n = k(null), [s, b] = d(!1), [i, p] = d(!1), o = x(() => {
-    const e = n.current;
-    if (!e) return;
-    const { scrollLeft: t, scrollWidth: l, clientWidth: v } = e, w = l - v;
-    b(t > 0), p(t < w - 1);
-  }, []);
-  y(() => {
-    const e = n.current;
-    if (!e) return;
-    o();
-    const t = new ResizeObserver(() => o());
-    t.observe(e);
-    const l = () => o();
-    return e.addEventListener("scroll", l, { passive: !0 }), () => {
-      t.disconnect(), e.removeEventListener("scroll", l);
-    };
-  }, [o]);
-  const c = (e) => {
-    const t = n.current;
-    if (!t) return;
-    const l = t.clientWidth * m * (e === "left" ? -1 : 1);
-    t.scrollBy({ left: l, behavior: "smooth" });
-  };
-  return /* @__PURE__ */ a(
-    "div",
-    {
-      className: `flex items-center gap-2 w-full ${g}`,
-      role: "region",
-      "aria-label": "Category slider",
-      children: [
-        /* @__PURE__ */ r(
-          "button",
-          {
-            type: "button",
-            "aria-label": "Scroll left",
-            disabled: !s,
-            onClick: () => c("left"),
-            className: `flex-shrink-0 h-8 w-8 rounded-full flex items-center justify-center shadow
-          ${s ? "bg-white hover:bg-gray-100" : "bg-gray-200 opacity-60 cursor-not-allowed"}`,
-            children: /* @__PURE__ */ r("svg", { width: "18", height: "18", viewBox: "0 0 24 24", "aria-hidden": "true", children: /* @__PURE__ */ r(
-              "path",
-              {
-                d: "M15 18l-6-6 6-6",
-                fill: "none",
-                stroke: "currentColor",
-                strokeWidth: "2",
-                strokeLinecap: "round"
-              }
-            ) })
-          }
-        ),
-        /* @__PURE__ */ r(
-          "div",
-          {
-            ref: n,
-            className: `\r
-        no-scrollbar flex-1 overflow-hidden scroll-smooth\r
-      `,
-            style: {
-              WebkitOverflowScrolling: "touch",
-              paddingLeft: "0.5rem",
-              paddingRight: "0.5rem"
-            },
-            children: /* @__PURE__ */ a("div", { className: "flex gap-3 sm:gap-4 py-2 min-w-min", children: [
-              h.map((e) => {
-                const t = e.productId, l = f === t;
-                return /* @__PURE__ */ r("div", { className: "shrink-0", children: /* @__PURE__ */ r(
-                  L,
-                  {
-                    text: e.name,
-                    isActive: l,
-                    onClick: () => u(e)
-                  }
-                ) }, t);
-              }),
-              /* @__PURE__ */ r("div", { "aria-hidden": !0, className: "shrink-0 w-1 sm:w-4" })
-            ] })
-          }
-        ),
-        /* @__PURE__ */ r(
-          "button",
-          {
-            type: "button",
-            "aria-label": "Scroll right",
-            disabled: !i,
-            onClick: () => c("right"),
-            className: `flex-shrink-0 h-8 w-8 rounded-full flex items-center justify-center shadow
-          ${i ? "bg-black text-white hover:brightness-110" : "bg-gray-200 text-gray-500 opacity-60 cursor-not-allowed"}`,
-            children: /* @__PURE__ */ r("svg", { width: "18", height: "18", viewBox: "0 0 24 24", "aria-hidden": "true", children: /* @__PURE__ */ r(
-              "path",
-              {
-                d: "M9 6l6 6-6 6",
-                fill: "none",
-                stroke: "currentColor",
-                strokeWidth: "2",
-                strokeLinecap: "round"
-              }
-            ) })
-          }
-        )
-      ]
-    }
-  );
-};
-export {
-  R as Slider
-};