@adyen/adyen-platform-experience-web 1.1.1 → 1.3.0

package/dist/es/components/external/TransactionsOverview/components/TransactionsTable/TransactionsTable.js

@@ -1,79 +1,71 @@
-import { useState as F, useCallback as Y, useMemo as k } from "../../../../../external/preact/hooks/dist/hooks.module.js";
-import { DATE_FORMAT_TRANSACTIONS_MOBILE as x, DATE_FORMAT_TRANSACTIONS as H } from "../../../../internal/DataOverviewDisplay/constants.js";
-import I from "../Category/Category.js";
-import P from "../../../../internal/DataOverviewError/DataOverviewError.js";
-import V from "../../../../../core/Context/useCoreContext.js";
-import { getCurrencyCode as $ } from "../../../../../core/Localization/amount/amount-util.js";
-import B from "../../../../hooks/useTimezoneAwareDateFormatting.js";
-import { CellTextPosition as G } from "../../../../internal/DataGrid/types.js";
-import { TypographyVariant as r } from "../../../../internal/Typography/types.js";
-import n from "../../../../internal/Typography/Typography.js";
-import { useResponsiveViewport as p, mediaQueries as d } from "../../../../hooks/useResponsiveViewport.js";
-import { BASE_CLASS as U, AMOUNT_CLASS as W, DATE_AND_PAYMENT_METHOD_CLASS as j, DATE_METHOD_CLASS as q } from "./constants.js";
-import "./TransactionTable.scss.js";
-import y from "./PaymentMethodCell.js";
-import { useTableColumns as z } from "../../../../hooks/useTableColumns.js";
 import { jsx as t } from "../../../../../external/preact/jsx-runtime/dist/jsxRuntime.module.js";
+import { useState as x, useCallback as F, useMemo as Y } from "../../../../../external/preact/hooks/dist/hooks.module.js";
+import k from "../Category/Category.js";
+import H from "../../../../internal/DataOverviewError/DataOverviewError.js";
+import $ from "../../../../../core/Context/useCoreContext.js";
+import { getCurrencyCode as I } from "../../../../../core/Localization/amount/amount-util.js";
+import P from "../../../../../hooks/useTimezoneAwareDateFormatting.js";
+import { CellTextPosition as V } from "../../../../internal/DataGrid/types.js";
+import { TypographyVariant as n } from "../../../../internal/Typography/types.js";
+import a from "../../../../internal/Typography/Typography.js";
+import { useResponsiveViewport as d, mediaQueries as p } from "../../../../../hooks/useResponsiveViewport.js";
+import { BASE_CLASS as B, AMOUNT_CLASS as G, DATE_AND_PAYMENT_METHOD_CLASS as U, DATE_METHOD_CLASS as W } from "./constants.js";
+/* empty css                      */
+import A from "./PaymentMethodCell.js";
+import { useTableColumns as j } from "../../../../../hooks/useTableColumns.js";
 import f from "../../../../internal/DataGrid/DataGrid.js";
