@abgov/react-components 4.0.0-alpha.130 → 4.0.0-alpha.132

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.
Files changed (3) hide show
  1. package/package.json +1 -1
  2. package/react-components.esm.js +118 -52
  3. package/react-components.umd.js +118 -52
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@abgov/react-components",
3
- "version": "4.0.0-alpha.130",
3
+ "version": "4.0.0-alpha.132",
4
4
  "description": "Government of Alberta - UI components for React",
5
5
  "bugs": {
6
6
  "url": "https://github.com/GovAlta/ui-components/issues"
package/react-components.esm.js CHANGED
@@ -6730,7 +6730,7 @@ function get_each_context_1(ctx, list, i) {
6730
6730
  return child_ctx;
6731
6731
  }
6732
6732
 
6733
- function get_each_context$4(ctx, list, i) {
6733
+ function get_each_context$5(ctx, list, i) {
6734
6734
  const child_ctx = ctx.slice();
6735
6735
  child_ctx[50] = list[i];
6736
6736
  return child_ctx;
@@ -7030,7 +7030,7 @@ function create_if_block$f(ctx) {
7030
7030
  let each_blocks = [];
7031
7031
 
7032
7032
  for (let i = 0; i < each_value.length; i += 1) {
7033
- each_blocks[i] = create_each_block$4(get_each_context$4(ctx, each_value, i));
7033
+ each_blocks[i] = create_each_block$5(get_each_context$5(ctx, each_value, i));
7034
7034
  }
7035
7035
 
7036
7036
  return {
@@ -7085,12 +7085,12 @@ function create_if_block$f(ctx) {
7085
7085
  let i;
7086
7086
 
7087
7087
  for (i = 0; i < each_value.length; i += 1) {
7088
- const child_ctx = get_each_context$4(ctx, each_value, i);
7088
+ const child_ctx = get_each_context$5(ctx, each_value, i);
7089
7089
 
7090
7090
  if (each_blocks[i]) {
7091
7091
  each_blocks[i].p(child_ctx, dirty);
7092
7092
  } else {
7093
- each_blocks[i] = create_each_block$4(child_ctx);
7093
+ each_blocks[i] = create_each_block$5(child_ctx);
7094
7094
  each_blocks[i].c();
7095
7095
  each_blocks[i].m(select, null);
7096
7096
  }
@@ -7381,7 +7381,7 @@ function create_each_block_1(key_1, ctx) {
7381
7381
  } // (260:6) {#each _options as option}
7382
7382
 
7383
7383
 
7384
- function create_each_block$4(ctx) {
7384
+ function create_each_block$5(ctx) {
7385
7385
  let option;
7386
7386
  let t0_value =
7387
7387
  /*option*/
@@ -7977,7 +7977,7 @@ function instance$s($$self, $$props, $$invalidate) {
7977
7977
  class Dropdown extends SvelteElement {
7978
7978
  constructor(options) {
7979
7979
  super();
7980
- this.shadowRoot.innerHTML = `<style>:host{box-sizing:border-box;font-family:var(--goa-font-family-sans)}.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(--goa-color-greyscale-white);border-radius:var(--goa-border-radius-m);outline:none;box-shadow:var(--shadow-1);z-index:99;bottom:var(--bottom);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(--goa-color-greyscale-black);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.dropdown-item--tabbed{background:var(--goa-color-greyscale-100);color:var(--goa-color-interactive-hover)}.dropdown-item--disabled{opacity:0.5;cursor:default}.dropdown-item--disabled:hover{cursor:default;color:var(--goa-color-greyscale-700)}.dropdown-item--selected{background:var(--goa-color-interactive-default);color:var(--goa-color-greyscale-white)}.dropdown-item--tabbed.dropdown-item--selected,.dropdown-item--selected:hover{background:var(--goa-color-interactive-hover);color:var(--goa-color-greyscale-white)}.dropdown-native{border:1px solid var(--goa-color-greyscale-700);border-radius:var(--goa-border-radius-m);background-color:var(--goa-color-greyscale-white);transition:box-shadow 0.1s ease-in}.dropdown-native:has(select:disabled){background-color:var(--goa-color-greyscale-100);border-color:var(--goa-color-greyscale-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)}.dropdown-native:hover{border-color:var(--goa-color-interactive-hover);box-shadow:0 0 0 var(--goa-border-width-m) var(--goa-color-interactive-hover)}select{border:none;background-color:transparent;color:var(--goa-color-text-default);font-size:var(--goa-font-size-4);appearance:none;padding:calc(var(--goa-space-xs) + 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>`;
7980
+ this.shadowRoot.innerHTML = `<style>:host{box-sizing:border-box;font-family:var(--goa-font-family-sans)}.dropdown{position:relative;cursor:pointer;display:inline-block;width:var(--width, 100%)}.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(--goa-color-greyscale-white);border-radius:var(--goa-border-radius-m);outline:none;box-shadow:var(--shadow-1);z-index:99;bottom:var(--bottom);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(--goa-color-greyscale-black);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.dropdown-item--tabbed{background:var(--goa-color-greyscale-100);color:var(--goa-color-interactive-hover)}.dropdown-item--disabled{opacity:0.5;cursor:default}.dropdown-item--disabled:hover{cursor:default;color:var(--goa-color-greyscale-700)}.dropdown-item--selected{background:var(--goa-color-interactive-default);color:var(--goa-color-greyscale-white)}.dropdown-item--tabbed.dropdown-item--selected,.dropdown-item--selected:hover{background:var(--goa-color-interactive-hover);color:var(--goa-color-greyscale-white)}.dropdown-native{border:1px solid var(--goa-color-greyscale-700);border-radius:var(--goa-border-radius-m);background-color:var(--goa-color-greyscale-white);transition:box-shadow 0.1s ease-in}.dropdown-native:has(select:disabled){background-color:var(--goa-color-greyscale-100);border-color:var(--goa-color-greyscale-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)}.dropdown-native:hover{border-color:var(--goa-color-interactive-hover);box-shadow:0 0 0 var(--goa-border-width-m) var(--goa-color-interactive-hover)}select{border:none;background-color:transparent;color:var(--goa-color-text-default);font-size:var(--goa-font-size-4);appearance:none;padding:calc(var(--goa-space-xs) + 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>`;
7981
7981
  init(this, {
7982
7982
  target: this.shadowRoot,
7983
7983
  props: attribute_to_object(this.attributes),
@@ -8722,14 +8722,14 @@ class Footer extends SvelteElement {
8722
8722
  customElements.define("goa-app-footer", Footer);
8723
8723
  /* libs/web-components/src/components/footer-meta-section/FooterMetaSection.svelte generated by Svelte v3.51.0 */
8724
8724
 
8725
- function get_each_context$3(ctx, list, i) {
8725
+ function get_each_context$4(ctx, list, i) {
8726
8726
  const child_ctx = ctx.slice();
8727
8727
  child_ctx[3] = list[i];
8728
8728
  return child_ctx;
8729
8729
  } // (52:4) {#each children as child}
8730
8730
 
8731
8731
 
8732
- function create_each_block$3(ctx) {
8732
+ function create_each_block$4(ctx) {
8733
8733
  let li;
8734
8734
  let a;
8735
8735
  let t_value =
@@ -8787,7 +8787,7 @@ function create_fragment$r(ctx) {
8787
8787
  let each_blocks = [];
8788
8788
 
8789
8789
  for (let i = 0; i < each_value.length; i += 1) {
8790
- each_blocks[i] = create_each_block$3(get_each_context$3(ctx, each_value, i));
8790
+ each_blocks[i] = create_each_block$4(get_each_context$4(ctx, each_value, i));
8791
8791
  }
8792
8792
 
8793
8793
  return {
@@ -8831,12 +8831,12 @@ function create_fragment$r(ctx) {
8831
8831
  let i;
8832
8832
 
8833
8833
  for (i = 0; i < each_value.length; i += 1) {
8834
- const child_ctx = get_each_context$3(ctx, each_value, i);
8834
+ const child_ctx = get_each_context$4(ctx, each_value, i);
8835
8835
 
8836
8836
  if (each_blocks[i]) {
8837
8837
  each_blocks[i].p(child_ctx, dirty);
8838
8838
  } else {
8839
- each_blocks[i] = create_each_block$3(child_ctx);
8839
+ each_blocks[i] = create_each_block$4(child_ctx);
8840
8840
  each_blocks[i].c();
8841
8841
  each_blocks[i].m(ul, null);
8842
8842
  }
@@ -8913,7 +8913,7 @@ class FooterMetaSection extends SvelteElement {
8913
8913
  customElements.define("goa-app-footer-meta-section", FooterMetaSection);
8914
8914
  /* libs/web-components/src/components/footer-nav-section/FooterNavSection.svelte generated by Svelte v3.51.0 */
8915
8915
 
8916
- function get_each_context$2(ctx, list, i) {
8916
+ function get_each_context$3(ctx, list, i) {
8917
8917
  const child_ctx = ctx.slice();
8918
8918
  child_ctx[5] = list[i];
8919
8919
  return child_ctx;
@@ -8962,7 +8962,7 @@ function create_if_block$d(ctx) {
8962
8962
  } // (49:4) {#each children as child}
8963
8963
 
8964
8964
 
8965
- function create_each_block$2(ctx) {
8965
+ function create_each_block$3(ctx) {
8966
8966
  let li;
8967
8967
  let a;
8968
8968
  let t_value =
@@ -9025,7 +9025,7 @@ function create_fragment$q(ctx) {
9025
9025
  let each_blocks = [];
9026
9026
 
9027
9027
  for (let i = 0; i < each_value.length; i += 1) {
9028
- each_blocks[i] = create_each_block$2(get_each_context$2(ctx, each_value, i));
9028
+ each_blocks[i] = create_each_block$3(get_each_context$3(ctx, each_value, i));
9029
9029
  }
9030
9030
 
9031
9031
  return {
@@ -9103,12 +9103,12 @@ function create_fragment$q(ctx) {
9103
9103
  let i;
9104
9104
 
9105
9105
  for (i = 0; i < each_value.length; i += 1) {
9106
- const child_ctx = get_each_context$2(ctx, each_value, i);
9106
+ const child_ctx = get_each_context$3(ctx, each_value, i);
9107
9107
 
9108
9108
  if (each_blocks[i]) {
9109
9109
  each_blocks[i].p(child_ctx, dirty);
9110
9110
  } else {
9111
- each_blocks[i] = create_each_block$2(child_ctx);
9111
+ each_blocks[i] = create_each_block$3(child_ctx);
9112
9112
  each_blocks[i].c();
9113
9113
  each_blocks[i].m(ul, null);
9114
9114
  }
@@ -13891,17 +13891,36 @@ class PageBlock extends SvelteElement {
13891
13891
  customElements.define("goa-page-block", PageBlock);
13892
13892
  /* libs/web-components/src/components/pagination/Pagination.svelte generated by Svelte v3.51.0 */
13893
13893
 
13894
+ function get_each_context$2(ctx, list, i) {
13895
+ const child_ctx = ctx.slice();
13896
+ child_ctx[18] = list[i];
13897
+ child_ctx[20] = i;
13898
+ return child_ctx;
13899
+ } // (66:4) {#if variant === "all"}
13900
+
13901
+
13894
13902
  function create_if_block$6(ctx) {
13895
13903
  let goa_block;
13896
13904
  let span0;
13897
13905
  let t1;
13898
13906
  let input;
13899
13907
  let t2;
13900
- let goa_input;
13908
+ let goa_dropdown;
13901
13909
  let t3;
13902
13910
  let span1;
13903
13911
  let t4;
13904
13912
  let t5;
13913
+ let each_value = {
13914
+ length:
13915
+ /*_pageCount*/
13916
+ ctx[8]
13917
+ };
13918
+ let each_blocks = [];
13919
+
13920
+ for (let i = 0; i < each_value.length; i += 1) {
13921
+ each_blocks[i] = create_each_block$2(get_each_context$2(ctx, each_value, i));
13922
+ }
13923
+
13905
13924
  return {
13906
13925
  c() {
13907
13926
  goa_block = element("goa-block");
@@ -13910,7 +13929,12 @@ function create_if_block$6(ctx) {
13910
13929
  t1 = space();
13911
13930
  input = element("input");
13912
13931
  t2 = space();
13913
- goa_input = element("goa-input");
13932
+ goa_dropdown = element("goa-dropdown");
13933
+
13934
+ for (let i = 0; i < each_blocks.length; i += 1) {
13935
+ each_blocks[i].c();
13936
+ }
13937
+
13914
13938
  t3 = space();
13915
13939
  span1 = element("span");
13916
13940
  t4 = text("of ");
@@ -13918,16 +13942,10 @@ function create_if_block$6(ctx) {
13918
13942
  /*_pageCount*/
13919
13943
  ctx[8]);
13920
13944
  attr(input, "type", "hidden");
13921
- set_custom_element_data(goa_input, "type", "number");
13922
- set_custom_element_data(goa_input, "value",
13945
+ set_custom_element_data(goa_dropdown, "value",
13923
13946
  /*pagenumber*/
13924
13947
  ctx[0]);
13925
- set_custom_element_data(goa_input, "width", "8ch");
13926
- set_custom_element_data(goa_input, "debounce", "500");
13927
- set_custom_element_data(goa_input, "min", "1");
13928
- set_custom_element_data(goa_input, "max",
13929
- /*_pageCount*/
13930
- ctx[8]);
13948
+ set_custom_element_data(goa_dropdown, "width", "70px");
13931
13949
  set_custom_element_data(goa_block, "data-testid", "page-selector");
13932
13950
  set_custom_element_data(goa_block, "alignment", "center");
13933
13951
  set_custom_element_data(goa_block, "gap", "s");
@@ -13942,10 +13960,15 @@ function create_if_block$6(ctx) {
13942
13960
 
13943
13961
  ctx[12](input);
13944
13962
  append(goa_block, t2);
13945
- append(goa_block, goa_input);
13946
- /*goa_input_binding*/
13963
+ append(goa_block, goa_dropdown);
13964
+
13965
+ for (let i = 0; i < each_blocks.length; i += 1) {
13966
+ each_blocks[i].m(goa_dropdown, null);
13967
+ }
13968
+ /*goa_dropdown_binding*/
13969
+
13947
13970
 
13948
- ctx[13](goa_input);
13971
+ ctx[13](goa_dropdown);
13949
13972
  append(goa_block, t3);
13950
13973
  append(goa_block, span1);
13951
13974
  append(span1, t4);
@@ -13953,22 +13976,43 @@ function create_if_block$6(ctx) {
13953
13976
  },
13954
13977
 
13955
13978
  p(ctx, dirty) {
13979
+ if (dirty &
13980
+ /*_pageCount*/
13981
+ 256) {
13982
+ each_value = {
13983
+ length:
13984
+ /*_pageCount*/
13985
+ ctx[8]
13986
+ };
13987
+ let i;
13988
+
13989
+ for (i = 0; i < each_value.length; i += 1) {
13990
+ const child_ctx = get_each_context$2(ctx, each_value, i);
13991
+
13992
+ if (each_blocks[i]) {
13993
+ each_blocks[i].p(child_ctx, dirty);
13994
+ } else {
13995
+ each_blocks[i] = create_each_block$2(child_ctx);
13996
+ each_blocks[i].c();
13997
+ each_blocks[i].m(goa_dropdown, null);
13998
+ }
13999
+ }
14000
+
14001
+ for (; i < each_blocks.length; i += 1) {
14002
+ each_blocks[i].d(1);
14003
+ }
14004
+
14005
+ each_blocks.length = each_value.length;
14006
+ }
14007
+
13956
14008
  if (dirty &
13957
14009
  /*pagenumber*/
13958
14010
  1) {
13959
- set_custom_element_data(goa_input, "value",
14011
+ set_custom_element_data(goa_dropdown, "value",
13960
14012
  /*pagenumber*/
13961
14013
  ctx[0]);
13962
14014
  }
13963
14015
 
13964
- if (dirty &
13965
- /*_pageCount*/
13966
- 256) {
13967
- set_custom_element_data(goa_input, "max",
13968
- /*_pageCount*/
13969
- ctx[8]);
13970
- }
13971
-
13972
14016
  if (dirty &
13973
14017
  /*_pageCount*/
13974
14018
  256) set_data(t5,
@@ -13981,11 +14025,39 @@ function create_if_block$6(ctx) {
13981
14025
  /*input_binding*/
13982
14026
 
13983
14027
  ctx[12](null);
13984
- /*goa_input_binding*/
14028
+ destroy_each(each_blocks, detaching);
14029
+ /*goa_dropdown_binding*/
13985
14030
 
13986
14031
  ctx[13](null);
13987
14032
  }
13988
14033
 
14034
+ };
14035
+ } // (71:10) {#each {length: _pageCount} as _, i}
14036
+
14037
+
14038
+ function create_each_block$2(ctx) {
14039
+ let goa_dropdown_item;
14040
+ return {
14041
+ c() {
14042
+ goa_dropdown_item = element("goa-dropdown-item");
14043
+ set_custom_element_data(goa_dropdown_item, "value",
14044
+ /*i*/
14045
+ ctx[20] + 1);
14046
+ set_custom_element_data(goa_dropdown_item, "label",
14047
+ /*i*/
14048
+ ctx[20] + 1);
14049
+ },
14050
+
14051
+ m(target, anchor) {
14052
+ insert(target, goa_dropdown_item, anchor);
14053
+ },
14054
+
14055
+ p: noop,
14056
+
14057
+ d(detaching) {
14058
+ if (detaching) detach(goa_dropdown_item);
14059
+ }
14060
+
13989
14061
  };
13990
14062
  }
13991
14063
 
@@ -14181,7 +14253,7 @@ function instance$d($$self, $$props, $$invalidate) {
14181
14253
  ml = null
14182
14254
  } = $$props; // private
14183
14255
 
14184
- let inputEl = null;
14256
+ let pageDropdownEl = null;
14185
14257
  let hiddenEl = null; // needed to allow the inputEl's event to be cancelled
14186
14258
  // hooks
14187
14259
 
@@ -14191,17 +14263,11 @@ function instance$d($$self, $$props, $$invalidate) {
14191
14263
  itemcount,
14192
14264
  pagenumber
14193
14265
  });
14194
- validateVariant(variant); // prevent event propagation if value is non-numeric
14195
- // (input[type=number] returns blank for non-numeric numbers)
14266
+ validateVariant(variant); // prevent event propagation
14196
14267
 
14197
- inputEl && inputEl.addEventListener("_change", e => {
14268
+ pageDropdownEl && pageDropdownEl.addEventListener("_change", e => {
14198
14269
  const page = Number.parseInt(e.detail.value);
14199
14270
  e.stopPropagation();
14200
-
14201
- if (isNaN(page)) {
14202
- return;
14203
- }
14204
-
14205
14271
  hiddenEl.dispatchEvent(new CustomEvent("_change", {
14206
14272
  composed: true,
14207
14273
  bubbles: true,
@@ -14235,10 +14301,10 @@ function instance$d($$self, $$props, $$invalidate) {
14235
14301
  });
14236
14302
  }
14237
14303
 
14238
- function goa_input_binding($$value) {
14304
+ function goa_dropdown_binding($$value) {
14239
14305
  binding_callbacks[$$value ? 'unshift' : 'push'](() => {
14240
- inputEl = $$value;
14241
- $$invalidate(6, inputEl);
14306
+ pageDropdownEl = $$value;
14307
+ $$invalidate(6, pageDropdownEl);
14242
14308
  });
14243
14309
  }
14244
14310
 
@@ -14266,7 +14332,7 @@ function instance$d($$self, $$props, $$invalidate) {
14266
14332
  }
14267
14333
  };
14268
14334
 
14269
- return [pagenumber, variant, mt, mr, mb, ml, inputEl, hiddenEl, _pageCount, goto, itemcount, perpagecount, input_binding, goa_input_binding, click_handler, click_handler_1];
14335
+ return [pagenumber, variant, mt, mr, mb, ml, pageDropdownEl, hiddenEl, _pageCount, goto, itemcount, perpagecount, input_binding, goa_dropdown_binding, click_handler, click_handler_1];
14270
14336
  }
14271
14337
 
14272
14338
  class Pagination extends SvelteElement {
package/react-components.umd.js CHANGED
@@ -6772,7 +6772,7 @@
6772
6772
  return child_ctx;
6773
6773
  }
6774
6774
 
6775
- function get_each_context$4(ctx, list, i) {
6775
+ function get_each_context$5(ctx, list, i) {
6776
6776
  const child_ctx = ctx.slice();
6777
6777
  child_ctx[50] = list[i];
6778
6778
  return child_ctx;
@@ -7072,7 +7072,7 @@
7072
7072
  let each_blocks = [];
7073
7073
 
7074
7074
  for (let i = 0; i < each_value.length; i += 1) {
7075
- each_blocks[i] = create_each_block$4(get_each_context$4(ctx, each_value, i));
7075
+ each_blocks[i] = create_each_block$5(get_each_context$5(ctx, each_value, i));
7076
7076
  }
7077
7077
 
7078
7078
  return {
@@ -7127,12 +7127,12 @@
7127
7127
  let i;
7128
7128
 
7129
7129
  for (i = 0; i < each_value.length; i += 1) {
7130
- const child_ctx = get_each_context$4(ctx, each_value, i);
7130
+ const child_ctx = get_each_context$5(ctx, each_value, i);
7131
7131
 
7132
7132
  if (each_blocks[i]) {
7133
7133
  each_blocks[i].p(child_ctx, dirty);
7134
7134
  } else {
7135
- each_blocks[i] = create_each_block$4(child_ctx);
7135
+ each_blocks[i] = create_each_block$5(child_ctx);
7136
7136
  each_blocks[i].c();
7137
7137
  each_blocks[i].m(select, null);
7138
7138
  }
@@ -7423,7 +7423,7 @@
7423
7423
  } // (260:6) {#each _options as option}
7424
7424
 
7425
7425
 
7426
- function create_each_block$4(ctx) {
7426
+ function create_each_block$5(ctx) {
7427
7427
  let option;
7428
7428
  let t0_value =
7429
7429
  /*option*/
@@ -8021,7 +8021,7 @@
8021
8021
  class Dropdown extends SvelteElement {
8022
8022
  constructor(options) {
8023
8023
  super();
8024
- this.shadowRoot.innerHTML = `<style>:host{box-sizing:border-box;font-family:var(--goa-font-family-sans)}.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(--goa-color-greyscale-white);border-radius:var(--goa-border-radius-m);outline:none;box-shadow:var(--shadow-1);z-index:99;bottom:var(--bottom);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(--goa-color-greyscale-black);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.dropdown-item--tabbed{background:var(--goa-color-greyscale-100);color:var(--goa-color-interactive-hover)}.dropdown-item--disabled{opacity:0.5;cursor:default}.dropdown-item--disabled:hover{cursor:default;color:var(--goa-color-greyscale-700)}.dropdown-item--selected{background:var(--goa-color-interactive-default);color:var(--goa-color-greyscale-white)}.dropdown-item--tabbed.dropdown-item--selected,.dropdown-item--selected:hover{background:var(--goa-color-interactive-hover);color:var(--goa-color-greyscale-white)}.dropdown-native{border:1px solid var(--goa-color-greyscale-700);border-radius:var(--goa-border-radius-m);background-color:var(--goa-color-greyscale-white);transition:box-shadow 0.1s ease-in}.dropdown-native:has(select:disabled){background-color:var(--goa-color-greyscale-100);border-color:var(--goa-color-greyscale-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)}.dropdown-native:hover{border-color:var(--goa-color-interactive-hover);box-shadow:0 0 0 var(--goa-border-width-m) var(--goa-color-interactive-hover)}select{border:none;background-color:transparent;color:var(--goa-color-text-default);font-size:var(--goa-font-size-4);appearance:none;padding:calc(var(--goa-space-xs) + 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>`;
8024
+ this.shadowRoot.innerHTML = `<style>:host{box-sizing:border-box;font-family:var(--goa-font-family-sans)}.dropdown{position:relative;cursor:pointer;display:inline-block;width:var(--width, 100%)}.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(--goa-color-greyscale-white);border-radius:var(--goa-border-radius-m);outline:none;box-shadow:var(--shadow-1);z-index:99;bottom:var(--bottom);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(--goa-color-greyscale-black);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.dropdown-item--tabbed{background:var(--goa-color-greyscale-100);color:var(--goa-color-interactive-hover)}.dropdown-item--disabled{opacity:0.5;cursor:default}.dropdown-item--disabled:hover{cursor:default;color:var(--goa-color-greyscale-700)}.dropdown-item--selected{background:var(--goa-color-interactive-default);color:var(--goa-color-greyscale-white)}.dropdown-item--tabbed.dropdown-item--selected,.dropdown-item--selected:hover{background:var(--goa-color-interactive-hover);color:var(--goa-color-greyscale-white)}.dropdown-native{border:1px solid var(--goa-color-greyscale-700);border-radius:var(--goa-border-radius-m);background-color:var(--goa-color-greyscale-white);transition:box-shadow 0.1s ease-in}.dropdown-native:has(select:disabled){background-color:var(--goa-color-greyscale-100);border-color:var(--goa-color-greyscale-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)}.dropdown-native:hover{border-color:var(--goa-color-interactive-hover);box-shadow:0 0 0 var(--goa-border-width-m) var(--goa-color-interactive-hover)}select{border:none;background-color:transparent;color:var(--goa-color-text-default);font-size:var(--goa-font-size-4);appearance:none;padding:calc(var(--goa-space-xs) + 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>`;
8025
8025
  init(this, {
8026
8026
  target: this.shadowRoot,
8027
8027
  props: attribute_to_object(this.attributes),
@@ -8767,14 +8767,14 @@
8767
8767
  customElements.define("goa-app-footer", Footer);
8768
8768
  /* libs/web-components/src/components/footer-meta-section/FooterMetaSection.svelte generated by Svelte v3.51.0 */
8769
8769
 
8770
- function get_each_context$3(ctx, list, i) {
8770
+ function get_each_context$4(ctx, list, i) {
8771
8771
  const child_ctx = ctx.slice();
8772
8772
  child_ctx[3] = list[i];
8773
8773
  return child_ctx;
8774
8774
  } // (52:4) {#each children as child}
8775
8775
 
8776
8776
 
8777
- function create_each_block$3(ctx) {
8777
+ function create_each_block$4(ctx) {
8778
8778
  let li;
8779
8779
  let a;
8780
8780
  let t_value =
@@ -8832,7 +8832,7 @@
8832
8832
  let each_blocks = [];
8833
8833
 
8834
8834
  for (let i = 0; i < each_value.length; i += 1) {
8835
- each_blocks[i] = create_each_block$3(get_each_context$3(ctx, each_value, i));
8835
+ each_blocks[i] = create_each_block$4(get_each_context$4(ctx, each_value, i));
8836
8836
  }
8837
8837
 
8838
8838
  return {
@@ -8876,12 +8876,12 @@
8876
8876
  let i;
8877
8877
 
8878
8878
  for (i = 0; i < each_value.length; i += 1) {
8879
- const child_ctx = get_each_context$3(ctx, each_value, i);
8879
+ const child_ctx = get_each_context$4(ctx, each_value, i);
8880
8880
 
8881
8881
  if (each_blocks[i]) {
8882
8882
  each_blocks[i].p(child_ctx, dirty);
8883
8883
  } else {
8884
- each_blocks[i] = create_each_block$3(child_ctx);
8884
+ each_blocks[i] = create_each_block$4(child_ctx);
8885
8885
  each_blocks[i].c();
8886
8886
  each_blocks[i].m(ul, null);
8887
8887
  }
@@ -8958,7 +8958,7 @@
8958
8958
  customElements.define("goa-app-footer-meta-section", FooterMetaSection);
8959
8959
  /* libs/web-components/src/components/footer-nav-section/FooterNavSection.svelte generated by Svelte v3.51.0 */
8960
8960
 
8961
- function get_each_context$2(ctx, list, i) {
8961
+ function get_each_context$3(ctx, list, i) {
8962
8962
  const child_ctx = ctx.slice();
8963
8963
  child_ctx[5] = list[i];
8964
8964
  return child_ctx;
@@ -9007,7 +9007,7 @@
9007
9007
  } // (49:4) {#each children as child}
9008
9008
 
9009
9009
 
9010
- function create_each_block$2(ctx) {
9010
+ function create_each_block$3(ctx) {
9011
9011
  let li;
9012
9012
  let a;
9013
9013
  let t_value =
@@ -9070,7 +9070,7 @@
9070
9070
  let each_blocks = [];
9071
9071
 
9072
9072
  for (let i = 0; i < each_value.length; i += 1) {
9073
- each_blocks[i] = create_each_block$2(get_each_context$2(ctx, each_value, i));
9073
+ each_blocks[i] = create_each_block$3(get_each_context$3(ctx, each_value, i));
9074
9074
  }
9075
9075
 
9076
9076
  return {
@@ -9148,12 +9148,12 @@
9148
9148
  let i;
9149
9149
 
9150
9150
  for (i = 0; i < each_value.length; i += 1) {
9151
- const child_ctx = get_each_context$2(ctx, each_value, i);
9151
+ const child_ctx = get_each_context$3(ctx, each_value, i);
9152
9152
 
9153
9153
  if (each_blocks[i]) {
9154
9154
  each_blocks[i].p(child_ctx, dirty);
9155
9155
  } else {
9156
- each_blocks[i] = create_each_block$2(child_ctx);
9156
+ each_blocks[i] = create_each_block$3(child_ctx);
9157
9157
  each_blocks[i].c();
9158
9158
  each_blocks[i].m(ul, null);
9159
9159
  }
@@ -13937,17 +13937,36 @@
13937
13937
  customElements.define("goa-page-block", PageBlock);
13938
13938
  /* libs/web-components/src/components/pagination/Pagination.svelte generated by Svelte v3.51.0 */
13939
13939
 
13940
+ function get_each_context$2(ctx, list, i) {
13941
+ const child_ctx = ctx.slice();
13942
+ child_ctx[18] = list[i];
13943
+ child_ctx[20] = i;
13944
+ return child_ctx;
13945
+ } // (66:4) {#if variant === "all"}
13946
+
13947
+
13940
13948
  function create_if_block$6(ctx) {
13941
13949
  let goa_block;
13942
13950
  let span0;
13943
13951
  let t1;
13944
13952
  let input;
13945
13953
  let t2;
13946
- let goa_input;
13954
+ let goa_dropdown;
13947
13955
  let t3;
13948
13956
  let span1;
13949
13957
  let t4;
13950
13958
  let t5;
13959
+ let each_value = {
13960
+ length:
13961
+ /*_pageCount*/
13962
+ ctx[8]
13963
+ };
13964
+ let each_blocks = [];
13965
+
13966
+ for (let i = 0; i < each_value.length; i += 1) {
13967
+ each_blocks[i] = create_each_block$2(get_each_context$2(ctx, each_value, i));
13968
+ }
13969
+
13951
13970
  return {
13952
13971
  c() {
13953
13972
  goa_block = element("goa-block");
@@ -13956,7 +13975,12 @@
13956
13975
  t1 = space();
13957
13976
  input = element("input");
13958
13977
  t2 = space();
13959
- goa_input = element("goa-input");
13978
+ goa_dropdown = element("goa-dropdown");
13979
+
13980
+ for (let i = 0; i < each_blocks.length; i += 1) {
13981
+ each_blocks[i].c();
13982
+ }
13983
+
13960
13984
  t3 = space();
13961
13985
  span1 = element("span");
13962
13986
  t4 = text("of ");
@@ -13964,16 +13988,10 @@
13964
13988
  /*_pageCount*/
13965
13989
  ctx[8]);
13966
13990
  attr(input, "type", "hidden");
13967
- set_custom_element_data(goa_input, "type", "number");
13968
- set_custom_element_data(goa_input, "value",
13991
+ set_custom_element_data(goa_dropdown, "value",
13969
13992
  /*pagenumber*/
13970
13993
  ctx[0]);
13971
- set_custom_element_data(goa_input, "width", "8ch");
13972
- set_custom_element_data(goa_input, "debounce", "500");
13973
- set_custom_element_data(goa_input, "min", "1");
13974
- set_custom_element_data(goa_input, "max",
13975
- /*_pageCount*/
13976
- ctx[8]);
13994
+ set_custom_element_data(goa_dropdown, "width", "70px");
13977
13995
  set_custom_element_data(goa_block, "data-testid", "page-selector");
13978
13996
  set_custom_element_data(goa_block, "alignment", "center");
13979
13997
  set_custom_element_data(goa_block, "gap", "s");
@@ -13988,10 +14006,15 @@
13988
14006
 
13989
14007
  ctx[12](input);
13990
14008
  append(goa_block, t2);
13991
- append(goa_block, goa_input);
13992
- /*goa_input_binding*/
14009
+ append(goa_block, goa_dropdown);
14010
+
14011
+ for (let i = 0; i < each_blocks.length; i += 1) {
14012
+ each_blocks[i].m(goa_dropdown, null);
14013
+ }
14014
+ /*goa_dropdown_binding*/
14015
+
13993
14016
 
13994
- ctx[13](goa_input);
14017
+ ctx[13](goa_dropdown);
13995
14018
  append(goa_block, t3);
13996
14019
  append(goa_block, span1);
13997
14020
  append(span1, t4);
@@ -13999,22 +14022,43 @@
13999
14022
  },
14000
14023
 
14001
14024
  p(ctx, dirty) {
14025
+ if (dirty &
14026
+ /*_pageCount*/
14027
+ 256) {
14028
+ each_value = {
14029
+ length:
14030
+ /*_pageCount*/
14031
+ ctx[8]
14032
+ };
14033
+ let i;
14034
+
14035
+ for (i = 0; i < each_value.length; i += 1) {
14036
+ const child_ctx = get_each_context$2(ctx, each_value, i);
14037
+
14038
+ if (each_blocks[i]) {
14039
+ each_blocks[i].p(child_ctx, dirty);
14040
+ } else {
14041
+ each_blocks[i] = create_each_block$2(child_ctx);
14042
+ each_blocks[i].c();
14043
+ each_blocks[i].m(goa_dropdown, null);
14044
+ }
14045
+ }
14046
+
14047
+ for (; i < each_blocks.length; i += 1) {
14048
+ each_blocks[i].d(1);
14049
+ }
14050
+
14051
+ each_blocks.length = each_value.length;
14052
+ }
14053
+
14002
14054
  if (dirty &
14003
14055
  /*pagenumber*/
14004
14056
  1) {
14005
- set_custom_element_data(goa_input, "value",
14057
+ set_custom_element_data(goa_dropdown, "value",
14006
14058
  /*pagenumber*/
14007
14059
  ctx[0]);
14008
14060
  }
14009
14061
 
14010
- if (dirty &
14011
- /*_pageCount*/
14012
- 256) {
14013
- set_custom_element_data(goa_input, "max",
14014
- /*_pageCount*/
14015
- ctx[8]);
14016
- }
14017
-
14018
14062
  if (dirty &
14019
14063
  /*_pageCount*/
14020
14064
  256) set_data(t5,
@@ -14027,11 +14071,39 @@
14027
14071
  /*input_binding*/
14028
14072
 
14029
14073
  ctx[12](null);
14030
- /*goa_input_binding*/
14074
+ destroy_each(each_blocks, detaching);
14075
+ /*goa_dropdown_binding*/
14031
14076
 
14032
14077
  ctx[13](null);
14033
14078
  }
14034
14079
 
14080
+ };
14081
+ } // (71:10) {#each {length: _pageCount} as _, i}
14082
+
14083
+
14084
+ function create_each_block$2(ctx) {
14085
+ let goa_dropdown_item;
14086
+ return {
14087
+ c() {
14088
+ goa_dropdown_item = element("goa-dropdown-item");
14089
+ set_custom_element_data(goa_dropdown_item, "value",
14090
+ /*i*/
14091
+ ctx[20] + 1);
14092
+ set_custom_element_data(goa_dropdown_item, "label",
14093
+ /*i*/
14094
+ ctx[20] + 1);
14095
+ },
14096
+
14097
+ m(target, anchor) {
14098
+ insert(target, goa_dropdown_item, anchor);
14099
+ },
14100
+
14101
+ p: noop,
14102
+
14103
+ d(detaching) {
14104
+ if (detaching) detach(goa_dropdown_item);
14105
+ }
14106
+
14035
14107
  };
14036
14108
  }
14037
14109
 
@@ -14227,7 +14299,7 @@
14227
14299
  ml = null
14228
14300
  } = $$props; // private
14229
14301
 
14230
- let inputEl = null;
14302
+ let pageDropdownEl = null;
14231
14303
  let hiddenEl = null; // needed to allow the inputEl's event to be cancelled
14232
14304
  // hooks
14233
14305
 
@@ -14237,17 +14309,11 @@
14237
14309
  itemcount,
14238
14310
  pagenumber
14239
14311
  });
14240
- validateVariant(variant); // prevent event propagation if value is non-numeric
14241
- // (input[type=number] returns blank for non-numeric numbers)
14312
+ validateVariant(variant); // prevent event propagation
14242
14313
 
14243
- inputEl && inputEl.addEventListener("_change", e => {
14314
+ pageDropdownEl && pageDropdownEl.addEventListener("_change", e => {
14244
14315
  const page = Number.parseInt(e.detail.value);
14245
14316
  e.stopPropagation();
14246
-
14247
- if (isNaN(page)) {
14248
- return;
14249
- }
14250
-
14251
14317
  hiddenEl.dispatchEvent(new CustomEvent("_change", {
14252
14318
  composed: true,
14253
14319
  bubbles: true,
@@ -14282,10 +14348,10 @@
14282
14348
  });
14283
14349
  }
14284
14350
 
14285
- function goa_input_binding($$value) {
14351
+ function goa_dropdown_binding($$value) {
14286
14352
  binding_callbacks[$$value ? 'unshift' : 'push'](() => {
14287
- inputEl = $$value;
14288
- $$invalidate(6, inputEl);
14353
+ pageDropdownEl = $$value;
14354
+ $$invalidate(6, pageDropdownEl);
14289
14355
  });
14290
14356
  }
14291
14357
 
@@ -14313,7 +14379,7 @@
14313
14379
  }
14314
14380
  };
14315
14381
 
14316
- return [pagenumber, variant, mt, mr, mb, ml, inputEl, hiddenEl, _pageCount, goto, itemcount, perpagecount, input_binding, goa_input_binding, click_handler, click_handler_1];
14382
+ return [pagenumber, variant, mt, mr, mb, ml, pageDropdownEl, hiddenEl, _pageCount, goto, itemcount, perpagecount, input_binding, goa_dropdown_binding, click_handler, click_handler_1];
14317
14383
  }
14318
14384
 
14319
14385
  class Pagination extends SvelteElement {