@purpurds/cta-link 5.4.3 → 5.6.0

package/dist/cta-link.d.ts

@@ -1,9 +1,79 @@
 import { ActionProps } from '@purpurds/action';
-import { default as React, AnchorHTMLAttributes } from 'react';
+import { default as React, AnchorHTMLAttributes, ForwardedRef, HTMLAttributes } from 'react';
 
 export declare const ctaLinkIcons: readonly ["forward", "external", "back", "phone"];
 export type CtaLinkIcon = (typeof ctaLinkIcons)[number];
-export declare const CtaLink: ({ children, className, ["data-testid"]: dataTestid, fullWidth, iconOnly, negative, size, variant, icon, ...props }: ActionProps & React.AnchorHTMLAttributes<HTMLAnchorElement> & {
+type DefaultProps = ActionProps & {
+    icon?: CtaLinkIcon;
+};
+type AnchorProps = DefaultProps & {
+    href: string;
+    ref?: ForwardedRef<HTMLAnchorElement>;
+} & AnchorHTMLAttributes<HTMLAnchorElement>;
+type SpanProps = DefaultProps & {
+    ref?: ForwardedRef<HTMLSpanElement>;
+} & HTMLAttributes<HTMLSpanElement>;
+export type CtaLinkProps = AnchorProps | SpanProps;
+export declare const CtaLink: React.ForwardRefExoticComponent<(Omit<{
+    "data-testid"?: string | undefined;
+    children?: React.ReactNode;
+    className?: string | undefined;
+    fullWidth?: boolean | undefined;
+    negative?: boolean | undefined;
+    size?: import('@purpurds/action').Size | undefined;
+    variant: import('@purpurds/action').Variant;
+} & {
+    iconOnly: boolean;
+    "aria-label": string;
+} & Partial<Record<never, never>> & {
     icon?: "forward" | "external" | "back" | "phone" | undefined;
-}) => React.JSX.Element;
+} & {
+    href: string;
+    ref?: React.ForwardedRef<HTMLAnchorElement> | undefined;
+} & React.AnchorHTMLAttributes<HTMLAnchorElement>, "ref"> | Omit<{
+    "data-testid"?: string | undefined;
+    children?: React.ReactNode;
+    className?: string | undefined;
+    fullWidth?: boolean | undefined;
+    negative?: boolean | undefined;
+    size?: import('@purpurds/action').Size | undefined;
+    variant: import('@purpurds/action').Variant;
+} & {
+    "aria-label"?: string | undefined;
+} & Partial<Record<"iconOnly", never>> & {
+    icon?: "forward" | "external" | "back" | "phone" | undefined;
+} & {
+    href: string;
+    ref?: React.ForwardedRef<HTMLAnchorElement> | undefined;
+} & React.AnchorHTMLAttributes<HTMLAnchorElement>, "ref"> | Omit<{
+    "data-testid"?: string | undefined;
+    children?: React.ReactNode;
+    className?: string | undefined;
+    fullWidth?: boolean | undefined;
+    negative?: boolean | undefined;
+    size?: import('@purpurds/action').Size | undefined;
+    variant: import('@purpurds/action').Variant;
+} & {
+    iconOnly: boolean;
+    "aria-label": string;
+} & Partial<Record<never, never>> & {
+    icon?: "forward" | "external" | "back" | "phone" | undefined;
+} & {
+    ref?: React.ForwardedRef<HTMLSpanElement> | undefined;
+} & React.HTMLAttributes<HTMLSpanElement>, "ref"> | Omit<{
+    "data-testid"?: string | undefined;
+    children?: React.ReactNode;
+    className?: string | undefined;
+    fullWidth?: boolean | undefined;
+    negative?: boolean | undefined;
+    size?: import('@purpurds/action').Size | undefined;
+    variant: import('@purpurds/action').Variant;
+} & {
+    "aria-label"?: string | undefined;
+} & Partial<Record<"iconOnly", never>> & {
+    icon?: "forward" | "external" | "back" | "phone" | undefined;
+} & {
+    ref?: React.ForwardedRef<HTMLSpanElement> | undefined;
+} & React.HTMLAttributes<HTMLSpanElement>, "ref">) & React.RefAttributes<HTMLAnchorElement | HTMLSpanElement>>;
+export {};
 //# sourceMappingURL=cta-link.d.ts.map

