npm - @purpur/library - Versions diffs - 9.8.0 → 9.9.0 - Mend

@purpur/library 9.8.0 → 9.9.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (1101) hide show

package/dist/comparison-table-D1evE0ri.mjs ADDED Viewed

@@ -0,0 +1,293 @@
+import { jsx as r, jsxs as d } from "react/jsx-runtime";
+import { isValidElement as W, useRef as A, useState as V, useEffect as M, useCallback as k, useId as G, createElement as J } from "react";
+import { c as D } from "./bind-CU-R61T-.mjs";
+import { a as Q } from "./checkmark.es-DdgIZN2R.mjs";
+import { e as U } from "./minus.es-BK9qA9iJ.mjs";
+import { l as F } from "./chevron-down.es-PCIIj6oG.mjs";
+import { P as q } from "./paragraph-CwAdFoIm.mjs";
+import { a as X } from "./badge-DalD-yqG.mjs";
+import { b as P } from "./button-4-yWOgtD.mjs";
+import { H as Y } from "./heading-xwBuT_-9.mjs";
+import { l as Z } from "./arrow-left.es-DU-PX-Il.mjs";
+import { i as rr } from "./arrow-right.es-C7SkjAB6.mjs";
+const er = {
+  "purpur-comparison-table__wrapper": "_purpur-comparison-table__wrapper_1udkj_1",
+  "purpur-comparison-table": "_purpur-comparison-table_1udkj_1",
+  "purpur-comparison-table--primary": "_purpur-comparison-table--primary_1udkj_11",
+  "purpur-comparison-table--secondary": "_purpur-comparison-table--secondary_1udkj_15",
+  "purpur-comparison-table__feature-row": "_purpur-comparison-table__feature-row_1udkj_32",
+  "purpur-comparison-table__cards": "_purpur-comparison-table__cards_1udkj_32",
+  "purpur-comparison-table__separator": "_purpur-comparison-table__separator_1udkj_49"
+}, or = {
+  "purpur-comparison-table-cell": "_purpur-comparison-table-cell_glb5z_1",
+  "purpur-comparison-table-cell--check": "_purpur-comparison-table-cell--check_glb5z_17",
+  "purpur-comparison-table-cell--minus": "_purpur-comparison-table-cell--minus_glb5z_20",
+  "purpur-comparison-table-cell__icon": "_purpur-comparison-table-cell__icon_glb5z_23"
+}, H = D.bind(or), L = "purpur-comparison-table-cell", ar = ({ value: a }) => {
+  const c = W(a) || ["string", "number"].includes(typeof a), t = H(L, [c ? "" : `${L}--${a ? "check" : "minus"}`]), y = a ? Q : U;
+  return /* @__PURE__ */ r("span", { className: H(t), children: c ? a : /* @__PURE__ */ r(y, { size: "xs", className: H(`${L}__icon`) }) });
+}, tr = {
+  "purpur-comparison-table-lead-cell": "_purpur-comparison-table-lead-cell_rqs9w_1",
+  "purpur-comparison-table-lead-cell__description": "_purpur-comparison-table-lead-cell__description_rqs9w_5",
+  "purpur-comparison-table-lead-cell__summary": "_purpur-comparison-table-lead-cell__summary_rqs9w_40",
+  "purpur-comparison-table-lead-cell__summary-title": "_purpur-comparison-table-lead-cell__summary-title_rqs9w_48",
+  "purpur-comparison-table-lead-cell__summary-icon": "_purpur-comparison-table-lead-cell__summary-icon_rqs9w_51"
+}, O = D.bind(tr), j = "purpur-comparison-table-lead-cell", sr = ({ title: a, description: c }) => {
+  const i = typeof c == "string", t = O(j);
+  return /* @__PURE__ */ d("details", { className: t, "data-is-expandable": i, children: [
+    /* @__PURE__ */ d("summary", { className: O(`${j}__summary`), tabIndex: i ? 0 : -1, children: [
+      /* @__PURE__ */ r(q, { className: O(`${j}__summary-title`), variant: "paragraph-100-bold", children: a }),
+      /* @__PURE__ */ r(F, { className: O(`${j}__summary-icon`), size: "sm" })
+    ] }),
+    c && /* @__PURE__ */ r(q, { variant: "paragraph-100", className: O(`${j}__description`), children: c })
+  ] });
+}, nr = {
+  "purpur-comparison-table-option-card": "_purpur-comparison-table-option-card_zggg8_1",
+  "purpur-comparison-table-option-card--highlighted": "_purpur-comparison-table-option-card--highlighted_zggg8_11",
+  "purpur-comparison-table-option-card__badge": "_purpur-comparison-table-option-card__badge_zggg8_14",
+  "purpur-comparison-table-option-card__main-content": "_purpur-comparison-table-option-card__main-content_zggg8_19",
+  "purpur-comparison-table-option-card__image": "_purpur-comparison-table-option-card__image_zggg8_25",
+  "purpur-comparison-table-option-card__body": "_purpur-comparison-table-option-card__body_zggg8_31",
+  "purpur-comparison-table-option-card__description": "_purpur-comparison-table-option-card__description_zggg8_36",
+  "purpur-comparison-table-option-card__description-text": "_purpur-comparison-table-option-card__description-text_zggg8_41",
+  "purpur-comparison-table-option-card__description-inner": "_purpur-comparison-table-option-card__description-inner_zggg8_50",
+  "purpur-comparison-table-option-card__read-more": "_purpur-comparison-table-option-card__read-more_zggg8_56",
+  "purpur-comparison-table-option-card__read-more--hidden": "_purpur-comparison-table-option-card__read-more--hidden_zggg8_60",
+  "purpur-comparison-table-option-card__read-more-icon": "_purpur-comparison-table-option-card__read-more-icon_zggg8_63",
+  "purpur-comparison-table-option-card__footer": "_purpur-comparison-table-option-card__footer_zggg8_71",
+  "purpur-comparison-table-option-card__price": "_purpur-comparison-table-option-card__price_zggg8_76",
+  "purpur-comparison-table-option-card--show-full-descriptions": "_purpur-comparison-table-option-card--show-full-descriptions_zggg8_83",
+  "purpur-comparison-table-option-card--first-card": "_purpur-comparison-table-option-card--first-card_zggg8_126"
+}, _ = D.bind(nr), n = "purpur-comparison-table-option-card", cr = ({
+  id: a,
+  cardIndex: c,
+  description: i,
+  variablePriceText: t,
+  price: y,
+  isHighlighted: g,
+  ariaLabels: f,
+  badge: h,
+  actions: N,
+  isFirstCard: C,
+  image: e,
+  title: p,
+  showFullDescriptions: u,
+  toggleShowFullDescriptions: m
+}) => {
+  const l = A(null), s = A(null), o = A(u), [b, x] = V(!1), z = _(n, {
+    [`${n}--highlighted`]: g,
+    [`${n}--first-card`]: C,
+    [`${n}--show-full-descriptions`]: u
+  });
+  M(() => {
+    o.current = u;
+  }, [u]);
+  const I = k(() => {
+    if (o.current)
+      return;
+    const S = l.current, E = s.current;
+    if (!S || !E) {
+      x(!1);
+      return;
+    }
+    const B = S.clientHeight, K = E.offsetHeight;
+    x(K > B + 1);
+  }, []);
+  M(() => {
+    const S = l.current;
+    if (I(), !S || typeof ResizeObserver > "u")
+      return;
+    const E = new ResizeObserver(I);
+    return E.observe(S), () => {
+      E.disconnect();
+    };
+  }, [I, i]);
+  const T = () => i ? /* @__PURE__ */ d("div", { className: _(`${n}__description`), children: [
+    typeof i == "string" ? /* @__PURE__ */ r(q, { ref: l, className: _(`${n}__description-text`), children: /* @__PURE__ */ r("span", { ref: s, children: i }) }) : /* @__PURE__ */ r("div", { ref: l, className: _(`${n}__description-text`), children: /* @__PURE__ */ r("div", { ref: s, className: _(`${n}__description-inner`), children: i }) }),
+    /* @__PURE__ */ d(
+      P,
+      {
+        variant: "text",
+        size: "xs",
+        className: _(`${n}__read-more`, {
+          [`${n}__read-more--hidden`]: !b
+        }),
+        onClick: m,
+        "aria-hidden": !b,
+        tabIndex: b ? void 0 : -1,
+        children: [
+          /* @__PURE__ */ r("span", { className: _(`${n}__read-more-text`), children: u ? f.readLess : f.readMore }),
+          /* @__PURE__ */ r(F, { className: _(`${n}__read-more-icon`), size: "xs" })
+        ]
+      }
+    )
+  ] }) : null;
+  return /* @__PURE__ */ d("article", { className: z, "data-card-id": a, "data-card-index": c, children: [
+    h && /* @__PURE__ */ r(X, { ...h, className: _(`${n}__badge`) }),
+    /* @__PURE__ */ d("section", { className: _(`${n}__main-content`), children: [
+      /* @__PURE__ */ r("img", { src: e.src, alt: e.alt, className: _(`${n}__image`) }),
+      /* @__PURE__ */ d("div", { className: _(`${n}__body`), children: [
+        /* @__PURE__ */ r(Y, { tag: "h3", variant: "title-200", className: _(`${n}__title`), children: p }),
+        T()
+      ] })
+    ] }),
+    /* @__PURE__ */ d("footer", { className: _(`${n}__footer`), children: [
+      /* @__PURE__ */ d("span", { className: _(`${n}__price`), id: a, children: [
+        /* @__PURE__ */ r(q, { variant: "paragraph-100", children: t }),
+        /* @__PURE__ */ r(q, { variant: "paragraph-100-bold", children: y })
+      ] }),
+      N
+    ] })
+  ] });
+}, ir = "_active_kvsnm_44", pr = {
+  "purpur-comparison-table-scroll-progress": "_purpur-comparison-table-scroll-progress_kvsnm_1",
+  "purpur-comparison-table-scroll-progress__indicators": "_purpur-comparison-table-scroll-progress__indicators_kvsnm_15",
+  "purpur-comparison-table-scroll-progress__indicator": "_purpur-comparison-table-scroll-progress__indicator_kvsnm_15",
+  active: ir,
+  "purpur-comparison-table-scroll-progress__buttons": "_purpur-comparison-table-scroll-progress__buttons_kvsnm_48",
+  "purpur-comparison-table-scroll-progress__button": "_purpur-comparison-table-scroll-progress__button_kvsnm_48",
+  "purpur-comparison-table-scroll-progress__button-icon": "_purpur-comparison-table-scroll-progress__button-icon_kvsnm_57"
+}, $ = D.bind(pr), v = "purpur-comparison-table-scroll-progress", lr = ({ items: a, container: c, ariaLabels: i }) => {
+  const [t, y] = V(/* @__PURE__ */ new Set()), g = k(
+    (e) => {
+      const p = window.matchMedia("(prefers-reduced-motion: reduce)").matches;
+      c.current?.querySelector(
+        `[data-card-index="${e}"]`
+      )?.scrollIntoView({ behavior: p ? "instant" : "smooth", block: "nearest" });
+    },
+    [c]
+  ), f = k(() => {
+    if (t.size === 0) return;
+    const p = Math.min(...Array.from(t)) - 1;
+    p < 0 || g(p);
+  }, [t, g]), h = k(() => {
+    if (t.size === 0) return;
+    const p = Math.max(...Array.from(t)) + 1;
+    p >= a.length || g(p);
+  }, [t, a.length, g]), N = k(
+    (e) => {
+      (e.key === "ArrowRight" || e.key === "ArrowLeft") && (e.preventDefault(), e.key === "ArrowRight" ? h() : e.key === "ArrowLeft" && f());
+    },
+    [h, f]
+  );
+  M(() => {
+    const e = c.current;
+    if (!e) return;
+    const p = new IntersectionObserver(
+      (u) => {
+        y((m) => {
+          const l = new Set(m);
+          return u.forEach((s) => {
+            const o = Number(s.target.getAttribute("data-card-index"));
+            Number.isNaN(o) || (s.isIntersecting ? l.add(o) : l.delete(o));
+          }), l;
+        });
+      },
+      { root: e, threshold: 0.5 }
+    );
+    return a.forEach((u, m) => {
+      const l = e.querySelector(`[data-card-index="${m}"]`);
+      l && p.observe(l);
+    }), () => p.disconnect();
+  }, [c, a]), M(() => {
+    const e = c.current;
+    if (e)
+      return e.addEventListener("keydown", N), () => e.removeEventListener("keydown", N);
+  }, [c, N]);
+  const C = () => {
+    if (t.size === 0) return;
+    const e = [], p = t.size, u = Math.min(...Array.from(t)), m = a.slice(0, u).length, l = a.slice(u + p).length;
+    let s = 0;
+    for (let o = 0; o < a.length; o++) {
+      if (m + 1 !== o && m <= o && o < a.length - l) continue;
+      let b = "active";
+      (o < m || o > a.length - 1 - l) && (b = ""), e.push(
+        /* @__PURE__ */ r("li", { className: $(`${v}__indicator`, b) }, `indicator-${s++}`)
+      );
+    }
+    return e.length < 2 ? null : e;
+  };
+  return /* @__PURE__ */ d("li", { className: $(v), children: [
+    /* @__PURE__ */ r("ul", { className: $(`${v}__indicators`), children: C() }),
+    /* @__PURE__ */ d("div", { className: $(`${v}__buttons`), children: [
+      /* @__PURE__ */ r(
+        P,
+        {
+          "aria-label": i.previous,
+          variant: "secondary",
+          iconOnly: !0,
+          className: $(`${v}__button`),
+          disabled: t.has(0),
+          onClick: f,
+          children: /* @__PURE__ */ r(Z, { className: $(`${v}__button-icon`), size: "xs" })
+        }
+      ),
+      /* @__PURE__ */ r(
+        P,
+        {
+          "aria-label": i.next,
+          variant: "secondary",
+          iconOnly: !0,
+          className: $(`${v}__button`),
+          disabled: t.has(a.length - 1),
+          onClick: h,
+          children: /* @__PURE__ */ r(rr, { className: $(`${v}__button-icon`), size: "xs" })
+        }
+      )
+    ] })
+  ] });
+}, R = D.bind(er), w = "purpur-comparison-table", _r = ({
+  classname: a,
+  features: c,
+  items: i,
+  ariaLabels: t,
+  variant: y = "primary"
+}) => {
+  const g = G(), f = R(a, w, `${w}--${y}`), h = A(null), [N, C] = V(!1), e = k(() => {
+    C((s) => !s);
+  }, []), p = () => /* @__PURE__ */ d("li", { className: R(`${w}__cards`), children: [
+    /* @__PURE__ */ r("div", { className: R(`${w}__separator`) }),
+    i.map((s, o) => /* @__PURE__ */ J(
+      cr,
+      {
+        ...s,
+        showFullDescriptions: N,
+        toggleShowFullDescriptions: e,
+        key: o,
+        isFirstCard: o === 0,
+        ariaLabels: t,
+        cardIndex: o,
+        id: `${o}-${g}`
+      }
+    ))
+  ] }), u = () => Object.entries(c).map(([s, o], b) => /* @__PURE__ */ d("li", { className: R(`${w}__feature-row`), children: [
+    /* @__PURE__ */ r(sr, { title: s, description: o }),
+    i.map((x, z) => /* @__PURE__ */ r(ar, { value: x.features[s] ?? !1 }, z))
+  ] }, b)), m = A(0), l = (s) => {
+    const o = s.currentTarget, b = o.querySelector("[data-card-id]")?.clientWidth ?? 0, x = Math.round(o.scrollLeft / b), z = x * b + x, I = s.timeStamp - m.current, T = Math.abs(o.scrollLeft - z);
+    m.current && I < 200 || T < 10 || (m.current = s.timeStamp, o.scrollTo({ left: z, behavior: "smooth" }));
+  };
+  return /* @__PURE__ */ r("div", { className: R(w + "__wrapper"), children: /* @__PURE__ */ d(
+    "ul",
+    {
+      id: w + `-${g}`,
+      ref: h,
+      className: f,
+      onScrollEnd: l,
+      style: {
+        // @ts-expect-error | Typescript doesn't recognize the CSS variable, but it works as intended
+        "--initial-columns": i.length + 1
+      },
+      children: [
+        /* @__PURE__ */ r(lr, { items: i, container: h, ariaLabels: t }),
+        p(),
+        u()
+      ]
+    }
+  ) });
+};
+_r.displayName = "ComparisonTable";
+export {
+  _r as C
+};
+//# sourceMappingURL=comparison-table-D1evE0ri.mjs.map

