@telia-ace/knowledge-widget-components-contact-link 1.0.6 → 1.0.11

package/dist/contact-link.js

@@ -0,0 +1,200 @@
+var __defProp = Object.defineProperty;
+var __defProps = Object.defineProperties;
+var __getOwnPropDescs = Object.getOwnPropertyDescriptors;
+var __getOwnPropSymbols = Object.getOwnPropertySymbols;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __propIsEnum = Object.prototype.propertyIsEnumerable;
+var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
+var __spreadValues = (a, b) => {
+  for (var prop in b || (b = {}))
+    if (__hasOwnProp.call(b, prop))
+      __defNormalProp(a, prop, b[prop]);
+  if (__getOwnPropSymbols)
+    for (var prop of __getOwnPropSymbols(b)) {
+      if (__propIsEnum.call(b, prop))
+        __defNormalProp(a, prop, b[prop]);
+    }
+  return a;
+};
+var __spreadProps = (a, b) => __defProps(a, __getOwnPropDescs(b));
+var __objRest = (source, exclude) => {
+  var target = {};
+  for (var prop in source)
+    if (__hasOwnProp.call(source, prop) && exclude.indexOf(prop) < 0)
+      target[prop] = source[prop];
+  if (source != null && __getOwnPropSymbols)
+    for (var prop of __getOwnPropSymbols(source)) {
+      if (exclude.indexOf(prop) < 0 && __propIsEnum.call(source, prop))
+        target[prop] = source[prop];
+    }
+  return target;
+};
+import { useProperties, Text, Link, WidgetLink, SymbolBadge, linkTabStyle, contentBox, borderTabStyle } from "@telia-ace/knowledge-widget-ui";
+import { appendClassNames } from "@telia-ace/widget-utilities";
+import React from "react";
+import styled, { css } from "styled-components";
+const ContactLink = (_a) => {
+  var _b = _a, { className } = _b, other = __objRest(_b, ["className"]);
+  const {
+    widget,
+    route,
+    mode = "large",
+    iconSize = "large",
+    symbol,
+    descriptionLabel,
+    label,
+    textAlign
+  } = useProperties();
+  const align = textAlign ? textAlign : mode === "large" ? "center" : "right";
+  const iconSizePx = iconSize === "large" ? "64" : "48";
+  const activationOptions = {
+    apiNotificationPriorityBy: "contacts"
+  };
+  if (mode === "compact") {
+    return /* @__PURE__ */ React.createElement(CompactWrapper, __spreadProps(__spreadValues({}, other), {
+      className: appendClassNames(className, "humany-contact-link", "humany-contact-link-compact"),
+      textAlign: align
+    }), descriptionLabel && /* @__PURE__ */ React.createElement(Text, null, descriptionLabel), route ? /* @__PURE__ */ React.createElement(Link, {
+      routeName: route
+    }, label) : /* @__PURE__ */ React.createElement(WidgetLink, {
+      "aria-haspopup": "dialog",
+      role: "button",
+      activationOptions,
+      widgetName: widget
+    }, label));
+  }
+  const children = /* @__PURE__ */ React.createElement(React.Fragment, null, symbol ? /* @__PURE__ */ React.createElement(SymbolBadge, {
+    symbol
+  }) : /* @__PURE__ */ React.createElement(ContactIcon, {
+    width: iconSizePx,
+    viewBox: "0 0 63 37",
+    fill: "none",
+    xmlns: "http://www.w3.org/2000/svg"
+  }, /* @__PURE__ */ React.createElement("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"
+  })), label && /* @__PURE__ */ React.createElement(Heading, null, label), descriptionLabel && /* @__PURE__ */ React.createElement(Description, null, descriptionLabel));
+  return route ? /* @__PURE__ */ React.createElement(StyledLink, __spreadProps(__spreadValues({}, other), {
+    className: appendClassNames(className, "humany-contact-link", "humany-contact-link-large"),
+    routeName: route
+  }), children) : /* @__PURE__ */ React.createElement(StyledWidgetLink, __spreadProps(__spreadValues({}, other), {
+    "aria-haspopup": "dialog",
+    role: "button",
+    className: appendClassNames(className, "humany-contact-link", "humany-contact-link-large"),
+    textAlign: align,
+    widgetName: widget,
+    activationOptions
+  }), children);
+};
+const CompactWrapper = styled.div`
+    text-align: ${(p) => p.textAlign};
+    font-weight: 300;
+
+    span,
+    a {
+        display: inline-block;
+        font-size: ${(p) => {
+  var _a;
+  return (_a = p.theme.fonts) == null ? void 0 : _a.normal;
+}};
+    }
+
+    span {
+        margin: 0 ${(p) => {
+  var _a;
+  return (_a = p.theme.sizes) == null ? void 0 : _a.small;
+}} 0 0;
+    }
+    a {
+        text-decoration: underline;
+        color: ${(p) => {
+  var _a;
+  return (_a = p.theme.colors) == null ? void 0 : _a.primary;
+}};
+        &:focus {
+            ${(p) => {
+  var _a;
+  return ((_a = p.theme.accessibility) == null ? void 0 : _a.isTabbing) && css`
+                    ${linkTabStyle}
+                    padding: ${(p2) => {
+    var _a2, _b;
+    return `calc(${(_a2 = p2.theme.sizes) == null ? void 0 : _a2.small} / 2) ${(_b = p2.theme.sizes) == null ? void 0 : _b.small}`;
+  }};
+                `;
+}};
+        }
+    }
+`;
+const styling = css`
+    ${contentBox}
+    padding: ${(p) => {
+  var _a;
+  return (_a = p.theme.sizes) == null ? void 0 : _a.large;
+}};
+    text-align: center;
+    cursor: pointer;
+    text-decoration: none;
+    i {
+        font-size: ${(p) => {
+  var _a;
+  return (_a = p.theme.fonts) == null ? void 0 : _a.huge;
+}};
+        min-width: 1em;
+        min-height: 1em;
+        color: ${(p) => {
+  var _a;
+  return (_a = p.theme.colors) == null ? void 0 : _a.primary;
+}};
+    }
+    span {
+        color: ${(p) => {
+  var _a;
+  return (_a = p.theme.colors) == null ? void 0 : _a.text;
+}};
+    }
+    &:focus {
+        ${(p) => {
+  var _a;
+  return ((_a = p.theme.accessibility) == null ? void 0 : _a.isTabbing) && borderTabStyle;
+}};
+    }
+`;
+const StyledWidgetLink = styled(WidgetLink)`
+    ${styling}
+    text-align: ${(p) => p.textAlign};
+`;
+const StyledLink = styled(Link)`
+    ${styling}
+`;
+const Description = styled(Text)`
+    line-height: 1.6em;
+    font-weight: 300;
+    font-size: ${(p) => {
+  var _a;
+  return (_a = p.theme.fonts) == null ? void 0 : _a.normal;
+}};
+`;
+const Heading = styled(Text)`
+    display: block;
+    font-size: ${(p) => {
+  var _a;
+  return (_a = p.theme.fonts) == null ? void 0 : _a.medium;
+}};
+    margin: ${(p) => {
+  var _a;
+  return (_a = p.theme.sizes) == null ? void 0 : _a.normal;
+}} 0;
+`;
+const ContactIcon = styled.svg`
+    align-self: center;
+
+    path {
+        vector-effect: non-scaling-stroke;
+        stroke: ${(p) => {
+  var _a;
+  return (_a = p.theme.colors) == null ? void 0 : _a.primary;
+}};
+    }
+`;
+export { ContactLink as default };
+//# sourceMappingURL=contact-link.js.map

