@mattilsynet/design 0.2.11 → 0.2.13

package/mtds/button/button.stories.d.ts

@@ -6,6 +6,7 @@ export default meta;
 type Story = StoryObj<typeof meta>;
 export declare const Default: Story;
 export declare const Sizes: Story;
+export declare const Colors: Story;
 export declare const Pressed: Story;
 export declare const WithArrows: Story;
 export declare const WithIcons: Story;

package/mtds/field/field.js.map

@@ -1 +1 @@
-{"version":3,"file":"field.js","sources":["../../designsystem/field/field.ts"],"sourcesContent":["import styles from '../styles.module.css';\nimport { QUICK_EVENT, isInputLike, off, on, onAdd, useId } from '../utils';\n\nconst CSS_FIELD = styles.field.split(' ')[0];\nconst CSS_VALIDATIONS = styles.validation.split(' ');\nconst CSS_VALIDATION = CSS_VALIDATIONS[0];\nconst BOUND = new WeakMap<Element | Document, ReturnType<typeof onAdd>>();\n\nfunction renderAria(fields: HTMLCollectionOf<Element>) {\n  for(const field of fields) {\n    const labels: HTMLLabelElement[] = [];\n    const descs: string[] = [];\n    let input: HTMLInputElement | null = null;\n    let valid = true;\n\n    for (const el of field.getElementsByTagName('*')) {\n      if (el instanceof HTMLLabelElement) labels.push(el);\n      else if (isInputLike(el)) input = el;\n      else if (el.classList.contains(CSS_VALIDATION)) { // Must be before instanceof HTMLParagraphElement since validation can also be a <p>\n        valid = el.getAttribute('data-color') === 'success';\n        descs.unshift(useId(el));\n      } else if (el instanceof HTMLParagraphElement) descs.push(useId(el));\n    }\n\n    if (input) for (const label of labels) label.htmlFor = useId(input);\n    if (input) renderCounter(input);\n\n    input?.setAttribute('aria-describedby', descs.join(' '));\n    input?.setAttribute('aria-invalid', `${!valid}`);\n  }\n}\nfunction handleInput({ target }: Event) {\n  if (isInputLike(target)) renderCounter(target);\n}\n\nfunction renderCounter(input: HTMLInputElement) {\n  const el = input?.nextElementSibling;\n  const limit = el?.getAttribute('data-count');\n\n  if (el && limit) {\n    const remainder = Number(limit) - input.value.length;\n    const nextInvalid = remainder < 0;\n    const prevInvalid = el.getAttribute('aria-live') === 'polite';\n\n    if (prevInvalid !== nextInvalid) {\n      el.setAttribute('aria-live', nextInvalid ? 'polite' : 'off');\n      for (const css of CSS_VALIDATIONS) el.classList.toggle(css, nextInvalid);\n    }\n    el.textContent = `${Math.abs(remainder)} tegn ${nextInvalid ? 'for mye' : 'igjen'}`;\n  }\n}\n\nexport function observe (el: Element | Document) {\n  const fields = el.getElementsByClassName(CSS_FIELD);\n  const add = onAdd(styles.fieldChildAdded, () => renderAria(fields));\n  BOUND.set(el, add);\n  add.observe(el);\n  on(el, 'input', handleInput, QUICK_EVENT);\n}\n\nexport function unobserve (el: Element | Document) {\n  BOUND.get(el)?.disconnect(el);\n  off(el, 'input', handleInput, QUICK_EVENT);\n}\n"],"names":["CSS_FIELD","styles","CSS_VALIDATIONS","CSS_VALIDATION","BOUND","renderAria","fields","field","labels","descs","input","valid","el","isInputLike","useId","label","handleInput","target","renderCounter","limit","remainder","nextInvalid","css","observe","add","onAdd","on","QUICK_EVENT","unobserve","_a","off"],"mappings":";;AAGA,MAAMA,IAAYC,EAAO,MAAM,MAAM,GAAG,EAAE,CAAC,GACrCC,IAAkBD,EAAO,WAAW,MAAM,GAAG,GAC7CE,IAAiBD,EAAgB,CAAC,GAClCE,wBAAY,QAAsD;AAExE,SAASC,EAAWC,GAAmC;AACrD,aAAUC,KAASD,GAAQ;AACzB,UAAME,IAA6B,CAAC,GAC9BC,IAAkB,CAAC;AACzB,QAAIC,IAAiC,MACjCC,IAAQ;AAEZ,eAAWC,KAAML,EAAM,qBAAqB,GAAG;AAC7C,MAAIK,aAAc,mBAAyBJ,EAAA,KAAKI,CAAE,IACzCC,EAAYD,CAAE,IAAWF,IAAAE,IACzBA,EAAG,UAAU,SAAST,CAAc,KACnCQ,IAAAC,EAAG,aAAa,YAAY,MAAM,WACpCH,EAAA,QAAQK,EAAMF,CAAE,CAAC,KACdA,aAAc,0BAA4B,KAAKE,EAAMF,CAAE,CAAC;AAGrE,QAAIF,EAAkB,YAAAK,KAASP,EAAc,CAAAO,EAAA,UAAUD,EAAMJ,CAAK;AAC9D,IAAAA,OAAqBA,CAAK,GAE9BA,KAAA,QAAAA,EAAO,aAAa,oBAAoBD,EAAM,KAAK,GAAG,IACtDC,KAAA,QAAAA,EAAO,aAAa,gBAAgB,GAAG,CAACC,CAAK;AAAA,EAAE;AAEnD;AACA,SAASK,EAAY,EAAE,QAAAC,KAAiB;AACtC,EAAIJ,EAAYI,CAAM,KAAGC,EAAcD,CAAM;AAC/C;AAEA,SAASC,EAAcR,GAAyB;AAC9C,QAAME,IAAKF,KAAA,gBAAAA,EAAO,oBACZS,IAAQP,KAAA,gBAAAA,EAAI,aAAa;AAE/B,MAAIA,KAAMO,GAAO;AACf,UAAMC,IAAY,OAAOD,CAAK,IAAIT,EAAM,MAAM,QACxCW,IAAcD,IAAY;AAGhC,QAFoBR,EAAG,aAAa,WAAW,MAAM,aAEjCS,GAAa;AAC/B,MAAAT,EAAG,aAAa,aAAaS,IAAc,WAAW,KAAK;AAC3D,iBAAWC,KAAOpB,EAAiB,CAAAU,EAAG,UAAU,OAAOU,GAAKD,CAAW;AAAA,IAAA;AAEtE,IAAAT,EAAA,cAAc,GAAG,KAAK,IAAIQ,CAAS,CAAC,SAASC,IAAc,YAAY,OAAO;AAAA,EAAA;AAErF;AAEO,SAASE,EAASX,GAAwB;AACzC,QAAAN,IAASM,EAAG,uBAAuBZ,CAAS,GAC5CwB,IAAMC,EAAMxB,EAAO,iBAAiB,MAAMI,EAAWC,CAAM,CAAC;AAC5D,EAAAF,EAAA,IAAIQ,GAAIY,CAAG,GACjBA,EAAI,QAAQZ,CAAE,GACXc,EAAAd,GAAI,SAASI,GAAaW,CAAW;AAC1C;AAEO,SAASC,EAAWhB,GAAwB;;AACjD,GAAAiB,IAAAzB,EAAM,IAAIQ,CAAE,MAAZ,QAAAiB,EAAe,WAAWjB,IACtBkB,EAAAlB,GAAI,SAASI,GAAaW,CAAW;AAC3C;"}
+{"version":3,"file":"field.js","sources":["../../designsystem/field/field.ts"],"sourcesContent":["import styles from '../styles.module.css';\nimport { QUICK_EVENT, isInputLike, off, on, onAdd, useId } from '../utils';\n\nconst CSS_FIELD = styles.field.split(' ')[0];\nconst CSS_VALIDATIONS = styles.validation.split(' ');\nconst CSS_VALIDATION = CSS_VALIDATIONS[0];\nconst BOUND = new WeakMap<Element | Document, ReturnType<typeof onAdd>>();\n\nfunction renderAria(fields: HTMLCollectionOf<Element>) {\n  for(const field of fields) {\n    const labels: HTMLLabelElement[] = [];\n    const descs: string[] = [];\n    let input: HTMLInputElement | null = null;\n    let valid = true;\n\n    for (const el of field.getElementsByTagName('*')) {\n      if (el instanceof HTMLLabelElement) labels.push(el);\n      else if (isInputLike(el)) input = el;\n      else if (el.classList.contains(CSS_VALIDATION)) { // Must be before instanceof HTMLParagraphElement since validation can also be a <p>\n        valid = el.getAttribute('data-color') === 'success';\n        descs.unshift(useId(el));\n      } else if (el instanceof HTMLParagraphElement) descs.push(useId(el));\n    }\n\n    if (input) for (const label of labels) label.htmlFor = useId(input);\n    if (input) renderCounter(input);\n\n    input?.setAttribute('aria-describedby', descs.join(' '));\n    input?.setAttribute('aria-invalid', `${!valid}`);\n  }\n}\nfunction handleInput({ target }: Event) {\n  if (isInputLike(target)) renderCounter(target);\n}\n\nfunction renderCounter(input: HTMLInputElement) {\n  const el = input?.nextElementSibling;\n  const limit = el?.getAttribute('data-count');\n\n  if (el && limit) {\n    const remainder = Number(limit) - input.value.length;\n    const nextInvalid = remainder < 0;\n    const prevInvalid = el.getAttribute('aria-live') === 'polite';\n\n    if (prevInvalid !== nextInvalid) {\n      el.setAttribute('aria-live', nextInvalid ? 'polite' : 'off');\n      for (const css of CSS_VALIDATIONS) el.classList.toggle(css, nextInvalid);\n    }\n    el.textContent = `${Math.abs(remainder)} tegn ${nextInvalid ? 'for mye' : 'igjen'}`;\n  }\n}\n\nexport function observe (el: Element | Document) {\n  const fields = el.getElementsByClassName(CSS_FIELD);\n  const add = onAdd(styles.fieldChildAdded, () => renderAria(fields));\n  BOUND.set(el, add);\n  add.observe(el);\n  on(el, 'input', handleInput, QUICK_EVENT);\n}\n\nexport function unobserve (el: Element | Document) {\n  BOUND.get(el)?.disconnect(el);\n  off(el, 'input', handleInput, QUICK_EVENT);\n}\n\n\n// TODO: Remove invalid when errormessage is gone"],"names":["CSS_FIELD","styles","CSS_VALIDATIONS","CSS_VALIDATION","BOUND","renderAria","fields","field","labels","descs","input","valid","el","isInputLike","useId","label","handleInput","target","renderCounter","limit","remainder","nextInvalid","css","observe","add","onAdd","on","QUICK_EVENT","unobserve","_a","off"],"mappings":";;AAGA,MAAMA,IAAYC,EAAO,MAAM,MAAM,GAAG,EAAE,CAAC,GACrCC,IAAkBD,EAAO,WAAW,MAAM,GAAG,GAC7CE,IAAiBD,EAAgB,CAAC,GAClCE,wBAAY,QAAsD;AAExE,SAASC,EAAWC,GAAmC;AACrD,aAAUC,KAASD,GAAQ;AACzB,UAAME,IAA6B,CAAC,GAC9BC,IAAkB,CAAC;AACzB,QAAIC,IAAiC,MACjCC,IAAQ;AAEZ,eAAWC,KAAML,EAAM,qBAAqB,GAAG;AAC7C,MAAIK,aAAc,mBAAyBJ,EAAA,KAAKI,CAAE,IACzCC,EAAYD,CAAE,IAAWF,IAAAE,IACzBA,EAAG,UAAU,SAAST,CAAc,KACnCQ,IAAAC,EAAG,aAAa,YAAY,MAAM,WACpCH,EAAA,QAAQK,EAAMF,CAAE,CAAC,KACdA,aAAc,0BAA4B,KAAKE,EAAMF,CAAE,CAAC;AAGrE,QAAIF,EAAkB,YAAAK,KAASP,EAAc,CAAAO,EAAA,UAAUD,EAAMJ,CAAK;AAC9D,IAAAA,OAAqBA,CAAK,GAE9BA,KAAA,QAAAA,EAAO,aAAa,oBAAoBD,EAAM,KAAK,GAAG,IACtDC,KAAA,QAAAA,EAAO,aAAa,gBAAgB,GAAG,CAACC,CAAK;AAAA,EAAE;AAEnD;AACA,SAASK,EAAY,EAAE,QAAAC,KAAiB;AACtC,EAAIJ,EAAYI,CAAM,KAAGC,EAAcD,CAAM;AAC/C;AAEA,SAASC,EAAcR,GAAyB;AAC9C,QAAME,IAAKF,KAAA,gBAAAA,EAAO,oBACZS,IAAQP,KAAA,gBAAAA,EAAI,aAAa;AAE/B,MAAIA,KAAMO,GAAO;AACf,UAAMC,IAAY,OAAOD,CAAK,IAAIT,EAAM,MAAM,QACxCW,IAAcD,IAAY;AAGhC,QAFoBR,EAAG,aAAa,WAAW,MAAM,aAEjCS,GAAa;AAC/B,MAAAT,EAAG,aAAa,aAAaS,IAAc,WAAW,KAAK;AAC3D,iBAAWC,KAAOpB,EAAiB,CAAAU,EAAG,UAAU,OAAOU,GAAKD,CAAW;AAAA,IAAA;AAEtE,IAAAT,EAAA,cAAc,GAAG,KAAK,IAAIQ,CAAS,CAAC,SAASC,IAAc,YAAY,OAAO;AAAA,EAAA;AAErF;AAEO,SAASE,EAASX,GAAwB;AACzC,QAAAN,IAASM,EAAG,uBAAuBZ,CAAS,GAC5CwB,IAAMC,EAAMxB,EAAO,iBAAiB,MAAMI,EAAWC,CAAM,CAAC;AAC5D,EAAAF,EAAA,IAAIQ,GAAIY,CAAG,GACjBA,EAAI,QAAQZ,CAAE,GACXc,EAAAd,GAAI,SAASI,GAAaW,CAAW;AAC1C;AAEO,SAASC,EAAWhB,GAAwB;;AACjD,GAAAiB,IAAAzB,EAAM,IAAIQ,CAAE,MAAZ,QAAAiB,EAAe,WAAWjB,IACtBkB,EAAAlB,GAAI,SAASI,GAAaW,CAAW;AAC3C;"}

