@telia-ace/knowledge-widget-components-guide-category-dropdown 1.2.6 → 1.2.7-rc.5

package/{guide-category-dropdown-3698c67e.mjs → guide-category-dropdown-1d1ef79b.mjs}

@@ -1,21 +1,21 @@
-import { jsxs as c, jsx as o, Fragment as D } from "react/jsx-runtime";
-import { loadingOpacity as j, contentBox as B, borderTabStyle as M, Link as O, linkTabStyle as G, List as R, list as A, Text as $, useProperties as C, useHover as E, SymbolBadge as f, useRouteData as P, useContainer as W, useIsTabbing as H, createEmptyComponent as U } from "@telia-ace/knowledge-widget-ui";
-import { appendClassNames as z, createParams as q, formatUrl as J } from "@telia-ace/widget-utilities";
-import { useState as T, useEffect as K } from "react";
-import { initialRouteFallback as Q } from "@telia-ace/knowledge-widget-component-utilities";
+import { jsxs as c, jsx as o, Fragment as j } from "react/jsx-runtime";
+import { loadingOpacity as B, contentBox as M, borderTabStyle as O, Link as G, linkTabStyle as R, List as A, list as E, Text as $, useProperties as C, useHover as P, SymbolBadge as f, useRouteData as W, useContainer as H, useIsTabbing as U, createEmptyComponent as q } from "@telia-ace/knowledge-widget-ui";
+import { appendClassNames as T, createParams as J, formatUrl as K } from "@telia-ace/widget-utilities";
+import { useState as N, useEffect as Q } from "react";
+import { initialRouteFallback as V } from "@telia-ace/knowledge-widget-component-utilities";
 import { css as x } from "@emotion/react";
 import m from "@emotion/styled";
-const V = m.div`
-  ${j}
+const X = m.div`
   ${B}
+  ${M}
   overflow: hidden;
   min-height: 50px;
   ${(e) => e["data-toggler-in-focus"] && e.isTabbing && x`
       && {
-        ${M(e)}
+        ${O(e)}
       }
     `};
-`, X = m.button`
+`, Y = m.button`
   background: none;
   border: 0;
   outline: 0;
@@ -37,7 +37,7 @@ const V = m.div`
 }};
     }
   }
-`, N = (e) => {
+`, L = (e) => {
   var t, g, u, r, n, p, s, h;
   return x`
   font-size: ${(t = e.theme.fonts) == null ? void 0 : t.normal};
@@ -70,19 +70,19 @@ const V = m.div`
     min-width: 1em;
   }
 `;
-}, Y = m.div`
-  ${N}
-`, Z = m(O)`
-  ${N}
+}, Z = m.div`
+  ${L}
+`, _ = m(G)`
+  ${L}
   &:focus {
     outline: none;
   }
   &:focus-visible {
     span {
-      ${G};
+      ${R};
     }
   }
-`, _ = m.div`
+`, ee = m.div`
   display: flex;
   justify-content: space-between;
   padding-right: ${(e) => {
@@ -102,8 +102,8 @@ const V = m.div`
   .humany-guide-category-dropdown-item {
     font-weight: normal;
   }
-`, ee = m(R)`
-  ${A}
+`, te = m(A)`
+  ${E}
   display: flex;
   justify-content: center;
   flex-direction: column;
@@ -128,19 +128,19 @@ const V = m.div`
   }
   flex-basis: 100%;
   border-width: 2px;
-`, te = m($)`
+`, oe = m($)`
   margin: 0 0 0 ${(e) => {
   var t;
   return (t = e.theme.sizes) == null ? void 0 : t.small;
 }};
 `, a = {
-  Wrapper: V,
-  Toggler: X,
-  List: ee,
-  Item: Y,
-  Link: Z,
-  TopItem: _,
-  MatchCount: te
+  Wrapper: X,
+  Toggler: Y,
+  List: te,
+  Item: Z,
+  Link: _,
+  TopItem: ee,
+  MatchCount: oe
 }, v = ({ matches: e }) => {
   const { showMatchCount: t = !1 } = C();
   return !t || typeof e > "u" ? null : /* @__PURE__ */ c(a.MatchCount, { children: [
@@ -148,7 +148,7 @@ const V = m.div`
     e,
     ")"
   ] });