package/dist/contact-link.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"contact-link.js","sources":["../src/contact-link.tsx"],"sourcesContent":["import {\r\n    borderTabStyle,\r\n    contentBox,\r\n    Link,\r\n    linkTabStyle,\r\n    SymbolBadge,\r\n    Text,\r\n    useProperties,\r\n    WidgetLink,\r\n} from '@telia-ace/knowledge-widget-ui';\r\nimport { appendClassNames } from '@telia-ace/widget-utilities';\r\nimport React from 'react';\r\nimport styled, { css } from 'styled-components';\r\nimport { ContactLinkComponentProps } from './contact-link-component';\r\n\r\ntype Props = {\r\n    className: string;\r\n};\r\n\r\nconst ContactLink: React.FC<Props> = ({ className, ...other }) => {\r\n    const {\r\n        widget,\r\n        route,\r\n        mode = 'large',\r\n        iconSize = 'large',\r\n        symbol,\r\n        descriptionLabel,\r\n        label,\r\n        textAlign,\r\n    } = useProperties<ContactLinkComponentProps>();\r\n\r\n    const align = textAlign ? textAlign : mode === 'large' ? 'center' : 'right';\r\n    const iconSizePx = iconSize === 'large' ? '64' : '48';\r\n    const activationOptions = {\r\n        apiNotificationPriorityBy: 'contacts',\r\n    };\r\n\r\n    if (mode === 'compact') {\r\n        return (\r\n            <CompactWrapper\r\n                {...other}\r\n                className={appendClassNames(\r\n                    className,\r\n                    'humany-contact-link',\r\n                    'humany-contact-link-compact'\r\n                )}\r\n                textAlign={align}\r\n            >\r\n                {descriptionLabel && <Text>{descriptionLabel}</Text>}\r\n                {route ? (\r\n                    <Link routeName={route}>{label}</Link>\r\n                ) : (\r\n                    <WidgetLink\r\n                        aria-haspopup=\"dialog\"\r\n                        role=\"button\"\r\n                        activationOptions={activationOptions}\r\n                        widgetName={widget}\r\n                    >\r\n                        {label}\r\n                    </WidgetLink>\r\n                )}\r\n            </CompactWrapper>\r\n        );\r\n    }\r\n\r\n    const children = (\r\n        <>\r\n            {symbol ? (\r\n                <SymbolBadge symbol={symbol} />\r\n            ) : (\r\n                <ContactIcon\r\n                    width={iconSizePx}\r\n                    viewBox=\"0 0 63 37\"\r\n                    fill=\"none\"\r\n                    xmlns=\"http://www.w3.org/2000/svg\"\r\n                >\r\n                    <path\r\n                        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\"\r\n                        stroke=\"#990AE3\"\r\n                    />\r\n                </ContactIcon>\r\n            )}\r\n            {label && <Heading>{label}</Heading>}\r\n            {descriptionLabel && <Description>{descriptionLabel}</Description>}\r\n        </>\r\n    );\r\n\r\n    return route ? (\r\n        <StyledLink\r\n            {...other}\r\n            className={appendClassNames(\r\n                className,\r\n                'humany-contact-link',\r\n                'humany-contact-link-large'\r\n            )}\r\n            routeName={route}\r\n        >\r\n            {children}\r\n        </StyledLink>\r\n    ) : (\r\n        <StyledWidgetLink\r\n            {...other}\r\n            aria-haspopup=\"dialog\"\r\n            role=\"button\"\r\n            className={appendClassNames(\r\n                className,\r\n                'humany-contact-link',\r\n                'humany-contact-link-large'\r\n            )}\r\n            textAlign={align}\r\n            widgetName={widget}\r\n            activationOptions={activationOptions}\r\n        >\r\n            {children}\r\n        </StyledWidgetLink>\r\n    );\r\n};\r\n\r\nconst CompactWrapper = styled.div<{ textAlign: string } & any>`\r\n    text-align: ${(p) => p.textAlign};\r\n    font-weight: 300;\r\n\r\n    span,\r\n    a {\r\n        display: inline-block;\r\n        font-size: ${(p) => p.theme.fonts?.normal};\r\n    }\r\n\r\n    span {\r\n        margin: 0 ${(p) => p.theme.sizes?.small} 0 0;\r\n    }\r\n    a {\r\n        text-decoration: underline;\r\n        color: ${(p) => p.theme.colors?.primary};\r\n        &:focus {\r\n            ${(p) =>\r\n                p.theme.accessibility?.isTabbing &&\r\n                css`\r\n                    ${linkTabStyle}\r\n                    padding: ${(p) => `calc(${p.theme.sizes?.small} / 2) ${p.theme.sizes?.small}`};\r\n                `};\r\n        }\r\n    }\r\n`;\r\n\r\nconst styling = css`\r\n    ${contentBox}\r\n    padding: ${(p) => p.theme.sizes?.large};\r\n    text-align: center;\r\n    cursor: pointer;\r\n    text-decoration: none;\r\n    i {\r\n        font-size: ${(p) => p.theme.fonts?.huge};\r\n        min-width: 1em;\r\n        min-height: 1em;\r\n        color: ${(p) => p.theme.colors?.primary};\r\n    }\r\n    span {\r\n        color: ${(p) => p.theme.colors?.text};\r\n    }\r\n    &:focus {\r\n        ${(p) => p.theme.accessibility?.isTabbing && borderTabStyle};\r\n    }\r\n`;\r\n\r\nconst StyledWidgetLink = styled(WidgetLink)<any>`\r\n    ${styling}\r\n    text-align: ${(p) => p.textAlign};\r\n`;\r\n\r\nconst StyledLink = styled(Link)<any>`\r\n    ${styling}\r\n`;\r\n\r\nconst Description = styled(Text)`\r\n    line-height: 1.6em;\r\n    font-weight: 300;\r\n    font-size: ${(p) => p.theme.fonts?.normal};\r\n`;\r\n\r\nconst Heading = styled(Text)`\r\n    display: block;\r\n    font-size: ${(p) => p.theme.fonts?.medium};\r\n    margin: ${(p) => p.theme.sizes?.normal} 0;\r\n`;\r\n\r\nconst ContactIcon = styled.svg`\r\n    align-self: center;\r\n\r\n    path {\r\n        vector-effect: non-scaling-stroke;\r\n        stroke: ${(p) => p.theme.colors?.primary};\r\n    }\r\n`;\r\n\r\nexport default ContactLink;\r\n"],"names":[],"mappings":"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"}