package/mtds/index.iife.js

@@ -1,2 +1,2 @@
-var mtds=function(u){"use strict";const v="_validation_f0nxn_1 _ds-validation-message_1yo2l_1",h="_tag_f0nxn_1 _ds-tag_1yo2l_1",x="_tabs_f0nxn_1",A="_table_f0nxn_1 _ds-table_1yo2l_1",S="_scrollShadow_f0nxn_1",M="_tableChildAdded_f0nxn_1",$="_skeleton_f0nxn_1 _ds-skeleton_1yo2l_1",E="_popover_f0nxn_1",C="_pagination_f0nxn_1 _ds-pagination_1yo2l_1",w="_modal_f0nxn_1 _ds-modal_1yo2l_1",I="_logo_f0nxn_1 _ds-focus_1yo2l_1",T="_link_f0nxn_1",k="_grid_f0nxn_1",N="_flex_f0nxn_1",B="_box_f0nxn_1",L="_input_f0nxn_1 _ds-input_1yo2l_1",O="_fieldset_f0nxn_1 _ds-fieldset_1yo2l_1",D="_fieldsetValidationAdded_f0nxn_1",H="_field_f0nxn_1 _ds-field_1yo2l_1",P="_fieldChildAdded_f0nxn_1",V="_affixes_f0nxn_1 _ds-field-affixes_1yo2l_1",W="_count_f0nxn_1",U="_errorsummary_f0nxn_1 _ds-error-summary_1yo2l_1",j="_details_f0nxn_1 _ds-details_1yo2l_1",F="_chip_f0nxn_1 _ds-chip_1yo2l_1",z="_card_f0nxn_1",q="_info_f0nxn_1",R="_button_f0nxn_1 _ds-button_1yo2l_1",Y="_breadcrumbs_f0nxn_1 _ds-breadcrumbs_1yo2l_1",K="_badge_f0nxn_1",Q="_avatar_f0nxn_1 _ds-avatar_1yo2l_1",X="_alert_f0nxn_1 _ds-alert_1yo2l_1",G="_heading_f0nxn_1 _ds-heading_1yo2l_1",J="_body_f0nxn_100",c={validation:v,tag:h,tabs:x,table:A,scrollShadow:S,tableChildAdded:M,skeleton:$,popover:E,pagination:C,modal:w,logo:I,link:T,grid:k,flex:N,box:B,input:L,fieldset:O,fieldsetValidationAdded:D,field:H,fieldChildAdded:P,affixes:V,count:W,errorsummary:U,details:j,chip:F,card:z,info:q,button:R,breadcrumbs:Y,badge:K,avatar:Q,alert:X,heading:G,body:J},_t=Object.freeze(Object.defineProperty({__proto__:null,affixes:V,alert:X,avatar:Q,badge:K,body:J,box:B,breadcrumbs:Y,button:R,card:z,chip:F,count:W,default:c,details:j,errorsummary:U,field:H,fieldChildAdded:P,fieldset:O,fieldsetValidationAdded:D,flex:N,grid:k,heading:G,info:q,input:L,link:T,logo:I,modal:w,pagination:C,popover:E,scrollShadow:S,skeleton:$,table:A,tableChildAdded:M,tabs:x,tag:h,validation:v},Symbol.toStringTag,{value:"Module"})),Z=typeof window<"u"&&typeof document<"u",d={capture:!0,passive:!0};let ut=0;const gt=`${Date.now().toString(36)}${Math.random().toString(36).slice(2,5)}`;function b(t){return t.id||(t.id=`${gt}${++ut}`),t.id}const tt=(t,n,o)=>{for(const s of o[0].split(","))o[0]=s,Element.prototype[`${t}EventListener`].apply(n,o)},f=(t,...n)=>tt("add",t,n),_=(t,...n)=>tt("remove",t,n),m=(t,n)=>{let o=0;const s=e=>{e.animationName===t&&(cancelAnimationFrame(o),o=requestAnimationFrame(n))};return{observe:e=>f(e,"animationend",s,d),disconnect:e=>_(e,"animationstart",s,d)}},y=t=>t instanceof HTMLElement&&"validity"in t&&!(t instanceof HTMLButtonElement),pt=c.field.split(" ")[0],nt=c.validation.split(" "),bt=nt[0],et=new WeakMap;function mt(t){for(const n of t){const o=[],s=[];let e=null,a=!0;for(const i of n.getElementsByTagName("*"))i instanceof HTMLLabelElement?o.push(i):y(i)?e=i:i.classList.contains(bt)?(a=i.getAttribute("data-color")==="success",s.unshift(b(i))):i instanceof HTMLParagraphElement&&s.push(b(i));if(e)for(const i of o)i.htmlFor=b(e);e&&st(e),e==null||e.setAttribute("aria-describedby",s.join(" ")),e==null||e.setAttribute("aria-invalid",`${!a}`)}}function ot({target:t}){y(t)&&st(t)}function st(t){const n=t==null?void 0:t.nextElementSibling,o=n==null?void 0:n.getAttribute("data-count");if(n&&o){const s=Number(o)-t.value.length,e=s<0;if(n.getAttribute("aria-live")==="polite"!==e){n.setAttribute("aria-live",e?"polite":"off");for(const i of nt)n.classList.toggle(i,e)}n.textContent=`${Math.abs(s)} tegn ${e?"for mye":"igjen"}`}}function yt(t){const n=t.getElementsByClassName(pt),o=m(c.fieldChildAdded,()=>mt(n));et.set(t,o),o.observe(t),f(t,"input",ot,d)}function vt(t){var n;(n=et.get(t))==null||n.disconnect(t),_(t,"input",ot,d)}const ht=c.fieldset.split(" ")[0],xt=c.validation.split(" ")[0],it=new WeakMap;function At(t){for(const n of t){const o=[];let s="";for(const e of n.getElementsByTagName("*"))e.classList.contains(xt)?s=b(e):y(e)&&o.push(e);if(s)for(const e of o)e.setAttribute("aria-describedby",s),e.setAttribute("aria-invalid","true")}}function St(t){const n=t.getElementsByClassName(ht),o=m(c.fieldsetValidationAdded,()=>At(n));it.set(t,o),o.observe(t)}function Mt(t){var n;(n=it.get(t))==null||n.disconnect(t)}function $t(t){f(t,"click",ct),f(t,"toggle",dt,d)}function Et(t){_(t,"click",ct),_(t,"toggle",dt,d)}const at=c.popover.split(" ")[0],l=Z?document.createElement("div"):null;l&&(l.style.cssText="position:absolute;padding:1px");function dt({target:t,newState:n}){var e;const s=n==="open"&&t instanceof HTMLElement&&t.classList.contains(at)&&((e=t.getRootNode())==null?void 0:e.querySelector(`[popovertarget="${t.id}"]`));if(s){const a=t.getAttribute("data-position")==="over",i=()=>Ct(s,t,a),r=({newState:g})=>{g!=="open"&&(_(document,"DOMContentReady",i,d),_(t,"toggle",r,d),_(window,"load,resize,scroll",i,d),l==null||l.remove())};document.body.append(l||""),document.fonts.ready.then(i),f(window,"load,resize,scroll",i,d),f(document,"DOMContentReady",i,d),f(t,"toggle",r,d)}}function ct(t){var o;const n=t.target instanceof Element&&t.target.closest("a");if(n){const s=n.getRootNode(),e=((o=s.getElementById)==null?void 0:o.call(s,n.getAttribute("popovertarget")||""))||n.closest(`.${at}`),a=n.getAttribute("popovertargetaction")||"toggle";t.defaultPrevented||e==null||e.togglePopover(a==="show"||(a==="hide"?!1:void 0))}}function Ct(t,n,o=!1){if(!t)return;const{offsetWidth:s,offsetHeight:e}=n,{offsetWidth:a,offsetHeight:i}=t,{width:r,height:g,left:Ot,top:Dt}=t.getBoundingClientRect(),Ht=Math.round(Ot-(a-r)/2),p=Math.round(Dt-(i-g)/2),Pt=p+i+e<window.innerHeight,Vt=p-e>0,ft=!o&&Pt||!Vt,Wt=ft?window.scrollY+p+i+e+30:0;n.style.left=`${Math.round(Math.min(Math.max(10,Ht),window.innerWidth-s-10))}px`,n.style.top=`${Math.round(ft?p+i:p-e)}px`,l==null||l.style.setProperty("top",`${Math.round(Wt)}px`)}const wt=c.table.split(" ")[0],lt=new WeakMap;function It(t){var n,o;for(const s of t)if(s instanceof HTMLTableElement){const e=Array.from(((o=(n=s.tHead)==null?void 0:n.rows[0])==null?void 0:o.cells)||[],a=>{var i;return(i=a.innerText)==null?void 0:i.trim()});for(const a of s.tBodies)for(const i of a.rows)for(const r of i.cells)r.setAttribute("data-th",e[r.cellIndex]||":empty")}}function Tt(t){const n=t.getElementsByClassName(wt),o=m(c.tableChildAdded,()=>It(n));lt.set(t,o),o.observe(t)}function kt(t){var n;(n=lt.get(t))==null||n.disconnect(t)}const Nt=(t,n,o)=>{const s=(o-1)/2,e=Math.max(Math.min(t-Math.floor(s),n-o+1),1),a=Math.min(Math.max(t+Math.ceil(s),o),n),i=Array.from({length:a+1-e},(r,g)=>g+e);return o>4&&e>1&&i.splice(0,2,1,0),o>3&&a<n&&i.splice(-2,2,0,n),i},Bt=({current:t=1,total:n=10,show:o=7})=>({prev:t>1?t-1:0,next:t<n?t+1:0,pages:Nt(t,n,o).map((s,e)=>({current:s===t&&"page",key:`key-${s}-${e}`,page:s}))});Z&&rt(document);function rt(t){yt(t),St(t),$t(t),Tt(t)}function Lt(t){vt(t),Mt(t),Et(t),kt(t)}return u.observe=rt,u.pagination=Bt,u.styles=_t,u.unobserve=Lt,Object.defineProperty(u,Symbol.toStringTag,{value:"Module"}),u}({});
+var mtds=function(_){"use strict";const A="_validation_1p8e7_1 _ds-validation-message_1yo2l_1",S="_tag_1p8e7_1 _ds-tag_1yo2l_1",M="_tabs_1p8e7_1",$="_table_1p8e7_1 _ds-table_1yo2l_1",C="_scrollShadow_1p8e7_1",E="_tableChildAdded_1p8e7_1",I="_skeleton_1p8e7_1 _ds-skeleton_1yo2l_1",T="_popover_1p8e7_1",k="_pagination_1p8e7_1 _ds-pagination_1yo2l_1",w="_modal_1p8e7_1 _ds-modal_1yo2l_1",N="_logo_1p8e7_1 _ds-focus_1yo2l_1",x="_link_1p8e7_1",B="_grid_1p8e7_1",L="_flex_1p8e7_1",O="_box_1p8e7_1",P="_input_1p8e7_1 _ds-input_1yo2l_1",H="_fieldset_1p8e7_1 _ds-fieldset_1yo2l_1",D="_fieldsetValidationAdded_1p8e7_1",V="_field_1p8e7_1 _ds-field_1yo2l_1",W="_fieldChildAdded_1p8e7_1",U="_affixes_1p8e7_1 _ds-field-affixes_1yo2l_1",j="_count_1p8e7_1",F="_errorsummary_1p8e7_1 _ds-error-summary_1yo2l_1",q="_details_1p8e7_1 _ds-details_1yo2l_1",z="_chip_1p8e7_1 _ds-chip_1yo2l_1",Y="_card_1p8e7_1",G="_info_1p8e7_1",K="_button_1p8e7_1 _ds-button_1yo2l_1",Q="_breadcrumbs_1p8e7_1 _ds-breadcrumbs_1yo2l_1",R="_badge_1p8e7_1",X="_avatar_1p8e7_1 _ds-avatar_1yo2l_1",J="_alert_1p8e7_1 _ds-alert_1yo2l_1",Z="_heading_1p8e7_1 _ds-heading_1yo2l_1",tt="_body_1p8e7_104",d={validation:A,tag:S,tabs:M,table:$,scrollShadow:C,tableChildAdded:E,skeleton:I,popover:T,pagination:k,modal:w,logo:N,link:x,grid:B,flex:L,box:O,input:P,fieldset:H,fieldsetValidationAdded:D,field:V,fieldChildAdded:W,affixes:U,count:j,errorsummary:F,details:q,chip:z,card:Y,info:G,button:K,breadcrumbs:Q,badge:R,avatar:X,alert:J,heading:Z,body:tt},pt=Object.freeze(Object.defineProperty({__proto__:null,affixes:U,alert:J,avatar:X,badge:R,body:tt,box:O,breadcrumbs:Q,button:K,card:Y,chip:z,count:j,default:d,details:q,errorsummary:F,field:V,fieldChildAdded:W,fieldset:H,fieldsetValidationAdded:D,flex:L,grid:B,heading:Z,info:G,input:P,link:x,logo:N,modal:w,pagination:k,popover:T,scrollShadow:C,skeleton:I,table:$,tableChildAdded:E,tabs:M,tag:S,validation:A},Symbol.toStringTag,{value:"Module"})),et=typeof window<"u"&&typeof document<"u",c={capture:!0,passive:!0};let bt=0;const gt=`${Date.now().toString(36)}${Math.random().toString(36).slice(2,5)}`;function p(t){return t.id||(t.id=`${gt}${++bt}`),t.id}const ot=(t,e,n)=>{for(const s of n[0].split(","))n[0]=s,e[`${t}EventListener`](...n)},r=(t,...e)=>ot("add",t,e),b=(t,...e)=>ot("remove",t,e),y=(t,e)=>{let n=0;const s=o=>{o.animationName===t&&(cancelAnimationFrame(n),n=requestAnimationFrame(e))};return{observe:o=>r(o,"animationend",s,c),disconnect:o=>b(o,"animationstart",s,c)}},v=t=>t instanceof HTMLElement&&"validity"in t&&!(t instanceof HTMLButtonElement),mt=d.field.split(" ")[0],nt=d.validation.split(" "),yt=nt[0],st=new WeakMap;function vt(t){for(const e of t){const n=[],s=[];let o=null,a=!0;for(const i of e.getElementsByTagName("*"))i instanceof HTMLLabelElement?n.push(i):v(i)?o=i:i.classList.contains(yt)?(a=i.getAttribute("data-color")==="success",s.unshift(p(i))):i instanceof HTMLParagraphElement&&s.push(p(i));if(o)for(const i of n)i.htmlFor=p(o);o&&at(o),o==null||o.setAttribute("aria-describedby",s.join(" ")),o==null||o.setAttribute("aria-invalid",`${!a}`)}}function it({target:t}){v(t)&&at(t)}function at(t){const e=t==null?void 0:t.nextElementSibling,n=e==null?void 0:e.getAttribute("data-count");if(e&&n){const s=Number(n)-t.value.length,o=s<0;if(e.getAttribute("aria-live")==="polite"!==o){e.setAttribute("aria-live",o?"polite":"off");for(const i of nt)e.classList.toggle(i,o)}e.textContent=`${Math.abs(s)} tegn ${o?"for mye":"igjen"}`}}function ht(t){const e=t.getElementsByClassName(mt),n=y(d.fieldChildAdded,()=>vt(e));st.set(t,n),n.observe(t),r(t,"input",it,c)}function At(t){var e;(e=st.get(t))==null||e.disconnect(t),b(t,"input",it,c)}const St=d.fieldset.split(" ")[0],Mt=d.validation.split(" ")[0],dt=new WeakMap;function $t(t){for(const e of t){const n=[];let s="";for(const o of e.getElementsByTagName("*"))o.classList.contains(Mt)?s=p(o):v(o)&&n.push(o);if(s)for(const o of n)o.setAttribute("aria-describedby",s),o.setAttribute("aria-invalid","true")}}function Ct(t){const e=t.getElementsByClassName(St),n=y(d.fieldsetValidationAdded,()=>$t(e));dt.set(t,n),n.observe(t)}function Et(t){var e;(e=dt.get(t))==null||e.disconnect(t)}function It(t){r(t,"click",_t),r(t,"toggle",lt,c),r(window,"load,resize,scroll",m,c),r(document,"DOMContentReady",m,c),document.fonts.ready.then(m)}function Tt(t){b(t,"click",_t),b(t,"toggle",lt,c)}const ct=d.popover.split(" ")[0],l=et?document.createElement("div"):null,g=new Map;l==null||l.setAttribute("style","position:absolute;padding:1px");function lt({target:t,newState:e}){var n;if(t instanceof HTMLElement&&t.classList.contains(ct)){const s=(n=t.getRootNode())==null?void 0:n.querySelector(`[popovertarget="${t.id}"]`),o=t.getAttribute("data-position")==="over";e==="closed"?g.delete(t):s&&g.set(t,()=>kt(s,t,o)),document.body.append(l||""),m()}}function m(){for(const[t,e]of g)e()}function _t(t){var n;const e=t.target instanceof Element&&t.target.closest("a");if(e){const s=e.getRootNode(),o=((n=s.getElementById)==null?void 0:n.call(s,e.getAttribute("popovertarget")||""))||e.closest(`.${ct}`),a=e.getAttribute("popovertargetaction")||"toggle";t.defaultPrevented||o==null||o.togglePopover(a==="show"||(a==="hide"?!1:void 0))}}function kt(t,e,n=!1){if(!(t!=null&&t.isConnected)||!(e!=null&&e.isConnected))return g.delete(e);const{offsetWidth:s,offsetHeight:o}=e,{offsetWidth:a,offsetHeight:i}=t,{width:f,height:h,left:Ht,top:Dt}=t.getBoundingClientRect(),Vt=Math.round(Ht-(a-f)/2),u=Math.round(Dt-(i-h)/2),Wt=u+i+o<window.innerHeight,Ut=u-o>0,ut=!n&&Wt||!Ut,jt=ut?window.scrollY+u+i+o+30:0;e.style.left=`${Math.round(Math.min(Math.max(10,Vt),window.innerWidth-s-10))}px`,e.style.top=`${Math.round(ut?u+i:u-o)}px`,l==null||l.style.setProperty("top",`${Math.round(jt)}px`)}const wt=d.table.split(" ")[0],rt=new WeakMap;function Nt(t){var e,n;for(const s of t)if(s instanceof HTMLTableElement){const o=Array.from(((n=(e=s.tHead)==null?void 0:e.rows[0])==null?void 0:n.cells)||[],a=>{var i;return(i=a.innerText)==null?void 0:i.trim()});for(const a of s.tBodies)for(const i of a.rows)for(const f of i.cells)f.setAttribute("data-th",o[f.cellIndex]||":empty")}}function xt(t){const e=t.getElementsByClassName(wt),n=y(d.tableChildAdded,()=>Nt(e));rt.set(t,n),n.observe(t)}function Bt(t){var e;(e=rt.get(t))==null||e.disconnect(t)}const Lt=(t,e,n)=>{const s=(n-1)/2,o=Math.max(Math.min(t-Math.floor(s),e-n+1),1),a=Math.min(Math.max(t+Math.ceil(s),n),e),i=Array.from({length:a+1-o},(f,h)=>h+o);return n>4&&o>1&&i.splice(0,2,1,0),n>3&&a<e&&i.splice(-2,2,0,e),i},Ot=({current:t=1,total:e=10,show:n=7})=>({prev:t>1?t-1:0,next:t<e?t+1:0,pages:Lt(t,e,n).map((s,o)=>({current:s===t&&"page",key:`key-${s}-${o}`,page:s}))});et&&ft(document);function ft(t){ht(t),Ct(t),It(t),xt(t)}function Pt(t){At(t),Et(t),Tt(t),Bt(t)}return _.observe=ft,_.pagination=Ot,_.styles=pt,_.unobserve=Pt,Object.defineProperty(_,Symbol.toStringTag,{value:"Module"}),_}({});
 //# sourceMappingURL=index.iife.js.map