package/dist/comparison-table-D1evE0ri.mjs.map ADDED Viewed

@@ -0,0 +1 @@

+ {"version":3,"file":"comparison-table-D1evE0ri.mjs","sources":["../../../components/comparison-table/src/components/Cell/cell.tsx","../../../components/comparison-table/src/components/LeadCell/lead-cell.tsx","../../../components/comparison-table/src/components/OptionCard/option-card.tsx","../../../components/comparison-table/src/components/ScrollProgress/scroll-progress.tsx","../../../components/comparison-table/src/comparison-table.tsx"],"sourcesContent":["import React, { isValidElement, type ReactNode } from \"react\";\nimport { IconCheckmark } from \"@purpur/icon/checkmark\";\nimport { IconMinus } from \"@purpur/icon/minus\";\nimport c from \"classnames/bind\";\n\nimport styles from \"./cell.module.scss\";\n\ntype CellProps = {\n value: boolean | ReactNode;\n};\n\nconst cx = c.bind(styles);\n\nconst rootClassName = \"purpur-comparison-table-cell\";\n\nexport const Cell = ({ value }: CellProps) => {\n const isReactNode = isValidElement(value) || [\"string\", \"number\"].includes(typeof value);\n\n const getClassName = () => {\n if (isReactNode) return \"\";\n return `${rootClassName}--${value ? \"check\" : \"minus\"}`;\n };\n\n const classes = cx(rootClassName, [getClassName()]);\n\n const Icon = value ? IconCheckmark : IconMinus;\n\n return (\n <span className={cx(classes)}>\n {isReactNode ? value : <Icon size=\"xs\" className={cx(`${rootClassName}__icon`)} />}\n </span>\n );\n};\n","import React, { type ReactNode } from \"react\";\nimport { IconChevronDown } from \"@purpur/icon/chevron-down\";\nimport { Paragraph } from \"@purpur/paragraph\";\nimport c from \"classnames/bind\";\n\nimport styles from \"./lead-cell.module.scss\";\n\ntype LeadCellProps = {\n title: string;\n description?: ReactNode;\n};\n\nconst cx = c.bind(styles);\n\nconst rootClassName = \"purpur-comparison-table-lead-cell\";\n\nexport const LeadCell = ({ title, description }: LeadCellProps) => {\n const isExpandable = typeof description === \"string\";\n const classes = cx(rootClassName);\n\n return (\n <details className={classes} data-is-expandable={isExpandable}>\n <summary className={cx(`${rootClassName}__summary`)} tabIndex={isExpandable ? 0 : -1}>\n <Paragraph className={cx(`${rootClassName}__summary-title`)} variant=\"paragraph-100-bold\">\n {title}\n </Paragraph>\n <IconChevronDown className={cx(`${rootClassName}__summary-icon`)} size=\"sm\" />\n </summary>\n {description && (\n <Paragraph variant=\"paragraph-100\" className={cx(`${rootClassName}__description`)}>\n {description}\n </Paragraph>\n )}\n </details>\n );\n};\n","import React, { type ReactNode, useCallback, useEffect, useRef, useState } from \"react\";\nimport { Badge, type BadgeProps } from \"@purpur/badge\";\nimport { Button } from \"@purpur/button\";\nimport { Heading } from \"@purpur/heading\";\nimport { IconChevronDown } from \"@purpur/icon/chevron-down\";\nimport { Paragraph } from \"@purpur/paragraph\";\nimport c from \"classnames/bind\";\n\nimport { type ComparisonTableProps } from \"../../comparison-table\";\nimport styles from \"./option-card.module.scss\";\n\nconst cx = c.bind(styles);\n\nconst rootClassName = \"purpur-comparison-table-option-card\";\n\nexport type OptionCardProps = {\n image: {\n src: string;\n alt: string;\n };\n\n title: string;\n description: ReactNode;\n variablePriceText: string;\n price: string;\n\n actions: ReactNode;\n\n badge?: BadgeProps;\n isHighlighted?: boolean;\n};\n\ntype OptionCardPropsAdditions = {\n id: string;\n cardIndex: number;\n isFirstCard: boolean;\n ariaLabels: ComparisonTableProps[\"ariaLabels\"];\n\n showFullDescriptions: boolean;\n toggleShowFullDescriptions: () => void;\n};\n\nexport const OptionCard = ({\n id,\n cardIndex,\n description,\n variablePriceText,\n price,\n isHighlighted,\n ariaLabels,\n badge,\n actions,\n isFirstCard,\n image,\n title,\n showFullDescriptions,\n toggleShowFullDescriptions,\n}: OptionCardProps & OptionCardPropsAdditions) => {\n const descriptionRef = useRef<HTMLDivElement | HTMLParagraphElement>(null);\n const descriptionContentRef = useRef<HTMLDivElement | null>(null);\n const showFullDescriptionsRef = useRef(showFullDescriptions);\n const [descriptionOverflows, setDescriptionOverflows] = useState(false);\n\n const classes = cx(rootClassName, {\n [`${rootClassName}--highlighted`]: isHighlighted,\n [`${rootClassName}--first-card`]: isFirstCard,\n [`${rootClassName}--show-full-descriptions`]: showFullDescriptions,\n });\n\n useEffect(() => {\n showFullDescriptionsRef.current = showFullDescriptions;\n }, [showFullDescriptions]);\n\n const checkDescriptionOverflow = useCallback(() => {\n if (showFullDescriptionsRef.current) {\n return;\n }\n\n const description = descriptionRef.current;\n const descriptionContent = descriptionContentRef.current;\n\n if (!description || !descriptionContent) {\n setDescriptionOverflows(false);\n return;\n }\n\n const descriptionHeight = description.clientHeight;\n const contentHeight = descriptionContent.offsetHeight;\n\n setDescriptionOverflows(contentHeight > descriptionHeight + 1);\n }, []);\n\n useEffect(() => {\n const descriptionElement = descriptionRef.current;\n\n checkDescriptionOverflow();\n\n if (!descriptionElement || typeof ResizeObserver === \"undefined\") {\n return undefined;\n }\n\n const resizeObserver = new ResizeObserver(checkDescriptionOverflow);\n resizeObserver.observe(descriptionElement);\n\n return () => {\n resizeObserver.disconnect();\n };\n }, [checkDescriptionOverflow, description]);\n\n const renderDescription = () => {\n if (!description) return null;\n\n return (\n <div className={cx(`${rootClassName}__description`)}>\n {typeof description === \"string\" ? (\n <Paragraph ref={descriptionRef} className={cx(`${rootClassName}__description-text`)}>\n <span ref={descriptionContentRef}>{description}</span>\n </Paragraph>\n ) : (\n <div ref={descriptionRef} className={cx(`${rootClassName}__description-text`)}>\n <div ref={descriptionContentRef} className={cx(`${rootClassName}__description-inner`)}>\n {description}\n </div>\n </div>\n )}\n <Button\n variant=\"text\"\n size=\"xs\"\n className={cx(`${rootClassName}__read-more`, {\n [`${rootClassName}__read-more--hidden`]: !descriptionOverflows,\n })}\n onClick={toggleShowFullDescriptions}\n aria-hidden={!descriptionOverflows}\n tabIndex={descriptionOverflows ? undefined : -1}\n >\n <span className={cx(`${rootClassName}__read-more-text`)}>\n {showFullDescriptions ? ariaLabels.readLess : ariaLabels.readMore}\n </span>\n <IconChevronDown className={cx(`${rootClassName}__read-more-icon`)} size=\"xs\" />\n </Button>\n </div>\n );\n };\n\n return (\n <article className={classes} data-card-id={id} data-card-index={cardIndex}>\n {badge && <Badge {...badge} className={cx(`${rootClassName}__badge`)} />}\n\n <section className={cx(`${rootClassName}__main-content`)}>\n <img src={image.src} alt={image.alt} className={cx(`${rootClassName}__image`)} />\n\n <div className={cx(`${rootClassName}__body`)}>\n <Heading tag=\"h3\" variant=\"title-200\" className={cx(`${rootClassName}__title`)}>\n {title}\n </Heading>\n {renderDescription()}\n </div>\n </section>\n\n <footer className={cx(`${rootClassName}__footer`)}>\n <span className={cx(`${rootClassName}__price`)} id={id}>\n <Paragraph variant=\"paragraph-100\">{variablePriceText}</Paragraph>\n <Paragraph variant=\"paragraph-100-bold\">{price}</Paragraph>\n </span>\n\n {actions}\n </footer>\n </article>\n );\n};\n","import React, { type RefObject, useCallback, useEffect, useState } from \"react\";\nimport { Button } from \"@purpur/button\";\nimport { IconArrowLeft } from \"@purpur/icon/arrow-left\";\nimport { IconArrowRight } from \"@purpur/icon/arrow-right\";\nimport c from \"classnames/bind\";\n\nimport { type ComparisonTableProps, type Features, type Item } from \"../../comparison-table\";\nimport styles from \"./scroll-progress.module.scss\";\n\nconst cx = c.bind(styles);\nconst rootClassName = \"purpur-comparison-table-scroll-progress\";\n\ntype ScrollProgressProps = {\n items: Array<Item<Features>>;\n container: RefObject<HTMLUListElement | null>;\n ariaLabels: ComparisonTableProps[\"ariaLabels\"];\n};\n\nexport const ScrollProgress = ({ items, container, ariaLabels }: ScrollProgressProps) => {\n const [inViewSet, setInViewSet] = useState<Set<number>>(new Set());\n\n const scrollToCard = useCallback(\n (index: number) => {\n const reduceMotion = window.matchMedia(\"(prefers-reduced-motion: reduce)\").matches;\n\n const card = container.current?.querySelector(\n `[data-card-index=\"${index}\"]`\n ) as HTMLElement | null;\n card?.scrollIntoView({ behavior: reduceMotion ? \"instant\" : \"smooth\", block: \"nearest\" });\n },\n [container]\n );\n\n const previousCard = useCallback(() => {\n if (inViewSet.size === 0) return;\n\n const leftmostactiveIndex = Math.min(...Array.from(inViewSet));\n const targetIndex = leftmostactiveIndex - 1;\n\n if (targetIndex < 0) return;\n\n scrollToCard(targetIndex);\n }, [inViewSet, scrollToCard]);\n\n const nextCard = useCallback(() => {\n if (inViewSet.size === 0) return;\n\n const rightmostactiveIndex = Math.max(...Array.from(inViewSet));\n const targetIndex = rightmostactiveIndex + 1;\n\n if (targetIndex >= items.length) return;\n\n scrollToCard(targetIndex);\n }, [inViewSet, items.length, scrollToCard]);\n\n const handleKeyDown = useCallback(\n (e: KeyboardEvent) => {\n if (e.key === \"ArrowRight\" || e.key === \"ArrowLeft\") {\n e.preventDefault();\n\n if (e.key === \"ArrowRight\") nextCard();\n else if (e.key === \"ArrowLeft\") previousCard();\n }\n },\n [nextCard, previousCard]\n );\n\n useEffect(() => {\n const root = container.current;\n\n if (!root) return;\n\n const observer = new IntersectionObserver(\n (entries) => {\n setInViewSet((prev) => {\n const next = new Set(prev);\n\n entries.forEach((entry) => {\n const index = Number(entry.target.getAttribute(\"data-card-index\"));\n\n if (Number.isNaN(index)) return;\n\n if (entry.isIntersecting) {\n next.add(index);\n } else {\n next.delete(index);\n }\n });\n return next;\n });\n },\n { root, threshold: 0.5 }\n );\n\n items.forEach((_, index) => {\n const card = root.querySelector(`[data-card-index=\"${index}\"]`) as HTMLElement | null;\n\n if (card) observer.observe(card);\n });\n\n return () => observer.disconnect();\n }, [container, items]);\n\n useEffect(() => {\n const root = container.current;\n\n if (!root) return;\n\n root.addEventListener(\"keydown\", handleKeyDown);\n\n return () => root.removeEventListener(\"keydown\", handleKeyDown);\n }, [container, handleKeyDown]);\n\n const renderIndicators = () => {\n if (inViewSet.size === 0) return;\n\n const indicators = [];\n const viewCapacity = inViewSet.size;\n const leftmostActiveIndex = Math.min(...Array.from(inViewSet));\n const head = items.slice(0, leftmostActiveIndex).length;\n const trail = items.slice(leftmostActiveIndex + viewCapacity).length;\n\n let key = 0;\n\n for (let i = 0; i < items.length; i++) {\n if (head + 1 !== i && head <= i && i < items.length - trail) continue;\n\n let status = \"active\";\n\n if (i < head || i > items.length - 1 - trail) status = \"\";\n\n indicators.push(\n <li key={`indicator-${key++}`} className={cx(`${rootClassName}__indicator`, status)} />\n );\n }\n\n if (indicators.length < 2) return null;\n\n return indicators;\n };\n\n return (\n <li className={cx(rootClassName)}>\n <ul className={cx(`${rootClassName}__indicators`)}>{renderIndicators()}</ul>\n\n <div className={cx(`${rootClassName}__buttons`)}>\n <Button\n aria-label={ariaLabels.previous}\n variant=\"secondary\"\n iconOnly\n className={cx(`${rootClassName}__button`)}\n disabled={inViewSet.has(0)}\n onClick={previousCard}\n >\n <IconArrowLeft className={cx(`${rootClassName}__button-icon`)} size=\"xs\" />\n </Button>\n <Button\n aria-label={ariaLabels.next}\n variant=\"secondary\"\n iconOnly\n className={cx(`${rootClassName}__button`)}\n disabled={inViewSet.has(items.length - 1)}\n onClick={nextCard}\n >\n <IconArrowRight className={cx(`${rootClassName}__button-icon`)} size=\"xs\" />\n </Button>\n </div>\n </li>\n );\n};\n","import React, { type ReactNode, type UIEvent, useCallback, useId, useRef, useState } from \"react\";\nimport c from \"classnames/bind\";\n\nimport styles from \"./comparison-table.module.scss\";\nimport { Cell } from \"./components/Cell/cell\";\nimport { LeadCell } from \"./components/LeadCell/lead-cell\";\nimport { OptionCard, type OptionCardProps } from \"./components/OptionCard/option-card\";\nimport { ScrollProgress } from \"./components/ScrollProgress/scroll-progress\";\n\nconst cx = c.bind(styles);\n\nconst rootClassName = \"purpur-comparison-table\";\n\nexport type Features = Record<string, ReactNode | null>;\n\nexport type Item<TFeatures extends Features = Features> = OptionCardProps & {\n features: Partial<Record<keyof TFeatures, ReactNode | string | boolean>>;\n};\n\nexport type ComparisonTableProps<TFeatures extends Features = Features> = {\n /** List of features that can be supported by the comparison table\n *\n * string = description of the feature that can be viewed by expanding cell.\n *\n * null = no description\n *\n {\n [featureName]: ReactNode | null\n }\n */\n features: TFeatures;\n\n /** List of items to be displayed in the comparison table\n *\n *\n Item = {\n image: {\n src: string;\n alt: string;\n };\n\n title: string;\n description: string;\n variablePriceText: string;\n price: string;\n actions: ReactNode;\n badge?: BadgeProps;\n isHighlighted?: boolean;\n\n features: {\n [featureName in keyof Features]?: string | boolean;\n };\n }\n */\n items: Array<Item<TFeatures>>;\n\n /** Aria labels for the comparison table and various components\n *\n {\n previous: string;\n next: string;\n readMore: string;\n readLess: string;\n }\n */\n ariaLabels: {\n previous: string;\n next: string;\n readMore: string;\n readLess: string;\n };\n variant?: \"primary\" | \"secondary\";\n classname?: string;\n};\n\nexport const ComparisonTable = <TFeatures extends Features>({\n classname,\n features,\n items,\n ariaLabels,\n variant = \"primary\",\n}: ComparisonTableProps<TFeatures>) => {\n const id = useId();\n const classes = cx(classname, rootClassName, `${rootClassName}--${variant}`);\n const containerRef = useRef<HTMLUListElement>(null);\n const [showFullDescriptions, setShowFullDescriptions] = useState(false);\n\n const handleToggleShowFullDescriptions = useCallback(() => {\n setShowFullDescriptions((prev) => !prev);\n }, []);\n\n const renderCards = () => {\n return (\n <li className={cx(`${rootClassName}__cards`)}>\n <div className={cx(`${rootClassName}__separator`)} />\n {items.map((item, index) => (\n <OptionCard\n {...item}\n showFullDescriptions={showFullDescriptions}\n toggleShowFullDescriptions={handleToggleShowFullDescriptions}\n key={index}\n isFirstCard={index === 0}\n ariaLabels={ariaLabels}\n cardIndex={index}\n id={`${index}-${id}`}\n />\n ))}\n </li>\n );\n };\n\n const renderFeatures = () => {\n return Object.entries(features).map(([title, description], i) => (\n <li key={i} className={cx(`${rootClassName}__feature-row`)}>\n <LeadCell title={title} description={description} />\n {items.map((item, index) => (\n <Cell key={index} value={item.features[title as keyof TFeatures] ?? false} />\n ))}\n </li>\n ));\n };\n\n const deltaTime = useRef(0);\n\n const handleScrollEnd = (e: UIEvent<HTMLUListElement>) => {\n /**\n * This function makes sure that the scroll position is never stuck between two cards, since scroll snap is not fully reliable.\n */\n\n const target = e.currentTarget;\n const cardwidth = target.querySelector(\"[data-card-id]\")?.clientWidth ?? 0;\n const cardPos = Math.round(target.scrollLeft / cardwidth);\n const scrollTarget = cardPos * cardwidth + cardPos;\n const timeDiff = e.timeStamp - deltaTime.current;\n const scrollDiff = Math.abs(target.scrollLeft - scrollTarget);\n\n if (deltaTime.current && timeDiff < 200) return;\n if (scrollDiff < 10) return;\n\n deltaTime.current = e.timeStamp;\n\n target.scrollTo({ left: scrollTarget, behavior: \"smooth\" });\n };\n\n return (\n <div className={cx(rootClassName + \"__wrapper\")}>\n <ul\n id={rootClassName + `-${id}`}\n ref={containerRef}\n className={classes}\n // eslint-disable-next-line react/no-unknown-property\n onScrollEnd={handleScrollEnd}\n style={{\n // @ts-expect-error | Typescript doesn't recognize the CSS variable, but it works as intended\n [\"--initial-columns\"]: items.length + 1,\n }}\n >\n <ScrollProgress items={items} container={containerRef} ariaLabels={ariaLabels} />\n {renderCards()}\n {renderFeatures()}\n </ul>\n </div>\n );\n};\n\nComparisonTable.displayName = \"ComparisonTable\";\n"],"names":["cx","c","styles","rootClassName","Cell","value","isReactNode","isValidElement","classes","Icon","IconCheckmark","IconMinus","jsx","LeadCell","title","description","isExpandable","jsxs","Paragraph","IconChevronDown","OptionCard","id","cardIndex","variablePriceText","price","isHighlighted","ariaLabels","badge","actions","isFirstCard","image","showFullDescriptions","toggleShowFullDescriptions","descriptionRef","useRef","descriptionContentRef","showFullDescriptionsRef","descriptionOverflows","setDescriptionOverflows","useState","useEffect","checkDescriptionOverflow","useCallback","descriptionContent","descriptionHeight","contentHeight","descriptionElement","resizeObserver","renderDescription","Button","Badge","Heading","ScrollProgress","items","container","inViewSet","setInViewSet","scrollToCard","index","reduceMotion","previousCard","targetIndex","nextCard","handleKeyDown","root","observer","entries","prev","next","entry","_","card","renderIndicators","indicators","viewCapacity","leftmostActiveIndex","head","trail","key","i","status","IconArrowLeft","IconArrowRight","ComparisonTable","classname","features","variant","useId","containerRef","setShowFullDescriptions","handleToggleShowFullDescriptions","renderCards","item","createElement","renderFeatures","deltaTime","handleScrollEnd","e","target","cardwidth","cardPos","scrollTarget","timeDiff","scrollDiff"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;GAWMA,IAAKC,EAAE,KAAKC,EAAM,GAElBC,IAAgB,gCAETC,KAAO,CAAC,EAAE,OAAAC,QAAuB;AAC5C,QAAMC,IAAcC,EAAeF,CAAK,KAAK,CAAC,UAAU,QAAQ,EAAE,SAAS,OAAOA,CAAK,GAOjFG,IAAUR,EAAGG,GAAe,CAJ5BG,IAAoB,KACjB,GAAGH,CAAa,KAAKE,IAAQ,UAAU,OAAO,EAGN,CAAC,GAE5CI,IAAOJ,IAAQK,IAAgBC;AAErC,2BACG,QAAA,EAAK,WAAWX,EAAGQ,CAAO,GACxB,cAAcH,IAAQ,gBAAAO,EAACH,GAAA,EAAK,MAAK,MAAK,WAAWT,EAAG,GAAGG,CAAa,QAAQ,GAAG,GAClF;AAEJ;;;;;;GCpBMH,IAAKC,EAAE,KAAKC,EAAM,GAElBC,IAAgB,qCAETU,KAAW,CAAC,EAAE,OAAAC,GAAO,aAAAC,QAAiC;AACjE,QAAMC,IAAe,OAAOD,KAAgB,UACtCP,IAAUR,EAAGG,CAAa;AAEhC,SACE,gBAAAc,EAAC,WAAA,EAAQ,WAAWT,GAAS,sBAAoBQ,GAC/C,UAAA;AAAA,IAAA,gBAAAC,EAAC,WAAA,EAAQ,WAAWjB,EAAG,GAAGG,CAAa,WAAW,GAAG,UAAUa,IAAe,IAAI,IAChF,UAAA;AAAA,MAAA,gBAAAJ,EAACM,GAAA,EAAU,WAAWlB,EAAG,GAAGG,CAAa,iBAAiB,GAAG,SAAQ,sBAClE,UAAAW,EAAA,CACH;AAAA,MACA,gBAAAF,EAACO,KAAgB,WAAWnB,EAAG,GAAGG,CAAa,gBAAgB,GAAG,MAAK,KAAA,CAAK;AAAA,IAAA,GAC9E;AAAA,IACCY,KACC,gBAAAH,EAACM,GAAA,EAAU,SAAQ,iBAAgB,WAAWlB,EAAG,GAAGG,CAAa,eAAe,GAC7E,UAAAY,EAAA,CACH;AAAA,EAAA,GAEJ;AAEJ;;;;;;;;;;;;;;;;;GCxBMf,IAAKC,EAAE,KAAKC,EAAM,GAElBC,IAAgB,uCA6BTiB,KAAa,CAAC;AAAA,EACzB,IAAAC;AAAA,EACA,WAAAC;AAAA,EACA,aAAAP;AAAA,EACA,mBAAAQ;AAAA,EACA,OAAAC;AAAA,EACA,eAAAC;AAAA,EACA,YAAAC;AAAA,EACA,OAAAC;AAAA,EACA,SAAAC;AAAA,EACA,aAAAC;AAAA,EACA,OAAAC;AAAA,EACA,OAAAhB;AAAA,EACA,sBAAAiB;AAAA,EACA,4BAAAC;AACF,MAAkD;AAChD,QAAMC,IAAiBC,EAA8C,IAAI,GACnEC,IAAwBD,EAA8B,IAAI,GAC1DE,IAA0BF,EAAOH,CAAoB,GACrD,CAACM,GAAsBC,CAAuB,IAAIC,EAAS,EAAK,GAEhE/B,IAAUR,EAAGG,GAAe;AAAA,IAChC,CAAC,GAAGA,CAAa,eAAe,GAAGsB;AAAA,IACnC,CAAC,GAAGtB,CAAa,cAAc,GAAG0B;AAAA,IAClC,CAAC,GAAG1B,CAAa,0BAA0B,GAAG4B;AAAA,EAAA,CAC/C;AAED,EAAAS,EAAU,MAAM;AACd,IAAAJ,EAAwB,UAAUL;AAAA,EACpC,GAAG,CAACA,CAAoB,CAAC;AAEzB,QAAMU,IAA2BC,EAAY,MAAM;AACjD,QAAIN,EAAwB;AAC1B;AAGF,UAAMrB,IAAckB,EAAe,SAC7BU,IAAqBR,EAAsB;AAEjD,QAAI,CAACpB,KAAe,CAAC4B,GAAoB;AACvC,MAAAL,EAAwB,EAAK;AAC7B;AAAA,IACF;AAEA,UAAMM,IAAoB7B,EAAY,cAChC8B,IAAgBF,EAAmB;AAEzC,IAAAL,EAAwBO,IAAgBD,IAAoB,CAAC;AAAA,EAC/D,GAAG,CAAA,CAAE;AAEL,EAAAJ,EAAU,MAAM;AACd,UAAMM,IAAqBb,EAAe;AAI1C,QAFAQ,EAAA,GAEI,CAACK,KAAsB,OAAO,iBAAmB;AACnD;AAGF,UAAMC,IAAiB,IAAI,eAAeN,CAAwB;AAClE,WAAAM,EAAe,QAAQD,CAAkB,GAElC,MAAM;AACX,MAAAC,EAAe,WAAA;AAAA,IACjB;AAAA,EACF,GAAG,CAACN,GAA0B1B,CAAW,CAAC;AAE1C,QAAMiC,IAAoB,MACnBjC,sBAGF,OAAA,EAAI,WAAWf,EAAG,GAAGG,CAAa,eAAe,GAC/C,UAAA;AAAA,IAAA,OAAOY,KAAgB,WACtB,gBAAAH,EAACM,KAAU,KAAKe,GAAgB,WAAWjC,EAAG,GAAGG,CAAa,oBAAoB,GAChF,UAAA,gBAAAS,EAAC,QAAA,EAAK,KAAKuB,GAAwB,UAAApB,GAAY,GACjD,IAEA,gBAAAH,EAAC,OAAA,EAAI,KAAKqB,GAAgB,WAAWjC,EAAG,GAAGG,CAAa,oBAAoB,GAC1E,UAAA,gBAAAS,EAAC,OAAA,EAAI,KAAKuB,GAAuB,WAAWnC,EAAG,GAAGG,CAAa,qBAAqB,GACjF,aACH,EAAA,CACF;AAAA,IAEF,gBAAAc;AAAA,MAACgC;AAAA,MAAA;AAAA,QACC,SAAQ;AAAA,QACR,MAAK;AAAA,QACL,WAAWjD,EAAG,GAAGG,CAAa,eAAe;AAAA,UAC3C,CAAC,GAAGA,CAAa,qBAAqB,GAAG,CAACkC;AAAA,QAAA,CAC3C;AAAA,QACD,SAASL;AAAA,QACT,eAAa,CAACK;AAAA,QACd,UAAUA,IAAuB,SAAY;AAAA,QAE7C,UAAA;AAAA,UAAA,gBAAAzB,EAAC,QAAA,EAAK,WAAWZ,EAAG,GAAGG,CAAa,kBAAkB,GACnD,UAAA4B,IAAuBL,EAAW,WAAWA,EAAW,UAC3D;AAAA,UACA,gBAAAd,EAACO,KAAgB,WAAWnB,EAAG,GAAGG,CAAa,kBAAkB,GAAG,MAAK,KAAA,CAAK;AAAA,QAAA;AAAA,MAAA;AAAA,IAAA;AAAA,EAChF,GACF,IA9BuB;AAkC3B,2BACG,WAAA,EAAQ,WAAWK,GAAS,gBAAca,GAAI,mBAAiBC,GAC7D,UAAA;AAAA,IAAAK,KAAS,gBAAAf,EAACsC,KAAO,GAAGvB,GAAO,WAAW3B,EAAG,GAAGG,CAAa,SAAS,EAAA,CAAG;AAAA,sBAErE,WAAA,EAAQ,WAAWH,EAAG,GAAGG,CAAa,gBAAgB,GACrD,UAAA;AAAA,MAAA,gBAAAS,EAAC,OAAA,EAAI,KAAKkB,EAAM,KAAK,KAAKA,EAAM,KAAK,WAAW9B,EAAG,GAAGG,CAAa,SAAS,GAAG;AAAA,wBAE9E,OAAA,EAAI,WAAWH,EAAG,GAAGG,CAAa,QAAQ,GACzC,UAAA;AAAA,QAAA,gBAAAS,EAACuC,GAAA,EAAQ,KAAI,MAAK,SAAQ,aAAY,WAAWnD,EAAG,GAAGG,CAAa,SAAS,GAC1E,UAAAW,GACH;AAAA,QACCkC,EAAA;AAAA,MAAkB,EAAA,CACrB;AAAA,IAAA,GACF;AAAA,sBAEC,UAAA,EAAO,WAAWhD,EAAG,GAAGG,CAAa,UAAU,GAC9C,UAAA;AAAA,MAAA,gBAAAc,EAAC,UAAK,WAAWjB,EAAG,GAAGG,CAAa,SAAS,GAAG,IAAAkB,GAC9C,UAAA;AAAA,QAAA,gBAAAT,EAACM,GAAA,EAAU,SAAQ,iBAAiB,UAAAK,GAAkB;AAAA,QACtD,gBAAAX,EAACM,GAAA,EAAU,SAAQ,sBAAsB,UAAAM,EAAA,CAAM;AAAA,MAAA,GACjD;AAAA,MAECI;AAAA,IAAA,EAAA,CACH;AAAA,EAAA,GACF;AAEJ;;;;;;;;GChKM5B,IAAKC,EAAE,KAAKC,EAAM,GAClBC,IAAgB,2CAQTiD,KAAiB,CAAC,EAAE,OAAAC,GAAO,WAAAC,GAAW,YAAA5B,QAAsC;AACvF,QAAM,CAAC6B,GAAWC,CAAY,IAAIjB,EAAsB,oBAAI,KAAK,GAE3DkB,IAAef;AAAA,IACnB,CAACgB,MAAkB;AACjB,YAAMC,IAAe,OAAO,WAAW,kCAAkC,EAAE;AAK3E,MAHaL,EAAU,SAAS;AAAA,QAC9B,qBAAqBI,CAAK;AAAA,MAAA,GAEtB,eAAe,EAAE,UAAUC,IAAe,YAAY,UAAU,OAAO,WAAW;AAAA,IAC1F;AAAA,IACA,CAACL,CAAS;AAAA,EAAA,GAGNM,IAAelB,EAAY,MAAM;AACrC,QAAIa,EAAU,SAAS,EAAG;AAG1B,UAAMM,IADsB,KAAK,IAAI,GAAG,MAAM,KAAKN,CAAS,CAAC,IACnB;AAE1C,IAAIM,IAAc,KAElBJ,EAAaI,CAAW;AAAA,EAC1B,GAAG,CAACN,GAAWE,CAAY,CAAC,GAEtBK,IAAWpB,EAAY,MAAM;AACjC,QAAIa,EAAU,SAAS,EAAG;AAG1B,UAAMM,IADuB,KAAK,IAAI,GAAG,MAAM,KAAKN,CAAS,CAAC,IACnB;AAE3C,IAAIM,KAAeR,EAAM,UAEzBI,EAAaI,CAAW;AAAA,EAC1B,GAAG,CAACN,GAAWF,EAAM,QAAQI,CAAY,CAAC,GAEpCM,IAAgBrB;AAAA,IACpB,CAAC,MAAqB;AACpB,OAAI,EAAE,QAAQ,gBAAgB,EAAE,QAAQ,iBACtC,EAAE,eAAA,GAEE,EAAE,QAAQ,eAAcoB,EAAA,IACnB,EAAE,QAAQ,eAAaF,EAAA;AAAA,IAEpC;AAAA,IACA,CAACE,GAAUF,CAAY;AAAA,EAAA;AAGzB,EAAApB,EAAU,MAAM;AACd,UAAMwB,IAAOV,EAAU;AAEvB,QAAI,CAACU,EAAM;AAEX,UAAMC,IAAW,IAAI;AAAA,MACnB,CAACC,MAAY;AACX,QAAAV,EAAa,CAACW,MAAS;AACrB,gBAAMC,IAAO,IAAI,IAAID,CAAI;AAEzB,iBAAAD,EAAQ,QAAQ,CAACG,MAAU;AACzB,kBAAMX,IAAQ,OAAOW,EAAM,OAAO,aAAa,iBAAiB,CAAC;AAEjE,YAAI,OAAO,MAAMX,CAAK,MAElBW,EAAM,iBACRD,EAAK,IAAIV,CAAK,IAEdU,EAAK,OAAOV,CAAK;AAAA,UAErB,CAAC,GACMU;AAAA,QACT,CAAC;AAAA,MACH;AAAA,MACA,EAAE,MAAAJ,GAAM,WAAW,IAAA;AAAA,IAAI;AAGzB,WAAAX,EAAM,QAAQ,CAACiB,GAAGZ,MAAU;AAC1B,YAAMa,IAAOP,EAAK,cAAc,qBAAqBN,CAAK,IAAI;AAE9D,MAAIa,KAAMN,EAAS,QAAQM,CAAI;AAAA,IACjC,CAAC,GAEM,MAAMN,EAAS,WAAA;AAAA,EACxB,GAAG,CAACX,GAAWD,CAAK,CAAC,GAErBb,EAAU,MAAM;AACd,UAAMwB,IAAOV,EAAU;AAEvB,QAAKU;AAEL,aAAAA,EAAK,iBAAiB,WAAWD,CAAa,GAEvC,MAAMC,EAAK,oBAAoB,WAAWD,CAAa;AAAA,EAChE,GAAG,CAACT,GAAWS,CAAa,CAAC;AAE7B,QAAMS,IAAmB,MAAM;AAC7B,QAAIjB,EAAU,SAAS,EAAG;AAE1B,UAAMkB,IAAa,CAAA,GACbC,IAAenB,EAAU,MACzBoB,IAAsB,KAAK,IAAI,GAAG,MAAM,KAAKpB,CAAS,CAAC,GACvDqB,IAAOvB,EAAM,MAAM,GAAGsB,CAAmB,EAAE,QAC3CE,IAAQxB,EAAM,MAAMsB,IAAsBD,CAAY,EAAE;AAE9D,QAAII,IAAM;AAEV,aAASC,IAAI,GAAGA,IAAI1B,EAAM,QAAQ0B,KAAK;AACrC,UAAIH,IAAO,MAAMG,KAAKH,KAAQG,KAAKA,IAAI1B,EAAM,SAASwB,EAAO;AAE7D,UAAIG,IAAS;AAEb,OAAID,IAAIH,KAAQG,IAAI1B,EAAM,SAAS,IAAIwB,OAAOG,IAAS,KAEvDP,EAAW;AAAA,QACT,gBAAA7D,EAAC,MAAA,EAA8B,WAAWZ,EAAG,GAAGG,CAAa,eAAe6E,CAAM,EAAA,GAAzE,aAAaF,GAAK,EAA0D;AAAA,MAAA;AAAA,IAEzF;AAEA,WAAIL,EAAW,SAAS,IAAU,OAE3BA;AAAA,EACT;AAEA,SACE,gBAAAxD,EAAC,MAAA,EAAG,WAAWjB,EAAGG,CAAa,GAC7B,UAAA;AAAA,IAAA,gBAAAS,EAAC,MAAA,EAAG,WAAWZ,EAAG,GAAGG,CAAa,cAAc,GAAI,cAAiB,CAAE;AAAA,sBAEtE,OAAA,EAAI,WAAWH,EAAG,GAAGG,CAAa,WAAW,GAC5C,UAAA;AAAA,MAAA,gBAAAS;AAAA,QAACqC;AAAA,QAAA;AAAA,UACC,cAAYvB,EAAW;AAAA,UACvB,SAAQ;AAAA,UACR,UAAQ;AAAA,UACR,WAAW1B,EAAG,GAAGG,CAAa,UAAU;AAAA,UACxC,UAAUoD,EAAU,IAAI,CAAC;AAAA,UACzB,SAASK;AAAA,UAET,UAAA,gBAAAhD,EAACqE,KAAc,WAAWjF,EAAG,GAAGG,CAAa,eAAe,GAAG,MAAK,KAAA,CAAK;AAAA,QAAA;AAAA,MAAA;AAAA,MAE3E,gBAAAS;AAAA,QAACqC;AAAA,QAAA;AAAA,UACC,cAAYvB,EAAW;AAAA,UACvB,SAAQ;AAAA,UACR,UAAQ;AAAA,UACR,WAAW1B,EAAG,GAAGG,CAAa,UAAU;AAAA,UACxC,UAAUoD,EAAU,IAAIF,EAAM,SAAS,CAAC;AAAA,UACxC,SAASS;AAAA,UAET,UAAA,gBAAAlD,EAACsE,MAAe,WAAWlF,EAAG,GAAGG,CAAa,eAAe,GAAG,MAAK,KAAA,CAAK;AAAA,QAAA;AAAA,MAAA;AAAA,IAC5E,EAAA,CACF;AAAA,EAAA,GACF;AAEJ,GChKMH,IAAKC,EAAE,KAAKC,EAAM,GAElBC,IAAgB,2BAgETgF,KAAkB,CAA6B;AAAA,EAC1D,WAAAC;AAAA,EACA,UAAAC;AAAA,EACA,OAAAhC;AAAA,EACA,YAAA3B;AAAA,EACA,SAAA4D,IAAU;AACZ,MAAuC;AACrC,QAAMjE,IAAKkE,EAAA,GACL/E,IAAUR,EAAGoF,GAAWjF,GAAe,GAAGA,CAAa,KAAKmF,CAAO,EAAE,GACrEE,IAAetD,EAAyB,IAAI,GAC5C,CAACH,GAAsB0D,CAAuB,IAAIlD,EAAS,EAAK,GAEhEmD,IAAmChD,EAAY,MAAM;AACzD,IAAA+C,EAAwB,CAACtB,MAAS,CAACA,CAAI;AAAA,EACzC,GAAG,CAAA,CAAE,GAECwB,IAAc,wBAEf,MAAA,EAAG,WAAW3F,EAAG,GAAGG,CAAa,SAAS,GACzC,UAAA;AAAA,IAAA,gBAAAS,EAAC,SAAI,WAAWZ,EAAG,GAAGG,CAAa,aAAa,GAAG;AAAA,IAClDkD,EAAM,IAAI,CAACuC,GAAMlC,MAChB,gBAAAmC;AAAA,MAACzE;AAAA,MAAA;AAAA,QACE,GAAGwE;AAAA,QACJ,sBAAA7D;AAAA,QACA,4BAA4B2D;AAAA,QAC5B,KAAKhC;AAAA,QACL,aAAaA,MAAU;AAAA,QACvB,YAAAhC;AAAA,QACA,WAAWgC;AAAA,QACX,IAAI,GAAGA,CAAK,IAAIrC,CAAE;AAAA,MAAA;AAAA,IAAA,CAErB;AAAA,EAAA,GACH,GAIEyE,IAAiB,MACd,OAAO,QAAQT,CAAQ,EAAE,IAAI,CAAC,CAACvE,GAAOC,CAAW,GAAGgE,wBACxD,MAAA,EAAW,WAAW/E,EAAG,GAAGG,CAAa,eAAe,GACvD,UAAA;AAAA,IAAA,gBAAAS,EAACC,IAAA,EAAS,OAAAC,GAAc,aAAAC,EAAA,CAA0B;AAAA,IACjDsC,EAAM,IAAI,CAACuC,GAAMlC,MAChB,gBAAA9C,EAACR,IAAA,EAAiB,OAAOwF,EAAK,SAAS9E,CAAwB,KAAK,GAAA,GAAzD4C,CAAgE,CAC5E;AAAA,EAAA,EAAA,GAJMqB,CAKT,CACD,GAGGgB,IAAY7D,EAAO,CAAC,GAEpB8D,IAAkB,CAACC,MAAiC;AAKxD,UAAMC,IAASD,EAAE,eACXE,IAAYD,EAAO,cAAc,gBAAgB,GAAG,eAAe,GACnEE,IAAU,KAAK,MAAMF,EAAO,aAAaC,CAAS,GAClDE,IAAeD,IAAUD,IAAYC,GACrCE,IAAWL,EAAE,YAAYF,EAAU,SACnCQ,IAAa,KAAK,IAAIL,EAAO,aAAaG,CAAY;AAE5D,IAAIN,EAAU,WAAWO,IAAW,OAChCC,IAAa,OAEjBR,EAAU,UAAUE,EAAE,WAEtBC,EAAO,SAAS,EAAE,MAAMG,GAAc,UAAU,UAAU;AAAA,EAC5D;AAEA,2BACG,OAAA,EAAI,WAAWrG,EAAGG,IAAgB,WAAW,GAC5C,UAAA,gBAAAc;AAAA,IAAC;AAAA,IAAA;AAAA,MACC,IAAId,IAAgB,IAAIkB,CAAE;AAAA,MAC1B,KAAKmE;AAAA,MACL,WAAWhF;AAAA,MAEX,aAAawF;AAAA,MACb,OAAO;AAAA;AAAA,QAEJ,qBAAsB3C,EAAM,SAAS;AAAA,MAAA;AAAA,MAGxC,UAAA;AAAA,QAAA,gBAAAzC,EAACwC,IAAA,EAAe,OAAAC,GAAc,WAAWmC,GAAc,YAAA9D,GAAwB;AAAA,QAC9EiE,EAAA;AAAA,QACAG,EAAA;AAAA,MAAe;AAAA,IAAA;AAAA,EAAA,GAEpB;AAEJ;AAEAX,GAAgB,cAAc;"}

package/dist/comparison-table-Dtqxz8vL.js ADDED Viewed

	@@ -0,0 +1,2 @@
1	+ "use strict";const r=require("react/jsx-runtime"),a=require("react"),O=require("./bind-DeUYJ6m9.js"),V=require("./checkmark.es-lYntWFA3.js"),F=require("./minus.es-DtXArdKK.js"),P=require("./chevron-down.es-BMjgiS3F.js"),E=require("./paragraph-B8HFdNne.js"),K=require("./badge-CQ0SS_t8.js"),M=require("./button-DmybVApa.js"),W=require("./heading-drD5ugCC.js"),G=require("./arrow-left.es-CCWJyrcQ.js"),J=require("./arrow-right.es-eH-IgGi9.js"),Q={"purpur-comparison-table__wrapper":"_purpur-comparison-table__wrapper_1udkj_1","purpur-comparison-table":"_purpur-comparison-table_1udkj_1","purpur-comparison-table--primary":"_purpur-comparison-table--primary_1udkj_11","purpur-comparison-table--secondary":"_purpur-comparison-table--secondary_1udkj_15","purpur-comparison-table__feature-row":"_purpur-comparison-table__feature-row_1udkj_32","purpur-comparison-table__cards":"_purpur-comparison-table__cards_1udkj_32","purpur-comparison-table__separator":"_purpur-comparison-table__separator_1udkj_49"},U={"purpur-comparison-table-cell":"_purpur-comparison-table-cell_glb5z_1","purpur-comparison-table-cell--check":"_purpur-comparison-table-cell--check_glb5z_17","purpur-comparison-table-cell--minus":"_purpur-comparison-table-cell--minus_glb5z_20","purpur-comparison-table-cell__icon":"_purpur-comparison-table-cell__icon_glb5z_23"},D=O.c.bind(U),T="purpur-comparison-table-cell",X=({value:o})=>{const i=a.isValidElement(o)\|\|["string","number"].includes(typeof o),t=D(T,[i?"":`${T}--${o?"check":"minus"}`]),j=o?V.a:F.e;return r.jsx("span",{className:D(t),children:i?o:r.jsx(j,{size:"xs",className:D(`${T}__icon`)})})},Y={"purpur-comparison-table-lead-cell":"_purpur-comparison-table-lead-cell_rqs9w_1","purpur-comparison-table-lead-cell__description":"_purpur-comparison-table-lead-cell__description_rqs9w_5","purpur-comparison-table-lead-cell__summary":"_purpur-comparison-table-lead-cell__summary_rqs9w_40","purpur-comparison-table-lead-cell__summary-title":"_purpur-comparison-table-lead-cell__summary-title_rqs9w_48","purpur-comparison-table-lead-cell__summary-icon":"_purpur-comparison-table-lead-cell__summary-icon_rqs9w_51"},S=O.c.bind(Y),I="purpur-comparison-table-lead-cell",Z=({title:o,description:i})=>{const l=typeof i=="string",t=S(I);return r.jsxs("details",{className:t,"data-is-expandable":l,children:[r.jsxs("summary",{className:S(`${I}__summary`),tabIndex:l?0:-1,children:[r.jsx(E.Paragraph,{className:S(`${I}__summary-title`),variant:"paragraph-100-bold",children:o}),r.jsx(P.l,{className:S(`${I}__summary-icon`),size:"sm"})]}),i&&r.jsx(E.Paragraph,{variant:"paragraph-100",className:S(`${I}__description`),children:i})]})},rr={"purpur-comparison-table-option-card":"_purpur-comparison-table-option-card_zggg8_1","purpur-comparison-table-option-card--highlighted":"_purpur-comparison-table-option-card--highlighted_zggg8_11","purpur-comparison-table-option-card__badge":"_purpur-comparison-table-option-card__badge_zggg8_14","purpur-comparison-table-option-card__main-content":"_purpur-comparison-table-option-card__main-content_zggg8_19","purpur-comparison-table-option-card__image":"_purpur-comparison-table-option-card__image_zggg8_25","purpur-comparison-table-option-card__body":"_purpur-comparison-table-option-card__body_zggg8_31","purpur-comparison-table-option-card__description":"_purpur-comparison-table-option-card__description_zggg8_36","purpur-comparison-table-option-card__description-text":"_purpur-comparison-table-option-card__description-text_zggg8_41","purpur-comparison-table-option-card__description-inner":"_purpur-comparison-table-option-card__description-inner_zggg8_50","purpur-comparison-table-option-card__read-more":"_purpur-comparison-table-option-card__read-more_zggg8_56","purpur-comparison-table-option-card__read-more--hidden":"_purpur-comparison-table-option-card__read-more--hidden_zggg8_60","purpur-comparison-table-option-card__read-more-icon":"_purpur-comparison-table-option-card__read-more-icon_zggg8_63","purpur-comparison-table-option-card__footer":"_purpur-comparison-table-option-card__footer_zggg8_71","purpur-comparison-table-option-card__price":"_purpur-comparison-table-option-card__price_zggg8_76","purpur-comparison-table-option-card--show-full-descriptions":"_purpur-comparison-table-option-card--show-full-descriptions_zggg8_83","purpur-comparison-table-option-card--first-card":"_purpur-comparison-table-option-card--first-card_zggg8_126"},_=O.c.bind(rr),c="purpur-comparison-table-option-card",er=({id:o,cardIndex:i,description:l,variablePriceText:t,price:j,isHighlighted:g,ariaLabels:f,badge:h,actions:v,isFirstCard:k,image:e,title:p,showFullDescriptions:d,toggleShowFullDescriptions:m})=>{const u=a.useRef(null),n=a.useRef(null),s=a.useRef(d),[b,y]=a.useState(!1),w=_(c,{[`${c}--highlighted`]:g,[`${c}--first-card`]:k,[`${c}--show-full-descriptions`]:d});a.useEffect(()=>{s.current=d},[d]);const z=a.useCallback(()=>{if(s.current)return;const C=u.current,q=n.current;if(!C\|\|!q){y(!1);return}const H=C.clientHeight,B=q.offsetHeight;y(B>H+1)},[]);a.useEffect(()=>{const C=u.current;if(z(),!C\|\|typeof ResizeObserver>"u")return;const q=new ResizeObserver(z);return q.observe(C),()=>{q.disconnect()}},[z,l]);const A=()=>l?r.jsxs("div",{className:_(`${c}__description`),children:[typeof l=="string"?r.jsx(E.Paragraph,{ref:u,className:_(`${c}__description-text`),children:r.jsx("span",{ref:n,children:l})}):r.jsx("div",{ref:u,className:_(`${c}__description-text`),children:r.jsx("div",{ref:n,className:_(`${c}__description-inner`),children:l})}),r.jsxs(M.Button,{variant:"text",size:"xs",className:_(`${c}__read-more`,{[`${c}__read-more--hidden`]:!b}),onClick:m,"aria-hidden":!b,tabIndex:b?void 0:-1,children:[r.jsx("span",{className:_(`${c}__read-more-text`),children:d?f.readLess:f.readMore}),r.jsx(P.l,{className:_(`${c}__read-more-icon`),size:"xs"})]})]}):null;return r.jsxs("article",{className:w,"data-card-id":o,"data-card-index":i,children:[h&&r.jsx(K.Badge,{...h,className:_(`${c}__badge`)}),r.jsxs("section",{className:_(`${c}__main-content`),children:[r.jsx("img",{src:e.src,alt:e.alt,className:_(`${c}__image`)}),r.jsxs("div",{className:_(`${c}__body`),children:[r.jsx(W.Heading,{tag:"h3",variant:"title-200",className:_(`${c}__title`),children:p}),A()]})]}),r.jsxs("footer",{className:_(`${c}__footer`),children:[r.jsxs("span",{className:_(`${c}__price`),id:o,children:[r.jsx(E.Paragraph,{variant:"paragraph-100",children:t}),r.jsx(E.Paragraph,{variant:"paragraph-100-bold",children:j})]}),v]})]})},sr="_active_kvsnm_44",or={"purpur-comparison-table-scroll-progress":"_purpur-comparison-table-scroll-progress_kvsnm_1","purpur-comparison-table-scroll-progress__indicators":"_purpur-comparison-table-scroll-progress__indicators_kvsnm_15","purpur-comparison-table-scroll-progress__indicator":"_purpur-comparison-table-scroll-progress__indicator_kvsnm_15",active:sr,"purpur-comparison-table-scroll-progress__buttons":"_purpur-comparison-table-scroll-progress__buttons_kvsnm_48","purpur-comparison-table-scroll-progress__button":"_purpur-comparison-table-scroll-progress__button_kvsnm_48","purpur-comparison-table-scroll-progress__button-icon":"_purpur-comparison-table-scroll-progress__button-icon_kvsnm_57"},x=O.c.bind(or),$="purpur-comparison-table-scroll-progress",ar=({items:o,container:i,ariaLabels:l})=>{const[t,j]=a.useState(new Set),g=a.useCallback(e=>{const p=window.matchMedia("(prefers-reduced-motion: reduce)").matches;i.current?.querySelector(`[data-card-index="${e}"]`)?.scrollIntoView({behavior:p?"instant":"smooth",block:"nearest"})},[i]),f=a.useCallback(()=>{if(t.size===0)return;const p=Math.min(...Array.from(t))-1;p<0\|\|g(p)},[t,g]),h=a.useCallback(()=>{if(t.size===0)return;const p=Math.max(...Array.from(t))+1;p>=o.length\|\|g(p)},[t,o.length,g]),v=a.useCallback(e=>{(e.key==="ArrowRight"\|\|e.key==="ArrowLeft")&&(e.preventDefault(),e.key==="ArrowRight"?h():e.key==="ArrowLeft"&&f())},[h,f]);a.useEffect(()=>{const e=i.current;if(!e)return;const p=new IntersectionObserver(d=>{j(m=>{const u=new Set(m);return d.forEach(n=>{const s=Number(n.target.getAttribute("data-card-index"));Number.isNaN(s)\|\|(n.isIntersecting?u.add(s):u.delete(s))}),u})},{root:e,threshold:.5});return o.forEach((d,m)=>{const u=e.querySelector(`[data-card-index="${m}"]`);u&&p.observe(u)}),()=>p.disconnect()},[i,o]),a.useEffect(()=>{const e=i.current;if(e)return e.addEventListener("keydown",v),()=>e.removeEventListener("keydown",v)},[i,v]);const k=()=>{if(t.size===0)return;const e=[],p=t.size,d=Math.min(...Array.from(t)),m=o.slice(0,d).length,u=o.slice(d+p).length;let n=0;for(let s=0;s<o.length;s++){if(m+1!==s&&m<=s&&s<o.length-u)continue;let b="active";(s<m\|\|s>o.length-1-u)&&(b=""),e.push(r.jsx("li",{className:x(`${$}__indicator`,b)},`indicator-${n++}`))}return e.length<2?null:e};return r.jsxs("li",{className:x($),children:[r.jsx("ul",{className:x(`${$}__indicators`),children:k()}),r.jsxs("div",{className:x(`${$}__buttons`),children:[r.jsx(M.Button,{"aria-label":l.previous,variant:"secondary",iconOnly:!0,className:x(`${$}__button`),disabled:t.has(0),onClick:f,children:r.jsx(G.l,{className:x(`${$}__button-icon`),size:"xs"})}),r.jsx(M.Button,{"aria-label":l.next,variant:"secondary",iconOnly:!0,className:x(`${$}__button`),disabled:t.has(o.length-1),onClick:h,children:r.jsx(J.i,{className:x(`${$}__button-icon`),size:"xs"})})]})]})},R=O.c.bind(Q),N="purpur-comparison-table",L=({classname:o,features:i,items:l,ariaLabels:t,variant:j="primary"})=>{const g=a.useId(),f=R(o,N,`${N}--${j}`),h=a.useRef(null),[v,k]=a.useState(!1),e=a.useCallback(()=>{k(n=>!n)},[]),p=()=>r.jsxs("li",{className:R(`${N}__cards`),children:[r.jsx("div",{className:R(`${N}__separator`)}),l.map((n,s)=>a.createElement(er,{...n,showFullDescriptions:v,toggleShowFullDescriptions:e,key:s,isFirstCard:s===0,ariaLabels:t,cardIndex:s,id:`${s}-${g}`}))]}),d=()=>Object.entries(i).map(([n,s],b)=>r.jsxs("li",{className:R(`${N}__feature-row`),children:[r.jsx(Z,{title:n,description:s}),l.map((y,w)=>r.jsx(X,{value:y.features[n]??!1},w))]},b)),m=a.useRef(0),u=n=>{const s=n.currentTarget,b=s.querySelector("[data-card-id]")?.clientWidth??0,y=Math.round(s.scrollLeft/b),w=y*b+y,z=n.timeStamp-m.current,A=Math.abs(s.scrollLeft-w);m.current&&z<200\|\|A<10\|\|(m.current=n.timeStamp,s.scrollTo({left:w,behavior:"smooth"}))};return r.jsx("div",{className:R(N+"__wrapper"),children:r.jsxs("ul",{id:N+`-${g}`,ref:h,className:f,onScrollEnd:u,style:{"--initial-columns":l.length+1},children:[r.jsx(ar,{items:l,container:h,ariaLabels:t}),p(),d()]})})};L.displayName="ComparisonTable";exports.ComparisonTable=L;
2	+ //# sourceMappingURL=comparison-table-Dtqxz8vL.js.map

package/dist/comparison-table-Dtqxz8vL.js.map ADDED Viewed

@@ -0,0 +1 @@

+ {"version":3,"file":"comparison-table-Dtqxz8vL.js","sources":["../../../components/comparison-table/src/components/Cell/cell.tsx","../../../components/comparison-table/src/components/LeadCell/lead-cell.tsx","../../../components/comparison-table/src/components/OptionCard/option-card.tsx","../../../components/comparison-table/src/components/ScrollProgress/scroll-progress.tsx","../../../components/comparison-table/src/comparison-table.tsx"],"sourcesContent":["import React, { isValidElement, type ReactNode } from \"react\";\nimport { IconCheckmark } from \"@purpur/icon/checkmark\";\nimport { IconMinus } from \"@purpur/icon/minus\";\nimport c from \"classnames/bind\";\n\nimport styles from \"./cell.module.scss\";\n\ntype CellProps = {\n value: boolean | ReactNode;\n};\n\nconst cx = c.bind(styles);\n\nconst rootClassName = \"purpur-comparison-table-cell\";\n\nexport const Cell = ({ value }: CellProps) => {\n const isReactNode = isValidElement(value) || [\"string\", \"number\"].includes(typeof value);\n\n const getClassName = () => {\n if (isReactNode) return \"\";\n return `${rootClassName}--${value ? \"check\" : \"minus\"}`;\n };\n\n const classes = cx(rootClassName, [getClassName()]);\n\n const Icon = value ? IconCheckmark : IconMinus;\n\n return (\n <span className={cx(classes)}>\n {isReactNode ? value : <Icon size=\"xs\" className={cx(`${rootClassName}__icon`)} />}\n </span>\n );\n};\n","import React, { type ReactNode } from \"react\";\nimport { IconChevronDown } from \"@purpur/icon/chevron-down\";\nimport { Paragraph } from \"@purpur/paragraph\";\nimport c from \"classnames/bind\";\n\nimport styles from \"./lead-cell.module.scss\";\n\ntype LeadCellProps = {\n title: string;\n description?: ReactNode;\n};\n\nconst cx = c.bind(styles);\n\nconst rootClassName = \"purpur-comparison-table-lead-cell\";\n\nexport const LeadCell = ({ title, description }: LeadCellProps) => {\n const isExpandable = typeof description === \"string\";\n const classes = cx(rootClassName);\n\n return (\n <details className={classes} data-is-expandable={isExpandable}>\n <summary className={cx(`${rootClassName}__summary`)} tabIndex={isExpandable ? 0 : -1}>\n <Paragraph className={cx(`${rootClassName}__summary-title`)} variant=\"paragraph-100-bold\">\n {title}\n </Paragraph>\n <IconChevronDown className={cx(`${rootClassName}__summary-icon`)} size=\"sm\" />\n </summary>\n {description && (\n <Paragraph variant=\"paragraph-100\" className={cx(`${rootClassName}__description`)}>\n {description}\n </Paragraph>\n )}\n </details>\n );\n};\n","import React, { type ReactNode, useCallback, useEffect, useRef, useState } from \"react\";\nimport { Badge, type BadgeProps } from \"@purpur/badge\";\nimport { Button } from \"@purpur/button\";\nimport { Heading } from \"@purpur/heading\";\nimport { IconChevronDown } from \"@purpur/icon/chevron-down\";\nimport { Paragraph } from \"@purpur/paragraph\";\nimport c from \"classnames/bind\";\n\nimport { type ComparisonTableProps } from \"../../comparison-table\";\nimport styles from \"./option-card.module.scss\";\n\nconst cx = c.bind(styles);\n\nconst rootClassName = \"purpur-comparison-table-option-card\";\n\nexport type OptionCardProps = {\n image: {\n src: string;\n alt: string;\n };\n\n title: string;\n description: ReactNode;\n variablePriceText: string;\n price: string;\n\n actions: ReactNode;\n\n badge?: BadgeProps;\n isHighlighted?: boolean;\n};\n\ntype OptionCardPropsAdditions = {\n id: string;\n cardIndex: number;\n isFirstCard: boolean;\n ariaLabels: ComparisonTableProps[\"ariaLabels\"];\n\n showFullDescriptions: boolean;\n toggleShowFullDescriptions: () => void;\n};\n\nexport const OptionCard = ({\n id,\n cardIndex,\n description,\n variablePriceText,\n price,\n isHighlighted,\n ariaLabels,\n badge,\n actions,\n isFirstCard,\n image,\n title,\n showFullDescriptions,\n toggleShowFullDescriptions,\n}: OptionCardProps & OptionCardPropsAdditions) => {\n const descriptionRef = useRef<HTMLDivElement | HTMLParagraphElement>(null);\n const descriptionContentRef = useRef<HTMLDivElement | null>(null);\n const showFullDescriptionsRef = useRef(showFullDescriptions);\n const [descriptionOverflows, setDescriptionOverflows] = useState(false);\n\n const classes = cx(rootClassName, {\n [`${rootClassName}--highlighted`]: isHighlighted,\n [`${rootClassName}--first-card`]: isFirstCard,\n [`${rootClassName}--show-full-descriptions`]: showFullDescriptions,\n });\n\n useEffect(() => {\n showFullDescriptionsRef.current = showFullDescriptions;\n }, [showFullDescriptions]);\n\n const checkDescriptionOverflow = useCallback(() => {\n if (showFullDescriptionsRef.current) {\n return;\n }\n\n const description = descriptionRef.current;\n const descriptionContent = descriptionContentRef.current;\n\n if (!description || !descriptionContent) {\n setDescriptionOverflows(false);\n return;\n }\n\n const descriptionHeight = description.clientHeight;\n const contentHeight = descriptionContent.offsetHeight;\n\n setDescriptionOverflows(contentHeight > descriptionHeight + 1);\n }, []);\n\n useEffect(() => {\n const descriptionElement = descriptionRef.current;\n\n checkDescriptionOverflow();\n\n if (!descriptionElement || typeof ResizeObserver === \"undefined\") {\n return undefined;\n }\n\n const resizeObserver = new ResizeObserver(checkDescriptionOverflow);\n resizeObserver.observe(descriptionElement);\n\n return () => {\n resizeObserver.disconnect();\n };\n }, [checkDescriptionOverflow, description]);\n\n const renderDescription = () => {\n if (!description) return null;\n\n return (\n <div className={cx(`${rootClassName}__description`)}>\n {typeof description === \"string\" ? (\n <Paragraph ref={descriptionRef} className={cx(`${rootClassName}__description-text`)}>\n <span ref={descriptionContentRef}>{description}</span>\n </Paragraph>\n ) : (\n <div ref={descriptionRef} className={cx(`${rootClassName}__description-text`)}>\n <div ref={descriptionContentRef} className={cx(`${rootClassName}__description-inner`)}>\n {description}\n </div>\n </div>\n )}\n <Button\n variant=\"text\"\n size=\"xs\"\n className={cx(`${rootClassName}__read-more`, {\n [`${rootClassName}__read-more--hidden`]: !descriptionOverflows,\n })}\n onClick={toggleShowFullDescriptions}\n aria-hidden={!descriptionOverflows}\n tabIndex={descriptionOverflows ? undefined : -1}\n >\n <span className={cx(`${rootClassName}__read-more-text`)}>\n {showFullDescriptions ? ariaLabels.readLess : ariaLabels.readMore}\n </span>\n <IconChevronDown className={cx(`${rootClassName}__read-more-icon`)} size=\"xs\" />\n </Button>\n </div>\n );\n };\n\n return (\n <article className={classes} data-card-id={id} data-card-index={cardIndex}>\n {badge && <Badge {...badge} className={cx(`${rootClassName}__badge`)} />}\n\n <section className={cx(`${rootClassName}__main-content`)}>\n <img src={image.src} alt={image.alt} className={cx(`${rootClassName}__image`)} />\n\n <div className={cx(`${rootClassName}__body`)}>\n <Heading tag=\"h3\" variant=\"title-200\" className={cx(`${rootClassName}__title`)}>\n {title}\n </Heading>\n {renderDescription()}\n </div>\n </section>\n\n <footer className={cx(`${rootClassName}__footer`)}>\n <span className={cx(`${rootClassName}__price`)} id={id}>\n <Paragraph variant=\"paragraph-100\">{variablePriceText}</Paragraph>\n <Paragraph variant=\"paragraph-100-bold\">{price}</Paragraph>\n </span>\n\n {actions}\n </footer>\n </article>\n );\n};\n","import React, { type RefObject, useCallback, useEffect, useState } from \"react\";\nimport { Button } from \"@purpur/button\";\nimport { IconArrowLeft } from \"@purpur/icon/arrow-left\";\nimport { IconArrowRight } from \"@purpur/icon/arrow-right\";\nimport c from \"classnames/bind\";\n\nimport { type ComparisonTableProps, type Features, type Item } from \"../../comparison-table\";\nimport styles from \"./scroll-progress.module.scss\";\n\nconst cx = c.bind(styles);\nconst rootClassName = \"purpur-comparison-table-scroll-progress\";\n\ntype ScrollProgressProps = {\n items: Array<Item<Features>>;\n container: RefObject<HTMLUListElement | null>;\n ariaLabels: ComparisonTableProps[\"ariaLabels\"];\n};\n\nexport const ScrollProgress = ({ items, container, ariaLabels }: ScrollProgressProps) => {\n const [inViewSet, setInViewSet] = useState<Set<number>>(new Set());\n\n const scrollToCard = useCallback(\n (index: number) => {\n const reduceMotion = window.matchMedia(\"(prefers-reduced-motion: reduce)\").matches;\n\n const card = container.current?.querySelector(\n `[data-card-index=\"${index}\"]`\n ) as HTMLElement | null;\n card?.scrollIntoView({ behavior: reduceMotion ? \"instant\" : \"smooth\", block: \"nearest\" });\n },\n [container]\n );\n\n const previousCard = useCallback(() => {\n if (inViewSet.size === 0) return;\n\n const leftmostactiveIndex = Math.min(...Array.from(inViewSet));\n const targetIndex = leftmostactiveIndex - 1;\n\n if (targetIndex < 0) return;\n\n scrollToCard(targetIndex);\n }, [inViewSet, scrollToCard]);\n\n const nextCard = useCallback(() => {\n if (inViewSet.size === 0) return;\n\n const rightmostactiveIndex = Math.max(...Array.from(inViewSet));\n const targetIndex = rightmostactiveIndex + 1;\n\n if (targetIndex >= items.length) return;\n\n scrollToCard(targetIndex);\n }, [inViewSet, items.length, scrollToCard]);\n\n const handleKeyDown = useCallback(\n (e: KeyboardEvent) => {\n if (e.key === \"ArrowRight\" || e.key === \"ArrowLeft\") {\n e.preventDefault();\n\n if (e.key === \"ArrowRight\") nextCard();\n else if (e.key === \"ArrowLeft\") previousCard();\n }\n },\n [nextCard, previousCard]\n );\n\n useEffect(() => {\n const root = container.current;\n\n if (!root) return;\n\n const observer = new IntersectionObserver(\n (entries) => {\n setInViewSet((prev) => {\n const next = new Set(prev);\n\n entries.forEach((entry) => {\n const index = Number(entry.target.getAttribute(\"data-card-index\"));\n\n if (Number.isNaN(index)) return;\n\n if (entry.isIntersecting) {\n next.add(index);\n } else {\n next.delete(index);\n }\n });\n return next;\n });\n },\n { root, threshold: 0.5 }\n );\n\n items.forEach((_, index) => {\n const card = root.querySelector(`[data-card-index=\"${index}\"]`) as HTMLElement | null;\n\n if (card) observer.observe(card);\n });\n\n return () => observer.disconnect();\n }, [container, items]);\n\n useEffect(() => {\n const root = container.current;\n\n if (!root) return;\n\n root.addEventListener(\"keydown\", handleKeyDown);\n\n return () => root.removeEventListener(\"keydown\", handleKeyDown);\n }, [container, handleKeyDown]);\n\n const renderIndicators = () => {\n if (inViewSet.size === 0) return;\n\n const indicators = [];\n const viewCapacity = inViewSet.size;\n const leftmostActiveIndex = Math.min(...Array.from(inViewSet));\n const head = items.slice(0, leftmostActiveIndex).length;\n const trail = items.slice(leftmostActiveIndex + viewCapacity).length;\n\n let key = 0;\n\n for (let i = 0; i < items.length; i++) {\n if (head + 1 !== i && head <= i && i < items.length - trail) continue;\n\n let status = \"active\";\n\n if (i < head || i > items.length - 1 - trail) status = \"\";\n\n indicators.push(\n <li key={`indicator-${key++}`} className={cx(`${rootClassName}__indicator`, status)} />\n );\n }\n\n if (indicators.length < 2) return null;\n\n return indicators;\n };\n\n return (\n <li className={cx(rootClassName)}>\n <ul className={cx(`${rootClassName}__indicators`)}>{renderIndicators()}</ul>\n\n <div className={cx(`${rootClassName}__buttons`)}>\n <Button\n aria-label={ariaLabels.previous}\n variant=\"secondary\"\n iconOnly\n className={cx(`${rootClassName}__button`)}\n disabled={inViewSet.has(0)}\n onClick={previousCard}\n >\n <IconArrowLeft className={cx(`${rootClassName}__button-icon`)} size=\"xs\" />\n </Button>\n <Button\n aria-label={ariaLabels.next}\n variant=\"secondary\"\n iconOnly\n className={cx(`${rootClassName}__button`)}\n disabled={inViewSet.has(items.length - 1)}\n onClick={nextCard}\n >\n <IconArrowRight className={cx(`${rootClassName}__button-icon`)} size=\"xs\" />\n </Button>\n </div>\n </li>\n );\n};\n","import React, { type ReactNode, type UIEvent, useCallback, useId, useRef, useState } from \"react\";\nimport c from \"classnames/bind\";\n\nimport styles from \"./comparison-table.module.scss\";\nimport { Cell } from \"./components/Cell/cell\";\nimport { LeadCell } from \"./components/LeadCell/lead-cell\";\nimport { OptionCard, type OptionCardProps } from \"./components/OptionCard/option-card\";\nimport { ScrollProgress } from \"./components/ScrollProgress/scroll-progress\";\n\nconst cx = c.bind(styles);\n\nconst rootClassName = \"purpur-comparison-table\";\n\nexport type Features = Record<string, ReactNode | null>;\n\nexport type Item<TFeatures extends Features = Features> = OptionCardProps & {\n features: Partial<Record<keyof TFeatures, ReactNode | string | boolean>>;\n};\n\nexport type ComparisonTableProps<TFeatures extends Features = Features> = {\n /** List of features that can be supported by the comparison table\n *\n * string = description of the feature that can be viewed by expanding cell.\n *\n * null = no description\n *\n {\n [featureName]: ReactNode | null\n }\n */\n features: TFeatures;\n\n /** List of items to be displayed in the comparison table\n *\n *\n Item = {\n image: {\n src: string;\n alt: string;\n };\n\n title: string;\n description: string;\n variablePriceText: string;\n price: string;\n actions: ReactNode;\n badge?: BadgeProps;\n isHighlighted?: boolean;\n\n features: {\n [featureName in keyof Features]?: string | boolean;\n };\n }\n */\n items: Array<Item<TFeatures>>;\n\n /** Aria labels for the comparison table and various components\n *\n {\n previous: string;\n next: string;\n readMore: string;\n readLess: string;\n }\n */\n ariaLabels: {\n previous: string;\n next: string;\n readMore: string;\n readLess: string;\n };\n variant?: \"primary\" | \"secondary\";\n classname?: string;\n};\n\nexport const ComparisonTable = <TFeatures extends Features>({\n classname,\n features,\n items,\n ariaLabels,\n variant = \"primary\",\n}: ComparisonTableProps<TFeatures>) => {\n const id = useId();\n const classes = cx(classname, rootClassName, `${rootClassName}--${variant}`);\n const containerRef = useRef<HTMLUListElement>(null);\n const [showFullDescriptions, setShowFullDescriptions] = useState(false);\n\n const handleToggleShowFullDescriptions = useCallback(() => {\n setShowFullDescriptions((prev) => !prev);\n }, []);\n\n const renderCards = () => {\n return (\n <li className={cx(`${rootClassName}__cards`)}>\n <div className={cx(`${rootClassName}__separator`)} />\n {items.map((item, index) => (\n <OptionCard\n {...item}\n showFullDescriptions={showFullDescriptions}\n toggleShowFullDescriptions={handleToggleShowFullDescriptions}\n key={index}\n isFirstCard={index === 0}\n ariaLabels={ariaLabels}\n cardIndex={index}\n id={`${index}-${id}`}\n />\n ))}\n </li>\n );\n };\n\n const renderFeatures = () => {\n return Object.entries(features).map(([title, description], i) => (\n <li key={i} className={cx(`${rootClassName}__feature-row`)}>\n <LeadCell title={title} description={description} />\n {items.map((item, index) => (\n <Cell key={index} value={item.features[title as keyof TFeatures] ?? false} />\n ))}\n </li>\n ));\n };\n\n const deltaTime = useRef(0);\n\n const handleScrollEnd = (e: UIEvent<HTMLUListElement>) => {\n /**\n * This function makes sure that the scroll position is never stuck between two cards, since scroll snap is not fully reliable.\n */\n\n const target = e.currentTarget;\n const cardwidth = target.querySelector(\"[data-card-id]\")?.clientWidth ?? 0;\n const cardPos = Math.round(target.scrollLeft / cardwidth);\n const scrollTarget = cardPos * cardwidth + cardPos;\n const timeDiff = e.timeStamp - deltaTime.current;\n const scrollDiff = Math.abs(target.scrollLeft - scrollTarget);\n\n if (deltaTime.current && timeDiff < 200) return;\n if (scrollDiff < 10) return;\n\n deltaTime.current = e.timeStamp;\n\n target.scrollTo({ left: scrollTarget, behavior: \"smooth\" });\n };\n\n return (\n <div className={cx(rootClassName + \"__wrapper\")}>\n <ul\n id={rootClassName + `-${id}`}\n ref={containerRef}\n className={classes}\n // eslint-disable-next-line react/no-unknown-property\n onScrollEnd={handleScrollEnd}\n style={{\n // @ts-expect-error | Typescript doesn't recognize the CSS variable, but it works as intended\n [\"--initial-columns\"]: items.length + 1,\n }}\n >\n <ScrollProgress items={items} container={containerRef} ariaLabels={ariaLabels} />\n {renderCards()}\n {renderFeatures()}\n </ul>\n </div>\n );\n};\n\nComparisonTable.displayName = \"ComparisonTable\";\n"],"names":["cx","c","styles","rootClassName","Cell","value","isReactNode","isValidElement","classes","Icon","IconCheckmark","IconMinus","jsx","LeadCell","title","description","isExpandable","jsxs","Paragraph","IconChevronDown","OptionCard","id","cardIndex","variablePriceText","price","isHighlighted","ariaLabels","badge","actions","isFirstCard","image","showFullDescriptions","toggleShowFullDescriptions","descriptionRef","useRef","descriptionContentRef","showFullDescriptionsRef","descriptionOverflows","setDescriptionOverflows","useState","useEffect","checkDescriptionOverflow","useCallback","descriptionContent","descriptionHeight","contentHeight","descriptionElement","resizeObserver","renderDescription","Button","Badge","Heading","ScrollProgress","items","container","inViewSet","setInViewSet","scrollToCard","index","reduceMotion","previousCard","targetIndex","nextCard","handleKeyDown","root","observer","entries","prev","next","entry","_","card","renderIndicators","indicators","viewCapacity","leftmostActiveIndex","head","trail","key","i","status","IconArrowLeft","IconArrowRight","ComparisonTable","classname","features","variant","useId","containerRef","setShowFullDescriptions","handleToggleShowFullDescriptions","renderCards","item","createElement","renderFeatures","deltaTime","handleScrollEnd","e","target","cardwidth","cardPos","scrollTarget","timeDiff","scrollDiff"],"mappings":"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"}

package/dist/comparison-table.cjs.js CHANGED Viewed

@@ -1,2 +1,2 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("./comparison-table-0UDB2BTU.js");exports.ComparisonTable=e.ComparisonTable;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("./comparison-table-Dtqxz8vL.js");exports.ComparisonTable=e.ComparisonTable;
 //# sourceMappingURL=comparison-table.cjs.js.map

package/dist/comparison-table.es.js CHANGED Viewed

@@ -1,4 +1,4 @@
-import { C as r } from "./comparison-table-CjTE-fHN.mjs";
+import { C as r } from "./comparison-table-D1evE0ri.mjs";
 export {
   r as ComparisonTable
 };

package/dist/components/alert-badge/src/alert-badge.visual.fixtures.d.ts ADDED Viewed

@@ -0,0 +1,15 @@
+import { default as React } from 'react';
+import { AlertBadgeVariant } from './alert-badge';
+type AlertBadgeVisualScenario = {
+    key: string;
+    title: string;
+    variant: AlertBadgeVariant;
+};
+export declare const alertBadgeVisualScenarios: AlertBadgeVisualScenario[];
+export declare const getAlertBadgeVisualTestId: (scenarioKey: string) => string;
+export declare const AlertBadgeVisualScenarioRoot: ({ scenarioKey, }: {
+    scenarioKey: string;
+}) => React.JSX.Element;
+export declare const allAlertBadgeVariants: ("attention" | "error" | "information" | "neutral" | "success" | "warning")[];
+export {};
+//# sourceMappingURL=alert-badge.visual.fixtures.d.ts.map

package/dist/components/alert-badge/src/alert-badge.visual.fixtures.d.ts.map ADDED Viewed

@@ -0,0 +1 @@

+ {"version":3,"file":"alert-badge.visual.fixtures.d.ts","sourceRoot":"","sources":["../../../../../../components/alert-badge/src/alert-badge.visual.fixtures.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAG1B,OAAO,EAAE,KAAK,iBAAiB,EAAsB,MAAM,eAAe,CAAC;AAE3E,KAAK,wBAAwB,GAAG;IAC9B,GAAG,EAAE,MAAM,CAAC;IACZ,KAAK,EAAE,MAAM,CAAC;IACd,OAAO,EAAE,iBAAiB,CAAC;CAC5B,CAAC;AAEF,eAAO,MAAM,yBAAyB,EAAE,wBAAwB,EA+B/D,CAAC;AAEF,eAAO,MAAM,yBAAyB,GAAI,aAAa,MAAM,WACxB,CAAC;AAEtC,eAAO,MAAM,4BAA4B,GAAI,kBAE1C;IACD,WAAW,EAAE,MAAM,CAAC;CACrB,sBAeA,CAAC;AAEF,eAAO,MAAM,qBAAqB,+EAAqB,CAAC"}

package/dist/components/avatar/src/avatar.d.ts CHANGED Viewed

@@ -1,8 +1,8 @@
 import { default as React, ReactNode } from 'react';
+import { BaseProps } from '../../../libraries/common-types/src/common-types';
 import { AVATAR_SIZE } from './avatar-constants';
 export type AvatarSize = (typeof AVATAR_SIZE)[number];
-type AvatarBaseProps = {
-    className?: string;
+type AvatarBaseProps = BaseProps & {
     /** Text or element rendered inside the avatar, typically initials. */
     label: ReactNode;
     size?: AvatarSize;

package/dist/components/avatar/src/avatar.d.ts.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"avatar.d.ts","sourceRoot":"","sources":["../../../../../../components/avatar/src/avatar.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAAE,KAAK,SAAS,EAAE,MAAM,OAAO,CAAC;~~AAK9C~~,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,oBAAoB,CAAC;AAKtD,MAAM,MAAM,UAAU,GAAG,CAAC,OAAO,WAAW,CAAC,CAAC,MAAM,CAAC,CAAC;AAEtD,KAAK,eAAe,GAAG~~;IACrB~~,SAAS,~~CAAC,EAAE,MAAM,CAAC~~;~~IACnB~~,sEAAsE;IACtE,KAAK,EAAE,SAAS,CAAC;IACjB,IAAI,CAAC,EAAE,UAAU,CAAC;CACnB,CAAC;AAEF,KAAK,qBAAqB,GAAG,eAAe,GAAG;IAC7C,oDAAoD;IACpD,UAAU,EAAE,IAAI,CAAC;IACjB,YAAY,CAAC,EAAE,KAAK,CAAC;CACtB,CAAC;AAEF,KAAK,qBAAqB,GAAG,eAAe,GAAG;IAC7C,2FAA2F;IAC3F,YAAY,EAAE,MAAM,CAAC;IACrB,UAAU,CAAC,EAAE,KAAK,CAAC;CACpB,CAAC;AAEF,MAAM,MAAM,WAAW,GAAG,qBAAqB,GAAG,qBAAqB,CAAC;AAExE,eAAO,MAAM,MAAM;YAAW,WAAW;;~~CAiBxC~~,CAAC"}
1	+ {"version":3,"file":"avatar.d.ts","sourceRoot":"","sources":["../../../../../../components/avatar/src/avatar.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAAE,KAAK,SAAS,EAAE,MAAM,OAAO,CAAC;AAC9C,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,sBAAsB,CAAC;AAKtD,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,oBAAoB,CAAC;AAKtD,MAAM,MAAM,UAAU,GAAG,CAAC,OAAO,WAAW,CAAC,CAAC,MAAM,CAAC,CAAC;AAEtD,KAAK,eAAe,GAAG,SAAS,GAAG;IACjC,sEAAsE;IACtE,KAAK,EAAE,SAAS,CAAC;IACjB,IAAI,CAAC,EAAE,UAAU,CAAC;CACnB,CAAC;AAEF,KAAK,qBAAqB,GAAG,eAAe,GAAG;IAC7C,oDAAoD;IACpD,UAAU,EAAE,IAAI,CAAC;IACjB,YAAY,CAAC,EAAE,KAAK,CAAC;CACtB,CAAC;AAEF,KAAK,qBAAqB,GAAG,eAAe,GAAG;IAC7C,2FAA2F;IAC3F,YAAY,EAAE,MAAM,CAAC;IACrB,UAAU,CAAC,EAAE,KAAK,CAAC;CACpB,CAAC;AAEF,MAAM,MAAM,WAAW,GAAG,qBAAqB,GAAG,qBAAqB,CAAC;AAExE,eAAO,MAAM,MAAM;YAAW,WAAW;;CAkBxC,CAAC"}

package/dist/components/avatar/src/avatar.visual.fixtures.d.ts ADDED Viewed

@@ -0,0 +1,14 @@
+import { default as React } from 'react';
+import { AvatarProps } from './avatar';
+type AvatarVisualScenario = {
+    key: string;
+    title: string;
+    createProps: () => AvatarProps;
+};
+export declare const avatarVisualScenarios: AvatarVisualScenario[];
+export declare const getAvatarVisualTestId: (scenarioKey: string) => string;
+export declare const AvatarVisualScenarioRoot: ({ scenarioKey }: {
+    scenarioKey: string;
+}) => React.JSX.Element;
+export {};
+//# sourceMappingURL=avatar.visual.fixtures.d.ts.map

package/dist/components/avatar/src/avatar.visual.fixtures.d.ts.map ADDED Viewed

@@ -0,0 +1 @@

+ {"version":3,"file":"avatar.visual.fixtures.d.ts","sourceRoot":"","sources":["../../../../../../components/avatar/src/avatar.visual.fixtures.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAG1B,OAAO,EAAE,KAAK,WAAW,EAAmB,MAAM,UAAU,CAAC;AAE7D,KAAK,oBAAoB,GAAG;IAC1B,GAAG,EAAE,MAAM,CAAC;IACZ,KAAK,EAAE,MAAM,CAAC;IACd,WAAW,EAAE,MAAM,WAAW,CAAC;CAChC,CAAC;AAQF,eAAO,MAAM,qBAAqB,EAAE,oBAAoB,EA0BvD,CAAC;AAEF,eAAO,MAAM,qBAAqB,GAAI,aAAa,MAAM,WACzB,CAAC;AAEjC,eAAO,MAAM,wBAAwB,GAAI,iBAAiB;IAAE,WAAW,EAAE,MAAM,CAAA;CAAE,sBAqBhF,CAAC"}

package/dist/components/badge/src/badge.visual.fixtures.d.ts.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"badge.visual.fixtures.d.ts","sourceRoot":"","sources":["../../../../../../components/badge/src/badge.visual.fixtures.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAG1B,OAAO,EAAwB,KAAK,UAAU,EAAqB,MAAM,SAAS,CAAC;AAEnF,MAAM,MAAM,mBAAmB,GAAG;IAChC,GAAG,EAAE,MAAM,CAAC;IACZ,KAAK,EAAE,MAAM,CAAC;IACd,WAAW,EAAE,MAAM,UAAU,CAAC;CAC/B,CAAC;AAcF,eAAO,MAAM,oBAAoB,EAAE,mBAAmB,EA0CrD,CAAC;AAEF,eAAO,MAAM,oBAAoB,GAAI,aAAa,MAAM,~~WACzB~~,CAAC;~~AAEhC~~,eAAO,MAAM,uBAAuB,GAAI,iBAAiB;IAAE,WAAW,EAAE,MAAM,CAAA;CAAE,sBAY/E,CAAC"}
1	+ {"version":3,"file":"badge.visual.fixtures.d.ts","sourceRoot":"","sources":["../../../../../../components/badge/src/badge.visual.fixtures.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAG1B,OAAO,EAAwB,KAAK,UAAU,EAAqB,MAAM,SAAS,CAAC;AAEnF,MAAM,MAAM,mBAAmB,GAAG;IAChC,GAAG,EAAE,MAAM,CAAC;IACZ,KAAK,EAAE,MAAM,CAAC;IACd,WAAW,EAAE,MAAM,UAAU,CAAC;CAC/B,CAAC;AAcF,eAAO,MAAM,oBAAoB,EAAE,mBAAmB,EA0CrD,CAAC;AAEF,eAAO,MAAM,oBAAoB,GAAI,aAAa,MAAM,WAAkC,CAAC;AAE3F,eAAO,MAAM,uBAAuB,GAAI,iBAAiB;IAAE,WAAW,EAAE,MAAM,CAAA;CAAE,sBAY/E,CAAC"}

package/dist/components/button/src/button.d.ts CHANGED Viewed

@@ -31,28 +31,9 @@ export declare const Button: React.ForwardRefExoticComponent<(Omit<Omit<{
     size?: import('../../../libraries/action/src/action').Size;
     variant: "text" | "primary" | "secondary" | "expressive" | "destructive" | "tertiary-purple";
 } & {
-    iconOnly: boolean;
-    "aria-label": string;
-} & Partial<Record<never, never>> & React.ClassAttributes<HTMLButtonElement> & React.ButtonHTMLAttributes<HTMLButtonElement> & {
-    [key: `data-${string}`]: string | undefined;
-} & {
-    ai?: boolean;
-    loading?: boolean;
-} & {
-    iconOnly?: false | undefined;
-}, "type"> & {
-    type?: ButtonType;
-}, "ref"> | Omit<Omit<{
-    "data-testid"?: string;
-    children?: React.ReactNode;
-    className?: string;
-    fullWidth?: boolean;
-    negative?: boolean;
-    size?: import('../../../libraries/action/src/action').Size;
-    variant: "text" | "primary" | "secondary" | "expressive" | "destructive" | "tertiary-purple";
-} & {
+    iconOnly?: false;
     "aria-label"?: string;
-} & Partial<Record<"iconOnly", never>> & React.ClassAttributes<HTMLButtonElement> & React.ButtonHTMLAttributes<HTMLButtonElement> & {
+} & Partial<Record<never, never>> & React.ClassAttributes<HTMLButtonElement> & React.ButtonHTMLAttributes<HTMLButtonElement> & {
     [key: `data-${string}`]: string | undefined;
 } & {
     ai?: boolean;
@@ -70,7 +51,7 @@ export declare const Button: React.ForwardRefExoticComponent<(Omit<Omit<{
     size?: import('../../../libraries/action/src/action').Size;
     variant: "text" | import('../../../libraries/action/src/action').Variant | "tertiary-purple";
 } & {
-    iconOnly: boolean;
+    iconOnly: true;
     "aria-label": string;
 } & Partial<Record<never, never>> & React.ClassAttributes<HTMLButtonElement> & React.ButtonHTMLAttributes<HTMLButtonElement> & {
     [key: `data-${string}`]: string | undefined;

package/dist/components/button/src/button.d.ts.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"button.d.ts","sourceRoot":"","sources":["../../../../../../components/button/src/button.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAAE,KAAK,oBAAoB,EAA+B,MAAM,OAAO,CAAC;AACtF,OAAO,EAAE,KAAK,WAAW,EAAiB,MAAM,gBAAgB,CAAC;AACjE,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,sBAAsB,CAAC;AAMtD,eAAO,MAAM,cAAc;;;;;;;CAKjB,CAAC;AAEX,eAAO,MAAM,cAAc,yFAAgC,CAAC;AAC5D,MAAM,MAAM,aAAa,GAAG,CAAC,OAAO,cAAc,CAAC,CAAC,MAAM,OAAO,cAAc,CAAC,CAAC;AAKjF,KAAK,UAAU,GAAG,IAAI,CAAC,oBAAoB,CAAC,iBAAiB,CAAC,EAAE,MAAM,CAAC,CAAC,MAAM,CAAC,CAAC;AAChF,eAAO,MAAM,YAAY,EAAE,UAAU,EAA2C,CAAC;AAEjF,KAAK,eAAe,GAAG,SAAS,CAAC,QAAQ,CAAC,GAAG;IAAE,EAAE,CAAC,EAAE,OAAO,CAAC;IAAC,OAAO,CAAC,EAAE,OAAO,CAAA;CAAE,CAAC;AAEjF,MAAM,MAAM,WAAW,GACnB,CAAC,WAAW,CAAC,aAAa,CAAC,GAAG,eAAe,GAAG;IAAE,QAAQ,CAAC,EAAE,KAAK,GAAG,SAAS,CAAA;CAAE,CAAC,GACjF,CAAC,WAAW,CAAC,OAAO,CAAC,aAAa,EAAE,aAAa,CAAC,CAAC,GAAG,eAAe,GAAG;IAAE,QAAQ,EAAE,IAAI,CAAA;CAAE,CAAC,CAAC;AAOhG,eAAO,MAAM,MAAM;;;;;;;;;;;;;;SAXiC,OAAO;cAAY,OAAO;;eAGb,KAAK,GAAG,SAAS;;WAU/B,UAAU~~;;;;;;;;;;;;;;SAbT,OAAO;cAAY,OAAO;;eAGb,KAAK,GAAG,SAAS;;WAU/B,UAAU~~;;;;;;;;;;;;;;;SAbT,OAAO;cAAY,OAAO;;cAIU,IAAI;;WASzC,UAAU;oDAqE5D,CAAC"}
1	+ {"version":3,"file":"button.d.ts","sourceRoot":"","sources":["../../../../../../components/button/src/button.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAAE,KAAK,oBAAoB,EAA+B,MAAM,OAAO,CAAC;AACtF,OAAO,EAAE,KAAK,WAAW,EAAiB,MAAM,gBAAgB,CAAC;AACjE,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,sBAAsB,CAAC;AAMtD,eAAO,MAAM,cAAc;;;;;;;CAKjB,CAAC;AAEX,eAAO,MAAM,cAAc,yFAAgC,CAAC;AAC5D,MAAM,MAAM,aAAa,GAAG,CAAC,OAAO,cAAc,CAAC,CAAC,MAAM,OAAO,cAAc,CAAC,CAAC;AAKjF,KAAK,UAAU,GAAG,IAAI,CAAC,oBAAoB,CAAC,iBAAiB,CAAC,EAAE,MAAM,CAAC,CAAC,MAAM,CAAC,CAAC;AAChF,eAAO,MAAM,YAAY,EAAE,UAAU,EAA2C,CAAC;AAEjF,KAAK,eAAe,GAAG,SAAS,CAAC,QAAQ,CAAC,GAAG;IAAE,EAAE,CAAC,EAAE,OAAO,CAAC;IAAC,OAAO,CAAC,EAAE,OAAO,CAAA;CAAE,CAAC;AAEjF,MAAM,MAAM,WAAW,GACnB,CAAC,WAAW,CAAC,aAAa,CAAC,GAAG,eAAe,GAAG;IAAE,QAAQ,CAAC,EAAE,KAAK,GAAG,SAAS,CAAA;CAAE,CAAC,GACjF,CAAC,WAAW,CAAC,OAAO,CAAC,aAAa,EAAE,aAAa,CAAC,CAAC,GAAG,eAAe,GAAG;IAAE,QAAQ,EAAE,IAAI,CAAA;CAAE,CAAC,CAAC;AAOhG,eAAO,MAAM,MAAM;;;;;;;;;;;;;;SAXiC,OAAO;cAAY,OAAO;;eAGb,KAAK,GAAG,SAAS;;WAU/B,UAAU;;;;;;;;;;;;;;;SAbT,OAAO;cAAY,OAAO;;cAIU,IAAI;;WASzC,UAAU;oDAqE5D,CAAC"}

package/dist/components/comparison-table/src/components/OptionCard/option-card.d.ts CHANGED Viewed

@@ -7,7 +7,7 @@ export type OptionCardProps = {
         alt: string;
     };
     title: string;
-    description: string;
+    description: ReactNode;
     variablePriceText: string;
     price: string;
     actions: ReactNode;

package/dist/components/comparison-table/src/components/OptionCard/option-card.d.ts.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"option-card.d.ts","sourceRoot":"","sources":["../../../../../../../../components/comparison-table/src/components/OptionCard/option-card.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAAE,KAAK,SAAS,EAA4C,MAAM,OAAO,CAAC;AACxF,OAAO,EAAS,KAAK,UAAU,EAAE,MAAM,eAAe,CAAC;AAOvD,OAAO,EAAE,KAAK,oBAAoB,EAAE,MAAM,wBAAwB,CAAC;AAOnE,MAAM,MAAM,eAAe,GAAG;IAC5B,KAAK,EAAE;QACL,GAAG,EAAE,MAAM,CAAC;QACZ,GAAG,EAAE,MAAM,CAAC;KACb,CAAC;IAEF,KAAK,EAAE,MAAM,CAAC;IACd,WAAW,EAAE,~~MAAM~~,CAAC;~~IACpB~~,iBAAiB,EAAE,MAAM,CAAC;IAC1B,KAAK,EAAE,MAAM,CAAC;IAEd,OAAO,EAAE,SAAS,CAAC;IAEnB,KAAK,CAAC,EAAE,UAAU,CAAC;IACnB,aAAa,CAAC,EAAE,OAAO,CAAC;CACzB,CAAC;AAEF,KAAK,wBAAwB,GAAG;IAC9B,EAAE,EAAE,MAAM,CAAC;IACX,SAAS,EAAE,MAAM,CAAC;IAClB,WAAW,EAAE,OAAO,CAAC;IACrB,UAAU,EAAE,oBAAoB,CAAC,YAAY,CAAC,CAAC;IAE/C,oBAAoB,EAAE,OAAO,CAAC;IAC9B,0BAA0B,EAAE,MAAM,IAAI,CAAC;CACxC,CAAC;AAEF,eAAO,MAAM,UAAU,GAAI,mLAexB,eAAe,GAAG,wBAAwB,~~sBAwG5C~~,CAAC"}
1	+ {"version":3,"file":"option-card.d.ts","sourceRoot":"","sources":["../../../../../../../../components/comparison-table/src/components/OptionCard/option-card.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAAE,KAAK,SAAS,EAA4C,MAAM,OAAO,CAAC;AACxF,OAAO,EAAS,KAAK,UAAU,EAAE,MAAM,eAAe,CAAC;AAOvD,OAAO,EAAE,KAAK,oBAAoB,EAAE,MAAM,wBAAwB,CAAC;AAOnE,MAAM,MAAM,eAAe,GAAG;IAC5B,KAAK,EAAE;QACL,GAAG,EAAE,MAAM,CAAC;QACZ,GAAG,EAAE,MAAM,CAAC;KACb,CAAC;IAEF,KAAK,EAAE,MAAM,CAAC;IACd,WAAW,EAAE,SAAS,CAAC;IACvB,iBAAiB,EAAE,MAAM,CAAC;IAC1B,KAAK,EAAE,MAAM,CAAC;IAEd,OAAO,EAAE,SAAS,CAAC;IAEnB,KAAK,CAAC,EAAE,UAAU,CAAC;IACnB,aAAa,CAAC,EAAE,OAAO,CAAC;CACzB,CAAC;AAEF,KAAK,wBAAwB,GAAG;IAC9B,EAAE,EAAE,MAAM,CAAC;IACX,SAAS,EAAE,MAAM,CAAC;IAClB,WAAW,EAAE,OAAO,CAAC;IACrB,UAAU,EAAE,oBAAoB,CAAC,YAAY,CAAC,CAAC;IAE/C,oBAAoB,EAAE,OAAO,CAAC;IAC9B,0BAA0B,EAAE,MAAM,IAAI,CAAC;CACxC,CAAC;AAEF,eAAO,MAAM,UAAU,GAAI,mLAexB,eAAe,GAAG,wBAAwB,sBAgH5C,CAAC"}

package/dist/components/countdown/src/countdown.d.ts.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"countdown.d.ts","sourceRoot":"","sources":["../../../../../../components/countdown/src/countdown.tsx"],"names":[],"mappings":"AAAA,OAAO,KAA6E,MAAM,OAAO,CAAC;AAMlG,OAAO,EAAE,KAAK,cAAc,EAAE,MAAM,mBAAmB,CAAC;AAQxD;;;;GAIG;AAEH,eAAO,MAAM,SAAS,0FA+~~GrB~~,CAAC"}
1	+ {"version":3,"file":"countdown.d.ts","sourceRoot":"","sources":["../../../../../../components/countdown/src/countdown.tsx"],"names":[],"mappings":"AAAA,OAAO,KAA6E,MAAM,OAAO,CAAC;AAMlG,OAAO,EAAE,KAAK,cAAc,EAAE,MAAM,mBAAmB,CAAC;AAQxD;;;;GAIG;AAEH,eAAO,MAAM,SAAS,0FA+HrB,CAAC"}