package/dist/index.js

@@ -0,0 +1,6 @@
+import { createReactComponent } from "@telia-ace/knowledge-widget-ui";
+const ContactLinkComponent = (container) => {
+  return createReactComponent(container, "contact-link", import("./contact-link.js"));
+};
+export { ContactLinkComponent as default };
+//# sourceMappingURL=index.js.map

package/dist/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sources":["../src/contact-link-component.ts"],"sourcesContent":["import { Symbol } from '@telia-ace/knowledge-widget-core';\r\nimport { createReactComponent } from '@telia-ace/knowledge-widget-ui';\r\nimport { Container } from '@webprovisions/platform';\r\n\r\nexport type ContactLinkComponentProps = {\r\n    widget: string;\r\n    route: string;\r\n    mode: 'large' | 'compact';\r\n    iconSize: 'large' | 'small';\r\n    symbol?: Symbol;\r\n    label: string;\r\n    descriptionLabel: string;\r\n    textAlign: string;\r\n};\r\n\r\nconst ContactLinkComponent = (container: Container) => {\r\n    return createReactComponent(container, 'contact-link', import('./contact-link'));\r\n};\r\n\r\nexport default ContactLinkComponent;\r\n"],"names":[],"mappings":";AAeM,MAAA,uBAAuB,CAAC,cAAyB;AACnD,SAAO,qBAAqB,WAAW,gBAAgB,OAAO,oBAAiB;AACnF;;"}

