@telia-ace/knowledge-widget-ui 0.0.1

package/index.js

@@ -0,0 +1,546 @@
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const n=require("react/jsx-runtime"),s=require("@telia-ace/widget-ui"),$=require("@telia-ace/widget-utilities"),d=require("@emotion/styled"),u=require("react"),y=require("@emotion/react"),C=({title:e="",className:t,id:a,parent:i,connection:o,type:r,target:l,href:h,children:c,connectionKey:m})=>{const p={},{name:f,params:g}=s.useRouteData();switch(r){case"default":case"guide":const{id:b,title:v}=i;let w=m||o;b!==a&&!m&&(w=void 0),p.routeName=f,p.params=$.createParams({...g,guide:a,connection:w,uriName:a===b?$.formatUrl(v):$.formatUrl(e)});break;case"link":p.href=h,p.target=l;break}return n.jsx(s.Link,{className:$.appendClassNames(t,"humany-dialog-link"),...p,children:c||n.jsxs(n.Fragment,{children:[r==="link"&&n.jsx(s.Icon,{faIcon:"link"}),n.jsx("span",{children:e})]})})},fe=u.forwardRef(({className:e,dialog:t,...a},i)=>t.length?n.jsx(ge,{className:$.appendClassNames(e,"humany-dialog"),items:t,renderItem:o=>n.jsx("li",{"data-dialog":o.connection,children:n.jsx(C,{...o})},o.connection),...a,ref:i}):null),ge=d(s.List)`
+  ${s.list}
+  a {
+    min-width: 150px;
+    max-width: 400px;
+    display: block;
+    white-space: normal;
+    ${e=>{var t,a;return((t=e.theme.colors)==null?void 0:t.primary)&&s.invertedHoverButton({primaryColor:(a=e.theme.colors)==null?void 0:a.primary,secondaryColor:"#FFFFFF",theme:e.theme})}}
+  }
+
+  i {
+    margin: 0 ${e=>{var t;return(t=e.theme.sizes)==null?void 0:t.small}} 0 0;
+  }
+`,pe=({trigger:e,header:t,className:a,animation:i,fullScreen:o,onToggle:r,children:l,ref:h,closeButtonAriaLabel:c,...m})=>n.jsx(s.Drawer,{className:$.appendClassNames(a,"humany-drawer-list"),trigger:e,header:t,animation:i,fullScreen:o,onToggle:r,closeButtonAriaLabel:c,children:n.jsx(xe,{...m,children:l})}),xe=d(s.ItemList)`
+  ${s.itemList}
+  font-family: ${e=>{var t;return(t=e.theme.fonts)==null?void 0:t.type}};
+  padding: ${e=>{var t;return(t=e.theme.sizes)==null?void 0:t.medium}};
+  > ul > li {
+    overflow: visible;
+    font-weight: 300;
+    font-size: ${e=>{var t;return(t=e.theme.fonts)==null?void 0:t.normal}};
+  }
+`,ye=({items:e,renderItem:t,trigger:a,header:i,children:o})=>n.jsx(s.Dropdown,{className:"humany-dropdown-actions",trigger:a,children:n.jsxs($e,{children:[!!i&&n.jsx(ve,{children:i}),e&&t&&n.jsx(be,{items:e,renderItem:t}),o]})}),$e=d.div`
+  background: #fff;
+  border: #ccc 1px solid;
+  box-shadow: 0px 0px 10px rgba(0, 0, 0, 0.1);
+  font-family: ${e=>{var t;return(t=e.theme.fonts)==null?void 0:t.type}};
+  font-size: ${e=>{var t;return(t=e.theme.fonts)==null?void 0:t.normal}};
+`,ve=d.div`
+  padding: ${e=>{var t;return(t=e.theme.sizes)==null?void 0:t.normal}};
+  padding-bottom: 0;
+  font-size: ${e=>{var t;return(t=e.theme.fonts)==null?void 0:t.normal}};
+  font-weight: normal;
+  white-space: nowrap;
+  display: flex;
+  align-items: center;
+
+  h1,
+  h2,
+  h3,
+  h4,
+  h5,
+  h6 {
+    margin: 0;
+    font-weight: normal;
+    padding-bottom: 0;
+  }
+
+  svg,
+  i {
+    margin-right: ${e=>{var t;return(t=e.theme.sizes)==null?void 0:t.small}};
+  }
+`,be=d(s.List)`
+  list-style: none;
+  padding: 0;
+  margin: 0;
+  padding: ${e=>{var t;return(t=e.theme.sizes)==null?void 0:t.small}} 0;
+
+  li {
+    background: #fff;
+
+    a {
+      display: block;
+      font-size: ${e=>{var t;return(t=e.theme.fonts)==null?void 0:t.small}};
+      padding: ${e=>{var t,a;return`${(t=e.theme.sizes)==null?void 0:t.small} ${(a=e.theme.sizes)==null?void 0:a.normal}`}};
+      cursor: pointer;
+      color: #555;
+      text-decoration: none;
+
+      &:hover {
+        background: #f9f9f9;
+        color: ${e=>{var t;return(t=e.theme.colors)==null?void 0:t.primary}};
+      }
+    }
+  }
+`,we=({trigger:e,className:t,children:a,closeButtonAriaLabel:i,...o})=>n.jsx(s.Dropdown,{className:$.appendClassNames(t,"humany-dropdown-list"),closeButtonAriaLabel:i,trigger:e,children:n.jsx(je,{...o,children:a})}),je=d(s.ItemList)`
+  ${s.itemList}
+  font-family: ${e=>{var t;return(t=e.theme.fonts)==null?void 0:t.type}};
+  > div {
+    ${e=>{var t;return s.headingElement(e)("> h1",y.css`
+          font-size: ${(t=e.theme.fonts)==null?void 0:t.normal};
+          line-height: 1.2em;
+        `)}}
+  }
+  > ul > li {
+    overflow: visible;
+    font-weight: 300;
+    font-size: ${e=>{var t;return(t=e.theme.fonts)==null?void 0:t.normal}};
+
+    a {
+      display: inline-block;
+
+      @media (hover: hover) {
+        &:hover {
+          text-decoration: underline;
+        }
+      }
+    }
+  }
+`,M=e=>y.css`
+  ${e["data-loading"]&&"position: relative;"};
+  ${e["data-loading"]&&"min-height: 150px;"}
+  > * {
+    transition: 200ms ease-out opacity;
+    opacity: ${e["data-loading"]?"0.5":"1"};
+  }
+  .humany-loader {
+    opacity: ${e["data-loading"]?"1":"0"};
+  }
+`,ke=d(s.Icon)`
+  && {
+    font-size: ${e=>{var t;return(t=e.theme.fonts)==null?void 0:t.small}};
+  }
+  width: 1.2em;
+`,Se=d(s.Text)`
+  font-size: ${e=>{var t;return(t=e.theme.fonts)==null?void 0:t.medium}};
+  font-weight: normal;
+  line-height: 1.2em;
+  color: ${e=>{var t;return(t=e.theme.colors)==null?void 0:t.text}};
+`,E=d(s.Button)`
+  display: flex;
+  align-items: center;
+
+  ${e=>{var t;return e["data-has-label"]==="true"&&e["data-has-symbol"]==="true"&&`
+        svg, i    {
+            margin: 0 ${(t=e.theme.sizes)==null?void 0:t.small} 0 0;
+        }
+    `}}
+
+  &:focus-visible {
+    ${e=>e["data-has-label"]==="true"&&s.paddedBorderTabStyle}
+
+    svg, i {
+      ${e=>e["data-has-label"]==="false"&&e["data-has-symbol"]==="true"&&y.css`
+          ${s.paddedBorderTabStyle(e)}
+          box-sizing: content-box;
+        `}
+    }
+  }
+
+  span {
+    flex: 1;
+    font-weight: 300;
+  }
+`,H=({addFavoriteTooltip:e,removeFavoriteCancelLabel:t,removeFavoriteConfirmLabel:a,removeFavoriteHeader:i,removeFavoriteLabel:o,removeFavoriteTooltip:r,id:l,isFavorite:h,guideTitle:c,buttonLabel:m="",actions:{addFavorite:p,removeFavorite:f}})=>{const g=u.useCallback(()=>{f(l)},[l,f]),b=u.useCallback(()=>{p(l)},[l,p]),v=`${h?r:e}${c?`: "${c}"`:""}`;return h?n.jsx(s.Confirm,{trigger:n.jsxs(F,{className:"humany-favorite-button",title:v,"aria-label":v,"data-favorite":"true","data-has-label":m?"true":"false","data-has-symbol":"true",children:[n.jsx(s.SymbolBadge,{size:16,symbol:{type:"Svg",content:"star-empty"}}),m&&n.jsx(s.StyledText,{children:m})]}),onConfirm:g,cancelLabel:t,confirmLabel:a,header:i,text:o}):n.jsxs(F,{className:"humany-favorite-button",title:v,"aria-label":v,onClick:b,"data-favorite":"false","data-has-label":m?"true":"false","data-has-symbol":"true",children:[n.jsx(s.SymbolBadge,{size:16,symbol:{type:"Svg",content:"star-empty"}}),m&&n.jsx(s.StyledText,{children:m})]})},F=d(E)`
+  grid-area: favorite;
+
+  &:focus-visible {
+    svg {
+      ${e=>{var t,a;return e["data-favorite"]==="true"?`
+          fill: transparent;
+
+          path {
+            fill: transparent;
+          }
+        `:`
+          fill: ${(t=e.theme.colors)==null?void 0:t.text};
+
+          path {
+            fill: ${(a=e.theme.colors)==null?void 0:a.text};
+          }
+        `}}
+    }
+  }
+
+  ${e=>{var t,a,i,o,r,l,h;return((t=e.theme.colors)==null?void 0:t.text)&&y.css`
+      svg {
+        stroke: ${(a=e.theme.colors)==null?void 0:a.text};
+
+        path {
+          stroke: ${(i=e.theme.colors)==null?void 0:i.text};
+        }
+
+        ${e["data-favorite"]==="true"&&`
+          fill: ${(o=e.theme.colors)==null?void 0:o.text};
+
+          path {
+            fill: ${(r=e.theme.colors)==null?void 0:r.text};
+          }
+        `};
+      }
+
+      &:hover {
+        svg {
+          ${e["data-favorite"]==="true"?`
+          fill: transparent;
+
+          path {
+            fill: transparent;
+          }
+        `:`
+          fill: ${(l=e.theme.colors)==null?void 0:l.text};
+
+          path {
+            fill: ${(h=e.theme.colors)==null?void 0:h.text};
+          }
+        `};
+        }
+      }
+    `}}
+`,ze=u.forwardRef(({onFeedback:e=()=>{},direction:t="horizontal",className:a,header:i,positive:o,negative:r,selected:l,...h},c)=>n.jsxs(Ne,{className:$.appendClassNames(a,"humany-feedback"),"data-direction":t,...s.convertToStringAttributes(h),ref:c,children:[!!i&&n.jsx(Le,{children:i}),n.jsxs(P,{className:"humany-feedback-button",disabled:!!l,"data-selected":l==="positive","data-direction":t,onClick:()=>e("positive"),children:[n.jsx(s.Icon,{faIcon:"smile-o"}),n.jsx("span",{children:o})]}),n.jsxs(P,{className:"humany-feedback-button",disabled:!!l,"data-selected":l==="negative","data-direction":t,onClick:()=>e("negative"),children:[n.jsx(s.Icon,{faIcon:"frown-o"}),n.jsx("span",{children:r})]})]})),Le=d(s.StyledText)`
+  font-weight: normal;
+  margin: 0 0 ${e=>{var t;return(t=e.theme.sizes)==null?void 0:t.normal}};
+  font-size: ${e=>{var t;return(t=e.theme.fonts)==null?void 0:t.normal}};
+  display: block;
+`,P=d(s.Button)`
+  display: inline-block;
+  font-size: ${e=>{var t;return(t=e.theme.fonts)==null?void 0:t.normal}};
+  font-weight: 300;
+  && {
+    margin-right: ${e=>{var t;return(t=e.theme.sizes)==null?void 0:t.large}};
+  }
+
+  ${e=>{var t,a;return e["data-direction"]==="horizontal"&&y.css`
+      width: 225px;
+      max-width: calc(50% - ${(t=e.theme.sizes)==null?void 0:t.large} - ${(a=e.theme.sizes)==null?void 0:a.small});
+    `}}
+
+  ${e=>e["data-direction"]==="vertical"&&y.css`
+      min-width: 190px;
+    `}
+
+  ${e=>{var t,a;return((t=e.theme.colors)==null?void 0:t.primary)&&s.invertedHoverButton({active:e["data-selected"],primaryColor:(a=e.theme.colors)==null?void 0:a.primary,secondaryColor:"#FFFFFF",theme:e.theme})}}
+
+  i {
+    margin: 0 ${e=>{var t;return(t=e.theme.sizes)==null?void 0:t.small}} 0 0;
+  }
+`,Ne=d.div`
+  ${e=>{var t;return e["data-direction"]==="vertical"&&y.css`
+      > button {
+        width: 100%;
+        &:not(:last-child) {
+          margin-bottom: ${(t=e.theme.sizes)==null?void 0:t.normal};
+        }
+      }
+    `}}
+`,Ce=()=>{const[e,t]=u.useState(null),a=s.useKeyPress("ArrowLeft"),i=s.useKeyPress("ArrowRight"),o=s.useKeyPress("ArrowUp"),r=s.useKeyPress("ArrowDown"),l=()=>{t(a?"left":i?"right":o?"up":r?"down":null)};return u.useEffect(l,[a,i,o,r]),e},Te=(e,t)=>{const[a,i]=u.useState(e),o=u.useCallback(()=>setTimeout(()=>{i(e)},t),[t,i,e]);return u.useEffect(()=>{const r=o();return()=>{clearTimeout(r)}},[o]),a},O=()=>{const e=s.useContainer(),[t,a]=u.useState([]),i=e.get("favorites");u.useEffect(()=>{if(i){a(i.get());const{events:c}=e.get("$widget");return c.subscribe("widget:favorites-updated",(p,{updated:f})=>{a([...f])})}},[]);const o=c=>i?i.add(c):Promise.resolve([]),r=c=>i?i.remove(c):Promise.resolve([]),l=()=>i?i.clear():Promise.resolve([]),h=u.useCallback(c=>t.indexOf(c)>-1?r(c):o(c),[t]);return[t,u.useMemo(()=>({addFavorite:o,removeFavorite:r,clearFavorites:l,toggleFavorite:h}),[t])]},Ie=()=>{const[e,t]=u.useState(!1),a=u.useRef(),i=u.useCallback(()=>t(!0),[t]),o=u.useCallback(()=>t(!1),[t]);return s.useEventListener("mouseenter",i,a.current),s.useEventListener("mouseleave",o,a.current),[e,a]},W=({format:e=s.DateFormats.YYYY_MM_DD_HH_MM,className:t="",byLabel:a="",modifiedLabel:i="",publishedLabel:o="",modifiedBy:r="",publishedBy:l="",showModified:h=!1,showPublished:c=!1,modified:m,published:p})=>{const f=c&&p?n.jsx(A,{format:e,timestamp:p}):null,g=h&&m?n.jsx(A,{format:e,timestamp:m}):null;return!f&&!g?null:n.jsxs(N,{className:$.appendClassNames(t,"humany-metadata"),children:[f&&n.jsxs(N,{className:"humany-published",children:[o,f,a&&l&&` ${a.replace("{{editor}}",l)}`]}),g&&n.jsxs(N,{className:"humany-modified",children:[f&&", ",i,g,a&&r&&` ${a.replace("{{editor}}",r)}`]})]})},A=d(s.Timestamp)`
+  &:not(:first-child) {
+    margin-left: 4px;
+  }
+  &:not(:last-child) {
+    margin-right: 4px;
+  }
+`,N=d(s.Text)`
+  font-style: italic;
+`,De=({tags:e})=>e.filter(t=>t.symbol).length?n.jsx(Re,{className:"humany-guide-list-tags",items:e,renderItem:({id:t,symbol:a,title:i})=>a&&n.jsx("li",{"data-tag":t,children:n.jsx(Me,{size:18,symbol:a,title:i})},t)}):null,Be=u.forwardRef(({title:e,id:t,route:a,symbolSize:i,collapseUri:o,children:r},l)=>{const{params:h}=s.useRouteData();return n.jsxs(Fe,{ref:l,"data-guide":t,children:[n.jsx(s.TextLink,{"aria-expanded":!0,title:e,"aria-label":e,routeName:a,params:$.createParams({...h,uriName:o||void 0,id:void 0,guide:void 0,accordion:void 0}),text:e,children:n.jsx(s.SymbolBadge,{size:i,symbol:{type:"Svg",content:"caret-up"}})}),r]})}),Fe=d.li`
+  > a {
+    grid-column: 1/-1;
+    font-weight: bold;
+    margin: 0 0 ${e=>{var t;return(t=e.theme.sizes)==null?void 0:t.normal}} 0;
+  }
+
+  > div {
+    grid-column: 1/-1;
+  }
+`,Pe=u.forwardRef(({expandable:e=!1,routing:t={},paramMappers:a={},symbolSize:i=11,pageRole:o="link",pageCaret:r="down",showTags:l=!1,showFavoriteToggle:h=!1,localPaging:c=!1,onItemClick:m=()=>{},dispatch:p=()=>{},metadata:f={},pageLabel:g,className:b,children:v,items:w,renderItem:k,addFavoriteTooltip:_,removeFavoriteCancelLabel:K,removeFavoriteConfirmLabel:U,removeFavoriteHeader:G,removeFavoriteLabel:V,removeFavoriteTooltip:J,searchResultsEmptyLabel:Q,...T},X)=>{const Z=s.useIsTabbing(),z=u.useRef(),{guide:ee="guide",page:te="index"}=t,{guide:se=({id:x})=>$.createParams({guide:x}),page:I=()=>$.createParams()}=a,[ae,ne]=O(),ie=s.useContainer(),{events:oe}=ie.get("$widget");u.useImperativeHandle(X,()=>z.current);const L=x=>{const{id:j,title:S,tags:de,published:D,modified:B,publishedBy:me,modifiedBy:he}=x;return n.jsxs("li",{"data-guide":j,"has-metadata":(!!(f!=null&&f.showPublished)&&!!D||!!(f!=null&&f.showModified)&&!!B).toString(),children:[n.jsx(s.TextLink,{className:"humany-guide-link",routeName:ee,onClick:ue=>{m(ue,x),oe.dispatch("tracking:guide-list-item-clicked",{guide:x})},params:se(x),text:S,children:n.jsx(s.SymbolBadge,{size:i,symbol:{type:"Svg",content:e?"caret-down":"caret-right"}})}),h&&n.jsx(H,{guideTitle:S,addFavoriteTooltip:_,removeFavoriteCancelLabel:K,removeFavoriteConfirmLabel:U,removeFavoriteHeader:G,removeFavoriteLabel:V,removeFavoriteTooltip:J,isFavorite:ae.indexOf(j)>-1,actions:ne,id:j}),l&&n.jsx(De,{tags:de}),n.jsx(Ee,{...f,indent:e?void 0:i,modified:B,published:D,publishedBy:me,modifiedBy:he})]},j)},re=u.useCallback((x,j,S)=>k?k(x,j,S,L):L(x),[k,L]),le=u.useCallback(x=>{c&&(x.preventDefault(),p("page",I()))},[p,c]);u.useEffect(()=>{var j;const x=(j=z.current)==null?void 0:j.querySelector(".humany-guide-list > ul > li .humany-guide-link");x&&s.getHumanyIsTabbing()&&(x.focus(),s.setHumanyIsTabbing(!1))},[w]);const ce=!!Object.keys(f).filter(x=>typeof f[x]<"u").length;return n.jsxs(Ae,{className:$.appendClassNames(b,"humany-guide-list"),"data-item-count":w.length,items:w,renderItem:re,isTabbing:Z,expandable:e?"true":"false","grid-items":l||h||ce?"true":"false",...s.convertToStringAttributes(T),ref:z,children:[g?n.jsx(s.TextLink,{text:g,title:g,"aria-label":g,routeName:te,role:o,params:I(),onClick:le,children:n.jsx(s.SymbolBadge,{size:i,symbol:{type:"Svg",content:`caret-${r}`}})}):null,v,!T["data-loading"]&&w.length===0&&n.jsx("p",{children:Q})]})}),Ae=d(s.ItemList)`
+  ${s.itemList}
+  padding: ${e=>{var t;return(t=e.theme.sizes)==null?void 0:t.large}};
+  overflow: auto;
+  justify-content: flex-start;
+  white-space: nowrap;
+  font-weight: 300;
+  text-decoration: none;
+
+  > div {
+    ${e=>s.headingElement(e)("> h1",y.css`
+          white-space: pre-wrap;
+        `)}
+  }
+
+  > ul > li {
+    ${e=>{var t,a;return e["grid-items"]==="true"&&y.css`
+        display: grid;
+        grid-template-columns: auto 1fr 1fr;
+        gap: 0px 0px;
+        grid-template-areas: '. favorite tags';
+        align-items: center;
+
+        > button {
+          margin: 0 0 0 ${(t=e.theme.sizes)==null?void 0:t.small};
+
+          &[data-favorite='false'] {
+            ${e.isTabbing?"opacity: 0;":"display: none;"};
+            &:focus {
+              opacity: 1;
+            }
+          }
+        }
+
+        > span {
+          font-size: ${(a=e.theme.fonts)==null?void 0:a.small};
+        }
+
+        &:hover {
+          button[data-favorite='false'] {
+            display: flex;
+            justify-self: flex-start;
+          }
+        }
+
+        &[has-metadata='true'] {
+          grid-template-rows: 1fr 1fr;
+          grid-template-areas:
+            '. favorite tags'
+            'metadata metadata metadata';
+        }
+      `}}
+    > a {
+      color: ${e=>{var t;return(t=e.theme.colors)==null?void 0:t.primary}};
+      overflow: hidden;
+      text-overflow: ellipsis;
+      max-width: 100%;
+      display: inline-block;
+
+      svg {
+        margin: 0 calc(${e=>{var t;return(t=e.theme.sizes)==null?void 0:t.small}}*2) 0 0;
+        line {
+          stroke: ${e=>{var t;return(t=e.theme.colors)==null?void 0:t.primary}};
+        }
+      }
+
+      ${e=>{var t;return e.expandable==="true"&&y.css`
+          display: flex;
+          flex-direction: row-reverse;
+          justify-content: flex-end;
+          align-items: center;
+
+          span {
+            overflow: hidden;
+            text-overflow: ellipsis;
+          }
+
+          svg {
+            margin: 0 0 0 ${(t=e.theme.sizes)==null?void 0:t.small};
+          }
+        `}}
+
+      &:focus-visible {
+        ${s.borderTabStyle}
+        text-decoration: underline;
+      }
+
+      @media (hover: hover) {
+        &:hover {
+          text-decoration: underline;
+        }
+      }
+    }
+  }
+
+  > a {
+    color: ${e=>{var t;return(t=e.theme.colors)==null?void 0:t.text}};
+    margin: ${e=>{var t;return(t=e.theme.sizes)==null?void 0:t.normal}} 0 0;
+    align-self: flex-start;
+    align-items: center;
+    display: flex;
+
+    span {
+      text-decoration: underline;
+    }
+
+    svg {
+      margin: 0 calc(${e=>{var t;return(t=e.theme.sizes)==null?void 0:t.small}}*2) 0 0;
+      line {
+        stroke: ${e=>{var t;return(t=e.theme.colors)==null?void 0:t.text}};
+      }
+    }
+
+    &:focus-visible {
+      ${s.borderTabStyle}
+      text-decoration: underline;
+    }
+  }
+`,Re=d(s.List)`
+  ${s.list}
+  display: flex;
+  margin: 0 0 0 auto;
+  grid-area: tags;
+
+  li,
+  li:last-child {
+    margin: 0 0 0 ${e=>{var t;return(t=e.theme.sizes)==null?void 0:t.small}};
+    display: flex;
+    align-items: center;
+    justify-content: space-between;
+  }
+`,Me=d(s.SymbolBadge)`
+  display: block;
+  color: ${e=>{var t;return(t=e.theme.colors)==null?void 0:t.primary}};
+  ${e=>{if(e.symbol.type==="Uri")return`
+        width: ${e.size}px;
+        height: ${e.size}px;
+      `;if(e.symbol.type==="FontAwesome")return`
+        font-size: ${e.size}px;
+      `}}
+`,Ee=d(W)`
+  grid-area: metadata;
+  text-overflow: ellipsis;
+  overflow: hidden;
+  font-size: ${e=>{var t;return(t=e.theme.fonts)==null?void 0:t.small}};
+  ${e=>{var t;return typeof e.indent=="number"&&`text-indent: calc(${(t=e.theme.sizes)==null?void 0:t.small} * 2 + ${e.indent}px);`}}
+`,He=y.keyframes`
+  100% {
+    transform: rotate(360deg);
+  }
+`,Oe=y.keyframes`
+  0% {
+    stroke-dasharray: 1, 200;
+    stroke-dashoffset: 0;
+  }
+  50% {
+    stroke-dasharray: 89, 200;
+    stroke-dashoffset: -35px;
+  }
+  100% {
+    stroke-dasharray: 89, 200;
+    stroke-dashoffset: -124px;
+  }
+`,We=d.svg`
+  animation: ${He} 2s linear infinite;
+  height: 100%;
+  transform-origin: center center;
+  width: 100%;
+  position: absolute;
+  top: 0;
+  bottom: 0;
+  left: 0;
+  right: 0;
+  margin: auto;
+  transition: 200ms ease-out opacity;
+`,Y=d.div`
+  position: absolute;
+  top: 0;
+  bottom: 0;
+  left: 0;
+  right: 0;
+  height: 100%;
+  width: 100%;
+  pointer-events: ${e=>e["data-loading"]?"all":"none"};
+  display: flex;
+  flex-direction: column;
+  justify-content: center;
+  transition: 200ms ease-out opacity;
+  box-sizing: border-box;
+  overflow: hidden;
+
+  .humany-spinner-svg {
+    opacity: ${e=>e["data-loading"]?"1":"0"};
+  }
+`,Ye=d.div`
+  position: relative;
+  margin: 0 auto;
+  width: 100px;
+  &:before {
+    content: '';
+    display: block;
+    padding-top: 100%;
+  }
+`,qe=d.circle`
+  stroke-dasharray: 1, 200;
+  stroke-dashoffset: 0;
+  animation: ${Oe} 1.5s ease-in-out infinite;
+  stroke-linecap: round;
+  stroke: ${e=>{var t;return(t=e.theme.colors)==null?void 0:t.primary}};
+  stroke-width: 2px;
+`,q=({loading:e=!1})=>n.jsx(Y,{className:"humany-loader","data-loading":e,children:n.jsx(Ye,{className:"humany-spinner",children:n.jsx(We,{className:"humany-spinner-svg",viewBox:"25 25 50 50",children:n.jsx(qe,{cx:"50",cy:"50",r:"20",fill:"none","stroke-width":"2","stroke-miterlimit":"10"})})})}),_e=({className:e,showHeader:t,notificationList:a,loading:i,...o})=>{const[r,l]=u.useState(null),{id:h,title:c,symbol:m,notifications:p=[],defaultHeaderOptions:f={visible:!0}}=a||{};return!p.length&&!i?null:n.jsx(Ue,{...o,"data-loading":i,"data-show-header":typeof t=="boolean"?t:f.visible,className:$.appendClassNames(e,"humany-notification-list"),"data-notification-category":h,header:c,symbol:m,items:p,renderItem:({id:g,title:b,body:v,modified:w,expandable:k})=>n.jsx(Ge,{"data-notification":g,"data-expanded":k?r===g:!0,children:k?n.jsxs(n.Fragment,{children:[n.jsxs(Ke,{title:b,"aria-label":b,"aria-expanded":r===g,onClick:()=>l(r===g?null:g),children:[n.jsx("span",{children:b}),n.jsx(Ve,{size:11,symbol:{type:"Svg",content:`caret-${r===g?"up":"down"}`}})]}),n.jsx(R,{html:v}),w&&n.jsx(Je,{format:s.DateFormats.YYYY_MM_DD,timestamp:w})]}):n.jsx(R,{html:v})},g),children:n.jsx(q,{loading:i})})},Ke=d(s.Button)`
+  display: flex;
+  justify-content: space-between;
+  align-items: center;
+  width: 100%;
+  text-align: left;
+  svg,
+  i {
+    color: ${e=>{var t;return(t=e.theme.colors)==null?void 0:t.primary}};
+  }
+  span {
+    color: ${e=>{var t;return(t=e.theme.colors)==null?void 0:t.text}};
+    font-size: ${e=>{var t;return(t=e.theme.fonts)==null?void 0:t.normal}};
+    overflow: hidden;
+    text-overflow: ellipsis;
+    flex: 1;
+    white-space: nowrap;
+  }
+  &:focus-visible {
+    ${s.borderTabStyle}
+    span {
+      color: ${e=>{var t;return(t=e.theme.colors)==null?void 0:t.primary}};
+      text-decoration: underline;
+    }
+  }
+`,Ue=d(s.ItemList)`
+  ${M}
+  ${s.itemList}
+  overflow: hidden;
+  justify-content: flex-start;
+  padding: ${e=>{var t;return(t=e.theme.sizes)==null?void 0:t.large}};
+  ${e=>!e["data-show-header"]&&y.css`
+      > div {
+        ${s.headingElement(e)("h1",y.css`
+            display: none;
+          `)}
+      }
+    `}
+
+  @media (hover: hover) {
+    button:hover {
+      text-decoration: underline;
+    }
+  }
+`,R=d(s.Paragraph)`
+  ${s.genericHtml}
+  font-weight: 300;
+
+  p {
+    white-space: normal;
+  }
+`,Ge=d.li`
+  .humany-paragraph {
+    display: none;
+    &:not(:only-child) {
+      ${e=>{var t,a,i;return((t=e.theme.sizes)==null?void 0:t.cardinal)&&((a=e.theme.sizes)==null?void 0:a.normal)&&y.css`
+          margin: ${(i=e.theme.sizes)==null?void 0:i.normal} 0;
+        `}}
+    }
+  }
+
+  ${e=>e["data-expanded"]&&y.css`
+      .humany-paragraph {
+        display: block;
+      }
+    `}
+
+  > span {
+    display: block;
+    font-weight: 300;
+    color: ${e=>{var t;return(t=e.theme.colors)==null?void 0:t.accent}};
+  }
+`,Ve=d(s.SymbolBadge)`
+  margin: 0 0 0 ${e=>{var t;return(t=e.theme.sizes)==null?void 0:t.small}};
+  line {
+    stroke: ${e=>{var t;return(t=e.theme.colors)==null?void 0:t.primary}};
+  }
+`,Je=d(s.Timestamp)`
+  font-size: ${e=>{var t;return(t=e.theme.fonts)==null?void 0:t.small}};
+  font-weight: 300;
+`,Qe=e=>new RegExp("^#","i").test(e),Xe=e=>({children:t,...a})=>{const{implementation:i,name:o}=e.get("$widget"),{href:r=""}=a;if(Qe(r))return n.jsx(s.AnchorLink,{smooth:!0,to:r,children:t});const l=i.bindings.map(m=>m.replace(/\./g,"\\.")).join("|"),c=new RegExp(`^((http[s]?:)?//)?(${l})/([^\\s]+)`).exec(r);if(c&&c.length>=4){const m=c[4];if(i.widgets.get(m)&&!m.startsWith("blob?")&&!m.startsWith(o))return n.jsx(s.WidgetLink,{widgetName:m,children:t})}return n.jsx("a",{...a,children:t})},Ze=(e,t=[])=>({transform:{a:a=>{const{children:i,...o}=a,r=o["data-target"];if(r&&t.length){const h=t.find(({connection:c})=>c===r);if(h)return n.jsx(C,{...h,children:i})}return Xe(e)(a)}}});exports.AccordionListItem=Be;exports.DialogLink=C;exports.DialogList=fe;exports.DrawerList=pe;exports.DropdownActions=ye;exports.DropdownList=we;exports.FavoriteButton=H;exports.Feedback=ze;exports.GuideList=Pe;exports.Loader=q;exports.LoaderWrapper=Y;exports.Metadata=W;exports.NotificationList=_e;exports.SmallCaret=ke;exports.StyledHeaderText=Se;exports.StyledListButton=E;exports.guideRenderInstructions=Ze;exports.loadingOpacity=M;exports.useArrowKeys=Ce;exports.useDebounce=Te;exports.useFavorites=O;exports.useHover=Ie;Object.keys(s).forEach(e=>{e!=="default"&&!Object.prototype.hasOwnProperty.call(exports,e)&&Object.defineProperty(exports,e,{enumerable:!0,get:()=>s[e]})});