@telia-ace/knowledge-widget-components-contact-link 1.0.22-next.1 → 1.0.22-next.3

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.
@@ -0,0 +1,177 @@
1
+ var A = Object.defineProperty, C = Object.defineProperties;
2
+ var B = Object.getOwnPropertyDescriptors;
3
+ var m = Object.getOwnPropertySymbols;
4
+ var E = Object.prototype.hasOwnProperty, w = Object.prototype.propertyIsEnumerable;
5
+ var b = (e, t, n) => t in e ? A(e, t, { enumerable: !0, configurable: !0, writable: !0, value: n }) : e[t] = n, g = (e, t) => {
6
+ for (var n in t || (t = {}))
7
+ E.call(t, n) && b(e, n, t[n]);
8
+ if (m)
9
+ for (var n of m(t))
10
+ w.call(t, n) && b(e, n, t[n]);
11
+ return e;
12
+ }, h = (e, t) => C(e, B(t));
13
+ var L = (e, t) => {
14
+ var n = {};
15
+ for (var o in e)
16
+ E.call(e, o) && t.indexOf(o) < 0 && (n[o] = e[o]);
17
+ if (e != null && m)
18
+ for (var o of m(e))
19
+ t.indexOf(o) < 0 && w.call(e, o) && (n[o] = e[o]);
20
+ return n;
21
+ };
22
+ import { css as H } from "@emotion/react";
23
+ import a from "@emotion/styled";
24
+ import { useProperties as P, Text as p, Link as z, WidgetLink as M, SymbolBadge as T, linkTabStyle as W, contentBox as V, borderTabStyle as D } from "@telia-ace/knowledge-widget-ui";
25
+ import { appendClassNames as d } from "@telia-ace/widget-utilities";
26
+ import i from "react";
27
+ const Y = (n) => {
28
+ var o = n, { className: e } = o, t = L(o, ["className"]);
29
+ const {
30
+ widget: l,
31
+ route: r,
32
+ mode: u = "large",
33
+ iconSize: N = "large",
34
+ symbol: f,
35
+ descriptionLabel: c,
36
+ label: s,
37
+ textAlign: y
38
+ } = P(), $ = y || (u === "large" ? "center" : "right"), S = N === "large" ? "64" : "48", k = {
39
+ apiNotificationPriorityBy: "contacts"
40
+ };
41
+ if (u === "compact")
42
+ return /* @__PURE__ */ i.createElement(F, h(g({}, t), {
43
+ className: d(
44
+ e,
45
+ "humany-contact-link",
46
+ "humany-contact-link-compact"
47
+ ),
48
+ textAlign: $
49
+ }), c && /* @__PURE__ */ i.createElement(p, null, c), r ? /* @__PURE__ */ i.createElement(z, {
50
+ routeName: r
51
+ }, s) : /* @__PURE__ */ i.createElement(M, {
52
+ "aria-haspopup": "dialog",
53
+ role: "button",
54
+ activationOptions: k,
55
+ widgetName: l
56
+ }, s));
57
+ const x = /* @__PURE__ */ i.createElement(i.Fragment, null, f ? /* @__PURE__ */ i.createElement(T, {
58
+ symbol: f
59
+ }) : /* @__PURE__ */ i.createElement(q, {
60
+ width: S,
61
+ viewBox: "0 0 63 37",
62
+ fill: "none",
63
+ xmlns: "http://www.w3.org/2000/svg"
64
+ }, /* @__PURE__ */ i.createElement("path", {
65
+ 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",
66
+ stroke: "#990AE3"
67
+ })), s && /* @__PURE__ */ i.createElement(j, null, s), c && /* @__PURE__ */ i.createElement(R, null, c));
68
+ return r ? /* @__PURE__ */ i.createElement(O, h(g({}, t), {
69
+ className: d(
70
+ e,
71
+ "humany-contact-link",
72
+ "humany-contact-link-large"
73
+ ),
74
+ routeName: r
75
+ }), x) : /* @__PURE__ */ i.createElement(I, h(g({}, t), {
76
+ "aria-haspopup": "dialog",
77
+ role: "button",
78
+ className: d(
79
+ e,
80
+ "humany-contact-link",
81
+ "humany-contact-link-large"
82
+ ),
83
+ textAlign: $,
84
+ widgetName: l,
85
+ activationOptions: k
86
+ }), x);
87
+ }, F = a.div`
88
+ text-align: ${(e) => e.textAlign};
89
+ font-weight: 300;
90
+
91
+ span,
92
+ a {
93
+ display: inline-block;
94
+ font-size: ${(e) => {
95
+ var t;
96
+ return (t = e.theme.fonts) == null ? void 0 : t.normal;
97
+ }};
98
+ }
99
+
100
+ span {
101
+ margin: 0 ${(e) => {
102
+ var t;
103
+ return (t = e.theme.sizes) == null ? void 0 : t.small;
104
+ }} 0 0;
105
+ }
106
+ a {
107
+ text-decoration: underline;
108
+ color: ${(e) => {
109
+ var t;
110
+ return (t = e.theme.colors) == null ? void 0 : t.primary;
111
+ }};
112
+ &:focus-visible {
113
+ ${W}
114
+ padding: ${(e) => {
115
+ var t, n;
116
+ return `calc(${(t = e.theme.sizes) == null ? void 0 : t.small} / 2) ${(n = e.theme.sizes) == null ? void 0 : n.small}`;
117
+ }};
118
+ }
119
+ }
120
+ `, v = (e) => {
121
+ var t, n, o, l;
122
+ return H`
123
+ ${V(e)}
124
+ padding: ${(t = e.theme.sizes) == null ? void 0 : t.large};
125
+ text-align: center;
126
+ cursor: pointer;
127
+ text-decoration: none;
128
+ i {
129
+ font-size: ${(n = e.theme.fonts) == null ? void 0 : n.huge};
130
+ min-width: 1em;
131
+ min-height: 1em;
132
+ color: ${(o = e.theme.colors) == null ? void 0 : o.primary};
133
+ }
134
+ span {
135
+ color: ${(l = e.theme.colors) == null ? void 0 : l.text};
136
+ }
137
+ &:focus-visible {
138
+ ${D(e)};
139
+ }
140
+ `;
141
+ }, I = a(M)`
142
+ ${v}
143
+ text-align: ${(e) => e.textAlign};
144
+ `, O = a(z)`
145
+ ${v}
146
+ `, R = a(p)`
147
+ line-height: 1.6em;
148
+ font-weight: 300;
149
+ font-size: ${(e) => {
150
+ var t;
151
+ return (t = e.theme.fonts) == null ? void 0 : t.normal;
152
+ }};
153
+ `, j = a(p)`
154
+ display: block;
155
+ font-size: ${(e) => {
156
+ var t;
157
+ return (t = e.theme.fonts) == null ? void 0 : t.medium;
158
+ }};
159
+ margin: ${(e) => {
160
+ var t;
161
+ return (t = e.theme.sizes) == null ? void 0 : t.normal;
162
+ }} 0;
163
+ `, q = a.svg`
164
+ align-self: center;
165
+
166
+ path {
167
+ vector-effect: non-scaling-stroke;
168
+ stroke: ${(e) => {
169
+ var t;
170
+ return (t = e.theme.colors) == null ? void 0 : t.primary;
171
+ }};
172
+ }
173
+ `;
174
+ export {
175
+ Y as default
176
+ };
177
+ //# sourceMappingURL=contact-link.73e3a4d4.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"contact-link.73e3a4d4.js","sources":["../src/contact-link.tsx"],"sourcesContent":["import { css, Theme } from '@emotion/react';\nimport styled from '@emotion/styled';\nimport {\n borderTabStyle,\n contentBox,\n Link,\n linkTabStyle,\n SymbolBadge,\n Text,\n useProperties,\n WidgetLink,\n} from '@telia-ace/knowledge-widget-ui';\nimport { appendClassNames } from '@telia-ace/widget-utilities';\nimport React from 'react';\nimport { ContactLinkComponentProps } from './contact-link-component';\n\ntype Props = {\n className: string;\n};\n\nconst ContactLink: React.FC<Props> = ({ className, ...other }) => {\n const {\n widget,\n route,\n mode = 'large',\n iconSize = 'large',\n symbol,\n descriptionLabel,\n label,\n textAlign,\n } = useProperties<ContactLinkComponentProps>();\n\n const align = textAlign ? textAlign : mode === 'large' ? 'center' : 'right';\n const iconSizePx = iconSize === 'large' ? '64' : '48';\n const activationOptions = {\n apiNotificationPriorityBy: 'contacts',\n };\n\n if (mode === 'compact') {\n return (\n <CompactWrapper\n {...other}\n className={appendClassNames(\n className,\n 'humany-contact-link',\n 'humany-contact-link-compact'\n )}\n textAlign={align}\n >\n {descriptionLabel && <Text>{descriptionLabel}</Text>}\n {route ? (\n <Link routeName={route}>{label}</Link>\n ) : (\n <WidgetLink\n aria-haspopup=\"dialog\"\n role=\"button\"\n activationOptions={activationOptions}\n widgetName={widget}\n >\n {label}\n </WidgetLink>\n )}\n </CompactWrapper>\n );\n }\n\n const children = (\n <>\n {symbol ? (\n <SymbolBadge symbol={symbol} />\n ) : (\n <ContactIcon\n width={iconSizePx}\n viewBox=\"0 0 63 37\"\n fill=\"none\"\n xmlns=\"http://www.w3.org/2000/svg\"\n >\n <path\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\"\n stroke=\"#990AE3\"\n />\n </ContactIcon>\n )}\n {label && <Heading>{label}</Heading>}\n {descriptionLabel && <Description>{descriptionLabel}</Description>}\n </>\n );\n\n return route ? (\n <StyledLink\n {...other}\n className={appendClassNames(\n className,\n 'humany-contact-link',\n 'humany-contact-link-large'\n )}\n routeName={route}\n >\n {children}\n </StyledLink>\n ) : (\n <StyledWidgetLink\n {...other}\n aria-haspopup=\"dialog\"\n role=\"button\"\n className={appendClassNames(\n className,\n 'humany-contact-link',\n 'humany-contact-link-large'\n )}\n textAlign={align}\n widgetName={widget}\n activationOptions={activationOptions}\n >\n {children}\n </StyledWidgetLink>\n );\n};\n\nconst CompactWrapper = styled.div<{ textAlign: string } & any>`\n text-align: ${(p) => p.textAlign};\n font-weight: 300;\n\n span,\n a {\n display: inline-block;\n font-size: ${(p) => p.theme.fonts?.normal};\n }\n\n span {\n margin: 0 ${(p) => p.theme.sizes?.small} 0 0;\n }\n a {\n text-decoration: underline;\n color: ${(p) => p.theme.colors?.primary};\n &:focus-visible {\n ${linkTabStyle}\n padding: ${(p) => `calc(${p.theme.sizes?.small} / 2) ${p.theme.sizes?.small}`};\n }\n }\n`;\n\nconst styling = (p: { theme: Theme }) => css`\n ${contentBox(p)}\n padding: ${p.theme.sizes?.large};\n text-align: center;\n cursor: pointer;\n text-decoration: none;\n i {\n font-size: ${p.theme.fonts?.huge};\n min-width: 1em;\n min-height: 1em;\n color: ${p.theme.colors?.primary};\n }\n span {\n color: ${p.theme.colors?.text};\n }\n &:focus-visible {\n ${borderTabStyle(p)};\n }\n`;\n\nconst StyledWidgetLink = styled(WidgetLink)<any>`\n ${styling}\n text-align: ${(p) => p.textAlign};\n`;\n\nconst StyledLink = styled(Link)<any>`\n ${styling}\n`;\n\nconst Description = styled(Text)`\n line-height: 1.6em;\n font-weight: 300;\n font-size: ${(p) => p.theme.fonts?.normal};\n`;\n\nconst Heading = styled(Text)`\n display: block;\n font-size: ${(p) => p.theme.fonts?.medium};\n margin: ${(p) => p.theme.sizes?.normal} 0;\n`;\n\nconst ContactIcon = styled.svg`\n align-self: center;\n\n path {\n vector-effect: non-scaling-stroke;\n stroke: ${(p) => p.theme.colors?.primary};\n }\n`;\n\nexport default ContactLink;\n"],"names":["ContactLink","_a","_b","className","other","__objRest","widget","route","mode","iconSize","symbol","descriptionLabel","label","textAlign","useProperties","align","iconSizePx","activationOptions","React","CompactWrapper","__spreadProps","__spreadValues","appendClassNames","Text","Link","WidgetLink","children","SymbolBadge","ContactIcon","Heading","Description","StyledLink","StyledWidgetLink","styled","p","linkTabStyle","styling","css","contentBox","_c","_d","borderTabStyle"],"mappings":"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"}
package/dist/index.js CHANGED
@@ -1,6 +1,6 @@
1
- import { createReactComponent as o } from "@telia-ace/knowledge-widget-ui";
2
- const e = (t) => o(t, "contact-link", import("./contact-link.f31b21b6.js"));
1
+ import { createReactComponent as n } from "@telia-ace/knowledge-widget-ui";
2
+ const o = (t) => n(t, "contact-link", import("./contact-link.73e3a4d4.js")), c = o;
3
3
  export {
4
- e as default
4
+ c as default
5
5
  };