package/package.json

@@ -1,33 +1,32 @@
 {
     "name": "@telia-ace/knowledge-widget-components-contact-link",
-    "version": "1.0.6",
+    "version": "1.0.11",
     "description": "Contact link component for ACE Knowledge Widgets.",
     "license": "SEE LICENSE IN LICENSE.txt",
     "author": "Telia Company AB",
     "keywords": [
         "telia"
     ],
-    "main": "lib/index.js",
-    "module": "lib-esm/index.js",
+    "module": "dist/index.js",
+    "types": "dist/index.d.ts",
     "files": [
         "LICENSE.txt",
         "README.md",
-        "lib/",
-        "lib-esm/"
+        "dist/"
     ],
     "publishConfig": {
         "access": "public"
     },
     "scripts": {
-        "clean": "cleandir lib && cleandir lib-esm",
-        "compile": "tsc -p tsconfig.cjs.json && tsc -p tsconfig.esm.json"
+        "clean": "rimraf ./dist",
+        "precompile": "tsc -emitDeclarationOnly",
+        "compile": "vite build"
     },
     "sideEffects": false,
-    "typings": "lib/index.d.ts",
     "dependencies": {
-        "@telia-ace/knowledge-widget-core": "^1.0.6",
-        "@telia-ace/knowledge-widget-ui": "^1.0.10",
-        "@telia-ace/widget-utilities": "^1.0.1",
+        "@telia-ace/knowledge-widget-core": "^1.0.10",
+        "@telia-ace/knowledge-widget-ui": "^1.0.14",
+        "@telia-ace/widget-utilities": "^1.0.2",
         "@webprovisions/platform": "^1.1.2"
     },
     "peerDependencies": {
@@ -40,5 +39,5 @@
         "@types/react-dom": "^16.8.0",
         "@types/styled-components": "^5.1.7"
     },
-    "gitHead": "141db586e3989e54f2671aa2079c62a250a00557"
+    "gitHead": "3821c16ef534210308ecca6b2e16d098ddde37a4"
 }

package/lib/contact-link-component.d.ts

@@ -1,14 +0,0 @@
-import { Symbol } from '@telia-ace/knowledge-widget-core';
-import { Container } from '@webprovisions/platform';
-export declare type ContactLinkComponentProps = {
-    widget: string;
-    route: string;
-    mode: 'large' | 'compact';
-    iconSize: 'large' | 'small';
-    symbol?: Symbol;
-    label: string;
-    descriptionLabel: string;
-    textAlign: string;
-};
-declare const ContactLinkComponent: (container: Container) => Promise<void>;
-export default ContactLinkComponent;

package/lib/contact-link-component.js

@@ -1,30 +0,0 @@
-"use strict";
-var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
-    if (k2 === undefined) k2 = k;
-    var desc = Object.getOwnPropertyDescriptor(m, k);
-    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
-      desc = { enumerable: true, get: function() { return m[k]; } };
-    }
-    Object.defineProperty(o, k2, desc);
-}) : (function(o, m, k, k2) {
-    if (k2 === undefined) k2 = k;
-    o[k2] = m[k];
-}));
-var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
-    Object.defineProperty(o, "default", { enumerable: true, value: v });
-}) : function(o, v) {
-    o["default"] = v;
-});
-var __importStar = (this && this.__importStar) || function (mod) {
-    if (mod && mod.__esModule) return mod;
-    var result = {};
-    if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
-    __setModuleDefault(result, mod);
-    return result;
-};
-Object.defineProperty(exports, "__esModule", { value: true });
-var knowledge_widget_ui_1 = require("@telia-ace/knowledge-widget-ui");
-var ContactLinkComponent = function (container) {
-    return (0, knowledge_widget_ui_1.createReactComponent)(container, 'contact-link', Promise.resolve().then(function () { return __importStar(require('./contact-link')); }));
-};
-exports.default = ContactLinkComponent;

package/lib/contact-link.d.ts

@@ -1,6 +0,0 @@
-import React from 'react';
-declare type Props = {
-    className: string;
-};
-declare const ContactLink: React.FC<Props>;
-export default ContactLink;

package/lib/contact-link.js

