@abgov/web-components 1.0.0-alpha.141 → 1.0.0-alpha.143

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -977,7 +977,7 @@ function create_if_block$h(ctx) {
977
977
  };
978
978
  }
979
979
 
980
- function create_fragment$G(ctx) {
980
+ function create_fragment$F(ctx) {
981
981
  let div2;
982
982
  let div1;
983
983
  let t;
@@ -1043,7 +1043,7 @@ function create_fragment$G(ctx) {
1043
1043
  };
1044
1044
  }
1045
1045
 
1046
- function instance$B($$self, $$props, $$invalidate) {
1046
+ function instance$z($$self, $$props, $$invalidate) {
1047
1047
  let { heading = "" } = $$props;
1048
1048
  let { url = "" } = $$props;
1049
1049
  let { testid = "" } = $$props;
@@ -1071,8 +1071,8 @@ class AppHeader extends SvelteElement {
1071
1071
  props: attribute_to_object(this.attributes),
1072
1072
  customElement: true
1073
1073
  },
1074
- instance$B,
1075
- create_fragment$G,
1074
+ instance$z,
1075
+ create_fragment$F,
1076
1076
  safe_not_equal,
1077
1077
  {
1078
1078
  heading: 0,
@@ -1257,7 +1257,7 @@ function create_if_block$g(ctx) {
1257
1257
  };
1258
1258
  }
1259
1259
 
1260
- function create_fragment$F(ctx) {
1260
+ function create_fragment$E(ctx) {
1261
1261
  let div;
1262
1262
  let t;
1263
1263
  let div_style_value;
@@ -1343,7 +1343,7 @@ function create_fragment$F(ctx) {
1343
1343
  };
1344
1344
  }
1345
1345
 
1346
- function instance$A($$self, $$props, $$invalidate) {
1346
+ function instance$y($$self, $$props, $$invalidate) {
1347
1347
  let showIcon;
1348
1348
  let iconType;
1349
1349
  const [Types, validateType] = typeValidator("Badge type", ["success", "important", "information", "emergency", "dark", "midtone", "light"], true);
@@ -1411,8 +1411,8 @@ class Badge extends SvelteElement {
1411
1411
  props: attribute_to_object(this.attributes),
1412
1412
  customElement: true
1413
1413
  },
1414
- instance$A,
1415
- create_fragment$F,
1414
+ instance$y,
1415
+ create_fragment$E,
1416
1416
  safe_not_equal,
1417
1417
  {
1418
1418
  type: 0,
@@ -1520,7 +1520,7 @@ customElements.define("goa-badge", Badge);
1520
1520
 
1521
1521
  /* libs/web-components/src/components/block/Block.svelte generated by Svelte v3.51.0 */
1522
1522
 
1523
- function create_fragment$E(ctx) {
1523
+ function create_fragment$D(ctx) {
1524
1524
  let div;
1525
1525
  let slot;
1526
1526
  let div_style_value;
@@ -1561,7 +1561,7 @@ function create_fragment$E(ctx) {
1561
1561
  };
1562
1562
  }
1563
1563
 
1564
- function instance$z($$self, $$props, $$invalidate) {
1564
+ function instance$x($$self, $$props, $$invalidate) {
1565
1565
  let { gap = "m" } = $$props;
1566
1566
  let { direction = "row" } = $$props;
1567
1567
  let { alignment = "start" } = $$props;
@@ -1595,8 +1595,8 @@ class Block extends SvelteElement {
1595
1595
  props: attribute_to_object(this.attributes),
1596
1596
  customElement: true
1597
1597
  },
1598
- instance$z,
1599
- create_fragment$E,
1598
+ instance$x,
1599
+ create_fragment$D,
1600
1600
  safe_not_equal,
1601
1601
  {
1602
1602
  gap: 0,
@@ -1846,7 +1846,7 @@ function create_if_block_1$9(ctx) {
1846
1846
  };
1847
1847
  }
1848
1848
 
1849
- function create_fragment$D(ctx) {
1849
+ function create_fragment$C(ctx) {
1850
1850
  let button;
1851
1851
  let button_class_value;
1852
1852
  let button_style_value;
@@ -1939,7 +1939,7 @@ function clickHandler(e) {
1939
1939
  e.stopPropagation();
1940
1940
  }
1941
1941
 
1942
- function instance$y($$self, $$props, $$invalidate) {
1942
+ function instance$w($$self, $$props, $$invalidate) {
1943
1943
  let isDisabled;
1944
1944
  let isButtonDark;
1945
1945
  const [Types, validateType] = typeValidator("Button type", ["primary", "submit", "secondary", "tertiary", "start"], true);
@@ -2020,8 +2020,8 @@ class Button extends SvelteElement {
2020
2020
  props: attribute_to_object(this.attributes),
2021
2021
  customElement: true
2022
2022
  },
2023
- instance$y,
2024
- create_fragment$D,
2023
+ instance$w,
2024
+ create_fragment$C,
2025
2025
  safe_not_equal,
2026
2026
  {
2027
2027
  type: 0,
@@ -2171,7 +2171,7 @@ customElements.define("goa-button", Button);
2171
2171
 
2172
2172
  /* libs/web-components/src/components/button-group/ButtonGroup.svelte generated by Svelte v3.51.0 */
2173
2173
 
2174
- function create_fragment$C(ctx) {
2174
+ function create_fragment$B(ctx) {
2175
2175
  let div;
2176
2176
  let slot;
2177
2177
  let div_style_value;
@@ -2205,7 +2205,7 @@ function create_fragment$C(ctx) {
2205
2205
  };
2206
2206
  }
2207
2207
 
2208
- function instance$x($$self, $$props, $$invalidate) {
2208
+ function instance$v($$self, $$props, $$invalidate) {
2209
2209
  let _alignment;
2210
2210
  let { alignment = "start" } = $$props;
2211
2211
  let { gap = "relaxed" } = $$props;
@@ -2257,8 +2257,8 @@ class ButtonGroup extends SvelteElement {
2257
2257
  props: attribute_to_object(this.attributes),
2258
2258
  customElement: true
2259
2259
  },
2260
- instance$x,
2261
- create_fragment$C,
2260
+ instance$v,
2261
+ create_fragment$B,
2262
2262
  safe_not_equal,
2263
2263
  {
2264
2264
  alignment: 7,
@@ -2378,7 +2378,7 @@ function create_if_block$e(ctx) {
2378
2378
  };
2379
2379
  }
2380
2380
 
2381
- function create_fragment$B(ctx) {
2381
+ function create_fragment$A(ctx) {
2382
2382
  let div;
2383
2383
  let span0;
2384
2384
  let goa_icon;
@@ -2463,7 +2463,7 @@ function create_fragment$B(ctx) {
2463
2463
  };
2464
2464
  }
2465
2465
 
2466
- function instance$w($$self, $$props, $$invalidate) {
2466
+ function instance$u($$self, $$props, $$invalidate) {
2467
2467
  let iconType;
2468
2468
  const [Types, validateType] = typeValidator("Callout type", ["emergency", "important", "information", "event", "success"], true);
2469
2469
  let { mt = null } = $$props;
@@ -2517,8 +2517,8 @@ class Callout extends SvelteElement {
2517
2517
  props: attribute_to_object(this.attributes),
2518
2518
  customElement: true
2519
2519
  },
2520
- instance$w,
2521
- create_fragment$B,
2520
+ instance$u,
2521
+ create_fragment$A,
2522
2522
  safe_not_equal,
2523
2523
  {
2524
2524
  mt: 0,
@@ -2616,7 +2616,7 @@ customElements.define("goa-callout", Callout);
2616
2616
 
2617
2617
  /* libs/web-components/src/components/card-actions/CardActions.svelte generated by Svelte v3.51.0 */
2618
2618
 
2619
- function create_fragment$A(ctx) {
2619
+ function create_fragment$z(ctx) {
2620
2620
  let goa_card_content;
2621
2621
 
2622
2622
  return {
@@ -2649,7 +2649,7 @@ class CardActions extends SvelteElement {
2649
2649
  customElement: true
2650
2650
  },
2651
2651
  null,
2652
- create_fragment$A,
2652
+ create_fragment$z,
2653
2653
  safe_not_equal,
2654
2654
  {},
2655
2655
  null
@@ -2667,7 +2667,7 @@ customElements.define("goa-card-actions", CardActions);
2667
2667
 
2668
2668
  /* libs/web-components/src/components/card/Card.svelte generated by Svelte v3.51.0 */
2669
2669
 
2670
- function create_fragment$z(ctx) {
2670
+ function create_fragment$y(ctx) {
2671
2671
  let div;
2672
2672
  let slot;
2673
2673
  let div_style_value;
@@ -2707,7 +2707,7 @@ function create_fragment$z(ctx) {
2707
2707
  };
2708
2708
  }
2709
2709
 
2710
- function instance$v($$self, $$props, $$invalidate) {
2710
+ function instance$t($$self, $$props, $$invalidate) {
2711
2711
  let { elevation = 0 } = $$props;
2712
2712
  let { width = "100%" } = $$props;
2713
2713
  let { height = "auto" } = $$props;
@@ -2743,8 +2743,8 @@ class Card extends SvelteElement {
2743
2743
  props: attribute_to_object(this.attributes),
2744
2744
  customElement: true
2745
2745
  },
2746
- instance$v,
2747
- create_fragment$z,
2746
+ instance$t,
2747
+ create_fragment$y,
2748
2748
  safe_not_equal,
2749
2749
  {
2750
2750
  elevation: 0,
@@ -2852,7 +2852,7 @@ customElements.define("goa-card", Card);
2852
2852
 
2853
2853
  /* libs/web-components/src/components/card-content/CardContent.svelte generated by Svelte v3.51.0 */
2854
2854
 
2855
- function create_fragment$y(ctx) {
2855
+ function create_fragment$x(ctx) {
2856
2856
  let div;
2857
2857
 
2858
2858
  return {
@@ -2887,7 +2887,7 @@ class CardContent extends SvelteElement {
2887
2887
  customElement: true
2888
2888
  },
2889
2889
  null,
2890
- create_fragment$y,
2890
+ create_fragment$x,
2891
2891
  safe_not_equal,
2892
2892
  {},
2893
2893
  null
@@ -2905,7 +2905,7 @@ customElements.define("goa-card-content", CardContent);
2905
2905
 
2906
2906
  /* libs/web-components/src/components/card-group/CardGroup.svelte generated by Svelte v3.51.0 */
2907
2907
 
2908
- function create_fragment$x(ctx) {
2908
+ function create_fragment$w(ctx) {
2909
2909
  let div;
2910
2910
 
2911
2911
  return {
@@ -2940,7 +2940,7 @@ class CardGroup extends SvelteElement {
2940
2940
  customElement: true
2941
2941
  },
2942
2942
  null,
2943
- create_fragment$x,
2943
+ create_fragment$w,
2944
2944
  safe_not_equal,
2945
2945
  {},
2946
2946
  null
@@ -2958,7 +2958,7 @@ customElements.define("goa-card-group", CardGroup);
2958
2958
 
2959
2959
  /* libs/web-components/src/components/card-image/CardImage.svelte generated by Svelte v3.51.0 */
2960
2960
 
2961
- function create_fragment$w(ctx) {
2961
+ function create_fragment$v(ctx) {
2962
2962
  let div;
2963
2963
 
2964
2964
  return {
@@ -2990,7 +2990,7 @@ function create_fragment$w(ctx) {
2990
2990
  };
2991
2991
  }
2992
2992
 
2993
- function instance$u($$self, $$props, $$invalidate) {
2993
+ function instance$s($$self, $$props, $$invalidate) {
2994
2994
  let { src } = $$props;
2995
2995
  let { height = "100%" } = $$props;
2996
2996
 
@@ -3014,8 +3014,8 @@ class CardImage extends SvelteElement {
3014
3014
  props: attribute_to_object(this.attributes),
3015
3015
  customElement: true
3016
3016
  },
3017
- instance$u,
3018
- create_fragment$w,
3017
+ instance$s,
3018
+ create_fragment$v,
3019
3019
  safe_not_equal,
3020
3020
  { src: 0, height: 1 },
3021
3021
  null
@@ -3110,7 +3110,7 @@ function create_if_block$d(ctx) {
3110
3110
  };
3111
3111
  }
3112
3112
 
3113
- function create_fragment$v(ctx) {
3113
+ function create_fragment$u(ctx) {
3114
3114
  let label;
3115
3115
  let div0;
3116
3116
  let input;
@@ -3255,7 +3255,7 @@ function create_fragment$v(ctx) {
3255
3255
  };
3256
3256
  }
3257
3257
 
3258
- function instance$t($$self, $$props, $$invalidate) {
3258
+ function instance$r($$self, $$props, $$invalidate) {
3259
3259
  let isDisabled;
3260
3260
  let isError;
3261
3261
  let isChecked;
@@ -3367,8 +3367,8 @@ class Checkbox extends SvelteElement {
3367
3367
  props: attribute_to_object(this.attributes),
3368
3368
  customElement: true
3369
3369
  },
3370
- instance$t,
3371
- create_fragment$v,
3370
+ instance$r,
3371
+ create_fragment$u,
3372
3372
  safe_not_equal,
3373
3373
  {
3374
3374
  name: 0,
@@ -3597,7 +3597,7 @@ function create_if_block$c(ctx) {
3597
3597
  };
3598
3598
  }
3599
3599
 
3600
- function create_fragment$u(ctx) {
3600
+ function create_fragment$t(ctx) {
3601
3601
  let div1;
3602
3602
  let t0;
3603
3603
  let div0;
@@ -3712,7 +3712,7 @@ function create_fragment$u(ctx) {
3712
3712
  };
3713
3713
  }
3714
3714
 
3715
- function instance$s($$self, $$props, $$invalidate) {
3715
+ function instance$q($$self, $$props, $$invalidate) {
3716
3716
  let { mt = null } = $$props;
3717
3717
  let { mr = null } = $$props;
3718
3718
  let { mb = null } = $$props;
@@ -3809,8 +3809,8 @@ class Chip extends SvelteElement {
3809
3809
  props: attribute_to_object(this.attributes),
3810
3810
  customElement: true
3811
3811
  },
3812
- instance$s,
3813
- create_fragment$u,
3812
+ instance$q,
3813
+ create_fragment$t,
3814
3814
  safe_not_equal,
3815
3815
  {
3816
3816
  mt: 0,
@@ -4318,7 +4318,7 @@ function create_if_block_2$5(ctx) {
4318
4318
  };
4319
4319
  }
4320
4320
 
4321
- function create_fragment$t(ctx) {
4321
+ function create_fragment$s(ctx) {
4322
4322
  let if_block_anchor;
4323
4323
  let current;
4324
4324
  let if_block = /*isVisible*/ ctx[5] && create_if_block$b(ctx);
@@ -4374,7 +4374,7 @@ function create_fragment$t(ctx) {
4374
4374
  };
4375
4375
  }
4376
4376
 
4377
- function instance$r($$self, $$props, $$invalidate) {
4377
+ function instance$p($$self, $$props, $$invalidate) {
4378
4378
  let isVisible;
4379
4379
  const [Variants, validateVariant] = typeValidator("Circular progress variant", ["fullscreen", "inline"]);
4380
4380
  const [Sizes, validateSize] = typeValidator("Button size", ["small", "large"]);
@@ -4434,8 +4434,8 @@ class CircularProgress extends SvelteElement {
4434
4434
  props: attribute_to_object(this.attributes),
4435
4435
  customElement: true
4436
4436
  },
4437
- instance$r,
4438
- create_fragment$t,
4437
+ instance$p,
4438
+ create_fragment$s,
4439
4439
  safe_not_equal,
4440
4440
  {
4441
4441
  variant: 6,
@@ -4513,7 +4513,7 @@ customElements.define("goa-circular-progress", CircularProgress);
4513
4513
 
4514
4514
  /* libs/web-components/src/components/container/Container.svelte generated by Svelte v3.51.0 */
4515
4515
 
4516
- function create_fragment$s(ctx) {
4516
+ function create_fragment$r(ctx) {
4517
4517
  let div3;
4518
4518
  let header;
4519
4519
  let div0;
@@ -4591,7 +4591,7 @@ function create_fragment$s(ctx) {
4591
4591
  };
4592
4592
  }
4593
4593
 
4594
- function instance$q($$self, $$props, $$invalidate) {
4594
+ function instance$o($$self, $$props, $$invalidate) {
4595
4595
  const [Types, validateType] = typeValidator("Container type", ["interactive", "info", "error", "success", "important", "non-interactive"]);
4596
4596
  const [Accents, validateAccent] = typeValidator("Container accent", ["thick", "thin", "filled"]);
4597
4597
  const [Paddings, validatePadding] = typeValidator("Container padding", ["relaxed", "compact"]);
@@ -4636,8 +4636,8 @@ class Container extends SvelteElement {
4636
4636
  props: attribute_to_object(this.attributes),
4637
4637
  customElement: true
4638
4638
  },
4639
- instance$q,
4640
- create_fragment$s,
4639
+ instance$o,
4640
+ create_fragment$r,
4641
4641
  safe_not_equal,
4642
4642
  {
4643
4643
  type: 0,
@@ -4745,7 +4745,7 @@ customElements.define("goa-container", Container);
4745
4745
 
4746
4746
  /* libs/web-components/src/components/divider/Divider.svelte generated by Svelte v3.51.0 */
4747
4747
 
4748
- function create_fragment$r(ctx) {
4748
+ function create_fragment$q(ctx) {
4749
4749
  let hr;
4750
4750
  let hr_style_value;
4751
4751
 
@@ -4776,7 +4776,7 @@ function create_fragment$r(ctx) {
4776
4776
  };
4777
4777
  }
4778
4778
 
4779
- function instance$p($$self, $$props, $$invalidate) {
4779
+ function instance$n($$self, $$props, $$invalidate) {
4780
4780
  let { testid = "" } = $$props;
4781
4781
  let { mt = null } = $$props;
4782
4782
  let { mr = null } = $$props;
@@ -4806,8 +4806,8 @@ class Divider extends SvelteElement {
4806
4806
  props: attribute_to_object(this.attributes),
4807
4807
  customElement: true
4808
4808
  },
4809
- instance$p,
4810
- create_fragment$r,
4809
+ instance$n,
4810
+ create_fragment$q,
4811
4811
  safe_not_equal,
4812
4812
  { testid: 0, mt: 1, mr: 2, mb: 3, ml: 4 },
4813
4813
  null
@@ -4877,298 +4877,105 @@ class Divider extends SvelteElement {
4877
4877
 
4878
4878
  customElements.define("goa-divider", Divider);
4879
4879
 
4880
- const subscriber_queue = [];
4881
- /**
4882
- * Create a `Writable` store that allows both updating and reading by subscription.
4883
- * @param {*=}value initial value
4884
- * @param {StartStopNotifier=}start start and stop notifications for subscriptions
4885
- */
4886
- function writable(value, start = noop) {
4887
- let stop;
4888
- const subscribers = new Set();
4889
- function set(new_value) {
4890
- if (safe_not_equal(value, new_value)) {
4891
- value = new_value;
4892
- if (stop) { // store is ready
4893
- const run_queue = !subscriber_queue.length;
4894
- for (const subscriber of subscribers) {
4895
- subscriber[1]();
4896
- subscriber_queue.push(subscriber, value);
4897
- }
4898
- if (run_queue) {
4899
- for (let i = 0; i < subscriber_queue.length; i += 2) {
4900
- subscriber_queue[i][0](subscriber_queue[i + 1]);
4901
- }
4902
- subscriber_queue.length = 0;
4903
- }
4904
- }
4905
- }
4906
- }
4907
- function update(fn) {
4908
- set(fn(value));
4909
- }
4910
- function subscribe(run, invalidate = noop) {
4911
- const subscriber = [run, invalidate];
4912
- subscribers.add(subscriber);
4913
- if (subscribers.size === 1) {
4914
- stop = start(set) || noop;
4915
- }
4916
- run(value);
4917
- return () => {
4918
- subscribers.delete(subscriber);
4919
- if (subscribers.size === 0) {
4920
- stop();
4921
- stop = null;
4922
- }
4923
- };
4924
- }
4925
- return { set, update, subscribe };
4926
- }
4880
+ /* libs/web-components/src/components/dropdown/Dropdown.svelte generated by Svelte v3.51.0 */
4927
4881
 
4928
- const stores = {};
4929
- class ContextStoreInternal {
4930
- constructor() {
4931
- this.store = writable();
4932
- }
4933
- subscribe(cb) {
4934
- this.store.subscribe((state) => {
4935
- if (!state)
4936
- return;
4937
- cb(state);
4938
- });
4939
- }
4940
- notify(msg) {
4941
- const fn = async () => {
4942
- await tick();
4943
- this.store.update(() => msg);
4944
- };
4945
- fn();
4946
- }
4947
- }
4948
- function getContext(name) {
4949
- let ctx = stores[name];
4950
- if (!ctx) {
4951
- ctx = new ContextStoreInternal();
4952
- }
4953
- stores[name] = ctx;
4954
- return ctx;
4955
- }
4956
- function deleteContext(name) {
4957
- const store = stores[name];
4958
- if (!store)
4959
- return;
4960
- delete stores[name];
4882
+ function get_each_context_1(ctx, list, i) {
4883
+ const child_ctx = ctx.slice();
4884
+ child_ctx[48] = list[i];
4885
+ child_ctx[52] = i;
4886
+ return child_ctx;
4961
4887
  }
4962
4888
 
4963
- /* libs/web-components/src/components/dropdown/DropdownItem.svelte generated by Svelte v3.51.0 */
4964
-
4965
- function create_fragment$q(ctx) {
4966
- return {
4967
- c() {
4968
- this.c = noop;
4969
- },
4970
- m: noop,
4971
- p: noop,
4972
- i: noop,
4973
- o: noop,
4974
- d: noop
4975
- };
4889
+ function get_each_context$4(ctx, list, i) {
4890
+ const child_ctx = ctx.slice();
4891
+ child_ctx[48] = list[i];
4892
+ return child_ctx;
4976
4893
  }
4977
4894
 
4978
- function instance$o($$self, $$props, $$invalidate) {
4979
- let { name = "" } = $$props;
4980
- let { value = "" } = $$props;
4981
- let { label = "" } = $$props;
4895
+ // (244:2) {:else}
4896
+ function create_else_block$1(ctx) {
4897
+ let t0;
4898
+ let slot;
4899
+ let t1;
4900
+ let goa_input;
4901
+ let goa_input_aria_label_value;
4902
+ let goa_input_data_testid_value;
4903
+ let t2;
4904
+ let ul;
4905
+ let each_blocks = [];
4906
+ let each_1_lookup = new Map();
4907
+ let ul_style_value;
4908
+ let mounted;
4909
+ let dispose;
4910
+ let if_block = /*_isMenuVisible*/ ctx[15] && create_if_block_1$5(ctx);
4911
+ let each_value_1 = /*_options*/ ctx[13];
4912
+ const get_key = ctx => /*index*/ ctx[52];
4982
4913
 
4983
- // private
4984
- let ctx;
4914
+ for (let i = 0; i < each_value_1.length; i += 1) {
4915
+ let child_ctx = get_each_context_1(ctx, each_value_1, i);
4916
+ let key = get_key(child_ctx);
4917
+ each_1_lookup.set(key, each_blocks[i] = create_each_block_1(key, child_ctx));
4918
+ }
4985
4919
 
4986
- let isBound = false;
4920
+ return {
4921
+ c() {
4922
+ if (if_block) if_block.c();
4923
+ t0 = space();
4924
+ slot = element("slot");
4925
+ t1 = space();
4926
+ goa_input = element("goa-input");
4927
+ t2 = space();
4928
+ ul = element("ul");
4987
4929
 
4988
- $$self.$$set = $$props => {
4989
- if ('name' in $$props) $$invalidate(0, name = $$props.name);
4990
- if ('value' in $$props) $$invalidate(1, value = $$props.value);
4991
- if ('label' in $$props) $$invalidate(2, label = $$props.label);
4992
- };
4930
+ for (let i = 0; i < each_blocks.length; i += 1) {
4931
+ each_blocks[i].c();
4932
+ }
4993
4933
 
4994
- $$self.$$.update = () => {
4995
- if ($$self.$$.dirty & /*isBound, name, ctx, label, value*/ 31) {
4996
- {
4997
- (async () => {
4998
- await tick();
4934
+ set_custom_element_data(goa_input, "error", /*error*/ ctx[7]);
4935
+ set_custom_element_data(goa_input, "disabled", /*disabled*/ ctx[6]);
4936
+ set_custom_element_data(goa_input, "leadingicon", /*leadingicon*/ ctx[2]);
4937
+ set_custom_element_data(goa_input, "placeholder", /*placeholder*/ ctx[4]);
4938
+ set_custom_element_data(goa_input, "aria-controls", "menu");
4939
+ set_custom_element_data(goa_input, "aria-expanded", /*_isMenuVisible*/ ctx[15]);
4940
+ set_custom_element_data(goa_input, "aria-label", goa_input_aria_label_value = /*arialabel*/ ctx[1] || /*name*/ ctx[0]);
4941
+ set_custom_element_data(goa_input, "data-testid", goa_input_data_testid_value = `${/*name*/ ctx[0]}-dropdown-input`);
4942
+ set_custom_element_data(goa_input, "readonly", "");
4943
+ set_custom_element_data(goa_input, "role", "combobox");
4944
+ set_custom_element_data(goa_input, "trailingicon", "chevron-down");
4945
+ set_custom_element_data(goa_input, "type", "text");
4946
+ set_custom_element_data(goa_input, "value", /*_selectedLabel*/ ctx[14]);
4947
+ set_custom_element_data(goa_input, "width", "100%");
4948
+ attr(ul, "id", "menu");
4949
+ attr(ul, "role", "listbox");
4950
+ attr(ul, "aria-activedescendant", /*_selectedLabel*/ ctx[14]);
4951
+ attr(ul, "data-testid", "dropdown-menu");
4952
+ attr(ul, "tabindex", "0");
4953
+ attr(ul, "class", "dropdown-list");
4954
+ attr(ul, "style", ul_style_value = `overflow-y: auto; max-height: ${/*maxheight*/ ctx[3]}`);
4955
+ toggle_class(ul, "dropdown-active", /*_isMenuVisible*/ ctx[15]);
4956
+ },
4957
+ m(target, anchor) {
4958
+ if (if_block) if_block.m(target, anchor);
4959
+ insert(target, t0, anchor);
4960
+ insert(target, slot, anchor);
4961
+ insert(target, t1, anchor);
4962
+ insert(target, goa_input, anchor);
4963
+ insert(target, t2, anchor);
4964
+ insert(target, ul, anchor);
4999
4965
 
5000
- if (!isBound) {
5001
- $$invalidate(4, isBound = true);
5002
- $$invalidate(3, ctx = getContext(name));
5003
- ctx.notify({ type: "bind", name, label, value });
5004
- }
5005
- })();
4966
+ for (let i = 0; i < each_blocks.length; i += 1) {
4967
+ each_blocks[i].m(ul, null);
5006
4968
  }
5007
- }
5008
- };
5009
-
5010
- return [name, value, label, ctx, isBound];
5011
- }
5012
4969
 
5013
- class DropdownItem extends SvelteElement {
5014
- constructor(options) {
5015
- super();
5016
-
5017
- init(
5018
- this,
5019
- {
5020
- target: this.shadowRoot,
5021
- props: attribute_to_object(this.attributes),
5022
- customElement: true
5023
- },
5024
- instance$o,
5025
- create_fragment$q,
5026
- safe_not_equal,
5027
- { name: 0, value: 1, label: 2 },
5028
- null
5029
- );
5030
-
5031
- if (options) {
5032
- if (options.target) {
5033
- insert(options.target, this, options.anchor);
5034
- }
5035
-
5036
- if (options.props) {
5037
- this.$set(options.props);
5038
- flush();
5039
- }
5040
- }
5041
- }
5042
-
5043
- static get observedAttributes() {
5044
- return ["name", "value", "label"];
5045
- }
5046
-
5047
- get name() {
5048
- return this.$$.ctx[0];
5049
- }
5050
-
5051
- set name(name) {
5052
- this.$$set({ name });
5053
- flush();
5054
- }
5055
-
5056
- get value() {
5057
- return this.$$.ctx[1];
5058
- }
5059
-
5060
- set value(value) {
5061
- this.$$set({ value });
5062
- flush();
5063
- }
5064
-
5065
- get label() {
5066
- return this.$$.ctx[2];
5067
- }
5068
-
5069
- set label(label) {
5070
- this.$$set({ label });
5071
- flush();
5072
- }
5073
- }
5074
-
5075
- customElements.define("goa-dropdown-item", DropdownItem);
5076
-
5077
- /* libs/web-components/src/components/dropdown/Dropdown.svelte generated by Svelte v3.51.0 */
5078
-
5079
- function get_each_context_1(ctx, list, i) {
5080
- const child_ctx = ctx.slice();
5081
- child_ctx[47] = list[i];
5082
- child_ctx[51] = i;
5083
- return child_ctx;
5084
- }
5085
-
5086
- function get_each_context$4(ctx, list, i) {
5087
- const child_ctx = ctx.slice();
5088
- child_ctx[47] = list[i];
5089
- return child_ctx;
5090
- }
5091
-
5092
- // (224:2) {:else}
5093
- function create_else_block$1(ctx) {
5094
- let t0;
5095
- let goa_input;
5096
- let goa_input_aria_label_value;
5097
- let goa_input_data_testid_value;
5098
- let t1;
5099
- let ul;
5100
- let t2;
5101
- let slot;
5102
- let ul_style_value;
5103
- let mounted;
5104
- let dispose;
5105
- let if_block = /*isMenuVisible*/ ctx[18] && create_if_block_1$5(ctx);
5106
- let each_value_1 = /*options*/ ctx[16];
5107
- let each_blocks = [];
5108
-
5109
- for (let i = 0; i < each_value_1.length; i += 1) {
5110
- each_blocks[i] = create_each_block_1(get_each_context_1(ctx, each_value_1, i));
5111
- }
5112
-
5113
- return {
5114
- c() {
5115
- if (if_block) if_block.c();
5116
- t0 = space();
5117
- goa_input = element("goa-input");
5118
- t1 = space();
5119
- ul = element("ul");
5120
-
5121
- for (let i = 0; i < each_blocks.length; i += 1) {
5122
- each_blocks[i].c();
5123
- }
5124
-
5125
- t2 = space();
5126
- slot = element("slot");
5127
- set_custom_element_data(goa_input, "error", /*error*/ ctx[8]);
5128
- set_custom_element_data(goa_input, "disabled", /*disabled*/ ctx[7]);
5129
- set_custom_element_data(goa_input, "leadingicon", /*leadingicon*/ ctx[3]);
5130
- set_custom_element_data(goa_input, "placeholder", /*placeholder*/ ctx[5]);
5131
- set_custom_element_data(goa_input, "aria-controls", "menu");
5132
- set_custom_element_data(goa_input, "aria-expanded", /*isMenuVisible*/ ctx[18]);
5133
- set_custom_element_data(goa_input, "aria-label", goa_input_aria_label_value = /*arialabel*/ ctx[1] || /*name*/ ctx[0]);
5134
- set_custom_element_data(goa_input, "data-testid", goa_input_data_testid_value = `${/*name*/ ctx[0]}-dropdown-input`);
5135
- set_custom_element_data(goa_input, "readonly", "");
5136
- set_custom_element_data(goa_input, "role", "combobox");
5137
- set_custom_element_data(goa_input, "trailingicon", "chevron-down");
5138
- set_custom_element_data(goa_input, "type", "text");
5139
- set_custom_element_data(goa_input, "value", /*selectedLabel*/ ctx[17]);
5140
- set_custom_element_data(goa_input, "width", "100%");
5141
- attr(ul, "id", "menu");
5142
- attr(ul, "role", "listbox");
5143
- attr(ul, "aria-activedescendant", /*selectedLabel*/ ctx[17]);
5144
- attr(ul, "data-testid", "dropdown-menu");
5145
- attr(ul, "tabindex", "0");
5146
- attr(ul, "class", "dropdown-list");
5147
- attr(ul, "style", ul_style_value = `overflow-y: auto; max-height: ${/*maxheight*/ ctx[4]}`);
5148
- toggle_class(ul, "dropdown-active", /*isMenuVisible*/ ctx[18]);
5149
- },
5150
- m(target, anchor) {
5151
- if (if_block) if_block.m(target, anchor);
5152
- insert(target, t0, anchor);
5153
- insert(target, goa_input, anchor);
5154
- insert(target, t1, anchor);
5155
- insert(target, ul, anchor);
5156
-
5157
- for (let i = 0; i < each_blocks.length; i += 1) {
5158
- each_blocks[i].m(ul, null);
5159
- }
5160
-
5161
- append(ul, t2);
5162
- append(ul, slot);
5163
- /*ul_binding*/ ctx[30](ul);
4970
+ /*ul_binding*/ ctx[33](ul);
5164
4971
 
5165
4972
  if (!mounted) {
5166
- dispose = listen(goa_input, "click", /*showMenu*/ ctx[22]);
4973
+ dispose = listen(goa_input, "click", /*showMenu*/ ctx[24]);
5167
4974
  mounted = true;
5168
4975
  }
5169
4976
  },
5170
4977
  p(ctx, dirty) {
5171
- if (/*isMenuVisible*/ ctx[18]) {
4978
+ if (/*_isMenuVisible*/ ctx[15]) {
5172
4979
  if (if_block) {
5173
4980
  if_block.p(ctx, dirty);
5174
4981
  } else {
@@ -5181,24 +4988,24 @@ function create_else_block$1(ctx) {
5181
4988
  if_block = null;
5182
4989
  }
5183
4990
 
5184
- if (dirty[0] & /*error*/ 256) {
5185
- set_custom_element_data(goa_input, "error", /*error*/ ctx[8]);
4991
+ if (dirty[0] & /*error*/ 128) {
4992
+ set_custom_element_data(goa_input, "error", /*error*/ ctx[7]);
5186
4993
  }
5187
4994
 
5188
- if (dirty[0] & /*disabled*/ 128) {
5189
- set_custom_element_data(goa_input, "disabled", /*disabled*/ ctx[7]);
4995
+ if (dirty[0] & /*disabled*/ 64) {
4996
+ set_custom_element_data(goa_input, "disabled", /*disabled*/ ctx[6]);
5190
4997
  }
5191
4998
 
5192
- if (dirty[0] & /*leadingicon*/ 8) {
5193
- set_custom_element_data(goa_input, "leadingicon", /*leadingicon*/ ctx[3]);
4999
+ if (dirty[0] & /*leadingicon*/ 4) {
5000
+ set_custom_element_data(goa_input, "leadingicon", /*leadingicon*/ ctx[2]);
5194
5001
  }
5195
5002
 
5196
- if (dirty[0] & /*placeholder*/ 32) {
5197
- set_custom_element_data(goa_input, "placeholder", /*placeholder*/ ctx[5]);
5003
+ if (dirty[0] & /*placeholder*/ 16) {
5004
+ set_custom_element_data(goa_input, "placeholder", /*placeholder*/ ctx[4]);
5198
5005
  }
5199
5006
 
5200
- if (dirty[0] & /*isMenuVisible*/ 262144) {
5201
- set_custom_element_data(goa_input, "aria-expanded", /*isMenuVisible*/ ctx[18]);
5007
+ if (dirty[0] & /*_isMenuVisible*/ 32768) {
5008
+ set_custom_element_data(goa_input, "aria-expanded", /*_isMenuVisible*/ ctx[15]);
5202
5009
  }
5203
5010
 
5204
5011
  if (dirty[0] & /*arialabel, name*/ 3 && goa_input_aria_label_value !== (goa_input_aria_label_value = /*arialabel*/ ctx[1] || /*name*/ ctx[0])) {
@@ -5209,115 +5016,136 @@ function create_else_block$1(ctx) {
5209
5016
  set_custom_element_data(goa_input, "data-testid", goa_input_data_testid_value);
5210
5017
  }
5211
5018
 
5212
- if (dirty[0] & /*selectedLabel*/ 131072) {
5213
- set_custom_element_data(goa_input, "value", /*selectedLabel*/ ctx[17]);
5019
+ if (dirty[0] & /*_selectedLabel*/ 16384) {
5020
+ set_custom_element_data(goa_input, "value", /*_selectedLabel*/ ctx[14]);
5214
5021
  }
5215
5022
 
5216
- if (dirty[0] & /*options, _values, highlightedIndex, onSelect*/ 17399808) {
5217
- each_value_1 = /*options*/ ctx[16];
5218
- let i;
5219
-
5220
- for (i = 0; i < each_value_1.length; i += 1) {
5221
- const child_ctx = get_each_context_1(ctx, each_value_1, i);
5222
-
5223
- if (each_blocks[i]) {
5224
- each_blocks[i].p(child_ctx, dirty);
5225
- } else {
5226
- each_blocks[i] = create_each_block_1(child_ctx);
5227
- each_blocks[i].c();
5228
- each_blocks[i].m(ul, t2);
5229
- }
5230
- }
5231
-
5232
- for (; i < each_blocks.length; i += 1) {
5233
- each_blocks[i].d(1);
5234
- }
5235
-
5236
- each_blocks.length = each_value_1.length;
5023
+ if (dirty[0] & /*_options, _values, _highlightedIndex, onSelect*/ 67186688) {
5024
+ each_value_1 = /*_options*/ ctx[13];
5025
+ each_blocks = update_keyed_each(each_blocks, dirty, get_key, 1, ctx, each_value_1, each_1_lookup, ul, destroy_block, create_each_block_1, null, get_each_context_1);
5237
5026
  }
5238
5027
 
5239
- if (dirty[0] & /*selectedLabel*/ 131072) {
5240
- attr(ul, "aria-activedescendant", /*selectedLabel*/ ctx[17]);
5028
+ if (dirty[0] & /*_selectedLabel*/ 16384) {
5029
+ attr(ul, "aria-activedescendant", /*_selectedLabel*/ ctx[14]);
5241
5030
  }
5242
5031
 
5243
- if (dirty[0] & /*maxheight*/ 16 && ul_style_value !== (ul_style_value = `overflow-y: auto; max-height: ${/*maxheight*/ ctx[4]}`)) {
5032
+ if (dirty[0] & /*maxheight*/ 8 && ul_style_value !== (ul_style_value = `overflow-y: auto; max-height: ${/*maxheight*/ ctx[3]}`)) {
5244
5033
  attr(ul, "style", ul_style_value);
5245
5034
  }
5246
5035
 
5247
- if (dirty[0] & /*isMenuVisible*/ 262144) {
5248
- toggle_class(ul, "dropdown-active", /*isMenuVisible*/ ctx[18]);
5036
+ if (dirty[0] & /*_isMenuVisible*/ 32768) {
5037
+ toggle_class(ul, "dropdown-active", /*_isMenuVisible*/ ctx[15]);
5249
5038
  }
5250
5039
  },
5251
5040
  d(detaching) {
5252
5041
  if (if_block) if_block.d(detaching);
5253
5042
  if (detaching) detach(t0);
5254
- if (detaching) detach(goa_input);
5043
+ if (detaching) detach(slot);
5255
5044
  if (detaching) detach(t1);
5045
+ if (detaching) detach(goa_input);
5046
+ if (detaching) detach(t2);
5256
5047
  if (detaching) detach(ul);
5257
- destroy_each(each_blocks, detaching);
5258
- /*ul_binding*/ ctx[30](null);
5048
+
5049
+ for (let i = 0; i < each_blocks.length; i += 1) {
5050
+ each_blocks[i].d();
5051
+ }
5052
+
5053
+ /*ul_binding*/ ctx[33](null);
5259
5054
  mounted = false;
5260
5055
  dispose();
5261
5056
  }
5262
5057
  };
5263
5058
  }
5264
5059
 
5265
- // (212:2) {#if _native}
5060
+ // (225:2) {#if _native}
5266
5061
  function create_if_block$a(ctx) {
5267
5062
  let select;
5268
- let each_blocks = [];
5269
- let each_1_lookup = new Map();
5063
+ let slot;
5064
+ let select_aria_label_value;
5270
5065
  let mounted;
5271
5066
  let dispose;
5272
- let each_value = /*options*/ ctx[16];
5273
- const get_key = ctx => /*option*/ ctx[47].value;
5067
+ let each_value = /*_options*/ ctx[13];
5068
+ let each_blocks = [];
5274
5069
 
5275
5070
  for (let i = 0; i < each_value.length; i += 1) {
5276
- let child_ctx = get_each_context$4(ctx, each_value, i);
5277
- let key = get_key(child_ctx);
5278
- each_1_lookup.set(key, each_blocks[i] = create_each_block$4(key, child_ctx));
5071
+ each_blocks[i] = create_each_block$4(get_each_context$4(ctx, each_value, i));
5279
5072
  }
5280
5073
 
5281
5074
  return {
5282
5075
  c() {
5283
5076
  select = element("select");
5077
+ slot = element("slot");
5284
5078
 
5285
5079
  for (let i = 0; i < each_blocks.length; i += 1) {
5286
5080
  each_blocks[i].c();
5287
5081
  }
5082
+
5083
+ select.disabled = /*_disabled*/ ctx[21];
5084
+ attr(select, "aria-label", select_aria_label_value = /*arialabel*/ ctx[1] || /*name*/ ctx[0]);
5085
+ toggle_class(select, "error", /*_error*/ ctx[23]);
5288
5086
  },
5289
5087
  m(target, anchor) {
5290
5088
  insert(target, select, anchor);
5089
+ append(select, slot);
5291
5090
 
5292
5091
  for (let i = 0; i < each_blocks.length; i += 1) {
5293
5092
  each_blocks[i].m(select, null);
5294
5093
  }
5295
5094
 
5095
+ /*select_binding*/ ctx[31](select);
5096
+
5296
5097
  if (!mounted) {
5297
- dispose = listen(select, "change", /*onNativeSelect*/ ctx[25]);
5098
+ dispose = listen(select, "change", /*onNativeSelect*/ ctx[27]);
5298
5099
  mounted = true;
5299
5100
  }
5300
5101
  },
5301
5102
  p(ctx, dirty) {
5302
- if (dirty[0] & /*options, value*/ 65540) {
5303
- each_value = /*options*/ ctx[16];
5304
- each_blocks = update_keyed_each(each_blocks, dirty, get_key, 1, ctx, each_value, each_1_lookup, select, destroy_block, create_each_block$4, null, get_each_context$4);
5103
+ if (dirty[0] & /*_options*/ 8192) {
5104
+ each_value = /*_options*/ ctx[13];
5105
+ let i;
5106
+
5107
+ for (i = 0; i < each_value.length; i += 1) {
5108
+ const child_ctx = get_each_context$4(ctx, each_value, i);
5109
+
5110
+ if (each_blocks[i]) {
5111
+ each_blocks[i].p(child_ctx, dirty);
5112
+ } else {
5113
+ each_blocks[i] = create_each_block$4(child_ctx);
5114
+ each_blocks[i].c();
5115
+ each_blocks[i].m(select, null);
5116
+ }
5117
+ }
5118
+
5119
+ for (; i < each_blocks.length; i += 1) {
5120
+ each_blocks[i].d(1);
5121
+ }
5122
+
5123
+ each_blocks.length = each_value.length;
5305
5124
  }
5306
- },
5307
- d(detaching) {
5308
- if (detaching) detach(select);
5309
5125
 
5310
- for (let i = 0; i < each_blocks.length; i += 1) {
5311
- each_blocks[i].d();
5126
+ if (dirty[0] & /*_disabled*/ 2097152) {
5127
+ select.disabled = /*_disabled*/ ctx[21];
5312
5128
  }
5313
5129
 
5130
+ if (dirty[0] & /*arialabel, name*/ 3 && select_aria_label_value !== (select_aria_label_value = /*arialabel*/ ctx[1] || /*name*/ ctx[0])) {
5131
+ attr(select, "aria-label", select_aria_label_value);
5132
+ }
5133
+
5134
+ if (dirty[0] & /*_error*/ 8388608) {
5135
+ toggle_class(select, "error", /*_error*/ ctx[23]);
5136
+ }
5137
+ },
5138
+ d(detaching) {
5139
+ if (detaching) detach(select);
5140
+ destroy_each(each_blocks, detaching);
5141
+ /*select_binding*/ ctx[31](null);
5314
5142
  mounted = false;
5315
5143
  dispose();
5316
5144
  }
5317
5145
  };
5318
5146
  }
5319
5147
 
5320
- // (225:4) {#if isMenuVisible}
5148
+ // (245:4) {#if _isMenuVisible}
5321
5149
  function create_if_block_1$5(ctx) {
5322
5150
  let div;
5323
5151
  let div_data_testid_value;
@@ -5334,7 +5162,7 @@ function create_if_block_1$5(ctx) {
5334
5162
  insert(target, div, anchor);
5335
5163
 
5336
5164
  if (!mounted) {
5337
- dispose = listen(div, "click", /*closeMenu*/ ctx[23]);
5165
+ dispose = listen(div, "click", /*closeMenu*/ ctx[25]);
5338
5166
  mounted = true;
5339
5167
  }
5340
5168
  },
@@ -5351,47 +5179,55 @@ function create_if_block_1$5(ctx) {
5351
5179
  };
5352
5180
  }
5353
5181
 
5354
- // (265:6) {#each options as option, index}
5355
- function create_each_block_1(ctx) {
5182
+ // (287:6) {#each _options as option, index (index)}
5183
+ function create_each_block_1(key_1, ctx) {
5356
5184
  let li;
5357
- let t_value = (/*option*/ ctx[47].label || /*option*/ ctx[47].value) + "";
5358
- let t;
5185
+ let t0_value = (/*option*/ ctx[48].label || /*option*/ ctx[48].value) + "";
5186
+ let t0;
5187
+ let t1;
5359
5188
  let li_id_value;
5360
5189
  let li_aria_label_value;
5361
5190
  let li_aria_selected_value;
5362
5191
  let li_data_testid_value;
5363
5192
  let li_data_index_value;
5193
+ let li_data_value_value;
5364
5194
  let li_style_value;
5365
5195
  let mounted;
5366
5196
  let dispose;
5367
5197
 
5368
5198
  function click_handler() {
5369
- return /*click_handler*/ ctx[29](/*option*/ ctx[47]);
5199
+ return /*click_handler*/ ctx[32](/*option*/ ctx[48]);
5370
5200
  }
5371
5201
 
5372
5202
  return {
5203
+ key: key_1,
5204
+ first: null,
5373
5205
  c() {
5374
5206
  li = element("li");
5375
- t = text(t_value);
5376
- attr(li, "id", li_id_value = /*option*/ ctx[47].label);
5207
+ t0 = text(t0_value);
5208
+ t1 = space();
5209
+ attr(li, "id", li_id_value = /*option*/ ctx[48].label);
5377
5210
  attr(li, "role", "option");
5378
- attr(li, "aria-label", li_aria_label_value = /*option*/ ctx[47].label || /*option*/ ctx[47].value);
5211
+ attr(li, "aria-label", li_aria_label_value = /*option*/ ctx[48].label || /*option*/ ctx[48].value);
5379
5212
 
5380
- attr(li, "aria-selected", li_aria_selected_value = /*_values*/ ctx[15].includes(/*option*/ ctx[47].value)
5213
+ attr(li, "aria-selected", li_aria_selected_value = /*_values*/ ctx[12].includes(/*option*/ ctx[48].value)
5381
5214
  ? "true"
5382
5215
  : "false");
5383
5216
 
5384
- attr(li, "class", "dropdown-option");
5385
- attr(li, "data-testid", li_data_testid_value = `dropdown-item-${/*option*/ ctx[47].value}`);
5386
- attr(li, "data-index", li_data_index_value = /*index*/ ctx[51]);
5217
+ attr(li, "class", "dropdown-item");
5218
+ attr(li, "data-testid", li_data_testid_value = `dropdown-item-${/*option*/ ctx[48].value}`);
5219
+ attr(li, "data-index", li_data_index_value = /*index*/ ctx[52]);
5220
+ attr(li, "data-value", li_data_value_value = /*option*/ ctx[48].value);
5387
5221
  attr(li, "style", li_style_value = `display: ${"block"}`);
5388
- toggle_class(li, "dropdown-option--disabled", false);
5389
- toggle_class(li, "dropdown-option--tabbed", /*index*/ ctx[51] === /*highlightedIndex*/ ctx[19]);
5390
- toggle_class(li, "dropdown-option--selected", /*_values*/ ctx[15].includes(/*option*/ ctx[47].value));
5222
+ toggle_class(li, "dropdown-item--disabled", false);
5223
+ toggle_class(li, "dropdown-item--tabbed", /*index*/ ctx[52] === /*_highlightedIndex*/ ctx[16]);
5224
+ toggle_class(li, "dropdown-item--selected", /*_values*/ ctx[12].includes(/*option*/ ctx[48].value));
5225
+ this.first = li;
5391
5226
  },
5392
5227
  m(target, anchor) {
5393
5228
  insert(target, li, anchor);
5394
- append(li, t);
5229
+ append(li, t0);
5230
+ append(li, t1);
5395
5231
 
5396
5232
  if (!mounted) {
5397
5233
  dispose = listen(li, "click", click_handler);
@@ -5400,32 +5236,40 @@ function create_each_block_1(ctx) {
5400
5236
  },
5401
5237
  p(new_ctx, dirty) {
5402
5238
  ctx = new_ctx;
5403
- if (dirty[0] & /*options*/ 65536 && t_value !== (t_value = (/*option*/ ctx[47].label || /*option*/ ctx[47].value) + "")) set_data(t, t_value);
5239
+ if (dirty[0] & /*_options*/ 8192 && t0_value !== (t0_value = (/*option*/ ctx[48].label || /*option*/ ctx[48].value) + "")) set_data(t0, t0_value);
5404
5240
 
5405
- if (dirty[0] & /*options*/ 65536 && li_id_value !== (li_id_value = /*option*/ ctx[47].label)) {
5241
+ if (dirty[0] & /*_options*/ 8192 && li_id_value !== (li_id_value = /*option*/ ctx[48].label)) {
5406
5242
  attr(li, "id", li_id_value);
5407
5243
  }
5408
5244
 
5409
- if (dirty[0] & /*options*/ 65536 && li_aria_label_value !== (li_aria_label_value = /*option*/ ctx[47].label || /*option*/ ctx[47].value)) {
5245
+ if (dirty[0] & /*_options*/ 8192 && li_aria_label_value !== (li_aria_label_value = /*option*/ ctx[48].label || /*option*/ ctx[48].value)) {
5410
5246
  attr(li, "aria-label", li_aria_label_value);
5411
5247
  }
5412
5248
 
5413
- if (dirty[0] & /*_values, options*/ 98304 && li_aria_selected_value !== (li_aria_selected_value = /*_values*/ ctx[15].includes(/*option*/ ctx[47].value)
5249
+ if (dirty[0] & /*_values, _options*/ 12288 && li_aria_selected_value !== (li_aria_selected_value = /*_values*/ ctx[12].includes(/*option*/ ctx[48].value)
5414
5250
  ? "true"
5415
5251
  : "false")) {
5416
5252
  attr(li, "aria-selected", li_aria_selected_value);
5417
5253
  }
5418
5254
 
5419
- if (dirty[0] & /*options*/ 65536 && li_data_testid_value !== (li_data_testid_value = `dropdown-item-${/*option*/ ctx[47].value}`)) {
5255
+ if (dirty[0] & /*_options*/ 8192 && li_data_testid_value !== (li_data_testid_value = `dropdown-item-${/*option*/ ctx[48].value}`)) {
5420
5256
  attr(li, "data-testid", li_data_testid_value);
5421
5257
  }
5422
5258
 
5423
- if (dirty[0] & /*highlightedIndex*/ 524288) {
5424
- toggle_class(li, "dropdown-option--tabbed", /*index*/ ctx[51] === /*highlightedIndex*/ ctx[19]);
5259
+ if (dirty[0] & /*_options*/ 8192 && li_data_index_value !== (li_data_index_value = /*index*/ ctx[52])) {
5260
+ attr(li, "data-index", li_data_index_value);
5261
+ }
5262
+
5263
+ if (dirty[0] & /*_options*/ 8192 && li_data_value_value !== (li_data_value_value = /*option*/ ctx[48].value)) {
5264
+ attr(li, "data-value", li_data_value_value);
5425
5265
  }
5426
5266
 
5427
- if (dirty[0] & /*_values, options*/ 98304) {
5428
- toggle_class(li, "dropdown-option--selected", /*_values*/ ctx[15].includes(/*option*/ ctx[47].value));
5267
+ if (dirty[0] & /*_options, _highlightedIndex*/ 73728) {
5268
+ toggle_class(li, "dropdown-item--tabbed", /*index*/ ctx[52] === /*_highlightedIndex*/ ctx[16]);
5269
+ }
5270
+
5271
+ if (dirty[0] & /*_values, _options*/ 12288) {
5272
+ toggle_class(li, "dropdown-item--selected", /*_values*/ ctx[12].includes(/*option*/ ctx[48].value));
5429
5273
  }
5430
5274
  },
5431
5275
  d(detaching) {
@@ -5436,10 +5280,10 @@ function create_each_block_1(ctx) {
5436
5280
  };
5437
5281
  }
5438
5282
 
5439
- // (214:6) {#each options as option (option.value)}
5440
- function create_each_block$4(key_1, ctx) {
5283
+ // (234:6) {#each _options as option}
5284
+ function create_each_block$4(ctx) {
5441
5285
  let option;
5442
- let t0_value = (/*option*/ ctx[47].label || /*option*/ ctx[47].value) + "";
5286
+ let t0_value = /*option*/ ctx[48].label + "";
5443
5287
  let t0;
5444
5288
  let t1;
5445
5289
  let option_selected_value;
@@ -5447,37 +5291,33 @@ function create_each_block$4(key_1, ctx) {
5447
5291
  let option_aria_label_value;
5448
5292
 
5449
5293
  return {
5450
- key: key_1,
5451
- first: null,
5452
5294
  c() {
5453
5295
  option = element("option");
5454
5296
  t0 = text(t0_value);
5455
5297
  t1 = space();
5456
- option.selected = option_selected_value = /*option*/ ctx[47].value === /*value*/ ctx[2];
5457
- option.__value = option_value_value = /*option*/ ctx[47].value;
5298
+ option.selected = option_selected_value = /*option*/ ctx[48].selected;
5299
+ option.__value = option_value_value = /*option*/ ctx[48].value;
5458
5300
  option.value = option.__value;
5459
- attr(option, "aria-label", option_aria_label_value = /*option*/ ctx[47].label || /*option*/ ctx[47].value);
5460
- this.first = option;
5301
+ attr(option, "aria-label", option_aria_label_value = /*option*/ ctx[48].label);
5461
5302
  },
5462
5303
  m(target, anchor) {
5463
5304
  insert(target, option, anchor);
5464
5305
  append(option, t0);
5465
5306
  append(option, t1);
5466
5307
  },
5467
- p(new_ctx, dirty) {
5468
- ctx = new_ctx;
5469
- if (dirty[0] & /*options*/ 65536 && t0_value !== (t0_value = (/*option*/ ctx[47].label || /*option*/ ctx[47].value) + "")) set_data(t0, t0_value);
5308
+ p(ctx, dirty) {
5309
+ if (dirty[0] & /*_options*/ 8192 && t0_value !== (t0_value = /*option*/ ctx[48].label + "")) set_data(t0, t0_value);
5470
5310
 
5471
- if (dirty[0] & /*options, value*/ 65540 && option_selected_value !== (option_selected_value = /*option*/ ctx[47].value === /*value*/ ctx[2])) {
5311
+ if (dirty[0] & /*_options*/ 8192 && option_selected_value !== (option_selected_value = /*option*/ ctx[48].selected)) {
5472
5312
  option.selected = option_selected_value;
5473
5313
  }
5474
5314
 
5475
- if (dirty[0] & /*options*/ 65536 && option_value_value !== (option_value_value = /*option*/ ctx[47].value)) {
5315
+ if (dirty[0] & /*_options*/ 8192 && option_value_value !== (option_value_value = /*option*/ ctx[48].value)) {
5476
5316
  option.__value = option_value_value;
5477
5317
  option.value = option.__value;
5478
5318
  }
5479
5319
 
5480
- if (dirty[0] & /*options*/ 65536 && option_aria_label_value !== (option_aria_label_value = /*option*/ ctx[47].label || /*option*/ ctx[47].value)) {
5320
+ if (dirty[0] & /*_options*/ 8192 && option_aria_label_value !== (option_aria_label_value = /*option*/ ctx[48].label)) {
5481
5321
  attr(option, "aria-label", option_aria_label_value);
5482
5322
  }
5483
5323
  },
@@ -5493,7 +5333,7 @@ function create_fragment$p(ctx) {
5493
5333
  let div_style_value;
5494
5334
 
5495
5335
  function select_block_type(ctx, dirty) {
5496
- if (/*_native*/ ctx[14]) return create_if_block$a;
5336
+ if (/*_native*/ ctx[22]) return create_if_block$a;
5497
5337
  return create_else_block$1;
5498
5338
  }
5499
5339
 
@@ -5509,16 +5349,16 @@ function create_fragment$p(ctx) {
5509
5349
  attr(div, "class", "dropdown");
5510
5350
 
5511
5351
  attr(div, "style", div_style_value = `
5512
- ${calculateMargin(/*mt*/ ctx[9], /*mr*/ ctx[10], /*mb*/ ctx[11], /*ml*/ ctx[12])}
5513
- --width: ${/*width*/ ctx[6] || /*computedWidth*/ ctx[20]}
5352
+ ${calculateMargin(/*mt*/ ctx[8], /*mr*/ ctx[9], /*mb*/ ctx[10], /*ml*/ ctx[11])}
5353
+ --width: ${/*width*/ ctx[5] || /*_computedWidth*/ ctx[17]}
5514
5354
  `);
5515
5355
 
5516
- toggle_class(div, "dropdown-native", /*_native*/ ctx[14]);
5356
+ toggle_class(div, "dropdown-native", /*_native*/ ctx[22]);
5517
5357
  },
5518
5358
  m(target, anchor) {
5519
5359
  insert(target, div, anchor);
5520
5360
  if_block.m(div, null);
5521
- /*div_binding*/ ctx[31](div);
5361
+ /*div_binding*/ ctx[34](div);
5522
5362
  },
5523
5363
  p(ctx, dirty) {
5524
5364
  if (current_block_type === (current_block_type = select_block_type(ctx)) && if_block) {
@@ -5537,15 +5377,15 @@ function create_fragment$p(ctx) {
5537
5377
  attr(div, "data-testid", div_data_testid_value);
5538
5378
  }
5539
5379
 
5540
- if (dirty[0] & /*mt, mr, mb, ml, width, computedWidth*/ 1056320 && div_style_value !== (div_style_value = `
5541
- ${calculateMargin(/*mt*/ ctx[9], /*mr*/ ctx[10], /*mb*/ ctx[11], /*ml*/ ctx[12])}
5542
- --width: ${/*width*/ ctx[6] || /*computedWidth*/ ctx[20]}
5380
+ if (dirty[0] & /*mt, mr, mb, ml, width, _computedWidth*/ 134944 && div_style_value !== (div_style_value = `
5381
+ ${calculateMargin(/*mt*/ ctx[8], /*mr*/ ctx[9], /*mb*/ ctx[10], /*ml*/ ctx[11])}
5382
+ --width: ${/*width*/ ctx[5] || /*_computedWidth*/ ctx[17]}
5543
5383
  `)) {
5544
5384
  attr(div, "style", div_style_value);
5545
5385
  }
5546
5386
 
5547
- if (dirty[0] & /*_native*/ 16384) {
5548
- toggle_class(div, "dropdown-native", /*_native*/ ctx[14]);
5387
+ if (dirty[0] & /*_native*/ 4194304) {
5388
+ toggle_class(div, "dropdown-native", /*_native*/ ctx[22]);
5549
5389
  }
5550
5390
  },
5551
5391
  i: noop,
@@ -5553,22 +5393,37 @@ function create_fragment$p(ctx) {
5553
5393
  d(detaching) {
5554
5394
  if (detaching) detach(div);
5555
5395
  if_block.d();
5556
- /*div_binding*/ ctx[31](null);
5396
+ /*div_binding*/ ctx[34](null);
5557
5397
  }
5558
5398
  };
5559
5399
  }
5560
5400
 
5561
- const MAX_HEIGHT = "276px";
5401
+ function getCustomDropdownWidth(options) {
5402
+ let width;
5403
+ let maxCount = 0;
5562
5404
 
5563
- function instance$n($$self, $$props, $$invalidate) {
5405
+ options.forEach(option => {
5406
+ const label = option.label || option.value || "";
5407
+
5408
+ if (!width && maxCount < label.length) {
5409
+ maxCount = label.length;
5410
+ width = `${Math.max(20, maxCount + 12)}ch`;
5411
+ }
5412
+ });
5413
+
5414
+ return width;
5415
+ }
5416
+
5417
+ function instance$m($$self, $$props, $$invalidate) {
5564
5418
  let _disabled;
5419
+ let _error;
5565
5420
  let _multiselect;
5566
5421
  let _native;
5567
5422
  let { name } = $$props;
5568
5423
  let { arialabel = "" } = $$props;
5569
5424
  let { value = "" } = $$props;
5570
5425
  let { leadingicon = null } = $$props;
5571
- let { maxheight = MAX_HEIGHT } = $$props;
5426
+ let { maxheight = "276px" } = $$props;
5572
5427
  let { placeholder = "" } = $$props;
5573
5428
  let { width = "" } = $$props;
5574
5429
  let { disabled = "false" } = $$props;
@@ -5583,39 +5438,79 @@ function instance$n($$self, $$props, $$invalidate) {
5583
5438
  // Private
5584
5439
  let _values = [];
5585
5440
 
5586
- let options = [];
5587
- let selectedLabel = "";
5588
- let isMenuVisible = false;
5589
- let highlightedIndex = 0;
5590
- let maxLetterCount = 0;
5591
- let computedWidth;
5592
- let el;
5593
- let menuEl;
5594
- let ctx;
5595
- let isBound = false;
5441
+ let _options = [];
5442
+ let _selectedLabel = "";
5443
+ let _isMenuVisible = false;
5444
+ let _highlightedIndex = 0;
5445
+ let _computedWidth;
5446
+ let _el;
5447
+ let _menuEl;
5448
+ let _selectEl;
5596
5449
 
5597
- onMount(() => {
5598
- validateRequired("GoADropdown", { name });
5450
+ onMount(async () => {
5451
+ await tick();
5452
+ $$invalidate(12, _values = parseValues());
5453
+ $$invalidate(13, _options = getOptions());
5454
+
5455
+ if (!_native) {
5456
+ $$invalidate(17, _computedWidth = getCustomDropdownWidth(_options));
5457
+ addKeyboardEventListeners();
5458
+ setHighlightedIndexToSelected();
5459
+ }
5599
5460
  });
5600
5461
 
5601
5462
  onDestroy(() => {
5602
5463
  removeKeyboardEventListeners();
5603
- deleteContext(name);
5604
5464
  });
5605
5465
 
5606
5466
  // Functions
5467
+ function getChildren() {
5468
+ const slot = _el.querySelector("slot");
5469
+
5470
+ if (slot) {
5471
+ // default
5472
+ return slot.assignedElements();
5473
+ }
5474
+
5475
+ // unit tests
5476
+ const el = _native ? _selectEl : _el;
5477
+
5478
+ return [...el.children];
5479
+ }
5480
+
5481
+ // Create a list of the options based on the children within the slot
5482
+ // The children don't have to be goa-dropdown-item elements. Any child element
5483
+ // work as long as it has a value and label content
5484
+ function getOptions() {
5485
+ const children = getChildren();
5486
+
5487
+ return children.map(el => {
5488
+ const option = el;
5489
+ const value = el.getAttribute("value") || option.value;
5490
+ const label = el.getAttribute("label") || option.label || value;
5491
+ const selected = _values.includes(value);
5492
+
5493
+ if (selected) {
5494
+ $$invalidate(14, _selectedLabel = label);
5495
+ $$invalidate(12, _values = [value]);
5496
+ }
5497
+
5498
+ return { selected, value, label };
5499
+ });
5500
+ }
5501
+
5607
5502
  function addKeyboardEventListeners() {
5608
- el.addEventListener("focus", onFocus, true);
5609
- el.addEventListener("blur", onBlur, true);
5503
+ _el.addEventListener("focus", onFocus, true);
5504
+ _el.addEventListener("blur", onBlur, true);
5610
5505
  }
5611
5506
 
5612
5507
  function removeKeyboardEventListeners() {
5613
- el.removeEventListener("focus", onFocus, true);
5614
- el.removeEventListener("blur", onBlur, true);
5508
+ _el.removeEventListener("focus", onFocus, true);
5509
+ _el.removeEventListener("blur", onBlur, true);
5615
5510
  }
5616
5511
 
5512
+ // parse and convert values to strings to avoid later type comparison issues
5617
5513
  function parseValues() {
5618
- // parse and convert values to strings to avoid later type comparison issues
5619
5514
  let rawValue;
5620
5515
 
5621
5516
  try {
@@ -5627,75 +5522,54 @@ function instance$n($$self, $$props, $$invalidate) {
5627
5522
  const rawValues = typeof rawValue === "object" ? rawValue : [rawValue];
5628
5523
 
5629
5524
  // convert all values to strings to avoid later type comparison issues
5630
- $$invalidate(15, _values = rawValues.map(val => `${val}`));
5631
- }
5632
-
5633
- function bindContext() {
5634
- ctx = getContext(name);
5635
-
5636
- ctx.subscribe(data => {
5637
- const _data = data;
5638
- const selected = _values.includes(_data.value);
5639
- const label = _data.label || _data.value;
5640
- $$invalidate(16, options = [...options, Object.assign(Object.assign({}, _data), { selected })]);
5641
-
5642
- if (selected) {
5643
- $$invalidate(17, selectedLabel = label);
5644
- }
5645
-
5646
- if (!width && maxLetterCount < label.length) {
5647
- maxLetterCount = label.length;
5648
- $$invalidate(20, computedWidth = `${Math.max(20, maxLetterCount + 12)}ch`);
5649
- }
5650
-
5651
- setHighlightedIndexToSelected();
5652
- });
5525
+ return rawValues.map(val => `${val}`);
5653
5526
  }
5654
5527
 
5655
5528
  async function showMenu() {
5656
- if (_disabled || isMenuVisible) {
5529
+ if (_disabled || _isMenuVisible) {
5657
5530
  return;
5658
5531
  }
5659
5532
 
5660
- $$invalidate(18, isMenuVisible = true);
5533
+ $$invalidate(15, _isMenuVisible = true);
5661
5534
  await tick();
5662
5535
 
5663
5536
  // hide menu on blur
5664
- menuEl.addEventListener("blur", closeMenu);
5537
+ _menuEl.addEventListener("blur", closeMenu);
5665
5538
 
5666
5539
  // bind up/down arrows to navigate options
5667
- menuEl.addEventListener("mouseover", onHighlight);
5540
+ _menuEl.addEventListener("mouseover", onHighlight);
5668
5541
  }
5669
5542
 
5670
5543
  function closeMenu() {
5671
- menuEl.removeEventListener("blur", closeMenu);
5672
- menuEl.removeEventListener("mouseover", onHighlight);
5544
+ _menuEl.removeEventListener("blur", closeMenu);
5545
+ _menuEl.removeEventListener("mouseover", onHighlight);
5673
5546
  setHighlightedIndexToSelected();
5674
- $$invalidate(18, isMenuVisible = false);
5547
+ $$invalidate(15, _isMenuVisible = false);
5675
5548
  }
5676
5549
 
5677
5550
  function setHighlightedIndexToSelected() {
5678
- $$invalidate(19, highlightedIndex = options.findIndex(option => _values.includes(option.value)));
5551
+ $$invalidate(16, _highlightedIndex = _options.findIndex(option => _values.includes(option.value)));
5679
5552
  }
5680
5553
 
5681
5554
  // Event handlers
5555
+ /**
5556
+ * @property value the selected value
5557
+ */
5682
5558
  function onSelect(value, label, close) {
5683
5559
  if (_disabled) return;
5684
- $$invalidate(17, selectedLabel = label);
5560
+ $$invalidate(14, _selectedLabel = label);
5561
+ let detail;
5685
5562
 
5686
5563
  if (_multiselect) {
5687
5564
  _values.push(value);
5688
-
5689
- el.dispatchEvent(new CustomEvent("_change",
5690
- {
5691
- composed: true,
5692
- detail: { name, values: _values }
5693
- }));
5565
+ detail = { name, values: _values };
5694
5566
  } else {
5695
- $$invalidate(15, _values = [value]);
5696
- el.dispatchEvent(new CustomEvent("_change", { composed: true, detail: { name, value } }));
5567
+ $$invalidate(12, _values = [value]);
5568
+ detail = { name, value };
5697
5569
  }
5698
5570
 
5571
+ _el.dispatchEvent(new CustomEvent("_change", { composed: true, detail }));
5572
+
5699
5573
  if (close) {
5700
5574
  closeMenu();
5701
5575
  }
@@ -5705,16 +5579,16 @@ function instance$n($$self, $$props, $$invalidate) {
5705
5579
  switch (e.key) {
5706
5580
  case " ":
5707
5581
  case "Enter":
5708
- isMenuVisible ? closeMenu() : showMenu();
5582
+ _isMenuVisible ? closeMenu() : showMenu();
5709
5583
  e.preventDefault();
5710
5584
  break;
5711
5585
  case "Escape":
5712
- isMenuVisible && closeMenu();
5586
+ _isMenuVisible && closeMenu();
5713
5587
  e.preventDefault();
5714
5588
  break;
5715
5589
  case "ArrowDown":
5716
5590
  if (e.altKey) {
5717
- isMenuVisible ? closeMenu() : showMenu();
5591
+ _isMenuVisible ? closeMenu() : showMenu();
5718
5592
  break;
5719
5593
  }
5720
5594
  _handleArrowDown();
@@ -5722,7 +5596,7 @@ function instance$n($$self, $$props, $$invalidate) {
5722
5596
  break;
5723
5597
  case "ArrowUp":
5724
5598
  if (e.altKey) {
5725
- isMenuVisible ? closeMenu() : showMenu();
5599
+ _isMenuVisible ? closeMenu() : showMenu();
5726
5600
  break;
5727
5601
  }
5728
5602
  _handleArrowUp();
@@ -5732,110 +5606,102 @@ function instance$n($$self, $$props, $$invalidate) {
5732
5606
  };
5733
5607
 
5734
5608
  function _handleArrowDown() {
5735
- if (highlightedIndex < options.length - 1) {
5736
- $$invalidate(19, highlightedIndex++, highlightedIndex);
5737
- onSelect(options[highlightedIndex].value, options[highlightedIndex].label, false);
5609
+ if (_highlightedIndex < _options.length - 1) {
5610
+ $$invalidate(16, _highlightedIndex++, _highlightedIndex);
5611
+ onSelect(_options[_highlightedIndex].value, _options[_highlightedIndex].label, false);
5738
5612
  }
5739
5613
  }
5740
5614
 
5741
5615
  function _handleArrowUp() {
5742
- if (highlightedIndex > 0) {
5743
- $$invalidate(19, highlightedIndex--, highlightedIndex);
5744
- onSelect(options[highlightedIndex].value, options[highlightedIndex].label, false);
5616
+ if (_highlightedIndex > 0) {
5617
+ $$invalidate(16, _highlightedIndex--, _highlightedIndex);
5618
+ onSelect(_options[_highlightedIndex].value, _options[_highlightedIndex].label, false);
5745
5619
  }
5746
5620
  }
5747
5621
 
5748
5622
  // add required bindings to component
5749
5623
  function onFocus() {
5750
- el.addEventListener("keydown", onInputKeyDown);
5624
+ _el.addEventListener("keydown", onInputKeyDown);
5751
5625
  }
5752
5626
 
5753
5627
  // remove all bindings from component
5754
5628
  function onBlur() {
5755
- el.removeEventListener("keydown", onInputKeyDown);
5629
+ _el.removeEventListener("keydown", onInputKeyDown);
5756
5630
  }
5757
5631
 
5758
5632
  function onHighlight(e) {
5759
- $$invalidate(19, highlightedIndex = Number(e.target.dataset.index));
5633
+ $$invalidate(16, _highlightedIndex = Number(e.target.dataset.index));
5760
5634
  }
5761
5635
 
5762
5636
  function onNativeSelect(e) {
5763
5637
  const target = e.currentTarget;
5764
- const option = options[target.selectedIndex];
5765
- onSelect(option.value, option.label, false);
5638
+ const option = _options[target.selectedIndex];
5639
+ onSelect(option.value, option.label);
5640
+ }
5641
+
5642
+ function select_binding($$value) {
5643
+ binding_callbacks[$$value ? 'unshift' : 'push'](() => {
5644
+ _selectEl = $$value;
5645
+ $$invalidate(20, _selectEl);
5646
+ $$invalidate(13, _options);
5647
+ });
5766
5648
  }
5767
5649
 
5768
5650
  const click_handler = option => onSelect(option.value, option.label, true);
5769
5651
 
5770
5652
  function ul_binding($$value) {
5771
5653
  binding_callbacks[$$value ? 'unshift' : 'push'](() => {
5772
- menuEl = $$value;
5773
- $$invalidate(21, menuEl);
5654
+ _menuEl = $$value;
5655
+ $$invalidate(19, _menuEl);
5774
5656
  });
5775
5657
  }
5776
5658
 
5777
5659
  function div_binding($$value) {
5778
5660
  binding_callbacks[$$value ? 'unshift' : 'push'](() => {
5779
- el = $$value;
5780
- $$invalidate(13, el);
5661
+ _el = $$value;
5662
+ $$invalidate(18, _el);
5781
5663
  });
5782
5664
  }
5783
5665
 
5784
5666
  $$self.$$set = $$props => {
5785
5667
  if ('name' in $$props) $$invalidate(0, name = $$props.name);
5786
5668
  if ('arialabel' in $$props) $$invalidate(1, arialabel = $$props.arialabel);
5787
- if ('value' in $$props) $$invalidate(2, value = $$props.value);
5788
- if ('leadingicon' in $$props) $$invalidate(3, leadingicon = $$props.leadingicon);
5789
- if ('maxheight' in $$props) $$invalidate(4, maxheight = $$props.maxheight);
5790
- if ('placeholder' in $$props) $$invalidate(5, placeholder = $$props.placeholder);
5791
- if ('width' in $$props) $$invalidate(6, width = $$props.width);
5792
- if ('disabled' in $$props) $$invalidate(7, disabled = $$props.disabled);
5793
- if ('error' in $$props) $$invalidate(8, error = $$props.error);
5794
- if ('multiselect' in $$props) $$invalidate(26, multiselect = $$props.multiselect);
5795
- if ('native' in $$props) $$invalidate(27, native = $$props.native);
5796
- if ('mt' in $$props) $$invalidate(9, mt = $$props.mt);
5797
- if ('mr' in $$props) $$invalidate(10, mr = $$props.mr);
5798
- if ('mb' in $$props) $$invalidate(11, mb = $$props.mb);
5799
- if ('ml' in $$props) $$invalidate(12, ml = $$props.ml);
5669
+ if ('value' in $$props) $$invalidate(28, value = $$props.value);
5670
+ if ('leadingicon' in $$props) $$invalidate(2, leadingicon = $$props.leadingicon);
5671
+ if ('maxheight' in $$props) $$invalidate(3, maxheight = $$props.maxheight);
5672
+ if ('placeholder' in $$props) $$invalidate(4, placeholder = $$props.placeholder);
5673
+ if ('width' in $$props) $$invalidate(5, width = $$props.width);
5674
+ if ('disabled' in $$props) $$invalidate(6, disabled = $$props.disabled);
5675
+ if ('error' in $$props) $$invalidate(7, error = $$props.error);
5676
+ if ('multiselect' in $$props) $$invalidate(29, multiselect = $$props.multiselect);
5677
+ if ('native' in $$props) $$invalidate(30, native = $$props.native);
5678
+ if ('mt' in $$props) $$invalidate(8, mt = $$props.mt);
5679
+ if ('mr' in $$props) $$invalidate(9, mr = $$props.mr);
5680
+ if ('mb' in $$props) $$invalidate(10, mb = $$props.mb);
5681
+ if ('ml' in $$props) $$invalidate(11, ml = $$props.ml);
5800
5682
  };
5801
5683
 
5802
5684
  $$self.$$.update = () => {
5803
- if ($$self.$$.dirty[0] & /*disabled*/ 128) {
5804
- _disabled = toBoolean(disabled);
5685
+ if ($$self.$$.dirty[0] & /*disabled*/ 64) {
5686
+ $$invalidate(21, _disabled = toBoolean(disabled));
5805
5687
  }
5806
5688
 
5807
- if ($$self.$$.dirty[0] & /*multiselect*/ 67108864) {
5808
- _multiselect = toBoolean(multiselect);
5689
+ if ($$self.$$.dirty[0] & /*error*/ 128) {
5690
+ $$invalidate(23, _error = toBoolean(error));
5809
5691
  }
5810
5692
 
5811
- if ($$self.$$.dirty[0] & /*native*/ 134217728) {
5812
- $$invalidate(14, _native = toBoolean(native));
5693
+ if ($$self.$$.dirty[0] & /*multiselect*/ 536870912) {
5694
+ _multiselect = toBoolean(multiselect);
5813
5695
  }
5814
5696
 
5815
- if ($$self.$$.dirty[0] & /*name, el, isBound, _native*/ 268460033) {
5816
- {
5817
- (async () => {
5818
- await tick();
5819
-
5820
- if (name && el && !isBound) {
5821
- $$invalidate(28, isBound = true);
5822
-
5823
- if (!_native) {
5824
- addKeyboardEventListeners();
5825
- }
5826
-
5827
- parseValues();
5828
- bindContext();
5829
- }
5830
- })();
5831
- }
5697
+ if ($$self.$$.dirty[0] & /*native*/ 1073741824) {
5698
+ $$invalidate(22, _native = toBoolean(native));
5832
5699
  }
5833
5700
  };
5834
5701
 
5835
5702
  return [
5836
5703
  name,
5837
5704
  arialabel,
5838
- value,
5839
5705
  leadingicon,
5840
5706
  maxheight,
5841
5707
  placeholder,
@@ -5846,22 +5712,26 @@ function instance$n($$self, $$props, $$invalidate) {
5846
5712
  mr,
5847
5713
  mb,
5848
5714
  ml,
5849
- el,
5850
- _native,
5851
5715
  _values,
5852
- options,
5853
- selectedLabel,
5854
- isMenuVisible,
5855
- highlightedIndex,
5856
- computedWidth,
5857
- menuEl,
5716
+ _options,
5717
+ _selectedLabel,
5718
+ _isMenuVisible,
5719
+ _highlightedIndex,
5720
+ _computedWidth,
5721
+ _el,
5722
+ _menuEl,
5723
+ _selectEl,
5724
+ _disabled,
5725
+ _native,
5726
+ _error,
5858
5727
  showMenu,
5859
5728
  closeMenu,
5860
5729
  onSelect,
5861
5730
  onNativeSelect,
5731
+ value,
5862
5732
  multiselect,
5863
5733
  native,
5864
- isBound,
5734
+ select_binding,
5865
5735
  click_handler,
5866
5736
  ul_binding,
5867
5737
  div_binding
@@ -5871,7 +5741,7 @@ function instance$n($$self, $$props, $$invalidate) {
5871
5741
  class Dropdown extends SvelteElement {
5872
5742
  constructor(options) {
5873
5743
  super();
5874
- this.shadowRoot.innerHTML = `<style>:host{box-sizing:border-box;font-family:var(--font-family)}.dropdown{position:relative;cursor:pointer;display:inline-block;width:100%}@media(min-width: 640px){.dropdown{width:var(--width)}}.dropdown-background{cursor:default;position:fixed;z-index:98;inset:0}.dropdown-list{position:absolute;left:0;right:0;padding:0;margin:0;margin-top:3px;list-style-type:none;background:var(--color-white);border-radius:var(--input-border-radius);outline:none;box-shadow:var(--shadow-1);z-index:99;scroll-behavior:smooth;scrollbar-width:thin;display:none}.dropdown-active{display:block}.dropdown-list::-webkit-scrollbar{width:6px}.dropdown-list::-webkit-scrollbar-track{background:#f1f1f1}.dropdown-list::-webkit-scrollbar-thumb{background:#888}.dropdown-list::-webkit-scrollbar-thumb:hover{background:#555}.dropdown-option{margin:0;padding:0.5rem;cursor:pointer;color:var(--color-black);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.dropdown-option--tabbed{background:var(--color-gray-100);color:var(--goa-color-interactive--hover)}.dropdown-option--disabled{opacity:0.5;cursor:default}.dropdown-option--disabled:hover{cursor:default;color:var(--color-gray-600)}.dropdown-option--selected{background:var(--goa-color-interactive);color:var(--color-white)}.dropdown-option--tabbed.dropdown-option--selected,.dropdown-option--selected:hover{background:var(--goa-color-interactive--hover);color:var(--color-white)}.dropdown-native{border:1px solid var(--color-gray-600);border-radius:var(--input-border-radius);background-color:var(--color-white)}select{border:none;background-color:transparent;color:var(--goa-color-text);font-size:var(--input-font-size);appearance:none;padding:calc(var(--input-padding) + 2px);padding-left:0.5rem;padding-right:2rem;outline:none;width:100%}.dropdown-native::after{content:"";position:absolute;right:0.6rem;top:0.6rem;pointer-events:none;width:1.5rem;height:1.5rem;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 512 512'><path fill='none' stroke='%23333333' stroke-linecap='round' stroke-linejoin='round' stroke-width='48' d='M112 184l144 144 144-144' /%3E%3C/svg%3E");background-repeat:none}.dropdown-native:focus-within{box-shadow:0 0 0 3px var(--goa-color-interactive--focus)}</style>`;
5744
+ this.shadowRoot.innerHTML = `<style>:host{box-sizing:border-box;font-family:var(--font-family)}.dropdown{position:relative;cursor:pointer;display:inline-block;width:100%}@media(min-width: 640px){.dropdown{width:var(--width)}}.dropdown-background{cursor:default;position:fixed;z-index:98;inset:0}.dropdown-list{position:absolute;left:0;right:0;padding:0;margin:0;margin-top:3px;list-style-type:none;background:var(--color-white);border-radius:var(--input-border-radius);outline:none;box-shadow:var(--shadow-1);z-index:99;scroll-behavior:smooth;scrollbar-width:thin;display:none}.dropdown-active{display:block}.dropdown-list::-webkit-scrollbar{width:6px}.dropdown-list::-webkit-scrollbar-track{background:#f1f1f1}.dropdown-list::-webkit-scrollbar-thumb{background:#888}.dropdown-list::-webkit-scrollbar-thumb:hover{background:#555}.dropdown-item{margin:0;padding:0.5rem;cursor:pointer;color:var(--color-black);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.dropdown-item--tabbed{background:var(--color-gray-100);color:var(--goa-color-interactive--hover)}.dropdown-item--disabled{opacity:0.5;cursor:default}.dropdown-item--disabled:hover{cursor:default;color:var(--color-gray-600)}.dropdown-item--selected{background:var(--goa-color-interactive);color:var(--color-white)}.dropdown-item--tabbed.dropdown-item--selected,.dropdown-item--selected:hover{background:var(--goa-color-interactive--hover);color:var(--color-white)}.dropdown-native{border:1px solid var(--color-gray-600);border-radius:var(--input-border-radius);background-color:var(--color-white)}.dropdown-native:has(select:disabled){background-color:var(--color-gray-100);border-color:var(--color-gray-200);box-shadow:none;color:var(--goa-color-text-secondary);cursor:default}.dropdown-native:has(select.error){border:2px solid var(--goa-color-interactive--error)}select{border:none;background-color:transparent;color:var(--goa-color-text);font-size:var(--input-font-size);appearance:none;padding:calc(var(--input-padding) + 2px);padding-left:0.5rem;padding-right:3rem;outline:none;width:100%}.dropdown-native::after{content:"";position:absolute;right:0.6rem;top:0.6rem;pointer-events:none;width:1.5rem;height:1.5rem;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 512 512'><path fill='none' stroke='%23333333' stroke-linecap='round' stroke-linejoin='round' stroke-width='48' d='M112 184l144 144 144-144' /%3E%3C/svg%3E");background-repeat:none}.dropdown-native:focus-within{box-shadow:0 0 0 3px var(--goa-color-interactive--focus)}</style>`;
5875
5745
 
5876
5746
  init(
5877
5747
  this,
@@ -5880,25 +5750,25 @@ class Dropdown extends SvelteElement {
5880
5750
  props: attribute_to_object(this.attributes),
5881
5751
  customElement: true
5882
5752
  },
5883
- instance$n,
5753
+ instance$m,
5884
5754
  create_fragment$p,
5885
5755
  safe_not_equal,
5886
5756
  {
5887
5757
  name: 0,
5888
5758
  arialabel: 1,
5889
- value: 2,
5890
- leadingicon: 3,
5891
- maxheight: 4,
5892
- placeholder: 5,
5893
- width: 6,
5894
- disabled: 7,
5895
- error: 8,
5896
- multiselect: 26,
5897
- native: 27,
5898
- mt: 9,
5899
- mr: 10,
5900
- mb: 11,
5901
- ml: 12
5759
+ value: 28,
5760
+ leadingicon: 2,
5761
+ maxheight: 3,
5762
+ placeholder: 4,
5763
+ width: 5,
5764
+ disabled: 6,
5765
+ error: 7,
5766
+ multiselect: 29,
5767
+ native: 30,
5768
+ mt: 8,
5769
+ mr: 9,
5770
+ mb: 10,
5771
+ ml: 11
5902
5772
  },
5903
5773
  null,
5904
5774
  [-1, -1]
@@ -5955,7 +5825,7 @@ class Dropdown extends SvelteElement {
5955
5825
  }
5956
5826
 
5957
5827
  get value() {
5958
- return this.$$.ctx[2];
5828
+ return this.$$.ctx[28];
5959
5829
  }
5960
5830
 
5961
5831
  set value(value) {
@@ -5964,7 +5834,7 @@ class Dropdown extends SvelteElement {
5964
5834
  }
5965
5835
 
5966
5836
  get leadingicon() {
5967
- return this.$$.ctx[3];
5837
+ return this.$$.ctx[2];
5968
5838
  }
5969
5839
 
5970
5840
  set leadingicon(leadingicon) {
@@ -5973,7 +5843,7 @@ class Dropdown extends SvelteElement {
5973
5843
  }
5974
5844
 
5975
5845
  get maxheight() {
5976
- return this.$$.ctx[4];
5846
+ return this.$$.ctx[3];
5977
5847
  }
5978
5848
 
5979
5849
  set maxheight(maxheight) {
@@ -5982,7 +5852,7 @@ class Dropdown extends SvelteElement {
5982
5852
  }
5983
5853
 
5984
5854
  get placeholder() {
5985
- return this.$$.ctx[5];
5855
+ return this.$$.ctx[4];
5986
5856
  }
5987
5857
 
5988
5858
  set placeholder(placeholder) {
@@ -5991,7 +5861,7 @@ class Dropdown extends SvelteElement {
5991
5861
  }
5992
5862
 
5993
5863
  get width() {
5994
- return this.$$.ctx[6];
5864
+ return this.$$.ctx[5];
5995
5865
  }
5996
5866
 
5997
5867
  set width(width) {
@@ -6000,7 +5870,7 @@ class Dropdown extends SvelteElement {
6000
5870
  }
6001
5871
 
6002
5872
  get disabled() {
6003
- return this.$$.ctx[7];
5873
+ return this.$$.ctx[6];
6004
5874
  }
6005
5875
 
6006
5876
  set disabled(disabled) {
@@ -6009,7 +5879,7 @@ class Dropdown extends SvelteElement {
6009
5879
  }
6010
5880
 
6011
5881
  get error() {
6012
- return this.$$.ctx[8];
5882
+ return this.$$.ctx[7];
6013
5883
  }
6014
5884
 
6015
5885
  set error(error) {
@@ -6018,7 +5888,7 @@ class Dropdown extends SvelteElement {
6018
5888
  }
6019
5889
 
6020
5890
  get multiselect() {
6021
- return this.$$.ctx[26];
5891
+ return this.$$.ctx[29];
6022
5892
  }
6023
5893
 
6024
5894
  set multiselect(multiselect) {
@@ -6027,7 +5897,7 @@ class Dropdown extends SvelteElement {
6027
5897
  }
6028
5898
 
6029
5899
  get native() {
6030
- return this.$$.ctx[27];
5900
+ return this.$$.ctx[30];
6031
5901
  }
6032
5902
 
6033
5903
  set native(native) {
@@ -6036,7 +5906,7 @@ class Dropdown extends SvelteElement {
6036
5906
  }
6037
5907
 
6038
5908
  get mt() {
6039
- return this.$$.ctx[9];
5909
+ return this.$$.ctx[8];
6040
5910
  }
6041
5911
 
6042
5912
  set mt(mt) {
@@ -6045,7 +5915,7 @@ class Dropdown extends SvelteElement {
6045
5915
  }
6046
5916
 
6047
5917
  get mr() {
6048
- return this.$$.ctx[10];
5918
+ return this.$$.ctx[9];
6049
5919
  }
6050
5920
 
6051
5921
  set mr(mr) {
@@ -6054,7 +5924,7 @@ class Dropdown extends SvelteElement {
6054
5924
  }
6055
5925
 
6056
5926
  get mb() {
6057
- return this.$$.ctx[11];
5927
+ return this.$$.ctx[10];
6058
5928
  }
6059
5929
 
6060
5930
  set mb(mb) {
@@ -6063,7 +5933,7 @@ class Dropdown extends SvelteElement {
6063
5933
  }
6064
5934
 
6065
5935
  get ml() {
6066
- return this.$$.ctx[12];
5936
+ return this.$$.ctx[11];
6067
5937
  }
6068
5938
 
6069
5939
  set ml(ml) {
@@ -6074,9 +5944,52 @@ class Dropdown extends SvelteElement {
6074
5944
 
6075
5945
  customElements.define("goa-dropdown", Dropdown);
6076
5946
 
6077
- /* libs/web-components/src/components/focus-trap/FocusTrap.svelte generated by Svelte v3.51.0 */
5947
+ /* libs/web-components/src/components/dropdown/DropdownItem.svelte generated by Svelte v3.51.0 */
6078
5948
 
6079
5949
  function create_fragment$o(ctx) {
5950
+ return {
5951
+ c() {
5952
+ this.c = noop;
5953
+ },
5954
+ m: noop,
5955
+ p: noop,
5956
+ i: noop,
5957
+ o: noop,
5958
+ d: noop
5959
+ };
5960
+ }
5961
+
5962
+ class DropdownItem extends SvelteElement {
5963
+ constructor(options) {
5964
+ super();
5965
+
5966
+ init(
5967
+ this,
5968
+ {
5969
+ target: this.shadowRoot,
5970
+ props: attribute_to_object(this.attributes),
5971
+ customElement: true
5972
+ },
5973
+ null,
5974
+ create_fragment$o,
5975
+ safe_not_equal,
5976
+ {},
5977
+ null
5978
+ );
5979
+
5980
+ if (options) {
5981
+ if (options.target) {
5982
+ insert(options.target, this, options.anchor);
5983
+ }
5984
+ }
5985
+ }
5986
+ }
5987
+
5988
+ customElements.define("goa-dropdown-item", DropdownItem);
5989
+
5990
+ /* libs/web-components/src/components/focus-trap/FocusTrap.svelte generated by Svelte v3.51.0 */
5991
+
5992
+ function create_fragment$n(ctx) {
6080
5993
  let div;
6081
5994
 
6082
5995
  return {
@@ -6129,7 +6042,7 @@ function isFocusable(element) {
6129
6042
  }
6130
6043
  }
6131
6044
 
6132
- function instance$m($$self, $$props, $$invalidate) {
6045
+ function instance$l($$self, $$props, $$invalidate) {
6133
6046
  let isActive;
6134
6047
  let { active } = $$props;
6135
6048
  let ignoreFocusChanges = false;
@@ -6306,8 +6219,8 @@ class FocusTrap extends SvelteElement {
6306
6219
  props: attribute_to_object(this.attributes),
6307
6220
  customElement: true
6308
6221
  },
6309
- instance$m,
6310
- create_fragment$o,
6222
+ instance$l,
6223
+ create_fragment$n,
6311
6224
  safe_not_equal,
6312
6225
  { active: 1 },
6313
6226
  null
@@ -6360,7 +6273,7 @@ function create_if_block$9(ctx) {
6360
6273
  };
6361
6274
  }
6362
6275
 
6363
- function create_fragment$n(ctx) {
6276
+ function create_fragment$m(ctx) {
6364
6277
  let div5;
6365
6278
  let div4;
6366
6279
  let div0;
@@ -6459,7 +6372,7 @@ function create_fragment$n(ctx) {
6459
6372
  };
6460
6373
  }
6461
6374
 
6462
- function instance$l($$self, $$props, $$invalidate) {
6375
+ function instance$k($$self, $$props, $$invalidate) {
6463
6376
  let { maxcontentwidth = "" } = $$props;
6464
6377
  let rootEl;
6465
6378
  let navLinks;
@@ -6500,8 +6413,8 @@ class Footer extends SvelteElement {
6500
6413
  props: attribute_to_object(this.attributes),
6501
6414
  customElement: true
6502
6415
  },
6503
- instance$l,
6504
- create_fragment$n,
6416
+ instance$k,
6417
+ create_fragment$m,
6505
6418
  safe_not_equal,
6506
6419
  { maxcontentwidth: 0 },
6507
6420
  null
@@ -6576,7 +6489,7 @@ function create_each_block$3(ctx) {
6576
6489
  };
6577
6490
  }
6578
6491
 
6579
- function create_fragment$m(ctx) {
6492
+ function create_fragment$l(ctx) {
6580
6493
  let section;
6581
6494
  let div;
6582
6495
  let t;
@@ -6649,7 +6562,7 @@ function create_fragment$m(ctx) {
6649
6562
  };
6650
6563
  }
6651
6564
 
6652
- function instance$k($$self, $$props, $$invalidate) {
6565
+ function instance$j($$self, $$props, $$invalidate) {
6653
6566
  let rootEl;
6654
6567
  let children = [];
6655
6568
 
@@ -6693,8 +6606,8 @@ class FooterMetaSection extends SvelteElement {
6693
6606
  props: attribute_to_object(this.attributes),
6694
6607
  customElement: true
6695
6608
  },
6696
- instance$k,
6697
- create_fragment$m,
6609
+ instance$j,
6610
+ create_fragment$l,
6698
6611
  safe_not_equal,
6699
6612
  {},
6700
6613
  null
@@ -6784,7 +6697,7 @@ function create_each_block$2(ctx) {
6784
6697
  };
6785
6698
  }
6786
6699
 
6787
- function create_fragment$l(ctx) {
6700
+ function create_fragment$k(ctx) {
6788
6701
  let section;
6789
6702
  let t0;
6790
6703
  let div;
@@ -6899,7 +6812,7 @@ function create_fragment$l(ctx) {
6899
6812
  };
6900
6813
  }
6901
6814
 
6902
- function instance$j($$self, $$props, $$invalidate) {
6815
+ function instance$i($$self, $$props, $$invalidate) {
6903
6816
  let { heading = "" } = $$props;
6904
6817
  let { maxcolumncount = 1 } = $$props;
6905
6818
  let rootEl;
@@ -6954,8 +6867,8 @@ class FooterNavSection extends SvelteElement {
6954
6867
  props: attribute_to_object(this.attributes),
6955
6868
  customElement: true
6956
6869
  },
6957
- instance$j,
6958
- create_fragment$l,
6870
+ instance$i,
6871
+ create_fragment$k,
6959
6872
  safe_not_equal,
6960
6873
  { heading: 0, maxcolumncount: 1 },
6961
6874
  null
@@ -7132,7 +7045,7 @@ function create_if_block$7(ctx) {
7132
7045
  };
7133
7046
  }
7134
7047
 
7135
- function create_fragment$k(ctx) {
7048
+ function create_fragment$j(ctx) {
7136
7049
  let div1;
7137
7050
  let t0;
7138
7051
  let div0;
@@ -7229,7 +7142,7 @@ function create_fragment$k(ctx) {
7229
7142
  };
7230
7143
  }
7231
7144
 
7232
- function instance$i($$self, $$props, $$invalidate) {
7145
+ function instance$h($$self, $$props, $$invalidate) {
7233
7146
  const [REQUIREMENT_TYPES, validateRequirementType] = typeValidator("Requirement type", ["optional", "required"], false);
7234
7147
  let { testid = "" } = $$props;
7235
7148
  let { mt = null } = $$props;
@@ -7272,8 +7185,8 @@ class FormItem extends SvelteElement {
7272
7185
  props: attribute_to_object(this.attributes),
7273
7186
  customElement: true
7274
7187
  },
7275
- instance$i,
7276
- create_fragment$k,
7188
+ instance$h,
7189
+ create_fragment$j,
7277
7190
  safe_not_equal,
7278
7191
  {
7279
7192
  testid: 0,
@@ -7401,7 +7314,7 @@ customElements.define("goa-form-item", FormItem);
7401
7314
 
7402
7315
  /* libs/web-components/src/components/grid/Grid.svelte generated by Svelte v3.51.0 */
7403
7316
 
7404
- function create_fragment$j(ctx) {
7317
+ function create_fragment$i(ctx) {
7405
7318
  let div;
7406
7319
  let slot;
7407
7320
  let div_style_value;
@@ -7440,7 +7353,7 @@ function create_fragment$j(ctx) {
7440
7353
  };
7441
7354
  }
7442
7355
 
7443
- function instance$h($$self, $$props, $$invalidate) {
7356
+ function instance$g($$self, $$props, $$invalidate) {
7444
7357
  let { gap = "m" } = $$props;
7445
7358
  let { minchildwidth = "" } = $$props;
7446
7359
  let { mt = null } = $$props;
@@ -7476,8 +7389,8 @@ class Grid extends SvelteElement {
7476
7389
  props: attribute_to_object(this.attributes),
7477
7390
  customElement: true
7478
7391
  },
7479
- instance$h,
7480
- create_fragment$j,
7392
+ instance$g,
7393
+ create_fragment$i,
7481
7394
  safe_not_equal,
7482
7395
  {
7483
7396
  gap: 0,
@@ -7565,7 +7478,7 @@ customElements.define("goa-grid", Grid);
7565
7478
 
7566
7479
  /* libs/web-components/src/components/hero-banner/HeroBanner.svelte generated by Svelte v3.51.0 */
7567
7480
 
7568
- function create_fragment$i(ctx) {
7481
+ function create_fragment$h(ctx) {
7569
7482
  let div1;
7570
7483
  let goa_page_block;
7571
7484
  let h1;
@@ -7628,7 +7541,7 @@ function create_fragment$i(ctx) {
7628
7541
  };
7629
7542
  }
7630
7543
 
7631
- function instance$g($$self, $$props, $$invalidate) {
7544
+ function instance$f($$self, $$props, $$invalidate) {
7632
7545
  let { heading } = $$props;
7633
7546
  let { backgroundurl } = $$props;
7634
7547
  let { minheight = "600px" } = $$props;
@@ -7654,8 +7567,8 @@ class HeroBanner extends SvelteElement {
7654
7567
  props: attribute_to_object(this.attributes),
7655
7568
  customElement: true
7656
7569
  },
7657
- instance$g,
7658
- create_fragment$i,
7570
+ instance$f,
7571
+ create_fragment$h,
7659
7572
  safe_not_equal,
7660
7573
  {
7661
7574
  heading: 0,
@@ -7713,7 +7626,7 @@ customElements.define("goa-hero-banner", HeroBanner);
7713
7626
 
7714
7627
  /* libs/web-components/src/components/icon-button/IconButton.svelte generated by Svelte v3.51.0 */
7715
7628
 
7716
- function create_fragment$h(ctx) {
7629
+ function create_fragment$g(ctx) {
7717
7630
  let button;
7718
7631
  let goa_icon;
7719
7632
  let button_style_value;
@@ -7800,7 +7713,7 @@ function handleClick(e) {
7800
7713
  e.target.dispatchEvent(new CustomEvent("_click", { composed: true, detail: { event: e } }));
7801
7714
  }
7802
7715
 
7803
- function instance$f($$self, $$props, $$invalidate) {
7716
+ function instance$e($$self, $$props, $$invalidate) {
7804
7717
  let css;
7805
7718
  let isDisabled;
7806
7719
  let isInverted;
@@ -7893,8 +7806,8 @@ class IconButton extends SvelteElement {
7893
7806
  props: attribute_to_object(this.attributes),
7894
7807
  customElement: true
7895
7808
  },
7896
- instance$f,
7897
- create_fragment$h,
7809
+ instance$e,
7810
+ create_fragment$g,
7898
7811
  safe_not_equal,
7899
7812
  {
7900
7813
  icon: 0,
@@ -8083,7 +7996,7 @@ function create_if_block$6(ctx) {
8083
7996
  };
8084
7997
  }
8085
7998
 
8086
- function create_fragment$g(ctx) {
7999
+ function create_fragment$f(ctx) {
8087
8000
  let div;
8088
8001
  let div_style_value;
8089
8002
  let if_block = /*type*/ ctx[4] && create_if_block$6(ctx);
@@ -8156,7 +8069,7 @@ function create_fragment$g(ctx) {
8156
8069
  };
8157
8070
  }
8158
8071
 
8159
- function instance$e($$self, $$props, $$invalidate) {
8072
+ function instance$d($$self, $$props, $$invalidate) {
8160
8073
  let isInverted;
8161
8074
  let _size;
8162
8075
  let { mt = null } = $$props;
@@ -8234,8 +8147,8 @@ class Icon extends SvelteElement {
8234
8147
  props: attribute_to_object(this.attributes),
8235
8148
  customElement: true
8236
8149
  },
8237
- instance$e,
8238
- create_fragment$g,
8150
+ instance$d,
8151
+ create_fragment$f,
8239
8152
  safe_not_equal,
8240
8153
  {
8241
8154
  mt: 0,
@@ -8545,7 +8458,7 @@ function create_if_block$5(ctx) {
8545
8458
  };
8546
8459
  }
8547
8460
 
8548
- function create_fragment$f(ctx) {
8461
+ function create_fragment$e(ctx) {
8549
8462
  let div3;
8550
8463
  let div2;
8551
8464
  let t0;
@@ -8817,7 +8730,7 @@ function doClick() {
8817
8730
  this.dispatchEvent(new CustomEvent("_trailingIconClick", { composed: true }));
8818
8731
  }
8819
8732
 
8820
- function instance$d($$self, $$props, $$invalidate) {
8733
+ function instance$c($$self, $$props, $$invalidate) {
8821
8734
  let handlesTrailingIconClick;
8822
8735
  let isFocused;
8823
8736
  let isReadonly;
@@ -9003,7 +8916,7 @@ class Input extends SvelteElement {
9003
8916
  constructor(options) {
9004
8917
  super();
9005
8918
 
9006
- this.shadowRoot.innerHTML = `<style>:host{box-sizing:border-box}.container{position:relative;width:100%;display:inline-block}@media(min-width: 640px){.container{width:var(--width)}}.goa-input,.goa-input *{box-sizing:border-box}.goa-input{box-sizing:border-box;outline:none;transition:box-shadow 0.1s ease-in;border:1px solid var(--color-gray-600);border-radius:var(--input-border-radius);display:inline-flex;align-items:stretch;vertical-align:middle;min-width:100%}.goa-input:hover{border-color:var(--goa-color-interactive--hover)}.goa-input:active,.goa-input:focus,.goa-input:focus-within{box-shadow:0 0 0 3px var(--goa-color-interactive--focus)}.goa-input.type--range{border:none}.goa-input.type--range:active,.goa-input.type--range:focus,.goa-input.type--range:focus-within{box-shadow:none}.goa-input-leading-icon{margin-left:0.5rem}.goa-input-trailing-icon{margin-right:0.5rem}input{display:inline-block;color:var(--goa-color-text);font-size:var(--input-font-size);padding:var(--input-padding);line-height:calc(40px - calc(var(--input-padding) * 2));background-color:transparent;width:0;flex:1 1 auto}input[type="text"],input[type="date"],input[type="time"],input[type="datetime-local"],input[type="number"]{font-family:var(--font-family)}input[readonly]{cursor:pointer}.goa-input-leading-icon+input{padding-left:0.5rem}input,input:focus,input:hover,input:active{outline:none;border:none}.goa-input--disabled,.goa-input--disabled:hover,.goa-input--disabled:active,.goa-input--disabled:focus{background-color:var(--color-gray-100);border-color:var(--color-gray-200);cursor:default;box-shadow:none}.goa-input--disabled input,.goa-input--disabled input:hover,.goa-input--disabled input:active,.goa-input--disabled input:focus{color:var(--goa-color-text-secondary)}.goa-input--disabled input:hover{cursor:default !important}.prefix,.suffix,.leading-content ::slotted(div),.trailing-content ::slotted(div){background-color:var(--color-gray-100);padding:0 0.75rem;display:flex;align-items:center}.leading-content ::slotted(div),.trailing-content ::slotted(div){padding:0.5rem 0.75rem}.prefix,.leading-content ::slotted(div){border-top-left-radius:var(--input-border-radius);border-bottom-left-radius:var(--input-border-radius);border-right:1px solid var(--color-gray-600)}.suffix,.trailing-content ::slotted(div){border-top-right-radius:var(--input-border-radius);border-bottom-right-radius:var(--input-border-radius);border-left:1px solid var(--color-gray-600)}.goa-input--disabled .prefix,.goa-input--disabled .leading-content ::slotted(div){border-right:1px solid var(--color-gray-200)}.goa-input--disabled .suffix,.goa-input--disabled .trailing-content ::slotted(div){border-left:1px solid var(--color-gray-200)}input.input--goa{display:block;border:none;flex:1 1 auto}.variant--bare{border:none}.variant--bare:focus,.variant--bare:active,.variant--bare:focus-within{box-shadow:none}.error:hover,.error:focus,.error{border:2px solid var(--goa-color-interactive--error)}input[type="search" i]:enabled:read-write:-webkit-any(:focus, :hover)::-webkit-search-cancel-button{position:relative;right:var(--search-icon-offset);cursor:pointer;-webkit-appearance:none;height:1.2rem;width:1.2rem;background:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512"><path fill="%23333" d="M405 136.798L375.202 107 256 226.202 136.798 107 107 136.798 226.202 256 107 375.202 136.798 405 256 285.798 375.202 405 405 375.202 285.798 256z"/></svg>')
8919
+ this.shadowRoot.innerHTML = `<style>:host{box-sizing:border-box}.container{position:relative;width:100%;display:inline-block}@media(min-width: 640px){.container{width:var(--width)}}.goa-input,.goa-input *{box-sizing:border-box}.goa-input{box-sizing:border-box;outline:none;transition:box-shadow 0.1s ease-in;border:1px solid var(--color-gray-600);border-radius:var(--input-border-radius);display:inline-flex;align-items:stretch;vertical-align:middle;min-width:100%}.goa-input:hover{border-color:var(--goa-color-interactive--hover)}.goa-input:active,.goa-input:focus,.goa-input:focus-within{box-shadow:0 0 0 3px var(--goa-color-interactive--focus)}.goa-input.type--range{border:none}.goa-input.type--range:active,.goa-input.type--range:focus,.goa-input.type--range:focus-within{box-shadow:none}.goa-input-leading-icon{margin-left:0.5rem}.goa-input-trailing-icon{margin-right:0.5rem}input{display:inline-block;color:var(--goa-color-text);font-size:var(--input-font-size);padding:var(--input-padding);line-height:calc(40px - calc(var(--input-padding) * 2));background-color:transparent;width:0;flex:1 1 auto;font-family:var(--font-family)}input[readonly]{cursor:pointer}.goa-input-leading-icon+input{padding-left:0.5rem}input,input:focus,input:hover,input:active{outline:none;border:none}.goa-input--disabled,.goa-input--disabled:hover,.goa-input--disabled:active,.goa-input--disabled:focus{background-color:var(--color-gray-100);border-color:var(--color-gray-200);cursor:default;box-shadow:none}.goa-input--disabled input,.goa-input--disabled input:hover,.goa-input--disabled input:active,.goa-input--disabled input:focus{color:var(--goa-color-text-secondary)}.goa-input--disabled input:hover{cursor:default !important}.prefix,.suffix,.leading-content ::slotted(div),.trailing-content ::slotted(div){background-color:var(--color-gray-100);padding:0 0.75rem;display:flex;align-items:center}.leading-content ::slotted(div),.trailing-content ::slotted(div){padding:0.5rem 0.75rem}.prefix,.leading-content ::slotted(div){border-top-left-radius:var(--input-border-radius);border-bottom-left-radius:var(--input-border-radius);border-right:1px solid var(--color-gray-600)}.suffix,.trailing-content ::slotted(div){border-top-right-radius:var(--input-border-radius);border-bottom-right-radius:var(--input-border-radius);border-left:1px solid var(--color-gray-600)}.goa-input--disabled .prefix,.goa-input--disabled .leading-content ::slotted(div){border-right:1px solid var(--color-gray-200)}.goa-input--disabled .suffix,.goa-input--disabled .trailing-content ::slotted(div){border-left:1px solid var(--color-gray-200)}input.input--goa{display:block;border:none;flex:1 1 auto}.variant--bare{border:none}.variant--bare:focus,.variant--bare:active,.variant--bare:focus-within{box-shadow:none}.error:hover,.error:focus,.error{border:2px solid var(--goa-color-interactive--error)}input[type="search" i]:enabled:read-write:-webkit-any(:focus, :hover)::-webkit-search-cancel-button{position:relative;right:var(--search-icon-offset);cursor:pointer;-webkit-appearance:none;height:1.2rem;width:1.2rem;background:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512"><path fill="%23333" d="M405 136.798L375.202 107 256 226.202 136.798 107 107 136.798 226.202 256 107 375.202 136.798 405 256 285.798 375.202 405 405 375.202 285.798 256z"/></svg>')
9007
8920
  center center no-repeat}</style>`;
9008
8921
 
9009
8922
  init(
@@ -9012,9 +8925,9 @@ class Input extends SvelteElement {
9012
8925
  target: this.shadowRoot,
9013
8926
  props: attribute_to_object(this.attributes),
9014
8927
  customElement: true
9015
- },
9016
- instance$d,
9017
- create_fragment$f,
8928
+ },
8929
+ instance$c,
8930
+ create_fragment$e,
9018
8931
  safe_not_equal,
9019
8932
  {
9020
8933
  type: 1,
@@ -9475,7 +9388,7 @@ function create_if_block$4(ctx) {
9475
9388
  };
9476
9389
  }
9477
9390
 
9478
- function create_fragment$e(ctx) {
9391
+ function create_fragment$d(ctx) {
9479
9392
  let header;
9480
9393
  let t0;
9481
9394
  let show_if = ["alpha", "beta"].includes(/*type*/ ctx[0]);
@@ -9566,7 +9479,7 @@ function capitalize(val) {
9566
9479
  return val[0].toUpperCase() + val.slice(1);
9567
9480
  }
9568
9481
 
9569
- function instance$c($$self, $$props, $$invalidate) {
9482
+ function instance$b($$self, $$props, $$invalidate) {
9570
9483
  const [Types, validateType] = typeValidator("Microsite header type", ["live", "alpha", "beta"], true);
9571
9484
  let { type } = $$props;
9572
9485
  let { version = "" } = $$props;
@@ -9597,8 +9510,8 @@ class MicrositeHeader extends SvelteElement {
9597
9510
  props: attribute_to_object(this.attributes),
9598
9511
  customElement: true
9599
9512
  },
9600
- instance$c,
9601
- create_fragment$e,
9513
+ instance$b,
9514
+ create_fragment$d,
9602
9515
  safe_not_equal,
9603
9516
  { type: 0, version: 1, feedbackurl: 2 },
9604
9517
  null
@@ -9980,7 +9893,7 @@ function create_if_block_1$1(ctx) {
9980
9893
  };
9981
9894
  }
9982
9895
 
9983
- function create_fragment$d(ctx) {
9896
+ function create_fragment$c(ctx) {
9984
9897
  let if_block_anchor;
9985
9898
  let current;
9986
9899
  let if_block = /*isOpen*/ ctx[7] && create_if_block$3(ctx);
@@ -10036,7 +9949,7 @@ function create_fragment$d(ctx) {
10036
9949
  };
10037
9950
  }
10038
9951
 
10039
- function instance$b($$self, $$props, $$invalidate) {
9952
+ function instance$a($$self, $$props, $$invalidate) {
10040
9953
  let isClosable;
10041
9954
  let isOpen;
10042
9955
  let _transitionTime;
@@ -10128,8 +10041,8 @@ class Modal extends SvelteElement {
10128
10041
  props: attribute_to_object(this.attributes),
10129
10042
  customElement: true
10130
10043
  },
10131
- instance$b,
10132
- create_fragment$d,
10044
+ instance$a,
10045
+ create_fragment$c,
10133
10046
  safe_not_equal,
10134
10047
  {
10135
10048
  heading: 0,
@@ -10312,7 +10225,7 @@ function create_if_block$2(ctx) {
10312
10225
  };
10313
10226
  }
10314
10227
 
10315
- function create_fragment$c(ctx) {
10228
+ function create_fragment$b(ctx) {
10316
10229
  let if_block_anchor;
10317
10230
  let current;
10318
10231
  let if_block = /*show*/ ctx[1] && create_if_block$2(ctx);
@@ -10368,7 +10281,7 @@ function create_fragment$c(ctx) {
10368
10281
  };
10369
10282
  }
10370
10283
 
10371
- function instance$a($$self, $$props, $$invalidate) {
10284
+ function instance$9($$self, $$props, $$invalidate) {
10372
10285
  let iconType;
10373
10286
  const [Types, validateType] = typeValidator("Notification type", ["emergency", "important", "information", "event"], true);
10374
10287
  let { type = "" } = $$props;
@@ -10413,8 +10326,8 @@ class Notification extends SvelteElement {
10413
10326
  props: attribute_to_object(this.attributes),
10414
10327
  customElement: true
10415
10328
  },
10416
- instance$a,
10417
- create_fragment$c,
10329
+ instance$9,
10330
+ create_fragment$b,
10418
10331
  safe_not_equal,
10419
10332
  { type: 0 },
10420
10333
  null
@@ -10455,7 +10368,7 @@ function isValidDimension(value) {
10455
10368
 
10456
10369
  /* libs/web-components/src/components/page-block/PageBlock.svelte generated by Svelte v3.51.0 */
10457
10370
 
10458
- function create_fragment$b(ctx) {
10371
+ function create_fragment$a(ctx) {
10459
10372
  let div;
10460
10373
  let slot;
10461
10374
  let div_style_value;
@@ -10485,7 +10398,7 @@ function create_fragment$b(ctx) {
10485
10398
  };
10486
10399
  }
10487
10400
 
10488
- function instance$9($$self, $$props, $$invalidate) {
10401
+ function instance$8($$self, $$props, $$invalidate) {
10489
10402
  const Sizes = { "full": "100%" };
10490
10403
  let { width } = $$props;
10491
10404
  let { _width } = $$props;
@@ -10524,8 +10437,8 @@ class PageBlock extends SvelteElement {
10524
10437
  props: attribute_to_object(this.attributes),
10525
10438
  customElement: true
10526
10439
  },
10527
- instance$9,
10528
- create_fragment$b,
10440
+ instance$8,
10441
+ create_fragment$a,
10529
10442
  safe_not_equal,
10530
10443
  { width: 1, _width: 0 },
10531
10444
  null
@@ -10576,7 +10489,7 @@ function get_each_context$1(ctx, list, i) {
10576
10489
  return child_ctx;
10577
10490
  }
10578
10491
 
10579
- // (66:2) {#each options as option (option.value)}
10492
+ // (80:2) {#each options as option (option.value)}
10580
10493
  function create_each_block$1(key_1, ctx) {
10581
10494
  let label;
10582
10495
  let input;
@@ -10595,7 +10508,7 @@ function create_each_block$1(key_1, ctx) {
10595
10508
  let dispose;
10596
10509
 
10597
10510
  function change_handler() {
10598
- return /*change_handler*/ ctx[18](/*option*/ ctx[22]);
10511
+ return /*change_handler*/ ctx[16](/*option*/ ctx[22]);
10599
10512
  }
10600
10513
 
10601
10514
  return {
@@ -10621,7 +10534,7 @@ function create_each_block$1(key_1, ctx) {
10621
10534
  attr(label, "data-testid", label_data_testid_value = "radio-option-" + /*option*/ ctx[22].value);
10622
10535
  attr(label, "class", "goa-radio");
10623
10536
  toggle_class(label, "goa-radio--disabled", /*isDisabled*/ ctx[12]);
10624
- toggle_class(label, "goa-radio--error", /*isError*/ ctx[10]);
10537
+ toggle_class(label, "goa-radio--error", /*isError*/ ctx[11]);
10625
10538
  this.first = label;
10626
10539
  },
10627
10540
  m(target, anchor) {
@@ -10672,8 +10585,8 @@ function create_each_block$1(key_1, ctx) {
10672
10585
  toggle_class(label, "goa-radio--disabled", /*isDisabled*/ ctx[12]);
10673
10586
  }
10674
10587
 
10675
- if (dirty & /*isError*/ 1024) {
10676
- toggle_class(label, "goa-radio--error", /*isError*/ ctx[10]);
10588
+ if (dirty & /*isError*/ 2048) {
10589
+ toggle_class(label, "goa-radio--error", /*isError*/ ctx[11]);
10677
10590
  }
10678
10591
  },
10679
10592
  d(detaching) {
@@ -10684,7 +10597,7 @@ function create_each_block$1(key_1, ctx) {
10684
10597
  };
10685
10598
  }
10686
10599
 
10687
- function create_fragment$a(ctx) {
10600
+ function create_fragment$9(ctx) {
10688
10601
  let div;
10689
10602
  let slot;
10690
10603
  let t;
@@ -10725,10 +10638,10 @@ function create_fragment$a(ctx) {
10725
10638
  each_blocks[i].m(div, null);
10726
10639
  }
10727
10640
 
10728
- /*div_binding*/ ctx[19](div);
10641
+ /*div_binding*/ ctx[17](div);
10729
10642
  },
10730
10643
  p(ctx, [dirty]) {
10731
- if (dirty & /*options, isDisabled, isError, name, value, arialabel, onChange*/ 13843) {
10644
+ if (dirty & /*options, isDisabled, isError, name, value, arialabel, onChange*/ 14867) {
10732
10645
  each_value = /*options*/ ctx[9];
10733
10646
  each_blocks = update_keyed_each(each_blocks, dirty, get_key, 1, ctx, each_value, each_1_lookup, div, destroy_block, create_each_block$1, null, get_each_context$1);
10734
10647
  }
@@ -10754,13 +10667,14 @@ function create_fragment$a(ctx) {
10754
10667
  each_blocks[i].d();
10755
10668
  }
10756
10669
 
10757
- /*div_binding*/ ctx[19](null);
10670
+ /*div_binding*/ ctx[17](null);
10758
10671
  }
10759
10672
  };
10760
10673
  }
10761
10674
 
10762
- function instance$8($$self, $$props, $$invalidate) {
10675
+ function instance$7($$self, $$props, $$invalidate) {
10763
10676
  let isDisabled;
10677
+ let isError;
10764
10678
  const [Orientations, validateOrientation] = typeValidator("Radio group orientation", ["vertical", "horizontal"]);
10765
10679
  let { name } = $$props;
10766
10680
  let { value } = $$props;
@@ -10774,24 +10688,49 @@ function instance$8($$self, $$props, $$invalidate) {
10774
10688
  let { mb = null } = $$props;
10775
10689
  let { ml = null } = $$props;
10776
10690
  let options = [];
10691
+ let el;
10777
10692
 
10778
- // private
10779
- let isError;
10693
+ onMount(async () => {
10694
+ await tick();
10695
+ $$invalidate(9, options = getOptions());
10696
+ });
10780
10697
 
10781
- let ctx;
10782
- let isBound = false;
10783
- let el;
10698
+ /**
10699
+ * Allows the child elements to be obtainable within unit tests
10700
+ * @returns List of child elements
10701
+ */
10702
+ function getChildren() {
10703
+ const slot = el.querySelector("slot");
10704
+
10705
+ if (slot) // default
10706
+ return [...slot.assignedElements()]; else // unit tests
10707
+ return [...el.children];
10708
+ }
10709
+
10710
+ /**
10711
+ * Maps the child elements to a list of RadioOptions
10712
+ */
10713
+ function getOptions() {
10714
+ const children = getChildren();
10715
+
10716
+ return children.map(el => {
10717
+ const option = el;
10718
+ const value = el.getAttribute("value") || option.value;
10719
+ const label = el.getAttribute("label") || el.innerText || option.label || option.innerText;
10720
+ return { value, label };
10721
+ });
10722
+ }
10784
10723
 
10724
+ /**
10725
+ * Handles changing of the radio items
10726
+ * @param newValue Selected value
10727
+ */
10785
10728
  function onChange(newValue) {
10786
10729
  if (newValue === value) return;
10787
10730
  $$invalidate(0, value = newValue);
10788
10731
  el.dispatchEvent(new CustomEvent("_change", { composed: true, detail: { name, value } }));
10789
10732
  }
10790
10733
 
10791
- onDestroy(() => {
10792
- deleteContext(name);
10793
- });
10794
-
10795
10734
  onMount(() => {
10796
10735
  validateOrientation(orientation);
10797
10736
  });
@@ -10801,7 +10740,7 @@ function instance$8($$self, $$props, $$invalidate) {
10801
10740
  function div_binding($$value) {
10802
10741
  binding_callbacks[$$value ? 'unshift' : 'push'](() => {
10803
10742
  el = $$value;
10804
- $$invalidate(11, el);
10743
+ $$invalidate(10, el);
10805
10744
  });
10806
10745
  }
10807
10746
 
@@ -10821,25 +10760,12 @@ function instance$8($$self, $$props, $$invalidate) {
10821
10760
 
10822
10761
  $$self.$$.update = () => {
10823
10762
  if ($$self.$$.dirty & /*disabled*/ 16384) {
10763
+ // private
10824
10764
  $$invalidate(12, isDisabled = toBoolean(disabled));
10825
10765
  }
10826
10766
 
10827
10767
  if ($$self.$$.dirty & /*error*/ 32768) {
10828
- $$invalidate(10, isError = toBoolean(error));
10829
- }
10830
-
10831
- if ($$self.$$.dirty & /*name, isBound, ctx, options*/ 197122) {
10832
- {
10833
- if (name && !isBound) {
10834
- $$invalidate(17, isBound = true);
10835
- $$invalidate(16, ctx = getContext(name));
10836
-
10837
- ctx.subscribe(msg => {
10838
- if (!msg) return;
10839
- $$invalidate(9, options = [...options, msg]);
10840
- });
10841
- }
10842
- }
10768
+ $$invalidate(11, isError = toBoolean(error));
10843
10769
  }
10844
10770
  };
10845
10771
 
@@ -10854,14 +10780,12 @@ function instance$8($$self, $$props, $$invalidate) {
10854
10780
  mb,
10855
10781
  ml,
10856
10782
  options,
10857
- isError,
10858
10783
  el,
10784
+ isError,
10859
10785
  isDisabled,
10860
10786
  onChange,
10861
10787
  disabled,
10862
10788
  error,
10863
- ctx,
10864
- isBound,
10865
10789
  change_handler,
10866
10790
  div_binding
10867
10791
  ];
@@ -10882,8 +10806,8 @@ class RadioGroup extends SvelteElement {
10882
10806
  props: attribute_to_object(this.attributes),
10883
10807
  customElement: true
10884
10808
  },
10885
- instance$8,
10886
- create_fragment$a,
10809
+ instance$7,
10810
+ create_fragment$9,
10887
10811
  safe_not_equal,
10888
10812
  {
10889
10813
  name: 1,
@@ -11031,117 +10955,6 @@ class RadioGroup extends SvelteElement {
11031
10955
 
11032
10956
  customElements.define("goa-radio-group", RadioGroup);
11033
10957
 
11034
- /* libs/web-components/src/components/radio-group/RadioItem.svelte generated by Svelte v3.51.0 */
11035
-
11036
- function create_fragment$9(ctx) {
11037
- return {
11038
- c() {
11039
- this.c = noop;
11040
- },
11041
- m: noop,
11042
- p: noop,
11043
- i: noop,
11044
- o: noop,
11045
- d: noop
11046
- };
11047
- }
11048
-
11049
- function instance$7($$self, $$props, $$invalidate) {
11050
- let { value } = $$props;
11051
- let { label } = $$props;
11052
- let { name } = $$props;
11053
- let ctx;
11054
- let isBound = false;
11055
-
11056
- $$self.$$set = $$props => {
11057
- if ('value' in $$props) $$invalidate(0, value = $$props.value);
11058
- if ('label' in $$props) $$invalidate(1, label = $$props.label);
11059
- if ('name' in $$props) $$invalidate(2, name = $$props.name);
11060
- };
11061
-
11062
- $$self.$$.update = () => {
11063
- if ($$self.$$.dirty & /*isBound, name, ctx, value, label*/ 31) {
11064
- {
11065
- (async () => {
11066
- await tick();
11067
-
11068
- if (!isBound) {
11069
- $$invalidate(4, isBound = true);
11070
- $$invalidate(3, ctx = getContext(name));
11071
- ctx.notify({ type: "bind", value, label });
11072
- }
11073
- })();
11074
- }
11075
- }
11076
- };
11077
-
11078
- return [value, label, name, ctx, isBound];
11079
- }
11080
-
11081
- class RadioItem extends SvelteElement {
11082
- constructor(options) {
11083
- super();
11084
-
11085
- init(
11086
- this,
11087
- {
11088
- target: this.shadowRoot,
11089
- props: attribute_to_object(this.attributes),
11090
- customElement: true
11091
- },
11092
- instance$7,
11093
- create_fragment$9,
11094
- safe_not_equal,
11095
- { value: 0, label: 1, name: 2 },
11096
- null
11097
- );
11098
-
11099
- if (options) {
11100
- if (options.target) {
11101
- insert(options.target, this, options.anchor);
11102
- }
11103
-
11104
- if (options.props) {
11105
- this.$set(options.props);
11106
- flush();
11107
- }
11108
- }
11109
- }
11110
-
11111
- static get observedAttributes() {
11112
- return ["value", "label", "name"];
11113
- }
11114
-
11115
- get value() {
11116
- return this.$$.ctx[0];
11117
- }
11118
-
11119
- set value(value) {
11120
- this.$$set({ value });
11121
- flush();
11122
- }
11123
-
11124
- get label() {
11125
- return this.$$.ctx[1];
11126
- }
11127
-
11128
- set label(label) {
11129
- this.$$set({ label });
11130
- flush();
11131
- }
11132
-
11133
- get name() {
11134
- return this.$$.ctx[2];
11135
- }
11136
-
11137
- set name(name) {
11138
- this.$$set({ name });
11139
- flush();
11140
- }
11141
- }
11142
-
11143
- customElements.define("goa-radio-item", RadioItem);
11144
-
11145
10958
  /* libs/web-components/src/components/scrollable/Scrollable.svelte generated by Svelte v3.51.0 */
11146
10959
 
11147
10960
  function create_fragment$8(ctx) {
@@ -11996,6 +11809,54 @@ class Spacer extends SvelteElement {
11996
11809
 
11997
11810
  customElements.define("goa-spacer", Spacer);
11998
11811
 
11812
+ const subscriber_queue = [];
11813
+ /**
11814
+ * Create a `Writable` store that allows both updating and reading by subscription.
11815
+ * @param {*=}value initial value
11816
+ * @param {StartStopNotifier=}start start and stop notifications for subscriptions
11817
+ */
11818
+ function writable(value, start = noop) {
11819
+ let stop;
11820
+ const subscribers = new Set();
11821
+ function set(new_value) {
11822
+ if (safe_not_equal(value, new_value)) {
11823
+ value = new_value;
11824
+ if (stop) { // store is ready
11825
+ const run_queue = !subscriber_queue.length;
11826
+ for (const subscriber of subscribers) {
11827
+ subscriber[1]();
11828
+ subscriber_queue.push(subscriber, value);
11829
+ }
11830
+ if (run_queue) {
11831
+ for (let i = 0; i < subscriber_queue.length; i += 2) {
11832
+ subscriber_queue[i][0](subscriber_queue[i + 1]);
11833
+ }
11834
+ subscriber_queue.length = 0;
11835
+ }
11836
+ }
11837
+ }
11838
+ }
11839
+ function update(fn) {
11840
+ set(fn(value));
11841
+ }
11842
+ function subscribe(run, invalidate = noop) {
11843
+ const subscriber = [run, invalidate];
11844
+ subscribers.add(subscriber);
11845
+ if (subscribers.size === 1) {
11846
+ stop = start(set) || noop;
11847
+ }
11848
+ run(value);
11849
+ return () => {
11850
+ subscribers.delete(subscriber);
11851
+ if (subscribers.size === 0) {
11852
+ stop();
11853
+ stop = null;
11854
+ }
11855
+ };
11856
+ }
11857
+ return { set, update, subscribe };
11858
+ }
11859
+
11999
11860
  function is_date(obj) {
12000
11861
  return Object.prototype.toString.call(obj) === '[object Date]';
12001
11862
  }
@@ -12450,46 +12311,53 @@ function create_fragment$4(ctx) {
12450
12311
  <tfoot><tr><td></td></tr></tfoot>`;
12451
12312
 
12452
12313
  this.c = noop;
12314
+ attr(table, "class", /*variant*/ ctx[1]);
12453
12315
 
12454
12316
  attr(table, "style", table_style_value = `
12455
- width: ${/*width*/ ctx[0]};
12456
- ${calculateMargin(/*mt*/ ctx[1], /*mr*/ ctx[2], /*mb*/ ctx[3], /*ml*/ ctx[4])}
12317
+ ${/*width*/ ctx[0] ? `width: ${/*width*/ ctx[0]};` : ``}
12318
+ ${calculateMargin(/*mt*/ ctx[2], /*mr*/ ctx[3], /*mb*/ ctx[4], /*ml*/ ctx[5])}
12457
12319
  `);
12458
12320
 
12459
- toggle_class(table, "sticky", /*_stickyHeader*/ ctx[6]);
12321
+ toggle_class(table, "sticky", /*_stickyHeader*/ ctx[7]);
12460
12322
  },
12461
12323
  m(target, anchor) {
12462
12324
  insert(target, table, anchor);
12463
12325
  append(table, slot);
12464
12326
  append(table, t0);
12465
12327
  append(table, template);
12466
- /*table_binding*/ ctx[8](table);
12328
+ /*table_binding*/ ctx[9](table);
12467
12329
  },
12468
12330
  p(ctx, [dirty]) {
12469
- if (dirty & /*width, mt, mr, mb, ml*/ 31 && table_style_value !== (table_style_value = `
12470
- width: ${/*width*/ ctx[0]};
12471
- ${calculateMargin(/*mt*/ ctx[1], /*mr*/ ctx[2], /*mb*/ ctx[3], /*ml*/ ctx[4])}
12331
+ if (dirty & /*variant*/ 2) {
12332
+ attr(table, "class", /*variant*/ ctx[1]);
12333
+ }
12334
+
12335
+ if (dirty & /*width, mt, mr, mb, ml*/ 61 && table_style_value !== (table_style_value = `
12336
+ ${/*width*/ ctx[0] ? `width: ${/*width*/ ctx[0]};` : ``}
12337
+ ${calculateMargin(/*mt*/ ctx[2], /*mr*/ ctx[3], /*mb*/ ctx[4], /*ml*/ ctx[5])}
12472
12338
  `)) {
12473
12339
  attr(table, "style", table_style_value);
12474
12340
  }
12475
12341
 
12476
- if (dirty & /*_stickyHeader*/ 64) {
12477
- toggle_class(table, "sticky", /*_stickyHeader*/ ctx[6]);
12342
+ if (dirty & /*variant, _stickyHeader*/ 130) {
12343
+ toggle_class(table, "sticky", /*_stickyHeader*/ ctx[7]);
12478
12344
  }
12479
12345
  },
12480
12346
  i: noop,
12481
12347
  o: noop,
12482
12348
  d(detaching) {
12483
12349
  if (detaching) detach(table);
12484
- /*table_binding*/ ctx[8](null);
12350
+ /*table_binding*/ ctx[9](null);
12485
12351
  }
12486
12352
  };
12487
12353
  }
12488
12354
 
12489
12355
  function instance$2($$self, $$props, $$invalidate) {
12490
12356
  let _stickyHeader;
12357
+ const [Variants, validateVariant] = typeValidator("Table variant", ["normal", "relaxed"], true);
12491
12358
  let { width = "" } = $$props;
12492
12359
  let { stickyheader = "false" } = $$props;
12360
+ let { variant = "normal" } = $$props;
12493
12361
  let { mt = null } = $$props;
12494
12362
  let { mr = null } = $$props;
12495
12363
  let { mb = null } = $$props;
@@ -12499,6 +12367,7 @@ function instance$2($$self, $$props, $$invalidate) {
12499
12367
  let _rootEl;
12500
12368
 
12501
12369
  onMount(() => {
12370
+ validateVariant(variant);
12502
12371
  const slot = _rootEl.querySelector("slot");
12503
12372
 
12504
12373
  if (slot) {
@@ -12514,32 +12383,44 @@ function instance$2($$self, $$props, $$invalidate) {
12514
12383
  function table_binding($$value) {
12515
12384
  binding_callbacks[$$value ? 'unshift' : 'push'](() => {
12516
12385
  _rootEl = $$value;
12517
- $$invalidate(5, _rootEl);
12386
+ $$invalidate(6, _rootEl);
12518
12387
  });
12519
12388
  }
12520
12389
 
12521
12390
  $$self.$$set = $$props => {
12522
12391
  if ('width' in $$props) $$invalidate(0, width = $$props.width);
12523
- if ('stickyheader' in $$props) $$invalidate(7, stickyheader = $$props.stickyheader);
12524
- if ('mt' in $$props) $$invalidate(1, mt = $$props.mt);
12525
- if ('mr' in $$props) $$invalidate(2, mr = $$props.mr);
12526
- if ('mb' in $$props) $$invalidate(3, mb = $$props.mb);
12527
- if ('ml' in $$props) $$invalidate(4, ml = $$props.ml);
12392
+ if ('stickyheader' in $$props) $$invalidate(8, stickyheader = $$props.stickyheader);
12393
+ if ('variant' in $$props) $$invalidate(1, variant = $$props.variant);
12394
+ if ('mt' in $$props) $$invalidate(2, mt = $$props.mt);
12395
+ if ('mr' in $$props) $$invalidate(3, mr = $$props.mr);
12396
+ if ('mb' in $$props) $$invalidate(4, mb = $$props.mb);
12397
+ if ('ml' in $$props) $$invalidate(5, ml = $$props.ml);
12528
12398
  };
12529
12399
 
12530
12400
  $$self.$$.update = () => {
12531
- if ($$self.$$.dirty & /*stickyheader*/ 128) {
12532
- $$invalidate(6, _stickyHeader = toBoolean(stickyheader));
12401
+ if ($$self.$$.dirty & /*stickyheader*/ 256) {
12402
+ $$invalidate(7, _stickyHeader = toBoolean(stickyheader));
12533
12403
  }
12534
12404
  };
12535
12405
 
12536
- return [width, mt, mr, mb, ml, _rootEl, _stickyHeader, stickyheader, table_binding];
12406
+ return [
12407
+ width,
12408
+ variant,
12409
+ mt,
12410
+ mr,
12411
+ mb,
12412
+ ml,
12413
+ _rootEl,
12414
+ _stickyHeader,
12415
+ stickyheader,
12416
+ table_binding
12417
+ ];
12537
12418
  }
12538
12419
 
12539
12420
  class Table extends SvelteElement {
12540
12421
  constructor(options) {
12541
12422
  super();
12542
- this.shadowRoot.innerHTML = `<style>table{border-collapse:collapse}table.sticky{position:relative}table.sticky thead{position:sticky;top:0}td{padding:1rem 1.5rem;border-bottom:1px solid var(--color-gray-200);line-height:1rem}th{background-color:var(--color-white);color:var(--goa-color-text-secondary);padding:1rem;vertical-align:middle;text-align:left;border-bottom:2px solid var(--color-gray-600)}tfoot td{background-color:var(--color-gray-100)}tfoot tr:first-child td{border-top:2px solid var(--color-gray-200)}tfoot tr:last-child td{border-bottom:none}</style>`;
12423
+ this.shadowRoot.innerHTML = `<style>table{border-collapse:collapse}table.sticky{position:relative}table.sticky thead{position:sticky;top:0}td{padding:0.75rem 1rem 0.5rem;border-bottom:1px solid var(--color-gray-200);line-height:1rem}table.relaxed td{padding:1.25rem 1rem 1rem}th{background-color:var(--color-white);color:var(--goa-color-text-secondary);padding:1rem;vertical-align:middle;text-align:left;border-bottom:2px solid var(--color-gray-600)}tfoot td{background-color:var(--color-gray-100)}tfoot tr:first-child td{border-top:2px solid var(--color-gray-200)}tfoot tr:last-child td{border-bottom:none}</style>`;
12543
12424
 
12544
12425
  init(
12545
12426
  this,
@@ -12553,11 +12434,12 @@ class Table extends SvelteElement {
12553
12434
  safe_not_equal,
12554
12435
  {
12555
12436
  width: 0,
12556
- stickyheader: 7,
12557
- mt: 1,
12558
- mr: 2,
12559
- mb: 3,
12560
- ml: 4
12437
+ stickyheader: 8,
12438
+ variant: 1,
12439
+ mt: 2,
12440
+ mr: 3,
12441
+ mb: 4,
12442
+ ml: 5
12561
12443
  },
12562
12444
  null
12563
12445
  );
@@ -12575,7 +12457,7 @@ class Table extends SvelteElement {
12575
12457
  }
12576
12458
 
12577
12459
  static get observedAttributes() {
12578
- return ["width", "stickyheader", "mt", "mr", "mb", "ml"];
12460
+ return ["width", "stickyheader", "variant", "mt", "mr", "mb", "ml"];
12579
12461
  }
12580
12462
 
12581
12463
  get width() {
@@ -12588,7 +12470,7 @@ class Table extends SvelteElement {
12588
12470
  }
12589
12471
 
12590
12472
  get stickyheader() {
12591
- return this.$$.ctx[7];
12473
+ return this.$$.ctx[8];
12592
12474
  }
12593
12475
 
12594
12476
  set stickyheader(stickyheader) {
@@ -12596,17 +12478,26 @@ class Table extends SvelteElement {
12596
12478
  flush();
12597
12479
  }
12598
12480
 
12599
- get mt() {
12481
+ get variant() {
12600
12482
  return this.$$.ctx[1];
12601
12483
  }
12602
12484
 
12485
+ set variant(variant) {
12486
+ this.$$set({ variant });
12487
+ flush();
12488
+ }
12489
+
12490
+ get mt() {
12491
+ return this.$$.ctx[2];
12492
+ }
12493
+
12603
12494
  set mt(mt) {
12604
12495
  this.$$set({ mt });
12605
12496
  flush();
12606
12497
  }
12607
12498
 
12608
12499
  get mr() {
12609
- return this.$$.ctx[2];
12500
+ return this.$$.ctx[3];
12610
12501
  }
12611
12502
 
12612
12503
  set mr(mr) {
@@ -12615,7 +12506,7 @@ class Table extends SvelteElement {
12615
12506
  }
12616
12507
 
12617
12508
  get mb() {
12618
- return this.$$.ctx[3];
12509
+ return this.$$.ctx[4];
12619
12510
  }
12620
12511
 
12621
12512
  set mb(mb) {
@@ -12624,7 +12515,7 @@ class Table extends SvelteElement {
12624
12515
  }
12625
12516
 
12626
12517
  get ml() {
12627
- return this.$$.ctx[4];
12518
+ return this.$$.ctx[5];
12628
12519
  }
12629
12520
 
12630
12521
  set ml(ml) {