6
6
  //# sourceMappingURL=index.js.map
package/dist/index.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"index.js","sources":["../src/contact-link-component.ts"],"sourcesContent":["import { Symbol } from '@telia-ace/knowledge-widget-core';\nimport { createReactComponent } from '@telia-ace/knowledge-widget-ui';\nimport { Container } from '@webprovisions/platform';\n\nexport type ContactLinkComponentProps = {\n widget: string;\n route: string;\n mode: 'large' | 'compact';\n iconSize: 'large' | 'small';\n symbol?: Symbol;\n label: string;\n descriptionLabel: string;\n textAlign: string;\n};\n\nconst ContactLinkComponent = (container: Container) => {\n return createReactComponent(container, 'contact-link', import('./contact-link'));\n};\n\nexport default ContactLinkComponent;\n"],"names":["ContactLinkComponent","container","createReactComponent"],"mappings":";AAeM,MAAAA,IAAuB,CAACC,MACnBC,EAAqBD,GAAW,gBAAgB,OAAO,6BAAiB;"}
1
+ {"version":3,"file":"index.js","sources":["../src/contact-link-component.ts"],"sourcesContent":["import { Symbol } from '@telia-ace/knowledge-widget-core';\nimport { createReactComponent } from '@telia-ace/knowledge-widget-ui';\nimport { Container } from '@webprovisions/platform';\n\nexport type ContactLinkComponentProps = {\n widget: string;\n route: string;\n mode: 'large' | 'compact';\n iconSize: 'large' | 'small';\n symbol?: Symbol;\n label: string;\n descriptionLabel: string;\n textAlign: string;\n};\n\nconst ContactLinkComponent = (container: Container) => {\n return createReactComponent(container, 'contact-link', import('./contact-link'));\n};\n\nexport default ContactLinkComponent;\n"],"names":["ContactLinkComponent","container","createReactComponent","ContactLinkComponent$1"],"mappings":";AAeA,MAAMA,IAAuB,CAACC,MACnBC,EAAqBD,GAAW,gBAAgB,OAAO,6BAAiB,GAGnFE,IAAeH;"}
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@telia-ace/knowledge-widget-components-contact-link",
3
- "version": "1.0.22-next.1",
3
+ "version": "1.0.22-next.3",
4
4
  "description": "Contact link component for ACE Knowledge Widgets.",