package/mtds/index.iife.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.iife.js","sources":["../designsystem/utils.ts","../designsystem/field/field.ts","../designsystem/fieldset/fieldset.ts","../designsystem/popover/popover.ts","../designsystem/table/table.ts","../designsystem/pagination/pagination.ts","../designsystem/index.ts"],"sourcesContent":["export const IS_BROWSER = typeof window !== 'undefined' && typeof document !== 'undefined';\nexport const QUICK_EVENT = { capture: true, passive: true };\n\n/**\n * useId\n * @return A generated unique ID\n */\nlet id = 0;\nconst UUID = `${Date.now().toString(36)}${Math.random().toString(36).slice(2, 5)}`;\nexport function useId (el: Element) {\n  if (!el.id) el.id = `${UUID}${++id}`;\n\treturn el.id;\n};\n\n/**\n * Speed up MutationObserver by debouncing and only running when page is visible\n * @return new MutaionObserver\n */\nexport function createOptimizedMutationObserver(callback: MutationCallback) {\n  const queue: MutationRecord[] = [];\n  const observer = new MutationObserver((mutations) => {\n    if (!queue[0]) requestAnimationFrame(process);\n    queue.push(...mutations);\n  });\n\n  const process = () => {\n    callback(queue, observer);\n    queue.length = 0; // Reset queue\n  };\n\n  return observer;\n}\n\n// Internal helper for on / off\nconst events = (\n\taction: \"add\" | \"remove\",\n\telement: Node | Window,\n\trest: Parameters<typeof Element.prototype.addEventListener>,\n): void => {\n\tfor (const type of rest[0].split(\",\")) {\n\t\trest[0] = type;\n\t\tElement.prototype[`${action}EventListener`].apply(element, rest);\n\t}\n};\n\n/**\n * on\n * @param element The Element to use as EventTarget\n * @param types A comma separated string of event types\n * @param listener An event listener function or listener object\n */\nexport const on = (\n\telement: Node | Window,\n\t...rest: Parameters<typeof Element.prototype.addEventListener>\n): void => events(\"add\", element, rest);\n\n/**\n * off\n * @param element The Element to use as EventTarget\n * @param types A comma separated string of event types\n * @param listener An event listener function or listener object\n */\nexport const off = (\n\telement: Node | Window,\n\t...rest: Parameters<typeof Element.prototype.removeEventListener>\n): void => events(\"remove\", element, rest);\n\n/**\n * Child added event inspired by:\n * https://davidwalsh.name/detect-node-insertion\n */\nexport const onAdd = (animationName: string, callback: () => void) => {\n  let timer: ReturnType<typeof requestAnimationFrame> | number = 0;\n  const onAnimation = (event: Event & { animationName?: string }) => {\n    if (event.animationName === animationName) {\n      cancelAnimationFrame(timer);\n      timer = requestAnimationFrame(callback);\n    }\n  };\n\n\treturn {\n\t\tobserve: (el: Element | Document, ) => on(el, 'animationend', onAnimation, QUICK_EVENT),\n\t\tdisconnect: (el: Element | Document, ) => off(el, 'animationstart', onAnimation, QUICK_EVENT)\n\t};\n}\n\nexport const isInputLike = (el: unknown): el is HTMLInputElement =>\n\tel instanceof HTMLElement && 'validity' in el && !(el instanceof HTMLButtonElement);\n\n// Make React support popover=\"\"target attribute\n// https://github.com/facebook/react/issues/27479\ndeclare global {\n\tnamespace React.JSX {\n\t\tinterface IntrinsicAttributes {\n\t\t\tpopovertargetaction?: string;\n\t\t\tpopovertarget?: string;\n\t\t\tpopover?: string | boolean;\n\t\t}\n\t}\n\tnamespace React {\n\t\tinterface HTMLAttributes<T> {\n\t\t\tpopovertargetaction?: string;\n\t\t\tpopovertarget?: string;\n\t\t\tpopover?: \"\" | \"auto\" | \"manual\" | undefined;\n\t\t}\n\t}\n}","import styles from '../styles.module.css';\nimport { QUICK_EVENT, isInputLike, off, on, onAdd, useId } from '../utils';\n\nconst CSS_FIELD = styles.field.split(' ')[0];\nconst CSS_VALIDATIONS = styles.validation.split(' ');\nconst CSS_VALIDATION = CSS_VALIDATIONS[0];\nconst BOUND = new WeakMap<Element | Document, ReturnType<typeof onAdd>>();\n\nfunction renderAria(fields: HTMLCollectionOf<Element>) {\n  for(const field of fields) {\n    const labels: HTMLLabelElement[] = [];\n    const descs: string[] = [];\n    let input: HTMLInputElement | null = null;\n    let valid = true;\n\n    for (const el of field.getElementsByTagName('*')) {\n      if (el instanceof HTMLLabelElement) labels.push(el);\n      else if (isInputLike(el)) input = el;\n      else if (el.classList.contains(CSS_VALIDATION)) { // Must be before instanceof HTMLParagraphElement since validation can also be a <p>\n        valid = el.getAttribute('data-color') === 'success';\n        descs.unshift(useId(el));\n      } else if (el instanceof HTMLParagraphElement) descs.push(useId(el));\n    }\n\n    if (input) for (const label of labels) label.htmlFor = useId(input);\n    if (input) renderCounter(input);\n\n    input?.setAttribute('aria-describedby', descs.join(' '));\n    input?.setAttribute('aria-invalid', `${!valid}`);\n  }\n}\nfunction handleInput({ target }: Event) {\n  if (isInputLike(target)) renderCounter(target);\n}\n\nfunction renderCounter(input: HTMLInputElement) {\n  const el = input?.nextElementSibling;\n  const limit = el?.getAttribute('data-count');\n\n  if (el && limit) {\n    const remainder = Number(limit) - input.value.length;\n    const nextInvalid = remainder < 0;\n    const prevInvalid = el.getAttribute('aria-live') === 'polite';\n\n    if (prevInvalid !== nextInvalid) {\n      el.setAttribute('aria-live', nextInvalid ? 'polite' : 'off');\n      for (const css of CSS_VALIDATIONS) el.classList.toggle(css, nextInvalid);\n    }\n    el.textContent = `${Math.abs(remainder)} tegn ${nextInvalid ? 'for mye' : 'igjen'}`;\n  }\n}\n\nexport function observe (el: Element | Document) {\n  const fields = el.getElementsByClassName(CSS_FIELD);\n  const add = onAdd(styles.fieldChildAdded, () => renderAria(fields));\n  BOUND.set(el, add);\n  add.observe(el);\n  on(el, 'input', handleInput, QUICK_EVENT);\n}\n\nexport function unobserve (el: Element | Document) {\n  BOUND.get(el)?.disconnect(el);\n  off(el, 'input', handleInput, QUICK_EVENT);\n}\n","import styles from '../styles.module.css';\nimport { isInputLike, onAdd, useId } from '../utils';\nconst CSS_FIELDSET = styles.fieldset.split(' ')[0];\nconst CSS_VALIDATION = styles.validation.split(' ')[0];\nconst BOUND = new WeakMap<Element | Document, ReturnType<typeof onAdd>>();\n\nfunction process(fieldsets: HTMLCollectionOf<Element>) {\n  for(const fieldset of fieldsets) {\n    const inputs: HTMLInputElement[] = [];\n    let validationId = '';\n\n    for (const el of fieldset.getElementsByTagName('*')) {\n      if (el.classList.contains(CSS_VALIDATION)) validationId = useId(el);\n      else if (isInputLike(el)) inputs.push(el);\n    }\n\n    if (validationId) \n      for(const input of inputs) {\n        input.setAttribute('aria-describedby', validationId);\n        input.setAttribute('aria-invalid', 'true');\n      }\n  }\n}\n\nexport function observe (el: Element | Document) {\n  const fields = el.getElementsByClassName(CSS_FIELDSET);\n  const add = onAdd(styles.fieldsetValidationAdded, () => process(fields));\n  BOUND.set(el, add);\n  add.observe(el);\n}\n\nexport function unobserve (el: Element | Document) {\n  BOUND.get(el)?.disconnect(el);\n}\n","import styles from '../styles.module.css';\nimport { IS_BROWSER, QUICK_EVENT, off, on } from '../utils';\n\nexport function observe(el: Node) {\n  on(el, 'click', handleLinkClick); // Allow `<a>` to use `popovertarget` as well\n  on(el, 'toggle', handleToggle, QUICK_EVENT); // Use capture since toggle does not bubble\n}\nexport function unobserve(el: Node) {\n  off(el, 'click', handleLinkClick);\n  off(el, 'toggle', handleToggle, QUICK_EVENT); // Use capture since toggle does not bubble\n}\n\ntype Toggle = Event & { newState?: string };\nconst CSS_POPOVER = styles.popover.split(' ')[0];\nconst SCROLLER = IS_BROWSER ? document.createElement('div') : null // Used to ensure we have scrollability under\nif (SCROLLER) SCROLLER.style.cssText = 'position:absolute;padding:1px';\n\nfunction handleToggle ({ target: el, newState }: Toggle){\n  const isPopping = newState === 'open' && el instanceof HTMLElement && el.classList.contains(CSS_POPOVER);\n  const anchor = isPopping && (el.getRootNode() as ShadowRoot)?.querySelector<HTMLElement>(`[popovertarget=\"${el.id}\"]`);\n\n  if (anchor) {\n    const isOver = el.getAttribute('data-position') === 'over';\n    const update = () => place(anchor, el, isOver);\n    const removeEvent = ({ newState }: Toggle) => {\n      if (newState === 'open') return;\n      off(document, 'DOMContentReady', update, QUICK_EVENT);\n      off(el, 'toggle', removeEvent, QUICK_EVENT);\n      off(window, 'load,resize,scroll', update, QUICK_EVENT);\n      SCROLLER?.remove();\n    }\n\n    document.body.append(SCROLLER || '');\n    document.fonts.ready.then(update); // Inital render and when fonts load\n    on(window, 'load,resize,scroll', update, QUICK_EVENT);\n    on(document, 'DOMContentReady', update, QUICK_EVENT);\n    on(el, 'toggle', removeEvent, QUICK_EVENT);\n  }\n}\n\n// Polyfill popovertarget for <a> (not supported by native)\n// and automatically assume popovertarget is the closest parent popover\n// but respect the popovertarget and popovertargetaction attribute\nfunction handleLinkClick (event: Event){\n  const link = event.target instanceof Element && event.target.closest('a');\n  if (link) {\n    const root = link.getRootNode() as ShadowRoot;\n    const target = root.getElementById?.(link.getAttribute('popovertarget') || '') || link.closest(`.${CSS_POPOVER}`);\n    const action = link.getAttribute('popovertargetaction') || 'toggle';\n\n    if (!event.defaultPrevented) target?.togglePopover(action === 'show' || (action === 'hide' ? false : undefined));\n  }\n}\n\nfunction place (anchor: HTMLElement | null, popper: HTMLElement, isOver = false) {\n  if (!anchor) return;\n  const { offsetWidth: popperW, offsetHeight: popperH } = popper;\n  const { offsetWidth: anchorW, offsetHeight: anchorH } = anchor;\n  const { width, height, left, top } = anchor.getBoundingClientRect();\n  const anchorX = Math.round(left - (anchorW - width) / 2); // Correct for CSS transform scale\n  const anchorY = Math.round(top - (anchorH - height) / 2); // Correct for CSS transform scale\n  const hasSpaceUnder = anchorY + anchorH + popperH < window.innerHeight;\n  const hasSpaceOver = anchorY - popperH > 0\n  const placeUnder = (!isOver && hasSpaceUnder) || !hasSpaceOver // Always place under when no hasSpaceOver, as no OS can scroll further up than 0\n  const scroll = placeUnder ? window.scrollY + anchorY + anchorH + popperH + 30 : 0\n\n  popper.style.left = `${Math.round(Math.min(Math.max(10, anchorX), window.innerWidth - popperW - 10))}px`\n  popper.style.top = `${Math.round(placeUnder ? anchorY + anchorH : anchorY - popperH)}px`\n  SCROLLER?.style.setProperty('top', `${Math.round(scroll)}px`);\n}\n","import styles from '../styles.module.css';\nimport { onAdd } from '../utils';\nconst CSS_TABLE = styles.table.split(' ')[0];\nconst BOUND = new WeakMap<Element | Document, ReturnType<typeof onAdd>>();\n\nfunction process(tables: HTMLCollectionOf<Element>) {\n  for(const table of tables) if (table instanceof HTMLTableElement) {\n    const ths = Array.from(table.tHead?.rows[0]?.cells || [], (el) => el.innerText?.trim()); // Using innerText to only include visible text\n    for (const tbody of table.tBodies) {\n      for (const row of tbody.rows) {\n        for (const cell of row.cells) {\n          cell.setAttribute('data-th', ths[cell.cellIndex] || ':empty'); // Using U+200B to prevent empty string from collapsing\n        }\n      }\n    }\n  }\n}\n\nexport function observe (el: Element | Document) {\n  const tables = el.getElementsByClassName(CSS_TABLE);\n  const add = onAdd(styles.tableChildAdded, () => process(tables));\n  BOUND.set(el, add);\n  add.observe(el);\n}\n\nexport function unobserve (el: Element | Document) {\n  BOUND.get(el)?.disconnect(el);\n}\n","const getSteps = (now: number, max: number, show: number) => {\n  const offset = (show - 1) / 2;\n  const start = Math.max(Math.min(now - Math.floor(offset), max - show + 1), 1);\n  const end = Math.min(Math.max(now + Math.ceil(offset), show), max);\n  const pages = Array.from({ length: end + 1 - start }, (_, i) => i + start);\n\n  if (show > 4 && start > 1) pages.splice(0, 2, 1, 0);\n  if (show > 3 && end < max) pages.splice(-2, 2, 0, max);\n  return pages;\n};\n\nexport const pagination = ({\n  current = 1,\n  total = 10,\n  show = 7,\n}) => ({\n  prev: current > 1 ? current - 1 : 0,\n  next: current < total ? current + 1 : 0,\n  pages: getSteps(current, total, show).map((page, index) => ({\n    current: page === current && 'page' as const,\n    key: `key-${page}-${index}`,\n    page,\n  })),\n});\n","import * as field from './field/field';\nimport * as fieldset from './fieldset/fieldset';\nimport * as popover from './popover/popover';\nimport * as table from './table/table';\nimport { IS_BROWSER } from './utils';\nexport { pagination } from './pagination/pagination';\nexport * as styles from './styles.module.css';\n\nif (IS_BROWSER) observe(document); // Automatic observe on browser\n\nexport function observe(el: Element | Document) {\n  field.observe(el);\n  fieldset.observe(el);\n  popover.observe(el);\n  table.observe(el);\n}\n\nexport function unobserve(el: Element | Document) {\n  field.unobserve(el);\n  fieldset.unobserve(el);\n  popover.unobserve(el);\n  table.unobserve(el);\n}"],"names":["IS_BROWSER","QUICK_EVENT","id","UUID","useId","el","events","action","element","rest","type","on","off","onAdd","animationName","callback","timer","onAnimation","event","isInputLike","CSS_FIELD","styles","CSS_VALIDATIONS","CSS_VALIDATION","BOUND","renderAria","fields","field","labels","descs","input","valid","label","handleInput","target","renderCounter","limit","remainder","nextInvalid","css","observe","add","unobserve","CSS_FIELDSET","process","fieldsets","fieldset","inputs","validationId","handleLinkClick","handleToggle","CSS_POPOVER","SCROLLER","newState","anchor","_a","isOver","update","place","removeEvent","link","root","popper","popperW","popperH","anchorW","anchorH","width","height","left","top","anchorX","anchorY","hasSpaceUnder","hasSpaceOver","placeUnder","scroll","CSS_TABLE","tables","table","ths","_b","tbody","row","cell","getSteps","now","max","show","offset","start","end","pages","_","i","pagination","current","total","page","index","field.observe","fieldset.observe","popover.observe","table.observe","field.unobserve","fieldset.unobserve","popover.unobserve","table.unobserve"],"mappings":"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"}
+{"version":3,"file":"index.iife.js","sources":["../designsystem/utils.ts","../designsystem/field/field.ts","../designsystem/fieldset/fieldset.ts","../designsystem/popover/popover.ts","../designsystem/table/table.ts","../designsystem/pagination/pagination.ts","../designsystem/index.ts"],"sourcesContent":["export const IS_BROWSER = typeof window !== 'undefined' && typeof document !== 'undefined';\nexport const QUICK_EVENT = { capture: true, passive: true };\n\n/**\n * useId\n * @return A generated unique ID\n */\nlet id = 0;\nconst UUID = `${Date.now().toString(36)}${Math.random().toString(36).slice(2, 5)}`;\nexport function useId (el: Element) {\n  if (!el.id) el.id = `${UUID}${++id}`;\n\treturn el.id;\n};\n\n/**\n * Speed up MutationObserver by debouncing and only running when page is visible\n * @return new MutaionObserver\n */\nexport function createOptimizedMutationObserver(callback: MutationCallback) {\n  const queue: MutationRecord[] = [];\n  const observer = new MutationObserver((mutations) => {\n    if (!queue[0]) requestAnimationFrame(process);\n    queue.push(...mutations);\n  });\n\n  const process = () => {\n    callback(queue, observer);\n    queue.length = 0; // Reset queue\n  };\n\n  return observer;\n}\n\n// Internal helper for on / off\nconst events = (\n\taction: \"add\" | \"remove\",\n\telement: Node | Window,\n\trest: Parameters<typeof Element.prototype.addEventListener>,\n): void => {\n\tfor (const type of rest[0].split(\",\")) {\n\t\trest[0] = type;\n\t\telement[`${action}EventListener`](...rest);\n\t}\n};\n\n/**\n * on\n * @param element The Element to use as EventTarget\n * @param types A comma separated string of event types\n * @param listener An event listener function or listener object\n */\nexport const on = (\n\telement: Node | Window,\n\t...rest: Parameters<typeof Element.prototype.addEventListener>\n): void => events(\"add\", element, rest);\n\n/**\n * off\n * @param element The Element to use as EventTarget\n * @param types A comma separated string of event types\n * @param listener An event listener function or listener object\n */\nexport const off = (\n\telement: Node | Window,\n\t...rest: Parameters<typeof Element.prototype.removeEventListener>\n): void => events(\"remove\", element, rest);\n\n/**\n * Child added event inspired by:\n * https://davidwalsh.name/detect-node-insertion\n */\nexport const onAdd = (animationName: string, callback: () => void) => {\n  let timer: ReturnType<typeof requestAnimationFrame> | number = 0;\n  const onAnimation = (event: Event & { animationName?: string }) => {\n    if (event.animationName === animationName) {\n      cancelAnimationFrame(timer);\n      timer = requestAnimationFrame(callback);\n    }\n  };\n\n\treturn {\n\t\tobserve: (el: Element | Document, ) => on(el, 'animationend', onAnimation, QUICK_EVENT),\n\t\tdisconnect: (el: Element | Document, ) => off(el, 'animationstart', onAnimation, QUICK_EVENT)\n\t};\n}\n\nexport const isInputLike = (el: unknown): el is HTMLInputElement =>\n\tel instanceof HTMLElement && 'validity' in el && !(el instanceof HTMLButtonElement);\n\n// Make React support popover=\"\"target attribute\n// https://github.com/facebook/react/issues/27479\ntype Popover = \"\" | \"auto\" | \"manual\" | undefined;\ndeclare global {\n\tnamespace React.JSX {\n\t\tinterface IntrinsicAttributes {\n\t\t\tpopovertargetaction?: string;\n\t\t\tpopovertarget?: string;\n\t\t\tpopover?: Popover;\n\t\t}\n\t}\n\tnamespace React {\n\t\tinterface HTMLAttributes<T> {\n\t\t\tpopovertargetaction?: string;\n\t\t\tpopovertarget?: string;\n\t\t\tpopover?: Popover;\n\t\t}\n\t}\n}","import styles from '../styles.module.css';\nimport { QUICK_EVENT, isInputLike, off, on, onAdd, useId } from '../utils';\n\nconst CSS_FIELD = styles.field.split(' ')[0];\nconst CSS_VALIDATIONS = styles.validation.split(' ');\nconst CSS_VALIDATION = CSS_VALIDATIONS[0];\nconst BOUND = new WeakMap<Element | Document, ReturnType<typeof onAdd>>();\n\nfunction renderAria(fields: HTMLCollectionOf<Element>) {\n  for(const field of fields) {\n    const labels: HTMLLabelElement[] = [];\n    const descs: string[] = [];\n    let input: HTMLInputElement | null = null;\n    let valid = true;\n\n    for (const el of field.getElementsByTagName('*')) {\n      if (el instanceof HTMLLabelElement) labels.push(el);\n      else if (isInputLike(el)) input = el;\n      else if (el.classList.contains(CSS_VALIDATION)) { // Must be before instanceof HTMLParagraphElement since validation can also be a <p>\n        valid = el.getAttribute('data-color') === 'success';\n        descs.unshift(useId(el));\n      } else if (el instanceof HTMLParagraphElement) descs.push(useId(el));\n    }\n\n    if (input) for (const label of labels) label.htmlFor = useId(input);\n    if (input) renderCounter(input);\n\n    input?.setAttribute('aria-describedby', descs.join(' '));\n    input?.setAttribute('aria-invalid', `${!valid}`);\n  }\n}\nfunction handleInput({ target }: Event) {\n  if (isInputLike(target)) renderCounter(target);\n}\n\nfunction renderCounter(input: HTMLInputElement) {\n  const el = input?.nextElementSibling;\n  const limit = el?.getAttribute('data-count');\n\n  if (el && limit) {\n    const remainder = Number(limit) - input.value.length;\n    const nextInvalid = remainder < 0;\n    const prevInvalid = el.getAttribute('aria-live') === 'polite';\n\n    if (prevInvalid !== nextInvalid) {\n      el.setAttribute('aria-live', nextInvalid ? 'polite' : 'off');\n      for (const css of CSS_VALIDATIONS) el.classList.toggle(css, nextInvalid);\n    }\n    el.textContent = `${Math.abs(remainder)} tegn ${nextInvalid ? 'for mye' : 'igjen'}`;\n  }\n}\n\nexport function observe (el: Element | Document) {\n  const fields = el.getElementsByClassName(CSS_FIELD);\n  const add = onAdd(styles.fieldChildAdded, () => renderAria(fields));\n  BOUND.set(el, add);\n  add.observe(el);\n  on(el, 'input', handleInput, QUICK_EVENT);\n}\n\nexport function unobserve (el: Element | Document) {\n  BOUND.get(el)?.disconnect(el);\n  off(el, 'input', handleInput, QUICK_EVENT);\n}\n\n\n// TODO: Remove invalid when errormessage is gone","import styles from '../styles.module.css';\nimport { isInputLike, onAdd, useId } from '../utils';\nconst CSS_FIELDSET = styles.fieldset.split(' ')[0];\nconst CSS_VALIDATION = styles.validation.split(' ')[0];\nconst BOUND = new WeakMap<Element | Document, ReturnType<typeof onAdd>>();\n\nfunction process(fieldsets: HTMLCollectionOf<Element>) {\n  for(const fieldset of fieldsets) {\n    const inputs: HTMLInputElement[] = [];\n    let validationId = '';\n\n    for (const el of fieldset.getElementsByTagName('*')) {\n      if (el.classList.contains(CSS_VALIDATION)) validationId = useId(el);\n      else if (isInputLike(el)) inputs.push(el);\n    }\n\n    if (validationId) \n      for(const input of inputs) {\n        input.setAttribute('aria-describedby', validationId);\n        input.setAttribute('aria-invalid', 'true');\n      }\n  }\n}\n\nexport function observe (el: Element | Document) {\n  const fields = el.getElementsByClassName(CSS_FIELDSET);\n  const add = onAdd(styles.fieldsetValidationAdded, () => process(fields));\n  BOUND.set(el, add);\n  add.observe(el);\n}\n\nexport function unobserve (el: Element | Document) {\n  BOUND.get(el)?.disconnect(el);\n}\n","import styles from '../styles.module.css';\nimport { IS_BROWSER, QUICK_EVENT, off, on } from '../utils';\n\nexport function observe(el: Node) {\n  on(el, 'click', handleLinkClick); // Allow `<a>` to use `popovertarget` as well\n  on(el, 'toggle', handleToggle, QUICK_EVENT); // Use capture since toggle does not bubble\n  on(window, 'load,resize,scroll', updatePositions, QUICK_EVENT); // Use capture since toggle does not bubble\n  on(document, 'DOMContentReady', updatePositions, QUICK_EVENT); // Use capture since toggle does not bubble\n  document.fonts.ready.then(updatePositions); // Inital render and when fonts load\n}\nexport function unobserve(el: Node) {\n  off(el, 'click', handleLinkClick);\n  off(el, 'toggle', handleToggle, QUICK_EVENT); // Use capture since toggle does not bubble\n}\n\nconst CSS_POPOVER = styles.popover.split(' ')[0];\nconst SCROLLER = IS_BROWSER ? document.createElement('div') : null // Used to ensure we have scrollability under\nconst POPPING = new Map<Element, () => void>(); // Store current open poppers and their update functions\nSCROLLER?.setAttribute('style', 'position:absolute;padding:1px');\n\nfunction handleToggle ({ target: el, newState }: Event & { newState?: string }){\n  if (el instanceof HTMLElement && el.classList.contains(CSS_POPOVER)) {\n    const anchor = (el.getRootNode() as ShadowRoot)?.querySelector<HTMLElement>(`[popovertarget=\"${el.id}\"]`);\n    const isOver = el.getAttribute('data-position') === 'over';\n    \n    if (newState === 'closed') POPPING.delete(el);\n    else if (anchor) POPPING.set(el, () => place(anchor, el, isOver));\n    document.body.append(SCROLLER || ''); // Ensure we have the scroller\n    updatePositions();\n  }\n}\n\nfunction updatePositions() {\n  for (const [_, updatePosition] of POPPING) updatePosition();\n}\n\n// Polyfill popovertarget for <a> (not supported by native)\n// and automatically assume popovertarget is the closest parent popover\n// but respect the popovertarget and popovertargetaction attribute\nfunction handleLinkClick (event: Event){\n  const link = event.target instanceof Element && event.target.closest('a');\n  if (link) {\n    const root = link.getRootNode() as ShadowRoot;\n    const target = root.getElementById?.(link.getAttribute('popovertarget') || '') || link.closest(`.${CSS_POPOVER}`);\n    const action = link.getAttribute('popovertargetaction') || 'toggle';\n\n    if (!event.defaultPrevented) target?.togglePopover(action === 'show' || (action === 'hide' ? false : undefined));\n  }\n}\n\nfunction place (anchor: HTMLElement | null, popper: HTMLElement, isOver = false) {\n  if (!anchor?.isConnected || !popper?.isConnected) return POPPING.delete(popper); // Stop watchning if anchor is removed from DOM\n\n  const { offsetWidth: popperW, offsetHeight: popperH } = popper;\n  const { offsetWidth: anchorW, offsetHeight: anchorH } = anchor;\n  const { width, height, left, top } = anchor.getBoundingClientRect();\n  const anchorX = Math.round(left - (anchorW - width) / 2); // Correct for CSS transform scale\n  const anchorY = Math.round(top - (anchorH - height) / 2); // Correct for CSS transform scale\n  const hasSpaceUnder = anchorY + anchorH + popperH < window.innerHeight;\n  const hasSpaceOver = anchorY - popperH > 0\n  const placeUnder = (!isOver && hasSpaceUnder) || !hasSpaceOver // Always place under when no hasSpaceOver, as no OS can scroll further up than 0\n  const scroll = placeUnder ? window.scrollY + anchorY + anchorH + popperH + 30 : 0\n\n  popper.style.left = `${Math.round(Math.min(Math.max(10, anchorX), window.innerWidth - popperW - 10))}px`\n  popper.style.top = `${Math.round(placeUnder ? anchorY + anchorH : anchorY - popperH)}px`\n  SCROLLER?.style.setProperty('top', `${Math.round(scroll)}px`);\n}\n","import styles from '../styles.module.css';\nimport { onAdd } from '../utils';\nconst CSS_TABLE = styles.table.split(' ')[0];\nconst BOUND = new WeakMap<Element | Document, ReturnType<typeof onAdd>>();\n\nfunction process(tables: HTMLCollectionOf<Element>) {\n  for(const table of tables) if (table instanceof HTMLTableElement) {\n    const ths = Array.from(table.tHead?.rows[0]?.cells || [], (el) => el.innerText?.trim()); // Using innerText to only include visible text\n    for (const tbody of table.tBodies) {\n      for (const row of tbody.rows) {\n        for (const cell of row.cells) {\n          cell.setAttribute('data-th', ths[cell.cellIndex] || ':empty'); // Using U+200B to prevent empty string from collapsing\n        }\n      }\n    }\n  }\n}\n\nexport function observe (el: Element | Document) {\n  const tables = el.getElementsByClassName(CSS_TABLE);\n  const add = onAdd(styles.tableChildAdded, () => process(tables));\n  BOUND.set(el, add);\n  add.observe(el);\n}\n\nexport function unobserve (el: Element | Document) {\n  BOUND.get(el)?.disconnect(el);\n}\n","const getSteps = (now: number, max: number, show: number) => {\n  const offset = (show - 1) / 2;\n  const start = Math.max(Math.min(now - Math.floor(offset), max - show + 1), 1);\n  const end = Math.min(Math.max(now + Math.ceil(offset), show), max);\n  const pages = Array.from({ length: end + 1 - start }, (_, i) => i + start);\n\n  if (show > 4 && start > 1) pages.splice(0, 2, 1, 0);\n  if (show > 3 && end < max) pages.splice(-2, 2, 0, max);\n  return pages;\n};\n\nexport const pagination = ({\n  current = 1,\n  total = 10,\n  show = 7,\n}) => ({\n  prev: current > 1 ? current - 1 : 0,\n  next: current < total ? current + 1 : 0,\n  pages: getSteps(current, total, show).map((page, index) => ({\n    current: page === current && 'page' as const,\n    key: `key-${page}-${index}`,\n    page,\n  })),\n});\n","import * as field from './field/field';\nimport * as fieldset from './fieldset/fieldset';\nimport * as popover from './popover/popover';\nimport * as table from './table/table';\nimport { IS_BROWSER } from './utils';\nexport { pagination } from './pagination/pagination';\nexport * as styles from './styles.module.css';\n\nif (IS_BROWSER) observe(document); // Automatic observe on browser\n\nexport function observe(el: Element | Document) {\n  field.observe(el);\n  fieldset.observe(el);\n  popover.observe(el);\n  table.observe(el);\n}\n\nexport function unobserve(el: Element | Document) {\n  field.unobserve(el);\n  fieldset.unobserve(el);\n  popover.unobserve(el);\n  table.unobserve(el);\n}"],"names":["IS_BROWSER","QUICK_EVENT","id","UUID","useId","el","events","action","element","rest","type","on","off","onAdd","animationName","callback","timer","onAnimation","event","isInputLike","CSS_FIELD","styles","CSS_VALIDATIONS","CSS_VALIDATION","BOUND","renderAria","fields","field","labels","descs","input","valid","label","handleInput","target","renderCounter","limit","remainder","nextInvalid","css","observe","add","unobserve","CSS_FIELDSET","process","fieldsets","fieldset","inputs","validationId","handleLinkClick","handleToggle","updatePositions","CSS_POPOVER","SCROLLER","POPPING","newState","anchor","_a","isOver","place","_","updatePosition","link","root","popper","popperW","popperH","anchorW","anchorH","width","height","left","top","anchorX","anchorY","hasSpaceUnder","hasSpaceOver","placeUnder","scroll","CSS_TABLE","tables","table","ths","_b","tbody","row","cell","getSteps","now","max","show","offset","start","end","pages","i","pagination","current","total","page","index","field.observe","fieldset.observe","popover.observe","table.observe","field.unobserve","fieldset.unobserve","popover.unobserve","table.unobserve"],"mappings":"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"}

package/mtds/layout/layout.stories.d.ts

@@ -9,7 +9,6 @@ export default meta;
 type Story = StoryObj<typeof meta>;
 export declare const Flex: Story;
 export declare const Grid: Story;
-export declare const Box: Story;
 export declare const Gap: Story;
 export declare const Center: Story;
 export declare const Align: Story;

package/mtds/popover/popover.js

@@ -1,38 +1,38 @@
-import E from "../styles.module.css.js";
-import { IS_BROWSER as H, on as l, QUICK_EVENT as c, off as p } from "../utils.js";
-function $(t) {
-  l(t, "click", v), l(t, "toggle", m, c);
+import k from "../styles.module.css.js";
+import { IS_BROWSER as E, on as r, QUICK_EVENT as l, off as h } from "../utils.js";
+function I(t) {
+  r(t, "click", v), r(t, "toggle", m, l), r(window, "load,resize,scroll", f, l), r(document, "DOMContentReady", f, l), document.fonts.ready.then(f);
 }
-function O(t) {
-  p(t, "click", v), p(t, "toggle", m, c);
+function N(t) {
+  h(t, "click", v), h(t, "toggle", m, l);
 }
-const h = E.popover.split(" ")[0], s = H ? document.createElement("div") : null;
-s && (s.style.cssText = "position:absolute;padding:1px");
-function m({ target: t, newState: o }) {
-  var e;
-  const i = o === "open" && t instanceof HTMLElement && t.classList.contains(h) && ((e = t.getRootNode()) == null ? void 0 : e.querySelector(`[popovertarget="${t.id}"]`));
-  if (i) {
-    const r = t.getAttribute("data-position") === "over", n = () => W(i, t, r), g = ({ newState: f }) => {
-      f !== "open" && (p(document, "DOMContentReady", n, c), p(t, "toggle", g, c), p(window, "load,resize,scroll", n, c), s == null || s.remove());
-    };
-    document.body.append(s || ""), document.fonts.ready.then(n), l(window, "load,resize,scroll", n, c), l(document, "DOMContentReady", n, c), l(t, "toggle", g, c);
+const p = k.popover.split(" ")[0], i = E ? document.createElement("div") : null, g = /* @__PURE__ */ new Map();
+i == null || i.setAttribute("style", "position:absolute;padding:1px");
+function m({ target: t, newState: e }) {
+  var s;
+  if (t instanceof HTMLElement && t.classList.contains(p)) {
+    const n = (s = t.getRootNode()) == null ? void 0 : s.querySelector(`[popovertarget="${t.id}"]`), o = t.getAttribute("data-position") === "over";
+    e === "closed" ? g.delete(t) : n && g.set(t, () => $(n, t, o)), document.body.append(i || ""), f();
   }
 }
+function f() {
+  for (const [t, e] of g) e();
+}
 function v(t) {
-  var a;
-  const o = t.target instanceof Element && t.target.closest("a");
-  if (o) {
-    const i = o.getRootNode(), e = ((a = i.getElementById) == null ? void 0 : a.call(i, o.getAttribute("popovertarget") || "")) || o.closest(`.${h}`), r = o.getAttribute("popovertargetaction") || "toggle";
-    t.defaultPrevented || e == null || e.togglePopover(r === "show" || (r === "hide" ? !1 : void 0));
+  var s;
+  const e = t.target instanceof Element && t.target.closest("a");
+  if (e) {
+    const n = e.getRootNode(), o = ((s = n.getElementById) == null ? void 0 : s.call(n, e.getAttribute("popovertarget") || "")) || e.closest(`.${p}`), d = e.getAttribute("popovertargetaction") || "toggle";
+    t.defaultPrevented || o == null || o.togglePopover(d === "show" || (d === "hide" ? !1 : void 0));
   }
 }
-function W(t, o, a = !1) {
-  if (!t) return;
-  const { offsetWidth: i, offsetHeight: e } = o, { offsetWidth: r, offsetHeight: n } = t, { width: g, height: f, left: w, top: y } = t.getBoundingClientRect(), M = Math.round(w - (r - g) / 2), d = Math.round(y - (n - f) / 2), b = d + n + e < window.innerHeight, x = d - e > 0, u = !a && b || !x, P = u ? window.scrollY + d + n + e + 30 : 0;
-  o.style.left = `${Math.round(Math.min(Math.max(10, M), window.innerWidth - i - 10))}px`, o.style.top = `${Math.round(u ? d + n : d - e)}px`, s == null || s.style.setProperty("top", `${Math.round(P)}px`);
+function $(t, e, s = !1) {
+  if (!(t != null && t.isConnected) || !(e != null && e.isConnected)) return g.delete(e);
+  const { offsetWidth: n, offsetHeight: o } = e, { offsetWidth: d, offsetHeight: a } = t, { width: w, height: y, left: M, top: P } = t.getBoundingClientRect(), b = Math.round(M - (d - w) / 2), c = Math.round(P - (a - y) / 2), x = c + a + o < window.innerHeight, H = c - o > 0, u = !s && x || !H, W = u ? window.scrollY + c + a + o + 30 : 0;
+  e.style.left = `${Math.round(Math.min(Math.max(10, b), window.innerWidth - n - 10))}px`, e.style.top = `${Math.round(u ? c + a : c - o)}px`, i == null || i.style.setProperty("top", `${Math.round(W)}px`);
 }
 export {
-  $ as observe,
-  O as unobserve
+  I as observe,
+  N as unobserve
 };
 //# sourceMappingURL=popover.js.map

package/mtds/popover/popover.js.map

@@ -1 +1 @@
-{"version":3,"file":"popover.js","sources":["../../designsystem/popover/popover.ts"],"sourcesContent":["import styles from '../styles.module.css';\nimport { IS_BROWSER, QUICK_EVENT, off, on } from '../utils';\n\nexport function observe(el: Node) {\n  on(el, 'click', handleLinkClick); // Allow `<a>` to use `popovertarget` as well\n  on(el, 'toggle', handleToggle, QUICK_EVENT); // Use capture since toggle does not bubble\n}\nexport function unobserve(el: Node) {\n  off(el, 'click', handleLinkClick);\n  off(el, 'toggle', handleToggle, QUICK_EVENT); // Use capture since toggle does not bubble\n}\n\ntype Toggle = Event & { newState?: string };\nconst CSS_POPOVER = styles.popover.split(' ')[0];\nconst SCROLLER = IS_BROWSER ? document.createElement('div') : null // Used to ensure we have scrollability under\nif (SCROLLER) SCROLLER.style.cssText = 'position:absolute;padding:1px';\n\nfunction handleToggle ({ target: el, newState }: Toggle){\n  const isPopping = newState === 'open' && el instanceof HTMLElement && el.classList.contains(CSS_POPOVER);\n  const anchor = isPopping && (el.getRootNode() as ShadowRoot)?.querySelector<HTMLElement>(`[popovertarget=\"${el.id}\"]`);\n\n  if (anchor) {\n    const isOver = el.getAttribute('data-position') === 'over';\n    const update = () => place(anchor, el, isOver);\n    const removeEvent = ({ newState }: Toggle) => {\n      if (newState === 'open') return;\n      off(document, 'DOMContentReady', update, QUICK_EVENT);\n      off(el, 'toggle', removeEvent, QUICK_EVENT);\n      off(window, 'load,resize,scroll', update, QUICK_EVENT);\n      SCROLLER?.remove();\n    }\n\n    document.body.append(SCROLLER || '');\n    document.fonts.ready.then(update); // Inital render and when fonts load\n    on(window, 'load,resize,scroll', update, QUICK_EVENT);\n    on(document, 'DOMContentReady', update, QUICK_EVENT);\n    on(el, 'toggle', removeEvent, QUICK_EVENT);\n  }\n}\n\n// Polyfill popovertarget for <a> (not supported by native)\n// and automatically assume popovertarget is the closest parent popover\n// but respect the popovertarget and popovertargetaction attribute\nfunction handleLinkClick (event: Event){\n  const link = event.target instanceof Element && event.target.closest('a');\n  if (link) {\n    const root = link.getRootNode() as ShadowRoot;\n    const target = root.getElementById?.(link.getAttribute('popovertarget') || '') || link.closest(`.${CSS_POPOVER}`);\n    const action = link.getAttribute('popovertargetaction') || 'toggle';\n\n    if (!event.defaultPrevented) target?.togglePopover(action === 'show' || (action === 'hide' ? false : undefined));\n  }\n}\n\nfunction place (anchor: HTMLElement | null, popper: HTMLElement, isOver = false) {\n  if (!anchor) return;\n  const { offsetWidth: popperW, offsetHeight: popperH } = popper;\n  const { offsetWidth: anchorW, offsetHeight: anchorH } = anchor;\n  const { width, height, left, top } = anchor.getBoundingClientRect();\n  const anchorX = Math.round(left - (anchorW - width) / 2); // Correct for CSS transform scale\n  const anchorY = Math.round(top - (anchorH - height) / 2); // Correct for CSS transform scale\n  const hasSpaceUnder = anchorY + anchorH + popperH < window.innerHeight;\n  const hasSpaceOver = anchorY - popperH > 0\n  const placeUnder = (!isOver && hasSpaceUnder) || !hasSpaceOver // Always place under when no hasSpaceOver, as no OS can scroll further up than 0\n  const scroll = placeUnder ? window.scrollY + anchorY + anchorH + popperH + 30 : 0\n\n  popper.style.left = `${Math.round(Math.min(Math.max(10, anchorX), window.innerWidth - popperW - 10))}px`\n  popper.style.top = `${Math.round(placeUnder ? anchorY + anchorH : anchorY - popperH)}px`\n  SCROLLER?.style.setProperty('top', `${Math.round(scroll)}px`);\n}\n"],"names":["observe","el","on","handleLinkClick","handleToggle","QUICK_EVENT","unobserve","off","CSS_POPOVER","styles","SCROLLER","IS_BROWSER","newState","anchor","_a","isOver","update","place","removeEvent","event","link","root","target","action","popper","popperW","popperH","anchorW","anchorH","width","height","left","top","anchorX","anchorY","hasSpaceUnder","hasSpaceOver","placeUnder","scroll"],"mappings":"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"}
+{"version":3,"file":"popover.js","sources":["../../designsystem/popover/popover.ts"],"sourcesContent":["import styles from '../styles.module.css';\nimport { IS_BROWSER, QUICK_EVENT, off, on } from '../utils';\n\nexport function observe(el: Node) {\n  on(el, 'click', handleLinkClick); // Allow `<a>` to use `popovertarget` as well\n  on(el, 'toggle', handleToggle, QUICK_EVENT); // Use capture since toggle does not bubble\n  on(window, 'load,resize,scroll', updatePositions, QUICK_EVENT); // Use capture since toggle does not bubble\n  on(document, 'DOMContentReady', updatePositions, QUICK_EVENT); // Use capture since toggle does not bubble\n  document.fonts.ready.then(updatePositions); // Inital render and when fonts load\n}\nexport function unobserve(el: Node) {\n  off(el, 'click', handleLinkClick);\n  off(el, 'toggle', handleToggle, QUICK_EVENT); // Use capture since toggle does not bubble\n}\n\nconst CSS_POPOVER = styles.popover.split(' ')[0];\nconst SCROLLER = IS_BROWSER ? document.createElement('div') : null // Used to ensure we have scrollability under\nconst POPPING = new Map<Element, () => void>(); // Store current open poppers and their update functions\nSCROLLER?.setAttribute('style', 'position:absolute;padding:1px');\n\nfunction handleToggle ({ target: el, newState }: Event & { newState?: string }){\n  if (el instanceof HTMLElement && el.classList.contains(CSS_POPOVER)) {\n    const anchor = (el.getRootNode() as ShadowRoot)?.querySelector<HTMLElement>(`[popovertarget=\"${el.id}\"]`);\n    const isOver = el.getAttribute('data-position') === 'over';\n    \n    if (newState === 'closed') POPPING.delete(el);\n    else if (anchor) POPPING.set(el, () => place(anchor, el, isOver));\n    document.body.append(SCROLLER || ''); // Ensure we have the scroller\n    updatePositions();\n  }\n}\n\nfunction updatePositions() {\n  for (const [_, updatePosition] of POPPING) updatePosition();\n}\n\n// Polyfill popovertarget for <a> (not supported by native)\n// and automatically assume popovertarget is the closest parent popover\n// but respect the popovertarget and popovertargetaction attribute\nfunction handleLinkClick (event: Event){\n  const link = event.target instanceof Element && event.target.closest('a');\n  if (link) {\n    const root = link.getRootNode() as ShadowRoot;\n    const target = root.getElementById?.(link.getAttribute('popovertarget') || '') || link.closest(`.${CSS_POPOVER}`);\n    const action = link.getAttribute('popovertargetaction') || 'toggle';\n\n    if (!event.defaultPrevented) target?.togglePopover(action === 'show' || (action === 'hide' ? false : undefined));\n  }\n}\n\nfunction place (anchor: HTMLElement | null, popper: HTMLElement, isOver = false) {\n  if (!anchor?.isConnected || !popper?.isConnected) return POPPING.delete(popper); // Stop watchning if anchor is removed from DOM\n\n  const { offsetWidth: popperW, offsetHeight: popperH } = popper;\n  const { offsetWidth: anchorW, offsetHeight: anchorH } = anchor;\n  const { width, height, left, top } = anchor.getBoundingClientRect();\n  const anchorX = Math.round(left - (anchorW - width) / 2); // Correct for CSS transform scale\n  const anchorY = Math.round(top - (anchorH - height) / 2); // Correct for CSS transform scale\n  const hasSpaceUnder = anchorY + anchorH + popperH < window.innerHeight;\n  const hasSpaceOver = anchorY - popperH > 0\n  const placeUnder = (!isOver && hasSpaceUnder) || !hasSpaceOver // Always place under when no hasSpaceOver, as no OS can scroll further up than 0\n  const scroll = placeUnder ? window.scrollY + anchorY + anchorH + popperH + 30 : 0\n\n  popper.style.left = `${Math.round(Math.min(Math.max(10, anchorX), window.innerWidth - popperW - 10))}px`\n  popper.style.top = `${Math.round(placeUnder ? anchorY + anchorH : anchorY - popperH)}px`\n  SCROLLER?.style.setProperty('top', `${Math.round(scroll)}px`);\n}\n"],"names":["observe","el","on","handleLinkClick","handleToggle","QUICK_EVENT","updatePositions","unobserve","off","CSS_POPOVER","styles","SCROLLER","IS_BROWSER","POPPING","newState","anchor","_a","isOver","place","_","updatePosition","event","link","root","target","action","popper","popperW","popperH","anchorW","anchorH","width","height","left","top","anchorX","anchorY","hasSpaceUnder","hasSpaceOver","placeUnder","scroll"],"mappings":"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"}