@telia-ace/knowledge-widget-components-contact-link 1.0.45 → 1.1.1-rc.1

package/contact-link-155dc678.js

@@ -0,0 +1,60 @@
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const i=require("react/jsx-runtime"),n=require("./index-4f51e43f.js"),y=require("react");require("react-dom");const $=()=>y.useContext(n.ComponentPropertyContext),f=({className:e,...t})=>{const{widget:o,route:s,mode:a="large",iconSize:x="large",symbol:c,descriptionLabel:l,label:r,textAlign:m}=$(),d=m||(a==="large"?"center":"right"),u=x==="large"?"64":"48",g={apiNotificationPriorityBy:"contacts"};if(a==="compact")return i.jsxs(k,{...t,className:n.appendClassNames(e,"humany-contact-link","humany-contact-link-compact"),textAlign:d,children:[l&&i.jsx(n.Text,{children:l}),s?i.jsx(n.Link,{routeName:s,children:r}):i.jsx(n.WidgetLink,{"aria-haspopup":"dialog",role:"button",activationOptions:g,widgetName:o,children:r})]});const h=i.jsxs(i.Fragment,{children:[c?i.jsx(n.SymbolBadge,{symbol:c}):i.jsx(L,{width:u,viewBox:"0 0 63 37",fill:"none",xmlns:"http://www.w3.org/2000/svg",children:i.jsx("path",{d:"M1 1H62M1 1L24.7579 15.6328M1 1V36M62 1V36M62 1L38.8842 15.5402M1 36H62M1 36L24.7579 15.6328M62 36L38.8842 15.5402M38.8842 15.5402L37.0898 16.6689C33.8642 18.6979 29.7658 18.7172 26.5212 16.7188L24.7579 15.6328",stroke:"#990AE3"})}),r&&i.jsx(j,{children:r}),l&&i.jsx(S,{children:l})]});return s?i.jsx(b,{...t,className:n.appendClassNames(e,"humany-contact-link","humany-contact-link-large"),routeName:s,children:h}):i.jsx(w,{...t,"aria-haspopup":"dialog",role:"button",className:n.appendClassNames(e,"humany-contact-link","humany-contact-link-large"),textAlign:d,widgetName:o,activationOptions:g,children:h})},k=n.newStyled.div`
+    text-align: ${e=>e.textAlign};
+    font-weight: 300;
+
+    span,
+    a {
+        display: inline-block;
+        font-size: ${e=>{var t;return(t=e.theme.fonts)==null?void 0:t.normal}};
+    }
+
+    span {
+        margin: 0 ${e=>{var t;return(t=e.theme.sizes)==null?void 0:t.small}} 0 0;
+    }
+    a {
+        text-decoration: underline;
+        color: ${e=>{var t;return(t=e.theme.colors)==null?void 0:t.primary}};
+        &:focus-visible {
+            ${n.linkTabStyle}
+            padding: ${e=>{var t,o;return`calc(${(t=e.theme.sizes)==null?void 0:t.small} / 2) ${(o=e.theme.sizes)==null?void 0:o.small}`}};
+        }
+    }
+`,p=e=>{var t,o,s,a;return n.css`
+    ${n.contentBox(e)}
+    padding: ${(t=e.theme.sizes)==null?void 0:t.large};
+    text-align: center;
+    cursor: pointer;
+    text-decoration: none;
+    i {
+        font-size: ${(o=e.theme.fonts)==null?void 0:o.huge};
+        min-width: 1em;
+        min-height: 1em;
+        color: ${(s=e.theme.colors)==null?void 0:s.primary};
+    }
+    span {
+        color: ${(a=e.theme.colors)==null?void 0:a.text};
+    }
+    &:focus-visible {
+        ${n.borderTabStyle(e)};
+    }
+`},w=n.newStyled(n.WidgetLink)`
+    ${p}
+    text-align: ${e=>e.textAlign};
+`,b=n.newStyled(n.Link)`
+    ${p}
+`,S=n.newStyled(n.Text)`
+    line-height: 1.6em;
+    font-weight: 300;
+    font-size: ${e=>{var t;return(t=e.theme.fonts)==null?void 0:t.normal}};
+`,j=n.newStyled(n.Text)`
+    display: block;
+    font-size: ${e=>{var t;return(t=e.theme.fonts)==null?void 0:t.medium}};
+    margin: ${e=>{var t;return(t=e.theme.sizes)==null?void 0:t.normal}} 0;
+`,L=n.newStyled.svg`
+    align-self: center;
+
+    path {
+        vector-effect: non-scaling-stroke;
+        stroke: ${e=>{var t;return(t=e.theme.colors)==null?void 0:t.primary}};
+    }
+`;exports.default=f;

package/contact-link-7d540b11.mjs