5
5
  "license": "SEE LICENSE IN LICENSE.txt",
6
6
  "author": "Telia Company AB",
@@ -32,14 +32,18 @@
32
32
  "@webprovisions/platform": "^1.1.2"
33
33
  },
34
34
  "peerDependencies": {
35
+ "@emotion/react": "^11.10.4",
36
+ "@emotion/styled": "^11.10.4",
35
37
  "react": "^18.2.0",
36
- "react-dom": "^18.2.0",
37
- "styled-components": "^5.3.6"
38
+ "react-dom": "^18.2.0"
38
39
  },
39
40
  "devDependencies": {
41
+ "@emotion/react": "^11.10.4",
42
+ "@emotion/styled": "^11.10.4",
40
43
  "@types/react": "^18.0.21",
41
44
  "@types/react-dom": "^18.0.6",
42
- "@types/styled-components": "^5.1.26"
45
+ "react": "^18.2.0",
46
+ "react-dom": "^18.2.0"
43
47
  },
44
- "gitHead": "5e0d73a35737d0155516c218071710a8da165c07"
48
+ "gitHead": "035b7b89fbf7c736993d70e6dc4e420b8218a3a4"
45
49
  }
@@ -1,185 +0,0 @@
1
- var A = Object.defineProperty, C = Object.defineProperties;
2
- var B = Object.getOwnPropertyDescriptors;
3
- var s = Object.getOwnPropertySymbols;
4
- var E = Object.prototype.hasOwnProperty, w = Object.prototype.propertyIsEnumerable;
5
- var b = (t, e, n) => e in t ? A(t, e, { enumerable: !0, configurable: !0, writable: !0, value: n }) : t[e] = n, m = (t, e) => {
6
- for (var n in e || (e = {}))
7
- E.call(e, n) && b(t, n, e[n]);
8
- if (s)
9
- for (var n of s(e))
10
- w.call(e, n) && b(t, n, e[n]);
11
- return t;
12
- }, g = (t, e) => C(t, B(e));
13
- var L = (t, e) => {
14
- var n = {};
15
- for (var i in t)
16
- E.call(t, i) && e.indexOf(i) < 0 && (n[i] = t[i]);
17
- if (t != null && s)
18
- for (var i of s(t))
19
- e.indexOf(i) < 0 && w.call(t, i) && (n[i] = t[i]);
20
- return n;
21
- };
22
- import { useProperties as H, Text as h, Link as z, WidgetLink as M, SymbolBadge as P, linkTabStyle as T, contentBox as W, borderTabStyle as V } from "@telia-ace/knowledge-widget-ui";
23
- import { appendClassNames as p } from "@telia-ace/widget-utilities";
24
- import o from "react";
25
- import a, { css as D } from "styled-components";
26
- const X = (n) => {
27
- var i = n, { className: t } = i, e = L(i, ["className"]);
28
- const {
29
- widget: d,
30
- route: l,
31
- mode: u = "large",
32
- iconSize: N = "large",
33
- symbol: f,
34
- descriptionLabel: r,
35
- label: c,
36
- textAlign: y
37
- } = H(), $ = y || (u === "large" ? "center" : "right"), S = N === "large" ? "64" : "48", k = {
38
- apiNotificationPriorityBy: "contacts"
39
- };
40
- if (u === "compact")
41
- return /* @__PURE__ */ o.createElement(F, g(m({}, e), {
42
- className: p(
43
- t,
44
- "humany-contact-link",
45
- "humany-contact-link-compact"
46
- ),
47
- textAlign: $
48
- }), r && /* @__PURE__ */ o.createElement(h, null, r), l ? /* @__PURE__ */ o.createElement(z, {
49
- routeName: l
50
- }, c) : /* @__PURE__ */ o.createElement(M, {
51
- "aria-haspopup": "dialog",
52
- role: "button",
53
- activationOptions: k,
54
- widgetName: d
55
- }, c));
56
- const x = /* @__PURE__ */ o.createElement(o.Fragment, null, f ? /* @__PURE__ */ o.createElement(P, {
57
- symbol: f
58
- }) : /* @__PURE__ */ o.createElement(q, {
59
- width: S,
60
- viewBox: "0 0 63 37",
61
- fill: "none",
62
- xmlns: "http://www.w3.org/2000/svg"
63
- }, /* @__PURE__ */ o.createElement("path", {
64
- 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",
65
- stroke: "#990AE3"
66
- })), c && /* @__PURE__ */ o.createElement(j, null, c), r && /* @__PURE__ */ o.createElement(R, null, r));
67
- return l ? /* @__PURE__ */ o.createElement(O, g(m({}, e), {
68
- className: p(
69
- t,
70
- "humany-contact-link",
71
- "humany-contact-link-large"
72
- ),
73
- routeName: l
74
- }), x) : /* @__PURE__ */ o.createElement(I, g(m({}, e), {
75
- "aria-haspopup": "dialog",
76
- role: "button",
77
- className: p(
78
- t,
79
- "humany-contact-link",
80
- "humany-contact-link-large"
81
- ),
82
- textAlign: $,
83
- widgetName: d,
84
- activationOptions: k
85
- }), x);
86
- }, F = a.div`
87
- text-align: ${(t) => t.textAlign};
88
- font-weight: 300;
89
-
90
- span,
91
- a {
92
- display: inline-block;
93
- font-size: ${(t) => {
94
- var e;
95
- return (e = t.theme.fonts) == null ? void 0 : e.normal;
96
- }};
97
- }
98
-
99
- span {
100
- margin: 0 ${(t) => {
101
- var e;
102
- return (e = t.theme.sizes) == null ? void 0 : e.small;
103
- }} 0 0;
104
- }
105
- a {
106
- text-decoration: underline;
107
- color: ${(t) => {
108
- var e;
109
- return (e = t.theme.colors) == null ? void 0 : e.primary;
110
- }};
111
- &:focus-visible {
112
- ${T}
113
- padding: ${(t) => {
114
- var e, n;
115
- return `calc(${(e = t.theme.sizes) == null ? void 0 : e.small} / 2) ${(n = t.theme.sizes) == null ? void 0 : n.small}`;
116
- }};
117
- }
118
- }
119
- `, v = D`
120
- ${W}
121
- padding: ${(t) => {
122
- var e;
123
- return (e = t.theme.sizes) == null ? void 0 : e.large;
124
- }};
125
- text-align: center;
126
- cursor: pointer;
127
- text-decoration: none;
128
- i {
129
- font-size: ${(t) => {
130
- var e;
131
- return (e = t.theme.fonts) == null ? void 0 : e.huge;
132
- }};
133
- min-width: 1em;
134
- min-height: 1em;
135
- color: ${(t) => {
136
- var e;
137
- return (e = t.theme.colors) == null ? void 0 : e.primary;
138
- }};
139
- }
140
- span {
141
- color: ${(t) => {
142
- var e;
143
- return (e = t.theme.colors) == null ? void 0 : e.text;
144
- }};
145
- }
146
- &:focus-visible {
147
- ${V};
148
- }
149
- `, I = a(M)`
150
- ${v}
151
- text-align: ${(t) => t.textAlign};
152
- `, O = a(z)`
153
- ${v}
154
- `, R = a(h)`
155
- line-height: 1.6em;
156
- font-weight: 300;
157
- font-size: ${(t) => {
158
- var e;
159
- return (e = t.theme.fonts) == null ? void 0 : e.normal;
160
- }};
161
- `, j = a(h)`
162
- display: block;
163
- font-size: ${(t) => {
164
- var e;
165
- return (e = t.theme.fonts) == null ? void 0 : e.medium;
166
- }};
167
- margin: ${(t) => {
168
- var e;
169
- return (e = t.theme.sizes) == null ? void 0 : e.normal;
170
- }} 0;
171
- `, q = a.svg`
172
- align-self: center;
173
-
174
- path {
175
- vector-effect: non-scaling-stroke;
176
- stroke: ${(t) => {
177
- var e;
178
- return (e = t.theme.colors) == null ? void 0 : e.primary;
179
- }};
180
- }
181
- `;
182
- export {
183
- X as default
184
- };
185
- //# sourceMappingURL=contact-link.f31b21b6.js.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"contact-link.f31b21b6.js","sources":["../src/contact-link.tsx"],"sourcesContent":["import {\n borderTabStyle,\n contentBox,\n Link,\n linkTabStyle,\n SymbolBadge,\n Text,\n useProperties,\n WidgetLink,\n} from '@telia-ace/knowledge-widget-ui';\nimport { appendClassNames } from '@telia-ace/widget-utilities';\nimport React from 'react';\nimport styled, { css } from 'styled-components';\nimport { ContactLinkComponentProps } from './contact-link-component';\n\ntype Props = {\n className: string;\n};\n\nconst ContactLink: React.FC<Props> = ({ className, ...other }) => {\n const {\n widget,\n route,\n mode = 'large',\n iconSize = 'large',\n symbol,\n descriptionLabel,\n label,\n textAlign,\n } = useProperties<ContactLinkComponentProps>();\n\n const align = textAlign ? textAlign : mode === 'large' ? 'center' : 'right';\n const iconSizePx = iconSize === 'large' ? '64' : '48';\n const activationOptions = {\n apiNotificationPriorityBy: 'contacts',\n };\n\n if (mode === 'compact') {\n return (\n <CompactWrapper\n {...other}\n className={appendClassNames(\n className,\n 'humany-contact-link',\n 'humany-contact-link-compact'\n )}\n textAlign={align}\n >\n {descriptionLabel && <Text>{descriptionLabel}</Text>}\n {route ? (\n <Link routeName={route}>{label}</Link>\n ) : (\n <WidgetLink\n aria-haspopup=\"dialog\"\n role=\"button\"\n activationOptions={activationOptions}\n widgetName={widget}\n >\n {label}\n </WidgetLink>\n )}\n </CompactWrapper>\n );\n }\n\n const children = (\n <>\n {symbol ? (\n <SymbolBadge symbol={symbol} />\n ) : (\n <ContactIcon\n width={iconSizePx}\n viewBox=\"0 0 63 37\"\n fill=\"none\"\n xmlns=\"http://www.w3.org/2000/svg\"\n >\n <path\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\"\n stroke=\"#990AE3\"\n />\n </ContactIcon>\n )}\n {label && <Heading>{label}</Heading>}\n {descriptionLabel && <Description>{descriptionLabel}</Description>}\n </>\n );\n\n return route ? (\n <StyledLink\n {...other}\n className={appendClassNames(\n className,\n 'humany-contact-link',\n 'humany-contact-link-large'\n )}\n routeName={route}\n >\n {children}\n </StyledLink>\n ) : (\n <StyledWidgetLink\n {...other}\n aria-haspopup=\"dialog\"\n role=\"button\"\n className={appendClassNames(\n className,\n 'humany-contact-link',\n 'humany-contact-link-large'\n )}\n textAlign={align}\n widgetName={widget}\n activationOptions={activationOptions}\n >\n {children}\n </StyledWidgetLink>\n );\n};\n\nconst CompactWrapper = styled.div<{ textAlign: string } & any>`\n text-align: ${(p) => p.textAlign};\n font-weight: 300;\n\n span,\n a {\n display: inline-block;\n font-size: ${(p) => p.theme.fonts?.normal};\n }\n\n span {\n margin: 0 ${(p) => p.theme.sizes?.small} 0 0;\n }\n a {\n text-decoration: underline;\n color: ${(p) => p.theme.colors?.primary};\n &:focus-visible {\n ${linkTabStyle}\n padding: ${(p) => `calc(${p.theme.sizes?.small} / 2) ${p.theme.sizes?.small}`};\n }\n }\n`;\n\nconst styling = css`\n ${contentBox}\n padding: ${(p) => p.theme.sizes?.large};\n text-align: center;\n cursor: pointer;\n text-decoration: none;\n i {\n font-size: ${(p) => p.theme.fonts?.huge};\n min-width: 1em;\n min-height: 1em;\n color: ${(p) => p.theme.colors?.primary};\n }\n span {\n color: ${(p) => p.theme.colors?.text};\n }\n &:focus-visible {\n ${borderTabStyle};\n }\n`;\n\nconst StyledWidgetLink = styled(WidgetLink)<any>`\n ${styling}\n text-align: ${(p) => p.textAlign};\n`;\n\nconst StyledLink = styled(Link)<any>`\n ${styling}\n`;\n\nconst Description = styled(Text)`\n line-height: 1.6em;\n font-weight: 300;\n font-size: ${(p) => p.theme.fonts?.normal};\n`;\n\nconst Heading = styled(Text)`\n display: block;\n font-size: ${(p) => p.theme.fonts?.medium};\n margin: ${(p) => p.theme.sizes?.normal} 0;\n`;\n\nconst ContactIcon = styled.svg`\n align-self: center;\n\n path {\n vector-effect: non-scaling-stroke;\n stroke: ${(p) => p.theme.colors?.primary};\n }\n`;\n\nexport default ContactLink;\n"],"names":["ContactLink","_a","_b","className","other","__objRest","widget","route","mode","iconSize","symbol","descriptionLabel","label","textAlign","useProperties","align","iconSizePx","activationOptions","React","CompactWrapper","__spreadProps","__spreadValues","appendClassNames","Text","Link","WidgetLink","children","SymbolBadge","ContactIcon","Heading","Description","StyledLink","StyledWidgetLink","styled","p","linkTabStyle","styling","css","contentBox","borderTabStyle"],"mappings":"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"}