+import { DATE_FORMAT_TRANSACTIONS_MOBILE as q, DATE_FORMAT_TRANSACTIONS as z } from "../../../../../constants/dateFormats.js";
 import K from "../../../../internal/Pagination/Pagination.js";
 const Q = ["createdAt", "paymentMethod", "transactionType", "amount"], fo = ({
-  activeBalanceAccount: a,
-  availableCurrencies: s,
-  error: i,
+  activeBalanceAccount: s,
+  availableCurrencies: i,
+  error: m,
   hasMultipleCurrencies: c,
   loading: h,
   onContactSupport: l,
   onRowClick: M,
   showDetails: X,
-  showPagination: D,
-  transactions: S,
-  customColumns: C,
-  ...g
+  showPagination: g,
+  transactions: D,
+  customColumns: S,
+  ...C
 }) => {
-  const {
-    i18n: m
-  } = V(), {
-    dateFormat: T
-  } = B(a == null ? void 0 : a.timeZone), [_, u] = F(), A = p(d.up.sm), E = p(d.up.md), O = p(d.down.xs), v = m.get("amount"), w = z({
+  const { i18n: e } = $(), { dateFormat: T } = P(s == null ? void 0 : s.timeZone), [_, u] = x(), y = d(p.up.sm), E = d(p.up.md), O = d(p.down.xs), w = e.get("amount"), N = j({
     fields: Q,
-    customColumns: C,
+    customColumns: S,
     columnConfig: {
       amount: {
-        label: c ? void 0 : `${v} ${s && s[0] ? `(${$(s[0])})` : ""}`,
-        position: G.RIGHT,
-        flex: A ? 1.5 : void 0
+        label: c ? void 0 : `${w} ${i && i[0] ? `(${I(i[0])})` : ""}`,
+        position: V.RIGHT,
+        flex: y ? 1.5 : void 0
       },
-      transactionType: {
-        visible: E
-      },
-      paymentMethod: {
-        visible: A
-      }
+      transactionType: { visible: E },
+      paymentMethod: { visible: y }
     }
-  }), N = {
+  }), R = {
     title: "noTransactionsFound",
     message: ["tryDifferentSearchOrResetYourFiltersAndWeWillTryAgain"]
-  }, R = Y((o) => {
-    u(o ?? void 0);
-  }, [u]), b = k(() => () => t(P, {
-    error: i,
-    onContactSupport: l,
-    errorMessage: "weCouldNotLoadYourTransactions"
-  }), [i, l]);
-  return t("div", {
-    className: U,
-    children: t(f, {
-      errorDisplay: b,
-      error: i,
-      columns: w,
-      data: S,
+  }, b = F(
+    (o) => {
+      u(o ?? void 0);
+    },
+    [u]
+  ), v = Y(
+    () => () => /* @__PURE__ */ t(H, { error: m, onContactSupport: l, errorMessage: "weCouldNotLoadYourTransactions" }),
+    [m, l]
+  );
+  return /* @__PURE__ */ t("div", { className: B, children: /* @__PURE__ */ t(
+    f,
+    {
+      errorDisplay: v,
+      error: m,
+      columns: N,
+      data: D,
       loading: h,
       outline: !1,
-      onRowClick: {
-        callback: M
-      },
-      onRowHover: R,
-      emptyTableMessage: N,
+      onRowClick: { callback: M },
+      onRowHover: b,
+      emptyTableMessage: R,
       customCells: {
         // Remove status column temporarily
         /* status: ({ value }) => {
@@ -84,62 +76,23 @@ const Q = ["createdAt", "paymentMethod", "transactionType", "amount"], fo = ({
                 />
             );
         },*/
-        transactionType: ({
-          item: o,
-          rowIndex: e
-        }) => {
+        transactionType: ({ item: o, rowIndex: r }) => {
           const L = `tooltip.${o.category}`;
-          return o.category ? m.has(L) ? t(I, {
-            isContainerHovered: e === _,
-            value: o.category
-          }) : t(n, {
-            variant: r.BODY,
-            children: o.category
-          }) : null;
+          return o.category ? e.has(L) ? /* @__PURE__ */ t(k, { isContainerHovered: r === _, value: o.category }) : /* @__PURE__ */ t(a, { variant: n.BODY, children: e.has(`txType.${o.category}`) ? e.get(`txType.${o.category}`) : `${o.category}` }) : null;
         },
-        amount: ({
-          value: o
-        }) => {
-          const e = m.amount(o.value, o.currency, {
-            hideCurrency: !c
-          });
-          return t(n, {
-            variant: r.BODY,
-            className: W,
-            children: e
-          });
+        amount: ({ value: o }) => {
+          const r = e.amount(o.value, o.currency, { hideCurrency: !c });
+          return /* @__PURE__ */ t(a, { variant: n.BODY, className: G, children: r });
         },
-        createdAt: ({
-          item: o,
-          value: e
-        }) => O ? t("div", {
-          className: j,
-          children: [t(y, {
-            paymentMethod: o.paymentMethod,
-            bankAccount: o.bankAccount
-          }), t(n, {
-            variant: r.BODY,
-            className: q,
-            children: T(o.createdAt, x)
-          })]
-        }) : t(n, {
-          variant: r.BODY,
-          children: T(e, H)
-        }),
-        paymentMethod: ({
-          item: o
-        }) => t(y, {
-          paymentMethod: o.paymentMethod,
-          bankAccount: o.bankAccount
-        })
+        createdAt: ({ item: o, value: r }) => O ? /* @__PURE__ */ t("div", { className: U, children: [
+          /* @__PURE__ */ t(A, { paymentMethod: o.paymentMethod, bankAccount: o.bankAccount }),
+          /* @__PURE__ */ t(a, { variant: n.BODY, className: W, children: T(o.createdAt, q) })
+        ] }) : /* @__PURE__ */ t(a, { variant: n.BODY, children: T(r, z) }),
+        paymentMethod: ({ item: o }) => /* @__PURE__ */ t(A, { paymentMethod: o.paymentMethod, bankAccount: o.bankAccount })
       },
-      children: D && t(f.Footer, {
-        children: t(K, {
-          ...g
-        })
-      })
-    })
-  });
+      children: g && /* @__PURE__ */ t(f.Footer, { children: /* @__PURE__ */ t(K, { ...C }) })
+    }
+  ) });
 };
 export {
   Q as TRANSACTION_FIELDS,

package/dist/es/components/external/TransactionsOverview/components/utils.js

@@ -1,10 +1,10 @@
-const i = Object.freeze({
+const a = Object.freeze({
   klarna: "Klarna",
   paypal: "PayPal"
 });
-function t(r, a) {
-  return r.lastFourDigits ? a === "detail" ? "•••• •••• •••• " + r.lastFourDigits : r.lastFourDigits : i[r.type] || r.type;
+function s(r, i) {
+  return r.lastFourDigits ? i === "detail" ? "•••• •••• •••• " + r.lastFourDigits : r.lastFourDigits : r.description || a[r.type] || r.type;
 }
 export {
-  t as parsePaymentMethodType
+  s as parsePaymentMethodType
 };

package/dist/es/components/external/TransactionsOverview/hooks/useMaxWidths.js

@@ -1,10 +1,12 @@
-import { useState as c, useCallback as u } from "../../../../external/preact/hooks/dist/hooks.module.js";
+import { useState as u, useCallback as x } from "../../../../external/preact/hooks/dist/hooks.module.js";
 const W = () => {
-  const [s, r] = c([]), n = u((a) => {
-    r((o) => a.every((t) => !t) ? a : a.map((t, x) => {
-      const e = o[x];
-      return !e || t > e ? t : e;
-    }));
+  const [s, r] = u([]), n = x((a) => {
+    r(
+      (o) => a.every((t) => !t) ? a : a.map((t, c) => {
+        const e = o[c];
+        return !e || t > e ? t : e;
+      })
+    );
   }, []);
   return [s, n];
 };

package/dist/es/components/external/TransactionsOverview/hooks/useTransactionsOverviewMultiSelectionFilters.js

@@ -1,29 +1,29 @@
 import { FilterParam as t } from "../../../types.js";
-import r from "../components/MultiSelectionFilter/useMultiSelectionFilter/useMultiSelectionFilter.js";
-import { TRANSACTION_CATEGORIES as T, DEFAULT_TRANSACTIONS_OVERVIEW_MULTI_SELECTION_FILTER_PARAMS as i, TRANSACTION_STATUSES as o } from "../components/MultiSelectionFilter/useMultiSelectionFilter/constants.js";
-const u = (e, l) => {
-  const s = r({
+import { useMultiSelectionFilter as r } from "../components/MultiSelectionFilter/useMultiSelectionFilter/useMultiSelectionFilter.js";
+import { TRANSACTION_CATEGORIES as T, DEFAULT_TRANSACTIONS_OVERVIEW_MULTI_SELECTION_FILTER_PARAMS as l, TRANSACTION_STATUSES as u } from "../components/MultiSelectionFilter/useMultiSelectionFilter/constants.js";
+const F = (e, i) => {
+  const a = r({
     filterParam: t.CATEGORIES,
     filterValues: T,
-    defaultFilters: i,
+    defaultFilters: l,
     ...e
-  }), a = r({
+  }), s = r({
     filterParam: t.STATUSES,
-    filterValues: o,
-    defaultFilters: i,
+    filterValues: u,
+    defaultFilters: l,
     ...e
   }), S = r({
     filterParam: t.CURRENCIES,
-    filterValues: l,
-    defaultFilters: i,
+    filterValues: i,
+    defaultFilters: l,
     ...e
   });
   return {
-    categoriesFilter: s,
+    categoriesFilter: a,
     currenciesFilter: S,
-    statusesFilter: a
+    statusesFilter: s
   };
-}, n = u;
+};
 export {
-  n as default
+  F as default
 };

package/dist/es/components/external/UIElement/UIElement.js

@@ -1,19 +1,21 @@
-var l = Object.defineProperty;
-var p = (n, e, t) => e in n ? l(n, e, { enumerable: !0, configurable: !0, writable: !0, value: t }) : n[e] = t;
-var o = (n, e, t) => (p(n, typeof e != "symbol" ? e + "" : e, t), t);
-import m from "../../../core/Context/CoreProvider.js";
-import c from "../BaseElement.js";
-import "./UIElement.scss.js";
+var m = Object.defineProperty;
+var p = (o, e, t) => e in o ? m(o, e, { enumerable: !0, configurable: !0, writable: !0, value: t }) : o[e] = t;
+var s = (o, e, t) => p(o, typeof e != "symbol" ? e + "" : e, t);
 import { jsx as i } from "../../../external/preact/jsx-runtime/dist/jsxRuntime.module.js";
-import { AuthProvider as u } from "../../../core/Auth/context.js";
-class d extends c {
+import l from "../../../core/Context/CoreProvider.js";
+import c from "../BaseElement.js";
+/* empty css               */
+import u from "classnames";
+import { ConfigProvider as h } from "../../../core/ConfigContext/context.js";
+class x extends c {
   constructor(t) {
     super(t);
-    o(this, "componentRef", null);
-    o(this, "componentToRender", null);
-    o(this, "elementRef");
-    o(this, "onContactSupport");
-    o(this, "setUIElementStatus");
+    s(this, "componentRef", null);
+    s(this, "componentToRender", null);
+    s(this, "elementRef");
+    s(this, "onContactSupport");
+    s(this, "customClassNames");
+    s(this, "setUIElementStatus");
     this.setState = this.setState.bind(this), this.onContactSupport = t.onContactSupport, this.elementRef = this;
   }
   get isValid() {
@@ -50,34 +52,27 @@ class d extends c {
     };
   }
   setState(t) {
-    this.state = {
-      ...this.state,
-      ...t
-    };
+    this.state = { ...this.state, ...t };
   }
-  setStatus(t, s) {
+  setStatus(t, n) {
     var r, a;
-    return (r = this.componentRef) != null && r.setStatus ? this.componentRef.setStatus(t, s) : (a = this.setUIElementStatus) == null || a.call(this, t), this;
+    return (r = this.componentRef) != null && r.setStatus ? this.componentRef.setStatus(t, n) : (a = this.setUIElementStatus) == null || a.call(this, t), this;
   }
   render() {
-    const t = this.props.core, s = t.update.bind(t), r = this.props.onError || t.onError || null;
-    return t.session.errorHandler = r, i(u, {
-      session: t.session,
-      children: i(m, {
+    const t = this.props.core, n = t.update.bind(t), r = this.props.onError || t.onError || null;
+    return t.session.errorHandler = r, /* @__PURE__ */ i(h, { type: this.type, session: t.session, children: /* @__PURE__ */ i(
+      l,
+      {
         i18n: t.localization.i18n,
         loadingContext: t.loadingContext,
-        updateCore: s,
+        updateCore: n,
         externalErrorHandler: r,
-        children: this.componentToRender && i("div", {
-          className: "adyen-pe-component",
-          children: this.componentToRender()
-        })
-      })
-    }, performance.now());
+        children: this.componentToRender && /* @__PURE__ */ i("div", { className: u("adyen-pe-component", this.customClassNames), children: this.componentToRender() })
+      }
+    ) }, performance.now());
   }
 }
-const g = d;
 export {
-  d as UIElement,
-  g as default
+  x as UIElement,
+  x as default
 };

package/dist/es/components/internal/Accordion/Accordion.js

@@ -1,57 +1,45 @@
+import { jsx as e } from "../../../external/preact/jsx-runtime/dist/jsxRuntime.module.js";
 import d from "classnames";
 import { useState as C, useRef as m, useCallback as h } from "../../../external/preact/hooks/dist/hooks.module.js";
 import A from "../SVGIcons/ChevronDown.js";
 import N from "../SVGIcons/ChevronUp.js";
 import { ACCORDION_BASE_CLASS as O, ACCORDION_HEADER_CLASS as p, ACCORDION_HEADER_CONTAINER_CLASS as E, ACCORDION_HEADER_CONTROLLER_CLASS as S, ACCORDION_CONTENT_CLASS as _ } from "./constants.js";
-import "./Accordion.scss.js";
-import { jsx as e } from "../../../external/preact/jsx-runtime/dist/jsxRuntime.module.js";
-function L({
-  children: a,
-  classNames: c,
-  header: n,
-  headerInformation: i
-}) {
+/* empty css               */
+function L({ children: a, classNames: c, header: n, headerInformation: i }) {
   var t;
   const [o, l] = C(!1), r = m(null), s = h(() => {
     l(!o);
   }, [o]);
-  return e("div", {
-    className: d(O, c),
-    children: [e("h3", {
-      className: p,
-      children: [e("button", {
-        id: "accordion-controller",
-        "aria-controls": "accordion-content",
-        className: E,
-        onClick: s,
-        "aria-expanded": o,
-        children: e("div", {
-          className: S,
-          children: [n, o ? e(N, {
-            height: 8,
-            width: 15
-          }) : e(A, {
-            height: 8,
-            width: 15
-          })]
-        })
-      }), i && e("div", {
-        children: i
-      })]
-    }), e("div", {
-      role: "region",
-      id: "accordion-content",
-      "aria-labelledby": "accordion-controller",
-      style: {
-        maxHeight: o ? (t = r == null ? void 0 : r.current) == null ? void 0 : t.offsetHeight : 0
-      },
-      className: _,
-      children: e("div", {
-        ref: r,
-        children: a
-      })
-    })]
-  });
+  return /* @__PURE__ */ e("div", { className: d(O, c), children: [
+    /* @__PURE__ */ e("h3", { className: p, children: [
+      /* @__PURE__ */ e(
+        "button",
+        {
+          id: "accordion-controller",
+          "aria-controls": "accordion-content",
+          className: E,
+          onClick: s,
+          "aria-expanded": o,
+          children: /* @__PURE__ */ e("div", { className: S, children: [
+            n,
+            o ? /* @__PURE__ */ e(N, { height: 8, width: 15 }) : /* @__PURE__ */ e(A, { height: 8, width: 15 })
+          ] })
+        }
+      ),
+      i && /* @__PURE__ */ e("div", { children: i })
+    ] }),
+    /* @__PURE__ */ e(
+      "div",
+      {
+        role: "region",
+        id: "accordion-content",
+        "aria-labelledby": "accordion-controller",
+        style: { maxHeight: o ? (t = r == null ? void 0 : r.current) == null ? void 0 : t.offsetHeight : 0 },
+        className: _,
+        children: /* @__PURE__ */ e("div", { ref: r, children: a })
+      }
+    )
+  ] });
 }
 export {
   L as default

package/dist/es/components/internal/Alert/Alert.js

@@ -1,62 +1,32 @@
-import p from "classnames";
-import { ButtonVariant as c } from "../Button/types.js";
-import s from "../SVGIcons/Close.js";
-import h from "../SVGIcons/WarningFilled.js";
-import { TypographyElement as t, TypographyVariant as n } from "../Typography/types.js";
-import i from "../Typography/Typography.js";
-import "./Alert.scss.js";
 import { jsx as e } from "../../../external/preact/jsx-runtime/dist/jsxRuntime.module.js";
-import y from "../Button/Button.js";
-import { Fragment as u } from "../../../external/preact/dist/preact.module.js";
-function x({
-  className: o,
-  description: r,
-  title: a,
-  type: l,
-  onClose: m,
-  isOpen: d
-}) {
-  return e(u, {
-    children: d && e("div", {
-      className: p("adyen-pe-alert", o),
-      role: "alert",
-      children: e("div", {
-        className: `adyen-pe-alert__inner-container adyen-pe-alert--${l}`,
-        children: [e("div", {
-          className: "adyen-pe-alert__icon",
-          children: e(h, {})
-        }), e("div", {
-          className: "adyen-pe-alert__content",
-          children: [a && e(i, {
-            className: "adyen-pe-alert__title",
-            el: t.DIV,
-            variant: n.BODY,
-            wide: !0,
-            strongest: !0,
-            children: a
-          }), r && e(i, {
-            className: "adyen-pe-alert__description",
-            el: t.DIV,
-            variant: n.BODY,
-            wide: !0,
-            children: r
-          })]
-        }), e("div", {
-          className: "adyen-pe-alert__close-button",
-          children: e(y, {
-            iconButton: !0,
-            variant: c.TERTIARY,
-            onClick: m,
-            children: e(s, {
-              width: 7.12,
-              height: 7.12
-            })
-          })
-        })]
-      })
-    })
-  });
-}
+import s from "classnames";
+import { ButtonVariant as y } from "../Button/types.js";
+import { TypographyElement as m, TypographyVariant as a } from "../Typography/types.js";
+import p from "../Typography/Typography.js";
+import { AlertIcon as f } from "./AlertIcon.js";
+import { AlertVariantOption as t } from "./types.js";
+/* empty css           */
+import u from "../Button/Button.js";
+import { Icon as T } from "../Icon/Icon.js";
+const P = ({ className: c, description: o, title: n, type: l, children: d, onClose: i, variant: r = t.DEFAULT }) => /* @__PURE__ */ e("div", { className: s("adyen-pe-alert", `adyen-pe-alert--${l}`, `adyen-pe-alert--${r}`, c), role: "alert", children: [
+  /* @__PURE__ */ e(f, { type: l, className: "adyen-pe-alert__icon" }),
+  /* @__PURE__ */ e("div", { className: "adyen-pe-alert__content", children: [
+    n && r !== t.TIP && /* @__PURE__ */ e(p, { className: "adyen-pe-alert__title", el: m.DIV, variant: a.BODY, wide: !0, strongest: !0, children: n }),
+    o && /* @__PURE__ */ e(
+      p,
+      {
+        className: "adyen-pe-alert__description",
+        el: m.DIV,
+        variant: r !== t.TIP ? a.CAPTION : a.BODY,
+        wide: !0,
+        children: o
+      }
+    ),
+    d
+  ] }),
+  i && r !== t.TIP && /* @__PURE__ */ e("div", { className: "adyen-pe-alert__close-button", children: /* @__PURE__ */ e(u, { iconButton: !0, variant: y.TERTIARY, onClick: i, children: /* @__PURE__ */ e(T, { name: "cross" }) }) })
+] });
 export {
-  x as default
+  P as Alert,
+  P as default
 };

package/dist/es/components/internal/Alert/AlertIcon.js

@@ -0,0 +1,19 @@
+import { jsx as e } from "../../../external/preact/jsx-runtime/dist/jsxRuntime.module.js";
+import { AlertTypeOption as n } from "./types.js";
+import { Icon as t } from "../Icon/Icon.js";
+const f = ({ className: r, type: i }) => {
+  switch (i) {
+    case n.WARNING:
+      return /* @__PURE__ */ e(t, { name: "warning-filled", className: r });
+    case n.CRITICAL:
+      return /* @__PURE__ */ e(t, { name: "cross-circle-fill", className: r });
+    case n.HIGHLIGHT:
+      return /* @__PURE__ */ e(t, { name: "info-filled", className: r });
+    case n.SUCCESS:
+    default:
+      return /* @__PURE__ */ e(t, { name: "checkmark-circle-fill", className: r });
+  }
+};
+export {
+  f as AlertIcon
+};

package/dist/es/components/internal/Alert/types.js

@@ -1,4 +1,5 @@
-var c = /* @__PURE__ */ ((I) => (I.WARNING = "warning", I.CRITICAL = "critical", I.HIGHLIGHT = "highlight", I.SUCCESS = "success", I))(c || {});
+var c = /* @__PURE__ */ ((I) => (I.WARNING = "warning", I.CRITICAL = "critical", I.HIGHLIGHT = "highlight", I.SUCCESS = "success", I))(c || {}), r = /* @__PURE__ */ ((I) => (I.DEFAULT = "default", I.TIP = "tip", I))(r || {});
 export {
-  c as AlertTypeOption
+  c as AlertTypeOption,
+  r as AlertVariantOption
 };

package/dist/es/components/internal/AnchorButton/AnchorButton.js

@@ -0,0 +1,22 @@
+import { jsx as C } from "../../../external/preact/jsx-runtime/dist/jsxRuntime.module.js";
+import h from "../Button/hooks/useButton.js";
+import { DEFAULT_BUTTON_CLASSNAME as p } from "../Button/constants.js";
+import { ButtonVariant as A } from "../Button/types.js";
+import { useMemo as t } from "../../../external/preact/hooks/dist/hooks.module.js";
+import { fixedForwardRef as B } from "../../../utils/preact/fixedForwardRef.js";
+import { parseClassName as N } from "../../../utils/preact/className.js";
+import { parseBooleanProp as k } from "../../../utils/preact/props.js";
+const M = (o, n) => {
+  const { variant: i = A.PRIMARY, disabled: a = !1, onClick: l, classNameModifiers: m = [], className: e } = o, c = t(() => N("", e) || "", [e]), f = t(() => k(a), [a]), { click: r, allChildren: u, allProps: s } = h(
+    c,
+    [...m, i],
+    p,
+    f,
+    o,
+    l
+  ), d = t(() => ({ ...s, ...o.onClick && r ? { onClick: r } : {} }), [r, s, o.onClick]);
+  return /* @__PURE__ */ C("a", { ...d, href: o.href, ref: n, children: u });
+}, L = B(M);
+export {
+  L as default
+};