@@ -0,0 +1,182 @@
+import { jsxs as f, jsx as n, Fragment as w } from "react/jsx-runtime";
+import { C as L, a as c, T as m, L as y, W as x, S as z, n as a, l as C, c as M, b as S, d as v } from "./index-252b1674.mjs";
+import { useContext as N } from "react";
+import "react-dom";
+const A = () => N(L), I = ({ className: t, ...e }) => {
+  const {
+    widget: o,
+    route: i,
+    mode: s = "large",
+    iconSize: k = "large",
+    symbol: g,
+    descriptionLabel: r,
+    label: l,
+    textAlign: d
+  } = A(), h = d || (s === "large" ? "center" : "right"), b = k === "large" ? "64" : "48", p = {
+    apiNotificationPriorityBy: "contacts"
+  };
+  if (s === "compact")
+    return /* @__PURE__ */ f(
+      B,
+      {
+        ...e,
+        className: c(
+          t,
+          "humany-contact-link",
+          "humany-contact-link-compact"
+        ),
+        textAlign: h,
+        children: [
+          r && /* @__PURE__ */ n(m, { children: r }),
+          i ? /* @__PURE__ */ n(y, { routeName: i, children: l }) : /* @__PURE__ */ n(
+            x,
+            {
+              "aria-haspopup": "dialog",
+              role: "button",
+              activationOptions: p,
+              widgetName: o,
+              children: l
+            }
+          )
+        ]
+      }
+    );
+  const u = /* @__PURE__ */ f(w, { children: [
+    g ? /* @__PURE__ */ n(z, { symbol: g }) : /* @__PURE__ */ n(
+      j,
+      {
+        width: b,
+        viewBox: "0 0 63 37",
+        fill: "none",
+        xmlns: "http://www.w3.org/2000/svg",
+        children: /* @__PURE__ */ n(
+          "path",
+          {
+            d: "M1 1H62M1 1L24.7579 15.6328M1 1V36M62 1V36M62 1L38.8842 15.5402M1 36H62M1 36L24.7579 15.6328M62 36L38.8842 15.5402M38.8842 15.5402L37.0898 16.6689C33.8642 18.6979 29.7658 18.7172 26.5212 16.7188L24.7579 15.6328",
+            stroke: "#990AE3"
+          }
+        )
+      }
+    ),
+    l && /* @__PURE__ */ n(H, { children: l }),
+    r && /* @__PURE__ */ n(W, { children: r })
+  ] });
+  return i ? /* @__PURE__ */ n(
+    T,
+    {
+      ...e,
+      className: c(
+        t,
+        "humany-contact-link",
+        "humany-contact-link-large"
+      ),
+      routeName: i,
+      children: u
+    }
+  ) : /* @__PURE__ */ n(
+    P,
+    {
+      ...e,
+      "aria-haspopup": "dialog",
+      role: "button",
+      className: c(
+        t,
+        "humany-contact-link",
+        "humany-contact-link-large"
+      ),
+      textAlign: h,
+      widgetName: o,
+      activationOptions: p,
+      children: u
+    }
+  );
+}, B = a.div`
+    text-align: ${(t) => t.textAlign};
+    font-weight: 300;
+
+    span,
+    a {
+        display: inline-block;
+        font-size: ${(t) => {
+  var e;
+  return (e = t.theme.fonts) == null ? void 0 : e.normal;
+}};
+    }
+
+    span {
+        margin: 0 ${(t) => {
+  var e;
+  return (e = t.theme.sizes) == null ? void 0 : e.small;
+}} 0 0;
+    }
+    a {
+        text-decoration: underline;
+        color: ${(t) => {
+  var e;
+  return (e = t.theme.colors) == null ? void 0 : e.primary;
+}};
+        &:focus-visible {
+            ${C}
+            padding: ${(t) => {
+  var e, o;
+  return `calc(${(e = t.theme.sizes) == null ? void 0 : e.small} / 2) ${(o = t.theme.sizes) == null ? void 0 : o.small}`;
+}};
+        }
+    }
+`, $ = (t) => {
+  var e, o, i, s;
+  return M`
+    ${S(t)}
+    padding: ${(e = t.theme.sizes) == null ? void 0 : e.large};
+    text-align: center;
+    cursor: pointer;
+    text-decoration: none;
+    i {
+        font-size: ${(o = t.theme.fonts) == null ? void 0 : o.huge};
+        min-width: 1em;
+        min-height: 1em;
+        color: ${(i = t.theme.colors) == null ? void 0 : i.primary};
+    }
+    span {
+        color: ${(s = t.theme.colors) == null ? void 0 : s.text};
+    }
+    &:focus-visible {
+        ${v(t)};
+    }
+`;
+}, P = a(x)`
+    ${$}
+    text-align: ${(t) => t.textAlign};
+`, T = a(y)`
+    ${$}
+`, W = a(m)`
+    line-height: 1.6em;
+    font-weight: 300;
+    font-size: ${(t) => {
+  var e;
+  return (e = t.theme.fonts) == null ? void 0 : e.normal;
+}};
+`, H = a(m)`
+    display: block;
+    font-size: ${(t) => {
+  var e;
+  return (e = t.theme.fonts) == null ? void 0 : e.medium;
+}};
+    margin: ${(t) => {
+  var e;
+  return (e = t.theme.sizes) == null ? void 0 : e.normal;
+}} 0;
+`, j = a.svg`
+    align-self: center;
+
+    path {
+        vector-effect: non-scaling-stroke;
+        stroke: ${(t) => {
+  var e;
+  return (e = t.theme.colors) == null ? void 0 : e.primary;
+}};
+    }
+`;
+export {
+  I as default
+};