@@ -1,90 +0,0 @@
-"use strict";
-var __makeTemplateObject = (this && this.__makeTemplateObject) || function (cooked, raw) {
-    if (Object.defineProperty) { Object.defineProperty(cooked, "raw", { value: raw }); } else { cooked.raw = raw; }
-    return cooked;
-};
-var __assign = (this && this.__assign) || function () {
-    __assign = Object.assign || function(t) {
-        for (var s, i = 1, n = arguments.length; i < n; i++) {
-            s = arguments[i];
-            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
-                t[p] = s[p];
-        }
-        return t;
-    };
-    return __assign.apply(this, arguments);
-};
-var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
-    if (k2 === undefined) k2 = k;
-    var desc = Object.getOwnPropertyDescriptor(m, k);
-    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
-      desc = { enumerable: true, get: function() { return m[k]; } };
-    }
-    Object.defineProperty(o, k2, desc);
-}) : (function(o, m, k, k2) {
-    if (k2 === undefined) k2 = k;
-    o[k2] = m[k];
-}));
-var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
-    Object.defineProperty(o, "default", { enumerable: true, value: v });
-}) : function(o, v) {
-    o["default"] = v;
-});
-var __importStar = (this && this.__importStar) || function (mod) {
-    if (mod && mod.__esModule) return mod;
-    var result = {};
-    if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
-    __setModuleDefault(result, mod);
-    return result;
-};
-var __rest = (this && this.__rest) || function (s, e) {
-    var t = {};
-    for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
-        t[p] = s[p];
-    if (s != null && typeof Object.getOwnPropertySymbols === "function")
-        for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
-            if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
-                t[p[i]] = s[p[i]];
-        }
-    return t;
-};
-var __importDefault = (this && this.__importDefault) || function (mod) {
-    return (mod && mod.__esModule) ? mod : { "default": mod };
-};
-Object.defineProperty(exports, "__esModule", { value: true });
-var knowledge_widget_ui_1 = require("@telia-ace/knowledge-widget-ui");
-var widget_utilities_1 = require("@telia-ace/widget-utilities");
-var react_1 = __importDefault(require("react"));
-var styled_components_1 = __importStar(require("styled-components"));
-var ContactLink = function (_a) {
-    var className = _a.className, other = __rest(_a, ["className"]);
-    var _b = (0, knowledge_widget_ui_1.useProperties)(), widget = _b.widget, route = _b.route, _c = _b.mode, mode = _c === void 0 ? 'large' : _c, _d = _b.iconSize, iconSize = _d === void 0 ? 'large' : _d, symbol = _b.symbol, descriptionLabel = _b.descriptionLabel, label = _b.label, textAlign = _b.textAlign;
-    var align = textAlign ? textAlign : mode === 'large' ? 'center' : 'right';
-    var iconSizePx = iconSize === 'large' ? '64' : '48';
-    var activationOptions = {
-        apiNotificationPriorityBy: 'contacts',
-    };
-    if (mode === 'compact') {
-        return (react_1.default.createElement(CompactWrapper, __assign({}, other, { className: (0, widget_utilities_1.appendClassNames)(className, 'humany-contact-link', 'humany-contact-link-compact'), textAlign: align }),
-            descriptionLabel && react_1.default.createElement(knowledge_widget_ui_1.Text, null, descriptionLabel),
-            route ? (react_1.default.createElement(knowledge_widget_ui_1.Link, { routeName: route }, label)) : (react_1.default.createElement(knowledge_widget_ui_1.WidgetLink, { "aria-haspopup": "dialog", role: "button", activationOptions: activationOptions, widgetName: widget }, label))));
-    }
-    var children = (react_1.default.createElement(react_1.default.Fragment, null,
-        symbol ? (react_1.default.createElement(knowledge_widget_ui_1.SymbolBadge, { symbol: symbol })) : (react_1.default.createElement(ContactIcon, { width: iconSizePx, viewBox: "0 0 63 37", fill: "none", xmlns: "http://www.w3.org/2000/svg" },
-            react_1.default.createElement("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" }))),
-        label && react_1.default.createElement(Heading, null, label),
-        descriptionLabel && react_1.default.createElement(Description, null, descriptionLabel)));
-    return route ? (react_1.default.createElement(StyledLink, __assign({}, other, { className: (0, widget_utilities_1.appendClassNames)(className, 'humany-contact-link', 'humany-contact-link-large'), routeName: route }), children)) : (react_1.default.createElement(StyledWidgetLink, __assign({}, other, { "aria-haspopup": "dialog", role: "button", className: (0, widget_utilities_1.appendClassNames)(className, 'humany-contact-link', 'humany-contact-link-large'), textAlign: align, widgetName: widget, activationOptions: activationOptions }), children));
-};
-var CompactWrapper = styled_components_1.default.div(templateObject_2 || (templateObject_2 = __makeTemplateObject(["\n    text-align: ", ";\n    font-weight: 300;\n\n    span,\n    a {\n        display: inline-block;\n        font-size: ", ";\n    }\n\n    span {\n        margin: 0 ", " 0 0;\n    }\n    a {\n        text-decoration: underline;\n        color: ", ";\n        &:focus {\n            ", ";\n        }\n    }\n"], ["\n    text-align: ", ";\n    font-weight: 300;\n\n    span,\n    a {\n        display: inline-block;\n        font-size: ", ";\n    }\n\n    span {\n        margin: 0 ", " 0 0;\n    }\n    a {\n        text-decoration: underline;\n        color: ", ";\n        &:focus {\n            ", ";\n        }\n    }\n"])), function (p) { return p.textAlign; }, function (p) { var _a; return (_a = p.theme.fonts) === null || _a === void 0 ? void 0 : _a.normal; }, function (p) { var _a; return (_a = p.theme.sizes) === null || _a === void 0 ? void 0 : _a.small; }, function (p) { var _a; return (_a = p.theme.colors) === null || _a === void 0 ? void 0 : _a.primary; }, function (p) {
-    var _a;
-    return ((_a = p.theme.accessibility) === null || _a === void 0 ? void 0 : _a.isTabbing) && (0, styled_components_1.css)(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n                    ", "\n                    padding: ", ";\n                "], ["\n                    ", "\n                    padding: ", ";\n                "])), knowledge_widget_ui_1.linkTabStyle, function (p) { var _a, _b; return "calc(".concat((_a = p.theme.sizes) === null || _a === void 0 ? void 0 : _a.small, " / 2) ").concat((_b = p.theme.sizes) === null || _b === void 0 ? void 0 : _b.small); });
-});
-var styling = (0, styled_components_1.css)(templateObject_3 || (templateObject_3 = __makeTemplateObject(["\n    ", "\n    padding: ", ";\n    text-align: center;\n    cursor: pointer;\n    text-decoration: none;\n    i {\n        font-size: ", ";\n        min-width: 1em;\n        min-height: 1em;\n        color: ", ";\n    }\n    span {\n        color: ", ";\n    }\n    &:focus {\n        ", ";\n    }\n"], ["\n    ", "\n    padding: ", ";\n    text-align: center;\n    cursor: pointer;\n    text-decoration: none;\n    i {\n        font-size: ", ";\n        min-width: 1em;\n        min-height: 1em;\n        color: ", ";\n    }\n    span {\n        color: ", ";\n    }\n    &:focus {\n        ", ";\n    }\n"])), knowledge_widget_ui_1.contentBox, function (p) { var _a; return (_a = p.theme.sizes) === null || _a === void 0 ? void 0 : _a.large; }, function (p) { var _a; return (_a = p.theme.fonts) === null || _a === void 0 ? void 0 : _a.huge; }, function (p) { var _a; return (_a = p.theme.colors) === null || _a === void 0 ? void 0 : _a.primary; }, function (p) { var _a; return (_a = p.theme.colors) === null || _a === void 0 ? void 0 : _a.text; }, function (p) { var _a; return ((_a = p.theme.accessibility) === null || _a === void 0 ? void 0 : _a.isTabbing) && knowledge_widget_ui_1.borderTabStyle; });
-var StyledWidgetLink = (0, styled_components_1.default)(knowledge_widget_ui_1.WidgetLink)(templateObject_4 || (templateObject_4 = __makeTemplateObject(["\n    ", "\n    text-align: ", ";\n"], ["\n    ", "\n    text-align: ", ";\n"])), styling, function (p) { return p.textAlign; });
-var StyledLink = (0, styled_components_1.default)(knowledge_widget_ui_1.Link)(templateObject_5 || (templateObject_5 = __makeTemplateObject(["\n    ", "\n"], ["\n    ", "\n"])), styling);
-var Description = (0, styled_components_1.default)(knowledge_widget_ui_1.Text)(templateObject_6 || (templateObject_6 = __makeTemplateObject(["\n    line-height: 1.6em;\n    font-weight: 300;\n    font-size: ", ";\n"], ["\n    line-height: 1.6em;\n    font-weight: 300;\n    font-size: ", ";\n"])), function (p) { var _a; return (_a = p.theme.fonts) === null || _a === void 0 ? void 0 : _a.normal; });
-var Heading = (0, styled_components_1.default)(knowledge_widget_ui_1.Text)(templateObject_7 || (templateObject_7 = __makeTemplateObject(["\n    display: block;\n    font-size: ", ";\n    margin: ", " 0;\n"], ["\n    display: block;\n    font-size: ", ";\n    margin: ", " 0;\n"])), function (p) { var _a; return (_a = p.theme.fonts) === null || _a === void 0 ? void 0 : _a.medium; }, function (p) { var _a; return (_a = p.theme.sizes) === null || _a === void 0 ? void 0 : _a.normal; });
-var ContactIcon = styled_components_1.default.svg(templateObject_8 || (templateObject_8 = __makeTemplateObject(["\n    align-self: center;\n\n    path {\n        vector-effect: non-scaling-stroke;\n        stroke: ", ";\n    }\n"], ["\n    align-self: center;\n\n    path {\n        vector-effect: non-scaling-stroke;\n        stroke: ", ";\n    }\n"])), function (p) { var _a; return (_a = p.theme.colors) === null || _a === void 0 ? void 0 : _a.primary; });
-exports.default = ContactLink;
-var templateObject_1, templateObject_2, templateObject_3, templateObject_4, templateObject_5, templateObject_6, templateObject_7, templateObject_8;

package/lib/index.d.ts

@@ -1,2 +0,0 @@
-import ContactLinkComponent from './contact-link-component';
-export default ContactLinkComponent;

package/lib/index.js

@@ -1,7 +0,0 @@
-"use strict";
-var __importDefault = (this && this.__importDefault) || function (mod) {
-    return (mod && mod.__esModule) ? mod : { "default": mod };
-};
-Object.defineProperty(exports, "__esModule", { value: true });
-var contact_link_component_1 = __importDefault(require("./contact-link-component"));
-exports.default = contact_link_component_1.default;

package/lib-esm/contact-link-component.js

@@ -1,5 +0,0 @@
-import { createReactComponent } from '@telia-ace/knowledge-widget-ui';
-var ContactLinkComponent = function (container) {
-    return createReactComponent(container, 'contact-link', import('./contact-link'));
-};
-export default ContactLinkComponent;

package/lib-esm/contact-link.js

@@ -1,62 +0,0 @@
-var __makeTemplateObject = (this && this.__makeTemplateObject) || function (cooked, raw) {
-    if (Object.defineProperty) { Object.defineProperty(cooked, "raw", { value: raw }); } else { cooked.raw = raw; }
-    return cooked;
-};
-var __assign = (this && this.__assign) || function () {
-    __assign = Object.assign || function(t) {
-        for (var s, i = 1, n = arguments.length; i < n; i++) {
-            s = arguments[i];
-            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
-                t[p] = s[p];
-        }
-        return t;
-    };
-    return __assign.apply(this, arguments);
-};
-var __rest = (this && this.__rest) || function (s, e) {
-    var t = {};
-    for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
-        t[p] = s[p];
-    if (s != null && typeof Object.getOwnPropertySymbols === "function")
-        for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
-            if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
-                t[p[i]] = s[p[i]];
-        }
-    return t;
-};
-import { borderTabStyle, contentBox, Link, linkTabStyle, SymbolBadge, Text, useProperties, WidgetLink, } from '@telia-ace/knowledge-widget-ui';
-import { appendClassNames } from '@telia-ace/widget-utilities';
-import React from 'react';
-import styled, { css } from 'styled-components';
-var ContactLink = function (_a) {
-    var className = _a.className, other = __rest(_a, ["className"]);
-    var _b = useProperties(), widget = _b.widget, route = _b.route, _c = _b.mode, mode = _c === void 0 ? 'large' : _c, _d = _b.iconSize, iconSize = _d === void 0 ? 'large' : _d, symbol = _b.symbol, descriptionLabel = _b.descriptionLabel, label = _b.label, textAlign = _b.textAlign;
-    var align = textAlign ? textAlign : mode === 'large' ? 'center' : 'right';
-    var iconSizePx = iconSize === 'large' ? '64' : '48';
-    var activationOptions = {
-        apiNotificationPriorityBy: 'contacts',
-    };
-    if (mode === 'compact') {
-        return (React.createElement(CompactWrapper, __assign({}, other, { className: appendClassNames(className, 'humany-contact-link', 'humany-contact-link-compact'), textAlign: align }),
-            descriptionLabel && React.createElement(Text, null, descriptionLabel),
-            route ? (React.createElement(Link, { routeName: route }, label)) : (React.createElement(WidgetLink, { "aria-haspopup": "dialog", role: "button", activationOptions: activationOptions, widgetName: widget }, label))));
-    }
-    var children = (React.createElement(React.Fragment, null,
-        symbol ? (React.createElement(SymbolBadge, { symbol: symbol })) : (React.createElement(ContactIcon, { width: iconSizePx, viewBox: "0 0 63 37", fill: "none", xmlns: "http://www.w3.org/2000/svg" },
-            React.createElement("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" }))),
-        label && React.createElement(Heading, null, label),
-        descriptionLabel && React.createElement(Description, null, descriptionLabel)));
-    return route ? (React.createElement(StyledLink, __assign({}, other, { className: appendClassNames(className, 'humany-contact-link', 'humany-contact-link-large'), routeName: route }), children)) : (React.createElement(StyledWidgetLink, __assign({}, other, { "aria-haspopup": "dialog", role: "button", className: appendClassNames(className, 'humany-contact-link', 'humany-contact-link-large'), textAlign: align, widgetName: widget, activationOptions: activationOptions }), children));
-};
-var CompactWrapper = styled.div(templateObject_2 || (templateObject_2 = __makeTemplateObject(["\n    text-align: ", ";\n    font-weight: 300;\n\n    span,\n    a {\n        display: inline-block;\n        font-size: ", ";\n    }\n\n    span {\n        margin: 0 ", " 0 0;\n    }\n    a {\n        text-decoration: underline;\n        color: ", ";\n        &:focus {\n            ", ";\n        }\n    }\n"], ["\n    text-align: ", ";\n    font-weight: 300;\n\n    span,\n    a {\n        display: inline-block;\n        font-size: ", ";\n    }\n\n    span {\n        margin: 0 ", " 0 0;\n    }\n    a {\n        text-decoration: underline;\n        color: ", ";\n        &:focus {\n            ", ";\n        }\n    }\n"])), function (p) { return p.textAlign; }, function (p) { var _a; return (_a = p.theme.fonts) === null || _a === void 0 ? void 0 : _a.normal; }, function (p) { var _a; return (_a = p.theme.sizes) === null || _a === void 0 ? void 0 : _a.small; }, function (p) { var _a; return (_a = p.theme.colors) === null || _a === void 0 ? void 0 : _a.primary; }, function (p) {
-    var _a;
-    return ((_a = p.theme.accessibility) === null || _a === void 0 ? void 0 : _a.isTabbing) && css(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n                    ", "\n                    padding: ", ";\n                "], ["\n                    ", "\n                    padding: ", ";\n                "])), linkTabStyle, function (p) { var _a, _b; return "calc(".concat((_a = p.theme.sizes) === null || _a === void 0 ? void 0 : _a.small, " / 2) ").concat((_b = p.theme.sizes) === null || _b === void 0 ? void 0 : _b.small); });
-});
-var styling = css(templateObject_3 || (templateObject_3 = __makeTemplateObject(["\n    ", "\n    padding: ", ";\n    text-align: center;\n    cursor: pointer;\n    text-decoration: none;\n    i {\n        font-size: ", ";\n        min-width: 1em;\n        min-height: 1em;\n        color: ", ";\n    }\n    span {\n        color: ", ";\n    }\n    &:focus {\n        ", ";\n    }\n"], ["\n    ", "\n    padding: ", ";\n    text-align: center;\n    cursor: pointer;\n    text-decoration: none;\n    i {\n        font-size: ", ";\n        min-width: 1em;\n        min-height: 1em;\n        color: ", ";\n    }\n    span {\n        color: ", ";\n    }\n    &:focus {\n        ", ";\n    }\n"])), contentBox, function (p) { var _a; return (_a = p.theme.sizes) === null || _a === void 0 ? void 0 : _a.large; }, function (p) { var _a; return (_a = p.theme.fonts) === null || _a === void 0 ? void 0 : _a.huge; }, function (p) { var _a; return (_a = p.theme.colors) === null || _a === void 0 ? void 0 : _a.primary; }, function (p) { var _a; return (_a = p.theme.colors) === null || _a === void 0 ? void 0 : _a.text; }, function (p) { var _a; return ((_a = p.theme.accessibility) === null || _a === void 0 ? void 0 : _a.isTabbing) && borderTabStyle; });
-var StyledWidgetLink = styled(WidgetLink)(templateObject_4 || (templateObject_4 = __makeTemplateObject(["\n    ", "\n    text-align: ", ";\n"], ["\n    ", "\n    text-align: ", ";\n"])), styling, function (p) { return p.textAlign; });
-var StyledLink = styled(Link)(templateObject_5 || (templateObject_5 = __makeTemplateObject(["\n    ", "\n"], ["\n    ", "\n"])), styling);
-var Description = styled(Text)(templateObject_6 || (templateObject_6 = __makeTemplateObject(["\n    line-height: 1.6em;\n    font-weight: 300;\n    font-size: ", ";\n"], ["\n    line-height: 1.6em;\n    font-weight: 300;\n    font-size: ", ";\n"])), function (p) { var _a; return (_a = p.theme.fonts) === null || _a === void 0 ? void 0 : _a.normal; });
-var Heading = styled(Text)(templateObject_7 || (templateObject_7 = __makeTemplateObject(["\n    display: block;\n    font-size: ", ";\n    margin: ", " 0;\n"], ["\n    display: block;\n    font-size: ", ";\n    margin: ", " 0;\n"])), function (p) { var _a; return (_a = p.theme.fonts) === null || _a === void 0 ? void 0 : _a.medium; }, function (p) { var _a; return (_a = p.theme.sizes) === null || _a === void 0 ? void 0 : _a.normal; });
-var ContactIcon = styled.svg(templateObject_8 || (templateObject_8 = __makeTemplateObject(["\n    align-self: center;\n\n    path {\n        vector-effect: non-scaling-stroke;\n        stroke: ", ";\n    }\n"], ["\n    align-self: center;\n\n    path {\n        vector-effect: non-scaling-stroke;\n        stroke: ", ";\n    }\n"])), function (p) { var _a; return (_a = p.theme.colors) === null || _a === void 0 ? void 0 : _a.primary; });
-export default ContactLink;
-var templateObject_1, templateObject_2, templateObject_3, templateObject_4, templateObject_5, templateObject_6, templateObject_7, templateObject_8;

package/lib-esm/index.js

@@ -1,2 +0,0 @@
-import ContactLinkComponent from './contact-link-component';
-export default ContactLinkComponent;