@abgov/react-components 4.0.0-alpha.156 → 4.0.0-alpha.157

package/lib/details/details.d.ts

@@ -2,6 +2,7 @@ import React, { ReactNode } from "react";
 import { Margins } from "../../common/styling";
 interface WCProps extends Margins {
     heading: string;
+    open?: boolean;
 }
 declare global {
     namespace JSX {
@@ -12,6 +13,7 @@ declare global {
 }
 export interface DetailsProps extends Margins {
     heading: string;
+    open?: boolean;
     children: ReactNode;
 }
 export declare function GoADetails(props: DetailsProps): JSX.Element;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@abgov/react-components",
-  "version": "4.0.0-alpha.156",
+  "version": "4.0.0-alpha.157",
   "description": "Government of Alberta - UI components for React",
   "bugs": {
     "url": "https://github.com/GovAlta/ui-components/issues"

package/react-components.esm.js

@@ -129,7 +129,7 @@ function create_if_block_2$9(ctx){let div;let t;return {c(){div=element("div");t
     goa-container--${/*type*/ctx[0]}
     padding--${/*padding*/ctx[2]}
     accent--${/*accent*/ctx[1]}
-  `)){attr(div3,"class",div3_class_value);}},i:noop,o:noop,d(detaching){if(detaching)detach(div3);}};}function instance$z($$self,$$props,$$invalidate){const[Types,validateType]=typeValidator("Container type",["interactive","info","error","success","important","non-interactive"]);const[Accents,validateAccent]=typeValidator("Container accent",["thick","thin","filled"]);const[Paddings,validatePadding]=typeValidator("Container padding",["relaxed","compact"]);let{type="interactive"}=$$props;let{accent="filled"}=$$props;let{padding="relaxed"}=$$props;let{testid=""}=$$props;let{mt=null}=$$props;let{mr=null}=$$props;let{mb="m"}=$$props;let{ml=null}=$$props;onMount(()=>{validateType(type);validateAccent(accent);validatePadding(padding);});$$self.$$set=$$props=>{if('type'in $$props)$$invalidate(0,type=$$props.type);if('accent'in $$props)$$invalidate(1,accent=$$props.accent);if('padding'in $$props)$$invalidate(2,padding=$$props.padding);if('testid'in $$props)$$invalidate(3,testid=$$props.testid);if('mt'in $$props)$$invalidate(4,mt=$$props.mt);if('mr'in $$props)$$invalidate(5,mr=$$props.mr);if('mb'in $$props)$$invalidate(6,mb=$$props.mb);if('ml'in $$props)$$invalidate(7,ml=$$props.ml);};return [type,accent,padding,testid,mt,mr,mb,ml];}class Container extends SvelteElement{constructor(options){super();this.shadowRoot.innerHTML=`<style>:host{box-sizing:border-box;font-family:var(--goa-font-family-sans);font-size:var(--goa-font-size-4);display:flex;flex:1 1 auto}.goa-container{box-sizing:border-box;display:flex;flex:1 1 auto;flex-direction:column}.goa-container *{box-sizing:border-box}header{display:flex;align-items:center;justify-content:space-between;font-weight:700;font-size:var(--goa-font-size-4);border-width:1px;border-style:solid;border-top-left-radius:var(--goa-border-radius-m);border-top-right-radius:var(--goa-border-radius-m)}.content{border-bottom:1px solid var(--goa-color-greyscale-200);border-left:1px solid var(--goa-color-greyscale-200);border-right:1px solid var(--goa-color-greyscale-200);border-bottom-left-radius:var(--goa-border-radius-m);border-bottom-right-radius:var(--goa-border-radius-m);display:flex;flex:1 1 auto;flex-direction:column}.content ::slotted(p:last-child){margin-bottom:0 !important}.goa-container--non-interactive.accent--filled .content{border-color:var(--goa-color-greyscale-200);background-color:var(--goa-color-greyscale-100)}.goa-container--important.accent--filled .content{border-color:var(--goa-color-warning-default);background-color:var(--goa-color-warning-background)}.goa-container--error.accent--filled .content{border-color:var(--goa-color-emergency-default);background-color:var(--goa-color-emergency-background)}.goa-container--success.accent--filled .content{border-color:var(--goa-color-success-default);background-color:var(--goa-color-success-background)}.goa-container--info.accent--filled .content{border-color:var(--goa-color-info-default);background-color:var(--goa-color-info-background)}.title,.actions{padding:0.5rem 0}.padding--relaxed header{padding:0 1.5rem}.padding--relaxed .content{padding:1.5rem}.padding--compact header,.padding--compact .content{padding:0 1rem}.padding--compact header{padding:0 1rem}.padding--compact .content{padding:1rem}@media screen and (max-width: 480px){.padding--relaxed header{padding:0 1rem}.padding--relaxed .content{padding:1rem}}.goa-container--non-interactive header{background-color:var(--goa-color-greyscale-100);border-color:var(--goa-color-greyscale-200);color:var(--goa-color-greyscale-black)}.goa-container--interactive header{background-color:var(--goa-color-brand-default);border-color:var(--goa-color-brand-default);color:var(--goa-color-greyscale-white)}.goa-container--info header{background-color:var(--goa-color-info-default);border-color:var(--goa-color-info-default);color:var(--goa-color-greyscale-white)}.goa-container--error header{background-color:var(--goa-color-emergency-default);border-color:var(--goa-color-emergency-default);color:var(--goa-color-greyscale-white)}.goa-container--success header{background-color:var(--goa-color-success-default);border-color:var(--goa-color-success-default);color:var(--goa-color-greyscale-white)}.goa-container--important header{background-color:var(--goa-color-warning-default);border-color:var(--goa-color-warning-default);color:var(--goa-color-greyscale-white)}.heading--thick{padding:0.5rem 1.5rem;max-height:3rem;min-height:1rem}.heading--thick .title{line-height:2rem}.heading--thin{height:0.5rem}.heading--filled{display:none}.heading--filled~.content{border-top:1px solid var(--goa-color-greyscale-200);border-top-left-radius:var(--goa-border-radius-m);border-top-right-radius:var(--goa-border-radius-m)}.heading--thin .title,.heading--thin .actions{display:none}.actions{display:flex;align-items:center}</style>`;init(this,{target:this.shadowRoot,props:attribute_to_object(this.attributes),customElement:true},instance$z,create_fragment$D,safe_not_equal,{type:0,accent:1,padding:2,testid:3,mt:4,mr:5,mb:6,ml:7},null);if(options){if(options.target){insert(options.target,this,options.anchor);}if(options.props){this.$set(options.props);flush();}}}static get observedAttributes(){return ["type","accent","padding","testid","mt","mr","mb","ml"];}get type(){return this.$$.ctx[0];}set type(type){this.$$set({type});flush();}get accent(){return this.$$.ctx[1];}set accent(accent){this.$$set({accent});flush();}get padding(){return this.$$.ctx[2];}set padding(padding){this.$$set({padding});flush();}get testid(){return this.$$.ctx[3];}set testid(testid){this.$$set({testid});flush();}get mt(){return this.$$.ctx[4];}set mt(mt){this.$$set({mt});flush();}get mr(){return this.$$.ctx[5];}set mr(mr){this.$$set({mr});flush();}get mb(){return this.$$.ctx[6];}set mb(mb){this.$$set({mb});flush();}get ml(){return this.$$.ctx[7];}set ml(ml){this.$$set({ml});flush();}}customElements.define("goa-container",Container);/* libs/web-components/src/components/details/Details.svelte generated by Svelte v3.51.0 */function create_fragment$C(ctx){let details;let summary;let goa_icon;let goa_icon_fillcolor_value;let t0;let span;let t1;let t2;let div;let details_style_value;return {c(){details=element("details");summary=element("summary");goa_icon=element("goa-icon");t0=space();span=element("span");t1=text(/*heading*/ctx[0]);t2=space();div=element("div");div.innerHTML=`<slot></slot>`;this.c=noop;set_custom_element_data(goa_icon,"mt","1");set_custom_element_data(goa_icon,"mr","2");set_custom_element_data(goa_icon,"type","chevron-forward");set_custom_element_data(goa_icon,"fillcolor",goa_icon_fillcolor_value=/*_isMouseOver*/ctx[5]?"var(--goa-color-interactive-hover)":"var(--goa-color-interactive-default)");attr(div,"class","content");attr(details,"style",details_style_value=calculateMargin(/*mt*/ctx[1],/*mr*/ctx[2],/*mb*/ctx[3],/*ml*/ctx[4]));},m(target,anchor){insert(target,details,anchor);append(details,summary);append(summary,goa_icon);append(summary,t0);append(summary,span);append(span,t1);/*summary_binding*/ctx[7](summary);append(details,t2);append(details,div);},p(ctx,[dirty]){if(dirty&/*_isMouseOver*/32&&goa_icon_fillcolor_value!==(goa_icon_fillcolor_value=/*_isMouseOver*/ctx[5]?"var(--goa-color-interactive-hover)":"var(--goa-color-interactive-default)")){set_custom_element_data(goa_icon,"fillcolor",goa_icon_fillcolor_value);}if(dirty&/*heading*/1)set_data(t1,/*heading*/ctx[0]);if(dirty&/*mt, mr, mb, ml*/30&&details_style_value!==(details_style_value=calculateMargin(/*mt*/ctx[1],/*mr*/ctx[2],/*mb*/ctx[3],/*ml*/ctx[4]))){attr(details,"style",details_style_value);}},i:noop,o:noop,d(detaching){if(detaching)detach(details);/*summary_binding*/ctx[7](null);}};}function instance$y($$self,$$props,$$invalidate){let{heading}=$$props;let{mt=null}=$$props;let{mr=null}=$$props;let{mb=null}=$$props;let{ml=null}=$$props;let _isMouseOver=false;let _summaryEl;onMount(()=>{validateRequired("Details",{heading});_summaryEl.addEventListener("mouseover",()=>{$$invalidate(5,_isMouseOver=true);});_summaryEl.addEventListener("mouseout",()=>{$$invalidate(5,_isMouseOver=false);});});function summary_binding($$value){binding_callbacks[$$value?'unshift':'push'](()=>{_summaryEl=$$value;$$invalidate(6,_summaryEl);});}$$self.$$set=$$props=>{if('heading'in $$props)$$invalidate(0,heading=$$props.heading);if('mt'in $$props)$$invalidate(1,mt=$$props.mt);if('mr'in $$props)$$invalidate(2,mr=$$props.mr);if('mb'in $$props)$$invalidate(3,mb=$$props.mb);if('ml'in $$props)$$invalidate(4,ml=$$props.ml);};return [heading,mt,mr,mb,ml,_isMouseOver,_summaryEl,summary_binding];}class Details extends SvelteElement{constructor(options){super();this.shadowRoot.innerHTML=`<style>:host{font-family:var(--goa-font-family-sans)}details{max-width:75ch;position:relative}details ::slotted(*){font:var(--goa-typography-body-m)}summary{padding:0.5rem;margin-bottom:0.5rem;cursor:pointer;list-style:none;display:flex;align-items:flex-start}goa-icon{position:absolute}details[open] goa-icon{transform:translateX(-1px) rotate(90deg);top:0.75rem}details summary::-webkit-details-marker{display:none}summary{border-radius:var(--goa-border-radius-m)}summary:focus,summary:active{outline:3px solid var(--goa-color-interactive-focus);border-radius:var(--goa-border-radius-m);color:var(--goa-color-interactive-hover);background-color:var(--goa-color-greyscale-100)}summary:hover{background-color:var(--goa-color-greyscale-100)}summary span{margin-left:2rem;text-decoration:underline;color:var(--goa-color-interactive-default);padding-bottom:var(--font-valign-fix);line-height:var(--goa-line-height-3)}summary:hover span{color:var(--goa-color-interactive-hover)}.content{border-left:4px solid var(--goa-color-greyscale-200);padding:1rem;margin-left:1.1rem;margin-bottom:var(--goa-space-s)}.content ::slotted(p:last-child){margin-bottom:0 !important}</style>`;init(this,{target:this.shadowRoot,props:attribute_to_object(this.attributes),customElement:true},instance$y,create_fragment$C,safe_not_equal,{heading:0,mt:1,mr:2,mb:3,ml:4},null);if(options){if(options.target){insert(options.target,this,options.anchor);}if(options.props){this.$set(options.props);flush();}}}static get observedAttributes(){return ["heading","mt","mr","mb","ml"];}get heading(){return this.$$.ctx[0];}set heading(heading){this.$$set({heading});flush();}get mt(){return this.$$.ctx[1];}set mt(mt){this.$$set({mt});flush();}get mr(){return this.$$.ctx[2];}set mr(mr){this.$$set({mr});flush();}get mb(){return this.$$.ctx[3];}set mb(mb){this.$$set({mb});flush();}get ml(){return this.$$.ctx[4];}set ml(ml){this.$$set({ml});flush();}}customElements.define("goa-details",Details);/* libs/web-components/src/components/divider/Divider.svelte generated by Svelte v3.51.0 */function create_fragment$B(ctx){let hr;let hr_style_value;return {c(){hr=element("hr");this.c=noop;attr(hr,"data-testid",/*testid*/ctx[0]);attr(hr,"style",hr_style_value=calculateMargin(/*mt*/ctx[1],/*mr*/ctx[2],/*mb*/ctx[3],/*ml*/ctx[4]));},m(target,anchor){insert(target,hr,anchor);},p(ctx,[dirty]){if(dirty&/*testid*/1){attr(hr,"data-testid",/*testid*/ctx[0]);}if(dirty&/*mt, mr, mb, ml*/30&&hr_style_value!==(hr_style_value=calculateMargin(/*mt*/ctx[1],/*mr*/ctx[2],/*mb*/ctx[3],/*ml*/ctx[4]))){attr(hr,"style",hr_style_value);}},i:noop,o:noop,d(detaching){if(detaching)detach(hr);}};}function instance$x($$self,$$props,$$invalidate){let{testid=""}=$$props;let{mt=null}=$$props;let{mr=null}=$$props;let{mb=null}=$$props;let{ml=null}=$$props;$$self.$$set=$$props=>{if('testid'in $$props)$$invalidate(0,testid=$$props.testid);if('mt'in $$props)$$invalidate(1,mt=$$props.mt);if('mr'in $$props)$$invalidate(2,mr=$$props.mr);if('mb'in $$props)$$invalidate(3,mb=$$props.mb);if('ml'in $$props)$$invalidate(4,ml=$$props.ml);};return [testid,mt,mr,mb,ml];}class Divider extends SvelteElement{constructor(options){super();this.shadowRoot.innerHTML=`<style>hr{padding:0;margin:0;height:1px;background-color:var(--goa-color-greyscale-200);border:none}</style>`;init(this,{target:this.shadowRoot,props:attribute_to_object(this.attributes),customElement:true},instance$x,create_fragment$B,safe_not_equal,{testid:0,mt:1,mr:2,mb:3,ml:4},null);if(options){if(options.target){insert(options.target,this,options.anchor);}if(options.props){this.$set(options.props);flush();}}}static get observedAttributes(){return ["testid","mt","mr","mb","ml"];}get testid(){return this.$$.ctx[0];}set testid(testid){this.$$set({testid});flush();}get mt(){return this.$$.ctx[1];}set mt(mt){this.$$set({mt});flush();}get mr(){return this.$$.ctx[2];}set mr(mr){this.$$set({mr});flush();}get mb(){return this.$$.ctx[3];}set mb(mb){this.$$set({mb});flush();}get ml(){return this.$$.ctx[4];}set ml(ml){this.$$set({ml});flush();}}customElements.define("goa-divider",Divider);/* libs/web-components/src/components/dropdown/Dropdown.svelte generated by Svelte v3.51.0 */function get_each_context_1(ctx,list,i){const child_ctx=ctx.slice();child_ctx[50]=list[i];child_ctx[54]=i;return child_ctx;}function get_each_context$7(ctx,list,i){const child_ctx=ctx.slice();child_ctx[50]=list[i];return child_ctx;}// (270:2) {:else}
+  `)){attr(div3,"class",div3_class_value);}},i:noop,o:noop,d(detaching){if(detaching)detach(div3);}};}function instance$z($$self,$$props,$$invalidate){const[Types,validateType]=typeValidator("Container type",["interactive","info","error","success","important","non-interactive"]);const[Accents,validateAccent]=typeValidator("Container accent",["thick","thin","filled"]);const[Paddings,validatePadding]=typeValidator("Container padding",["relaxed","compact"]);let{type="interactive"}=$$props;let{accent="filled"}=$$props;let{padding="relaxed"}=$$props;let{testid=""}=$$props;let{mt=null}=$$props;let{mr=null}=$$props;let{mb="m"}=$$props;let{ml=null}=$$props;onMount(()=>{validateType(type);validateAccent(accent);validatePadding(padding);});$$self.$$set=$$props=>{if('type'in $$props)$$invalidate(0,type=$$props.type);if('accent'in $$props)$$invalidate(1,accent=$$props.accent);if('padding'in $$props)$$invalidate(2,padding=$$props.padding);if('testid'in $$props)$$invalidate(3,testid=$$props.testid);if('mt'in $$props)$$invalidate(4,mt=$$props.mt);if('mr'in $$props)$$invalidate(5,mr=$$props.mr);if('mb'in $$props)$$invalidate(6,mb=$$props.mb);if('ml'in $$props)$$invalidate(7,ml=$$props.ml);};return [type,accent,padding,testid,mt,mr,mb,ml];}class Container extends SvelteElement{constructor(options){super();this.shadowRoot.innerHTML=`<style>:host{box-sizing:border-box;font-family:var(--goa-font-family-sans);font-size:var(--goa-font-size-4);display:flex;flex:1 1 auto}.goa-container{box-sizing:border-box;display:flex;flex:1 1 auto;flex-direction:column}.goa-container *{box-sizing:border-box}header{display:flex;align-items:center;justify-content:space-between;font-weight:700;font-size:var(--goa-font-size-4);border-width:1px;border-style:solid;border-top-left-radius:var(--goa-border-radius-m);border-top-right-radius:var(--goa-border-radius-m)}.content{border-bottom:1px solid var(--goa-color-greyscale-200);border-left:1px solid var(--goa-color-greyscale-200);border-right:1px solid var(--goa-color-greyscale-200);border-bottom-left-radius:var(--goa-border-radius-m);border-bottom-right-radius:var(--goa-border-radius-m);display:flex;flex:1 1 auto;flex-direction:column}.content ::slotted(p:last-child){margin-bottom:0 !important}.goa-container--non-interactive.accent--filled .content{border-color:var(--goa-color-greyscale-200);background-color:var(--goa-color-greyscale-100)}.goa-container--important.accent--filled .content{border-color:var(--goa-color-warning-default);background-color:var(--goa-color-warning-background)}.goa-container--error.accent--filled .content{border-color:var(--goa-color-emergency-default);background-color:var(--goa-color-emergency-background)}.goa-container--success.accent--filled .content{border-color:var(--goa-color-success-default);background-color:var(--goa-color-success-background)}.goa-container--info.accent--filled .content{border-color:var(--goa-color-info-default);background-color:var(--goa-color-info-background)}.title,.actions{padding:0.5rem 0}.padding--relaxed header{padding:0 1.5rem}.padding--relaxed .content{padding:1.5rem}.padding--compact header,.padding--compact .content{padding:0 1rem}.padding--compact header{padding:0 1rem}.padding--compact .content{padding:1rem}@media screen and (max-width: 480px){.padding--relaxed header{padding:0 1rem}.padding--relaxed .content{padding:1rem}}.goa-container--non-interactive header{background-color:var(--goa-color-greyscale-100);border-color:var(--goa-color-greyscale-200);color:var(--goa-color-greyscale-black)}.goa-container--interactive header{background-color:var(--goa-color-brand-default);border-color:var(--goa-color-brand-default);color:var(--goa-color-greyscale-white)}.goa-container--info header{background-color:var(--goa-color-info-default);border-color:var(--goa-color-info-default);color:var(--goa-color-greyscale-white)}.goa-container--error header{background-color:var(--goa-color-emergency-default);border-color:var(--goa-color-emergency-default);color:var(--goa-color-greyscale-white)}.goa-container--success header{background-color:var(--goa-color-success-default);border-color:var(--goa-color-success-default);color:var(--goa-color-greyscale-white)}.goa-container--important header{background-color:var(--goa-color-warning-default);border-color:var(--goa-color-warning-default);color:var(--goa-color-greyscale-white)}.heading--thick{padding:0.5rem 1.5rem;max-height:3rem;min-height:1rem}.heading--thick .title{line-height:2rem}.heading--thin{height:0.5rem}.heading--filled{display:none}.heading--filled~.content{border-top:1px solid var(--goa-color-greyscale-200);border-top-left-radius:var(--goa-border-radius-m);border-top-right-radius:var(--goa-border-radius-m)}.heading--thin .title,.heading--thin .actions{display:none}.actions{display:flex;align-items:center}</style>`;init(this,{target:this.shadowRoot,props:attribute_to_object(this.attributes),customElement:true},instance$z,create_fragment$D,safe_not_equal,{type:0,accent:1,padding:2,testid:3,mt:4,mr:5,mb:6,ml:7},null);if(options){if(options.target){insert(options.target,this,options.anchor);}if(options.props){this.$set(options.props);flush();}}}static get observedAttributes(){return ["type","accent","padding","testid","mt","mr","mb","ml"];}get type(){return this.$$.ctx[0];}set type(type){this.$$set({type});flush();}get accent(){return this.$$.ctx[1];}set accent(accent){this.$$set({accent});flush();}get padding(){return this.$$.ctx[2];}set padding(padding){this.$$set({padding});flush();}get testid(){return this.$$.ctx[3];}set testid(testid){this.$$set({testid});flush();}get mt(){return this.$$.ctx[4];}set mt(mt){this.$$set({mt});flush();}get mr(){return this.$$.ctx[5];}set mr(mr){this.$$set({mr});flush();}get mb(){return this.$$.ctx[6];}set mb(mb){this.$$set({mb});flush();}get ml(){return this.$$.ctx[7];}set ml(ml){this.$$set({ml});flush();}}customElements.define("goa-container",Container);/* libs/web-components/src/components/details/Details.svelte generated by Svelte v3.51.0 */function create_fragment$C(ctx){let details;let summary;let goa_icon;let goa_icon_fillcolor_value;let t0;let span;let t1;let t2;let div;let details_style_value;let mounted;let dispose;return {c(){details=element("details");summary=element("summary");goa_icon=element("goa-icon");t0=space();span=element("span");t1=text(/*heading*/ctx[1]);t2=space();div=element("div");div.innerHTML=`<slot></slot>`;this.c=noop;set_custom_element_data(goa_icon,"mt","1");set_custom_element_data(goa_icon,"mr","2");set_custom_element_data(goa_icon,"type","chevron-forward");set_custom_element_data(goa_icon,"fillcolor",goa_icon_fillcolor_value=/*_isMouseOver*/ctx[6]?"var(--goa-color-interactive-hover)":"var(--goa-color-interactive-default)");attr(div,"class","content");details.open=/*_isOpen*/ctx[9];attr(details,"style",details_style_value=calculateMargin(/*mt*/ctx[2],/*mr*/ctx[3],/*mb*/ctx[4],/*ml*/ctx[5]));},m(target,anchor){insert(target,details,anchor);append(details,summary);append(summary,goa_icon);append(summary,t0);append(summary,span);append(span,t1);/*summary_binding*/ctx[10](summary);append(details,t2);append(details,div);/*details_binding*/ctx[11](details);if(!mounted){dispose=listen(details,"toggle",/*toggle_handler*/ctx[12]);mounted=true;}},p(ctx,[dirty]){if(dirty&/*_isMouseOver*/64&&goa_icon_fillcolor_value!==(goa_icon_fillcolor_value=/*_isMouseOver*/ctx[6]?"var(--goa-color-interactive-hover)":"var(--goa-color-interactive-default)")){set_custom_element_data(goa_icon,"fillcolor",goa_icon_fillcolor_value);}if(dirty&/*heading*/2)set_data(t1,/*heading*/ctx[1]);if(dirty&/*_isOpen*/512){details.open=/*_isOpen*/ctx[9];}if(dirty&/*mt, mr, mb, ml*/60&&details_style_value!==(details_style_value=calculateMargin(/*mt*/ctx[2],/*mr*/ctx[3],/*mb*/ctx[4],/*ml*/ctx[5]))){attr(details,"style",details_style_value);}},i:noop,o:noop,d(detaching){if(detaching)detach(details);/*summary_binding*/ctx[10](null);/*details_binding*/ctx[11](null);mounted=false;dispose();}};}function instance$y($$self,$$props,$$invalidate){let _isOpen;let{heading}=$$props;let{mt=null}=$$props;let{mr=null}=$$props;let{mb=null}=$$props;let{ml=null}=$$props;let{open="false"}=$$props;let _isMouseOver=false;let _summaryEl;let _detailsEl;onMount(()=>{validateRequired("Details",{heading});_summaryEl.addEventListener("mouseover",()=>{$$invalidate(6,_isMouseOver=true);});_summaryEl.addEventListener("mouseout",()=>{$$invalidate(6,_isMouseOver=false);});});function summary_binding($$value){binding_callbacks[$$value?'unshift':'push'](()=>{_summaryEl=$$value;$$invalidate(7,_summaryEl);});}function details_binding($$value){binding_callbacks[$$value?'unshift':'push'](()=>{_detailsEl=$$value;$$invalidate(8,_detailsEl);});}const toggle_handler=({target})=>$$invalidate(0,open=`${target.open}`);$$self.$$set=$$props=>{if('heading'in $$props)$$invalidate(1,heading=$$props.heading);if('mt'in $$props)$$invalidate(2,mt=$$props.mt);if('mr'in $$props)$$invalidate(3,mr=$$props.mr);if('mb'in $$props)$$invalidate(4,mb=$$props.mb);if('ml'in $$props)$$invalidate(5,ml=$$props.ml);if('open'in $$props)$$invalidate(0,open=$$props.open);};$$self.$$.update=()=>{if($$self.$$.dirty&/*open*/1){$$invalidate(9,_isOpen=toBoolean(open));}};return [open,heading,mt,mr,mb,ml,_isMouseOver,_summaryEl,_detailsEl,_isOpen,summary_binding,details_binding,toggle_handler];}class Details extends SvelteElement{constructor(options){super();this.shadowRoot.innerHTML=`<style>:host{font-family:var(--goa-font-family-sans)}details{max-width:75ch;position:relative}details ::slotted(*){font:var(--goa-typography-body-m)}summary{padding:0.5rem;margin-bottom:0.5rem;cursor:pointer;list-style:none;display:flex;align-items:flex-start}goa-icon{position:absolute}details[open] goa-icon{transform:translateX(-1px) rotate(90deg);top:0.75rem}details summary::-webkit-details-marker{display:none}summary{border-radius:var(--goa-border-radius-m)}summary:focus,summary:active{outline:3px solid var(--goa-color-interactive-focus);border-radius:var(--goa-border-radius-m);color:var(--goa-color-interactive-hover);background-color:var(--goa-color-greyscale-100)}summary:hover{background-color:var(--goa-color-greyscale-100)}summary span{margin-left:2rem;text-decoration:underline;color:var(--goa-color-interactive-default);padding-bottom:var(--font-valign-fix);line-height:var(--goa-line-height-3)}summary:hover span{color:var(--goa-color-interactive-hover)}.content{border-left:4px solid var(--goa-color-greyscale-200);padding:1rem;margin-left:1.1rem;margin-bottom:var(--goa-space-s)}.content ::slotted(p:last-child){margin-bottom:0 !important}</style>`;init(this,{target:this.shadowRoot,props:attribute_to_object(this.attributes),customElement:true},instance$y,create_fragment$C,safe_not_equal,{heading:1,mt:2,mr:3,mb:4,ml:5,open:0},null);if(options){if(options.target){insert(options.target,this,options.anchor);}if(options.props){this.$set(options.props);flush();}}}static get observedAttributes(){return ["heading","mt","mr","mb","ml","open"];}get heading(){return this.$$.ctx[1];}set heading(heading){this.$$set({heading});flush();}get mt(){return this.$$.ctx[2];}set mt(mt){this.$$set({mt});flush();}get mr(){return this.$$.ctx[3];}set mr(mr){this.$$set({mr});flush();}get mb(){return this.$$.ctx[4];}set mb(mb){this.$$set({mb});flush();}get ml(){return this.$$.ctx[5];}set ml(ml){this.$$set({ml});flush();}get open(){return this.$$.ctx[0];}set open(open){this.$$set({open});flush();}}customElements.define("goa-details",Details);/* libs/web-components/src/components/divider/Divider.svelte generated by Svelte v3.51.0 */function create_fragment$B(ctx){let hr;let hr_style_value;return {c(){hr=element("hr");this.c=noop;attr(hr,"data-testid",/*testid*/ctx[0]);attr(hr,"style",hr_style_value=calculateMargin(/*mt*/ctx[1],/*mr*/ctx[2],/*mb*/ctx[3],/*ml*/ctx[4]));},m(target,anchor){insert(target,hr,anchor);},p(ctx,[dirty]){if(dirty&/*testid*/1){attr(hr,"data-testid",/*testid*/ctx[0]);}if(dirty&/*mt, mr, mb, ml*/30&&hr_style_value!==(hr_style_value=calculateMargin(/*mt*/ctx[1],/*mr*/ctx[2],/*mb*/ctx[3],/*ml*/ctx[4]))){attr(hr,"style",hr_style_value);}},i:noop,o:noop,d(detaching){if(detaching)detach(hr);}};}function instance$x($$self,$$props,$$invalidate){let{testid=""}=$$props;let{mt=null}=$$props;let{mr=null}=$$props;let{mb=null}=$$props;let{ml=null}=$$props;$$self.$$set=$$props=>{if('testid'in $$props)$$invalidate(0,testid=$$props.testid);if('mt'in $$props)$$invalidate(1,mt=$$props.mt);if('mr'in $$props)$$invalidate(2,mr=$$props.mr);if('mb'in $$props)$$invalidate(3,mb=$$props.mb);if('ml'in $$props)$$invalidate(4,ml=$$props.ml);};return [testid,mt,mr,mb,ml];}class Divider extends SvelteElement{constructor(options){super();this.shadowRoot.innerHTML=`<style>hr{padding:0;margin:0;height:1px;background-color:var(--goa-color-greyscale-200);border:none}</style>`;init(this,{target:this.shadowRoot,props:attribute_to_object(this.attributes),customElement:true},instance$x,create_fragment$B,safe_not_equal,{testid:0,mt:1,mr:2,mb:3,ml:4},null);if(options){if(options.target){insert(options.target,this,options.anchor);}if(options.props){this.$set(options.props);flush();}}}static get observedAttributes(){return ["testid","mt","mr","mb","ml"];}get testid(){return this.$$.ctx[0];}set testid(testid){this.$$set({testid});flush();}get mt(){return this.$$.ctx[1];}set mt(mt){this.$$set({mt});flush();}get mr(){return this.$$.ctx[2];}set mr(mr){this.$$set({mr});flush();}get mb(){return this.$$.ctx[3];}set mb(mb){this.$$set({mb});flush();}get ml(){return this.$$.ctx[4];}set ml(ml){this.$$set({ml});flush();}}customElements.define("goa-divider",Divider);/* libs/web-components/src/components/dropdown/Dropdown.svelte generated by Svelte v3.51.0 */function get_each_context_1(ctx,list,i){const child_ctx=ctx.slice();child_ctx[50]=list[i];child_ctx[54]=i;return child_ctx;}function get_each_context$7(ctx,list,i){const child_ctx=ctx.slice();child_ctx[50]=list[i];return child_ctx;}// (270:2) {:else}
 function create_else_block$7(ctx){let t0;let goa_input;let goa_input_arialabel_value;let goa_input_data_testid_value;let t1;let slot;let t2;let ul;let each_blocks=[];let each_1_lookup=new Map();let ul_style_value;let mounted;let dispose;let if_block=/*_isMenuVisible*/ctx[17]&&create_if_block_1$a(ctx);let each_value_1=/*_options*/ctx[12];const get_key=ctx=>/*index*/ctx[54];for(let i=0;i<each_value_1.length;i+=1){let child_ctx=get_each_context_1(ctx,each_value_1,i);let key=get_key(child_ctx);each_1_lookup.set(key,each_blocks[i]=create_each_block_1(key,child_ctx));}return {c(){if(if_block)if_block.c();t0=space();goa_input=element("goa-input");t1=space();slot=element("slot");t2=space();ul=element("ul");for(let i=0;i<each_blocks.length;i+=1){each_blocks[i].c();}set_custom_element_data(goa_input,"error",/*error*/ctx[7]);set_custom_element_data(goa_input,"disabled",/*disabled*/ctx[6]);set_custom_element_data(goa_input,"leadingicon",/*leadingicon*/ctx[2]);set_custom_element_data(goa_input,"placeholder",/*placeholder*/ctx[4]);set_custom_element_data(goa_input,"aria-controls","menu");set_custom_element_data(goa_input,"aria-expanded",/*_isMenuVisible*/ctx[17]);set_custom_element_data(goa_input,"arialabel",goa_input_arialabel_value=/*arialabel*/ctx[1]||/*name*/ctx[0]);set_custom_element_data(goa_input,"data-testid",goa_input_data_testid_value=`${/*name*/ctx[0]}-dropdown-input`);set_custom_element_data(goa_input,"readonly","");set_custom_element_data(goa_input,"role","combobox");set_custom_element_data(goa_input,"trailingicon","chevron-down");set_custom_element_data(goa_input,"type","text");set_custom_element_data(goa_input,"value",/*_selectedLabel*/ctx[16]);set_custom_element_data(goa_input,"width","100%");set_custom_element_data(goa_input,"name",/*name*/ctx[0]);attr(ul,"id","menu");attr(ul,"role","listbox");attr(ul,"aria-activedescendant",/*_selectedLabel*/ctx[16]);attr(ul,"data-testid","dropdown-menu");attr(ul,"tabindex","0");attr(ul,"class","dropdown-list");attr(ul,"style",ul_style_value=`
         overflow-y: auto;
         max-height: ${/*maxheight*/ctx[3]};
@@ -1054,6 +1054,7 @@ const GoAContainer = ({
 function GoADetails(props) {
   return jsx("goa-details", Object.assign({
     heading: props.heading,
+    open: props.open,
     mt: props.mt,
     mr: props.mr,
     mb: props.mb,

package/react-components.umd.js

@@ -131,7 +131,7 @@
     goa-container--${/*type*/ctx[0]}
     padding--${/*padding*/ctx[2]}
     accent--${/*accent*/ctx[1]}
-  `)){attr(div3,"class",div3_class_value);}},i:noop,o:noop,d(detaching){if(detaching)detach(div3);}};}function instance$z($$self,$$props,$$invalidate){const[Types,validateType]=typeValidator("Container type",["interactive","info","error","success","important","non-interactive"]);const[Accents,validateAccent]=typeValidator("Container accent",["thick","thin","filled"]);const[Paddings,validatePadding]=typeValidator("Container padding",["relaxed","compact"]);let{type="interactive"}=$$props;let{accent="filled"}=$$props;let{padding="relaxed"}=$$props;let{testid=""}=$$props;let{mt=null}=$$props;let{mr=null}=$$props;let{mb="m"}=$$props;let{ml=null}=$$props;onMount(()=>{validateType(type);validateAccent(accent);validatePadding(padding);});$$self.$$set=$$props=>{if('type'in $$props)$$invalidate(0,type=$$props.type);if('accent'in $$props)$$invalidate(1,accent=$$props.accent);if('padding'in $$props)$$invalidate(2,padding=$$props.padding);if('testid'in $$props)$$invalidate(3,testid=$$props.testid);if('mt'in $$props)$$invalidate(4,mt=$$props.mt);if('mr'in $$props)$$invalidate(5,mr=$$props.mr);if('mb'in $$props)$$invalidate(6,mb=$$props.mb);if('ml'in $$props)$$invalidate(7,ml=$$props.ml);};return [type,accent,padding,testid,mt,mr,mb,ml];}class Container extends SvelteElement{constructor(options){super();this.shadowRoot.innerHTML=`<style>:host{box-sizing:border-box;font-family:var(--goa-font-family-sans);font-size:var(--goa-font-size-4);display:flex;flex:1 1 auto}.goa-container{box-sizing:border-box;display:flex;flex:1 1 auto;flex-direction:column}.goa-container *{box-sizing:border-box}header{display:flex;align-items:center;justify-content:space-between;font-weight:700;font-size:var(--goa-font-size-4);border-width:1px;border-style:solid;border-top-left-radius:var(--goa-border-radius-m);border-top-right-radius:var(--goa-border-radius-m)}.content{border-bottom:1px solid var(--goa-color-greyscale-200);border-left:1px solid var(--goa-color-greyscale-200);border-right:1px solid var(--goa-color-greyscale-200);border-bottom-left-radius:var(--goa-border-radius-m);border-bottom-right-radius:var(--goa-border-radius-m);display:flex;flex:1 1 auto;flex-direction:column}.content ::slotted(p:last-child){margin-bottom:0 !important}.goa-container--non-interactive.accent--filled .content{border-color:var(--goa-color-greyscale-200);background-color:var(--goa-color-greyscale-100)}.goa-container--important.accent--filled .content{border-color:var(--goa-color-warning-default);background-color:var(--goa-color-warning-background)}.goa-container--error.accent--filled .content{border-color:var(--goa-color-emergency-default);background-color:var(--goa-color-emergency-background)}.goa-container--success.accent--filled .content{border-color:var(--goa-color-success-default);background-color:var(--goa-color-success-background)}.goa-container--info.accent--filled .content{border-color:var(--goa-color-info-default);background-color:var(--goa-color-info-background)}.title,.actions{padding:0.5rem 0}.padding--relaxed header{padding:0 1.5rem}.padding--relaxed .content{padding:1.5rem}.padding--compact header,.padding--compact .content{padding:0 1rem}.padding--compact header{padding:0 1rem}.padding--compact .content{padding:1rem}@media screen and (max-width: 480px){.padding--relaxed header{padding:0 1rem}.padding--relaxed .content{padding:1rem}}.goa-container--non-interactive header{background-color:var(--goa-color-greyscale-100);border-color:var(--goa-color-greyscale-200);color:var(--goa-color-greyscale-black)}.goa-container--interactive header{background-color:var(--goa-color-brand-default);border-color:var(--goa-color-brand-default);color:var(--goa-color-greyscale-white)}.goa-container--info header{background-color:var(--goa-color-info-default);border-color:var(--goa-color-info-default);color:var(--goa-color-greyscale-white)}.goa-container--error header{background-color:var(--goa-color-emergency-default);border-color:var(--goa-color-emergency-default);color:var(--goa-color-greyscale-white)}.goa-container--success header{background-color:var(--goa-color-success-default);border-color:var(--goa-color-success-default);color:var(--goa-color-greyscale-white)}.goa-container--important header{background-color:var(--goa-color-warning-default);border-color:var(--goa-color-warning-default);color:var(--goa-color-greyscale-white)}.heading--thick{padding:0.5rem 1.5rem;max-height:3rem;min-height:1rem}.heading--thick .title{line-height:2rem}.heading--thin{height:0.5rem}.heading--filled{display:none}.heading--filled~.content{border-top:1px solid var(--goa-color-greyscale-200);border-top-left-radius:var(--goa-border-radius-m);border-top-right-radius:var(--goa-border-radius-m)}.heading--thin .title,.heading--thin .actions{display:none}.actions{display:flex;align-items:center}</style>`;init(this,{target:this.shadowRoot,props:attribute_to_object(this.attributes),customElement:true},instance$z,create_fragment$D,safe_not_equal,{type:0,accent:1,padding:2,testid:3,mt:4,mr:5,mb:6,ml:7},null);if(options){if(options.target){insert(options.target,this,options.anchor);}if(options.props){this.$set(options.props);flush();}}}static get observedAttributes(){return ["type","accent","padding","testid","mt","mr","mb","ml"];}get type(){return this.$$.ctx[0];}set type(type){this.$$set({type});flush();}get accent(){return this.$$.ctx[1];}set accent(accent){this.$$set({accent});flush();}get padding(){return this.$$.ctx[2];}set padding(padding){this.$$set({padding});flush();}get testid(){return this.$$.ctx[3];}set testid(testid){this.$$set({testid});flush();}get mt(){return this.$$.ctx[4];}set mt(mt){this.$$set({mt});flush();}get mr(){return this.$$.ctx[5];}set mr(mr){this.$$set({mr});flush();}get mb(){return this.$$.ctx[6];}set mb(mb){this.$$set({mb});flush();}get ml(){return this.$$.ctx[7];}set ml(ml){this.$$set({ml});flush();}}customElements.define("goa-container",Container);/* libs/web-components/src/components/details/Details.svelte generated by Svelte v3.51.0 */function create_fragment$C(ctx){let details;let summary;let goa_icon;let goa_icon_fillcolor_value;let t0;let span;let t1;let t2;let div;let details_style_value;return {c(){details=element("details");summary=element("summary");goa_icon=element("goa-icon");t0=space();span=element("span");t1=text(/*heading*/ctx[0]);t2=space();div=element("div");div.innerHTML=`<slot></slot>`;this.c=noop;set_custom_element_data(goa_icon,"mt","1");set_custom_element_data(goa_icon,"mr","2");set_custom_element_data(goa_icon,"type","chevron-forward");set_custom_element_data(goa_icon,"fillcolor",goa_icon_fillcolor_value=/*_isMouseOver*/ctx[5]?"var(--goa-color-interactive-hover)":"var(--goa-color-interactive-default)");attr(div,"class","content");attr(details,"style",details_style_value=calculateMargin(/*mt*/ctx[1],/*mr*/ctx[2],/*mb*/ctx[3],/*ml*/ctx[4]));},m(target,anchor){insert(target,details,anchor);append(details,summary);append(summary,goa_icon);append(summary,t0);append(summary,span);append(span,t1);/*summary_binding*/ctx[7](summary);append(details,t2);append(details,div);},p(ctx,[dirty]){if(dirty&/*_isMouseOver*/32&&goa_icon_fillcolor_value!==(goa_icon_fillcolor_value=/*_isMouseOver*/ctx[5]?"var(--goa-color-interactive-hover)":"var(--goa-color-interactive-default)")){set_custom_element_data(goa_icon,"fillcolor",goa_icon_fillcolor_value);}if(dirty&/*heading*/1)set_data(t1,/*heading*/ctx[0]);if(dirty&/*mt, mr, mb, ml*/30&&details_style_value!==(details_style_value=calculateMargin(/*mt*/ctx[1],/*mr*/ctx[2],/*mb*/ctx[3],/*ml*/ctx[4]))){attr(details,"style",details_style_value);}},i:noop,o:noop,d(detaching){if(detaching)detach(details);/*summary_binding*/ctx[7](null);}};}function instance$y($$self,$$props,$$invalidate){let{heading}=$$props;let{mt=null}=$$props;let{mr=null}=$$props;let{mb=null}=$$props;let{ml=null}=$$props;let _isMouseOver=false;let _summaryEl;onMount(()=>{validateRequired("Details",{heading});_summaryEl.addEventListener("mouseover",()=>{$$invalidate(5,_isMouseOver=true);});_summaryEl.addEventListener("mouseout",()=>{$$invalidate(5,_isMouseOver=false);});});function summary_binding($$value){binding_callbacks[$$value?'unshift':'push'](()=>{_summaryEl=$$value;$$invalidate(6,_summaryEl);});}$$self.$$set=$$props=>{if('heading'in $$props)$$invalidate(0,heading=$$props.heading);if('mt'in $$props)$$invalidate(1,mt=$$props.mt);if('mr'in $$props)$$invalidate(2,mr=$$props.mr);if('mb'in $$props)$$invalidate(3,mb=$$props.mb);if('ml'in $$props)$$invalidate(4,ml=$$props.ml);};return [heading,mt,mr,mb,ml,_isMouseOver,_summaryEl,summary_binding];}class Details extends SvelteElement{constructor(options){super();this.shadowRoot.innerHTML=`<style>:host{font-family:var(--goa-font-family-sans)}details{max-width:75ch;position:relative}details ::slotted(*){font:var(--goa-typography-body-m)}summary{padding:0.5rem;margin-bottom:0.5rem;cursor:pointer;list-style:none;display:flex;align-items:flex-start}goa-icon{position:absolute}details[open] goa-icon{transform:translateX(-1px) rotate(90deg);top:0.75rem}details summary::-webkit-details-marker{display:none}summary{border-radius:var(--goa-border-radius-m)}summary:focus,summary:active{outline:3px solid var(--goa-color-interactive-focus);border-radius:var(--goa-border-radius-m);color:var(--goa-color-interactive-hover);background-color:var(--goa-color-greyscale-100)}summary:hover{background-color:var(--goa-color-greyscale-100)}summary span{margin-left:2rem;text-decoration:underline;color:var(--goa-color-interactive-default);padding-bottom:var(--font-valign-fix);line-height:var(--goa-line-height-3)}summary:hover span{color:var(--goa-color-interactive-hover)}.content{border-left:4px solid var(--goa-color-greyscale-200);padding:1rem;margin-left:1.1rem;margin-bottom:var(--goa-space-s)}.content ::slotted(p:last-child){margin-bottom:0 !important}</style>`;init(this,{target:this.shadowRoot,props:attribute_to_object(this.attributes),customElement:true},instance$y,create_fragment$C,safe_not_equal,{heading:0,mt:1,mr:2,mb:3,ml:4},null);if(options){if(options.target){insert(options.target,this,options.anchor);}if(options.props){this.$set(options.props);flush();}}}static get observedAttributes(){return ["heading","mt","mr","mb","ml"];}get heading(){return this.$$.ctx[0];}set heading(heading){this.$$set({heading});flush();}get mt(){return this.$$.ctx[1];}set mt(mt){this.$$set({mt});flush();}get mr(){return this.$$.ctx[2];}set mr(mr){this.$$set({mr});flush();}get mb(){return this.$$.ctx[3];}set mb(mb){this.$$set({mb});flush();}get ml(){return this.$$.ctx[4];}set ml(ml){this.$$set({ml});flush();}}customElements.define("goa-details",Details);/* libs/web-components/src/components/divider/Divider.svelte generated by Svelte v3.51.0 */function create_fragment$B(ctx){let hr;let hr_style_value;return {c(){hr=element("hr");this.c=noop;attr(hr,"data-testid",/*testid*/ctx[0]);attr(hr,"style",hr_style_value=calculateMargin(/*mt*/ctx[1],/*mr*/ctx[2],/*mb*/ctx[3],/*ml*/ctx[4]));},m(target,anchor){insert(target,hr,anchor);},p(ctx,[dirty]){if(dirty&/*testid*/1){attr(hr,"data-testid",/*testid*/ctx[0]);}if(dirty&/*mt, mr, mb, ml*/30&&hr_style_value!==(hr_style_value=calculateMargin(/*mt*/ctx[1],/*mr*/ctx[2],/*mb*/ctx[3],/*ml*/ctx[4]))){attr(hr,"style",hr_style_value);}},i:noop,o:noop,d(detaching){if(detaching)detach(hr);}};}function instance$x($$self,$$props,$$invalidate){let{testid=""}=$$props;let{mt=null}=$$props;let{mr=null}=$$props;let{mb=null}=$$props;let{ml=null}=$$props;$$self.$$set=$$props=>{if('testid'in $$props)$$invalidate(0,testid=$$props.testid);if('mt'in $$props)$$invalidate(1,mt=$$props.mt);if('mr'in $$props)$$invalidate(2,mr=$$props.mr);if('mb'in $$props)$$invalidate(3,mb=$$props.mb);if('ml'in $$props)$$invalidate(4,ml=$$props.ml);};return [testid,mt,mr,mb,ml];}class Divider extends SvelteElement{constructor(options){super();this.shadowRoot.innerHTML=`<style>hr{padding:0;margin:0;height:1px;background-color:var(--goa-color-greyscale-200);border:none}</style>`;init(this,{target:this.shadowRoot,props:attribute_to_object(this.attributes),customElement:true},instance$x,create_fragment$B,safe_not_equal,{testid:0,mt:1,mr:2,mb:3,ml:4},null);if(options){if(options.target){insert(options.target,this,options.anchor);}if(options.props){this.$set(options.props);flush();}}}static get observedAttributes(){return ["testid","mt","mr","mb","ml"];}get testid(){return this.$$.ctx[0];}set testid(testid){this.$$set({testid});flush();}get mt(){return this.$$.ctx[1];}set mt(mt){this.$$set({mt});flush();}get mr(){return this.$$.ctx[2];}set mr(mr){this.$$set({mr});flush();}get mb(){return this.$$.ctx[3];}set mb(mb){this.$$set({mb});flush();}get ml(){return this.$$.ctx[4];}set ml(ml){this.$$set({ml});flush();}}customElements.define("goa-divider",Divider);/* libs/web-components/src/components/dropdown/Dropdown.svelte generated by Svelte v3.51.0 */function get_each_context_1(ctx,list,i){const child_ctx=ctx.slice();child_ctx[50]=list[i];child_ctx[54]=i;return child_ctx;}function get_each_context$7(ctx,list,i){const child_ctx=ctx.slice();child_ctx[50]=list[i];return child_ctx;}// (270:2) {:else}
+  `)){attr(div3,"class",div3_class_value);}},i:noop,o:noop,d(detaching){if(detaching)detach(div3);}};}function instance$z($$self,$$props,$$invalidate){const[Types,validateType]=typeValidator("Container type",["interactive","info","error","success","important","non-interactive"]);const[Accents,validateAccent]=typeValidator("Container accent",["thick","thin","filled"]);const[Paddings,validatePadding]=typeValidator("Container padding",["relaxed","compact"]);let{type="interactive"}=$$props;let{accent="filled"}=$$props;let{padding="relaxed"}=$$props;let{testid=""}=$$props;let{mt=null}=$$props;let{mr=null}=$$props;let{mb="m"}=$$props;let{ml=null}=$$props;onMount(()=>{validateType(type);validateAccent(accent);validatePadding(padding);});$$self.$$set=$$props=>{if('type'in $$props)$$invalidate(0,type=$$props.type);if('accent'in $$props)$$invalidate(1,accent=$$props.accent);if('padding'in $$props)$$invalidate(2,padding=$$props.padding);if('testid'in $$props)$$invalidate(3,testid=$$props.testid);if('mt'in $$props)$$invalidate(4,mt=$$props.mt);if('mr'in $$props)$$invalidate(5,mr=$$props.mr);if('mb'in $$props)$$invalidate(6,mb=$$props.mb);if('ml'in $$props)$$invalidate(7,ml=$$props.ml);};return [type,accent,padding,testid,mt,mr,mb,ml];}class Container extends SvelteElement{constructor(options){super();this.shadowRoot.innerHTML=`<style>:host{box-sizing:border-box;font-family:var(--goa-font-family-sans);font-size:var(--goa-font-size-4);display:flex;flex:1 1 auto}.goa-container{box-sizing:border-box;display:flex;flex:1 1 auto;flex-direction:column}.goa-container *{box-sizing:border-box}header{display:flex;align-items:center;justify-content:space-between;font-weight:700;font-size:var(--goa-font-size-4);border-width:1px;border-style:solid;border-top-left-radius:var(--goa-border-radius-m);border-top-right-radius:var(--goa-border-radius-m)}.content{border-bottom:1px solid var(--goa-color-greyscale-200);border-left:1px solid var(--goa-color-greyscale-200);border-right:1px solid var(--goa-color-greyscale-200);border-bottom-left-radius:var(--goa-border-radius-m);border-bottom-right-radius:var(--goa-border-radius-m);display:flex;flex:1 1 auto;flex-direction:column}.content ::slotted(p:last-child){margin-bottom:0 !important}.goa-container--non-interactive.accent--filled .content{border-color:var(--goa-color-greyscale-200);background-color:var(--goa-color-greyscale-100)}.goa-container--important.accent--filled .content{border-color:var(--goa-color-warning-default);background-color:var(--goa-color-warning-background)}.goa-container--error.accent--filled .content{border-color:var(--goa-color-emergency-default);background-color:var(--goa-color-emergency-background)}.goa-container--success.accent--filled .content{border-color:var(--goa-color-success-default);background-color:var(--goa-color-success-background)}.goa-container--info.accent--filled .content{border-color:var(--goa-color-info-default);background-color:var(--goa-color-info-background)}.title,.actions{padding:0.5rem 0}.padding--relaxed header{padding:0 1.5rem}.padding--relaxed .content{padding:1.5rem}.padding--compact header,.padding--compact .content{padding:0 1rem}.padding--compact header{padding:0 1rem}.padding--compact .content{padding:1rem}@media screen and (max-width: 480px){.padding--relaxed header{padding:0 1rem}.padding--relaxed .content{padding:1rem}}.goa-container--non-interactive header{background-color:var(--goa-color-greyscale-100);border-color:var(--goa-color-greyscale-200);color:var(--goa-color-greyscale-black)}.goa-container--interactive header{background-color:var(--goa-color-brand-default);border-color:var(--goa-color-brand-default);color:var(--goa-color-greyscale-white)}.goa-container--info header{background-color:var(--goa-color-info-default);border-color:var(--goa-color-info-default);color:var(--goa-color-greyscale-white)}.goa-container--error header{background-color:var(--goa-color-emergency-default);border-color:var(--goa-color-emergency-default);color:var(--goa-color-greyscale-white)}.goa-container--success header{background-color:var(--goa-color-success-default);border-color:var(--goa-color-success-default);color:var(--goa-color-greyscale-white)}.goa-container--important header{background-color:var(--goa-color-warning-default);border-color:var(--goa-color-warning-default);color:var(--goa-color-greyscale-white)}.heading--thick{padding:0.5rem 1.5rem;max-height:3rem;min-height:1rem}.heading--thick .title{line-height:2rem}.heading--thin{height:0.5rem}.heading--filled{display:none}.heading--filled~.content{border-top:1px solid var(--goa-color-greyscale-200);border-top-left-radius:var(--goa-border-radius-m);border-top-right-radius:var(--goa-border-radius-m)}.heading--thin .title,.heading--thin .actions{display:none}.actions{display:flex;align-items:center}</style>`;init(this,{target:this.shadowRoot,props:attribute_to_object(this.attributes),customElement:true},instance$z,create_fragment$D,safe_not_equal,{type:0,accent:1,padding:2,testid:3,mt:4,mr:5,mb:6,ml:7},null);if(options){if(options.target){insert(options.target,this,options.anchor);}if(options.props){this.$set(options.props);flush();}}}static get observedAttributes(){return ["type","accent","padding","testid","mt","mr","mb","ml"];}get type(){return this.$$.ctx[0];}set type(type){this.$$set({type});flush();}get accent(){return this.$$.ctx[1];}set accent(accent){this.$$set({accent});flush();}get padding(){return this.$$.ctx[2];}set padding(padding){this.$$set({padding});flush();}get testid(){return this.$$.ctx[3];}set testid(testid){this.$$set({testid});flush();}get mt(){return this.$$.ctx[4];}set mt(mt){this.$$set({mt});flush();}get mr(){return this.$$.ctx[5];}set mr(mr){this.$$set({mr});flush();}get mb(){return this.$$.ctx[6];}set mb(mb){this.$$set({mb});flush();}get ml(){return this.$$.ctx[7];}set ml(ml){this.$$set({ml});flush();}}customElements.define("goa-container",Container);/* libs/web-components/src/components/details/Details.svelte generated by Svelte v3.51.0 */function create_fragment$C(ctx){let details;let summary;let goa_icon;let goa_icon_fillcolor_value;let t0;let span;let t1;let t2;let div;let details_style_value;let mounted;let dispose;return {c(){details=element("details");summary=element("summary");goa_icon=element("goa-icon");t0=space();span=element("span");t1=text(/*heading*/ctx[1]);t2=space();div=element("div");div.innerHTML=`<slot></slot>`;this.c=noop;set_custom_element_data(goa_icon,"mt","1");set_custom_element_data(goa_icon,"mr","2");set_custom_element_data(goa_icon,"type","chevron-forward");set_custom_element_data(goa_icon,"fillcolor",goa_icon_fillcolor_value=/*_isMouseOver*/ctx[6]?"var(--goa-color-interactive-hover)":"var(--goa-color-interactive-default)");attr(div,"class","content");details.open=/*_isOpen*/ctx[9];attr(details,"style",details_style_value=calculateMargin(/*mt*/ctx[2],/*mr*/ctx[3],/*mb*/ctx[4],/*ml*/ctx[5]));},m(target,anchor){insert(target,details,anchor);append(details,summary);append(summary,goa_icon);append(summary,t0);append(summary,span);append(span,t1);/*summary_binding*/ctx[10](summary);append(details,t2);append(details,div);/*details_binding*/ctx[11](details);if(!mounted){dispose=listen(details,"toggle",/*toggle_handler*/ctx[12]);mounted=true;}},p(ctx,[dirty]){if(dirty&/*_isMouseOver*/64&&goa_icon_fillcolor_value!==(goa_icon_fillcolor_value=/*_isMouseOver*/ctx[6]?"var(--goa-color-interactive-hover)":"var(--goa-color-interactive-default)")){set_custom_element_data(goa_icon,"fillcolor",goa_icon_fillcolor_value);}if(dirty&/*heading*/2)set_data(t1,/*heading*/ctx[1]);if(dirty&/*_isOpen*/512){details.open=/*_isOpen*/ctx[9];}if(dirty&/*mt, mr, mb, ml*/60&&details_style_value!==(details_style_value=calculateMargin(/*mt*/ctx[2],/*mr*/ctx[3],/*mb*/ctx[4],/*ml*/ctx[5]))){attr(details,"style",details_style_value);}},i:noop,o:noop,d(detaching){if(detaching)detach(details);/*summary_binding*/ctx[10](null);/*details_binding*/ctx[11](null);mounted=false;dispose();}};}function instance$y($$self,$$props,$$invalidate){let _isOpen;let{heading}=$$props;let{mt=null}=$$props;let{mr=null}=$$props;let{mb=null}=$$props;let{ml=null}=$$props;let{open="false"}=$$props;let _isMouseOver=false;let _summaryEl;let _detailsEl;onMount(()=>{validateRequired("Details",{heading});_summaryEl.addEventListener("mouseover",()=>{$$invalidate(6,_isMouseOver=true);});_summaryEl.addEventListener("mouseout",()=>{$$invalidate(6,_isMouseOver=false);});});function summary_binding($$value){binding_callbacks[$$value?'unshift':'push'](()=>{_summaryEl=$$value;$$invalidate(7,_summaryEl);});}function details_binding($$value){binding_callbacks[$$value?'unshift':'push'](()=>{_detailsEl=$$value;$$invalidate(8,_detailsEl);});}const toggle_handler=({target})=>$$invalidate(0,open=`${target.open}`);$$self.$$set=$$props=>{if('heading'in $$props)$$invalidate(1,heading=$$props.heading);if('mt'in $$props)$$invalidate(2,mt=$$props.mt);if('mr'in $$props)$$invalidate(3,mr=$$props.mr);if('mb'in $$props)$$invalidate(4,mb=$$props.mb);if('ml'in $$props)$$invalidate(5,ml=$$props.ml);if('open'in $$props)$$invalidate(0,open=$$props.open);};$$self.$$.update=()=>{if($$self.$$.dirty&/*open*/1){$$invalidate(9,_isOpen=toBoolean(open));}};return [open,heading,mt,mr,mb,ml,_isMouseOver,_summaryEl,_detailsEl,_isOpen,summary_binding,details_binding,toggle_handler];}class Details extends SvelteElement{constructor(options){super();this.shadowRoot.innerHTML=`<style>:host{font-family:var(--goa-font-family-sans)}details{max-width:75ch;position:relative}details ::slotted(*){font:var(--goa-typography-body-m)}summary{padding:0.5rem;margin-bottom:0.5rem;cursor:pointer;list-style:none;display:flex;align-items:flex-start}goa-icon{position:absolute}details[open] goa-icon{transform:translateX(-1px) rotate(90deg);top:0.75rem}details summary::-webkit-details-marker{display:none}summary{border-radius:var(--goa-border-radius-m)}summary:focus,summary:active{outline:3px solid var(--goa-color-interactive-focus);border-radius:var(--goa-border-radius-m);color:var(--goa-color-interactive-hover);background-color:var(--goa-color-greyscale-100)}summary:hover{background-color:var(--goa-color-greyscale-100)}summary span{margin-left:2rem;text-decoration:underline;color:var(--goa-color-interactive-default);padding-bottom:var(--font-valign-fix);line-height:var(--goa-line-height-3)}summary:hover span{color:var(--goa-color-interactive-hover)}.content{border-left:4px solid var(--goa-color-greyscale-200);padding:1rem;margin-left:1.1rem;margin-bottom:var(--goa-space-s)}.content ::slotted(p:last-child){margin-bottom:0 !important}</style>`;init(this,{target:this.shadowRoot,props:attribute_to_object(this.attributes),customElement:true},instance$y,create_fragment$C,safe_not_equal,{heading:1,mt:2,mr:3,mb:4,ml:5,open:0},null);if(options){if(options.target){insert(options.target,this,options.anchor);}if(options.props){this.$set(options.props);flush();}}}static get observedAttributes(){return ["heading","mt","mr","mb","ml","open"];}get heading(){return this.$$.ctx[1];}set heading(heading){this.$$set({heading});flush();}get mt(){return this.$$.ctx[2];}set mt(mt){this.$$set({mt});flush();}get mr(){return this.$$.ctx[3];}set mr(mr){this.$$set({mr});flush();}get mb(){return this.$$.ctx[4];}set mb(mb){this.$$set({mb});flush();}get ml(){return this.$$.ctx[5];}set ml(ml){this.$$set({ml});flush();}get open(){return this.$$.ctx[0];}set open(open){this.$$set({open});flush();}}customElements.define("goa-details",Details);/* libs/web-components/src/components/divider/Divider.svelte generated by Svelte v3.51.0 */function create_fragment$B(ctx){let hr;let hr_style_value;return {c(){hr=element("hr");this.c=noop;attr(hr,"data-testid",/*testid*/ctx[0]);attr(hr,"style",hr_style_value=calculateMargin(/*mt*/ctx[1],/*mr*/ctx[2],/*mb*/ctx[3],/*ml*/ctx[4]));},m(target,anchor){insert(target,hr,anchor);},p(ctx,[dirty]){if(dirty&/*testid*/1){attr(hr,"data-testid",/*testid*/ctx[0]);}if(dirty&/*mt, mr, mb, ml*/30&&hr_style_value!==(hr_style_value=calculateMargin(/*mt*/ctx[1],/*mr*/ctx[2],/*mb*/ctx[3],/*ml*/ctx[4]))){attr(hr,"style",hr_style_value);}},i:noop,o:noop,d(detaching){if(detaching)detach(hr);}};}function instance$x($$self,$$props,$$invalidate){let{testid=""}=$$props;let{mt=null}=$$props;let{mr=null}=$$props;let{mb=null}=$$props;let{ml=null}=$$props;$$self.$$set=$$props=>{if('testid'in $$props)$$invalidate(0,testid=$$props.testid);if('mt'in $$props)$$invalidate(1,mt=$$props.mt);if('mr'in $$props)$$invalidate(2,mr=$$props.mr);if('mb'in $$props)$$invalidate(3,mb=$$props.mb);if('ml'in $$props)$$invalidate(4,ml=$$props.ml);};return [testid,mt,mr,mb,ml];}class Divider extends SvelteElement{constructor(options){super();this.shadowRoot.innerHTML=`<style>hr{padding:0;margin:0;height:1px;background-color:var(--goa-color-greyscale-200);border:none}</style>`;init(this,{target:this.shadowRoot,props:attribute_to_object(this.attributes),customElement:true},instance$x,create_fragment$B,safe_not_equal,{testid:0,mt:1,mr:2,mb:3,ml:4},null);if(options){if(options.target){insert(options.target,this,options.anchor);}if(options.props){this.$set(options.props);flush();}}}static get observedAttributes(){return ["testid","mt","mr","mb","ml"];}get testid(){return this.$$.ctx[0];}set testid(testid){this.$$set({testid});flush();}get mt(){return this.$$.ctx[1];}set mt(mt){this.$$set({mt});flush();}get mr(){return this.$$.ctx[2];}set mr(mr){this.$$set({mr});flush();}get mb(){return this.$$.ctx[3];}set mb(mb){this.$$set({mb});flush();}get ml(){return this.$$.ctx[4];}set ml(ml){this.$$set({ml});flush();}}customElements.define("goa-divider",Divider);/* libs/web-components/src/components/dropdown/Dropdown.svelte generated by Svelte v3.51.0 */function get_each_context_1(ctx,list,i){const child_ctx=ctx.slice();child_ctx[50]=list[i];child_ctx[54]=i;return child_ctx;}function get_each_context$7(ctx,list,i){const child_ctx=ctx.slice();child_ctx[50]=list[i];return child_ctx;}// (270:2) {:else}
 	function create_else_block$7(ctx){let t0;let goa_input;let goa_input_arialabel_value;let goa_input_data_testid_value;let t1;let slot;let t2;let ul;let each_blocks=[];let each_1_lookup=new Map();let ul_style_value;let mounted;let dispose;let if_block=/*_isMenuVisible*/ctx[17]&&create_if_block_1$a(ctx);let each_value_1=/*_options*/ctx[12];const get_key=ctx=>/*index*/ctx[54];for(let i=0;i<each_value_1.length;i+=1){let child_ctx=get_each_context_1(ctx,each_value_1,i);let key=get_key(child_ctx);each_1_lookup.set(key,each_blocks[i]=create_each_block_1(key,child_ctx));}return {c(){if(if_block)if_block.c();t0=space();goa_input=element("goa-input");t1=space();slot=element("slot");t2=space();ul=element("ul");for(let i=0;i<each_blocks.length;i+=1){each_blocks[i].c();}set_custom_element_data(goa_input,"error",/*error*/ctx[7]);set_custom_element_data(goa_input,"disabled",/*disabled*/ctx[6]);set_custom_element_data(goa_input,"leadingicon",/*leadingicon*/ctx[2]);set_custom_element_data(goa_input,"placeholder",/*placeholder*/ctx[4]);set_custom_element_data(goa_input,"aria-controls","menu");set_custom_element_data(goa_input,"aria-expanded",/*_isMenuVisible*/ctx[17]);set_custom_element_data(goa_input,"arialabel",goa_input_arialabel_value=/*arialabel*/ctx[1]||/*name*/ctx[0]);set_custom_element_data(goa_input,"data-testid",goa_input_data_testid_value=`${/*name*/ctx[0]}-dropdown-input`);set_custom_element_data(goa_input,"readonly","");set_custom_element_data(goa_input,"role","combobox");set_custom_element_data(goa_input,"trailingicon","chevron-down");set_custom_element_data(goa_input,"type","text");set_custom_element_data(goa_input,"value",/*_selectedLabel*/ctx[16]);set_custom_element_data(goa_input,"width","100%");set_custom_element_data(goa_input,"name",/*name*/ctx[0]);attr(ul,"id","menu");attr(ul,"role","listbox");attr(ul,"aria-activedescendant",/*_selectedLabel*/ctx[16]);attr(ul,"data-testid","dropdown-menu");attr(ul,"tabindex","0");attr(ul,"class","dropdown-list");attr(ul,"style",ul_style_value=`
         overflow-y: auto;
         max-height: ${/*maxheight*/ctx[3]};
@@ -1086,6 +1086,7 @@
 	function GoADetails(props) {
 	  return jsxRuntime.jsx("goa-details", __assign({
 	    heading: props.heading,
+	    open: props.open,
 	    mt: props.mt,
 	    mr: props.mr,
 	    mb: props.mb,