package/dist/cta-link.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"cta-link.d.ts","sourceRoot":"","sources":["../src/cta-link.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAAE,oBAAoB,EAAE,MAAM,OAAO,CAAC;AACpD,OAAO,EAAE,WAAW,EAAQ,MAAM,kBAAkB,CAAC;AAOrD,eAAO,MAAM,YAAY,mDAAoD,CAAC;AAC9E,MAAM,MAAM,WAAW,GAAG,CAAC,OAAO,YAAY,CAAC,CAAC,MAAM,CAAC,CAAC;AASxD,eAAO,MAAM,OAAO;;uBAwCnB,CAAC"}
+{"version":3,"file":"cta-link.d.ts","sourceRoot":"","sources":["../src/cta-link.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAAE,oBAAoB,EAAE,YAAY,EAAc,cAAc,EAAE,MAAM,OAAO,CAAC;AAC9F,OAAO,EAAE,WAAW,EAAQ,MAAM,kBAAkB,CAAC;AAQrD,eAAO,MAAM,YAAY,mDAAoD,CAAC;AAC9E,MAAM,MAAM,WAAW,GAAG,CAAC,OAAO,YAAY,CAAC,CAAC,MAAM,CAAC,CAAC;AASxD,KAAK,YAAY,GAAG,WAAW,GAAG;IAAE,IAAI,CAAC,EAAE,WAAW,CAAA;CAAE,CAAC;AAEzD,KAAK,WAAW,GAAG,YAAY,GAAG;IAChC,IAAI,EAAE,MAAM,CAAC;IACb,GAAG,CAAC,EAAE,YAAY,CAAC,iBAAiB,CAAC,CAAC;CACvC,GAAG,oBAAoB,CAAC,iBAAiB,CAAC,CAAC;AAE5C,KAAK,SAAS,GAAG,YAAY,GAAG;IAC9B,GAAG,CAAC,EAAE,YAAY,CAAC,eAAe,CAAC,CAAC;CACrC,GAAG,cAAc,CAAC,eAAe,CAAC,CAAC;AAEpC,MAAM,MAAM,YAAY,GAAG,WAAW,GAAG,SAAS,CAAC;AAEnD,eAAO,MAAM,OAAO;;;;;;;;;;;;;;UAVZ,MAAM;;;;;;;;;;;;;;;UAAN,MAAM;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;8GAsEb,CAAC"}

package/dist/cta-link.es.js

@@ -1,13 +1,14 @@
-import { jsx as d, jsxs as x } from "react/jsx-runtime";
-const c = {
+import { jsx as o, jsxs as k, Fragment as b } from "react/jsx-runtime";
+import { forwardRef as $ } from "react";
+const d = {
   SM: "sm",
   MD: "md",
   LG: "lg"
 };
-function k(e) {
+function M(e) {
   return e && e.__esModule && Object.prototype.hasOwnProperty.call(e, "default") ? e.default : e;
 }
-var f = { exports: {} };
+var w = { exports: {} };
 /*!
 	Copyright (c) 2018 Jed Watson.
 	Licensed under the MIT License (MIT), see
@@ -19,11 +20,11 @@ var f = { exports: {} };
     function a() {
       for (var r = "", t = 0; t < arguments.length; t++) {
         var n = arguments[t];
-        n && (r = u(r, i.call(this, n)));
+        n && (r = i(r, u.call(this, n)));
       }
       return r;
     }
-    function i(r) {
+    function u(r) {
       if (typeof r == "string" || typeof r == "number")
         return this && this[r] || r;
       if (typeof r != "object")
@@ -34,17 +35,17 @@ var f = { exports: {} };
         return r.toString();
       var t = "";
       for (var n in r)
-        l.call(r, n) && r[n] && (t = u(t, this && this[n] || n));
+        l.call(r, n) && r[n] && (t = i(t, this && this[n] || n));
       return t;
     }
-    function u(r, t) {
+    function i(r, t) {
       return t ? r ? r + " " + t : r + t : r;
     }
     e.exports ? (a.default = a, e.exports = a) : window.classNames = a;
   })();
-})(f);
-var b = f.exports;
-const $ = /* @__PURE__ */ k(b), M = {
+})(w);
+var S = w.exports;
+const j = /* @__PURE__ */ M(S), L = {
   "purpur-icon": "_purpur-icon_8u1lq_1",
   "purpur-icon--xxs": "_purpur-icon--xxs_8u1lq_4",
   "purpur-icon--xs": "_purpur-icon--xs_8u1lq_8",
@@ -52,47 +53,47 @@ const $ = /* @__PURE__ */ k(b), M = {
   "purpur-icon--md": "_purpur-icon--md_8u1lq_16",
   "purpur-icon--lg": "_purpur-icon--lg_8u1lq_20",
   "purpur-icon--xl": "_purpur-icon--xl_8u1lq_24"
-}, S = {
+}, O = {
   name: "arrow-left",
   svg: '<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="currentColor"><path fill-rule="evenodd" d="M3.1 12a.9.9 0 0 1 .264-.636l5.5-5.5a.9.9 0 0 1 1.272 1.272L6.173 11.1H20a.9.9 0 0 1 0 1.8H6.173l3.963 3.964a.9.9 0 1 1-1.272 1.272l-5.5-5.5A.9.9 0 0 1 3.1 12Z" clip-rule="evenodd"/></svg>',
   keywords: ["arrow-left"],
   category: "utility"
-}, j = {
+}, C = {
   name: "arrow-right",
   svg: '<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="currentColor"><path fill-rule="evenodd" d="M20.9 12a.9.9 0 0 1-.264.636l-5.5 5.5a.9.9 0 0 1-1.272-1.272l3.963-3.964H4a.9.9 0 0 1 0-1.8h13.827l-3.963-3.964a.9.9 0 1 1 1.272-1.272l5.5 5.5A.9.9 0 0 1 20.9 12Z" clip-rule="evenodd"/></svg>',
   keywords: ["arrow-right"],
   category: "utility"
-}, L = {
+}, q = {
   name: "external",
   svg: '<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="currentColor"><path fill-rule="evenodd" d="M15 3.4a.9.9 0 1 1 0-1.8h6.5a.9.9 0 0 1 .9.9V9a.9.9 0 1 1-1.8 0V4.673l-7.964 7.963a.9.9 0 1 1-1.272-1.272L19.327 3.4H15ZM1.6 5c0-1.05.85-1.9 1.9-1.9h6a.9.9 0 0 1 0 1.8h-6a.1.1 0 0 0-.1.1v15.5a.1.1 0 0 0 .1.1h16a.1.1 0 0 0 .1-.1V14a.9.9 0 1 1 1.8 0v6.5a1.9 1.9 0 0 1-1.9 1.9h-16a1.9 1.9 0 0 1-1.9-1.9V5Z" clip-rule="evenodd"/></svg>',
   keywords: ["external"],
   category: "media"
-}, O = {
+}, N = {
   name: "phone",
   svg: '<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="currentColor"><path fill-rule="evenodd" d="M5.341 2.228c.75-.622 1.73-.43 2.305.145l2.783 2.783a1.9 1.9 0 0 1 0 2.687L8.843 9.43a.1.1 0 0 0 0 .142l5.586 5.585a.1.1 0 0 0 .142 0l1.585-1.585a1.9 1.9 0 0 1 2.687 0l3.5 3.5c.343.342.698 1.023.31 1.742-.346.645-1.173 1.615-3.154 2.936-1.75 1.167-3.667 1.269-5.297.903-1.61-.361-3.015-1.192-3.839-2.016a.9.9 0 0 1 1.273-1.272c.573.572 1.669 1.242 2.96 1.532 1.27.285 2.656.188 3.905-.645 1.483-.989 2.137-1.68 2.418-2.06l-3.348-3.347a.1.1 0 0 0-.142 0l-1.586 1.585a1.9 1.9 0 0 1-2.687 0l-5.585-5.585a1.9 1.9 0 0 1 0-2.688l1.585-1.585a.1.1 0 0 0 0-.142L6.41 3.682c-.447.383-1.183 1.102-2.206 2.38-.878 1.097-1.14 2.08-1.127 2.951.013.898.323 1.758.732 2.59.24.488.733 1.079 1.551 1.88.561.549 1.227 1.152 2.002 1.854.344.312.71.644 1.098 1a.9.9 0 0 1-1.215 1.327c-.367-.336-.722-.658-1.061-.965a77.443 77.443 0 0 1-2.082-1.93c-.831-.813-1.523-1.586-1.909-2.372-.456-.93-.896-2.07-.916-3.356-.02-1.314.399-2.7 1.521-4.103 1.148-1.435 1.995-2.254 2.544-2.71Z" clip-rule="evenodd"/></svg>',
   keywords: ["phone"],
   category: "device"
-}, C = $.bind(M), m = "purpur-icon", q = "md", N = (e) => e.filter((l) => Object.keys(l).length >= 1).map((l) => `${l.name}="${l.value}"`).join(" "), A = ({ content: e = "", title: l } = {}) => {
+}, A = j.bind(L), h = "purpur-icon", I = "md", V = (e) => e.filter((l) => Object.keys(l).length >= 1).map((l) => `${l.name}="${l.value}"`).join(" "), B = ({ content: e = "", title: l } = {}) => {
   const a = [
     { name: "xmlns", value: "http://www.w3.org/2000/svg" },
     { name: "fill", value: "currentColor" },
     { name: "viewBox", value: "0 0 24 24" },
     l ? { name: "role", value: "img" } : { name: "aria-hidden", value: "true" }
-  ], i = l ? `<title>${l}</title>` : "";
-  return `<svg ${N(a)}>${i}${e}</svg>`;
-}, V = (e) => e.replace(/<(\/?)svg([^>]*)>/g, "").trim(), _ = ({
+  ], u = l ? `<title>${l}</title>` : "";
+  return `<svg ${V(a)}>${u}${e}</svg>`;
+}, H = (e) => e.replace(/<(\/?)svg([^>]*)>/g, "").trim(), _ = ({
   ["data-testid"]: e,
   svg: l,
   allyTitle: a,
-  className: i = "",
-  size: u = q,
+  className: u = "",
+  size: i = I,
   ...r
 }) => {
-  const t = A({
-    content: V(l.svg),
+  const t = B({
+    content: H(l.svg),
     title: a
-  }), n = C(i, m, `${m}--${u}`);
-  return /* @__PURE__ */ d(
+  }), n = A(u, h, `${h}--${i}`);
+  return /* @__PURE__ */ o(
     "span",
     {
       "aria-label": a,
@@ -103,10 +104,10 @@ const $ = /* @__PURE__ */ k(b), M = {
     }
   );
 };
-function B(e) {
+function P(e) {
   return e && e.__esModule && Object.prototype.hasOwnProperty.call(e, "default") ? e.default : e;
 }
-var h = { exports: {} };
+var x = { exports: {} };
 /*!
 	Copyright (c) 2018 Jed Watson.
 	Licensed under the MIT License (MIT), see
@@ -118,32 +119,32 @@ var h = { exports: {} };
     function a() {
       for (var r = "", t = 0; t < arguments.length; t++) {
         var n = arguments[t];
-        n && (r = u(r, i(n)));
+        n && (r = i(r, u.call(this, n)));
       }
       return r;
     }
-    function i(r) {
+    function u(r) {
       if (typeof r == "string" || typeof r == "number")
-        return r;
+        return this && this[r] || r;
       if (typeof r != "object")
         return "";
       if (Array.isArray(r))
-        return a.apply(null, r);
+        return a.apply(this, r);
       if (r.toString !== Object.prototype.toString && !r.toString.toString().includes("[native code]"))
         return r.toString();
       var t = "";
       for (var n in r)
-        l.call(r, n) && r[n] && (t = u(t, n));
+        l.call(r, n) && r[n] && (t = i(t, this && this[n] || n));
       return t;
     }
-    function u(r, t) {
+    function i(r, t) {
       return t ? r ? r + " " + t : r + t : r;
     }
     e.exports ? (a.default = a, e.exports = a) : window.classNames = a;
   })();
-})(h);
-var H = h.exports;
-const I = /* @__PURE__ */ B(H), s = {
+})(x);
+var Z = x.exports;
+const D = /* @__PURE__ */ P(Z), E = {
   "purpur-cta-link": "_purpur-cta-link_1mhg7_1",
   "purpur-cta-link--sm": "_purpur-cta-link--sm_1mhg7_33",
   "purpur-cta-link--icon-only": "_purpur-cta-link--icon-only_1mhg7_36",
@@ -157,44 +158,50 @@ const I = /* @__PURE__ */ B(H), s = {
   "purpur-cta-link--secondary-negative": "_purpur-cta-link--secondary-negative_1mhg7_87",
   "purpur-cta-link--expressive": "_purpur-cta-link--expressive_1mhg7_98",
   "purpur-cta-link--expressive-negative": "_purpur-cta-link--expressive-negative_1mhg7_108"
-}, p = "purpur-cta-link", P = ["forward", "external", "back", "phone"], Z = {
-  forward: j,
-  external: L,
-  back: S,
-  phone: O
-}, E = ({
-  children: e,
-  className: l,
-  ["data-testid"]: a,
-  fullWidth: i = !1,
-  iconOnly: u,
-  negative: r = !1,
-  size: t = c.MD,
-  variant: n,
-  icon: o = "forward",
-  ...g
-}) => {
-  const w = I(
-    [
-      l,
-      s[p],
-      s[`${p}--${r ? `${n}-negative` : n}`],
-      s[`${p}--${t}`]
-    ],
-    {
-      [s[`${p}--icon-only`]]: u,
-      [s[`${p}--negative`]]: r,
-      [s[`${p}--full-width`]]: i
-    }
-  ), y = g.href ? "a" : "span", v = Z[o];
-  return /* @__PURE__ */ x(y, { className: w, "data-testid": a, ...g, children: [
-    (o === "back" || o === "phone") && /* @__PURE__ */ d(_, { svg: v, size: t === c.LG ? "sm" : "xs" }),
-    !u && e,
-    (o === "forward" || o === "external") && /* @__PURE__ */ d(_, { svg: v, size: t === c.LG ? "sm" : "xs" })
-  ] });
-};
+}, G = D.bind(E), s = "purpur-cta-link", T = ["forward", "external", "back", "phone"], z = {
+  forward: C,
+  external: q,
+  back: O,
+  phone: N
+}, K = $(
+  ({
+    children: e,
+    className: l,
+    ["data-testid"]: a,
+    fullWidth: u = !1,
+    iconOnly: i,
+    negative: r = !1,
+    size: t = d.MD,
+    variant: n,
+    icon: p = "forward",
+    ...c
+  }, g) => {
+    const y = G(
+      [
+        l,
+        s,
+        `${s}--${r ? `${n}-negative` : n}`,
+        `${s}--${t}`
+      ],
+      {
+        [`${s}--icon-only`]: i,
+        [`${s}--negative`]: r,
+        [`${s}--full-width`]: u
+      }
+    ), v = z[p], m = /* @__PURE__ */ k(b, { children: [
+      (p === "back" || p === "phone") && /* @__PURE__ */ o(_, { svg: v, size: t === d.LG ? "sm" : "xs" }),
+      !i && e,
+      (p === "forward" || p === "external") && /* @__PURE__ */ o(_, { svg: v, size: t === d.LG ? "sm" : "xs" })
+    ] }), f = {
+      ...c,
+      className: y,
+      "data-testid": a
+    };
+    return "href" in c && c.href ? /* @__PURE__ */ o("a", { ...f, ref: g, children: m }) : /* @__PURE__ */ o("span", { ...f, ref: g, children: m });
+  }
+);
 export {
-  E as CtaLink,
-  P as ctaLinkIcons
+  K as CtaLink,
+  T as ctaLinkIcons
 };
 //# sourceMappingURL=cta-link.es.js.map