@abgov/react-components 4.0.0-alpha.106 → 4.0.0-alpha.107

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.
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@abgov/react-components",
3
- "version": "4.0.0-alpha.106",
3
+ "version": "4.0.0-alpha.107",
4
4
  "description": "Government of Alberta - UI components for React",
5
5
  "bugs": {
6
6
  "url": "https://github.com/GovAlta/ui-components/issues"
@@ -7738,8 +7738,6 @@ function create_if_block$a(ctx) {
7738
7738
  }
7739
7739
 
7740
7740
  function create_fragment$n(ctx) {
7741
- var _ctx$;
7742
-
7743
7741
  let div5;
7744
7742
  let div4;
7745
7743
  let div0;
@@ -7755,11 +7753,11 @@ function create_fragment$n(ctx) {
7755
7753
  let div5_style_value;
7756
7754
  let if_block =
7757
7755
  /*navLinks*/
7758
- ((_ctx$ = ctx[2]) === null || _ctx$ === void 0 ? void 0 : _ctx$.length) && create_if_block$a();
7756
+ ctx[2] &&
7757
+ /*navLinks*/
7758
+ ctx[2].length > 0 && create_if_block$a();
7759
7759
  return {
7760
7760
  c() {
7761
- var _ctx$2, _ctx$3;
7762
-
7763
7761
  div5 = element("div");
7764
7762
  div4 = element("div");
7765
7763
  div0 = element("div");
@@ -7788,11 +7786,15 @@ function create_fragment$n(ctx) {
7788
7786
  attr(div2, "class", "abgov");
7789
7787
  toggle_class(div2, "with-meta-links",
7790
7788
  /*metaLinks*/
7791
- (_ctx$2 = ctx[3]) === null || _ctx$2 === void 0 ? void 0 : _ctx$2.length);
7789
+ ctx[3] &&
7790
+ /*metaLinks*/
7791
+ ctx[3].length > 0);
7792
7792
  attr(div3, "class", "meta-section");
7793
7793
  toggle_class(div3, "with-meta-links",
7794
7794
  /*metaLinks*/
7795
- (_ctx$3 = ctx[3]) === null || _ctx$3 === void 0 ? void 0 : _ctx$3.length);
7795
+ ctx[3] &&
7796
+ /*metaLinks*/
7797
+ ctx[3].length > 0);
7796
7798
  attr(div4, "class", "content");
7797
7799
  attr(div5, "class", "app-footer");
7798
7800
  attr(div5, "style", div5_style_value = `--max-content-width: ${
@@ -7820,11 +7822,11 @@ function create_fragment$n(ctx) {
7820
7822
  },
7821
7823
 
7822
7824
  p(ctx, [dirty]) {
7823
- var _ctx$4;
7824
-
7825
7825
  if (
7826
7826
  /*navLinks*/
7827
- (_ctx$4 = ctx[2]) !== null && _ctx$4 !== void 0 && _ctx$4.length) {
7827
+ ctx[2] &&
7828
+ /*navLinks*/
7829
+ ctx[2].length > 0) {
7828
7830
  if (if_block) ;else {
7829
7831
  if_block = create_if_block$a();
7830
7832
  if_block.c();
@@ -7838,21 +7840,21 @@ function create_fragment$n(ctx) {
7838
7840
  if (dirty &
7839
7841
  /*metaLinks*/
7840
7842
  8) {
7841
- var _ctx$5;
7842
-
7843
7843
  toggle_class(div2, "with-meta-links",
7844
7844
  /*metaLinks*/
7845
- (_ctx$5 = ctx[3]) === null || _ctx$5 === void 0 ? void 0 : _ctx$5.length);
7845
+ ctx[3] &&
7846
+ /*metaLinks*/
7847
+ ctx[3].length > 0);
7846
7848
  }
7847
7849
 
7848
7850
  if (dirty &
7849
7851
  /*metaLinks*/
7850
7852
  8) {
7851
- var _ctx$6;
7852
-
7853
7853
  toggle_class(div3, "with-meta-links",
7854
7854
  /*metaLinks*/
7855
- (_ctx$6 = ctx[3]) === null || _ctx$6 === void 0 ? void 0 : _ctx$6.length);
7855
+ ctx[3] &&
7856
+ /*metaLinks*/
7857
+ ctx[3].length > 0);
7856
7858
  }
7857
7859
 
7858
7860
  if (dirty &
@@ -11110,7 +11112,7 @@ function instance$d($$self, $$props, $$invalidate) {
11110
11112
  class Input extends SvelteElement {
11111
11113
  constructor(options) {
11112
11114
  super();
11113
- 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;line-height:normal}.goa-input{box-sizing:border-box;outline:none;transition:box-shadow 0.1s ease-in;border:1px solid var(--goa-color-greyscale-700);border-radius:var(--goa-border-radius-m);display:inline-flex;align-items:stretch;vertical-align:middle;min-width:100%;background-color:var(--color-white)}.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-default);font-size:var(--goa-font-size-4);padding:var(--goa-space-xs);line-height:calc(40px - calc(var(--goa-space-xs) * 2));background-color:transparent;width:100%;flex:1 1 auto;font-family:var(--goa-font-family-sans)}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(--goa-color-greyscale-100);border-color:var(--goa-color-greyscale-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(--goa-color-greyscale-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(--goa-border-radius-m);border-bottom-left-radius:var(--goa-border-radius-m);border-right:1px solid var(--goa-color-greyscale-700)}.suffix,.trailing-content ::slotted(div){border-top-right-radius:var(--goa-border-radius-m);border-bottom-right-radius:var(--goa-border-radius-m);border-left:1px solid var(--goa-color-greyscale-700)}.goa-input--disabled .prefix,.goa-input--disabled .leading-content ::slotted(div){border-right:1px solid var(--goa-color-greyscale-200)}.goa-input--disabled .suffix,.goa-input--disabled .trailing-content ::slotted(div){border-left:1px solid var(--goa-color-greyscale-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>')
11115
+ 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;line-height:normal}.goa-input{box-sizing:border-box;outline:none;transition:box-shadow 0.1s ease-in;border:1px solid var(--goa-color-greyscale-700);border-radius:var(--goa-border-radius-m);display:inline-flex;align-items:stretch;vertical-align:middle;min-width:100%;background-color:var(--goa-color-greyscale-white)}.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-default);font-size:var(--goa-font-size-4);padding:var(--goa-space-xs);line-height:calc(40px - calc(var(--goa-space-xs) * 2));background-color:transparent;width:100%;flex:1 1 auto;font-family:var(--goa-font-family-sans)}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(--goa-color-greyscale-100);border-color:var(--goa-color-greyscale-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(--goa-color-greyscale-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(--goa-border-radius-m);border-bottom-left-radius:var(--goa-border-radius-m);border-right:1px solid var(--goa-color-greyscale-700)}.suffix,.trailing-content ::slotted(div){border-top-right-radius:var(--goa-border-radius-m);border-bottom-right-radius:var(--goa-border-radius-m);border-left:1px solid var(--goa-color-greyscale-700)}.goa-input--disabled .prefix,.goa-input--disabled .leading-content ::slotted(div){border-right:1px solid var(--goa-color-greyscale-200)}.goa-input--disabled .suffix,.goa-input--disabled .trailing-content ::slotted(div){border-left:1px solid var(--goa-color-greyscale-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>')
11114
11116
  center center no-repeat}</style>`;
11115
11117
  init(this, {
11116
11118
  target: this.shadowRoot,
@@ -7782,8 +7782,6 @@
7782
7782
  }
7783
7783
 
7784
7784
  function create_fragment$n(ctx) {
7785
- var _ctx$;
7786
-
7787
7785
  let div5;
7788
7786
  let div4;
7789
7787
  let div0;
@@ -7799,11 +7797,11 @@
7799
7797
  let div5_style_value;
7800
7798
  let if_block =
7801
7799
  /*navLinks*/
7802
- ((_ctx$ = ctx[2]) === null || _ctx$ === void 0 ? void 0 : _ctx$.length) && create_if_block$a();
7800
+ ctx[2] &&
7801
+ /*navLinks*/
7802
+ ctx[2].length > 0 && create_if_block$a();
7803
7803
  return {
7804
7804
  c() {
7805
- var _ctx$2, _ctx$3;
7806
-
7807
7805
  div5 = element("div");
7808
7806
  div4 = element("div");
7809
7807
  div0 = element("div");
@@ -7832,11 +7830,15 @@
7832
7830
  attr(div2, "class", "abgov");
7833
7831
  toggle_class(div2, "with-meta-links",
7834
7832
  /*metaLinks*/
7835
- (_ctx$2 = ctx[3]) === null || _ctx$2 === void 0 ? void 0 : _ctx$2.length);
7833
+ ctx[3] &&
7834
+ /*metaLinks*/
7835
+ ctx[3].length > 0);
7836
7836
  attr(div3, "class", "meta-section");
7837
7837
  toggle_class(div3, "with-meta-links",
7838
7838
  /*metaLinks*/
7839
- (_ctx$3 = ctx[3]) === null || _ctx$3 === void 0 ? void 0 : _ctx$3.length);
7839
+ ctx[3] &&
7840
+ /*metaLinks*/
7841
+ ctx[3].length > 0);
7840
7842
  attr(div4, "class", "content");
7841
7843
  attr(div5, "class", "app-footer");
7842
7844
  attr(div5, "style", div5_style_value = `--max-content-width: ${
@@ -7864,11 +7866,11 @@
7864
7866
  },
7865
7867
 
7866
7868
  p(ctx, [dirty]) {
7867
- var _ctx$4;
7868
-
7869
7869
  if (
7870
7870
  /*navLinks*/
7871
- (_ctx$4 = ctx[2]) !== null && _ctx$4 !== void 0 && _ctx$4.length) {
7871
+ ctx[2] &&
7872
+ /*navLinks*/
7873
+ ctx[2].length > 0) {
7872
7874
  if (if_block) ;else {
7873
7875
  if_block = create_if_block$a();
7874
7876
  if_block.c();
@@ -7882,21 +7884,21 @@
7882
7884
  if (dirty &
7883
7885
  /*metaLinks*/
7884
7886
  8) {
7885
- var _ctx$5;
7886
-
7887
7887
  toggle_class(div2, "with-meta-links",
7888
7888
  /*metaLinks*/
7889
- (_ctx$5 = ctx[3]) === null || _ctx$5 === void 0 ? void 0 : _ctx$5.length);
7889
+ ctx[3] &&
7890
+ /*metaLinks*/
7891
+ ctx[3].length > 0);
7890
7892
  }
7891
7893
 
7892
7894
  if (dirty &
7893
7895
  /*metaLinks*/
7894
7896
  8) {
7895
- var _ctx$6;
7896
-
7897
7897
  toggle_class(div3, "with-meta-links",
7898
7898
  /*metaLinks*/
7899
- (_ctx$6 = ctx[3]) === null || _ctx$6 === void 0 ? void 0 : _ctx$6.length);
7899
+ ctx[3] &&
7900
+ /*metaLinks*/
7901
+ ctx[3].length > 0);
7900
7902
  }
7901
7903
 
7902
7904
  if (dirty &
@@ -11156,7 +11158,7 @@
11156
11158
  class Input extends SvelteElement {
11157
11159
  constructor(options) {
11158
11160
  super();
11159
- 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;line-height:normal}.goa-input{box-sizing:border-box;outline:none;transition:box-shadow 0.1s ease-in;border:1px solid var(--goa-color-greyscale-700);border-radius:var(--goa-border-radius-m);display:inline-flex;align-items:stretch;vertical-align:middle;min-width:100%;background-color:var(--color-white)}.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-default);font-size:var(--goa-font-size-4);padding:var(--goa-space-xs);line-height:calc(40px - calc(var(--goa-space-xs) * 2));background-color:transparent;width:100%;flex:1 1 auto;font-family:var(--goa-font-family-sans)}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(--goa-color-greyscale-100);border-color:var(--goa-color-greyscale-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(--goa-color-greyscale-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(--goa-border-radius-m);border-bottom-left-radius:var(--goa-border-radius-m);border-right:1px solid var(--goa-color-greyscale-700)}.suffix,.trailing-content ::slotted(div){border-top-right-radius:var(--goa-border-radius-m);border-bottom-right-radius:var(--goa-border-radius-m);border-left:1px solid var(--goa-color-greyscale-700)}.goa-input--disabled .prefix,.goa-input--disabled .leading-content ::slotted(div){border-right:1px solid var(--goa-color-greyscale-200)}.goa-input--disabled .suffix,.goa-input--disabled .trailing-content ::slotted(div){border-left:1px solid var(--goa-color-greyscale-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>')
11161
+ 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;line-height:normal}.goa-input{box-sizing:border-box;outline:none;transition:box-shadow 0.1s ease-in;border:1px solid var(--goa-color-greyscale-700);border-radius:var(--goa-border-radius-m);display:inline-flex;align-items:stretch;vertical-align:middle;min-width:100%;background-color:var(--goa-color-greyscale-white)}.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-default);font-size:var(--goa-font-size-4);padding:var(--goa-space-xs);line-height:calc(40px - calc(var(--goa-space-xs) * 2));background-color:transparent;width:100%;flex:1 1 auto;font-family:var(--goa-font-family-sans)}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(--goa-color-greyscale-100);border-color:var(--goa-color-greyscale-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(--goa-color-greyscale-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(--goa-border-radius-m);border-bottom-left-radius:var(--goa-border-radius-m);border-right:1px solid var(--goa-color-greyscale-700)}.suffix,.trailing-content ::slotted(div){border-top-right-radius:var(--goa-border-radius-m);border-bottom-right-radius:var(--goa-border-radius-m);border-left:1px solid var(--goa-color-greyscale-700)}.goa-input--disabled .prefix,.goa-input--disabled .leading-content ::slotted(div){border-right:1px solid var(--goa-color-greyscale-200)}.goa-input--disabled .suffix,.goa-input--disabled .trailing-content ::slotted(div){border-left:1px solid var(--goa-color-greyscale-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>')
11160
11162
  center center no-repeat}</style>`;
11161
11163
  init(this, {
11162
11164
  target: this.shadowRoot,