@telia-ace/widget-components-widget-header 1.3.41-rc.0 → 1.3.41-rc.2

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.
@@ -1 +1 @@
1
- "use strict";const b=require("@telia-ace/widget-core"),p=require("@telia-ace/widget-ui"),f=require("@telia-ace/widget-utilities"),h=(r,i,o)=>{if(o!=="center")return{};const t=s=>s.reduce((e,c)=>{const[u]=c.padding.split("px"),[g]=c.size.split("px");return e+(+g+ +u*2)},0),n=t(r),a=t(i),l=n-a;return l===0?{}:{[n>a?"right":"left"]:`${Math.abs(l)}px`}},w=r=>Object.keys(r).reduce((i,o)=>{const t=r[o];if(!t)return i;const[n,a]=i,l=t.position==="left"?n:a;return r[o].symbol,l.push({symbol:t.symbol&&typeof t.symbol=="string"?{type:"Uri",content:t.symbol}:t.symbol,type:o,padding:t.padding||"10px",label:t.label,size:t.size||"64px",tooltip:t.tooltip,order:t.order||0,show:t.show}),i},[[],[]]),m=r=>r.getAsync("router").then(i=>{if(!i)return!0;const o=i.getInitialRoute(),{name:t,params:n}=i.getRouteData();return f.removeNullAndUndefinedValues(n),!((o==null?void 0:o.name)!==t||Object.keys(n).length>0)}),k=r=>p.createReactComponent(r,"widget-header",Promise.resolve().then(()=>require("./widget-header-5e78c0ec.js")),i=>{const{events:o}=r.get("$widget"),[t,n]=b.createEventSubscriber(o),{actions:a={},tooltipBackLabel:l="",tooltipMinimizeLabel:d=""}=i.properties();if(i.actions.create("close",(s,e)=>e.preventDefault?void 0:r.get("$widget").invoke("close")),i.actions.create("back",(s,e)=>{if(!e.preventDefault)return r.getAsync("router").then(c=>{c.goBack()})}),i.properties(s=>{const{actions:e={}}=s;if(e!=null&&e.back&&(e.back.tooltip=e.back.tooltip?e.back.tooltip:l),e!=null&&e.minimize&&(e.minimize.tooltip=e.minimize.tooltip?e.minimize.tooltip:d),!!e.back)return Object.keys(e).forEach(c=>{const u=e[c];c==="back"&&(u.show=s.showBack)}),{actions:e}}),i.actions.create("show-back",s=>{i.writeProperties({showBack:s})}),a.back){const s=()=>m(r).then(e=>i.actions.dispatch("show-back",!e));s(),t("router:changed",s)}return i.actions.create("minimize",(s,e)=>e.preventDefault?void 0:r.get("$widget").invoke("hide",{focusTrigger:!0})),()=>{n()}});exports.WidgetHeaderComponent=k;exports.calculateMargin=h;exports.createNodes=w;
1
+ "use strict";const b=require("@telia-ace/widget-core"),p=require("@telia-ace/widget-ui"),f=require("@telia-ace/widget-utilities"),h=(r,i,o)=>{if(o!=="center")return{};const t=s=>s.reduce((e,c)=>{const[u]=c.padding.split("px"),[g]=c.size.split("px");return e+(+g+ +u*2)},0),n=t(r),a=t(i),l=n-a;return l===0?{}:{[n>a?"right":"left"]:`${Math.abs(l)}px`}},w=r=>Object.keys(r).reduce((i,o)=>{const t=r[o];if(!t)return i;const[n,a]=i,l=t.position==="left"?n:a;return r[o].symbol,l.push({symbol:t.symbol&&typeof t.symbol=="string"?{type:"Uri",content:t.symbol}:t.symbol,type:o,padding:t.padding||"10px",label:t.label,size:t.size||"64px",tooltip:t.tooltip,order:t.order||0,show:t.show}),i},[[],[]]),m=r=>r.getAsync("router").then(i=>{if(!i)return!0;const o=i.getInitialRoute(),{name:t,params:n}=i.getRouteData();return f.removeNullAndUndefinedValues(n),!((o==null?void 0:o.name)!==t||Object.keys(n).length>0)}),k=r=>p.createReactComponent(r,"widget-header",Promise.resolve().then(()=>require("./widget-header-CNYsG1gF.js")),i=>{const{events:o}=r.get("$widget"),[t,n]=b.createEventSubscriber(o),{actions:a={},tooltipBackLabel:l="",tooltipMinimizeLabel:d=""}=i.properties();if(i.actions.create("close",(s,e)=>e.preventDefault?void 0:r.get("$widget").invoke("close")),i.actions.create("back",(s,e)=>{if(!e.preventDefault)return r.getAsync("router").then(c=>{c.goBack()})}),i.properties(s=>{const{actions:e={}}=s;if(e!=null&&e.back&&(e.back.tooltip=e.back.tooltip?e.back.tooltip:l),e!=null&&e.minimize&&(e.minimize.tooltip=e.minimize.tooltip?e.minimize.tooltip:d),!!e.back)return Object.keys(e).forEach(c=>{const u=e[c];c==="back"&&(u.show=s.showBack)}),{actions:e}}),i.actions.create("show-back",s=>{i.writeProperties({showBack:s})}),a.back){const s=()=>m(r).then(e=>i.actions.dispatch("show-back",!e));s(),t("router:changed",s)}return i.actions.create("minimize",(s,e)=>e.preventDefault?void 0:r.get("$widget").invoke("hide",{focusTrigger:!0})),()=>{n()}});exports.WidgetHeaderComponent=k;exports.calculateMargin=h;exports.createNodes=w;
@@ -37,7 +37,7 @@ const z = (i, r, s) => {
37
37
  }), v = (i) => g(
38
38
  i,
39
39
  "widget-header",
40
- import("./widget-header-0108235e.mjs"),
40
+ import("./widget-header-BujuGUTT.mjs"),
41
41
  (r) => {
42
42
  const { events: s } = i.get("$widget"), [e, n] = b(s), {
43
43
  actions: c = {},
package/index.js CHANGED
@@ -1 +1 @@
1
- "use strict";const e=require("./index-cc8580b8.js");require("@telia-ace/widget-core");require("@telia-ace/widget-ui");require("@telia-ace/widget-utilities");module.exports=e.WidgetHeaderComponent;
1
+ "use strict";const e=require("./index-B44gsPzb.js");module.exports=e.WidgetHeaderComponent;
package/index.mjs CHANGED
@@ -1,7 +1,4 @@
1
- import { W as i } from "./index-c6acaf7f.mjs";
2
- import "@telia-ace/widget-core";
3
- import "@telia-ace/widget-ui";
4
- import "@telia-ace/widget-utilities";
1
+ import { W as f } from "./index-E2WAMzHK.mjs";
5
2
  export {
6
- i as default
3
+ f as default
7
4
  };
package/node.d.ts ADDED
@@ -0,0 +1,8 @@
1
+ import { default as React } from 'react';
2
+ import { ActionNode } from './widget-header-component';
3
+
4
+ type Props = Merge<ActionNode, {
5
+ className?: string;
6
+ }>;
7
+ declare const Node: React.FC<Props>;
8
+ export default Node;
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@telia-ace/widget-components-widget-header",
3
- "version": "1.3.41-rc.0",
3
+ "version": "1.3.41-rc.2",
4
4
  "main": "./index.js",
5
5
  "types": "./index.d.ts",
6
6
  "exports": {
@@ -10,10 +10,10 @@
10
10
  }
11
11
  },
12
12
  "dependencies": {
13
- "@telia-ace/widget-core": "^1.3.41-rc.0",
14
- "@telia-ace/widget-routing": "^1.3.41-rc.0",
15
- "@telia-ace/widget-ui": "^1.3.41-rc.0",
16
- "@telia-ace/widget-utilities": "^1.3.41-rc.0",
13
+ "@telia-ace/widget-core": "^1.3.41-rc.2",
14
+ "@telia-ace/widget-routing": "^1.3.41-rc.2",
15
+ "@telia-ace/widget-ui": "^1.3.41-rc.2",
16
+ "@telia-ace/widget-utilities": "^1.3.41-rc.2",
17
17
  "@webprovisions/platform": "^1.1.4"
18
18
  },
19
19
  "peerDependencies": {
@@ -1,10 +1,9 @@
1
1
  import { jsx as i, jsxs as u } from "react/jsx-runtime";
2
2
  import { css as y } from "@emotion/react";
3
3
  import c from "@emotion/styled";
4
- import { SymbolBadge as h, borderTabStyle as z, useDispatch as k, TransitionComponent as N, useProperties as S, Typography as f, headingElement as v, Link as w, linkTabStyle as C } from "@telia-ace/widget-ui";
4
+ import { SymbolBadge as h, useDispatch as z, TransitionComponent as k, borderTabStyle as N, useProperties as S, Typography as f, headingElement as v, linkTabStyle as w, Link as C } from "@telia-ace/widget-ui";
5
5
  import { appendClassNames as T } from "@telia-ace/widget-utilities";
6
- import { c as A, a as W } from "./index-c6acaf7f.mjs";
7
- import "@telia-ace/widget-core";
6
+ import { c as A, a as W } from "./index-E2WAMzHK.mjs";
8
7
  const B = ({ node: e }) => {
9
8
  if (!e.symbol)
10
9
  return null;
@@ -42,9 +41,9 @@ const B = ({ node: e }) => {
42
41
  const t = e.symbol || { type: "Svg", content: "minimize" }, r = parseInt(e == null ? void 0 : e.size, 10) || 20;
43
42
  return /* @__PURE__ */ i(h, { size: r, symbol: t });
44
43
  }, x = ({ className: e = "", ...t }) => {
45
- const r = k(), { size: s, padding: m, type: n, tooltip: a, show: g = !0 } = t;
44
+ const r = z(), { size: s, padding: m, type: n, tooltip: a, show: g = !0 } = t;
46
45
  return n === "back" ? /* @__PURE__ */ i($, { size: s || "64px", padding: m || "10px", children: /* @__PURE__ */ i(
47
- N,
46
+ k,
48
47
  {
49
48
  in: g,
50
49
  timeout: 300,
@@ -136,13 +135,13 @@ const B = ({ node: e }) => {
136
135
  cursor: pointer;
137
136
  padding: 0;
138
137
  &:focus-visible {
139
- ${z};
138
+ ${N};
140
139
  border-color: ${(e) => {
141
140
  var t, r;
142
141
  return (r = (t = e.theme.accessibility) == null ? void 0 : t.colors) == null ? void 0 : r.inactiveText;
143
142
  }};
144
143
  }
145
- `, O = ({ className: e, ...t }) => {
144
+ `, K = ({ className: e, ...t }) => {
146
145
  const {
147
146
  header: r,
148
147
  tagline: s,
@@ -222,18 +221,18 @@ const B = ({ node: e }) => {
222
221
  max-height: 100%;
223
222
  margin-right: ${(e) => e.margin.right || 0};
224
223
  margin-left: ${(e) => e.margin.left || 0};
225
- `, D = c(w)`
224
+ `, D = c(C)`
226
225
  text-decoration: none;
227
226
  &:focus-visible {
228
227
  ${(e) => v(e)(
229
228
  "h1",
230
229
  y`
231
- ${C(e)}
230
+ ${w(e)}
232
231
  display: inline-block;
233
232
  `
234
233
  )}
235
234
  }
236
235
  `;
237
236
  export {
238
- O as default
237
+ K as default
239
238
  };
@@ -1,10 +1,10 @@
1
- "use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const i=require("react/jsx-runtime"),p=require("@emotion/react"),m=require("@emotion/styled"),r=require("@telia-ace/widget-ui"),$=require("@telia-ace/widget-utilities"),b=require("./index-cc8580b8.js");require("@telia-ace/widget-core");const f=({node:e})=>{if(!e.symbol)return null;let t;const s=e.symbol.type==="Svg";if(e.symbol.type==="Svg"){const o=parseInt(e.size,10);isNaN(o)||(t=o)}return i.jsx(j,{symbol:e.symbol,svg:s,size:t,backgroundSize:"cover"})},j=m(({svg:e,...t})=>i.jsx(r.SymbolBadge,{...t}))`
1
+ "use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const i=require("react/jsx-runtime"),u=require("@emotion/react"),m=require("@emotion/styled"),n=require("@telia-ace/widget-ui"),$=require("@telia-ace/widget-utilities"),b=require("./index-B44gsPzb.js"),f=({node:e})=>{if(!e.symbol)return null;let t;const s=e.symbol.type==="Svg";if(e.symbol.type==="Svg"){const o=parseInt(e.size,10);isNaN(o)||(t=o)}return i.jsx(j,{symbol:e.symbol,svg:s,size:t,backgroundSize:"cover"})},j=m(({svg:e,...t})=>i.jsx(n.SymbolBadge,{...t}))`
2
2
  color: ${e=>{var t;return(t=e.theme.colors)==null?void 0:t.text}};
3
- ${e=>!e.svg&&p.css`
3
+ ${e=>!e.svg&&u.css`
4
4
  border-radius: 50%;
5
5
  overflow: hidden;
6
6
  `}
7
- `,z=({node:e})=>{const t=e.symbol||{type:"Svg",content:"back"};return i.jsx(r.SymbolBadge,{size:20,symbol:t})},k=({node:e})=>{const t=e.symbol||{type:"Svg",content:"close"},s=parseInt(e==null?void 0:e.size,10)||14;return i.jsx(r.SymbolBadge,{size:s,symbol:t})},S=({node:e})=>{const t=e.symbol||{type:"Svg",content:"minimize"},s=parseInt(e==null?void 0:e.size,10)||20;return i.jsx(r.SymbolBadge,{size:s,symbol:t})},y=({className:e="",...t})=>{const s=r.useDispatch(),{size:o,padding:g,type:a,tooltip:l,show:d=!0}=t;return a==="back"?i.jsx(v,{size:o||"64px",padding:g||"10px",children:i.jsx(r.TransitionComponent,{in:d,timeout:300,transitions:{enter:{type:"scale",easing:"cubic-bezier(.08,.84,.74,1.84)"},exit:{type:"scale",easing:"ease-out"}},children:(x,h)=>i.jsx(u,{"data-testid":"back-button",title:l,"aria-label":l,animationCss:h,onClick:()=>{s("back")},children:i.jsx(z,{node:t})})})}):d?i.jsxs(v,{size:o||"64px",padding:g||"10px",squareRatio:a==="avatar",children:[a==="avatar"&&i.jsx(f,{node:t}),a==="close"&&i.jsx(u,{title:l,"aria-label":l,onClick:()=>{s("close")},children:i.jsx(k,{node:t})}),a==="minimize"&&i.jsx(u,{title:l,"aria-label":l,onClick:()=>{s("minimize")},children:i.jsx(S,{node:t})})]}):null},v=m.div`
7
+ `,z=({node:e})=>{const t=e.symbol||{type:"Svg",content:"back"};return i.jsx(n.SymbolBadge,{size:20,symbol:t})},k=({node:e})=>{const t=e.symbol||{type:"Svg",content:"close"},s=parseInt(e==null?void 0:e.size,10)||14;return i.jsx(n.SymbolBadge,{size:s,symbol:t})},S=({node:e})=>{const t=e.symbol||{type:"Svg",content:"minimize"},s=parseInt(e==null?void 0:e.size,10)||20;return i.jsx(n.SymbolBadge,{size:s,symbol:t})},y=({className:e="",...t})=>{const s=n.useDispatch(),{size:o,padding:g,type:a,tooltip:l,show:d=!0}=t;return a==="back"?i.jsx(v,{size:o||"64px",padding:g||"10px",children:i.jsx(n.TransitionComponent,{in:d,timeout:300,transitions:{enter:{type:"scale",easing:"cubic-bezier(.08,.84,.74,1.84)"},exit:{type:"scale",easing:"ease-out"}},children:(x,h)=>i.jsx(p,{"data-testid":"back-button",title:l,"aria-label":l,animationCss:h,onClick:()=>{s("back")},children:i.jsx(z,{node:t})})})}):d?i.jsxs(v,{size:o||"64px",padding:g||"10px",squareRatio:a==="avatar",children:[a==="avatar"&&i.jsx(f,{node:t}),a==="close"&&i.jsx(p,{title:l,"aria-label":l,onClick:()=>{s("close")},children:i.jsx(k,{node:t})}),a==="minimize"&&i.jsx(p,{title:l,"aria-label":l,onClick:()=>{s("minimize")},children:i.jsx(S,{node:t})})]}):null},v=m.div`
8
8
  flex: 1;
9
9
  max-width: ${e=>e.size};
10
10
  ${e=>e.squareRatio&&`max-height: ${e.size};`}
@@ -25,22 +25,22 @@
25
25
  min-height: 1em;
26
26
  display: inline-block;
27
27
  }
28
- `,u=m.button`
28
+ `,p=m.button`
29
29
  ${e=>!!e.animationCss&&e.animationCss};
30
30
  background: none;
31
31
  border: none;
32
32
  cursor: pointer;
33
33
  padding: 0;
34
34
  &:focus-visible {
35
- ${r.borderTabStyle};
35
+ ${n.borderTabStyle};
36
36
  border-color: ${e=>{var t,s;return(s=(t=e.theme.accessibility)==null?void 0:t.colors)==null?void 0:s.inactiveText}};
37
37
  }
38
- `,N=({className:e,...t})=>{const{header:s,tagline:o,route:g,tooltip:a="",actions:l={},textAlign:d="center"}=r.useProperties(),[x,h]=b.createNodes(l);return x.sort((n,c)=>(n.order||0)-(c.order||0)),h.sort((n,c)=>(n.order||0)-(c.order||0)),i.jsxs(w,{...t,className:$.appendClassNames(e,"humany-widget-header"),children:[x.map((n,c)=>i.jsx(y,{...n},`${n.type}+_${c}`)),i.jsxs(C,{textAlign:d,margin:b.calculateMargin(x,h,d),children:[g?i.jsx(T,{routeName:g,title:a,"aria-label":a,children:i.jsx(r.Typography,{variant:"h1",children:s})}):i.jsx(r.Typography,{variant:"h1",children:s}),o&&i.jsx(q,{children:o})]}),h.map((n,c)=>i.jsx(y,{...n},`${n.type}+_${c}`))]})},w=m.div`
38
+ `,N=({className:e,...t})=>{const{header:s,tagline:o,route:g,tooltip:a="",actions:l={},textAlign:d="center"}=n.useProperties(),[x,h]=b.createNodes(l);return x.sort((r,c)=>(r.order||0)-(c.order||0)),h.sort((r,c)=>(r.order||0)-(c.order||0)),i.jsxs(w,{...t,className:$.appendClassNames(e,"humany-widget-header"),children:[x.map((r,c)=>i.jsx(y,{...r},`${r.type}+_${c}`)),i.jsxs(q,{textAlign:d,margin:b.calculateMargin(x,h,d),children:[g?i.jsx(T,{routeName:g,title:a,"aria-label":a,children:i.jsx(n.Typography,{variant:"h1",children:s})}):i.jsx(n.Typography,{variant:"h1",children:s}),o&&i.jsx(C,{children:o})]}),h.map((r,c)=>i.jsx(y,{...r},`${r.type}+_${c}`))]})},w=m.div`
39
39
  display: flex;
40
40
  flex-direction: row;
41
41
  align-items: center;
42
42
 
43
- ${e=>{var t,s;return r.headingElement(e)("h1",p.css`
43
+ ${e=>{var t,s;return n.headingElement(e)("h1",u.css`
44
44
  font-size: ${(t=e.theme.fonts)==null?void 0:t.huge};
45
45
  margin: 0;
46
46
  font-weight: 300;
@@ -59,21 +59,21 @@
59
59
  stroke: ${e=>{var t;return(t=e.theme.colors)==null?void 0:t.text}};
60
60
  }
61
61
  }
62
- `,q=m.p`
62
+ `,C=m.p`
63
63
  font-size: ${e=>{var t;return(t=e.theme.fonts)==null?void 0:t.normal}};
64
64
  font-weight: 300;
65
- `,C=m.div`
65
+ `,q=m.div`
66
66
  flex: 1;
67
67
  text-align: ${e=>e.textAlign};
68
68
  overflow: auto;
69
69
  max-height: 100%;
70
70
  margin-right: ${e=>e.margin.right||0};
71
71
  margin-left: ${e=>e.margin.left||0};
72
- `,T=m(r.Link)`
72
+ `,T=m(n.Link)`
73
73
  text-decoration: none;
74
74
  &:focus-visible {
75
- ${e=>r.headingElement(e)("h1",p.css`
76
- ${r.linkTabStyle(e)}
75
+ ${e=>n.headingElement(e)("h1",u.css`
76
+ ${n.linkTabStyle(e)}
77
77
  display: inline-block;
78
78
  `)}
79
79
  }