@helsenorge/designsystem-react 1.3.1 → 1.4.0

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,2 @@
1
+ import{_ as e,d as t}from"./_rollupPluginBabelHelpers-0f007973.js";import a,{useState as n,useEffect as l}from"react";import{c as o}from"./index-d1c0552c.js";import r from"./components/Panel/styles.module.scss";import{T as s}from"./Title-01820508.js";import{B as i}from"./Button-b55b2d27.js";import{A as c,I as m}from"./constants-dbdea596.js";import{I as d}from"./Icon-d69d65b3.js";import{C as u}from"./ChevronDown-2b3daace.js";import{C as p}from"./ChevronUp-dfafe27b.js";import{A as f}from"./ArrowRight-43c97f7a.js";import{A as b}from"./AlertSignFill-5df5b7c7.js";import{p as v}from"./palette-f206f488.js";import{P as y}from"./Pencil-dd3fe667.js";import{C as _}from"./Calendar-a9aa98de.js";import{W as g}from"./Watch-3d5fc351.js";import{u as E,B as h}from"./useBreakpoint-a74f5af5.js";import{u as j}from"./useUuid-3b1e73f2.js";import{u as w}from"./usePrevious-ae293b10.js";import{g as N}from"./accessibility-71f045ab.js";import{B as k}from"./Badge-eebcb720.js";var I,B,C;!function(e){e.normal="normal",e.new="new",e.error="error",e.draft="draft"}(I||(I={})),function(e){e.fill="fill",e.white="white",e.stroke="stroke",e.line="line"}(B||(B={})),function(e){e.layout1="layout1",e.layout2="layout2",e.layout3a="layout3a",e.layout3b="layout3b",e.layout3c="layout3c"}(C||(C={}));var x=function(e){var n=e.status,l=e.statusMessage,s=o(r["status-message"],t({},r["status-message--new"],n===I.new));return n!==I.error&&n!==I.draft||!l?null:a.createElement("div",{className:s,"data-testid":"display-status"},a.createElement(d,Object.assign({},n===I.error?{color:v.cherry500,svgIcon:b}:{color:v.black,svgIcon:y},{size:m.XSmall}))," ",a.createElement("span",null,l))},A=function(e){var t=e.date,n=e.time;return t||n?a.createElement("div",{className:r["datetime-container"],"data-testid":"datetime"},t&&a.createElement("div",{className:r["datetime-container__icon"]},a.createElement(d,{svgIcon:_,size:m.XSmall}),a.createElement("span",null,t)),n&&a.createElement("div",{className:r["datetime-container__icon"]},a.createElement(d,{svgIcon:g,size:m.XSmall}),a.createElement("span",null,n))):null},S=a.forwardRef((function(m,b){var v,y,_,g,S,M,P=m.children,O=m.contentA,T=m.contentB,z=m.className,H=m.testId,R=m.title,W=m.titleHtmlMarkup,X=void 0===W?"h2":W,L=m.url,U=m.target,D=void 0===U?"_self":U,F=m.icon,q=m.iconRight,G=void 0!==q&&q,J=m.variant,K=void 0===J?B.fill:J,Q=m.status,V=void 0===Q?I.normal:Q,Y=m.statusMessage,Z=m.buttonText,$=void 0===Z?"Se detaljer":Z,ee=m.buttonTextClose,te=void 0===ee?"Skjul detaljer":ee,ae=m.buttonAriaLabelledById,ne=m.buttonAriaLabel,le=m.layout,oe=void 0===le?C.layout2:le,re=m.containerAsButton,se=void 0!==re&&re,ie=m.date,ce=m.time,me=m.noTopBorder,de=m.buttonOnClick,ue=m.buttonHtmlMarkup,pe=void 0===ue?"a":ue,fe=m.expanded,be=void 0!==fe&&fe,ve=m.onExpand,ye=m.renderChildrenWhenClosed,_e=void 0!==ye&&ye,ge=n(be),Ee=e(ge,2),he=Ee[0],je=Ee[1],we=w(he),Ne=j(),ke=j(),Ie=E();l((function(){be!==he&&je(be)}),[be]),l((function(){ve&&he!==!!we&&ve(he)}),[he,ve]);var Be,Ce,xe=[C.layout3a.toString(),C.layout3b.toString(),C.layout3c.toString()].includes(oe),Ae=o(r["panel-wrapper"],z),Se=o(r.panel,(t(v={},r["panel--fill"],K===B.fill),t(v,r["panel--stroke"],K===B.stroke),t(v,r["panel--white"],K===B.white),t(v,r["panel--line"],K===B.line),t(v,r["panel--no-top-border"],K===B.line&&me),t(v,r["panel--selected"],he),t(v,r["panel--new"],V===I.new),t(v,r["panel--draft"],V===I.draft),t(v,r["panel--error"],V===I.error),t(v,r["panel--status"],V&&V!==I.normal),t(v,r["panel--with-icon"],F),t(v,r["panel--button"],se),t(v,r["panel--clickable"],P||L||ve||de||se),v)),Me=o((t(y={},r.panel__container,oe===C.layout2&&T),t(y,r["panel__container--layout3"],xe&&T),t(y,r["panel__container--grow"],F),y)),Pe=o((t(_={},r["panel-content-a"],oe===C.layout2),t(_,r["panel-content-a--layout3a"],oe===C.layout3a),t(_,r["panel-content-a--layout3b"],oe===C.layout3b),t(_,r["panel-content-a--layout3c"],oe===C.layout3c),_)),Oe=o((t(g={},r["panel__content-right--layout1"],T&&oe===C.layout1),t(g,r["panel__content-right--layout2"],T&&oe===C.layout2),t(g,r["panel__content-right--layout3"],T&&xe),t(g,r["panel__content-right--layout3a"],T&&oe===C.layout3a),t(g,r["panel__content-right--layout3b"],T&&oe===C.layout3b),t(g,r["panel__content-right--layout3c"],T&&oe===C.layout3c),g)),Te=o(r["panel-content-b"],(t(S={},r["panel-content-b--layout1"],oe===C.layout1),t(S,r["panel-content-b--layout3"],xe),S)),ze=o(r["panel__details-btn"]),He=o(r["panel__btn-container"],(t(M={},r["panel__btn-container--layout3"],xe),t(M,r["panel__btn-container--padding-top"],T),M));return a.createElement("div",{ref:b,"data-testid":H,className:Ae,"data-analyticsid":c.Panel},a.createElement("div",{className:Se},F&&!G&&a.createElement("div",{className:r.panel__icon},F),a.createElement("div",{className:Me},a.createElement("div",{className:Pe},a.createElement(x,{status:V,statusMessage:Y}),R&&a.createElement("div",{className:r["panel-content-a__title-container"]},a.createElement(s,{appearance:"title3",htmlMarkup:X,id:Ne},R),Y&&V===I.new&&a.createElement(k,{color:"blueberry",testId:"badge-status",className:r.panel__badge},Y)),O,Ie>=h.lg&&a.createElement(A,{date:ie,time:ce})),a.createElement("div",{className:Oe},T&&a.createElement("div",{className:Te},T),(P||L||ie||ce||de)&&a.createElement("div",{className:He},Ie<h.lg&&a.createElement(A,{date:ie,time:ce}),(P||L||de)&&a.createElement("div",{className:ze},(Be=N({label:ne,id:ae&&"".concat(ke," ").concat(ae)||R&&Ne&&"".concat(ke," ").concat(Ne)}),Ce=Object.assign({onClick:de||function(){return je(!he)},className:se?r.panel__expand:void 0,variant:"borderless",ellipsis:!0},Be),P?a.createElement(i,Object.assign({testId:"expand","aria-expanded":he},Ce),a.createElement("span",{id:ke},he?te:$),a.createElement(d,{svgIcon:he?p:u})):a.createElement(i,Object.assign({testId:"url",htmlMarkup:pe,href:L,target:D},Ce),a.createElement("span",{id:ke},$),a.createElement(d,{svgIcon:f}))))))),F&&G&&a.createElement("div",{className:r["panel__icon--right"]},F)),function(){var e;if(!P)return null;if(!_e&&!he)return null;var n=o(r["panel-details"],(t(e={},r["panel-details--open"],he),t(e,r["panel-details--line"],K===B.line),t(e,r["panel-details--white"],K===B.white),t(e,r["panel-details--with-icon"],F),e));return a.createElement("div",{className:n,"data-testid":"panel-details"},a.createElement("div",null,P))}())}));export{S as P,I as a,B as b,C as c};
2
+ //# sourceMappingURL=Panel-79591ae3.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"Panel-79591ae3.js","sources":[],"sourcesContent":[],"names":[],"mappings":""}
@@ -0,0 +1,2 @@
1
+ var a=function(a){var l=a.label,r=a.id;return r?{"aria-labelledby":r}:l?{"aria-label":l}:void 0};export{a as g};
2
+ //# sourceMappingURL=accessibility-71f045ab.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"accessibility-71f045ab.js","sources":[],"sourcesContent":[],"names":[],"mappings":""}
@@ -1,2 +1,2 @@
1
- import{_ as e}from"../../_rollupPluginBabelHelpers-0f007973.js";import t,{useState as r,useRef as n,useEffect as a}from"react";import{I as o}from"../../Icon-d69d65b3.js";import{Z as s,A as i,I as d}from"../../constants-dbdea596.js";import{u as c}from"../../useHover-18479690.js";import{u as l}from"../../usePrevious-ae293b10.js";import p from"./styles.module.scss";import{c as m}from"../../index-d1c0552c.js";import{C as u}from"../../ChevronDown-2b3daace.js";import{C as _}from"../../ChevronUp-dfafe27b.js";import{B as f}from"../../Button-b55b2d27.js";import{a as x}from"../../useSticky-432642c9.js";import"../../_tslib-b219470a.js";import"../../useUuid-3b1e73f2.js";import"../../uuid-11037462.js";import"../../color-e7d082c1.js";import"../../index-d1c9177a.js";import"../../palette-f206f488.js";import"../../grid-c105cad1.js";import"../../Loader-896f633b.js";import"../Loader/styles.module.scss";import"../../useBreakpoint-a74f5af5.js";import"../Button/styles.module.scss";var g;!function(e){e.small="small",e.large="large"}(g||(g={}));var v=function(v){var b=v.title,j=v.children,E=v.size,y=void 0===E?g.small:E,I=v.color,h=v.svgIcon,C=v.expanded,k=void 0!==C&&C,N=v.noNestedLine,H=void 0!==N&&N,z=v.sticky,B=void 0!==z&&z,w=v.testId,L=v.onExpand,S=v.renderChildrenWhenClosed,W=void 0!==S&&S,X=r(k),P=e(X,2),T=P[0],U=P[1],A=l(T),D=n(null),O=n(null),Z=c(O).isHovered,q=x(D,O),F=q.isOutsideWindow,G=q.isLeavingWindow,J=q.offsetHeight,K=q.contentWidth,M=B&&T&&F;a((function(){k!==T&&U(k)}),[k]),a((function(){L&&T!==!!A&&L(T)}),[T,L]);var Q=function(e){return t.createElement("span",{className:m(p.expander__icon,p["expander__icon--".concat(e)])},t.createElement(o,{svgIcon:T?_:u,size:d.XSmall,isHovered:Z}))},R=m(p.expander__trigger,p["expander__trigger--".concat(y)],y===g.large&&p["expander__trigger--".concat(I||"neutral")],y===g.large&&h&&p["expander__trigger--icon"],T&&p["expander__trigger--expanded"],M&&!G&&p["expander__trigger--sticky"],M&&G&&p["expander__trigger--absolute"]),V=m(p.expander__button,T&&p["expander__button--expanded"],M&&!G&&p["expander__button--sticky"],M&&G&&p["expander__button--absolute"]);return t.createElement("div",{className:p.expander,ref:D,style:{paddingTop:M&&J?"".concat(J,"px"):void 0}},y===g.large?t.createElement("button",{type:"button",className:R,style:{zIndex:Z||M?s.ExpanderTrigger:void 0,width:M&&K?"".concat(K,"px"):void 0},"aria-expanded":T,ref:O,onClick:function(){return U(!T)},"data-testid":w,"data-analyticsid":i.Expander},y===g.small&&Q("left"),h&&t.createElement("span",{className:m(p.expander__icon,p["expander__icon--left"])},t.createElement(o,{svgIcon:h,size:d.XSmall,isHovered:Z})),b,y===g.large&&Q("right")):t.createElement(f,{variant:"borderless",className:V,"aria-expanded":T,ref:O,onClick:function(){return U(!T)},testId:w,"data-analyticsid":i.Expander},t.createElement(o,{svgIcon:T?_:u,size:d.XSmall}),b),function(){if(!W&&!T)return null;var e=m(p.expander__content,p["expander__content--".concat(y)],y===g.large&&p["expander__content--".concat(I||"neutral")],y===g.large&&h&&p["expander__content--icon"],T&&p["expander__content--expanded"],y===g.small&&!H&&p["expander__content--nested-line"]);return t.createElement("div",{className:e},j)}())};export{g as ExpanderSize,v as default};
1
+ import{_ as e}from"../../_rollupPluginBabelHelpers-0f007973.js";import t,{useState as r,useRef as n,useEffect as a}from"react";import{I as o}from"../../Icon-d69d65b3.js";import{Z as s,A as i,I as d}from"../../constants-dbdea596.js";import{u as c}from"../../useHover-18479690.js";import{u as l}from"../../usePrevious-ae293b10.js";import p from"./styles.module.scss";import{c as m}from"../../index-d1c0552c.js";import{C as u}from"../../ChevronDown-2b3daace.js";import{C as _}from"../../ChevronUp-dfafe27b.js";import{B as f}from"../../Button-b55b2d27.js";import{a as x}from"../../useSticky-f8ffc6d8.js";import"../../_tslib-b219470a.js";import"../../useUuid-3b1e73f2.js";import"../../uuid-11037462.js";import"../../color-e7d082c1.js";import"../../index-d1c9177a.js";import"../../palette-f206f488.js";import"../../grid-c105cad1.js";import"../../Loader-896f633b.js";import"../Loader/styles.module.scss";import"../../useBreakpoint-a74f5af5.js";import"../Button/styles.module.scss";import"../../debounce-fb23662f.js";var g;!function(e){e.small="small",e.large="large"}(g||(g={}));var v=function(v){var b=v.title,j=v.children,E=v.size,y=void 0===E?g.small:E,I=v.color,h=v.svgIcon,C=v.expanded,k=void 0!==C&&C,N=v.noNestedLine,H=void 0!==N&&N,z=v.sticky,B=void 0!==z&&z,w=v.testId,L=v.onExpand,S=v.renderChildrenWhenClosed,W=void 0!==S&&S,X=r(k),P=e(X,2),T=P[0],U=P[1],A=l(T),D=n(null),O=n(null),Z=c(O).isHovered,q=x(D,O),F=q.isOutsideWindow,G=q.isLeavingWindow,J=q.offsetHeight,K=q.contentWidth,M=B&&T&&F;a((function(){k!==T&&U(k)}),[k]),a((function(){L&&T!==!!A&&L(T)}),[T,L]);var Q=function(e){return t.createElement("span",{className:m(p.expander__icon,p["expander__icon--".concat(e)])},t.createElement(o,{svgIcon:T?_:u,size:d.XSmall,isHovered:Z}))},R=m(p.expander__trigger,p["expander__trigger--".concat(y)],y===g.large&&p["expander__trigger--".concat(I||"neutral")],y===g.large&&h&&p["expander__trigger--icon"],T&&p["expander__trigger--expanded"],M&&!G&&p["expander__trigger--sticky"],M&&G&&p["expander__trigger--absolute"]),V=m(p.expander__button,T&&p["expander__button--expanded"],M&&!G&&p["expander__button--sticky"],M&&G&&p["expander__button--absolute"]);return t.createElement("div",{className:p.expander,ref:D,style:{paddingTop:M&&J?"".concat(J,"px"):void 0}},y===g.large?t.createElement("button",{type:"button",className:R,style:{zIndex:Z||M?s.ExpanderTrigger:void 0,width:M&&K?"".concat(K,"px"):void 0},"aria-expanded":T,ref:O,onClick:function(){return U(!T)},"data-testid":w,"data-analyticsid":i.Expander},y===g.small&&Q("left"),h&&t.createElement("span",{className:m(p.expander__icon,p["expander__icon--left"])},t.createElement(o,{svgIcon:h,size:d.XSmall,isHovered:Z})),b,y===g.large&&Q("right")):t.createElement(f,{variant:"borderless",className:V,"aria-expanded":T,ref:O,onClick:function(){return U(!T)},testId:w,"data-analyticsid":i.Expander},t.createElement(o,{svgIcon:T?_:u,size:d.XSmall}),b),function(){if(!W&&!T)return null;var e=m(p.expander__content,p["expander__content--".concat(y)],y===g.large&&p["expander__content--".concat(I||"neutral")],y===g.large&&h&&p["expander__content--icon"],T&&p["expander__content--expanded"],y===g.small&&!H&&p["expander__content--nested-line"]);return t.createElement("div",{className:e},j)}())};export{g as ExpanderSize,v as default};
2
2
  //# sourceMappingURL=index.js.map