-}, oe = ({
+}, ne = ({
   item: e,
   guideCategory: t
 }) => {
@@ -157,65 +157,65 @@ const V = m.div`
     categoryAriaLabel: u = "",
     activeCategoryAriaLabel: r = "",
     fallbackOnInitialRoute: n = !1
-  } = C(), [p, s] = E(), { id: h, title: y, symbol: i, activeSymbol: l } = e, d = t === h;
+  } = C(), [p, s] = P(), { id: h, title: b, symbol: i, activeSymbol: l } = e, d = t === h;
   return /* @__PURE__ */ o("li", { ref: s, children: /* @__PURE__ */ c(
     a.Link,
     {
-      ...Q(
+      ...V(
         e,
         g,
         n,
         "category"
       ),
       "aria-pressed": d,
-      "aria-label": (d ? r : u).replace("{{category}}", y),
+      "aria-label": (d ? r : u).replace("{{category}}", b),
       className: "humany-guide-category-dropdown-link",
       "aria-current": d,
       selected: d,
       children: [
         (d || p) && l ? /* @__PURE__ */ o(f, { symbol: l }) : i && /* @__PURE__ */ o(f, { symbol: i }),
-        /* @__PURE__ */ o($, { children: y }),
+        /* @__PURE__ */ o($, { children: b }),
         /* @__PURE__ */ o(v, { ...e })
       ]
     }
   ) });
-}, ce = ({ className: e, ...t }) => {
-  const g = P(), [u, r] = T(!1), {
+}, me = ({ className: e, ...t }) => {
+  const g = W(), [u, r] = N(!1), {
     parent: n,
     route: p = "browse",
     categories: s = [],
     loading: h = !1
-  } = C(), y = W(), [i, l] = T(!1), { params: d } = g, L = H(), { guideCategory: k, tag: I, phrase: S, sorting: F } = d;
-  if (K(() => {
+  } = C(), b = H(), [i, l] = N(!1), { params: d } = g, I = U(), { guideCategory: k, tag: S, phrase: F, sorting: D } = d;
+  if (Q(() => {
     i && l(!1);
   }, [k]), h || !n || !s.length)
-    return U(y, {
+    return q(b, {
       ...t,
-      className: z(e, "humany-guide-category-dropdown")
+      className: T(e, "humany-guide-category-dropdown")
     });
-  const b = s.find((w) => w.id === k) || n;
-  return b.activeSymbol || b.symbol, /* @__PURE__ */ o(
+  const y = s.find((w) => w.id === k) || n, z = y.activeSymbol || y.symbol;
+  return /* @__PURE__ */ o(
     a.Wrapper,
     {
       ...t,
       "data-loading": !1,
       "data-toggler-in-focus": u,
       "aria-expanded": i,
-      isTabbing: L,
-      className: z(e, "humany-guide-category-dropdown"),
-      children: i ? /* @__PURE__ */ c(D, { children: [
+      isTabbing: I,
+      className: T(e, "humany-guide-category-dropdown"),
+      children: i ? /* @__PURE__ */ c(j, { children: [
         /* @__PURE__ */ c(a.TopItem, { className: "humany-guide-category-dropdown-top-item", children: [
           /* @__PURE__ */ c(
             a.Link,
             {
               className: "humany-guide-category-dropdown-link",
               routeName: p,
-              params: q({
-                tag: I,
-                phrase: S,
-                sorting: F,
+              params: J({
+                tag: S,
+                phrase: F,
+                sorting: D,
                 guideCategory: n.id,
-                uriName: J(n.title)
+                uriName: K(n.title)
               }),
               selected: !1,
               children: [
@@ -252,7 +252,7 @@ const V = m.div`
             className: "humany-guide-category-dropdown-open",
             items: s,
             renderItem: (w) => /* @__PURE__ */ o(
-              oe,
+              ne,
               {
                 item: w,
                 guideCategory: k
@@ -271,9 +271,9 @@ const V = m.div`
             },
             selected: !1,
             children: [
-              n.symbol ? /* @__PURE__ */ o(f, { symbol: n.symbol }) : null,
-              /* @__PURE__ */ o($, { children: n.title }),
-              /* @__PURE__ */ o(v, { ...b })
+              z ? /* @__PURE__ */ o(f, { symbol: z }) : null,
+              /* @__PURE__ */ o($, { children: y.title }),
+              /* @__PURE__ */ o(v, { ...y })
             ]
           }
         ),
@@ -287,7 +287,7 @@ const V = m.div`
               l(!i);
             },
             "aria-expanded": "false",
-            "aria-label": b.title,
+            "aria-label": y.title,
             children: /* @__PURE__ */ o(
               f,
               {
@@ -302,5 +302,5 @@ const V = m.div`
   );
 };
 export {
-  ce as default
+  me as default
 };

package/{guide-category-dropdown-677e0f86.js → guide-category-dropdown-61b15156.js}

@@ -1,4 +1,4 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const o=require("react/jsx-runtime"),s=require("@telia-ace/knowledge-widget-ui"),b=require("@telia-ace/widget-utilities"),$=require("react"),N=require("@telia-ace/knowledge-widget-component-utilities"),w=require("@emotion/react"),g=require("@emotion/styled"),I=g.div`
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const o=require("react/jsx-runtime"),s=require("@telia-ace/knowledge-widget-ui"),b=require("@telia-ace/widget-utilities"),$=require("react"),I=require("@telia-ace/knowledge-widget-component-utilities"),w=require("@emotion/react"),g=require("@emotion/styled"),B=g.div`
   ${s.loadingOpacity}
   ${s.contentBox}
   overflow: hidden;
@@ -8,7 +8,7 @@
         ${s.borderTabStyle(e)}
       }
     `};
-`,B=g.button`
+`,L=g.button`
   background: none;
   border: 0;
   outline: 0;
@@ -54,9 +54,9 @@
     min-height: 1em;
     min-width: 1em;
   }
-`},L=g.div`
+`},q=g.div`
   ${k}
-`,q=g(s.Link)`
+`,F=g(s.Link)`
   ${k}
   &:focus {
     outline: none;
@@ -66,7 +66,7 @@
       ${s.linkTabStyle};
     }
   }
-`,F=g.div`
+`,D=g.div`
   display: flex;
   justify-content: space-between;
   padding-right: ${e=>{var t;return(t=e.theme.sizes)==null?void 0:t.large}};
@@ -83,7 +83,7 @@
   .humany-guide-category-dropdown-item {
     font-weight: normal;
   }
-`,D=g(s.List)`
+`,M=g(s.List)`
   ${s.list}
   display: flex;
   justify-content: center;
@@ -100,6 +100,6 @@
   }
   flex-basis: 100%;
   border-width: 2px;
-`,M=g(s.Text)`
+`,O=g(s.Text)`
   margin: 0 0 0 ${e=>{var t;return(t=e.theme.sizes)==null?void 0:t.small}};
-`,a={Wrapper:I,Toggler:B,List:D,Item:L,Link:q,TopItem:F,MatchCount:M},C=({matches:e})=>{const{showMatchCount:t=!1}=s.useProperties();return!t||typeof e>"u"?null:o.jsxs(a.MatchCount,{children:["(",e,")"]})},O=({item:e,guideCategory:t})=>{const{route:m="browse",categoryAriaLabel:u="",activeCategoryAriaLabel:i="",fallbackOnInitialRoute:n=!1}=s.useProperties(),[y,l]=s.useHover(),{id:h,title:p,symbol:r,activeSymbol:d}=e,c=t===h;return o.jsx("li",{ref:l,children:o.jsxs(a.Link,{...N.initialRouteFallback(e,m,n,"category"),"aria-pressed":c,"aria-label":(c?i:u).replace("{{category}}",p),className:"humany-guide-category-dropdown-link","aria-current":c,selected:c,children:[(c||y)&&d?o.jsx(s.SymbolBadge,{symbol:d}):r&&o.jsx(s.SymbolBadge,{symbol:r}),o.jsx(s.Text,{children:p}),o.jsx(C,{...e})]})})},P=({className:e,...t})=>{const m=s.useRouteData(),[u,i]=$.useState(!1),{parent:n,route:y="browse",categories:l=[],loading:h=!1}=s.useProperties(),p=s.useContainer(),[r,d]=$.useState(!1),{params:c}=m,v=s.useIsTabbing(),{guideCategory:j,tag:S,phrase:T,sorting:z}=c;if($.useEffect(()=>{r&&d(!1)},[j]),h||!n||!l.length)return s.createEmptyComponent(p,{...t,className:b.appendClassNames(e,"humany-guide-category-dropdown")});const f=l.find(x=>x.id===j)||n;return f.activeSymbol||f.symbol,o.jsx(a.Wrapper,{...t,"data-loading":!1,"data-toggler-in-focus":u,"aria-expanded":r,isTabbing:v,className:b.appendClassNames(e,"humany-guide-category-dropdown"),children:r?o.jsxs(o.Fragment,{children:[o.jsxs(a.TopItem,{className:"humany-guide-category-dropdown-top-item",children:[o.jsxs(a.Link,{className:"humany-guide-category-dropdown-link",routeName:y,params:b.createParams({tag:S,phrase:T,sorting:z,guideCategory:n.id,uriName:b.formatUrl(n.title)}),selected:!1,children:[n.symbol?o.jsx(s.SymbolBadge,{symbol:n.symbol}):null,o.jsx(s.Text,{children:n.title}),o.jsx(C,{...n})]}),o.jsx(a.Toggler,{onBlur:()=>i(!1),onFocus:()=>i(!0),className:"humany-guide-category-dropdown-toggler",onClick:()=>{d(!r)},"aria-expanded":"true","aria-label":n.title,children:o.jsx(s.SymbolBadge,{size:18,symbol:{type:"Svg",content:"caret-up"}})})]}),o.jsx(a.List,{className:"humany-guide-category-dropdown-open",items:l,renderItem:x=>o.jsx(O,{item:x,guideCategory:j},x.id)})]}):o.jsxs(a.TopItem,{className:"humany-guide-category-dropdown-top-item",children:[o.jsxs(a.Item,{className:"humany-guide-category-dropdown-item",onClick:()=>{d(!r)},selected:!1,children:[n.symbol?o.jsx(s.SymbolBadge,{symbol:n.symbol}):null,o.jsx(s.Text,{children:n.title}),o.jsx(C,{...f})]}),o.jsx(a.Toggler,{onBlur:()=>i(!1),onFocus:()=>i(!0),className:"humany-guide-category-dropdown-toggler",onClick:()=>{d(!r)},"aria-expanded":"false","aria-label":f.title,children:o.jsx(s.SymbolBadge,{size:18,symbol:{type:"Svg",content:"caret-down"}})})]})})};exports.default=P;
+`,a={Wrapper:B,Toggler:L,List:M,Item:q,Link:F,TopItem:D,MatchCount:O},C=({matches:e})=>{const{showMatchCount:t=!1}=s.useProperties();return!t||typeof e>"u"?null:o.jsxs(a.MatchCount,{children:["(",e,")"]})},P=({item:e,guideCategory:t})=>{const{route:m="browse",categoryAriaLabel:u="",activeCategoryAriaLabel:i="",fallbackOnInitialRoute:n=!1}=s.useProperties(),[y,l]=s.useHover(),{id:h,title:f,symbol:r,activeSymbol:d}=e,c=t===h;return o.jsx("li",{ref:l,children:o.jsxs(a.Link,{...I.initialRouteFallback(e,m,n,"category"),"aria-pressed":c,"aria-label":(c?i:u).replace("{{category}}",f),className:"humany-guide-category-dropdown-link","aria-current":c,selected:c,children:[(c||y)&&d?o.jsx(s.SymbolBadge,{symbol:d}):r&&o.jsx(s.SymbolBadge,{symbol:r}),o.jsx(s.Text,{children:f}),o.jsx(C,{...e})]})})},R=({className:e,...t})=>{const m=s.useRouteData(),[u,i]=$.useState(!1),{parent:n,route:y="browse",categories:l=[],loading:h=!1}=s.useProperties(),f=s.useContainer(),[r,d]=$.useState(!1),{params:c}=m,v=s.useIsTabbing(),{guideCategory:j,tag:T,phrase:z,sorting:N}=c;if($.useEffect(()=>{r&&d(!1)},[j]),h||!n||!l.length)return s.createEmptyComponent(f,{...t,className:b.appendClassNames(e,"humany-guide-category-dropdown")});const p=l.find(x=>x.id===j)||n,S=p.activeSymbol||p.symbol;return o.jsx(a.Wrapper,{...t,"data-loading":!1,"data-toggler-in-focus":u,"aria-expanded":r,isTabbing:v,className:b.appendClassNames(e,"humany-guide-category-dropdown"),children:r?o.jsxs(o.Fragment,{children:[o.jsxs(a.TopItem,{className:"humany-guide-category-dropdown-top-item",children:[o.jsxs(a.Link,{className:"humany-guide-category-dropdown-link",routeName:y,params:b.createParams({tag:T,phrase:z,sorting:N,guideCategory:n.id,uriName:b.formatUrl(n.title)}),selected:!1,children:[n.symbol?o.jsx(s.SymbolBadge,{symbol:n.symbol}):null,o.jsx(s.Text,{children:n.title}),o.jsx(C,{...n})]}),o.jsx(a.Toggler,{onBlur:()=>i(!1),onFocus:()=>i(!0),className:"humany-guide-category-dropdown-toggler",onClick:()=>{d(!r)},"aria-expanded":"true","aria-label":n.title,children:o.jsx(s.SymbolBadge,{size:18,symbol:{type:"Svg",content:"caret-up"}})})]}),o.jsx(a.List,{className:"humany-guide-category-dropdown-open",items:l,renderItem:x=>o.jsx(P,{item:x,guideCategory:j},x.id)})]}):o.jsxs(a.TopItem,{className:"humany-guide-category-dropdown-top-item",children:[o.jsxs(a.Item,{className:"humany-guide-category-dropdown-item",onClick:()=>{d(!r)},selected:!1,children:[S?o.jsx(s.SymbolBadge,{symbol:S}):null,o.jsx(s.Text,{children:p.title}),o.jsx(C,{...p})]}),o.jsx(a.Toggler,{onBlur:()=>i(!1),onFocus:()=>i(!0),className:"humany-guide-category-dropdown-toggler",onClick:()=>{d(!r)},"aria-expanded":"false","aria-label":p.title,children:o.jsx(s.SymbolBadge,{size:18,symbol:{type:"Svg",content:"caret-down"}})})]})})};exports.default=R;

package/index.js

@@ -1 +1 @@
-"use strict";const g=require("@telia-ace/knowledge-data-client"),l=require("@telia-ace/knowledge-widget-core"),v=require("@telia-ace/knowledge-widget-ui"),D=(e,a,n)=>!n||n.length<1?a:h(e,a,null,n),h=(e,a,n,o)=>{if(e.find(s=>s.id===o)||!o)return n||a;for(let s=0;s<e.length;s+=1){const t=e[s];if(t.items){const r=h(t.items,a,t,o);if(r)return r}}},P=e=>e.matches&&e.matches>0,q=e=>{const{events:a}=e.get("$widget"),[n,o]=l.createEventSubscriber(a);return v.createReactComponent(e,"guide-category-dropdown",Promise.resolve().then(()=>require("./guide-category-dropdown-677e0f86.js")),i=>{const s=t=>{i.writeProperties({loading:!0}),i.actions.dispatch("fetch",{params:t}).then(()=>{i.writeProperties({loading:!1})})};i.actions.create("fetch",({parent:t,categories:r})=>{i.writeProperties({parent:t,categories:r,loading:!1})}),e.getAsync("router").then(t=>{const{params:r}=t.getRouteData();s(r)}),n("router:changed",(t,{current:r})=>{s(r.routeData.params)})}).then(()=>l.extendComponent(e,"guide-category-dropdown",i=>{i.actions.watch("guide-category-dropdown.fetch",(s,t)=>{const{matchFilters:r={search:!1,tag:!1},rootCategoryHeader:f}=i.properties(),{params:{phrase:p,guideCategory:w,tag:m}}=s;return g.DataClient.getInstance(e).then(b=>b.fetch(g.DataType.GuideCategories,{searchPhrase:r.search?p:void 0,tagId:r.tag?m:void 0}).then(({categories:d,matches:C})=>{var u;const c=D(d,{matches:C,id:"0",title:f,items:d},w);return t({parent:c,categories:(u=c==null?void 0:c.items)==null?void 0:u.filter(P)})}))})})).then(()=>{o()})};module.exports=q;
+"use strict";const g=require("@telia-ace/knowledge-data-client"),l=require("@telia-ace/knowledge-widget-core"),v=require("@telia-ace/knowledge-widget-ui"),D=(e,a,n)=>!n||n.length<1?a:h(e,a,null,n),h=(e,a,n,o)=>{if(e.find(s=>s.id===o)||!o)return n||a;for(let s=0;s<e.length;s+=1){const t=e[s];if(t.items){const r=h(t.items,a,t,o);if(r)return r}}},P=e=>e.matches&&e.matches>0,q=e=>{const{events:a}=e.get("$widget"),[n,o]=l.createEventSubscriber(a);return v.createReactComponent(e,"guide-category-dropdown",Promise.resolve().then(()=>require("./guide-category-dropdown-61b15156.js")),i=>{const s=t=>{i.writeProperties({loading:!0}),i.actions.dispatch("fetch",{params:t}).then(()=>{i.writeProperties({loading:!1})})};i.actions.create("fetch",({parent:t,categories:r})=>{i.writeProperties({parent:t,categories:r,loading:!1})}),e.getAsync("router").then(t=>{const{params:r}=t.getRouteData();s(r)}),n("router:changed",(t,{current:r})=>{s(r.routeData.params)})}).then(()=>l.extendComponent(e,"guide-category-dropdown",i=>{i.actions.watch("guide-category-dropdown.fetch",(s,t)=>{const{matchFilters:r={search:!1,tag:!1},rootCategoryHeader:f}=i.properties(),{params:{phrase:p,guideCategory:w,tag:m}}=s;return g.DataClient.getInstance(e).then(b=>b.fetch(g.DataType.GuideCategories,{searchPhrase:r.search?p:void 0,tagId:r.tag?m:void 0}).then(({categories:d,matches:C})=>{var u;const c=D(d,{matches:C,id:"0",title:f,items:d},w);return t({parent:c,categories:(u=c==null?void 0:c.items)==null?void 0:u.filter(P)})}))})})).then(()=>{o()})};module.exports=q;

package/index.mjs

@@ -17,7 +17,7 @@ const y = (e, n, a) => !a || a.length < 1 ? n : h(e, n, null, a), h = (e, n, a,
   return P(
     e,
     "guide-category-dropdown",
-    import("./guide-category-dropdown-3698c67e.mjs"),
+    import("./guide-category-dropdown-1d1ef79b.mjs"),
     (i) => {
       const s = (t) => {
         i.writeProperties({ loading: !0 }), i.actions.dispatch("fetch", { params: t }).then(() => {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@telia-ace/knowledge-widget-components-guide-category-dropdown",
-  "version": "1.2.6",
+  "version": "1.2.7-rc.5",
   "main": "./index.js",
   "types": "./index.d.ts",
   "exports": {
@@ -10,11 +10,11 @@
     }
   },
   "dependencies": {
-    "@telia-ace/knowledge-widget-core": "*",
-    "@telia-ace/knowledge-widget-component-utilities": "*",
-    "@telia-ace/knowledge-widget-ui": "*",
-    "@telia-ace/widget-utilities": "*",
-    "@telia-ace/knowledge-data-client": "*",
+    "@telia-ace/knowledge-widget-core": "^1.2.7-rc.5",
+    "@telia-ace/knowledge-widget-component-utilities": "^1.2.7-rc.5",
+    "@telia-ace/knowledge-widget-ui": "^1.2.7-rc.5",
+    "@telia-ace/widget-utilities": "^1.2.7-rc.5",
+    "@telia-ace/knowledge-data-client": "^1.2.7-rc.5",
     "@webprovisions/platform": "^1.1.4"
   },
   "peerDependencies": {