@abgov/react-components 4.0.0-alpha.141 → 4.0.0-alpha.143

package/react-components.esm.js

@@ -1127,7 +1127,7 @@ function cssVar(name, value) {
 /* libs/web-components/src/components/accordion/Accordion.svelte generated by Svelte v3.51.0 */
 
 
-function create_fragment$P(ctx) {
+function create_fragment$Q(ctx) {
   let div3;
   let details;
   let summary;
@@ -1330,7 +1330,7 @@ function create_fragment$P(ctx) {
   };
 }
 
-function instance$J($$self, $$props, $$invalidate) {
+function instance$K($$self, $$props, $$invalidate) {
   let isOpen;
   const [HeadingSizes, validateHeadingSize] = typeValidator("Accordion heading size", ["small", "medium"]);
   let {
@@ -1408,7 +1408,7 @@ class Accordion extends SvelteElement {
       target: this.shadowRoot,
       props: attribute_to_object(this.attributes),
       customElement: true
-    }, instance$J, create_fragment$P, safe_not_equal, {
+    }, instance$K, create_fragment$Q, safe_not_equal, {
       open: 10,
       heading: 0,
       secondarytext: 1,
@@ -1664,7 +1664,7 @@ function create_if_block$o(ctx) {
   };
 }
 
-function create_fragment$O(ctx) {
+function create_fragment$P(ctx) {
   let div2;
   let div1;
   let t;
@@ -1748,7 +1748,7 @@ function create_fragment$O(ctx) {
   };
 }
 
-function instance$I($$self, $$props, $$invalidate) {
+function instance$J($$self, $$props, $$invalidate) {
   let {
     heading = ""
   } = $$props;
@@ -1780,7 +1780,7 @@ class AppHeader extends SvelteElement {
       target: this.shadowRoot,
       props: attribute_to_object(this.attributes),
       customElement: true
-    }, instance$I, create_fragment$O, safe_not_equal, {
+    }, instance$J, create_fragment$P, safe_not_equal, {
       heading: 0,
       url: 1,
       testid: 2,
@@ -1940,7 +1940,7 @@ function create_if_block$n(ctx) {
   };
 }
 
-function create_fragment$N(ctx) {
+function create_fragment$O(ctx) {
   let div;
   let t;
   let div_style_value;
@@ -2076,7 +2076,7 @@ function create_fragment$N(ctx) {
   };
 }
 
-function instance$H($$self, $$props, $$invalidate) {
+function instance$I($$self, $$props, $$invalidate) {
   let showIcon;
   let iconType;
   const [Types, validateType] = typeValidator("Badge type", ["success", "important", "information", "emergency", "dark", "midtone", "light"], true);
@@ -2156,7 +2156,7 @@ class Badge extends SvelteElement {
       target: this.shadowRoot,
       props: attribute_to_object(this.attributes),
       customElement: true
-    }, instance$H, create_fragment$N, safe_not_equal, {
+    }, instance$I, create_fragment$O, safe_not_equal, {
       type: 0,
       testid: 1,
       content: 2,
@@ -2276,7 +2276,7 @@ class Badge extends SvelteElement {
 customElements.define("goa-badge", Badge);
 /* libs/web-components/src/components/block/Block.svelte generated by Svelte v3.51.0 */
 
-function create_fragment$M(ctx) {
+function create_fragment$N(ctx) {
   let div;
   let slot;
   let div_style_value;
@@ -2350,7 +2350,7 @@ function create_fragment$M(ctx) {
   };
 }
 
-function instance$G($$self, $$props, $$invalidate) {
+function instance$H($$self, $$props, $$invalidate) {
   let {
     gap = "m"
   } = $$props;
@@ -2394,7 +2394,7 @@ class Block extends SvelteElement {
       target: this.shadowRoot,
       props: attribute_to_object(this.attributes),
       customElement: true
-    }, instance$G, create_fragment$M, safe_not_equal, {
+    }, instance$H, create_fragment$N, safe_not_equal, {
       gap: 0,
       direction: 1,
       alignment: 2,
@@ -2700,7 +2700,7 @@ function create_if_block_1$d(ctx) {
   };
 }
 
-function create_fragment$L(ctx) {
+function create_fragment$M(ctx) {
   let button;
   let button_class_value;
   let button_style_value;
@@ -2854,7 +2854,7 @@ function create_fragment$L(ctx) {
   };
 }
 
-function instance$F($$self, $$props, $$invalidate) {
+function instance$G($$self, $$props, $$invalidate) {
   let isDisabled;
   let isButtonDark;
   const [Types, validateType] = typeValidator("Button type", ["primary", "submit", "secondary", "tertiary", "start"], true);
@@ -2949,7 +2949,7 @@ class Button extends SvelteElement {
       target: this.shadowRoot,
       props: attribute_to_object(this.attributes),
       customElement: true
-    }, instance$F, create_fragment$L, safe_not_equal, {
+    }, instance$G, create_fragment$M, safe_not_equal, {
       type: 0,
       size: 1,
       variant: 2,
@@ -3105,7 +3105,7 @@ class Button extends SvelteElement {
 customElements.define("goa-button", Button);
 /* libs/web-components/src/components/button-group/ButtonGroup.svelte generated by Svelte v3.51.0 */
 
-function create_fragment$K(ctx) {
+function create_fragment$L(ctx) {
   let div;
   let slot;
   let div_style_value;
@@ -3175,7 +3175,7 @@ function create_fragment$K(ctx) {
   };
 }
 
-function instance$E($$self, $$props, $$invalidate) {
+function instance$F($$self, $$props, $$invalidate) {
   let _alignment;
 
   let {
@@ -3239,7 +3239,7 @@ class ButtonGroup extends SvelteElement {
       target: this.shadowRoot,
       props: attribute_to_object(this.attributes),
       customElement: true
-    }, instance$E, create_fragment$K, safe_not_equal, {
+    }, instance$F, create_fragment$L, safe_not_equal, {
       alignment: 7,
       gap: 0,
       testid: 1,
@@ -3378,7 +3378,7 @@ function create_if_block$l(ctx) {
   };
 }
 
-function create_fragment$J(ctx) {
+function create_fragment$K(ctx) {
   let div;
   let span0;
   let goa_icon;
@@ -3513,7 +3513,7 @@ function create_fragment$J(ctx) {
   };
 }
 
-function instance$D($$self, $$props, $$invalidate) {
+function instance$E($$self, $$props, $$invalidate) {
   let iconType;
   const [Types, validateType] = typeValidator("Callout type", ["emergency", "important", "information", "event", "success"], true);
   let {
@@ -3570,7 +3570,7 @@ class Callout extends SvelteElement {
       target: this.shadowRoot,
       props: attribute_to_object(this.attributes),
       customElement: true
-    }, instance$D, create_fragment$J, safe_not_equal, {
+    }, instance$E, create_fragment$K, safe_not_equal, {
       mt: 0,
       mr: 1,
       mb: 2,
@@ -3678,7 +3678,7 @@ class Callout extends SvelteElement {
 customElements.define("goa-callout", Callout);
 /* libs/web-components/src/components/card-actions/CardActions.svelte generated by Svelte v3.51.0 */
 
-function create_fragment$I(ctx) {
+function create_fragment$J(ctx) {
   let goa_card_content;
   return {
     c() {
@@ -3709,7 +3709,7 @@ class CardActions extends SvelteElement {
       target: this.shadowRoot,
       props: attribute_to_object(this.attributes),
       customElement: true
-    }, null, create_fragment$I, safe_not_equal, {}, null);
+    }, null, create_fragment$J, safe_not_equal, {}, null);
 
     if (options) {
       if (options.target) {
@@ -3723,7 +3723,7 @@ class CardActions extends SvelteElement {
 customElements.define("goa-card-actions", CardActions);
 /* libs/web-components/src/components/card/Card.svelte generated by Svelte v3.51.0 */
 
-function create_fragment$H(ctx) {
+function create_fragment$I(ctx) {
   let div;
   let slot;
   let div_style_value;
@@ -3802,7 +3802,7 @@ function create_fragment$H(ctx) {
   };
 }
 
-function instance$C($$self, $$props, $$invalidate) {
+function instance$D($$self, $$props, $$invalidate) {
   let {
     elevation = 0
   } = $$props;
@@ -3850,7 +3850,7 @@ class Card extends SvelteElement {
       target: this.shadowRoot,
       props: attribute_to_object(this.attributes),
       customElement: true
-    }, instance$C, create_fragment$H, safe_not_equal, {
+    }, instance$D, create_fragment$I, safe_not_equal, {
       elevation: 0,
       width: 1,
       height: 2,
@@ -3970,7 +3970,7 @@ class Card extends SvelteElement {
 customElements.define("goa-card", Card);
 /* libs/web-components/src/components/card-content/CardContent.svelte generated by Svelte v3.51.0 */
 
-function create_fragment$G(ctx) {
+function create_fragment$H(ctx) {
   let div;
   return {
     c() {
@@ -4003,7 +4003,7 @@ class CardContent extends SvelteElement {
       target: this.shadowRoot,
       props: attribute_to_object(this.attributes),
       customElement: true
-    }, null, create_fragment$G, safe_not_equal, {}, null);
+    }, null, create_fragment$H, safe_not_equal, {}, null);
 
     if (options) {
       if (options.target) {
@@ -4017,7 +4017,7 @@ class CardContent extends SvelteElement {
 customElements.define("goa-card-content", CardContent);
 /* libs/web-components/src/components/card-group/CardGroup.svelte generated by Svelte v3.51.0 */
 
-function create_fragment$F(ctx) {
+function create_fragment$G(ctx) {
   let div;
   return {
     c() {
@@ -4050,7 +4050,7 @@ class CardGroup extends SvelteElement {
       target: this.shadowRoot,
       props: attribute_to_object(this.attributes),
       customElement: true
-    }, null, create_fragment$F, safe_not_equal, {}, null);
+    }, null, create_fragment$G, safe_not_equal, {}, null);
 
     if (options) {
       if (options.target) {
@@ -4064,7 +4064,7 @@ class CardGroup extends SvelteElement {
 customElements.define("goa-card-group", CardGroup);
 /* libs/web-components/src/components/card-image/CardImage.svelte generated by Svelte v3.51.0 */
 
-function create_fragment$E(ctx) {
+function create_fragment$F(ctx) {
   let div;
   return {
     c() {
@@ -4112,7 +4112,7 @@ function create_fragment$E(ctx) {
   };
 }
 
-function instance$B($$self, $$props, $$invalidate) {
+function instance$C($$self, $$props, $$invalidate) {
   let {
     src
   } = $$props;
@@ -4136,7 +4136,7 @@ class CardImage extends SvelteElement {
       target: this.shadowRoot,
       props: attribute_to_object(this.attributes),
       customElement: true
-    }, instance$B, create_fragment$E, safe_not_equal, {
+    }, instance$C, create_fragment$F, safe_not_equal, {
       src: 0,
       height: 1
     }, null);
@@ -4238,7 +4238,7 @@ function create_if_block$k(ctx) {
   };
 }
 
-function create_fragment$D(ctx) {
+function create_fragment$E(ctx) {
   let label;
   let div0;
   let input;
@@ -4487,7 +4487,7 @@ function create_fragment$D(ctx) {
   };
 }
 
-function instance$A($$self, $$props, $$invalidate) {
+function instance$B($$self, $$props, $$invalidate) {
   let isDisabled;
   let isError;
   let isChecked;
@@ -4602,7 +4602,7 @@ class Checkbox extends SvelteElement {
       target: this.shadowRoot,
       props: attribute_to_object(this.attributes),
       customElement: true
-    }, instance$A, create_fragment$D, safe_not_equal, {
+    }, instance$B, create_fragment$E, safe_not_equal, {
       name: 0,
       checked: 14,
       text: 1,
@@ -4860,7 +4860,7 @@ function create_if_block$j(ctx) {
   };
 }
 
-function create_fragment$C(ctx) {
+function create_fragment$D(ctx) {
   let div1;
   let t0;
   let div0;
@@ -5042,7 +5042,7 @@ function create_fragment$C(ctx) {
   };
 }
 
-function instance$z($$self, $$props, $$invalidate) {
+function instance$A($$self, $$props, $$invalidate) {
   let {
     mt = null
   } = $$props;
@@ -5143,7 +5143,7 @@ class Chip extends SvelteElement {
       target: this.shadowRoot,
       props: attribute_to_object(this.attributes),
       customElement: true
-    }, instance$z, create_fragment$C, safe_not_equal, {
+    }, instance$A, create_fragment$D, safe_not_equal, {
       mt: 0,
       mr: 1,
       mb: 2,
@@ -5768,7 +5768,7 @@ function create_if_block_2$8(ctx) {
   };
 }
 
-function create_fragment$B(ctx) {
+function create_fragment$C(ctx) {
   let if_block_anchor;
   let current;
   let if_block =
@@ -5833,7 +5833,7 @@ function create_fragment$B(ctx) {
   };
 }
 
-function instance$y($$self, $$props, $$invalidate) {
+function instance$z($$self, $$props, $$invalidate) {
   let isVisible;
   const [Variants, validateVariant] = typeValidator("Circular progress variant", ["fullscreen", "inline"]);
   const [Sizes, validateSize] = typeValidator("Button size", ["small", "large"]);
@@ -5890,7 +5890,7 @@ class CircularProgress extends SvelteElement {
       target: this.shadowRoot,
       props: attribute_to_object(this.attributes),
       customElement: true
-    }, instance$y, create_fragment$B, safe_not_equal, {
+    }, instance$z, create_fragment$C, safe_not_equal, {
       variant: 6,
       size: 7,
       message: 0,
@@ -5974,7 +5974,7 @@ class CircularProgress extends SvelteElement {
 customElements.define("goa-circular-progress", CircularProgress);
 /* libs/web-components/src/components/container/Container.svelte generated by Svelte v3.51.0 */
 
-function create_fragment$A(ctx) {
+function create_fragment$B(ctx) {
   let div3;
   let header;
   let div0;
@@ -6099,7 +6099,7 @@ function create_fragment$A(ctx) {
   };
 }
 
-function instance$x($$self, $$props, $$invalidate) {
+function instance$y($$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"]);
@@ -6155,7 +6155,7 @@ class Container extends SvelteElement {
       target: this.shadowRoot,
       props: attribute_to_object(this.attributes),
       customElement: true
-    }, instance$x, create_fragment$A, safe_not_equal, {
+    }, instance$y, create_fragment$B, safe_not_equal, {
       type: 0,
       accent: 1,
       padding: 2,
@@ -6275,7 +6275,7 @@ class Container extends SvelteElement {
 customElements.define("goa-container", Container);
 /* libs/web-components/src/components/details/Details.svelte generated by Svelte v3.51.0 */
 
-function create_fragment$z(ctx) {
+function create_fragment$A(ctx) {
   let details;
   let summary;
   let goa_icon;
@@ -6375,7 +6375,7 @@ function create_fragment$z(ctx) {
   };
 }
 
-function instance$w($$self, $$props, $$invalidate) {
+function instance$x($$self, $$props, $$invalidate) {
   let {
     heading
   } = $$props;
@@ -6435,7 +6435,7 @@ class Details extends SvelteElement {
       target: this.shadowRoot,
       props: attribute_to_object(this.attributes),
       customElement: true
-    }, instance$w, create_fragment$z, safe_not_equal, {
+    }, instance$x, create_fragment$A, safe_not_equal, {
       heading: 0,
       mt: 1,
       mr: 2,
@@ -6519,7 +6519,7 @@ class Details extends SvelteElement {
 customElements.define("goa-details", Details);
 /* libs/web-components/src/components/divider/Divider.svelte generated by Svelte v3.51.0 */
 
-function create_fragment$y(ctx) {
+function create_fragment$z(ctx) {
   let hr;
   let hr_style_value;
   return {
@@ -6578,7 +6578,7 @@ function create_fragment$y(ctx) {
   };
 }
 
-function instance$v($$self, $$props, $$invalidate) {
+function instance$w($$self, $$props, $$invalidate) {
   let {
     testid = ""
   } = $$props;
@@ -6614,7 +6614,7 @@ class Divider extends SvelteElement {
       target: this.shadowRoot,
       props: attribute_to_object(this.attributes),
       customElement: true
-    }, instance$v, create_fragment$y, safe_not_equal, {
+    }, instance$w, create_fragment$z, safe_not_equal, {
       testid: 0,
       mt: 1,
       mr: 2,
@@ -7429,7 +7429,7 @@ function create_each_block$6(ctx) {
   };
 }
 
-function create_fragment$x(ctx) {
+function create_fragment$y(ctx) {
   let div;
   let div_data_testid_value;
   let div_style_value;
@@ -7560,7 +7560,7 @@ function parseValues(selectedValue) {
   return rawValues.map(val => `${val}`);
 }
 
-function instance$u($$self, $$props, $$invalidate) {
+function instance$v($$self, $$props, $$invalidate) {
   let _disabled;
 
   let _error;
@@ -7957,7 +7957,7 @@ class Dropdown extends SvelteElement {
       target: this.shadowRoot,
       props: attribute_to_object(this.attributes),
       customElement: true
-    }, instance$u, create_fragment$x, safe_not_equal, {
+    }, instance$v, create_fragment$y, safe_not_equal, {
       name: 0,
       arialabel: 1,
       value: 29,
@@ -8161,7 +8161,7 @@ class Dropdown extends SvelteElement {
 customElements.define("goa-dropdown", Dropdown);
 /* libs/web-components/src/components/dropdown/DropdownItem.svelte generated by Svelte v3.51.0 */
 
-function create_fragment$w(ctx) {
+function create_fragment$x(ctx) {
   return {
     c() {
       this.c = noop;
@@ -8182,7 +8182,7 @@ class DropdownItem extends SvelteElement {
       target: this.shadowRoot,
       props: attribute_to_object(this.attributes),
       customElement: true
-    }, null, create_fragment$w, safe_not_equal, {}, null);
+    }, null, create_fragment$x, safe_not_equal, {}, null);
 
     if (options) {
       if (options.target) {
@@ -8196,7 +8196,7 @@ class DropdownItem extends SvelteElement {
 customElements.define("goa-dropdown-item", DropdownItem);
 /* libs/web-components/src/components/focus-trap/FocusTrap.svelte generated by Svelte v3.51.0 */
 
-function create_fragment$v(ctx) {
+function create_fragment$w(ctx) {
   let div;
   return {
     c() {
@@ -8256,7 +8256,7 @@ function isFocusable(element) {
   }
 }
 
-function instance$t($$self, $$props, $$invalidate) {
+function instance$u($$self, $$props, $$invalidate) {
   let isActive;
   let {
     active
@@ -8425,7 +8425,7 @@ class FocusTrap extends SvelteElement {
       target: this.shadowRoot,
       props: attribute_to_object(this.attributes),
       customElement: true
-    }, instance$t, create_fragment$v, safe_not_equal, {
+    }, instance$u, create_fragment$w, safe_not_equal, {
       active: 1
     }, null);
 
@@ -8480,7 +8480,7 @@ function create_if_block$g(ctx) {
   };
 }
 
-function create_fragment$u(ctx) {
+function create_fragment$v(ctx) {
   let div5;
   let div4;
   let div0;
@@ -8623,7 +8623,7 @@ function create_fragment$u(ctx) {
   };
 }
 
-function instance$s($$self, $$props, $$invalidate) {
+function instance$t($$self, $$props, $$invalidate) {
   let {
     maxcontentwidth = ""
   } = $$props;
@@ -8661,7 +8661,7 @@ class Footer extends SvelteElement {
       target: this.shadowRoot,
       props: attribute_to_object(this.attributes),
       customElement: true
-    }, instance$s, create_fragment$u, safe_not_equal, {
+    }, instance$t, create_fragment$v, safe_not_equal, {
       maxcontentwidth: 0
     }, null);
 
@@ -8751,7 +8751,7 @@ function create_each_block$5(ctx) {
   };
 }
 
-function create_fragment$t(ctx) {
+function create_fragment$u(ctx) {
   let section;
   let div;
   let t;
@@ -8839,7 +8839,7 @@ function create_fragment$t(ctx) {
   };
 }
 
-function instance$r($$self, $$props, $$invalidate) {
+function instance$s($$self, $$props, $$invalidate) {
   let rootEl;
   let children = [];
   onMount(async () => {
@@ -8874,7 +8874,7 @@ class FooterMetaSection extends SvelteElement {
       target: this.shadowRoot,
       props: attribute_to_object(this.attributes),
       customElement: true
-    }, instance$r, create_fragment$t, safe_not_equal, {}, null);
+    }, instance$s, create_fragment$u, safe_not_equal, {}, null);
 
     if (options) {
       if (options.target) {
@@ -8984,7 +8984,7 @@ function create_each_block$4(ctx) {
   };
 }
 
-function create_fragment$s(ctx) {
+function create_fragment$t(ctx) {
   let section;
   let t0;
   let div;
@@ -9131,7 +9131,7 @@ function create_fragment$s(ctx) {
   };
 }
 
-function instance$q($$self, $$props, $$invalidate) {
+function instance$r($$self, $$props, $$invalidate) {
   let {
     heading = ""
   } = $$props;
@@ -9182,7 +9182,7 @@ class FooterNavSection extends SvelteElement {
       target: this.shadowRoot,
       props: attribute_to_object(this.attributes),
       customElement: true
-    }, instance$q, create_fragment$s, safe_not_equal, {
+    }, instance$r, create_fragment$t, safe_not_equal, {
       heading: 0,
       maxcolumncount: 1
     }, null);
@@ -9412,7 +9412,7 @@ function create_if_block$e(ctx) {
   };
 }
 
-function create_fragment$r(ctx) {
+function create_fragment$s(ctx) {
   let div1;
   let t0;
   let div0;
@@ -9549,7 +9549,7 @@ function create_fragment$r(ctx) {
   };
 }
 
-function instance$p($$self, $$props, $$invalidate) {
+function instance$q($$self, $$props, $$invalidate) {
   const [REQUIREMENT_TYPES, validateRequirementType] = typeValidator("Requirement type", ["optional", "required"], false);
   let {
     testid = ""
@@ -9605,7 +9605,7 @@ class FormItem extends SvelteElement {
       target: this.shadowRoot,
       props: attribute_to_object(this.attributes),
       customElement: true
-    }, instance$p, create_fragment$r, safe_not_equal, {
+    }, instance$q, create_fragment$s, safe_not_equal, {
       testid: 0,
       mt: 1,
       mr: 2,
@@ -9737,7 +9737,7 @@ class FormItem extends SvelteElement {
 customElements.define("goa-form-item", FormItem);
 /* libs/web-components/src/components/grid/Grid.svelte generated by Svelte v3.51.0 */
 
-function create_fragment$q(ctx) {
+function create_fragment$r(ctx) {
   let div;
   let slot;
   let div_style_value;
@@ -9805,7 +9805,7 @@ function create_fragment$q(ctx) {
   };
 }
 
-function instance$o($$self, $$props, $$invalidate) {
+function instance$p($$self, $$props, $$invalidate) {
   let {
     gap = "m"
   } = $$props;
@@ -9850,7 +9850,7 @@ class Grid extends SvelteElement {
       target: this.shadowRoot,
       props: attribute_to_object(this.attributes),
       customElement: true
-    }, instance$o, create_fragment$q, safe_not_equal, {
+    }, instance$p, create_fragment$r, safe_not_equal, {
       gap: 0,
       minchildwidth: 1,
       mt: 2,
@@ -9946,7 +9946,7 @@ class Grid extends SvelteElement {
 customElements.define("goa-grid", Grid);
 /* libs/web-components/src/components/hero-banner/HeroBanner.svelte generated by Svelte v3.51.0 */
 
-function create_fragment$p(ctx) {
+function create_fragment$q(ctx) {
   let div1;
   let goa_page_block;
   let h1;
@@ -10031,7 +10031,7 @@ function create_fragment$p(ctx) {
   };
 }
 
-function instance$n($$self, $$props, $$invalidate) {
+function instance$o($$self, $$props, $$invalidate) {
   let {
     heading
   } = $$props;
@@ -10059,7 +10059,7 @@ class HeroBanner extends SvelteElement {
       target: this.shadowRoot,
       props: attribute_to_object(this.attributes),
       customElement: true
-    }, instance$n, create_fragment$p, safe_not_equal, {
+    }, instance$o, create_fragment$q, safe_not_equal, {
       heading: 0,
       backgroundurl: 1,
       minheight: 2
@@ -10119,7 +10119,7 @@ class HeroBanner extends SvelteElement {
 customElements.define("goa-hero-banner", HeroBanner);
 /* libs/web-components/src/components/icon-button/IconButton.svelte generated by Svelte v3.51.0 */
 
-function create_fragment$o(ctx) {
+function create_fragment$p(ctx) {
   let button;
   let goa_icon;
   let button_style_value;
@@ -10291,7 +10291,7 @@ function handleClick(e) {
   }));
 }
 
-function instance$m($$self, $$props, $$invalidate) {
+function instance$n($$self, $$props, $$invalidate) {
   let css;
   let isDisabled;
   let isInverted;
@@ -10396,7 +10396,7 @@ class IconButton extends SvelteElement {
       target: this.shadowRoot,
       props: attribute_to_object(this.attributes),
       customElement: true
-    }, instance$m, create_fragment$o, safe_not_equal, {
+    }, instance$n, create_fragment$p, safe_not_equal, {
       icon: 0,
       size: 1,
       theme: 2,
@@ -10701,7 +10701,7 @@ function create_if_block_1$7(ctx) {
   };
 }
 
-function create_fragment$n(ctx) {
+function create_fragment$o(ctx) {
   let div;
   let div_class_value;
   let div_style_value;
@@ -10837,7 +10837,7 @@ function create_fragment$n(ctx) {
   };
 }
 
-function instance$l($$self, $$props, $$invalidate) {
+function instance$m($$self, $$props, $$invalidate) {
   let isInverted;
   let {
     mt = null
@@ -10930,7 +10930,7 @@ class Icon extends SvelteElement {
       target: this.shadowRoot,
       props: attribute_to_object(this.attributes),
       customElement: true
-    }, instance$l, create_fragment$n, safe_not_equal, {
+    }, instance$m, create_fragment$o, safe_not_equal, {
       mt: 0,
       mr: 1,
       mb: 2,
@@ -11299,7 +11299,7 @@ function create_if_block$c(ctx) {
   };
 }
 
-function create_fragment$m(ctx) {
+function create_fragment$n(ctx) {
   let div3;
   let div2;
   let t0;
@@ -11780,7 +11780,7 @@ function doClick() {
   }));
 }
 
-function instance$k($$self, $$props, $$invalidate) {
+function instance$l($$self, $$props, $$invalidate) {
   let handlesTrailingIconClick;
   let isFocused;
   let isReadonly;
@@ -12024,7 +12024,7 @@ class Input extends SvelteElement {
       target: this.shadowRoot,
       props: attribute_to_object(this.attributes),
       customElement: true
-    }, instance$k, create_fragment$m, safe_not_equal, {
+    }, instance$l, create_fragment$n, safe_not_equal, {
       type: 1,
       name: 2,
       value: 0,
@@ -12361,35 +12361,25 @@ customElements.define("goa-input", Input);
 /* libs/web-components/src/components/microsite-header/MicrositeHeader.svelte generated by Svelte v3.51.0 */
 
 function create_if_block_3$5(ctx) {
-  let div0;
-  let t0;
-  let div1;
+  let div;
   return {
     c() {
-      div0 = element("div");
-      div0.innerHTML = `<svg width="26" height="26" viewBox="0 0 26 26" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M13 26C20.1797 26 26 20.1797 26 13C26 5.8203 20.1797 0 13 0C5.8203 0 0 5.8203 0 13C0 20.1797 5.8203 26 13 26Z" fill="#00AAD2"></path><path d="M16.9764 17.7174C15.942 17.3358 14.9325 16.8896 13.9539 16.3817C14.8446 16.0551 15.7131 15.6708 16.5539 15.2312C16.6398 16.0688 16.7831 16.8995 16.9829 17.7174H16.9764ZM22.5339 7.42143C22.1016 7.36618 22.3259 7.56931 22.2089 8.13968C21.863 9.3075 21.2806 10.3917 20.4978 11.3248C19.7151 12.258 18.7487 13.0201 17.6589 13.5639C17.3972 10.9368 17.5336 8.28529 18.0635 5.69893C18.5104 4.07393 19.0385 4.3778 18.3885 4.03818C17.6946 3.68068 16.9471 4.15356 16.3443 5.35931C14.4174 9.81946 11.7695 13.932 8.50689 17.5322C7.96404 18.2422 7.16875 18.7161 6.28592 18.8556C5.40309 18.9951 4.50044 18.7894 3.76514 18.2813C3.43039 17.9986 3.30689 18.4357 3.72289 18.8826C4.47366 19.5882 5.47211 19.9699 6.50216 19.945C7.53222 19.92 8.51102 19.4905 9.22677 18.7493C12.0405 15.3939 14.429 11.7038 16.3378 7.76268C16.1901 9.91268 16.2243 12.0713 16.4401 14.2156C15.4158 14.7181 14.3475 15.1256 13.2486 15.4327C12.6181 15.5952 12.2281 15.8552 12.2168 16.1461C12.2054 16.4711 12.6279 16.7359 13.2405 17.0252C14.3293 17.5419 17.5191 19.0499 18.3056 19.5066C18.9784 19.8966 19.3066 19.5927 19.5065 19.1702C19.7665 18.6209 19.0531 18.3041 18.369 18.0961C18.0632 16.9353 17.8555 15.7508 17.7483 14.5552C19.4404 13.5939 20.8636 12.2226 21.8871 10.5674C22.1817 9.98406 22.4001 9.36529 22.5371 8.7263C22.6338 8.3321 22.6602 7.92393 22.6151 7.52056C22.6151 7.52056 22.6038 7.43281 22.5371 7.42468" fill="white"></path></svg>`;
-      t0 = space();
-      div1 = element("div");
-      div1.innerHTML = `An official site of the <a href="https://www.alberta.ca/index.aspx">Alberta Government</a>`;
-      attr(div0, "class", "service-type service-type--live");
-      attr(div1, "data-testid", "type");
-      attr(div1, "class", "site-text");
+      div = element("div");
+      div.innerHTML = `An official site of the <a href="https://www.alberta.ca/index.aspx">Alberta Government</a>`;
+      attr(div, "data-testid", "type");
+      attr(div, "class", "site-text");
     },
 
     m(target, anchor) {
-      insert(target, div0, anchor);
-      insert(target, t0, anchor);
-      insert(target, div1, anchor);
+      insert(target, div, anchor);
     },
 
     d(detaching) {
-      if (detaching) detach(div0);
-      if (detaching) detach(t0);
-      if (detaching) detach(div1);
+      if (detaching) detach(div);
     }
 
   };
-} // (41:2) {#if ["alpha", "beta"].includes(type)}
+} // (29:2) {#if ["alpha", "beta"].includes(type)}
 
 
 function create_if_block_1$5(ctx) {
@@ -12477,7 +12467,7 @@ function create_if_block_1$5(ctx) {
     }
 
   };
-} // (50:6) {#if feedbackurl}
+} // (38:6) {#if feedbackurl}
 
 
 function create_if_block_2$5(ctx) {
@@ -12519,7 +12509,7 @@ function create_if_block_2$5(ctx) {
     }
 
   };
-} // (56:2) {#if version}
+} // (44:2) {#if version}
 
 
 function create_if_block$b(ctx) {
@@ -12555,7 +12545,7 @@ function create_if_block$b(ctx) {
   };
 }
 
-function create_fragment$l(ctx) {
+function create_fragment$m(ctx) {
   let header;
   let t0;
   let show_if = ["alpha", "beta"].includes(
@@ -12664,7 +12654,7 @@ function capitalize(val) {
   return val[0].toUpperCase() + val.slice(1);
 }
 
-function instance$j($$self, $$props, $$invalidate) {
+function instance$k($$self, $$props, $$invalidate) {
   const [Types, validateType] = typeValidator("Microsite header type", ["live", "alpha", "beta"], true);
   let {
     type
@@ -12691,12 +12681,12 @@ function instance$j($$self, $$props, $$invalidate) {
 class MicrositeHeader extends SvelteElement {
   constructor(options) {
     super();
-    this.shadowRoot.innerHTML = `<style>:host{box-sizing:border-box;font-family:var(--goa-font-family-sans)}a{color:var(--goa-color-interactive-default);cursor:pointer}a:hover{color:var(--goa-color-interactive-hover)}a:focus{outline-width:thin;outline-style:solid;outline-color:var(--goa-color-interactive-hover);outline-offset:0px}.goa-official-site-header{display:flex;font-size:var(--goa-font-size-2);background-color:var(--goa-color-greyscale-100);align-items:center;justify-content:space-between;padding:0.25rem 1.5rem}@media(max-width: 640px){.goa-official-site-header{padding:0.5rem 1rem;align-items:start}}.spacer{flex:1 1 auto}.version{color:var(--goa-color-text-secondary);padding-left:1rem;line-height:1.25rem}.service-type{font-weight:bold;padding:0.125rem 0.25rem;display:flex;margin-right:1rem;line-height:initial}.service-type--alpha{background-color:var(--goa-color-warning-default);color:var(--goa-color-text-default)}.service-type--beta{background-color:var(--goa-color-brand-default);color:var(--goa-color-text-light)}.service-type--live{padding:0}.site-text{color:var(--goa-color-text-default);line-height:1.25rem}</style>`;
+    this.shadowRoot.innerHTML = `<style>:host{box-sizing:border-box;font-family:var(--goa-font-family-sans)}a{color:var(--goa-color-interactive-default);cursor:pointer}a:hover{color:var(--goa-color-interactive-hover)}a:focus{outline-width:thin;outline-style:solid;outline-color:var(--goa-color-interactive-hover);outline-offset:0px}.goa-official-site-header{display:flex;font-size:var(--goa-font-size-2);background-color:var(--goa-color-greyscale-100);align-items:center;justify-content:space-between;padding:0.25rem 1.5rem}@media(max-width: 640px){.goa-official-site-header{padding:0.5rem 1rem;align-items:start}}.spacer{flex:1 1 auto}.version{color:var(--goa-color-text-secondary);padding-left:1rem;line-height:1.25rem}.service-type{font-weight:bold;padding:0.125rem 0.25rem;display:flex;margin-right:1rem;line-height:initial}.service-type--alpha{background-color:var(--goa-color-warning-default);color:var(--goa-color-text-default)}.service-type--beta{background-color:var(--goa-color-brand-default);color:var(--goa-color-text-light)}.site-text{color:var(--goa-color-text-default);line-height:1.25rem}</style>`;
     init(this, {
       target: this.shadowRoot,
       props: attribute_to_object(this.attributes),
       customElement: true
-    }, instance$j, create_fragment$l, safe_not_equal, {
+    }, instance$k, create_fragment$m, safe_not_equal, {
       type: 0,
       version: 1,
       feedbackurl: 2
@@ -13185,7 +13175,7 @@ function create_if_block_1$4(ctx) {
   };
 }
 
-function create_fragment$k(ctx) {
+function create_fragment$l(ctx) {
   let if_block_anchor;
   let current;
   let if_block =
@@ -13250,7 +13240,7 @@ function create_fragment$k(ctx) {
   };
 }
 
-function instance$i($$self, $$props, $$invalidate) {
+function instance$j($$self, $$props, $$invalidate) {
   let _isClosable;
 
   let _transitionTime;
@@ -13453,7 +13443,7 @@ class Modal extends SvelteElement {
       target: this.shadowRoot,
       props: attribute_to_object(this.attributes),
       customElement: true
-    }, instance$i, create_fragment$k, safe_not_equal, {
+    }, instance$j, create_fragment$l, safe_not_equal, {
       heading: 0,
       closable: 14,
       open: 1,
@@ -13673,7 +13663,7 @@ function create_if_block$9(ctx) {
   };
 }
 
-function create_fragment$j(ctx) {
+function create_fragment$k(ctx) {
   let if_block_anchor;
   let current;
   let if_block =
@@ -13738,7 +13728,7 @@ function create_fragment$j(ctx) {
   };
 }
 
-function instance$h($$self, $$props, $$invalidate) {
+function instance$i($$self, $$props, $$invalidate) {
   let iconType;
   const [Types, validateType] = typeValidator("Notification type", ["emergency", "important", "information", "event"], true);
   let {
@@ -13780,7 +13770,7 @@ class Notification extends SvelteElement {
       target: this.shadowRoot,
       props: attribute_to_object(this.attributes),
       customElement: true
-    }, instance$h, create_fragment$j, safe_not_equal, {
+    }, instance$i, create_fragment$k, safe_not_equal, {
       type: 0
     }, null);
 
@@ -13822,7 +13812,7 @@ function isValidDimension(value) {
 /* libs/web-components/src/components/page-block/PageBlock.svelte generated by Svelte v3.51.0 */
 
 
-function create_fragment$i(ctx) {
+function create_fragment$j(ctx) {
   let div;
   let slot;
   let div_style_value;
@@ -13862,7 +13852,7 @@ function create_fragment$i(ctx) {
   };
 }
 
-function instance$g($$self, $$props, $$invalidate) {
+function instance$h($$self, $$props, $$invalidate) {
   const Sizes = {
     "full": "100%"
   };
@@ -13903,7 +13893,7 @@ class PageBlock extends SvelteElement {
       target: this.shadowRoot,
       props: attribute_to_object(this.attributes),
       customElement: true
-    }, instance$g, create_fragment$i, safe_not_equal, {
+    }, instance$h, create_fragment$j, safe_not_equal, {
       width: 1,
       _width: 0
     }, null);
@@ -14121,7 +14111,7 @@ function create_each_block$3(ctx) {
   };
 }
 
-function create_fragment$h(ctx) {
+function create_fragment$i(ctx) {
   let goa_block1;
   let div;
   let t0;
@@ -14284,7 +14274,7 @@ function create_fragment$h(ctx) {
   };
 }
 
-function instance$f($$self, $$props, $$invalidate) {
+function instance$g($$self, $$props, $$invalidate) {
   let _pageCount;
 
   const [Variants, validateVariant] = typeValidator("Pagination variant", ["all", "links-only"]);
@@ -14403,7 +14393,7 @@ class Pagination extends SvelteElement {
       target: this.shadowRoot,
       props: attribute_to_object(this.attributes),
       customElement: true
-    }, instance$f, create_fragment$h, safe_not_equal, {
+    }, instance$g, create_fragment$i, safe_not_equal, {
       pagenumber: 0,
       itemcount: 10,
       perpagecount: 11,
@@ -14607,7 +14597,7 @@ function create_if_block$7(ctx) {
   };
 }
 
-function create_fragment$g(ctx) {
+function create_fragment$h(ctx) {
   let div1;
   let div0;
   let t;
@@ -14690,7 +14680,7 @@ function create_fragment$g(ctx) {
   };
 }
 
-function instance$e($$self, $$props, $$invalidate) {
+function instance$f($$self, $$props, $$invalidate) {
   let paddedContent;
   let {
     testid = ""
@@ -14783,7 +14773,7 @@ class Popover extends SvelteElement {
       target: this.shadowRoot,
       props: attribute_to_object(this.attributes),
       customElement: true
-    }, instance$e, create_fragment$g, safe_not_equal, {
+    }, instance$f, create_fragment$h, safe_not_equal, {
       testid: 0,
       maxwidth: 1,
       padded: 7
@@ -15033,7 +15023,7 @@ function create_each_block$2(key_1, ctx) {
   };
 }
 
-function create_fragment$f(ctx) {
+function create_fragment$g(ctx) {
   let div;
   let slot;
   let t;
@@ -15156,7 +15146,7 @@ function create_fragment$f(ctx) {
   };
 }
 
-function instance$d($$self, $$props, $$invalidate) {
+function instance$e($$self, $$props, $$invalidate) {
   let isDisabled;
   let isError;
   const [Orientations, validateOrientation] = typeValidator("Radio group orientation", ["vertical", "horizontal"]);
@@ -15299,7 +15289,7 @@ class RadioGroup extends SvelteElement {
       target: this.shadowRoot,
       props: attribute_to_object(this.attributes),
       customElement: true
-    }, instance$d, create_fragment$f, safe_not_equal, {
+    }, instance$e, create_fragment$g, safe_not_equal, {
       name: 1,
       value: 0,
       orientation: 2,
@@ -15455,7 +15445,7 @@ class RadioGroup extends SvelteElement {
 customElements.define("goa-radio-group", RadioGroup);
 /* libs/web-components/src/components/scrollable/Scrollable.svelte generated by Svelte v3.51.0 */
 
-function create_fragment$e(ctx) {
+function create_fragment$f(ctx) {
   let div;
   let slot;
   let div_style_value;
@@ -15540,7 +15530,7 @@ function create_fragment$e(ctx) {
   };
 }
 
-function instance$c($$self, $$props, $$invalidate) {
+function instance$d($$self, $$props, $$invalidate) {
   let {
     direction = "vertical"
   } = $$props;
@@ -15606,7 +15596,7 @@ class Scrollable extends SvelteElement {
       target: this.shadowRoot,
       props: attribute_to_object(this.attributes),
       customElement: true
-    }, instance$c, create_fragment$e, safe_not_equal, {
+    }, instance$d, create_fragment$f, safe_not_equal, {
       direction: 0,
       hpadding: 1,
       vpadding: 2,
@@ -16286,7 +16276,7 @@ function create_each_block$1(ctx) {
   };
 }
 
-function create_fragment$d(ctx) {
+function create_fragment$e(ctx) {
   let div;
   let current_block_type_index;
   let if_block;
@@ -16405,7 +16395,7 @@ function create_fragment$d(ctx) {
   };
 }
 
-function instance$b($$self, $$props, $$invalidate) {
+function instance$c($$self, $$props, $$invalidate) {
   const [Types, validateType] = typeValidator("Skeleton type", ["image", "text", "title", "text-small", "avatar", "header", "paragraph", "thumbnail", "card", "lines", "profile", "article"], true);
   const [Sizes, validateSize] = typeValidator("Skeleton size", ["1", "2", "3", "4"]);
   let {
@@ -16463,7 +16453,7 @@ class Skeleton extends SvelteElement {
       target: this.shadowRoot,
       props: attribute_to_object(this.attributes),
       customElement: true
-    }, instance$b, create_fragment$d, safe_not_equal, {
+    }, instance$c, create_fragment$e, safe_not_equal, {
       maxwidth: 0,
       size: 1,
       linecount: 2,
@@ -16595,7 +16585,7 @@ class Skeleton extends SvelteElement {
 customElements.define("goa-skeleton", Skeleton);
 /* libs/web-components/src/components/spacer/Spacer.svelte generated by Svelte v3.51.0 */
 
-function create_fragment$c(ctx) {
+function create_fragment$d(ctx) {
   let div;
   return {
     c() {
@@ -16624,7 +16614,7 @@ function create_fragment$c(ctx) {
   };
 }
 
-function instance$a($$self, $$props, $$invalidate) {
+function instance$b($$self, $$props, $$invalidate) {
   let {
     hspacing = "none"
   } = $$props;
@@ -16662,7 +16652,7 @@ class Spacer extends SvelteElement {
       target: this.shadowRoot,
       props: attribute_to_object(this.attributes),
       customElement: true
-    }, instance$a, create_fragment$c, safe_not_equal, {
+    }, instance$b, create_fragment$d, safe_not_equal, {
       hspacing: 1,
       vspacing: 2
     }, null);
@@ -17084,7 +17074,7 @@ function create_if_block$5(ctx) {
   };
 }
 
-function create_fragment$b(ctx) {
+function create_fragment$c(ctx) {
   let if_block_anchor;
   let if_block =
   /*ready*/
@@ -17129,7 +17119,7 @@ function create_fragment$b(ctx) {
   };
 }
 
-function instance$9($$self, $$props, $$invalidate) {
+function instance$a($$self, $$props, $$invalidate) {
   let diameter;
   let strokewidth;
   let radius;
@@ -17260,7 +17250,7 @@ class Spinner extends SvelteElement {
       target: this.shadowRoot,
       props: attribute_to_object(this.attributes),
       customElement: true
-    }, instance$9, create_fragment$b, safe_not_equal, {
+    }, instance$a, create_fragment$c, safe_not_equal, {
       size: 10,
       invert: 0,
       progress: 11,
@@ -17332,7 +17322,7 @@ class Spinner extends SvelteElement {
 customElements.define("goa-spinner", Spinner);
 /* libs/web-components/src/components/table/Table.svelte generated by Svelte v3.51.0 */
 
-function create_fragment$a(ctx) {
+function create_fragment$b(ctx) {
   let table;
   let slot;
   let t0;
@@ -17434,7 +17424,7 @@ function create_fragment$a(ctx) {
   };
 }
 
-function instance$8($$self, $$props, $$invalidate) {
+function instance$9($$self, $$props, $$invalidate) {
   let _stickyHeader;
 
   const [Variants, validateVariant] = typeValidator("Table variant", ["normal", "relaxed"], true);
@@ -17548,7 +17538,7 @@ class Table extends SvelteElement {
       target: this.shadowRoot,
       props: attribute_to_object(this.attributes),
       customElement: true
-    }, instance$8, create_fragment$a, safe_not_equal, {
+    }, instance$9, create_fragment$b, safe_not_equal, {
       width: 0,
       stickyheader: 8,
       variant: 1,
@@ -17724,7 +17714,7 @@ function create_if_block$4(ctx) {
   };
 }
 
-function create_fragment$9(ctx) {
+function create_fragment$a(ctx) {
   let button;
   let slot;
   let t;
@@ -17779,7 +17769,7 @@ function create_fragment$9(ctx) {
   };
 }
 
-function instance$7($$self, $$props, $$invalidate) {
+function instance$8($$self, $$props, $$invalidate) {
   let {
     direction = "none"
   } = $$props;
@@ -17799,7 +17789,7 @@ class TableSortHeader extends SvelteElement {
       target: this.shadowRoot,
       props: attribute_to_object(this.attributes),
       customElement: true
-    }, instance$7, create_fragment$9, safe_not_equal, {
+    }, instance$8, create_fragment$a, safe_not_equal, {
       direction: 0
     }, null);
 
@@ -17835,7 +17825,7 @@ class TableSortHeader extends SvelteElement {
 customElements.define("goa-table-sort-header", TableSortHeader);
 /* libs/web-components/src/components/text-area/TextArea.svelte generated by Svelte v3.51.0 */
 
-function create_fragment$8(ctx) {
+function create_fragment$9(ctx) {
   let div;
   let textarea;
   let textarea_aria_label_value;
@@ -18016,7 +18006,7 @@ function create_fragment$8(ctx) {
   };
 }
 
-function instance$6($$self, $$props, $$invalidate) {
+function instance$7($$self, $$props, $$invalidate) {
   let isError;
   let isDisabled;
   let isReadonly;
@@ -18133,7 +18123,7 @@ class TextArea extends SvelteElement {
       target: this.shadowRoot,
       props: attribute_to_object(this.attributes),
       customElement: true
-    }, instance$6, create_fragment$8, safe_not_equal, {
+    }, instance$7, create_fragment$9, safe_not_equal, {
       name: 0,
       value: 1,
       placeholder: 2,
@@ -18337,7 +18327,7 @@ class TextArea extends SvelteElement {
 customElements.define("goa-textarea", TextArea);
 /* libs/web-components/src/layouts/FullScreenNavbarLayout.svelte generated by Svelte v3.51.0 */
 
-function create_fragment$7(ctx) {
+function create_fragment$8(ctx) {
   let div;
   return {
     c() {
@@ -18381,7 +18371,7 @@ class FullScreenNavbarLayout extends SvelteElement {
       target: this.shadowRoot,
       props: attribute_to_object(this.attributes),
       customElement: true
-    }, null, create_fragment$7, safe_not_equal, {}, null);
+    }, null, create_fragment$8, safe_not_equal, {}, null);
 
     if (options) {
       if (options.target) {
@@ -18395,7 +18385,7 @@ class FullScreenNavbarLayout extends SvelteElement {
 customElements.define("goa-layout-full-nav", FullScreenNavbarLayout);
 /* libs/web-components/src/layouts/one-column-layout/OneColumnLayout.svelte generated by Svelte v3.51.0 */
 
-function create_fragment$6(ctx) {
+function create_fragment$7(ctx) {
   let div;
   return {
     c() {
@@ -18432,7 +18422,7 @@ class OneColumnLayout extends SvelteElement {
       target: this.shadowRoot,
       props: attribute_to_object(this.attributes),
       customElement: true
-    }, null, create_fragment$6, safe_not_equal, {}, null);
+    }, null, create_fragment$7, safe_not_equal, {}, null);
 
     if (options) {
       if (options.target) {
@@ -18446,7 +18436,7 @@ class OneColumnLayout extends SvelteElement {
 customElements.define("goa-one-column-layout", OneColumnLayout);
 /* libs/web-components/src/layouts/two-column-layout/TwoColumnLayout.svelte generated by Svelte v3.51.0 */
 
-function create_fragment$5(ctx) {
+function create_fragment$6(ctx) {
   let div;
   let header;
   let t0;
@@ -18516,7 +18506,7 @@ function create_fragment$5(ctx) {
   };
 }
 
-function instance$5($$self, $$props, $$invalidate) {
+function instance$6($$self, $$props, $$invalidate) {
   let {
     navcolumnwidth = ""
   } = $$props;
@@ -18540,7 +18530,7 @@ class TwoColumnLayout extends SvelteElement {
       target: this.shadowRoot,
       props: attribute_to_object(this.attributes),
       customElement: true
-    }, instance$5, create_fragment$5, safe_not_equal, {
+    }, instance$6, create_fragment$6, safe_not_equal, {
       navcolumnwidth: 0,
       maxcontentwidth: 1
     }, null);
@@ -18586,6 +18576,172 @@ class TwoColumnLayout extends SvelteElement {
 }
 
 customElements.define("goa-two-column-layout", TwoColumnLayout);
+/* libs/web-components/src/layouts/three-column-layout/ThreeColumnLayout.svelte generated by Svelte v3.51.0 */
+
+function create_fragment$5(ctx) {
+  let div;
+  let header;
+  let t0;
+  let section;
+  let t3;
+  let footer;
+  let div_style_value;
+  return {
+    c() {
+      div = element("div");
+      header = element("header");
+      header.innerHTML = `<slot name="header"></slot>`;
+      t0 = space();
+      section = element("section");
+      section.innerHTML = `<nav class="nav"><slot name="nav"></slot></nav> 
+
+    <main><slot></slot></main> 
+
+    <nav class="nav sidebar"><slot name="sidebar"></slot></nav>`;
+      t3 = space();
+      footer = element("footer");
+      footer.innerHTML = `<slot name="footer"></slot>`;
+      this.c = noop;
+      attr(header, "class", "header");
+      attr(section, "class", "content");
+      attr(footer, "class", "footer");
+      attr(div, "class", "page");
+      attr(div, "style", div_style_value = `
+    --max-content-width: ${
+      /*maxcontentwidth*/
+      ctx[2] || "100%"};
+    --nav-column-width: ${
+      /*leftcolumnwidth*/
+      ctx[0] || "256px"};
+    --sidebar-column-width: ${
+      /*rightcolumnwidth*/
+      ctx[1] || "256px"}
+  `);
+    },
+
+    m(target, anchor) {
+      insert(target, div, anchor);
+      append(div, header);
+      append(div, t0);
+      append(div, section);
+      append(div, t3);
+      append(div, footer);
+    },
+
+    p(ctx, [dirty]) {
+      if (dirty &
+      /*maxcontentwidth, leftcolumnwidth, rightcolumnwidth*/
+      7 && div_style_value !== (div_style_value = `
+    --max-content-width: ${
+      /*maxcontentwidth*/
+      ctx[2] || "100%"};
+    --nav-column-width: ${
+      /*leftcolumnwidth*/
+      ctx[0] || "256px"};
+    --sidebar-column-width: ${
+      /*rightcolumnwidth*/
+      ctx[1] || "256px"}
+  `)) {
+        attr(div, "style", div_style_value);
+      }
+    },
+
+    i: noop,
+    o: noop,
+
+    d(detaching) {
+      if (detaching) detach(div);
+    }
+
+  };
+}
+
+function instance$5($$self, $$props, $$invalidate) {
+  let {
+    leftcolumnwidth
+  } = $$props;
+  let {
+    rightcolumnwidth
+  } = $$props;
+  let {
+    maxcontentwidth
+  } = $$props;
+
+  $$self.$$set = $$props => {
+    if ('leftcolumnwidth' in $$props) $$invalidate(0, leftcolumnwidth = $$props.leftcolumnwidth);
+    if ('rightcolumnwidth' in $$props) $$invalidate(1, rightcolumnwidth = $$props.rightcolumnwidth);
+    if ('maxcontentwidth' in $$props) $$invalidate(2, maxcontentwidth = $$props.maxcontentwidth);
+  };
+
+  return [leftcolumnwidth, rightcolumnwidth, maxcontentwidth];
+}
+
+class ThreeColumnLayout extends SvelteElement {
+  constructor(options) {
+    super();
+    this.shadowRoot.innerHTML = `<style>*{box-sizing:border-box}.page{min-height:100vh;display:flex;flex-direction:column;position:relative}.content{flex:1 1 auto;position:relative;display:flex;flex-direction:column;gap:2rem}.header,.footer{flex:0 0 auto}main{flex:1 1 auto;padding:0 1rem}.nav{padding:0 1rem;transition:transform 200ms ease-in-out;background-color:var(--goa-color-greyscale-white)}.nav>*{display:block;padding:0.5rem 0}@media(min-width: 640px){.page{gap:2rem}.content{display:flex;flex-direction:row;justify-content:center;width:min(var(--max-content-width), 100vw);margin:0 auto}.nav{padding:0 2rem;transform:translateX(0)}.nav:not(.sidebar){flex:0 0 var(--nav-column-width)}.nav.sidebar{flex:0 0 var(--sidebar-column-width)}main{padding-right:2rem}}@media(min-width: 1300px){main{padding-right:4.5rem}}</style>`;
+    init(this, {
+      target: this.shadowRoot,
+      props: attribute_to_object(this.attributes),
+      customElement: true
+    }, instance$5, create_fragment$5, safe_not_equal, {
+      leftcolumnwidth: 0,
+      rightcolumnwidth: 1,
+      maxcontentwidth: 2
+    }, null);
+
+    if (options) {
+      if (options.target) {
+        insert(options.target, this, options.anchor);
+      }
+
+      if (options.props) {
+        this.$set(options.props);
+        flush();
+      }
+    }
+  }
+
+  static get observedAttributes() {
+    return ["leftcolumnwidth", "rightcolumnwidth", "maxcontentwidth"];
+  }
+
+  get leftcolumnwidth() {
+    return this.$$.ctx[0];
+  }
+
+  set leftcolumnwidth(leftcolumnwidth) {
+    this.$$set({
+      leftcolumnwidth
+    });
+    flush();
+  }
+
+  get rightcolumnwidth() {
+    return this.$$.ctx[1];
+  }
+
+  set rightcolumnwidth(rightcolumnwidth) {
+    this.$$set({
+      rightcolumnwidth
+    });
+    flush();
+  }
+
+  get maxcontentwidth() {
+    return this.$$.ctx[2];
+  }
+
+  set maxcontentwidth(maxcontentwidth) {
+    this.$$set({
+      maxcontentwidth
+    });
+    flush();
+  }
+
+}
+
+customElements.define("goa-three-column-layout", ThreeColumnLayout);
 /* libs/web-components/src/components/form-stepper/FormStepper.svelte generated by Svelte v3.51.0 */
 
 function create_if_block$3(ctx) {
@@ -22882,4 +23038,30 @@ function GoATwoColumnLayout(props) {
   }), void 0);
 }
 
-export { GoAAccordion, GoAAppFooter, GoAAppFooterMetaSection, GoAAppFooterNavSection, GoAAppHeader, GoABadge, GoABlock, GoAButton, GoAButtonGroup, GoACallout, GoACheckbox, GoAChip, GoACircularProgress, GoAContainer, GoADetails, GoADivider, GoADropdown, GoADropdownItem, GoADropdownOption, GoAEmergencyBadge, GoAFileUploadCard, GoAFileUploadInput, GoAFormItem, GoAFormStep, GoAFormStepper, GoAGrid, GoAHeroBanner, GoAHeroBannerActions, GoAIcon, GoAIconButton, GoAImportantBadge, GoAInfoBadge, GoAInput, GoAInputDate, GoAInputDateTime, GoAInputEmail, GoAInputFile, GoAInputMonth, GoAInputNumber, GoAInputPassword, GoAInputRange, GoAInputSearch, GoAInputTel, GoAInputText, GoAInputTime, GoAInputUrl, GoAMicrositeHeader, GoAModal, GoANotification, GoAOneColumnLayout, GoAPageBlock, GoAPages, GoAPagination, GoAPopover, GoARadioGroup, GoARadioItem, GoASkeleton, GoASpacer, GoASpinner, GoASuccessBadge, GoATable, GoATextArea, GoATwoColumnLayout };
+function GoAThreeColumnLayout(props) {
+  return jsxs("goa-three-column-layout", Object.assign({
+    leftcolumnwidth: props.leftColumnWidth,
+    rightcolumnwidth: props.rightColumnWidth,
+    maxcontentwidth: props.maxContentWidth
+  }, {
+    children: [props.header && jsx("div", Object.assign({
+      slot: "header"
+    }, {
+      children: props.header
+    }), void 0), props.nav && jsx("div", Object.assign({
+      slot: "nav"
+    }, {
+      children: props.nav
+    }), void 0), props.sidebar && jsx("div", Object.assign({
+      slot: "sidebar"
+    }, {
+      children: props.sidebar
+    }), void 0), props.children, props.footer && jsx("div", Object.assign({
+      slot: "footer"
+    }, {
+      children: props.footer
+    }), void 0)]
+  }), void 0);
+}
+
+export { GoAAccordion, GoAAppFooter, GoAAppFooterMetaSection, GoAAppFooterNavSection, GoAAppHeader, GoABadge, GoABlock, GoAButton, GoAButtonGroup, GoACallout, GoACheckbox, GoAChip, GoACircularProgress, GoAContainer, GoADetails, GoADivider, GoADropdown, GoADropdownItem, GoADropdownOption, GoAEmergencyBadge, GoAFileUploadCard, GoAFileUploadInput, GoAFormItem, GoAFormStep, GoAFormStepper, GoAGrid, GoAHeroBanner, GoAHeroBannerActions, GoAIcon, GoAIconButton, GoAImportantBadge, GoAInfoBadge, GoAInput, GoAInputDate, GoAInputDateTime, GoAInputEmail, GoAInputFile, GoAInputMonth, GoAInputNumber, GoAInputPassword, GoAInputRange, GoAInputSearch, GoAInputTel, GoAInputText, GoAInputTime, GoAInputUrl, GoAMicrositeHeader, GoAModal, GoANotification, GoAOneColumnLayout, GoAPageBlock, GoAPages, GoAPagination, GoAPopover, GoARadioGroup, GoARadioItem, GoASkeleton, GoASpacer, GoASpinner, GoASuccessBadge, GoATable, GoATextArea, GoAThreeColumnLayout, GoATwoColumnLayout };