@@ -1,12 +1,6 @@
1
- import React, { AriaAttributes } from 'react';
1
+ import React from 'react';
2
2
  export declare type NotificationPanelVariants = 'info' | 'warn' | 'alert' | 'crisis';
3
3
  export declare type NotificationPanelSizes = 'small' | 'medium' | 'large';
4
- interface AriaLabelAttributesConfig {
5
- label?: string;
6
- id?: string;
7
- }
8
- declare type AriaLabelAttributes = Pick<AriaAttributes, 'aria-label' | 'aria-labelledby'>;
9
- export declare const getAriaLabelAttributes: (config: AriaLabelAttributesConfig) => AriaLabelAttributes | undefined;
10
4
  interface NotificationPanelProps {
11
5
  /** Adds custom classes to the element. */
12
6
  className?: string;
@@ -1 +1 @@
1
- {"version":3,"file":"NotificationPanel.d.ts","sourceRoot":"","sources":["../../../src/components/NotificationPanel/NotificationPanel.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAAE,cAAc,EAAE,MAAM,OAAO,CAAC;AAa9C,oBAAY,yBAAyB,GAAG,MAAM,GAAG,MAAM,GAAG,OAAO,GAAG,QAAQ,CAAC;AAC7E,oBAAY,sBAAsB,GAAG,OAAO,GAAG,QAAQ,GAAG,OAAO,CAAC;AAUlE,UAAU,yBAAyB;IACjC,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,EAAE,CAAC,EAAE,MAAM,CAAC;CACb;AAED,aAAK,mBAAmB,GAAG,IAAI,CAAC,cAAc,EAAE,YAAY,GAAG,iBAAiB,CAAC,CAAC;AAElF,eAAO,MAAM,sBAAsB,WAAY,yBAAyB,KAAG,mBAAmB,GAAG,SAahG,CAAC;AAEF,UAAU,sBAAsB;IAC9B,0CAA0C;IAC1C,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,iCAAiC;IACjC,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAC3B,mEAAmE;IACnE,OAAO,CAAC,EAAE,yBAAyB,CAAC;IACpC,0DAA0D;IAC1D,MAAM,CAAC,EAAE,OAAO,CAAC;IACjB,mDAAmD;IACnD,IAAI,CAAC,EAAE,sBAAsB,CAAC;IAC9B,sFAAsF;IACtF,OAAO,CAAC,EAAE,CAAC,CAAC,CAAC,EAAE,KAAK,CAAC,UAAU,CAAC,WAAW,EAAE,UAAU,CAAC,KAAK,IAAI,CAAC;IAClE,8FAA8F;IAC9F,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB,6EAA6E;IAC7E,KAAK,CAAC,EAAE,OAAO,CAAC;IAChB,+CAA+C;IAC/C,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,8BAA8B;IAC9B,iBAAiB,CAAC,EAAE,MAAM,CAAC;IAC3B,sCAAsC;IACtC,MAAM,CAAC,EAAE,MAAM,CAAC;CACjB;AAiBD,QAAA,MAAM,iBAAiB,+FAqDrB,CAAC;AAEH,eAAe,iBAAiB,CAAC"}
1
+ {"version":3,"file":"NotificationPanel.d.ts","sourceRoot":"","sources":["../../../src/components/NotificationPanel/NotificationPanel.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAc1B,oBAAY,yBAAyB,GAAG,MAAM,GAAG,MAAM,GAAG,OAAO,GAAG,QAAQ,CAAC;AAC7E,oBAAY,sBAAsB,GAAG,OAAO,GAAG,QAAQ,GAAG,OAAO,CAAC;AAUlE,UAAU,sBAAsB;IAC9B,0CAA0C;IAC1C,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,iCAAiC;IACjC,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAC3B,mEAAmE;IACnE,OAAO,CAAC,EAAE,yBAAyB,CAAC;IACpC,0DAA0D;IAC1D,MAAM,CAAC,EAAE,OAAO,CAAC;IACjB,mDAAmD;IACnD,IAAI,CAAC,EAAE,sBAAsB,CAAC;IAC9B,sFAAsF;IACtF,OAAO,CAAC,EAAE,CAAC,CAAC,CAAC,EAAE,KAAK,CAAC,UAAU,CAAC,WAAW,EAAE,UAAU,CAAC,KAAK,IAAI,CAAC;IAClE,8FAA8F;IAC9F,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB,6EAA6E;IAC7E,KAAK,CAAC,EAAE,OAAO,CAAC;IAChB,+CAA+C;IAC/C,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,8BAA8B;IAC9B,iBAAiB,CAAC,EAAE,MAAM,CAAC;IAC3B,sCAAsC;IACtC,MAAM,CAAC,EAAE,MAAM,CAAC;CACjB;AAiBD,QAAA,MAAM,iBAAiB,+FAqDrB,CAAC;AAEH,eAAe,iBAAiB,CAAC"}
@@ -1,17 +1,221 @@
1
1
  {
2
2
  "props": {
3
+ "className": {
4
+ "defaultValue": null,
5
+ "description": "Adds custom classes to the element.",
6
+ "name": "className",
7
+ "parent": {
8
+ "fileName": "src/components/NotificationPanel/NotificationPanel.tsx",
9
+ "name": "NotificationPanelProps"
10
+ },
11
+ "declarations": [
12
+ {
13
+ "fileName": "src/components/NotificationPanel/NotificationPanel.tsx",
14
+ "name": "NotificationPanelProps"
15
+ }
16
+ ],
17
+ "required": false,
18
+ "type": {
19
+ "name": "string"
20
+ }
21
+ },
22
+ "children": {
23
+ "defaultValue": null,
24
+ "description": "Adds inner child elements.",
25
+ "name": "children",
26
+ "parent": {
27
+ "fileName": "src/components/NotificationPanel/NotificationPanel.tsx",
28
+ "name": "NotificationPanelProps"
29
+ },
30
+ "declarations": [
31
+ {
32
+ "fileName": "src/components/NotificationPanel/NotificationPanel.tsx",
33
+ "name": "NotificationPanelProps"
34
+ }
35
+ ],
36
+ "required": false,
37
+ "type": {
38
+ "name": "ReactNode"
39
+ }
40
+ },
41
+ "variant": {
42
+ "defaultValue": null,
43
+ "description": "Changes the visual representation of the notification panel.",
44
+ "name": "variant",
45
+ "parent": {
46
+ "fileName": "src/components/NotificationPanel/NotificationPanel.tsx",
47
+ "name": "NotificationPanelProps"
48
+ },
49
+ "declarations": [
50
+ {
51
+ "fileName": "src/components/NotificationPanel/NotificationPanel.tsx",
52
+ "name": "NotificationPanelProps"
53
+ }
54
+ ],
55
+ "required": false,
56
+ "type": {
57
+ "name": "enum",
58
+ "raw": "NotificationPanelVariants | undefined",
59
+ "value": [
60
+ {
61
+ "value": "undefined"
62
+ },
63
+ {
64
+ "value": "\"info\""
65
+ },
66
+ {
67
+ "value": "\"warn\""
68
+ },
69
+ {
70
+ "value": "\"alert\""
71
+ },
72
+ {
73
+ "value": "\"crisis\""
74
+ }
75
+ ]
76
+ }
77
+ },
78
+ "shadow": {
79
+ "defaultValue": null,
80
+ "description": "Adds a shadow effect around the notification panel.",
81
+ "name": "shadow",
82
+ "parent": {
83
+ "fileName": "src/components/NotificationPanel/NotificationPanel.tsx",
84
+ "name": "NotificationPanelProps"
85
+ },
86
+ "declarations": [
87
+ {
88
+ "fileName": "src/components/NotificationPanel/NotificationPanel.tsx",
89
+ "name": "NotificationPanelProps"
90
+ }
91
+ ],
92
+ "required": false,
93
+ "type": {
94
+ "name": "boolean"
95
+ }
96
+ },
97
+ "size": {
98
+ "defaultValue": null,
99
+ "description": "Sets a fixed size for the content container.",
100
+ "name": "size",
101
+ "parent": {
102
+ "fileName": "src/components/NotificationPanel/NotificationPanel.tsx",
103
+ "name": "NotificationPanelProps"
104
+ },
105
+ "declarations": [
106
+ {
107
+ "fileName": "src/components/NotificationPanel/NotificationPanel.tsx",
108
+ "name": "NotificationPanelProps"
109
+ }
110
+ ],
111
+ "required": false,
112
+ "type": {
113
+ "name": "enum",
114
+ "raw": "NotificationPanelSizes | undefined",
115
+ "value": [
116
+ {
117
+ "value": "undefined"
118
+ },
119
+ {
120
+ "value": "\"small\""
121
+ },
122
+ {
123
+ "value": "\"medium\""
124
+ },
125
+ {
126
+ "value": "\"large\""
127
+ }
128
+ ]
129
+ }
130
+ },
131
+ "onClick": {
132
+ "defaultValue": null,
133
+ "description": "Used in combination with dismissiable property to close the notification panel.",
134
+ "name": "onClick",
135
+ "parent": {
136
+ "fileName": "src/components/NotificationPanel/NotificationPanel.tsx",
137
+ "name": "NotificationPanelProps"
138
+ },
139
+ "declarations": [
140
+ {
141
+ "fileName": "src/components/NotificationPanel/NotificationPanel.tsx",
142
+ "name": "NotificationPanelProps"
143
+ }
144
+ ],
145
+ "required": false,
146
+ "type": {
147
+ "name": "((e?: MouseEvent<HTMLElement, MouseEvent>) => void) | undefined"
148
+ }
149
+ },
150
+ "dismissable": {
151
+ "defaultValue": null,
152
+ "description": "Toggles the close button in the top right corner. Will only show if there are children.",
153
+ "name": "dismissable",
154
+ "parent": {
155
+ "fileName": "src/components/NotificationPanel/NotificationPanel.tsx",
156
+ "name": "NotificationPanelProps"
157
+ },
158
+ "declarations": [
159
+ {
160
+ "fileName": "src/components/NotificationPanel/NotificationPanel.tsx",
161
+ "name": "NotificationPanelProps"
162
+ }
163
+ ],
164
+ "required": false,
165
+ "type": {
166
+ "name": "boolean"
167
+ }
168
+ },
169
+ "fluid": {
170
+ "defaultValue": null,
171
+ "description": "Enables a fluid outer container that spans the entire width of parent.",
172
+ "name": "fluid",
173
+ "parent": {
174
+ "fileName": "src/components/NotificationPanel/NotificationPanel.tsx",
175
+ "name": "NotificationPanelProps"
176
+ },
177
+ "declarations": [
178
+ {
179
+ "fileName": "src/components/NotificationPanel/NotificationPanel.tsx",
180
+ "name": "NotificationPanelProps"
181
+ }
182
+ ],
183
+ "required": false,
184
+ "type": {
185
+ "name": "boolean"
186
+ }
187
+ },
3
188
  "label": {
4
189
  "defaultValue": null,
5
- "description": "",
190
+ "description": "Sets a label for the notification panel.",
6
191
  "name": "label",
7
192
  "parent": {
8
193
  "fileName": "src/components/NotificationPanel/NotificationPanel.tsx",
9
- "name": "AriaLabelAttributesConfig"
194
+ "name": "NotificationPanelProps"
195
+ },
196
+ "declarations": [
197
+ {
198
+ "fileName": "src/components/NotificationPanel/NotificationPanel.tsx",
199
+ "name": "NotificationPanelProps"
200
+ }
201
+ ],
202
+ "required": false,
203
+ "type": {
204
+ "name": "string"
205
+ }
206
+ },
207
+ "ariaLabelCloseBtn": {
208
+ "defaultValue": null,
209
+ "description": "Close button aria-label",
210
+ "name": "ariaLabelCloseBtn",
211
+ "parent": {
212
+ "fileName": "src/components/NotificationPanel/NotificationPanel.tsx",
213
+ "name": "NotificationPanelProps"
10
214
  },
11
215
  "declarations": [
12
216
  {
13
217
  "fileName": "src/components/NotificationPanel/NotificationPanel.tsx",
14
- "name": "AriaLabelAttributesConfig"
218
+ "name": "NotificationPanelProps"
15
219
  }
16
220
  ],
17
221
  "required": false,
@@ -19,18 +223,18 @@
19
223
  "name": "string"
20
224
  }
21
225
  },
22
- "id": {
226
+ "testId": {
23
227
  "defaultValue": null,
24
- "description": "",
25
- "name": "id",
228
+ "description": "Sets the data-testid attribute.",
229
+ "name": "testId",
26
230
  "parent": {
27
231
  "fileName": "src/components/NotificationPanel/NotificationPanel.tsx",
28
- "name": "AriaLabelAttributesConfig"
232
+ "name": "NotificationPanelProps"
29
233
  },
30
234
  "declarations": [
31
235
  {
32
236
  "fileName": "src/components/NotificationPanel/NotificationPanel.tsx",
33
- "name": "AriaLabelAttributesConfig"
237
+ "name": "NotificationPanelProps"
34
238
  }
35
239
  ],
36
240
  "required": false,
@@ -1,2 +1,2 @@
1
- import{d as e}from"../../_rollupPluginBabelHelpers-0f007973.js";import a from"react";import{c as o}from"../../index-d1c0552c.js";import i from"./styles.module.scss";import{C as t}from"../../Close-08d48540.js";import{A as r}from"../../constants-dbdea596.js";import{u as n}from"../../useUuid-3b1e73f2.js";import{p as l}from"../../palette-f206f488.js";import{I as s}from"../../Icon-d69d65b3.js";import{I as c}from"../../InfoSignStroke-f10d62aa.js";import{A as m}from"../../AlertSignStroke-32f09751.js";import{A as d}from"../../AlertSignFill-5df5b7c7.js";import"../../X-867957f2.js";import"../Close/styles.module.scss";import"../../useBreakpoint-a74f5af5.js";import"../../grid-c105cad1.js";import"../../uuid-11037462.js";import"../../_tslib-b219470a.js";var f={info:a.createElement(s,{svgIcon:c,color:l.kiwi900,hoverColor:l.kiwi900}),warn:a.createElement(s,{svgIcon:m,color:"black",hoverColor:"black"}),alert:a.createElement(s,{svgIcon:d,color:l.cherry500,hoverColor:l.cherry500}),alertLabel:a.createElement(s,{svgIcon:m,color:l.cherry500,hoverColor:l.cherry500}),crisis:a.createElement(s,{svgIcon:d,color:l.banana200,hoverColor:l.banana200})},p=function(e){var a=e.label,o=e.id;return o?{"aria-labelledby":o}:a?{"aria-label":a}:void 0},b=function(t){var r=t.fluid,n=t.variant,l=t.shadow,s=t.children;if(r){var c=o(i["fluid-wrapper"],i["fluid-wrapper--".concat(n)],e({},i["fluid-wrapper--shadow"],l));return a.createElement("div",{className:c},s)}return s},u=a.forwardRef((function(l,s){var c,m,d=l.children,u=l.variant,v=void 0===u?"info":u,h=l.shadow,j=void 0!==h&&h,_=l.dismissable,E=void 0!==_&&_,g=l.onClick,w=l.label,C=l.fluid,I=void 0!==C&&C,y=l.size,k=l.className,N=l.testId,S=n(),A=!!w&&!d,L=o(i["notification-panel"],y&&i["notification-panel--".concat(y)],i["notification-panel--".concat(v)],(e(c={},i["notification-panel--shadow"],!I&&j),e(c,i["notification-panel--has-children"],!!d),e(c,i["notification-panel--label-only"],A),e(c,i["notification-panel--dismissable"],!A&&E),c),k),B=p({label:w,id:S});return a.createElement(b,null,a.createElement("section",Object.assign({ref:s,"data-testid":N,"data-analyticsid":r.NotificationPanel,className:L},B),a.createElement("span",{className:i["notification-panel__icon"]},f["alert"===v&&w&&!d?"alertLabel":v]),!A&&E&&a.createElement("span",{className:i["notification-panel__close"]},a.createElement(t,{ariaLabel:l.ariaLabelCloseBtn,onClick:g})),(m=o(i["notification-panel__content"],i["notification-panel__content--".concat(v)]),a.createElement("div",{className:m,id:w?void 0:S},w&&a.createElement("h1",{className:i["notification-panel__label"],dangerouslySetInnerHTML:{__html:w},id:S}),d))))}));export{u as default,p as getAriaLabelAttributes};
1
+ import{d as e}from"../../_rollupPluginBabelHelpers-0f007973.js";import a from"react";import{c as o}from"../../index-d1c0552c.js";import i from"./styles.module.scss";import{C as t}from"../../Close-08d48540.js";import{A as r}from"../../constants-dbdea596.js";import{u as n}from"../../useUuid-3b1e73f2.js";import{p as l}from"../../palette-f206f488.js";import{g as s}from"../../accessibility-71f045ab.js";import{I as c}from"../../Icon-d69d65b3.js";import{I as m}from"../../InfoSignStroke-f10d62aa.js";import{A as f}from"../../AlertSignStroke-32f09751.js";import{A as d}from"../../AlertSignFill-5df5b7c7.js";import"../../X-867957f2.js";import"../Close/styles.module.scss";import"../../useBreakpoint-a74f5af5.js";import"../../grid-c105cad1.js";import"../../uuid-11037462.js";import"../../_tslib-b219470a.js";var p={info:a.createElement(c,{svgIcon:m,color:l.kiwi900,hoverColor:l.kiwi900}),warn:a.createElement(c,{svgIcon:f,color:"black",hoverColor:"black"}),alert:a.createElement(c,{svgIcon:d,color:l.cherry500,hoverColor:l.cherry500}),alertLabel:a.createElement(c,{svgIcon:f,color:l.cherry500,hoverColor:l.cherry500}),crisis:a.createElement(c,{svgIcon:d,color:l.banana200,hoverColor:l.banana200})},b=function(t){var r=t.fluid,n=t.variant,l=t.shadow,s=t.children;if(r){var c=o(i["fluid-wrapper"],i["fluid-wrapper--".concat(n)],e({},i["fluid-wrapper--shadow"],l));return a.createElement("div",{className:c},s)}return s},u=a.forwardRef((function(l,c){var m,f,d=l.children,u=l.variant,v=void 0===u?"info":u,h=l.shadow,j=void 0!==h&&h,_=l.dismissable,g=void 0!==_&&_,E=l.onClick,w=l.label,C=l.fluid,I=void 0!==C&&C,y=l.size,k=l.className,N=l.testId,S=n(),A=!!w&&!d,L=o(i["notification-panel"],y&&i["notification-panel--".concat(y)],i["notification-panel--".concat(v)],(e(m={},i["notification-panel--shadow"],!I&&j),e(m,i["notification-panel--has-children"],!!d),e(m,i["notification-panel--label-only"],A),e(m,i["notification-panel--dismissable"],!A&&g),m),k),B=s({label:w,id:S});return a.createElement(b,null,a.createElement("section",Object.assign({ref:c,"data-testid":N,"data-analyticsid":r.NotificationPanel,className:L},B),a.createElement("span",{className:i["notification-panel__icon"]},p["alert"===v&&w&&!d?"alertLabel":v]),!A&&g&&a.createElement("span",{className:i["notification-panel__close"]},a.createElement(t,{ariaLabel:l.ariaLabelCloseBtn,onClick:E})),(f=o(i["notification-panel__content"],i["notification-panel__content--".concat(v)]),a.createElement("div",{className:f,id:w?void 0:S},w&&a.createElement("h1",{className:i["notification-panel__label"],dangerouslySetInnerHTML:{__html:w},id:S}),d))))}));export{u as default};
2
2
  //# sourceMappingURL=index.js.map
@@ -57,11 +57,16 @@ export interface PanelProps {
57
57
  buttonHtmlMarkup?: ButtonTags;
58
58
  /** Callback when panel button is clicked */
59
59
  buttonOnClick?: ButtonProps['onClick'];
60
- /** Show close button in bottom of Panel Expand, default: true */
60
+ /** Panel button is aria-labelledby the text in the button itself + the element set in buttonAriaLabelledById. Default: auto-generated id for title (if title is set). */
61
+ buttonAriaLabelledById?: string;
62
+ /** Panel button aria label */
63
+ buttonAriaLabel?: string;
64
+ /** Show close button in bottom of Panel Expand */
65
+ /** @deprecated Has no effect anymore due to accessbility reasons. No close button is shown in expanded content. Will be removed in 2.0.0 */
61
66
  showCloseButtonInExpand?: boolean;
62
67
  /** Layout (see description) */
63
68
  layout?: keyof typeof PanelLayout;
64
- /** Use the panel's container as a button */
69
+ /** Clicking anywhere on the container will trigger a click on the panel's button */
65
70
  containerAsButton?: boolean;
66
71
  /** Displays time with icon */
67
72
  time?: string;
@@ -1 +1 @@
1
- {"version":3,"file":"Panel.d.ts","sourceRoot":"","sources":["../../../src/components/Panel/Panel.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAsC,MAAM,OAAO,CAAC;AAI3D,OAAc,EAAE,SAAS,EAAE,MAAM,UAAU,CAAC;AAC5C,OAAe,EAAE,WAAW,EAAE,UAAU,EAAkB,MAAM,WAAW,CAAC;AAC5E,OAAO,EAAE,YAAY,EAAe,MAAM,iBAAiB,CAAC;AAgB5D,oBAAY,WAAW;IACrB,MAAM,WAAW;IACjB,GAAG,QAAQ;IACX,KAAK,UAAU;IACf,KAAK,UAAU;CAChB;AAED,oBAAY,YAAY;IACtB,IAAI,SAAS;IACb,KAAK,UAAU;IACf,MAAM,WAAW;IACjB,IAAI,SAAS;CACd;AAED,oBAAY,WAAW;IACrB,OAAO,YAAY;IACnB,OAAO,YAAY;IACnB,QAAQ,aAAa;IACrB,QAAQ,aAAa;IACrB,QAAQ,aAAa;CACtB;AAED,MAAM,WAAW,UAAU;IACzB,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAC3B,yBAAyB;IACzB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,8DAA8D;IAC9D,eAAe,CAAC,EAAE,SAAS,CAAC;IAC5B,0CAA0C;IAC1C,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,sCAAsC;IACtC,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB,yDAAyD;IACzD,MAAM,CAAC,EAAE,MAAM,OAAO,WAAW,CAAC;IAClC,uDAAuD;IACvD,aAAa,CAAC,EAAE,MAAM,CAAC;IACvB,sDAAsD;IACtD,OAAO,CAAC,EAAE,MAAM,OAAO,YAAY,CAAC;IACpC,0DAA0D;IAC1D,GAAG,CAAC,EAAE,MAAM,CAAC;IACb,kDAAkD;IAClD,MAAM,CAAC,EAAE,YAAY,CAAC;IACtB,8BAA8B;IAC9B,IAAI,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IACvB,4BAA4B;IAC5B,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,8BAA8B;IAC9B,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,GAAG,MAAM,CAAC;IACpC,6BAA6B;IAC7B,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,GAAG,MAAM,CAAC;IACpC,wBAAwB;IACxB,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,8BAA8B;IAC9B,eAAe,CAAC,EAAE,MAAM,CAAC;IACzB,+CAA+C;IAC/C,gBAAgB,CAAC,EAAE,UAAU,CAAC;IAC9B,6CAA6C;IAC7C,aAAa,CAAC,EAAE,WAAW,CAAC,SAAS,CAAC,CAAC;IACvC,iEAAiE;IACjE,uBAAuB,CAAC,EAAE,OAAO,CAAC;IAClC,+BAA+B;IAC/B,MAAM,CAAC,EAAE,MAAM,OAAO,WAAW,CAAC;IAClC,4CAA4C;IAC5C,iBAAiB,CAAC,EAAE,OAAO,CAAC;IAC5B,8BAA8B;IAC9B,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,8BAA8B;IAC9B,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,gDAAgD;IAChD,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB,gCAAgC;IAChC,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,wCAAwC;IACxC,QAAQ,CAAC,EAAE,CAAC,UAAU,EAAE,OAAO,KAAK,IAAI,CAAC;IACzC,sGAAsG;IACtG,wBAAwB,CAAC,EAAE,OAAO,CAAC;CACpC;AA2ED,QAAA,MAAM,KAAK,uFAmNT,CAAC;AAEH,eAAe,KAAK,CAAC"}
1
+ {"version":3,"file":"Panel.d.ts","sourceRoot":"","sources":["../../../src/components/Panel/Panel.tsx"],"names":[],"mappings":"AAAA,OAAO,KAA8B,MAAM,OAAO,CAAC;AAInD,OAAc,EAAE,SAAS,EAAE,MAAM,UAAU,CAAC;AAC5C,OAAe,EAAE,WAAW,EAAE,UAAU,EAAE,MAAM,WAAW,CAAC;AAC5D,OAAO,EAAE,YAAY,EAAe,MAAM,iBAAiB,CAAC;AAiB5D,oBAAY,WAAW;IACrB,MAAM,WAAW;IACjB,GAAG,QAAQ;IACX,KAAK,UAAU;IACf,KAAK,UAAU;CAChB;AAED,oBAAY,YAAY;IACtB,IAAI,SAAS;IACb,KAAK,UAAU;IACf,MAAM,WAAW;IACjB,IAAI,SAAS;CACd;AAED,oBAAY,WAAW;IACrB,OAAO,YAAY;IACnB,OAAO,YAAY;IACnB,QAAQ,aAAa;IACrB,QAAQ,aAAa;IACrB,QAAQ,aAAa;CACtB;AAED,MAAM,WAAW,UAAU;IACzB,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAC3B,yBAAyB;IACzB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,8DAA8D;IAC9D,eAAe,CAAC,EAAE,SAAS,CAAC;IAC5B,0CAA0C;IAC1C,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,sCAAsC;IACtC,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB,yDAAyD;IACzD,MAAM,CAAC,EAAE,MAAM,OAAO,WAAW,CAAC;IAClC,uDAAuD;IACvD,aAAa,CAAC,EAAE,MAAM,CAAC;IACvB,sDAAsD;IACtD,OAAO,CAAC,EAAE,MAAM,OAAO,YAAY,CAAC;IACpC,0DAA0D;IAC1D,GAAG,CAAC,EAAE,MAAM,CAAC;IACb,kDAAkD;IAClD,MAAM,CAAC,EAAE,YAAY,CAAC;IACtB,8BAA8B;IAC9B,IAAI,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IACvB,4BAA4B;IAC5B,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,8BAA8B;IAC9B,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,GAAG,MAAM,CAAC;IACpC,6BAA6B;IAC7B,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,GAAG,MAAM,CAAC;IACpC,wBAAwB;IACxB,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,8BAA8B;IAC9B,eAAe,CAAC,EAAE,MAAM,CAAC;IACzB,+CAA+C;IAC/C,gBAAgB,CAAC,EAAE,UAAU,CAAC;IAC9B,6CAA6C;IAC7C,aAAa,CAAC,EAAE,WAAW,CAAC,SAAS,CAAC,CAAC;IACvC,yKAAyK;IACzK,sBAAsB,CAAC,EAAE,MAAM,CAAC;IAChC,8BAA8B;IAC9B,eAAe,CAAC,EAAE,MAAM,CAAC;IACzB,kDAAkD;IAClD,4IAA4I;IAC5I,uBAAuB,CAAC,EAAE,OAAO,CAAC;IAClC,+BAA+B;IAC/B,MAAM,CAAC,EAAE,MAAM,OAAO,WAAW,CAAC;IAClC,oFAAoF;IACpF,iBAAiB,CAAC,EAAE,OAAO,CAAC;IAC5B,8BAA8B;IAC9B,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,8BAA8B;IAC9B,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,gDAAgD;IAChD,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB,gCAAgC;IAChC,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,wCAAwC;IACxC,QAAQ,CAAC,EAAE,CAAC,UAAU,EAAE,OAAO,KAAK,IAAI,CAAC;IACzC,sGAAsG;IACtG,wBAAwB,CAAC,EAAE,OAAO,CAAC;CACpC;AAiDD,QAAA,MAAM,KAAK,uFAkMT,CAAC;AAEH,eAAe,KAAK,CAAC"}
@@ -413,9 +413,47 @@
413
413
  "name": "((e?: MouseEvent<HTMLElement, MouseEvent> | FormEvent<{}> | KeyboardEvent<HTMLUListElement> | null) => void) | undefined"
414
414
  }
415
415
  },
416
+ "buttonAriaLabelledById": {
417
+ "defaultValue": null,
418
+ "description": "Panel button is aria-labelledby the text in the button itself + the element set in buttonAriaLabelledById. Default: auto-generated id for title (if title is set).",
419
+ "name": "buttonAriaLabelledById",
420
+ "parent": {
421
+ "fileName": "src/components/Panel/Panel.tsx",
422
+ "name": "PanelProps"
423
+ },
424
+ "declarations": [
425
+ {
426
+ "fileName": "src/components/Panel/Panel.tsx",
427
+ "name": "PanelProps"
428
+ }
429
+ ],
430
+ "required": false,
431
+ "type": {
432
+ "name": "string"
433
+ }
434
+ },
435
+ "buttonAriaLabel": {
436
+ "defaultValue": null,
437
+ "description": "Panel button aria label",
438
+ "name": "buttonAriaLabel",
439
+ "parent": {
440
+ "fileName": "src/components/Panel/Panel.tsx",
441
+ "name": "PanelProps"
442
+ },
443
+ "declarations": [
444
+ {
445
+ "fileName": "src/components/Panel/Panel.tsx",
446
+ "name": "PanelProps"
447
+ }
448
+ ],
449
+ "required": false,
450
+ "type": {
451
+ "name": "string"
452
+ }
453
+ },
416
454
  "showCloseButtonInExpand": {
417
455
  "defaultValue": null,
418
- "description": "Show close button in bottom of Panel Expand, default: true",
456
+ "description": "@deprecated Has no effect anymore due to accessbility reasons. No close button is shown in expanded content. Will be removed in 2.0.0",
419
457
  "name": "showCloseButtonInExpand",
420
458
  "parent": {
421
459
  "fileName": "src/components/Panel/Panel.tsx",
@@ -474,7 +512,7 @@
474
512
  },
475
513
  "containerAsButton": {
476
514
  "defaultValue": null,
477
- "description": "Use the panel's container as a button",
515
+ "description": "Clicking anywhere on the container will trigger a click on the panel's button",
478
516
  "name": "containerAsButton",
479
517
  "parent": {
480
518
  "fileName": "src/components/Panel/Panel.tsx",
@@ -1,2 +1,2 @@
1
- export{c as PanelLayout,a as PanelStatus,b as PanelVariant,P as default}from"../../Panel-bca5223d.js";import"../../_rollupPluginBabelHelpers-0f007973.js";import"../../_tslib-b219470a.js";import"react";import"../../index-d1c0552c.js";import"./styles.module.scss";import"../../Title-01820508.js";import"../Title/styles.module.scss";import"../../constants-dbdea596.js";import"../../Button-b55b2d27.js";import"../../color-e7d082c1.js";import"../../index-d1c9177a.js";import"../../palette-f206f488.js";import"../../grid-c105cad1.js";import"../../Icon-d69d65b3.js";import"../../useUuid-3b1e73f2.js";import"../../uuid-11037462.js";import"../../Loader-896f633b.js";import"../Loader/styles.module.scss";import"../../useHover-18479690.js";import"../../useBreakpoint-a74f5af5.js";import"../Button/styles.module.scss";import"../../ChevronDown-2b3daace.js";import"../../ChevronUp-dfafe27b.js";import"../../ArrowRight-43c97f7a.js";import"../../AlertSignFill-5df5b7c7.js";import"../../Pencil-dd3fe667.js";import"../../Calendar-a9aa98de.js";import"../../Watch-3d5fc351.js";import"../../usePrevious-ae293b10.js";import"../../Badge-eebcb720.js";import"../Badge/styles.module.scss";
1
+ export{c as PanelLayout,a as PanelStatus,b as PanelVariant,P as default}from"../../Panel-79591ae3.js";import"../../_rollupPluginBabelHelpers-0f007973.js";import"react";import"../../index-d1c0552c.js";import"./styles.module.scss";import"../../Title-01820508.js";import"../Title/styles.module.scss";import"../../constants-dbdea596.js";import"../../Button-b55b2d27.js";import"../../_tslib-b219470a.js";import"../../color-e7d082c1.js";import"../../index-d1c9177a.js";import"../../palette-f206f488.js";import"../../grid-c105cad1.js";import"../../Icon-d69d65b3.js";import"../../useUuid-3b1e73f2.js";import"../../uuid-11037462.js";import"../../Loader-896f633b.js";import"../Loader/styles.module.scss";import"../../useHover-18479690.js";import"../../useBreakpoint-a74f5af5.js";import"../Button/styles.module.scss";import"../../ChevronDown-2b3daace.js";import"../../ChevronUp-dfafe27b.js";import"../../ArrowRight-43c97f7a.js";import"../../AlertSignFill-5df5b7c7.js";import"../../Pencil-dd3fe667.js";import"../../Calendar-a9aa98de.js";import"../../Watch-3d5fc351.js";import"../../usePrevious-ae293b10.js";import"../../accessibility-71f045ab.js";import"../../Badge-eebcb720.js";import"../Badge/styles.module.scss";
2
2
  //# sourceMappingURL=index.js.map
@@ -148,6 +148,18 @@
148
148
  }
149
149
  }
150
150
 
151
+ &__expand {
152
+ position: unset;
153
+ &:after {
154
+ bottom: 0;
155
+ content: '';
156
+ left: 0;
157
+ position: absolute;
158
+ right: 0;
159
+ top: 0;
160
+ }
161
+ }
162
+
151
163
  // Panel variants
152
164
 
153
165
  &--fill {
@@ -17,6 +17,7 @@ export type Styles = {
17
17
  'panel__content-right--layout3b': string;
18
18
  'panel__content-right--layout3c': string;
19
19
  'panel__details-btn': string;
20
+ panel__expand: string;
20
21
  panel__icon: string;
21
22
  'panel__icon--right': string;
22
23
  'panel--button': string;
@@ -1,2 +1,2 @@
1
- import s from"react";import e from"./styles.module.scss";import{A as t}from"../../constants-dbdea596.js";import{b as r,P as o}from"../../Panel-bca5223d.js";import{c as i}from"../../index-d1c0552c.js";import"../../_rollupPluginBabelHelpers-0f007973.js";import"../../_tslib-b219470a.js";import"../Panel/styles.module.scss";import"../../Title-01820508.js";import"../Title/styles.module.scss";import"../../Button-b55b2d27.js";import"../../color-e7d082c1.js";import"../../index-d1c9177a.js";import"../../palette-f206f488.js";import"../../grid-c105cad1.js";import"../../Icon-d69d65b3.js";import"../../useUuid-3b1e73f2.js";import"../../uuid-11037462.js";import"../../Loader-896f633b.js";import"../Loader/styles.module.scss";import"../../useHover-18479690.js";import"../../useBreakpoint-a74f5af5.js";import"../Button/styles.module.scss";import"../../ChevronDown-2b3daace.js";import"../../ChevronUp-dfafe27b.js";import"../../ArrowRight-43c97f7a.js";import"../../AlertSignFill-5df5b7c7.js";import"../../Pencil-dd3fe667.js";import"../../Calendar-a9aa98de.js";import"../../Watch-3d5fc351.js";import"../../usePrevious-ae293b10.js";import"../../Badge-eebcb720.js";import"../Badge/styles.module.scss";var a=s.forwardRef((function(a,l){var m=a.testId,p=a.children,d=a.variant,n=void 0===d?r.fill:d;return s.createElement("div",{ref:l,"data-testid":m,className:e["panel-list"],"data-analyticsid":t.PanelList},s.Children.map(p,(function(t,a){return p=t,s.isValidElement(p)&&p.type===o?(l=t,m=0===a,s.cloneElement(l,{variant:n,noTopBorder:n===r.line&&!m,className:i(l.props.className,n!==r.line&&e["panel-list__panel"])})):t;var l,m,p})))}));export{a as default};
1
+ import s from"react";import e from"./styles.module.scss";import{A as t}from"../../constants-dbdea596.js";import{b as r,P as i}from"../../Panel-79591ae3.js";import{c as o}from"../../index-d1c0552c.js";import"../../_rollupPluginBabelHelpers-0f007973.js";import"../Panel/styles.module.scss";import"../../Title-01820508.js";import"../Title/styles.module.scss";import"../../Button-b55b2d27.js";import"../../_tslib-b219470a.js";import"../../color-e7d082c1.js";import"../../index-d1c9177a.js";import"../../palette-f206f488.js";import"../../grid-c105cad1.js";import"../../Icon-d69d65b3.js";import"../../useUuid-3b1e73f2.js";import"../../uuid-11037462.js";import"../../Loader-896f633b.js";import"../Loader/styles.module.scss";import"../../useHover-18479690.js";import"../../useBreakpoint-a74f5af5.js";import"../Button/styles.module.scss";import"../../ChevronDown-2b3daace.js";import"../../ChevronUp-dfafe27b.js";import"../../ArrowRight-43c97f7a.js";import"../../AlertSignFill-5df5b7c7.js";import"../../Pencil-dd3fe667.js";import"../../Calendar-a9aa98de.js";import"../../Watch-3d5fc351.js";import"../../usePrevious-ae293b10.js";import"../../accessibility-71f045ab.js";import"../../Badge-eebcb720.js";import"../Badge/styles.module.scss";var a=s.forwardRef((function(a,l){var m=a.testId,p=a.children,d=a.variant,n=void 0===d?r.fill:d;return s.createElement("div",{ref:l,"data-testid":m,className:e["panel-list"],"data-analyticsid":t.PanelList},s.Children.map(p,(function(t,a){return p=t,s.isValidElement(p)&&p.type===i?(l=t,m=0===a,s.cloneElement(l,{variant:n,noTopBorder:n===r.line&&!m,className:o(l.props.className,n!==r.line&&e["panel-list__panel"])})):t;var l,m,p})))}));export{a as default};
2
2
  //# sourceMappingURL=index.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"Slider.d.ts","sourceRoot":"","sources":["../../../src/components/Slider/Slider.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAsC,MAAM,OAAO,CAAC;AAsB3D,UAAU,WAAW;IACnB,oCAAoC;IACpC,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,+CAA+C;IAC/C,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,gDAAgD;IAChD,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,mEAAmE;IACnE,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,mCAAmC;IACnC,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,8DAA8D;IAC9D,QAAQ,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IACnC,sCAAsC;IACtC,MAAM,CAAC,EAAE,MAAM,CAAC;CACjB;AAED,eAAO,MAAM,MAAM,iFA+IjB,CAAC;AAEH,eAAe,MAAM,CAAC"}
1
+ {"version":3,"file":"Slider.d.ts","sourceRoot":"","sources":["../../../src/components/Slider/Slider.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAsC,MAAM,OAAO,CAAC;AAsB3D,UAAU,WAAW;IACnB,oCAAoC;IACpC,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,+CAA+C;IAC/C,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,gDAAgD;IAChD,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,mEAAmE;IACnE,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,mCAAmC;IACnC,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,8DAA8D;IAC9D,QAAQ,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IACnC,sCAAsC;IACtC,MAAM,CAAC,EAAE,MAAM,CAAC;CACjB;AAED,eAAO,MAAM,MAAM,iFAwIjB,CAAC;AAEH,eAAe,MAAM,CAAC"}
@@ -2,8 +2,6 @@
2
2
  export declare const stopEvent: (e: MouseEvent | React.MouseEvent<{}> | TouchEvent | React.TouchEvent<{}>) => boolean;
3
3
  /** Henter ut x posisjon til MouseEvent eller TouchEvent e */
4
4
  export declare const getMousePosition: (e: MouseEvent | React.MouseEvent<{}> | TouchEvent | React.TouchEvent<{}>) => number;
5
- /** Henter ut width basert på viewport posisjon til parameter elementet el som sendes inn */
6
- export declare const getElementWidth: (el: HTMLDivElement | null) => number;
7
5
  /** Returnerer en boolean på om innsendte event e er en TouchEvent */
8
6
  export declare const isTouchEvent: (e: MouseEvent | React.MouseEvent<{}> | TouchEvent | React.TouchEvent<{}>) => boolean;
9
7
  /** Kalkulerer x posisjonen til slideren basert på value som sendes inn,
@@ -1 +1 @@
1
- {"version":3,"file":"SliderUtils.d.ts","sourceRoot":"","sources":["../../../src/components/Slider/SliderUtils.tsx"],"names":[],"mappings":"AAAA,qFAAqF;AACrF,eAAO,MAAM,SAAS,MAAO,UAAU,GAAG,gBAAgB,CAAC,EAAE,CAAC,GAAG,UAAU,GAAG,gBAAgB,CAAC,EAAE,CAAC,KAAG,OAIpG,CAAC;AAEF,6DAA6D;AAC7D,eAAO,MAAM,gBAAgB,MAAO,UAAU,GAAG,gBAAgB,CAAC,EAAE,CAAC,GAAG,UAAU,GAAG,gBAAgB,CAAC,EAAE,CAAC,KAAG,MAM3G,CAAC;AAEF,4FAA4F;AAC5F,eAAO,MAAM,eAAe,OAAQ,cAAc,GAAG,IAAI,KAAG,MAG3D,CAAC;AAEF,qEAAqE;AACrE,eAAO,MAAM,YAAY,MAAO,UAAU,GAAG,gBAAgB,CAAC,EAAE,CAAC,GAAG,UAAU,GAAG,gBAAgB,CAAC,EAAE,CAAC,KAAG,OAYvG,CAAC;AAEF;;+DAE+D;AAC/D,eAAO,MAAM,mCAAmC,UACvC,MAAM,gBACC,MAAM,eACP,MAAM,OACd,MAAM,OACN,MAAM,KACV,MAIF,CAAC;AAEF;;+DAE+D;AAC/D,eAAO,MAAM,mCAAmC,mBAC9B,MAAM,gBACR,MAAM,eACP,MAAM,QACb,MAAM,OACP,MAAM,OACN,MAAM,KACV,MAKF,CAAC;AAEF;;gEAEgE;AAChE,eAAO,MAAM,UAAU,UAAW,MAAM,QAAQ,MAAM,OAAO,MAAM,KAAG,MAarE,CAAC;AAEF;;4BAE4B;AAC5B,eAAO,MAAM,yBAAyB,SAAU,MAAM,gBAAgB,MAAM,eAAe,MAAM,cAAc,MAAM,KAAG,MASvH,CAAC;AAEF;uCACuC;AACvC,eAAO,MAAM,wBAAwB,SAC7B,MAAM,iBACG,cAAc,GAAG,IAAI,eACvB,MAAM,UACX,MAAM,KAAK,IAAI,SAMxB,CAAC;AAEF;wDACwD;AACxD,eAAO,MAAM,iBAAiB,yBAA0B,UAAU,KAAK,IAAI,sBAAsB,UAAU,KAAK,IAAI,KAAG,IAGtH,CAAC;AAEF;wDACwD;AACxD,eAAO,MAAM,oBAAoB,yBAA0B,UAAU,KAAK,IAAI,sBAAsB,UAAU,KAAK,IAAI,KAAG,IAGzH,CAAC;AAEF;wDACwD;AACxD,eAAO,MAAM,iBAAiB,yBAA0B,UAAU,KAAK,IAAI,sBAAsB,UAAU,KAAK,IAAI,KAAG,IAGtH,CAAC;AAEF;wDACwD;AACxD,eAAO,MAAM,oBAAoB,yBAA0B,UAAU,KAAK,IAAI,sBAAsB,UAAU,KAAK,IAAI,KAAG,IAGzH,CAAC"}
1
+ {"version":3,"file":"SliderUtils.d.ts","sourceRoot":"","sources":["../../../src/components/Slider/SliderUtils.tsx"],"names":[],"mappings":"AAAA,qFAAqF;AACrF,eAAO,MAAM,SAAS,MAAO,UAAU,GAAG,gBAAgB,CAAC,EAAE,CAAC,GAAG,UAAU,GAAG,gBAAgB,CAAC,EAAE,CAAC,KAAG,OAIpG,CAAC;AAEF,6DAA6D;AAC7D,eAAO,MAAM,gBAAgB,MAAO,UAAU,GAAG,gBAAgB,CAAC,EAAE,CAAC,GAAG,UAAU,GAAG,gBAAgB,CAAC,EAAE,CAAC,KAAG,MAM3G,CAAC;AAEF,qEAAqE;AACrE,eAAO,MAAM,YAAY,MAAO,UAAU,GAAG,gBAAgB,CAAC,EAAE,CAAC,GAAG,UAAU,GAAG,gBAAgB,CAAC,EAAE,CAAC,KAAG,OAYvG,CAAC;AAEF;;+DAE+D;AAC/D,eAAO,MAAM,mCAAmC,UACvC,MAAM,gBACC,MAAM,eACP,MAAM,OACd,MAAM,OACN,MAAM,KACV,MAIF,CAAC;AAEF;;+DAE+D;AAC/D,eAAO,MAAM,mCAAmC,mBAC9B,MAAM,gBACR,MAAM,eACP,MAAM,QACb,MAAM,OACP,MAAM,OACN,MAAM,KACV,MAKF,CAAC;AAEF;;gEAEgE;AAChE,eAAO,MAAM,UAAU,UAAW,MAAM,QAAQ,MAAM,OAAO,MAAM,KAAG,MAarE,CAAC;AAEF;;4BAE4B;AAC5B,eAAO,MAAM,yBAAyB,SAAU,MAAM,gBAAgB,MAAM,eAAe,MAAM,cAAc,MAAM,KAAG,MASvH,CAAC;AAEF;uCACuC;AACvC,eAAO,MAAM,wBAAwB,SAC7B,MAAM,iBACG,cAAc,GAAG,IAAI,eACvB,MAAM,UACX,MAAM,KAAK,IAAI,SAMxB,CAAC;AAEF;wDACwD;AACxD,eAAO,MAAM,iBAAiB,yBAA0B,UAAU,KAAK,IAAI,sBAAsB,UAAU,KAAK,IAAI,KAAG,IAGtH,CAAC;AAEF;wDACwD;AACxD,eAAO,MAAM,oBAAoB,yBAA0B,UAAU,KAAK,IAAI,sBAAsB,UAAU,KAAK,IAAI,KAAG,IAGzH,CAAC;AAEF;wDACwD;AACxD,eAAO,MAAM,iBAAiB,yBAA0B,UAAU,KAAK,IAAI,sBAAsB,UAAU,KAAK,IAAI,KAAG,IAGtH,CAAC;AAEF;wDACwD;AACxD,eAAO,MAAM,oBAAoB,yBAA0B,UAAU,KAAK,IAAI,sBAAsB,UAAU,KAAK,IAAI,KAAG,IAGzH,CAAC"}
@@ -1,2 +1,2 @@
1
- import{_ as e}from"../../_rollupPluginBabelHelpers-0f007973.js";import t,{useState as n,useRef as r,useEffect as a}from"react";import{c as o}from"../../index-d1c0552c.js";import{T as i}from"../../Title-01820508.js";import c from"./styles.module.scss";import{A as u}from"../../constants-dbdea596.js";import"../Title/styles.module.scss";var s=function(e){return e.stopPropagation&&e.stopPropagation(),e.preventDefault&&e.preventDefault(),!1},l=function(e){return m(e)?e.touches[0].pageX:e.pageX},d=function(e){var t=e?e.getBoundingClientRect():void 0;return t?t.right-t.left:0},m=function(e){return("touchcancel"===e.type||"touchend"===e.type||"touchenter"===e.type||"touchleave"===e.type||"touchmove"===e.type||"touchstart"===e.type)&&!(0===e.touches.length)},f=function(e,t,n){var r=e-e%t,a=Math.floor(n/t)*t;e>a&&(e>a+(n-a)/2&&(r=n));return Math.round(r)},v=t.forwardRef((function(m,v){var p=m.title,h=m.labelLeft,_=m.labelRight,g=m.disabled,E=void 0!==g&&g,y=m.step,b=void 0===y?1:y,w=m.onChange,k=m.testId,L=n(50),N=e(L,2),x=N[0],A=N[1],D=n(!1),M=e(D,2),R=M[0],j=M[1],T=n(0),B=e(T,2),C=B[0],P=B[1],I=n(0),S=e(I,2),X=S[0],H=S[1],K=n(0),U=e(K,2),q=U[0],z=U[1],F=n(0),G=e(F,2),J=G[0],O=G[1],Q=v||r(null),V=r(null),W=100,Y=function(e){re(e)},Z=function(e){ne(e)},$=function(e){re(e)},ee=function(e){ne(e)};a((function(){var e=d(Q.current),t=d(V.current);z(function(e,t,n,r,a){return(t-n)/(a-r)*e}(x,e,t,0,W)),P(e),H(t)}),[]),a((function(){R&&(function(e,t){document.addEventListener("mousemove",e,!1),document.addEventListener("mouseup",t,!1)}(Y,Z),function(e,t){document.addEventListener("touchmove",e,!1),document.addEventListener("touchend",t,!1)}($,ee))}),[R]),a((function(){!E&&w&&w(x)}),[x]);var te=function(e){var t;if(!E){var n=d(Q.current),r=d(V.current),a=l(e);!function(e,t,n,r){var a=t?t.getBoundingClientRect():void 0,o=a?a.left:0;r(o?e-(o+n/2):0)}(a,V.current,r,ae),j(!0),O(a),P(n),H(r),null===(t=V.current)||void 0===t||t.focus(),s(e)}},ne=function(e){E||(j(!1),function(e,t){document.removeEventListener("mousemove",e,!1),document.removeEventListener("mouseup",t,!1)}(Y,Z),function(e,t){document.removeEventListener("touchmove",e,!1),document.removeEventListener("touchend",t,!1)}($,ee),s(e))},re=function(e){if(!E&&R){var t=l(e);ae(t-J),s(e)}},ae=function(e){if(0!==e){var t=function(e,t,n,r){var a=r+e;return a<0&&(a=0),a>t-n&&(a=t-n),a}(e,C,X,q);z(t),O(t+e),A(function(e,t,n,r,a,o){var i=(t-n)/(o-a),c=Math.round(e/i);return f(c,r,o)}(t,C,X,b,0,W))}};return t.createElement("div",{className:c.slider,"data-testid":k,"data-analyticsid":u.Slider},p&&t.createElement(i,{htmlMarkup:"h3",margin:1.5,appearance:"title3"},p),t.createElement("div",{ref:Q,className:o(c["slider__track-wrapper"],E?c["slider__track-wrapper--disabled"]:""),onMouseDown:te,onTouchStart:te,"data-testid":"tracker"},t.createElement("div",{className:o(c.slider__track,E?c["slider__track--disabled"]:"")}),t.createElement("div",{ref:V,className:o(c.slider__trigger,E?c["slider__trigger--disabled"]:""),style:{left:"".concat(q,"px")},onKeyDown:function(e){if(!E){var t=(C-X)/100;"ArrowRight"!==e.key&&"ArrowDown"!==e.key||ae(b*t),"ArrowLeft"!==e.key&&"ArrowUp"!==e.key||ae(-b*t)}},role:"slider","aria-valuenow":x,"aria-valuemin":0,"aria-valuemax":W,"aria-label":"".concat(p?p+" ":"").concat(h?h+" ":"").concat(_?_+" ":""),tabIndex:E?-1:0},t.createElement("div",{className:o(c["slider__trigger-inner"],E?c["slider__trigger-inner--disabled"]:"")}))),(h||_)&&t.createElement("span",{className:c.slider__options},t.createElement("p",{className:c.slider__text,"aria-hidden":!0},h),t.createElement("p",{className:c.slider__text,"aria-hidden":!0},_)))}));export{v as Slider,v as default};
1
+ import{_ as e}from"../../_rollupPluginBabelHelpers-0f007973.js";import t,{useState as n,useRef as r,useEffect as a}from"react";import{c as o}from"../../index-d1c0552c.js";import{T as i}from"../../Title-01820508.js";import c from"./styles.module.scss";import{A as s}from"../../constants-dbdea596.js";import{u}from"../../useSize-8dc1a168.js";import"../Title/styles.module.scss";import"../../debounce-fb23662f.js";var d=function(e){return e.stopPropagation&&e.stopPropagation(),e.preventDefault&&e.preventDefault(),!1},l=function(e){return m(e)?e.touches[0].pageX:e.pageX},m=function(e){return("touchcancel"===e.type||"touchend"===e.type||"touchenter"===e.type||"touchleave"===e.type||"touchmove"===e.type||"touchstart"===e.type)&&!(0===e.touches.length)},f=function(e,t,n){var r=e-e%t,a=Math.floor(n/t)*t;e>a&&(e>a+(n-a)/2&&(r=n));return Math.round(r)},v=t.forwardRef((function(m,v){var p=m.title,h=m.labelLeft,_=m.labelRight,g=m.disabled,E=void 0!==g&&g,w=m.step,y=void 0===w?1:w,b=m.onChange,k=m.testId,L=n(50),N=e(L,2),x=N[0],j=N[1],A=n(!1),D=e(A,2),M=D[0],R=D[1],T=n(0),P=e(T,2),S=P[0],B=P[1],C=n(0),I=e(C,2),X=I[0],z=I[1],H=v||r(null),K=r(null),U=(u(H)||{width:0}).width,q=(u(K)||{width:0}).width,F=100,G=function(e){Y(e)},J=function(e){W(e)},O=function(e){Y(e)},Q=function(e){W(e)};a((function(){B(function(e,t,n,r,a){return(t-n)/(a-r)*e}(x,U,q,0,F))}),[x,U,q]),a((function(){M&&(function(e,t){document.addEventListener("mousemove",e,!1),document.addEventListener("mouseup",t,!1)}(G,J),function(e,t){document.addEventListener("touchmove",e,!1),document.addEventListener("touchend",t,!1)}(O,Q))}),[M]),a((function(){!E&&b&&b(x)}),[x]);var V=function(e){var t;if(!E){var n=l(e);!function(e,t,n,r){var a=t?t.getBoundingClientRect():void 0,o=a?a.left:0;r(o?e-(o+n/2):0)}(n,K.current,q,Z),R(!0),z(n),null===(t=K.current)||void 0===t||t.focus(),d(e)}},W=function(e){E||(R(!1),function(e,t){document.removeEventListener("mousemove",e,!1),document.removeEventListener("mouseup",t,!1)}(G,J),function(e,t){document.removeEventListener("touchmove",e,!1),document.removeEventListener("touchend",t,!1)}(O,Q),d(e))},Y=function(e){if(!E&&M){var t=l(e);Z(t-X),d(e)}},Z=function(e){if(0!==e){var t=function(e,t,n,r){var a=r+e;return a<0&&(a=0),a>t-n&&(a=t-n),a}(e,U,q,S);B(t),z(t+e),j(function(e,t,n,r,a,o){var i=(t-n)/(o-a),c=Math.round(e/i);return f(c,r,o)}(t,U,q,y,0,F))}};return t.createElement("div",{className:c.slider,"data-testid":k,"data-analyticsid":s.Slider},p&&t.createElement(i,{htmlMarkup:"h3",margin:1.5,appearance:"title3"},p),t.createElement("div",{ref:H,className:o(c["slider__track-wrapper"],E?c["slider__track-wrapper--disabled"]:""),onMouseDown:V,onTouchStart:V,"data-testid":"tracker"},t.createElement("div",{className:o(c.slider__track,E?c["slider__track--disabled"]:"")}),t.createElement("div",{ref:K,className:o(c.slider__trigger,E?c["slider__trigger--disabled"]:""),style:{left:"".concat(S,"px")},onKeyDown:function(e){if(!E){var t=(U-q)/100;"ArrowRight"!==e.key&&"ArrowDown"!==e.key||Z(y*t),"ArrowLeft"!==e.key&&"ArrowUp"!==e.key||Z(-y*t)}},role:"slider","aria-valuenow":x,"aria-valuemin":0,"aria-valuemax":F,"aria-label":"".concat(p?p+" ":"").concat(h?h+" ":"").concat(_?_+" ":""),tabIndex:E?-1:0},t.createElement("div",{className:o(c["slider__trigger-inner"],E?c["slider__trigger-inner--disabled"]:"")}))),(h||_)&&t.createElement("span",{className:c.slider__options},t.createElement("p",{className:c.slider__text,"aria-hidden":!0},h),t.createElement("p",{className:c.slider__text,"aria-hidden":!0},_)))}));export{v as Slider,v as default};
2
2
  //# sourceMappingURL=index.js.map
@@ -0,0 +1,2 @@
1
+ function t(t,n,u){var e;return[function(){var i=this,o=arguments,a=function(){e=null,u||t.apply(i,o)},r=u&&!e;e&&clearTimeout(e),e=setTimeout(a,n),r&&t.apply(i,o)},function(){e&&clearTimeout(e)}]}export{t as d};
2
+ //# sourceMappingURL=debounce-fb23662f.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"debounce-fb23662f.js","sources":[],"sourcesContent":[],"names":[],"mappings":""}
package/index.js CHANGED
@@ -1,2 +1,2 @@
1
- export{t as theme}from"./index-d1c9177a.js";export{B as Breakpoint,u as useBreakpoint}from"./useBreakpoint-a74f5af5.js";export{u as useFocusToggle,a as useFocusTrap}from"./useFocusTrap-4a5fb65d.js";export{u as useHover}from"./useHover-18479690.js";export{u as useIntersectionObserver,a as useIsVisible}from"./useIsVisible-2ffbdea2.js";import{d as e}from"./useSticky-432642c9.js";export{u as useLayoutEvent,a as useSticky}from"./useSticky-432642c9.js";export{u as usePrevious}from"./usePrevious-ae293b10.js";import{_ as s,a as r}from"./_rollupPluginBabelHelpers-0f007973.js";import{useState as o,useEffect as n}from"react";export{b as useKeyboardEvent,c as useOutsideEvent,u as useResizeObserver,a as useToggle}from"./useOutsideEvent-fb86686d.js";export{u as useUuid}from"./useUuid-3b1e73f2.js";export{u as uuid}from"./uuid-11037462.js";export{A as AnalyticsId,F as FormMode,a as FormVariant,I as IconSize,K as KeyboardEventKey,Z as ZIndex}from"./constants-dbdea596.js";import"./palette-f206f488.js";import"./grid-c105cad1.js";var i=function(t){var u=o(),a=s(u,2),i=a[0],f=a[1];return n((function(){if("undefined"!=typeof ResizeObserver){var o=new ResizeObserver((function(e){f(e[0].target.getBoundingClientRect())}));return(null==t?void 0:t.current)&&o.observe(null==t?void 0:t.current),o.disconnect}if("object"===("undefined"==typeof window?"undefined":r(window))){var u=["layoutchange","resize","orientationchange"],n=e((function(){(null==t?void 0:t.current)&&f(t.current.getBoundingClientRect())}),10),a=s(n,2),i=a[0],d=a[1];return u.forEach((function(e){return window.addEventListener(e,i)})),i(),function(){d(),u.forEach((function(e){return window.removeEventListener(e,i)}))}}}),[t]),i};export{i as useSize};
1
+ export{t as theme}from"./index-d1c9177a.js";export{B as Breakpoint,u as useBreakpoint}from"./useBreakpoint-a74f5af5.js";export{u as useFocusToggle,a as useFocusTrap}from"./useFocusTrap-4a5fb65d.js";export{u as useHover}from"./useHover-18479690.js";export{u as useIntersectionObserver,a as useIsVisible}from"./useIsVisible-2ffbdea2.js";export{u as useLayoutEvent,a as useSticky}from"./useSticky-f8ffc6d8.js";export{u as usePrevious}from"./usePrevious-ae293b10.js";export{u as useSize}from"./useSize-8dc1a168.js";export{b as useKeyboardEvent,c as useOutsideEvent,u as useResizeObserver,a as useToggle}from"./useOutsideEvent-fb86686d.js";export{u as useUuid}from"./useUuid-3b1e73f2.js";export{u as uuid}from"./uuid-11037462.js";export{A as AnalyticsId,F as FormMode,a as FormVariant,I as IconSize,K as KeyboardEventKey,Z as ZIndex}from"./constants-dbdea596.js";import"./palette-f206f488.js";import"./grid-c105cad1.js";import"./_rollupPluginBabelHelpers-0f007973.js";import"react";import"./debounce-fb23662f.js";
2
2
  //# sourceMappingURL=index.js.map
package/package.json CHANGED
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "name": "@helsenorge/designsystem-react",
3
3
  "sideEffects": false,
4
- "version": "1.3.1",
4
+ "version": "1.4.0",
5
5
  "description": "The official design system for Helsenorge built with React.",
6
6
  "repository": {
7
7
  "type": "tfs",
@@ -0,0 +1,2 @@
1
+ import{_ as e,a as n}from"./_rollupPluginBabelHelpers-0f007973.js";import{useState as r,useEffect as t}from"react";import{d as o}from"./debounce-fb23662f.js";var i=function(i){var u=r(),c=e(u,2),f=c[0],d=c[1];return t((function(){if("undefined"!=typeof ResizeObserver){var r=new ResizeObserver((function(e){d(e[0].target.getBoundingClientRect())}));return(null==i?void 0:i.current)&&r.observe(null==i?void 0:i.current),r.disconnect}if("object"===("undefined"==typeof window?"undefined":n(window))){var t=["layoutchange","resize","orientationchange"],u=o((function(){(null==i?void 0:i.current)&&d(i.current.getBoundingClientRect())}),10),c=e(u,2),f=c[0],a=c[1];return t.forEach((function(e){return window.addEventListener(e,f)})),f(),function(){a(),t.forEach((function(e){return window.removeEventListener(e,f)}))}}}),[i]),f};export{i as u};
2
+ //# sourceMappingURL=useSize-8dc1a168.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"useSize-8dc1a168.js","sources":[],"sourcesContent":[],"names":[],"mappings":""}
@@ -0,0 +1,2 @@
1
+ import{a as n,_ as e}from"./_rollupPluginBabelHelpers-0f007973.js";import{useEffect as i,useState as o}from"react";import{d as t}from"./debounce-fb23662f.js";var r=function(o){var r=arguments.length>1&&void 0!==arguments[1]?arguments[1]:["layoutchange","resize","orientationchange"],d=arguments.length>2&&void 0!==arguments[2]?arguments[2]:10;i((function(){if("object"===("undefined"==typeof window?"undefined":n(window))){var i=t(o,d),u=e(i,2),a=u[0],f=u[1];return r.forEach((function(n){return window.addEventListener(n,a)})),a(),function(){f(),r.forEach((function(n){return window.removeEventListener(n,a)}))}}}),[])},d=function(n,i){var t=o(!1),d=e(t,2),u=d[0],a=d[1],f=o(!1),c=e(f,2),v=c[0],l=c[1],s=o(),g=e(s,2),h=g[0],w=g[1],m=o(),p=e(m,2),b=p[0],E=p[1];return r((function(){var e,o,t,r=(null===(e=n.current)||void 0===e?void 0:e.getBoundingClientRect())||{},d=r.top,u=void 0===d?0:d,f=r.width,c=void 0===f?0:f,v=r.bottom,s=void 0===v?0:v,g=null!==(t=null===(o=i.current)||void 0===o?void 0:o.getBoundingClientRect().height)&&void 0!==t?t:0;a(u<=0),l(s<=g),E(c),w(g)}),["resize","scroll"]),{isOutsideWindow:u,isLeavingWindow:v,offsetHeight:h,contentWidth:b}};export{d as a,r as u};
2
+ //# sourceMappingURL=useSticky-f8ffc6d8.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"useSticky-f8ffc6d8.js","sources":[],"sourcesContent":[],"names":[],"mappings":""}
@@ -0,0 +1,9 @@
1
+ import { AriaAttributes } from 'react';
2
+ interface AriaLabelAttributesConfig {
3
+ label?: string;
4
+ id?: string;
5
+ }
6
+ export declare type AriaLabelAttributes = Pick<AriaAttributes, 'aria-label' | 'aria-labelledby'>;
7
+ export declare const getAriaLabelAttributes: (config: AriaLabelAttributesConfig) => AriaLabelAttributes | undefined;
8
+ export {};
9
+ //# sourceMappingURL=accessibility.d.ts.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"accessibility.d.ts","sourceRoot":"","sources":["../../src/utils/accessibility.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,cAAc,EAAE,MAAM,OAAO,CAAC;AAEvC,UAAU,yBAAyB;IACjC,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,EAAE,CAAC,EAAE,MAAM,CAAC;CACb;AAED,oBAAY,mBAAmB,GAAG,IAAI,CAAC,cAAc,EAAE,YAAY,GAAG,iBAAiB,CAAC,CAAC;AAEzF,eAAO,MAAM,sBAAsB,WAAY,yBAAyB,KAAG,mBAAmB,GAAG,SAahG,CAAC"}
package/Panel-bca5223d.js DELETED
@@ -1,2 +0,0 @@
1
- import{_ as e,d as t}from"./_rollupPluginBabelHelpers-0f007973.js";import{_ as a}from"./_tslib-b219470a.js";import n,{useState as l,useRef as o,useEffect as r}from"react";import{c as i}from"./index-d1c0552c.js";import s from"./components/Panel/styles.module.scss";import{T as c}from"./Title-01820508.js";import{B as d}from"./Button-b55b2d27.js";import{A as u,I as m}from"./constants-dbdea596.js";import{I as p}from"./Icon-d69d65b3.js";import{C as f}from"./ChevronDown-2b3daace.js";import{C as v}from"./ChevronUp-dfafe27b.js";import{A as b}from"./ArrowRight-43c97f7a.js";import{A as y}from"./AlertSignFill-5df5b7c7.js";import{p as g}from"./palette-f206f488.js";import{P as E}from"./Pencil-dd3fe667.js";import{C as _}from"./Calendar-a9aa98de.js";import{W as h}from"./Watch-3d5fc351.js";import{u as j,B as k}from"./useBreakpoint-a74f5af5.js";import{u as w}from"./useUuid-3b1e73f2.js";import{u as x}from"./usePrevious-ae293b10.js";import{B as C}from"./Badge-eebcb720.js";var N,I,B;!function(e){e.normal="normal",e.new="new",e.error="error",e.draft="draft"}(N||(N={})),function(e){e.fill="fill",e.white="white",e.stroke="stroke",e.line="line"}(I||(I={})),function(e){e.layout1="layout1",e.layout2="layout2",e.layout3a="layout3a",e.layout3b="layout3b",e.layout3c="layout3c"}(B||(B={}));var T=function(e){var a=e.status,l=e.statusMessage,o=i(s["status-message"],t({},s["status-message--new"],a===N.new));return a!==N.error&&a!==N.draft||!l?null:n.createElement("div",{className:o,"data-testid":"display-status"},n.createElement(p,Object.assign({},a===N.error?{color:g.cherry500,svgIcon:y}:{color:g.black,svgIcon:E},{size:m.XSmall}))," ",n.createElement("span",null,l))},A=function(e){var t=e.date,a=e.time;return t||a?n.createElement("div",{className:s["datetime-container"],"data-testid":"datetime"},t&&n.createElement("div",{className:s["datetime-container__icon"]},n.createElement(p,{svgIcon:_,size:m.XSmall}),n.createElement("span",null,t)),a&&n.createElement("div",{className:s["datetime-container__icon"]},n.createElement(p,{svgIcon:h,size:m.XSmall}),n.createElement("span",null,a))):null},M=n.forwardRef((function(e,t){var l=e.buttonText,o=e.buttonTextClose,r=e.url,i=e.target,s=e.onClick,c=e.renderAsExpander,u=e.isExpanded,m=e.buttonHtmlMarkup,y=void 0===m?"a":m,g=a(e,["buttonText","buttonTextClose","url","target","onClick","renderAsExpander","isExpanded","buttonHtmlMarkup"]);return c?n.createElement(d,Object.assign({testId:"expand",ref:t,onClick:s},g,{"aria-expanded":u}),u?o:l,n.createElement(p,{svgIcon:u?v:f})):n.createElement(d,Object.assign({testId:"url",ref:t,htmlMarkup:y,onClick:s,href:r,target:i},g),l,n.createElement(p,{svgIcon:b}))})),S=n.forwardRef((function(a,d){var m,p,f,v,b,y,g=a.children,E=a.contentA,_=a.contentB,h=a.className,S=a.testId,P=a.title,H=a.titleHtmlMarkup,O=void 0===H?"h2":H,R=a.url,z=a.target,D=void 0===z?"_self":z,W=a.icon,X=a.iconRight,U=void 0!==X&&X,F=a.variant,K=void 0===F?I.fill:F,q=a.status,G=void 0===q?N.normal:q,J=a.statusMessage,L=a.buttonText,Q=void 0===L?"Se detaljer":L,V=a.buttonTextClose,Y=void 0===V?"Skjul detaljer":V,Z=a.showCloseButtonInExpand,$=void 0===Z||Z,ee=a.layout,te=void 0===ee?B.layout2:ee,ae=a.containerAsButton,ne=void 0!==ae&&ae,le=a.date,oe=a.time,re=a.noTopBorder,ie=a.buttonOnClick,se=a.buttonHtmlMarkup,ce=a.expanded,de=void 0!==ce&&ce,ue=a.onExpand,me=a.renderChildrenWhenClosed,pe=void 0!==me&&me,fe=l(de),ve=e(fe,2),be=ve[0],ye=ve[1],ge=x(be),Ee=o(null),_e=w(),he=j();r((function(){de!==be&&ye(de)}),[de]),r((function(){ue&&be!==!!ge&&ue(be)}),[be,ue]);var je=[B.layout3a.toString(),B.layout3b.toString(),B.layout3c.toString()].includes(te),ke=i(s["panel-wrapper"],h),we=i(s.panel,(t(m={},s["panel--fill"],K===I.fill),t(m,s["panel--stroke"],K===I.stroke),t(m,s["panel--white"],K===I.white),t(m,s["panel--line"],K===I.line),t(m,s["panel--no-top-border"],K===I.line&&re),t(m,s["panel--selected"],be),t(m,s["panel--new"],G===N.new),t(m,s["panel--draft"],G===N.draft),t(m,s["panel--error"],G===N.error),t(m,s["panel--status"],G&&G!==N.normal),t(m,s["panel--with-icon"],W),t(m,s["panel--button"],ne),t(m,s["panel--clickable"],g||R||ue||ie||ne),m)),xe=i((t(p={},s.panel__container,te===B.layout2&&_),t(p,s["panel__container--layout3"],je&&_),t(p,s["panel__container--grow"],W),p)),Ce=i((t(f={},s["panel-content-a"],te===B.layout2),t(f,s["panel-content-a--layout3a"],te===B.layout3a),t(f,s["panel-content-a--layout3b"],te===B.layout3b),t(f,s["panel-content-a--layout3c"],te===B.layout3c),f)),Ne=i((t(v={},s["panel__content-right--layout1"],_&&te===B.layout1),t(v,s["panel__content-right--layout2"],_&&te===B.layout2),t(v,s["panel__content-right--layout3"],_&&je),t(v,s["panel__content-right--layout3a"],_&&te===B.layout3a),t(v,s["panel__content-right--layout3b"],_&&te===B.layout3b),t(v,s["panel__content-right--layout3c"],_&&te===B.layout3c),v)),Ie=i(s["panel-content-b"],(t(b={},s["panel-content-b--layout1"],te===B.layout1),t(b,s["panel-content-b--layout3"],je),b)),Be=i(s["panel__details-btn"]),Te=function(){var e=!(arguments.length>0&&void 0!==arguments[0])||arguments[0],t=arguments.length>1?arguments[1]:void 0,a={id:t,tabIndex:e?void 0:-1,variant:"borderless",ellipsis:!0};return n.createElement(M,Object.assign({renderAsExpander:!!g,onClick:ie||function(){return ye(!be)},isExpanded:be,buttonText:Q,url:R,target:D,buttonTextClose:Y,ref:t?Ee:void 0,buttonHtmlMarkup:se},a))},Ae=i(s["panel__btn-container"],(t(y={},s["panel__btn-container--layout3"],je),t(y,s["panel__btn-container--padding-top"],_),y));return n.createElement("div",{ref:d,"data-testid":S,className:ke,"data-analyticsid":u.Panel},n.createElement("div",{className:we,tabIndex:ne?0:void 0,onClick:function(){var e;ne&&(null===(e=Ee.current)||void 0===e||e.click())},onKeyDown:function(e){var t,a=e.key;!ne||"Enter"!==a&&" "!==a||(e.preventDefault(),null===(t=Ee.current)||void 0===t||t.click())},"aria-labelledby":ne?_e:void 0,role:ne?"button":void 0},W&&!U&&n.createElement("div",{className:s.panel__icon},W),n.createElement("div",{className:xe},n.createElement("div",{className:Ce},n.createElement(T,{status:G,statusMessage:J}),P&&n.createElement("div",{className:s["panel-content-a__title-container"]},n.createElement(c,{appearance:"title3",htmlMarkup:O},P),J&&G===N.new&&n.createElement(C,{color:"blueberry",testId:"badge-status",className:s.panel__badge},J)),E,he>=k.lg&&n.createElement(A,{date:le,time:oe})),n.createElement("div",{className:Ne},_&&n.createElement("div",{className:Ie},_),(g||R||le||oe||ie)&&n.createElement("div",{className:Ae},he<k.lg&&n.createElement(A,{date:le,time:oe}),(g||R||ie)&&n.createElement("div",{className:Be},Te(!ne,_e))))),W&&U&&n.createElement("div",{className:s["panel__icon--right"]},W)),function(){var e;if(!g)return null;if(!pe&&!be)return null;var a=i(s["panel-details"],(t(e={},s["panel-details--open"],be),t(e,s["panel-details--line"],K===I.line),t(e,s["panel-details--white"],K===I.white),t(e,s["panel-details--with-icon"],W),e));return n.createElement("div",{className:a,"data-testid":"panel-details"},n.createElement("div",null,g),$&&n.createElement("div",{className:Be},Te()))}())}));export{S as P,N as a,I as b,B as c};
2
- //# sourceMappingURL=Panel-bca5223d.js.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"Panel-bca5223d.js","sources":[],"sourcesContent":[],"names":[],"mappings":""}
@@ -1,2 +0,0 @@
1
- import{a as n,_ as i}from"./_rollupPluginBabelHelpers-0f007973.js";import{useEffect as t,useState as e}from"react";function o(n,i,t){var e;return[function(){var o=this,r=arguments,u=function(){e=null,t||n.apply(o,r)},a=t&&!e;e&&clearTimeout(e),e=setTimeout(u,i),a&&n.apply(o,r)},function(){e&&clearTimeout(e)}]}var r=function(e){var r=arguments.length>1&&void 0!==arguments[1]?arguments[1]:["layoutchange","resize","orientationchange"],u=arguments.length>2&&void 0!==arguments[2]?arguments[2]:10;t((function(){if("object"===("undefined"==typeof window?"undefined":n(window))){var t=o(e,u),a=i(t,2),d=a[0],c=a[1];return r.forEach((function(n){return window.addEventListener(n,d)})),d(),function(){c(),r.forEach((function(n){return window.removeEventListener(n,d)}))}}}),[])},u=function(n,t){var o=e(!1),u=i(o,2),a=u[0],d=u[1],c=e(!1),l=i(c,2),f=l[0],v=l[1],s=e(),g=i(s,2),h=g[0],p=g[1],w=e(),m=i(w,2),y=m[0],E=m[1];return r((function(){var i,e,o,r=(null===(i=n.current)||void 0===i?void 0:i.getBoundingClientRect())||{},u=r.top,a=void 0===u?0:u,c=r.width,l=void 0===c?0:c,f=r.bottom,s=void 0===f?0:f,g=null!==(o=null===(e=t.current)||void 0===e?void 0:e.getBoundingClientRect().height)&&void 0!==o?o:0;d(a<=0),v(s<=g),E(l),p(g)}),["resize","scroll"]),{isOutsideWindow:a,isLeavingWindow:f,offsetHeight:h,contentWidth:y}};export{u as a,o as d,r as u};
2
- //# sourceMappingURL=useSticky-432642c9.js.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"useSticky-432642c9.js","sources":[],"sourcesContent":[],"names":[],"mappings":""}