@abgov/web-components 1.9.0 → 1.10.0
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/html.html-data.json +1 -1
- package/index.css +1 -1
- package/package.json +1 -1
- package/web-components.es.js +699 -299
- package/web-components.umd.js +77 -65
package/web-components.es.js
CHANGED
|
@@ -977,7 +977,7 @@ function cssVar(name, value) {
|
|
|
977
977
|
|
|
978
978
|
/* libs/web-components/src/components/accordion/Accordion.svelte generated by Svelte v3.51.0 */
|
|
979
979
|
|
|
980
|
-
function create_fragment$
|
|
980
|
+
function create_fragment$Q(ctx) {
|
|
981
981
|
let div3;
|
|
982
982
|
let details;
|
|
983
983
|
let summary;
|
|
@@ -1116,7 +1116,7 @@ function create_fragment$P(ctx) {
|
|
|
1116
1116
|
};
|
|
1117
1117
|
}
|
|
1118
1118
|
|
|
1119
|
-
function instance$
|
|
1119
|
+
function instance$K($$self, $$props, $$invalidate) {
|
|
1120
1120
|
let isOpen;
|
|
1121
1121
|
const [HeadingSizes, validateHeadingSize] = typeValidator("Accordion heading size", ["small", "medium"]);
|
|
1122
1122
|
let { open = "false" } = $$props;
|
|
@@ -1191,8 +1191,8 @@ class Accordion extends SvelteElement {
|
|
|
1191
1191
|
props: attribute_to_object(this.attributes),
|
|
1192
1192
|
customElement: true
|
|
1193
1193
|
},
|
|
1194
|
-
instance$
|
|
1195
|
-
create_fragment$
|
|
1194
|
+
instance$K,
|
|
1195
|
+
create_fragment$Q,
|
|
1196
1196
|
safe_not_equal,
|
|
1197
1197
|
{
|
|
1198
1198
|
open: 10,
|
|
@@ -1420,7 +1420,7 @@ function create_if_block$o(ctx) {
|
|
|
1420
1420
|
};
|
|
1421
1421
|
}
|
|
1422
1422
|
|
|
1423
|
-
function create_fragment$
|
|
1423
|
+
function create_fragment$P(ctx) {
|
|
1424
1424
|
let div2;
|
|
1425
1425
|
let div1;
|
|
1426
1426
|
let t;
|
|
@@ -1486,7 +1486,7 @@ function create_fragment$O(ctx) {
|
|
|
1486
1486
|
};
|
|
1487
1487
|
}
|
|
1488
1488
|
|
|
1489
|
-
function instance$
|
|
1489
|
+
function instance$J($$self, $$props, $$invalidate) {
|
|
1490
1490
|
let { heading = "" } = $$props;
|
|
1491
1491
|
let { url = "" } = $$props;
|
|
1492
1492
|
let { testid = "" } = $$props;
|
|
@@ -1505,7 +1505,7 @@ function instance$I($$self, $$props, $$invalidate) {
|
|
|
1505
1505
|
class AppHeader extends SvelteElement {
|
|
1506
1506
|
constructor(options) {
|
|
1507
1507
|
super();
|
|
1508
|
-
this.shadowRoot.innerHTML = `<style>*{box-sizing:border-box;font-family:var(--goa-font-family-sans)}.app-header{margin:0 auto;background-color:var(--goa-color-greyscale-white);border-bottom:1px solid var(--goa-color-greyscale-100)
|
|
1508
|
+
this.shadowRoot.innerHTML = `<style>*{box-sizing:border-box;font-family:var(--goa-font-family-sans)}.app-header{margin:0 auto;background-color:var(--goa-color-greyscale-white);border-bottom:1px solid var(--goa-color-greyscale-100);padding:1rem 1rem}.content{margin:0 auto;width:min(var(--max-content-width), 100%);display:flex;align-items:center;justify-content:space-between}@media(min-width: 640px){.app-header{padding:1.5rem 2rem}}@media(min-width: 1024px){.app-header{padding:1.5rem 4.5rem}}.app-link{display:flex;align-items:center;text-decoration:none;color:inherit}.title{margin-left:0.5rem;overflow:hidden;white-space:nowrap;text-overflow:ellipsis}.image-desktop{display:none}.image-mobile{display:block}@media(min-width: 640px){.image-desktop{display:block}.image-mobile{display:none}.title{margin-left:1.75rem}.image-desktop{display:block}.image-mobile{display:none}}</style>`;
|
|
1509
1509
|
|
|
1510
1510
|
init(
|
|
1511
1511
|
this,
|
|
@@ -1514,8 +1514,8 @@ class AppHeader extends SvelteElement {
|
|
|
1514
1514
|
props: attribute_to_object(this.attributes),
|
|
1515
1515
|
customElement: true
|
|
1516
1516
|
},
|
|
1517
|
-
instance$
|
|
1518
|
-
create_fragment$
|
|
1517
|
+
instance$J,
|
|
1518
|
+
create_fragment$P,
|
|
1519
1519
|
safe_not_equal,
|
|
1520
1520
|
{
|
|
1521
1521
|
heading: 0,
|
|
@@ -1650,7 +1650,7 @@ function create_if_block$n(ctx) {
|
|
|
1650
1650
|
};
|
|
1651
1651
|
}
|
|
1652
1652
|
|
|
1653
|
-
function create_fragment$
|
|
1653
|
+
function create_fragment$O(ctx) {
|
|
1654
1654
|
let div;
|
|
1655
1655
|
let t;
|
|
1656
1656
|
let div_style_value;
|
|
@@ -1736,7 +1736,7 @@ function create_fragment$N(ctx) {
|
|
|
1736
1736
|
};
|
|
1737
1737
|
}
|
|
1738
1738
|
|
|
1739
|
-
function instance$
|
|
1739
|
+
function instance$I($$self, $$props, $$invalidate) {
|
|
1740
1740
|
let showIcon;
|
|
1741
1741
|
let iconType;
|
|
1742
1742
|
const [Types, validateType] = typeValidator("Badge type", ["success", "important", "information", "emergency", "dark", "midtone", "light"], true);
|
|
@@ -1801,8 +1801,8 @@ class Badge extends SvelteElement {
|
|
|
1801
1801
|
props: attribute_to_object(this.attributes),
|
|
1802
1802
|
customElement: true
|
|
1803
1803
|
},
|
|
1804
|
-
instance$
|
|
1805
|
-
create_fragment$
|
|
1804
|
+
instance$I,
|
|
1805
|
+
create_fragment$O,
|
|
1806
1806
|
safe_not_equal,
|
|
1807
1807
|
{
|
|
1808
1808
|
type: 0,
|
|
@@ -1910,7 +1910,7 @@ customElements.define("goa-badge", Badge);
|
|
|
1910
1910
|
|
|
1911
1911
|
/* libs/web-components/src/components/block/Block.svelte generated by Svelte v3.51.0 */
|
|
1912
1912
|
|
|
1913
|
-
function create_fragment$
|
|
1913
|
+
function create_fragment$N(ctx) {
|
|
1914
1914
|
let div;
|
|
1915
1915
|
let slot;
|
|
1916
1916
|
let div_style_value;
|
|
@@ -1951,7 +1951,7 @@ function create_fragment$M(ctx) {
|
|
|
1951
1951
|
};
|
|
1952
1952
|
}
|
|
1953
1953
|
|
|
1954
|
-
function instance$
|
|
1954
|
+
function instance$H($$self, $$props, $$invalidate) {
|
|
1955
1955
|
let { gap = "m" } = $$props;
|
|
1956
1956
|
let { direction = "row" } = $$props;
|
|
1957
1957
|
let { alignment = "start" } = $$props;
|
|
@@ -1985,8 +1985,8 @@ class Block extends SvelteElement {
|
|
|
1985
1985
|
props: attribute_to_object(this.attributes),
|
|
1986
1986
|
customElement: true
|
|
1987
1987
|
},
|
|
1988
|
-
instance$
|
|
1989
|
-
create_fragment$
|
|
1988
|
+
instance$H,
|
|
1989
|
+
create_fragment$N,
|
|
1990
1990
|
safe_not_equal,
|
|
1991
1991
|
{
|
|
1992
1992
|
gap: 0,
|
|
@@ -2238,7 +2238,7 @@ function create_if_block_1$d(ctx) {
|
|
|
2238
2238
|
};
|
|
2239
2239
|
}
|
|
2240
2240
|
|
|
2241
|
-
function create_fragment$
|
|
2241
|
+
function create_fragment$M(ctx) {
|
|
2242
2242
|
let button;
|
|
2243
2243
|
let button_class_value;
|
|
2244
2244
|
let button_style_value;
|
|
@@ -2326,7 +2326,7 @@ function create_fragment$L(ctx) {
|
|
|
2326
2326
|
};
|
|
2327
2327
|
}
|
|
2328
2328
|
|
|
2329
|
-
function instance$
|
|
2329
|
+
function instance$G($$self, $$props, $$invalidate) {
|
|
2330
2330
|
let isDisabled;
|
|
2331
2331
|
let isButtonDark;
|
|
2332
2332
|
const [Types, validateType] = typeValidator("Button type", ["primary", "submit", "secondary", "tertiary", "start"], true);
|
|
@@ -2403,7 +2403,7 @@ class Button extends SvelteElement {
|
|
|
2403
2403
|
super();
|
|
2404
2404
|
|
|
2405
2405
|
this.shadowRoot.innerHTML = `<style>:host{--button-height:2.625rem;--button-height-compact:2rem;--button-height-tall:3.25rem;box-sizing:border-box;font-family:var(--goa-font-family-sans)}@media(max-width: 480px){:host{width:100%}button{width:100%}}button{display:inline-flex;box-sizing:border-box;border-radius:0.25rem;border:2px solid var(--goa-color-interactive-default);box-sizing:border-box;cursor:pointer;font-family:var(--goa-font-family-sans);font-size:var(--goa-font-size-5);font-weight:400;height:var(--button-height);letter-spacing:var(--goa-letter-spacing-button);line-height:100%;padding:0 0.75rem;gap:0.5rem;align-items:center;justify-content:center;transition:transform 0.1s ease-in-out, background-color 0.2s ease-in-out,
|
|
2406
|
-
border-color 0.2s ease-in-out}.text{padding-bottom:var(--font-valign-fix, 0)}button:disabled{pointer-events:none;opacity:0.5}button.compact{height:var(--button-height-compact);font-size:var(--goa-font-size-4)}button.start{height:var(--button-height-tall);font-weight:var(--goa-font-weight-bold)}button.start,button.submit,button.primary{border:2px solid var(--goa-color-interactive-default);background-color:var(--goa-color-interactive-default);color:var(--goa-color-text-light)}button.start:hover,button.submit:hover,button.primary:hover{border-color:var(--goa-color-interactive-hover);background-color:var(--goa-color-interactive-hover)}button.start:focus,button.start:active,button.submit:focus,button.submit:active,button.primary:focus,button.primary:active{box-shadow:0 0 0 3px var(--goa-color-interactive-focus);border-color:var(--goa-color-interactive-hover);background-color:var(--goa-color-interactive-hover);outline:none}button.secondary{border:2px solid var(--goa-color-interactive-default);background-color:var(--goa-color-greyscale-white);color:var(--goa-color-interactive-default)}button.secondary:hover{border-color:var(--goa-color-interactive-hover);color:var(--goa-color-interactive-hover);background-color:var(--goa-color-greyscale-100)}button.secondary:focus,button.secondary:active{border-color:var(--goa-color-interactive-hover);box-shadow:0 0 0 3px var(--goa-color-interactive-focus);background-color:var(--goa-color-greyscale-100);outline:none}button.tertiary{border:1px solid transparent;background-color:transparent;color:var(--goa-color-interactive-default);text-decoration:underline}button.tertiary:hover{border-color:var(--goa-color-greyscale-100);color:var(--goa-color-interactive-hover);background-color:var(--goa-color-greyscale-100)}button.tertiary:focus,button.tertiary:active{border-color:var(--goa-color-greyscale-100);background-color:var(--goa-color-greyscale-100);color:var(--goa-color-interactive-hover);box-shadow:0 0 0 3px var(--goa-color-interactive-focus);outline:none}.submit.destructive,.primary.destructive{color:var(--goa-color-greyscale-white);background-color:var(--goa-color-emergency-default);border-color:var(--goa-color-emergency-default)}.submit.destructive:hover,.primary.destructive:hover{background-color:var(--goa-color-emergency-dark);border-color:var(--goa-color-emergency-dark)}.submit.destructive:focus,.primary.destructive:focus,.primary.destructive:active{background-color:var(--goa-color-emergency-dark);border-color:var(--goa-color-emergency-dark)}.secondary.destructive{color:var(--goa-color-emergency-default);border-color:var(--goa-color-emergency-default);background-color:var(--goa-color-greyscale-white)}.secondary.destructive:hover{border-color:var(--goa-color-emergency-dark);color:var(--goa-color-emergency-dark);background-color:var(--goa-color-greyscale-white)}.secondary.destructive:focus,.secondary.destructive:active{color:var(--goa-color-emergency-dark);border-color:var(--goa-color-emergency-dark);background-color:var(--goa-color-greyscale-white)}.tertiary.destructive{color:var(--goa-color-emergency-default);border-color:transparent}.tertiary.destructive:hover{color:var(--goa-color-emergency-dark)}.tertiary.destructive:focus,.tertiary.destructive:active{color:var(--goa-color-emergency-dark)}</style>`;
|
|
2406
|
+
border-color 0.2s ease-in-out}.text{padding-bottom:var(--font-valign-fix, 0)}button:disabled{pointer-events:none;opacity:0.5}button.compact{height:var(--button-height-compact);font-size:var(--goa-font-size-4);padding-left:var(--goa-space-xs);padding-right:var(--goa-space-xs)}button.start{height:var(--button-height-tall);font-weight:var(--goa-font-weight-bold)}button.start,button.submit,button.primary{border:2px solid var(--goa-color-interactive-default);background-color:var(--goa-color-interactive-default);color:var(--goa-color-text-light)}button.start:hover,button.submit:hover,button.primary:hover{border-color:var(--goa-color-interactive-hover);background-color:var(--goa-color-interactive-hover)}button.start:focus,button.start:active,button.submit:focus,button.submit:active,button.primary:focus,button.primary:active{box-shadow:0 0 0 3px var(--goa-color-interactive-focus);border-color:var(--goa-color-interactive-hover);background-color:var(--goa-color-interactive-hover);outline:none}button.secondary{border:2px solid var(--goa-color-interactive-default);background-color:var(--goa-color-greyscale-white);color:var(--goa-color-interactive-default)}button.secondary:hover{border-color:var(--goa-color-interactive-hover);color:var(--goa-color-interactive-hover);background-color:var(--goa-color-greyscale-100)}button.secondary:focus,button.secondary:active{border-color:var(--goa-color-interactive-hover);box-shadow:0 0 0 3px var(--goa-color-interactive-focus);background-color:var(--goa-color-greyscale-100);outline:none}button.tertiary{border:1px solid transparent;background-color:transparent;color:var(--goa-color-interactive-default);text-decoration:underline}button.tertiary:hover{border-color:var(--goa-color-greyscale-100);color:var(--goa-color-interactive-hover);background-color:var(--goa-color-greyscale-100)}button.tertiary:focus,button.tertiary:active{border-color:var(--goa-color-greyscale-100);background-color:var(--goa-color-greyscale-100);color:var(--goa-color-interactive-hover);box-shadow:0 0 0 3px var(--goa-color-interactive-focus);outline:none}.submit.destructive,.primary.destructive{color:var(--goa-color-greyscale-white);background-color:var(--goa-color-emergency-default);border-color:var(--goa-color-emergency-default)}.submit.destructive:hover,.primary.destructive:hover{background-color:var(--goa-color-emergency-dark);border-color:var(--goa-color-emergency-dark)}.submit.destructive:focus,.primary.destructive:focus,.primary.destructive:active{background-color:var(--goa-color-emergency-dark);border-color:var(--goa-color-emergency-dark)}.secondary.destructive{color:var(--goa-color-emergency-default);border-color:var(--goa-color-emergency-default);background-color:var(--goa-color-greyscale-white)}.secondary.destructive:hover{border-color:var(--goa-color-emergency-dark);color:var(--goa-color-emergency-dark);background-color:var(--goa-color-greyscale-white)}.secondary.destructive:focus,.secondary.destructive:active{color:var(--goa-color-emergency-dark);border-color:var(--goa-color-emergency-dark);background-color:var(--goa-color-greyscale-white)}.tertiary.destructive{color:var(--goa-color-emergency-default);border-color:transparent}.tertiary.destructive:hover{color:var(--goa-color-emergency-dark)}.tertiary.destructive:focus,.tertiary.destructive:active{color:var(--goa-color-emergency-dark)}</style>`;
|
|
2407
2407
|
|
|
2408
2408
|
init(
|
|
2409
2409
|
this,
|
|
@@ -2412,8 +2412,8 @@ class Button extends SvelteElement {
|
|
|
2412
2412
|
props: attribute_to_object(this.attributes),
|
|
2413
2413
|
customElement: true
|
|
2414
2414
|
},
|
|
2415
|
-
instance$
|
|
2416
|
-
create_fragment$
|
|
2415
|
+
instance$G,
|
|
2416
|
+
create_fragment$M,
|
|
2417
2417
|
safe_not_equal,
|
|
2418
2418
|
{
|
|
2419
2419
|
type: 0,
|
|
@@ -2563,7 +2563,7 @@ customElements.define("goa-button", Button);
|
|
|
2563
2563
|
|
|
2564
2564
|
/* libs/web-components/src/components/button-group/ButtonGroup.svelte generated by Svelte v3.51.0 */
|
|
2565
2565
|
|
|
2566
|
-
function create_fragment$
|
|
2566
|
+
function create_fragment$L(ctx) {
|
|
2567
2567
|
let div;
|
|
2568
2568
|
let slot;
|
|
2569
2569
|
let div_style_value;
|
|
@@ -2597,7 +2597,7 @@ function create_fragment$K(ctx) {
|
|
|
2597
2597
|
};
|
|
2598
2598
|
}
|
|
2599
2599
|
|
|
2600
|
-
function instance$
|
|
2600
|
+
function instance$F($$self, $$props, $$invalidate) {
|
|
2601
2601
|
let _alignment;
|
|
2602
2602
|
let { alignment = "start" } = $$props;
|
|
2603
2603
|
let { gap = "relaxed" } = $$props;
|
|
@@ -2649,8 +2649,8 @@ class ButtonGroup extends SvelteElement {
|
|
|
2649
2649
|
props: attribute_to_object(this.attributes),
|
|
2650
2650
|
customElement: true
|
|
2651
2651
|
},
|
|
2652
|
-
instance$
|
|
2653
|
-
create_fragment$
|
|
2652
|
+
instance$F,
|
|
2653
|
+
create_fragment$L,
|
|
2654
2654
|
safe_not_equal,
|
|
2655
2655
|
{
|
|
2656
2656
|
alignment: 7,
|
|
@@ -2756,6 +2756,7 @@ function create_if_block$l(ctx) {
|
|
|
2756
2756
|
c() {
|
|
2757
2757
|
h3 = element("h3");
|
|
2758
2758
|
t = text(/*heading*/ ctx[5]);
|
|
2759
|
+
toggle_class(h3, "medium", /*isMediumCallout*/ ctx[9]);
|
|
2759
2760
|
},
|
|
2760
2761
|
m(target, anchor) {
|
|
2761
2762
|
insert(target, h3, anchor);
|
|
@@ -2763,6 +2764,10 @@ function create_if_block$l(ctx) {
|
|
|
2763
2764
|
},
|
|
2764
2765
|
p(ctx, dirty) {
|
|
2765
2766
|
if (dirty & /*heading*/ 32) set_data(t, /*heading*/ ctx[5]);
|
|
2767
|
+
|
|
2768
|
+
if (dirty & /*isMediumCallout*/ 512) {
|
|
2769
|
+
toggle_class(h3, "medium", /*isMediumCallout*/ ctx[9]);
|
|
2770
|
+
}
|
|
2766
2771
|
},
|
|
2767
2772
|
d(detaching) {
|
|
2768
2773
|
if (detaching) detach(h3);
|
|
@@ -2770,7 +2775,7 @@ function create_if_block$l(ctx) {
|
|
|
2770
2775
|
};
|
|
2771
2776
|
}
|
|
2772
2777
|
|
|
2773
|
-
function create_fragment$
|
|
2778
|
+
function create_fragment$K(ctx) {
|
|
2774
2779
|
let div;
|
|
2775
2780
|
let span0;
|
|
2776
2781
|
let goa_icon;
|
|
@@ -2781,6 +2786,9 @@ function create_fragment$J(ctx) {
|
|
|
2781
2786
|
let t1;
|
|
2782
2787
|
let slot;
|
|
2783
2788
|
let div_style_value;
|
|
2789
|
+
let mounted;
|
|
2790
|
+
let dispose;
|
|
2791
|
+
add_render_callback(/*onwindowresize*/ ctx[12]);
|
|
2784
2792
|
let if_block = /*heading*/ ctx[5] && create_if_block$l(ctx);
|
|
2785
2793
|
|
|
2786
2794
|
return {
|
|
@@ -2794,13 +2802,15 @@ function create_fragment$J(ctx) {
|
|
|
2794
2802
|
t1 = space();
|
|
2795
2803
|
slot = element("slot");
|
|
2796
2804
|
this.c = noop;
|
|
2797
|
-
set_custom_element_data(goa_icon, "type", /*iconType*/ ctx[
|
|
2805
|
+
set_custom_element_data(goa_icon, "type", /*iconType*/ ctx[10]);
|
|
2806
|
+
set_custom_element_data(goa_icon, "size", /*iconSize*/ ctx[8]);
|
|
2798
2807
|
set_custom_element_data(goa_icon, "inverted", goa_icon_inverted_value = /*type*/ ctx[4] === "important" ? "false" : "true");
|
|
2799
2808
|
attr(span0, "class", span0_class_value = "icon " + /*type*/ ctx[4]);
|
|
2800
2809
|
attr(span1, "class", "content");
|
|
2801
2810
|
attr(div, "style", div_style_value = calculateMargin(/*mt*/ ctx[0], /*mr*/ ctx[1], /*mb*/ ctx[2], /*ml*/ ctx[3]));
|
|
2802
2811
|
attr(div, "class", "notification");
|
|
2803
2812
|
attr(div, "data-testid", /*testid*/ ctx[6]);
|
|
2813
|
+
toggle_class(div, "medium", /*isMediumCallout*/ ctx[9]);
|
|
2804
2814
|
},
|
|
2805
2815
|
m(target, anchor) {
|
|
2806
2816
|
insert(target, div, anchor);
|
|
@@ -2811,10 +2821,19 @@ function create_fragment$J(ctx) {
|
|
|
2811
2821
|
if (if_block) if_block.m(span1, null);
|
|
2812
2822
|
append(span1, t1);
|
|
2813
2823
|
append(span1, slot);
|
|
2824
|
+
|
|
2825
|
+
if (!mounted) {
|
|
2826
|
+
dispose = listen(window, "resize", /*onwindowresize*/ ctx[12]);
|
|
2827
|
+
mounted = true;
|
|
2828
|
+
}
|
|
2814
2829
|
},
|
|
2815
2830
|
p(ctx, [dirty]) {
|
|
2816
|
-
if (dirty & /*iconType*/
|
|
2817
|
-
set_custom_element_data(goa_icon, "type", /*iconType*/ ctx[
|
|
2831
|
+
if (dirty & /*iconType*/ 1024) {
|
|
2832
|
+
set_custom_element_data(goa_icon, "type", /*iconType*/ ctx[10]);
|
|
2833
|
+
}
|
|
2834
|
+
|
|
2835
|
+
if (dirty & /*iconSize*/ 256) {
|
|
2836
|
+
set_custom_element_data(goa_icon, "size", /*iconSize*/ ctx[8]);
|
|
2818
2837
|
}
|
|
2819
2838
|
|
|
2820
2839
|
if (dirty & /*type*/ 16 && goa_icon_inverted_value !== (goa_icon_inverted_value = /*type*/ ctx[4] === "important" ? "false" : "true")) {
|
|
@@ -2845,44 +2864,69 @@ function create_fragment$J(ctx) {
|
|
|
2845
2864
|
if (dirty & /*testid*/ 64) {
|
|
2846
2865
|
attr(div, "data-testid", /*testid*/ ctx[6]);
|
|
2847
2866
|
}
|
|
2867
|
+
|
|
2868
|
+
if (dirty & /*isMediumCallout*/ 512) {
|
|
2869
|
+
toggle_class(div, "medium", /*isMediumCallout*/ ctx[9]);
|
|
2870
|
+
}
|
|
2848
2871
|
},
|
|
2849
2872
|
i: noop,
|
|
2850
2873
|
o: noop,
|
|
2851
2874
|
d(detaching) {
|
|
2852
2875
|
if (detaching) detach(div);
|
|
2853
2876
|
if (if_block) if_block.d();
|
|
2877
|
+
mounted = false;
|
|
2878
|
+
dispose();
|
|
2854
2879
|
}
|
|
2855
2880
|
};
|
|
2856
2881
|
}
|
|
2857
2882
|
|
|
2858
|
-
function instance$
|
|
2883
|
+
function instance$E($$self, $$props, $$invalidate) {
|
|
2884
|
+
let isMediumCallout;
|
|
2859
2885
|
let iconType;
|
|
2860
2886
|
const [Types, validateType] = typeValidator("Callout type", ["emergency", "important", "information", "event", "success"], true);
|
|
2887
|
+
const [CalloutSizes, validateCalloutSize] = typeValidator("Callout size", ["medium", "large"]);
|
|
2861
2888
|
let { mt = null } = $$props;
|
|
2862
2889
|
let { mr = null } = $$props;
|
|
2863
2890
|
let { mb = "l" } = $$props;
|
|
2864
2891
|
let { ml = null } = $$props;
|
|
2892
|
+
let { size = "large" } = $$props;
|
|
2865
2893
|
let { type } = $$props;
|
|
2866
2894
|
let { heading = "" } = $$props;
|
|
2867
2895
|
let { testid = "" } = $$props;
|
|
2896
|
+
let screenSize = 0;
|
|
2897
|
+
let iconSize = "medium";
|
|
2868
2898
|
|
|
2869
2899
|
onMount(() => {
|
|
2870
|
-
|
|
2900
|
+
validateCalloutSize(size);
|
|
2901
|
+
|
|
2902
|
+
setTimeout(() => {
|
|
2903
|
+
validateType(type);
|
|
2904
|
+
$$invalidate(8, iconSize = isMediumCallout ? "small" : "medium");
|
|
2905
|
+
});
|
|
2871
2906
|
});
|
|
2872
2907
|
|
|
2908
|
+
function onwindowresize() {
|
|
2909
|
+
$$invalidate(7, screenSize = window.innerWidth);
|
|
2910
|
+
}
|
|
2911
|
+
|
|
2873
2912
|
$$self.$$set = $$props => {
|
|
2874
2913
|
if ('mt' in $$props) $$invalidate(0, mt = $$props.mt);
|
|
2875
2914
|
if ('mr' in $$props) $$invalidate(1, mr = $$props.mr);
|
|
2876
2915
|
if ('mb' in $$props) $$invalidate(2, mb = $$props.mb);
|
|
2877
2916
|
if ('ml' in $$props) $$invalidate(3, ml = $$props.ml);
|
|
2917
|
+
if ('size' in $$props) $$invalidate(11, size = $$props.size);
|
|
2878
2918
|
if ('type' in $$props) $$invalidate(4, type = $$props.type);
|
|
2879
2919
|
if ('heading' in $$props) $$invalidate(5, heading = $$props.heading);
|
|
2880
2920
|
if ('testid' in $$props) $$invalidate(6, testid = $$props.testid);
|
|
2881
2921
|
};
|
|
2882
2922
|
|
|
2883
2923
|
$$self.$$.update = () => {
|
|
2924
|
+
if ($$self.$$.dirty & /*screenSize, size*/ 2176) {
|
|
2925
|
+
$$invalidate(9, isMediumCallout = screenSize < 640 || size === "medium");
|
|
2926
|
+
}
|
|
2927
|
+
|
|
2884
2928
|
if ($$self.$$.dirty & /*type*/ 16) {
|
|
2885
|
-
$$invalidate(
|
|
2929
|
+
$$invalidate(10, iconType = type === "emergency"
|
|
2886
2930
|
? "warning"
|
|
2887
2931
|
: type === "important"
|
|
2888
2932
|
? "alert-circle"
|
|
@@ -2894,13 +2938,27 @@ function instance$D($$self, $$props, $$invalidate) {
|
|
|
2894
2938
|
}
|
|
2895
2939
|
};
|
|
2896
2940
|
|
|
2897
|
-
return [
|
|
2941
|
+
return [
|
|
2942
|
+
mt,
|
|
2943
|
+
mr,
|
|
2944
|
+
mb,
|
|
2945
|
+
ml,
|
|
2946
|
+
type,
|
|
2947
|
+
heading,
|
|
2948
|
+
testid,
|
|
2949
|
+
screenSize,
|
|
2950
|
+
iconSize,
|
|
2951
|
+
isMediumCallout,
|
|
2952
|
+
iconType,
|
|
2953
|
+
size,
|
|
2954
|
+
onwindowresize
|
|
2955
|
+
];
|
|
2898
2956
|
}
|
|
2899
2957
|
|
|
2900
2958
|
class Callout extends SvelteElement {
|
|
2901
2959
|
constructor(options) {
|
|
2902
2960
|
super();
|
|
2903
|
-
this.shadowRoot.innerHTML = `<style>:host{box-sizing:border-box;font-family:var(--goa-font-family-sans)}.notification{display:flex;align-items:stretch;
|
|
2961
|
+
this.shadowRoot.innerHTML = `<style>:host{box-sizing:border-box;font-family:var(--goa-font-family-sans)}.notification{display:flex;align-items:stretch;overflow:hidden;font:var(--goa-typography-body-m)}h3{font-size:var(--goa-font-size-7);line-height:var(--goa-line-height-2);font-weight:var(--goa-font-weight-regular);margin-top:var(--goa-space-none);margin-bottom:var(--goa-space-m)}.emergency{background-color:var(--goa-color-emergency-default)}.important{background-color:var(--goa-color-warning-default)}.information{background-color:var(--goa-color-info-default)}.event{background-color:var(--goa-color-info-default)}.success{background-color:var(--goa-color-success-default)}.icon{text-align:center;padding-top:var(--goa-space-l);padding-left:var(--goa-space-s);padding-right:var(--goa-space-s)}.content{flex:1 1 auto;background-color:var(--goa-color-greyscale-100);padding:var(--goa-space-l)}.notification.medium{font:var(--goa-typography-body-s);max-width:22rem}h3.medium{font:var(--goa-typography-heading-xs);margin-bottom:var(--goa-space-2xs)}.notification.medium .content{padding:var(--goa-space-s);margin-top:calc(-1 * var(--goa-space-3xs))}.notification.medium .icon{padding-top:var(--goa-space-s);padding-left:var(--goa-space-2xs);padding-right:var(--goa-space-2xs)}</style>`;
|
|
2904
2962
|
|
|
2905
2963
|
init(
|
|
2906
2964
|
this,
|
|
@@ -2909,14 +2967,15 @@ class Callout extends SvelteElement {
|
|
|
2909
2967
|
props: attribute_to_object(this.attributes),
|
|
2910
2968
|
customElement: true
|
|
2911
2969
|
},
|
|
2912
|
-
instance$
|
|
2913
|
-
create_fragment$
|
|
2970
|
+
instance$E,
|
|
2971
|
+
create_fragment$K,
|
|
2914
2972
|
safe_not_equal,
|
|
2915
2973
|
{
|
|
2916
2974
|
mt: 0,
|
|
2917
2975
|
mr: 1,
|
|
2918
2976
|
mb: 2,
|
|
2919
2977
|
ml: 3,
|
|
2978
|
+
size: 11,
|
|
2920
2979
|
type: 4,
|
|
2921
2980
|
heading: 5,
|
|
2922
2981
|
testid: 6
|
|
@@ -2937,7 +2996,7 @@ class Callout extends SvelteElement {
|
|
|
2937
2996
|
}
|
|
2938
2997
|
|
|
2939
2998
|
static get observedAttributes() {
|
|
2940
|
-
return ["mt", "mr", "mb", "ml", "type", "heading", "testid"];
|
|
2999
|
+
return ["mt", "mr", "mb", "ml", "size", "type", "heading", "testid"];
|
|
2941
3000
|
}
|
|
2942
3001
|
|
|
2943
3002
|
get mt() {
|
|
@@ -2976,6 +3035,15 @@ class Callout extends SvelteElement {
|
|
|
2976
3035
|
flush();
|
|
2977
3036
|
}
|
|
2978
3037
|
|
|
3038
|
+
get size() {
|
|
3039
|
+
return this.$$.ctx[11];
|
|
3040
|
+
}
|
|
3041
|
+
|
|
3042
|
+
set size(size) {
|
|
3043
|
+
this.$$set({ size });
|
|
3044
|
+
flush();
|
|
3045
|
+
}
|
|
3046
|
+
|
|
2979
3047
|
get type() {
|
|
2980
3048
|
return this.$$.ctx[4];
|
|
2981
3049
|
}
|
|
@@ -3008,7 +3076,7 @@ customElements.define("goa-callout", Callout);
|
|
|
3008
3076
|
|
|
3009
3077
|
/* libs/web-components/src/components/card-actions/CardActions.svelte generated by Svelte v3.51.0 */
|
|
3010
3078
|
|
|
3011
|
-
function create_fragment$
|
|
3079
|
+
function create_fragment$J(ctx) {
|
|
3012
3080
|
let goa_card_content;
|
|
3013
3081
|
|
|
3014
3082
|
return {
|
|
@@ -3041,7 +3109,7 @@ class CardActions extends SvelteElement {
|
|
|
3041
3109
|
customElement: true
|
|
3042
3110
|
},
|
|
3043
3111
|
null,
|
|
3044
|
-
create_fragment$
|
|
3112
|
+
create_fragment$J,
|
|
3045
3113
|
safe_not_equal,
|
|
3046
3114
|
{},
|
|
3047
3115
|
null
|
|
@@ -3059,7 +3127,7 @@ customElements.define("goa-card-actions", CardActions);
|
|
|
3059
3127
|
|
|
3060
3128
|
/* libs/web-components/src/components/card/Card.svelte generated by Svelte v3.51.0 */
|
|
3061
3129
|
|
|
3062
|
-
function create_fragment$
|
|
3130
|
+
function create_fragment$I(ctx) {
|
|
3063
3131
|
let div;
|
|
3064
3132
|
let slot;
|
|
3065
3133
|
let div_style_value;
|
|
@@ -3099,7 +3167,7 @@ function create_fragment$H(ctx) {
|
|
|
3099
3167
|
};
|
|
3100
3168
|
}
|
|
3101
3169
|
|
|
3102
|
-
function instance$
|
|
3170
|
+
function instance$D($$self, $$props, $$invalidate) {
|
|
3103
3171
|
let { elevation = 0 } = $$props;
|
|
3104
3172
|
let { width = "100%" } = $$props;
|
|
3105
3173
|
let { height = "auto" } = $$props;
|
|
@@ -3135,8 +3203,8 @@ class Card extends SvelteElement {
|
|
|
3135
3203
|
props: attribute_to_object(this.attributes),
|
|
3136
3204
|
customElement: true
|
|
3137
3205
|
},
|
|
3138
|
-
instance$
|
|
3139
|
-
create_fragment$
|
|
3206
|
+
instance$D,
|
|
3207
|
+
create_fragment$I,
|
|
3140
3208
|
safe_not_equal,
|
|
3141
3209
|
{
|
|
3142
3210
|
elevation: 0,
|
|
@@ -3244,7 +3312,7 @@ customElements.define("goa-card", Card);
|
|
|
3244
3312
|
|
|
3245
3313
|
/* libs/web-components/src/components/card-content/CardContent.svelte generated by Svelte v3.51.0 */
|
|
3246
3314
|
|
|
3247
|
-
function create_fragment$
|
|
3315
|
+
function create_fragment$H(ctx) {
|
|
3248
3316
|
let div;
|
|
3249
3317
|
|
|
3250
3318
|
return {
|
|
@@ -3279,7 +3347,7 @@ class CardContent extends SvelteElement {
|
|
|
3279
3347
|
customElement: true
|
|
3280
3348
|
},
|
|
3281
3349
|
null,
|
|
3282
|
-
create_fragment$
|
|
3350
|
+
create_fragment$H,
|
|
3283
3351
|
safe_not_equal,
|
|
3284
3352
|
{},
|
|
3285
3353
|
null
|
|
@@ -3297,7 +3365,7 @@ customElements.define("goa-card-content", CardContent);
|
|
|
3297
3365
|
|
|
3298
3366
|
/* libs/web-components/src/components/card-group/CardGroup.svelte generated by Svelte v3.51.0 */
|
|
3299
3367
|
|
|
3300
|
-
function create_fragment$
|
|
3368
|
+
function create_fragment$G(ctx) {
|
|
3301
3369
|
let div;
|
|
3302
3370
|
|
|
3303
3371
|
return {
|
|
@@ -3332,7 +3400,7 @@ class CardGroup extends SvelteElement {
|
|
|
3332
3400
|
customElement: true
|
|
3333
3401
|
},
|
|
3334
3402
|
null,
|
|
3335
|
-
create_fragment$
|
|
3403
|
+
create_fragment$G,
|
|
3336
3404
|
safe_not_equal,
|
|
3337
3405
|
{},
|
|
3338
3406
|
null
|
|
@@ -3350,7 +3418,7 @@ customElements.define("goa-card-group", CardGroup);
|
|
|
3350
3418
|
|
|
3351
3419
|
/* libs/web-components/src/components/card-image/CardImage.svelte generated by Svelte v3.51.0 */
|
|
3352
3420
|
|
|
3353
|
-
function create_fragment$
|
|
3421
|
+
function create_fragment$F(ctx) {
|
|
3354
3422
|
let div;
|
|
3355
3423
|
|
|
3356
3424
|
return {
|
|
@@ -3382,7 +3450,7 @@ function create_fragment$E(ctx) {
|
|
|
3382
3450
|
};
|
|
3383
3451
|
}
|
|
3384
3452
|
|
|
3385
|
-
function instance$
|
|
3453
|
+
function instance$C($$self, $$props, $$invalidate) {
|
|
3386
3454
|
let { src } = $$props;
|
|
3387
3455
|
let { height = "100%" } = $$props;
|
|
3388
3456
|
|
|
@@ -3406,8 +3474,8 @@ class CardImage extends SvelteElement {
|
|
|
3406
3474
|
props: attribute_to_object(this.attributes),
|
|
3407
3475
|
customElement: true
|
|
3408
3476
|
},
|
|
3409
|
-
instance$
|
|
3410
|
-
create_fragment$
|
|
3477
|
+
instance$C,
|
|
3478
|
+
create_fragment$F,
|
|
3411
3479
|
safe_not_equal,
|
|
3412
3480
|
{ src: 0, height: 1 },
|
|
3413
3481
|
null
|
|
@@ -3502,7 +3570,7 @@ function create_if_block$k(ctx) {
|
|
|
3502
3570
|
};
|
|
3503
3571
|
}
|
|
3504
3572
|
|
|
3505
|
-
function create_fragment$
|
|
3573
|
+
function create_fragment$E(ctx) {
|
|
3506
3574
|
let label;
|
|
3507
3575
|
let div0;
|
|
3508
3576
|
let input;
|
|
@@ -3647,7 +3715,7 @@ function create_fragment$D(ctx) {
|
|
|
3647
3715
|
};
|
|
3648
3716
|
}
|
|
3649
3717
|
|
|
3650
|
-
function instance$
|
|
3718
|
+
function instance$B($$self, $$props, $$invalidate) {
|
|
3651
3719
|
let isDisabled;
|
|
3652
3720
|
let isError;
|
|
3653
3721
|
let isChecked;
|
|
@@ -3759,8 +3827,8 @@ class Checkbox extends SvelteElement {
|
|
|
3759
3827
|
props: attribute_to_object(this.attributes),
|
|
3760
3828
|
customElement: true
|
|
3761
3829
|
},
|
|
3762
|
-
instance$
|
|
3763
|
-
create_fragment$
|
|
3830
|
+
instance$B,
|
|
3831
|
+
create_fragment$E,
|
|
3764
3832
|
safe_not_equal,
|
|
3765
3833
|
{
|
|
3766
3834
|
name: 0,
|
|
@@ -3989,7 +4057,7 @@ function create_if_block$j(ctx) {
|
|
|
3989
4057
|
};
|
|
3990
4058
|
}
|
|
3991
4059
|
|
|
3992
|
-
function create_fragment$
|
|
4060
|
+
function create_fragment$D(ctx) {
|
|
3993
4061
|
let div1;
|
|
3994
4062
|
let t0;
|
|
3995
4063
|
let div0;
|
|
@@ -4104,7 +4172,7 @@ function create_fragment$C(ctx) {
|
|
|
4104
4172
|
};
|
|
4105
4173
|
}
|
|
4106
4174
|
|
|
4107
|
-
function instance$
|
|
4175
|
+
function instance$A($$self, $$props, $$invalidate) {
|
|
4108
4176
|
let { mt = null } = $$props;
|
|
4109
4177
|
let { mr = null } = $$props;
|
|
4110
4178
|
let { mb = null } = $$props;
|
|
@@ -4201,8 +4269,8 @@ class Chip extends SvelteElement {
|
|
|
4201
4269
|
props: attribute_to_object(this.attributes),
|
|
4202
4270
|
customElement: true
|
|
4203
4271
|
},
|
|
4204
|
-
instance$
|
|
4205
|
-
create_fragment$
|
|
4272
|
+
instance$A,
|
|
4273
|
+
create_fragment$D,
|
|
4206
4274
|
safe_not_equal,
|
|
4207
4275
|
{
|
|
4208
4276
|
mt: 0,
|
|
@@ -4708,7 +4776,7 @@ function create_if_block_2$8(ctx) {
|
|
|
4708
4776
|
};
|
|
4709
4777
|
}
|
|
4710
4778
|
|
|
4711
|
-
function create_fragment$
|
|
4779
|
+
function create_fragment$C(ctx) {
|
|
4712
4780
|
let if_block_anchor;
|
|
4713
4781
|
let current;
|
|
4714
4782
|
let if_block = /*isVisible*/ ctx[5] && create_if_block$i(ctx);
|
|
@@ -4764,7 +4832,7 @@ function create_fragment$B(ctx) {
|
|
|
4764
4832
|
};
|
|
4765
4833
|
}
|
|
4766
4834
|
|
|
4767
|
-
function instance$
|
|
4835
|
+
function instance$z($$self, $$props, $$invalidate) {
|
|
4768
4836
|
let isVisible;
|
|
4769
4837
|
const [Variants, validateVariant] = typeValidator("Circular progress variant", ["fullscreen", "inline"]);
|
|
4770
4838
|
const [Sizes, validateSize] = typeValidator("Button size", ["small", "large"]);
|
|
@@ -4824,8 +4892,8 @@ class CircularProgress extends SvelteElement {
|
|
|
4824
4892
|
props: attribute_to_object(this.attributes),
|
|
4825
4893
|
customElement: true
|
|
4826
4894
|
},
|
|
4827
|
-
instance$
|
|
4828
|
-
create_fragment$
|
|
4895
|
+
instance$z,
|
|
4896
|
+
create_fragment$C,
|
|
4829
4897
|
safe_not_equal,
|
|
4830
4898
|
{
|
|
4831
4899
|
variant: 6,
|
|
@@ -4903,7 +4971,7 @@ customElements.define("goa-circular-progress", CircularProgress);
|
|
|
4903
4971
|
|
|
4904
4972
|
/* libs/web-components/src/components/container/Container.svelte generated by Svelte v3.51.0 */
|
|
4905
4973
|
|
|
4906
|
-
function create_fragment$
|
|
4974
|
+
function create_fragment$B(ctx) {
|
|
4907
4975
|
let div3;
|
|
4908
4976
|
let header;
|
|
4909
4977
|
let div0;
|
|
@@ -4981,7 +5049,7 @@ function create_fragment$A(ctx) {
|
|
|
4981
5049
|
};
|
|
4982
5050
|
}
|
|
4983
5051
|
|
|
4984
|
-
function instance$
|
|
5052
|
+
function instance$y($$self, $$props, $$invalidate) {
|
|
4985
5053
|
const [Types, validateType] = typeValidator("Container type", ["interactive", "info", "error", "success", "important", "non-interactive"]);
|
|
4986
5054
|
const [Accents, validateAccent] = typeValidator("Container accent", ["thick", "thin", "filled"]);
|
|
4987
5055
|
const [Paddings, validatePadding] = typeValidator("Container padding", ["relaxed", "compact"]);
|
|
@@ -5026,8 +5094,8 @@ class Container extends SvelteElement {
|
|
|
5026
5094
|
props: attribute_to_object(this.attributes),
|
|
5027
5095
|
customElement: true
|
|
5028
5096
|
},
|
|
5029
|
-
instance$
|
|
5030
|
-
create_fragment$
|
|
5097
|
+
instance$y,
|
|
5098
|
+
create_fragment$B,
|
|
5031
5099
|
safe_not_equal,
|
|
5032
5100
|
{
|
|
5033
5101
|
type: 0,
|
|
@@ -5135,7 +5203,7 @@ customElements.define("goa-container", Container);
|
|
|
5135
5203
|
|
|
5136
5204
|
/* libs/web-components/src/components/details/Details.svelte generated by Svelte v3.51.0 */
|
|
5137
5205
|
|
|
5138
|
-
function create_fragment$
|
|
5206
|
+
function create_fragment$A(ctx) {
|
|
5139
5207
|
let details;
|
|
5140
5208
|
let summary;
|
|
5141
5209
|
let goa_icon;
|
|
@@ -5203,7 +5271,7 @@ function create_fragment$z(ctx) {
|
|
|
5203
5271
|
};
|
|
5204
5272
|
}
|
|
5205
5273
|
|
|
5206
|
-
function instance$
|
|
5274
|
+
function instance$x($$self, $$props, $$invalidate) {
|
|
5207
5275
|
let { heading } = $$props;
|
|
5208
5276
|
let { mt = null } = $$props;
|
|
5209
5277
|
let { mr = null } = $$props;
|
|
@@ -5254,8 +5322,8 @@ class Details extends SvelteElement {
|
|
|
5254
5322
|
props: attribute_to_object(this.attributes),
|
|
5255
5323
|
customElement: true
|
|
5256
5324
|
},
|
|
5257
|
-
instance$
|
|
5258
|
-
create_fragment$
|
|
5325
|
+
instance$x,
|
|
5326
|
+
create_fragment$A,
|
|
5259
5327
|
safe_not_equal,
|
|
5260
5328
|
{ heading: 0, mt: 1, mr: 2, mb: 3, ml: 4 },
|
|
5261
5329
|
null
|
|
@@ -5327,7 +5395,7 @@ customElements.define("goa-details", Details);
|
|
|
5327
5395
|
|
|
5328
5396
|
/* libs/web-components/src/components/divider/Divider.svelte generated by Svelte v3.51.0 */
|
|
5329
5397
|
|
|
5330
|
-
function create_fragment$
|
|
5398
|
+
function create_fragment$z(ctx) {
|
|
5331
5399
|
let hr;
|
|
5332
5400
|
let hr_style_value;
|
|
5333
5401
|
|
|
@@ -5358,7 +5426,7 @@ function create_fragment$y(ctx) {
|
|
|
5358
5426
|
};
|
|
5359
5427
|
}
|
|
5360
5428
|
|
|
5361
|
-
function instance$
|
|
5429
|
+
function instance$w($$self, $$props, $$invalidate) {
|
|
5362
5430
|
let { testid = "" } = $$props;
|
|
5363
5431
|
let { mt = null } = $$props;
|
|
5364
5432
|
let { mr = null } = $$props;
|
|
@@ -5388,8 +5456,8 @@ class Divider extends SvelteElement {
|
|
|
5388
5456
|
props: attribute_to_object(this.attributes),
|
|
5389
5457
|
customElement: true
|
|
5390
5458
|
},
|
|
5391
|
-
instance$
|
|
5392
|
-
create_fragment$
|
|
5459
|
+
instance$w,
|
|
5460
|
+
create_fragment$z,
|
|
5393
5461
|
safe_not_equal,
|
|
5394
5462
|
{ testid: 0, mt: 1, mr: 2, mb: 3, ml: 4 },
|
|
5395
5463
|
null
|
|
@@ -5931,7 +5999,7 @@ function create_each_block$6(ctx) {
|
|
|
5931
5999
|
};
|
|
5932
6000
|
}
|
|
5933
6001
|
|
|
5934
|
-
function create_fragment$
|
|
6002
|
+
function create_fragment$y(ctx) {
|
|
5935
6003
|
let div;
|
|
5936
6004
|
let div_data_testid_value;
|
|
5937
6005
|
let div_style_value;
|
|
@@ -6017,7 +6085,7 @@ function parseValues(selectedValue) {
|
|
|
6017
6085
|
return rawValues.map(val => `${val}`);
|
|
6018
6086
|
}
|
|
6019
6087
|
|
|
6020
|
-
function instance$
|
|
6088
|
+
function instance$v($$self, $$props, $$invalidate) {
|
|
6021
6089
|
let _disabled;
|
|
6022
6090
|
let _error;
|
|
6023
6091
|
let _multiselect;
|
|
@@ -6388,8 +6456,8 @@ class Dropdown extends SvelteElement {
|
|
|
6388
6456
|
props: attribute_to_object(this.attributes),
|
|
6389
6457
|
customElement: true
|
|
6390
6458
|
},
|
|
6391
|
-
instance$
|
|
6392
|
-
create_fragment$
|
|
6459
|
+
instance$v,
|
|
6460
|
+
create_fragment$y,
|
|
6393
6461
|
safe_not_equal,
|
|
6394
6462
|
{
|
|
6395
6463
|
name: 0,
|
|
@@ -6584,7 +6652,7 @@ customElements.define("goa-dropdown", Dropdown);
|
|
|
6584
6652
|
|
|
6585
6653
|
/* libs/web-components/src/components/dropdown/DropdownItem.svelte generated by Svelte v3.51.0 */
|
|
6586
6654
|
|
|
6587
|
-
function create_fragment$
|
|
6655
|
+
function create_fragment$x(ctx) {
|
|
6588
6656
|
return {
|
|
6589
6657
|
c() {
|
|
6590
6658
|
this.c = noop;
|
|
@@ -6609,7 +6677,7 @@ class DropdownItem extends SvelteElement {
|
|
|
6609
6677
|
customElement: true
|
|
6610
6678
|
},
|
|
6611
6679
|
null,
|
|
6612
|
-
create_fragment$
|
|
6680
|
+
create_fragment$x,
|
|
6613
6681
|
safe_not_equal,
|
|
6614
6682
|
{},
|
|
6615
6683
|
null
|
|
@@ -6627,7 +6695,7 @@ customElements.define("goa-dropdown-item", DropdownItem);
|
|
|
6627
6695
|
|
|
6628
6696
|
/* libs/web-components/src/components/focus-trap/FocusTrap.svelte generated by Svelte v3.51.0 */
|
|
6629
6697
|
|
|
6630
|
-
function create_fragment$
|
|
6698
|
+
function create_fragment$w(ctx) {
|
|
6631
6699
|
let div;
|
|
6632
6700
|
|
|
6633
6701
|
return {
|
|
@@ -6679,7 +6747,7 @@ function isFocusable(element) {
|
|
|
6679
6747
|
}
|
|
6680
6748
|
}
|
|
6681
6749
|
|
|
6682
|
-
function instance$
|
|
6750
|
+
function instance$u($$self, $$props, $$invalidate) {
|
|
6683
6751
|
let isActive;
|
|
6684
6752
|
let { active } = $$props;
|
|
6685
6753
|
let ignoreFocusChanges = false;
|
|
@@ -6854,8 +6922,8 @@ class FocusTrap extends SvelteElement {
|
|
|
6854
6922
|
props: attribute_to_object(this.attributes),
|
|
6855
6923
|
customElement: true
|
|
6856
6924
|
},
|
|
6857
|
-
instance$
|
|
6858
|
-
create_fragment$
|
|
6925
|
+
instance$u,
|
|
6926
|
+
create_fragment$w,
|
|
6859
6927
|
safe_not_equal,
|
|
6860
6928
|
{ active: 1 },
|
|
6861
6929
|
null
|
|
@@ -6908,7 +6976,7 @@ function create_if_block$g(ctx) {
|
|
|
6908
6976
|
};
|
|
6909
6977
|
}
|
|
6910
6978
|
|
|
6911
|
-
function create_fragment$
|
|
6979
|
+
function create_fragment$v(ctx) {
|
|
6912
6980
|
let div5;
|
|
6913
6981
|
let div4;
|
|
6914
6982
|
let div0;
|
|
@@ -7007,7 +7075,7 @@ function create_fragment$u(ctx) {
|
|
|
7007
7075
|
};
|
|
7008
7076
|
}
|
|
7009
7077
|
|
|
7010
|
-
function instance$
|
|
7078
|
+
function instance$t($$self, $$props, $$invalidate) {
|
|
7011
7079
|
let { maxcontentwidth = "" } = $$props;
|
|
7012
7080
|
let rootEl;
|
|
7013
7081
|
let navLinks;
|
|
@@ -7039,7 +7107,7 @@ function instance$s($$self, $$props, $$invalidate) {
|
|
|
7039
7107
|
class Footer extends SvelteElement {
|
|
7040
7108
|
constructor(options) {
|
|
7041
7109
|
super();
|
|
7042
|
-
this.shadowRoot.innerHTML = `<style>*{box-sizing:border-box}.app-footer{background-color:var(--goa-color-greyscale-100);border-top:2px solid var(--goa-color-greyscale-200);border-bottom:1rem solid var(--goa-color-brand-default)}.content{padding:2rem 1rem;margin:0 auto;width:min(var(--max-content-width), 100%)}@media(min-width: 640px){.content{padding:2rem
|
|
7110
|
+
this.shadowRoot.innerHTML = `<style>*{box-sizing:border-box}.app-footer{background-color:var(--goa-color-greyscale-100);border-top:2px solid var(--goa-color-greyscale-200);border-bottom:1rem solid var(--goa-color-brand-default)}.content{padding:2rem 1rem;margin:0 auto;width:min(var(--max-content-width), 100%)}@media(min-width: 640px){.content{padding:2rem 2rem}}@media(min-width: 1024px){.content{padding:2rem 4.5rem}}.meta-section{display:flex;flex-direction:column;padding:1rem 0}.meta-section.with-meta-links{gap:2rem;justify-content:space-between}.meta-links{display:none}.with-meta-links .meta-links{display:block}.nav-links{display:flex;flex-direction:column;gap:2rem}.abgov{display:flex;flex-direction:column;justify-content:space-between;width:100%}@media(min-width: 640px){.meta-section{flex-direction:row;gap:2rem}.nav-links{flex-direction:row}.abgov{align-items:center;flex-direction:row-reverse}}.abgov.with-meta-links{gap:1rem;flex-direction:column;width:unset}@media(min-width: 640px){.abgov.with-meta-links{align-items:flex-end}}.goa-copyright{white-space:nowrap}a{color:var(--goa-color-text-secondary)}</style>`;
|
|
7043
7111
|
|
|
7044
7112
|
init(
|
|
7045
7113
|
this,
|
|
@@ -7048,8 +7116,8 @@ class Footer extends SvelteElement {
|
|
|
7048
7116
|
props: attribute_to_object(this.attributes),
|
|
7049
7117
|
customElement: true
|
|
7050
7118
|
},
|
|
7051
|
-
instance$
|
|
7052
|
-
create_fragment$
|
|
7119
|
+
instance$t,
|
|
7120
|
+
create_fragment$v,
|
|
7053
7121
|
safe_not_equal,
|
|
7054
7122
|
{ maxcontentwidth: 0 },
|
|
7055
7123
|
null
|
|
@@ -7124,7 +7192,7 @@ function create_each_block$5(ctx) {
|
|
|
7124
7192
|
};
|
|
7125
7193
|
}
|
|
7126
7194
|
|
|
7127
|
-
function create_fragment$
|
|
7195
|
+
function create_fragment$u(ctx) {
|
|
7128
7196
|
let section;
|
|
7129
7197
|
let div;
|
|
7130
7198
|
let t;
|
|
@@ -7197,7 +7265,7 @@ function create_fragment$t(ctx) {
|
|
|
7197
7265
|
};
|
|
7198
7266
|
}
|
|
7199
7267
|
|
|
7200
|
-
function instance$
|
|
7268
|
+
function instance$s($$self, $$props, $$invalidate) {
|
|
7201
7269
|
let rootEl;
|
|
7202
7270
|
let children = [];
|
|
7203
7271
|
|
|
@@ -7241,8 +7309,8 @@ class FooterMetaSection extends SvelteElement {
|
|
|
7241
7309
|
props: attribute_to_object(this.attributes),
|
|
7242
7310
|
customElement: true
|
|
7243
7311
|
},
|
|
7244
|
-
instance$
|
|
7245
|
-
create_fragment$
|
|
7312
|
+
instance$s,
|
|
7313
|
+
create_fragment$u,
|
|
7246
7314
|
safe_not_equal,
|
|
7247
7315
|
{},
|
|
7248
7316
|
null
|
|
@@ -7332,7 +7400,7 @@ function create_each_block$4(ctx) {
|
|
|
7332
7400
|
};
|
|
7333
7401
|
}
|
|
7334
7402
|
|
|
7335
|
-
function create_fragment$
|
|
7403
|
+
function create_fragment$t(ctx) {
|
|
7336
7404
|
let section;
|
|
7337
7405
|
let t0;
|
|
7338
7406
|
let div;
|
|
@@ -7447,7 +7515,7 @@ function create_fragment$s(ctx) {
|
|
|
7447
7515
|
};
|
|
7448
7516
|
}
|
|
7449
7517
|
|
|
7450
|
-
function instance$
|
|
7518
|
+
function instance$r($$self, $$props, $$invalidate) {
|
|
7451
7519
|
let { heading = "" } = $$props;
|
|
7452
7520
|
let { maxcolumncount = 1 } = $$props;
|
|
7453
7521
|
let rootEl;
|
|
@@ -7493,7 +7561,7 @@ function instance$q($$self, $$props, $$invalidate) {
|
|
|
7493
7561
|
class FooterNavSection extends SvelteElement {
|
|
7494
7562
|
constructor(options) {
|
|
7495
7563
|
super();
|
|
7496
|
-
this.shadowRoot.innerHTML = `<style>:host{flex:auto}.title{font-size:var(--goa-font-size-7);line-height:var(--goa-line-height-4)}.hidden{display:none}.links{display:block;list-style-type:none;padding-left:0}@media(min-width: 720px){.links{display:var(--narrow-display-type);list-style-type:none;padding-left:0;flex-direction:column;column-count:var(--narrow-column-count)}}@media(min-width: 1024px){.links{display:var(--wide-display-type);list-style-type:none;padding-left:0;flex-direction:column;column-count:var(--wide-column-count)}}li{padding:0.75rem 0}a{color:var(--goa-color-text-default)}</style>`;
|
|
7564
|
+
this.shadowRoot.innerHTML = `<style>:host{flex:auto}.title{font-size:var(--goa-font-size-7);line-height:var(--goa-line-height-4);padding-bottom:var(--goa-space-l)}.hidden{display:none}.links{display:block;list-style-type:none;padding-left:0}@media(min-width: 720px){.links{display:var(--narrow-display-type);list-style-type:none;padding-left:0;flex-direction:column;column-count:var(--narrow-column-count)}}@media(min-width: 1024px){.links{display:var(--wide-display-type);list-style-type:none;padding-left:0;flex-direction:column;column-count:var(--wide-column-count)}}li{padding:0.75rem 0}a{color:var(--goa-color-text-default)}</style>`;
|
|
7497
7565
|
|
|
7498
7566
|
init(
|
|
7499
7567
|
this,
|
|
@@ -7502,8 +7570,8 @@ class FooterNavSection extends SvelteElement {
|
|
|
7502
7570
|
props: attribute_to_object(this.attributes),
|
|
7503
7571
|
customElement: true
|
|
7504
7572
|
},
|
|
7505
|
-
instance$
|
|
7506
|
-
create_fragment$
|
|
7573
|
+
instance$r,
|
|
7574
|
+
create_fragment$t,
|
|
7507
7575
|
safe_not_equal,
|
|
7508
7576
|
{ heading: 0, maxcolumncount: 1 },
|
|
7509
7577
|
null
|
|
@@ -7680,7 +7748,7 @@ function create_if_block$e(ctx) {
|
|
|
7680
7748
|
};
|
|
7681
7749
|
}
|
|
7682
7750
|
|
|
7683
|
-
function create_fragment$
|
|
7751
|
+
function create_fragment$s(ctx) {
|
|
7684
7752
|
let div1;
|
|
7685
7753
|
let t0;
|
|
7686
7754
|
let div0;
|
|
@@ -7777,7 +7845,7 @@ function create_fragment$r(ctx) {
|
|
|
7777
7845
|
};
|
|
7778
7846
|
}
|
|
7779
7847
|
|
|
7780
|
-
function instance$
|
|
7848
|
+
function instance$q($$self, $$props, $$invalidate) {
|
|
7781
7849
|
const [REQUIREMENT_TYPES, validateRequirementType] = typeValidator("Requirement type", ["optional", "required"], false);
|
|
7782
7850
|
let { testid = "" } = $$props;
|
|
7783
7851
|
let { mt = null } = $$props;
|
|
@@ -7820,8 +7888,8 @@ class FormItem extends SvelteElement {
|
|
|
7820
7888
|
props: attribute_to_object(this.attributes),
|
|
7821
7889
|
customElement: true
|
|
7822
7890
|
},
|
|
7823
|
-
instance$
|
|
7824
|
-
create_fragment$
|
|
7891
|
+
instance$q,
|
|
7892
|
+
create_fragment$s,
|
|
7825
7893
|
safe_not_equal,
|
|
7826
7894
|
{
|
|
7827
7895
|
testid: 0,
|
|
@@ -7949,7 +8017,7 @@ customElements.define("goa-form-item", FormItem);
|
|
|
7949
8017
|
|
|
7950
8018
|
/* libs/web-components/src/components/grid/Grid.svelte generated by Svelte v3.51.0 */
|
|
7951
8019
|
|
|
7952
|
-
function create_fragment$
|
|
8020
|
+
function create_fragment$r(ctx) {
|
|
7953
8021
|
let div;
|
|
7954
8022
|
let slot;
|
|
7955
8023
|
let div_style_value;
|
|
@@ -7988,7 +8056,7 @@ function create_fragment$q(ctx) {
|
|
|
7988
8056
|
};
|
|
7989
8057
|
}
|
|
7990
8058
|
|
|
7991
|
-
function instance$
|
|
8059
|
+
function instance$p($$self, $$props, $$invalidate) {
|
|
7992
8060
|
let { gap = "m" } = $$props;
|
|
7993
8061
|
let { minchildwidth = "" } = $$props;
|
|
7994
8062
|
let { mt = null } = $$props;
|
|
@@ -8024,8 +8092,8 @@ class Grid extends SvelteElement {
|
|
|
8024
8092
|
props: attribute_to_object(this.attributes),
|
|
8025
8093
|
customElement: true
|
|
8026
8094
|
},
|
|
8027
|
-
instance$
|
|
8028
|
-
create_fragment$
|
|
8095
|
+
instance$p,
|
|
8096
|
+
create_fragment$r,
|
|
8029
8097
|
safe_not_equal,
|
|
8030
8098
|
{
|
|
8031
8099
|
gap: 0,
|
|
@@ -8113,7 +8181,7 @@ customElements.define("goa-grid", Grid);
|
|
|
8113
8181
|
|
|
8114
8182
|
/* libs/web-components/src/components/hero-banner/HeroBanner.svelte generated by Svelte v3.51.0 */
|
|
8115
8183
|
|
|
8116
|
-
function create_fragment$
|
|
8184
|
+
function create_fragment$q(ctx) {
|
|
8117
8185
|
let div1;
|
|
8118
8186
|
let goa_page_block;
|
|
8119
8187
|
let h1;
|
|
@@ -8122,6 +8190,7 @@ function create_fragment$p(ctx) {
|
|
|
8122
8190
|
let div0;
|
|
8123
8191
|
let t2;
|
|
8124
8192
|
let slot1;
|
|
8193
|
+
let goa_page_block_width_value;
|
|
8125
8194
|
|
|
8126
8195
|
return {
|
|
8127
8196
|
c() {
|
|
@@ -8138,7 +8207,7 @@ function create_fragment$p(ctx) {
|
|
|
8138
8207
|
attr(div0, "class", "goa-hero-banner-content");
|
|
8139
8208
|
attr(div0, "role", "note");
|
|
8140
8209
|
attr(slot1, "name", "actions");
|
|
8141
|
-
set_custom_element_data(goa_page_block, "width", "full");
|
|
8210
|
+
set_custom_element_data(goa_page_block, "width", goa_page_block_width_value = /*maxcontentwidth*/ ctx[3] || "full");
|
|
8142
8211
|
attr(div1, "class", "goa-hero");
|
|
8143
8212
|
attr(div1, "data-testid", "background");
|
|
8144
8213
|
set_style(div1, "background-image", "linear-gradient(rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0.40) 40%, rgba(0, 0, 0, 0.6) 100%), url(" + /*backgroundurl*/ ctx[1] + ")");
|
|
@@ -8160,6 +8229,10 @@ function create_fragment$p(ctx) {
|
|
|
8160
8229
|
p(ctx, [dirty]) {
|
|
8161
8230
|
if (dirty & /*heading*/ 1) set_data(t0, /*heading*/ ctx[0]);
|
|
8162
8231
|
|
|
8232
|
+
if (dirty & /*maxcontentwidth*/ 8 && goa_page_block_width_value !== (goa_page_block_width_value = /*maxcontentwidth*/ ctx[3] || "full")) {
|
|
8233
|
+
set_custom_element_data(goa_page_block, "width", goa_page_block_width_value);
|
|
8234
|
+
}
|
|
8235
|
+
|
|
8163
8236
|
if (dirty & /*backgroundurl*/ 2) {
|
|
8164
8237
|
set_style(div1, "background-image", "linear-gradient(rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0.40) 40%, rgba(0, 0, 0, 0.6) 100%), url(" + /*backgroundurl*/ ctx[1] + ")");
|
|
8165
8238
|
}
|
|
@@ -8176,18 +8249,20 @@ function create_fragment$p(ctx) {
|
|
|
8176
8249
|
};
|
|
8177
8250
|
}
|
|
8178
8251
|
|
|
8179
|
-
function instance$
|
|
8252
|
+
function instance$o($$self, $$props, $$invalidate) {
|
|
8180
8253
|
let { heading } = $$props;
|
|
8181
8254
|
let { backgroundurl } = $$props;
|
|
8182
8255
|
let { minheight = "600px" } = $$props;
|
|
8256
|
+
let { maxcontentwidth = "100%" } = $$props;
|
|
8183
8257
|
|
|
8184
8258
|
$$self.$$set = $$props => {
|
|
8185
8259
|
if ('heading' in $$props) $$invalidate(0, heading = $$props.heading);
|
|
8186
8260
|
if ('backgroundurl' in $$props) $$invalidate(1, backgroundurl = $$props.backgroundurl);
|
|
8187
8261
|
if ('minheight' in $$props) $$invalidate(2, minheight = $$props.minheight);
|
|
8262
|
+
if ('maxcontentwidth' in $$props) $$invalidate(3, maxcontentwidth = $$props.maxcontentwidth);
|
|
8188
8263
|
};
|
|
8189
8264
|
|
|
8190
|
-
return [heading, backgroundurl, minheight];
|
|
8265
|
+
return [heading, backgroundurl, minheight, maxcontentwidth];
|
|
8191
8266
|
}
|
|
8192
8267
|
|
|
8193
8268
|
class HeroBanner extends SvelteElement {
|
|
@@ -8202,13 +8277,14 @@ class HeroBanner extends SvelteElement {
|
|
|
8202
8277
|
props: attribute_to_object(this.attributes),
|
|
8203
8278
|
customElement: true
|
|
8204
8279
|
},
|
|
8205
|
-
instance$
|
|
8206
|
-
create_fragment$
|
|
8280
|
+
instance$o,
|
|
8281
|
+
create_fragment$q,
|
|
8207
8282
|
safe_not_equal,
|
|
8208
8283
|
{
|
|
8209
8284
|
heading: 0,
|
|
8210
8285
|
backgroundurl: 1,
|
|
8211
|
-
minheight: 2
|
|
8286
|
+
minheight: 2,
|
|
8287
|
+
maxcontentwidth: 3
|
|
8212
8288
|
},
|
|
8213
8289
|
null
|
|
8214
8290
|
);
|
|
@@ -8226,7 +8302,7 @@ class HeroBanner extends SvelteElement {
|
|
|
8226
8302
|
}
|
|
8227
8303
|
|
|
8228
8304
|
static get observedAttributes() {
|
|
8229
|
-
return ["heading", "backgroundurl", "minheight"];
|
|
8305
|
+
return ["heading", "backgroundurl", "minheight", "maxcontentwidth"];
|
|
8230
8306
|
}
|
|
8231
8307
|
|
|
8232
8308
|
get heading() {
|
|
@@ -8255,13 +8331,22 @@ class HeroBanner extends SvelteElement {
|
|
|
8255
8331
|
this.$$set({ minheight });
|
|
8256
8332
|
flush();
|
|
8257
8333
|
}
|
|
8334
|
+
|
|
8335
|
+
get maxcontentwidth() {
|
|
8336
|
+
return this.$$.ctx[3];
|
|
8337
|
+
}
|
|
8338
|
+
|
|
8339
|
+
set maxcontentwidth(maxcontentwidth) {
|
|
8340
|
+
this.$$set({ maxcontentwidth });
|
|
8341
|
+
flush();
|
|
8342
|
+
}
|
|
8258
8343
|
}
|
|
8259
8344
|
|
|
8260
8345
|
customElements.define("goa-hero-banner", HeroBanner);
|
|
8261
8346
|
|
|
8262
8347
|
/* libs/web-components/src/components/icon-button/IconButton.svelte generated by Svelte v3.51.0 */
|
|
8263
8348
|
|
|
8264
|
-
function create_fragment$
|
|
8349
|
+
function create_fragment$p(ctx) {
|
|
8265
8350
|
let button;
|
|
8266
8351
|
let goa_icon;
|
|
8267
8352
|
let button_style_value;
|
|
@@ -8348,7 +8433,7 @@ function handleClick(e) {
|
|
|
8348
8433
|
e.target.dispatchEvent(new CustomEvent("_click", { composed: true, detail: { event: e } }));
|
|
8349
8434
|
}
|
|
8350
8435
|
|
|
8351
|
-
function instance$
|
|
8436
|
+
function instance$n($$self, $$props, $$invalidate) {
|
|
8352
8437
|
let css;
|
|
8353
8438
|
let isDisabled;
|
|
8354
8439
|
let isInverted;
|
|
@@ -8441,8 +8526,8 @@ class IconButton extends SvelteElement {
|
|
|
8441
8526
|
props: attribute_to_object(this.attributes),
|
|
8442
8527
|
customElement: true
|
|
8443
8528
|
},
|
|
8444
|
-
instance$
|
|
8445
|
-
create_fragment$
|
|
8529
|
+
instance$n,
|
|
8530
|
+
create_fragment$p,
|
|
8446
8531
|
safe_not_equal,
|
|
8447
8532
|
{
|
|
8448
8533
|
icon: 0,
|
|
@@ -8697,7 +8782,7 @@ function create_if_block_1$7(ctx) {
|
|
|
8697
8782
|
};
|
|
8698
8783
|
}
|
|
8699
8784
|
|
|
8700
|
-
function create_fragment$
|
|
8785
|
+
function create_fragment$o(ctx) {
|
|
8701
8786
|
let div;
|
|
8702
8787
|
let div_class_value;
|
|
8703
8788
|
let div_style_value;
|
|
@@ -8773,7 +8858,7 @@ function create_fragment$n(ctx) {
|
|
|
8773
8858
|
};
|
|
8774
8859
|
}
|
|
8775
8860
|
|
|
8776
|
-
function instance$
|
|
8861
|
+
function instance$m($$self, $$props, $$invalidate) {
|
|
8777
8862
|
let isInverted;
|
|
8778
8863
|
let { mt = null } = $$props;
|
|
8779
8864
|
let { mr = null } = $$props;
|
|
@@ -8792,7 +8877,7 @@ function instance$l($$self, $$props, $$invalidate) {
|
|
|
8792
8877
|
// Private
|
|
8793
8878
|
const _iconOverrides = {
|
|
8794
8879
|
pencil: `<svg width="18" height="18" viewBox="0 0 18 18" fill="none" xmlns="http://www.w3.org/2000/svg"> <path d="M16.1442 5.47956L12.5355 1.87088L13.7196 0.686776C14.0391 0.367257 14.4385 0.212197 14.9178 0.221594C15.3971 0.230992 15.7965 0.39545 16.116 0.714969L17.3283 1.92726C17.6478 2.24678 17.8076 2.64148 17.8076 3.11136C17.8076 3.58124 17.6478 3.97594 17.3283 4.29546L16.1442 5.47956ZM1.03951 17.8424C0.795173 17.8424 0.593125 17.7626 0.433365 17.6028C0.273605 17.443 0.193726 17.241 0.193726 16.9966V14.5721C0.193726 14.4593 0.212521 14.356 0.250112 14.262C0.287702 14.168 0.353485 14.074 0.447461 13.9801L11.4689 2.93435L15.0776 6.54303L4.05615 17.5887C3.96217 17.6827 3.8682 17.7485 3.77422 17.7861C3.68024 17.8236 3.57687 17.8424 3.4641 17.8424H1.03951Z" fill="currentcolor"/> </svg>`,
|
|
8795
|
-
checkmark: `<svg width="18" height="14" viewBox="0 0 18 14" fill="none" xmlns="http://www.w3.org/2000/svg"> <path fill-rule="evenodd" clip-rule="evenodd" d="M6.20129 11.5368L15.9974 0.341265C16.3611 -0.0743717 16.9929 -0.116489 17.4085 0.247193C17.8241 0.610875 17.8663 1.24264 17.5026 1.65827L7.00258 13.6583C6.82032 13.8666 6.5599 13.99 6.28328 13.9992C6.00666 14.0084 5.7386 13.9026 5.54289 13.7069L1.04289 9.20688C0.652369 8.81635 0.652369 8.18319 1.04289 7.79266C1.43342 7.40214 2.06658 7.40214 2.45711 7.79266L6.20129 11.5368Z" fill="
|
|
8880
|
+
checkmark: `<svg width="18" height="14" viewBox="0 0 18 14" fill="none" xmlns="http://www.w3.org/2000/svg"> <path fill-rule="evenodd" clip-rule="evenodd" d="M6.20129 11.5368L15.9974 0.341265C16.3611 -0.0743717 16.9929 -0.116489 17.4085 0.247193C17.8241 0.610875 17.8663 1.24264 17.5026 1.65827L7.00258 13.6583C6.82032 13.8666 6.5599 13.99 6.28328 13.9992C6.00666 14.0084 5.7386 13.9026 5.54289 13.7069L1.04289 9.20688C0.652369 8.81635 0.652369 8.18319 1.04289 7.79266C1.43342 7.40214 2.06658 7.40214 2.45711 7.79266L6.20129 11.5368Z" fill="currentcolor"/> </svg>`,
|
|
8796
8881
|
remove: `<svg width="16" height="20" viewBox="0 0 16 1" fill="none" xmlns="http://www.w3.org/2000/svg"> <path d="M1.5 -0.000244141C0.947715 -0.000244141 0.5 0.447471 0.5 0.999756C0.5 1.55204 0.947715 1.99976 1.5 1.99976H15C15.5523 1.99976 16 1.55204 16 0.999756C16 0.447471 15.5523 -0.000244141 15 -0.000244141H1.5Z" fill="currentcolor"/> </svg>`,
|
|
8797
8882
|
"goa-file": `<svg width="39" height="48" viewBox="0 0 39 48" fill="none" xmlns="http://www.w3.org/2000/svg"> <g clip-path="url(#clip0_1357_108691)"> <path d="M38.741 14C38.541 13.07 38.081 12.22 37.401 11.54L36.861 11L27.861 2L27.321 1.46C26.641 0.78 25.781 0.32 24.861 0.12C24.511 0.04 24.151 0 23.791 0H5.86096C3.10096 0 0.860962 2.24 0.860962 5V43C0.860962 45.76 3.10096 48 5.86096 48H33.861C36.621 48 38.861 45.76 38.861 43V15.07C38.861 14.71 38.811 14.35 38.741 14ZM35.041 12H29.871C28.221 12 26.871 10.65 26.871 9V3.83L35.041 12ZM36.871 43C36.871 44.65 35.521 46 33.871 46H5.87097C4.22097 46 2.87097 44.65 2.87097 43V5C2.87097 3.35 4.22097 2 5.87097 2H23.801C24.171 2 24.531 2.07 24.871 2.2V9C24.871 11.76 27.111 14 29.871 14H36.671C36.801 14.34 36.871 14.7 36.871 15.07V43Z" fill="currentcolor"/> </g> <defs> <clipPath id="clip0_1357_108691"><rect width="38" height="48" fill="white" transform="translate(0.861328)"/></clipPath></defs></svg>`,
|
|
8798
8883
|
"goa-text": `<svg width="39" height="48" viewBox="0 0 39 48" fill="none" xmlns="http://www.w3.org/2000/svg"> <path d="M38.7953 14C38.5953 13.07 38.1353 12.22 37.4553 11.54L36.9153 11L27.9153 2L27.3753 1.46C26.6953 0.78 25.8353 0.32 24.9153 0.12C24.5653 0.04 24.2053 0 23.8453 0H5.91528C3.15528 0 0.915283 2.24 0.915283 5V43C0.915283 45.76 3.15528 48 5.91528 48H33.9153C36.6753 48 38.9153 45.76 38.9153 43V15.07C38.9153 14.71 38.8653 14.35 38.7953 14ZM35.0953 12H29.9253C28.2753 12 26.9253 10.65 26.9253 9V3.83L35.0953 12ZM36.9253 43C36.9253 44.65 35.5753 46 33.9253 46H5.91528C4.26528 46 2.91528 44.65 2.91528 43V5C2.91528 3.35 4.26528 2 5.91528 2H23.8453C24.2153 2 24.5753 2.07 24.9153 2.2V9C24.9153 11.76 27.1553 14 29.9153 14H36.7153C36.8453 14.34 36.9153 14.7 36.9153 15.07V43H36.9253Z" fill="currentcolor"/> <path d="M27.9153 34H11.9153C11.363 34 10.9153 34.4477 10.9153 35C10.9153 35.5523 11.363 36 11.9153 36H27.9153C28.4676 36 28.9153 35.5523 28.9153 35C28.9153 34.4477 28.4676 34 27.9153 34Z" fill="currentcolor"/> <path d="M27.9153 26H11.9153C11.363 26 10.9153 26.4477 10.9153 27C10.9153 27.5523 11.363 28 11.9153 28H27.9153C28.4676 28 28.9153 27.5523 28.9153 27C28.9153 26.4477 28.4676 26 27.9153 26Z" fill="currentcolor"/> </svg>`,
|
|
@@ -8850,7 +8935,7 @@ function instance$l($$self, $$props, $$invalidate) {
|
|
|
8850
8935
|
class Icon extends SvelteElement {
|
|
8851
8936
|
constructor(options) {
|
|
8852
8937
|
super();
|
|
8853
|
-
this.shadowRoot.innerHTML = `<style>:host{display:inline-flex;align-items:center}ion-icon{pointer-events:none;width:100%;height:100%}.goa-icon{fill:var(--fill-color);color:var(--fill-color);opacity:var(--opacity);display:inline-flex;align-items:center;justify-content:center}.goa-icon:hover ion-icon{fill:var(--hover-color);color:var(--hover-color)}.goa-icon--small{width:1.25rem;height:1.25rem}.goa-icon--medium{width:1.5rem;height:1.5rem}.goa-icon--large{width:2rem;height:2rem}.goa-icon--xlarge{width:2.5rem;height:2.5rem}.goa-icon:has(.icon-override){height:fit-content}.icon-override{display:flex;flex-direction:column;align-items:center}.
|
|
8938
|
+
this.shadowRoot.innerHTML = `<style>:host{display:inline-flex;align-items:center}ion-icon{pointer-events:none;width:100%;height:100%}.goa-icon{fill:var(--fill-color);color:var(--fill-color);opacity:var(--opacity);display:inline-flex;align-items:center;justify-content:center}.goa-icon:hover ion-icon{fill:var(--hover-color);color:var(--hover-color)}.goa-icon--small{width:1.25rem;height:1.25rem}.goa-icon--medium{width:1.5rem;height:1.5rem}.goa-icon--large{width:2rem;height:2rem}.goa-icon--xlarge{width:2.5rem;height:2.5rem}.goa-icon:has(.icon-override){height:fit-content}.icon-override{display:flex;flex-direction:column;align-items:center}.inverted *{color:#fff;fill:#fff}</style>`;
|
|
8854
8939
|
|
|
8855
8940
|
init(
|
|
8856
8941
|
this,
|
|
@@ -8859,8 +8944,8 @@ class Icon extends SvelteElement {
|
|
|
8859
8944
|
props: attribute_to_object(this.attributes),
|
|
8860
8945
|
customElement: true
|
|
8861
8946
|
},
|
|
8862
|
-
instance$
|
|
8863
|
-
create_fragment$
|
|
8947
|
+
instance$m,
|
|
8948
|
+
create_fragment$o,
|
|
8864
8949
|
safe_not_equal,
|
|
8865
8950
|
{
|
|
8866
8951
|
mt: 0,
|
|
@@ -9170,7 +9255,7 @@ function create_if_block$c(ctx) {
|
|
|
9170
9255
|
};
|
|
9171
9256
|
}
|
|
9172
9257
|
|
|
9173
|
-
function create_fragment$
|
|
9258
|
+
function create_fragment$n(ctx) {
|
|
9174
9259
|
let div3;
|
|
9175
9260
|
let div2;
|
|
9176
9261
|
let t0;
|
|
@@ -9474,7 +9559,7 @@ function doClick() {
|
|
|
9474
9559
|
this.dispatchEvent(new CustomEvent("_trailingIconClick", { composed: true }));
|
|
9475
9560
|
}
|
|
9476
9561
|
|
|
9477
|
-
function instance$
|
|
9562
|
+
function instance$l($$self, $$props, $$invalidate) {
|
|
9478
9563
|
let handlesTrailingIconClick;
|
|
9479
9564
|
let isFocused;
|
|
9480
9565
|
let isReadonly;
|
|
@@ -9710,8 +9795,8 @@ class Input extends SvelteElement {
|
|
|
9710
9795
|
props: attribute_to_object(this.attributes),
|
|
9711
9796
|
customElement: true
|
|
9712
9797
|
},
|
|
9713
|
-
instance$
|
|
9714
|
-
create_fragment$
|
|
9798
|
+
instance$l,
|
|
9799
|
+
create_fragment$n,
|
|
9715
9800
|
safe_not_equal,
|
|
9716
9801
|
{
|
|
9717
9802
|
type: 1,
|
|
@@ -10028,35 +10113,25 @@ customElements.define("goa-input", Input);
|
|
|
10028
10113
|
/* libs/web-components/src/components/microsite-header/MicrositeHeader.svelte generated by Svelte v3.51.0 */
|
|
10029
10114
|
|
|
10030
10115
|
function create_if_block_3$5(ctx) {
|
|
10031
|
-
let
|
|
10032
|
-
let t0;
|
|
10033
|
-
let div1;
|
|
10116
|
+
let div;
|
|
10034
10117
|
|
|
10035
10118
|
return {
|
|
10036
10119
|
c() {
|
|
10037
|
-
|
|
10038
|
-
|
|
10039
|
-
|
|
10040
|
-
|
|
10041
|
-
div1.innerHTML = `An official site of the <a href="https://www.alberta.ca/index.aspx">Alberta Government</a>`;
|
|
10042
|
-
attr(div0, "class", "service-type service-type--live");
|
|
10043
|
-
attr(div1, "data-testid", "type");
|
|
10044
|
-
attr(div1, "class", "site-text");
|
|
10120
|
+
div = element("div");
|
|
10121
|
+
div.innerHTML = `An official site of the <a href="https://www.alberta.ca/index.aspx">Alberta Government</a>`;
|
|
10122
|
+
attr(div, "data-testid", "type");
|
|
10123
|
+
attr(div, "class", "site-text");
|
|
10045
10124
|
},
|
|
10046
10125
|
m(target, anchor) {
|
|
10047
|
-
insert(target,
|
|
10048
|
-
insert(target, t0, anchor);
|
|
10049
|
-
insert(target, div1, anchor);
|
|
10126
|
+
insert(target, div, anchor);
|
|
10050
10127
|
},
|
|
10051
10128
|
d(detaching) {
|
|
10052
|
-
if (detaching) detach(
|
|
10053
|
-
if (detaching) detach(t0);
|
|
10054
|
-
if (detaching) detach(div1);
|
|
10129
|
+
if (detaching) detach(div);
|
|
10055
10130
|
}
|
|
10056
10131
|
};
|
|
10057
10132
|
}
|
|
10058
10133
|
|
|
10059
|
-
// (
|
|
10134
|
+
// (31:4) {#if ["alpha", "beta"].includes(type)}
|
|
10060
10135
|
function create_if_block_1$5(ctx) {
|
|
10061
10136
|
let div0;
|
|
10062
10137
|
let t0_value = capitalize(/*type*/ ctx[0]) + "";
|
|
@@ -10078,7 +10153,7 @@ function create_if_block_1$5(ctx) {
|
|
|
10078
10153
|
t2 = text("This is a new ");
|
|
10079
10154
|
a = element("a");
|
|
10080
10155
|
a.textContent = "Alberta Government";
|
|
10081
|
-
t4 = text(" service\n
|
|
10156
|
+
t4 = text(" service\n ");
|
|
10082
10157
|
if (if_block) if_block.c();
|
|
10083
10158
|
attr(div0, "data-testid", "type");
|
|
10084
10159
|
attr(div0, "class", div0_class_value = "service-type service-type--" + /*type*/ ctx[0].toLowerCase());
|
|
@@ -10125,7 +10200,7 @@ function create_if_block_1$5(ctx) {
|
|
|
10125
10200
|
};
|
|
10126
10201
|
}
|
|
10127
10202
|
|
|
10128
|
-
// (
|
|
10203
|
+
// (40:8) {#if feedbackurl}
|
|
10129
10204
|
function create_if_block_2$5(ctx) {
|
|
10130
10205
|
let span;
|
|
10131
10206
|
let t0;
|
|
@@ -10158,7 +10233,7 @@ function create_if_block_2$5(ctx) {
|
|
|
10158
10233
|
};
|
|
10159
10234
|
}
|
|
10160
10235
|
|
|
10161
|
-
// (
|
|
10236
|
+
// (46:4) {#if version}
|
|
10162
10237
|
function create_if_block$b(ctx) {
|
|
10163
10238
|
let div;
|
|
10164
10239
|
let t;
|
|
@@ -10183,13 +10258,15 @@ function create_if_block$b(ctx) {
|
|
|
10183
10258
|
};
|
|
10184
10259
|
}
|
|
10185
10260
|
|
|
10186
|
-
function create_fragment$
|
|
10261
|
+
function create_fragment$m(ctx) {
|
|
10187
10262
|
let header;
|
|
10263
|
+
let div1;
|
|
10188
10264
|
let t0;
|
|
10189
10265
|
let show_if = ["alpha", "beta"].includes(/*type*/ ctx[0]);
|
|
10190
10266
|
let t1;
|
|
10191
|
-
let
|
|
10267
|
+
let div0;
|
|
10192
10268
|
let t2;
|
|
10269
|
+
let header_style_value;
|
|
10193
10270
|
let if_block0 = /*type*/ ctx[0] === "live" && create_if_block_3$5();
|
|
10194
10271
|
let if_block1 = show_if && create_if_block_1$5(ctx);
|
|
10195
10272
|
let if_block2 = /*version*/ ctx[1] && create_if_block$b(ctx);
|
|
@@ -10197,33 +10274,37 @@ function create_fragment$l(ctx) {
|
|
|
10197
10274
|
return {
|
|
10198
10275
|
c() {
|
|
10199
10276
|
header = element("header");
|
|
10277
|
+
div1 = element("div");
|
|
10200
10278
|
if (if_block0) if_block0.c();
|
|
10201
10279
|
t0 = space();
|
|
10202
10280
|
if (if_block1) if_block1.c();
|
|
10203
10281
|
t1 = space();
|
|
10204
|
-
|
|
10282
|
+
div0 = element("div");
|
|
10205
10283
|
t2 = space();
|
|
10206
10284
|
if (if_block2) if_block2.c();
|
|
10207
10285
|
this.c = noop;
|
|
10208
|
-
attr(
|
|
10286
|
+
attr(div0, "class", "spacer");
|
|
10287
|
+
attr(div1, "class", "content-container");
|
|
10209
10288
|
attr(header, "class", "goa-official-site-header");
|
|
10289
|
+
attr(header, "style", header_style_value = `--max-content-width: ${/*maxcontentwidth*/ ctx[3]}`);
|
|
10210
10290
|
},
|
|
10211
10291
|
m(target, anchor) {
|
|
10212
10292
|
insert(target, header, anchor);
|
|
10213
|
-
|
|
10214
|
-
|
|
10215
|
-
|
|
10216
|
-
|
|
10217
|
-
append(
|
|
10218
|
-
append(
|
|
10219
|
-
|
|
10293
|
+
append(header, div1);
|
|
10294
|
+
if (if_block0) if_block0.m(div1, null);
|
|
10295
|
+
append(div1, t0);
|
|
10296
|
+
if (if_block1) if_block1.m(div1, null);
|
|
10297
|
+
append(div1, t1);
|
|
10298
|
+
append(div1, div0);
|
|
10299
|
+
append(div1, t2);
|
|
10300
|
+
if (if_block2) if_block2.m(div1, null);
|
|
10220
10301
|
},
|
|
10221
10302
|
p(ctx, [dirty]) {
|
|
10222
10303
|
if (/*type*/ ctx[0] === "live") {
|
|
10223
10304
|
if (if_block0) ; else {
|
|
10224
10305
|
if_block0 = create_if_block_3$5();
|
|
10225
10306
|
if_block0.c();
|
|
10226
|
-
if_block0.m(
|
|
10307
|
+
if_block0.m(div1, t0);
|
|
10227
10308
|
}
|
|
10228
10309
|
} else if (if_block0) {
|
|
10229
10310
|
if_block0.d(1);
|
|
@@ -10238,7 +10319,7 @@ function create_fragment$l(ctx) {
|
|
|
10238
10319
|
} else {
|
|
10239
10320
|
if_block1 = create_if_block_1$5(ctx);
|
|
10240
10321
|
if_block1.c();
|
|
10241
|
-
if_block1.m(
|
|
10322
|
+
if_block1.m(div1, t1);
|
|
10242
10323
|
}
|
|
10243
10324
|
} else if (if_block1) {
|
|
10244
10325
|
if_block1.d(1);
|
|
@@ -10251,12 +10332,16 @@ function create_fragment$l(ctx) {
|
|
|
10251
10332
|
} else {
|
|
10252
10333
|
if_block2 = create_if_block$b(ctx);
|
|
10253
10334
|
if_block2.c();
|
|
10254
|
-
if_block2.m(
|
|
10335
|
+
if_block2.m(div1, null);
|
|
10255
10336
|
}
|
|
10256
10337
|
} else if (if_block2) {
|
|
10257
10338
|
if_block2.d(1);
|
|
10258
10339
|
if_block2 = null;
|
|
10259
10340
|
}
|
|
10341
|
+
|
|
10342
|
+
if (dirty & /*maxcontentwidth*/ 8 && header_style_value !== (header_style_value = `--max-content-width: ${/*maxcontentwidth*/ ctx[3]}`)) {
|
|
10343
|
+
attr(header, "style", header_style_value);
|
|
10344
|
+
}
|
|
10260
10345
|
},
|
|
10261
10346
|
i: noop,
|
|
10262
10347
|
o: noop,
|
|
@@ -10274,11 +10359,12 @@ function capitalize(val) {
|
|
|
10274
10359
|
return val[0].toUpperCase() + val.slice(1);
|
|
10275
10360
|
}
|
|
10276
10361
|
|
|
10277
|
-
function instance$
|
|
10362
|
+
function instance$k($$self, $$props, $$invalidate) {
|
|
10278
10363
|
const [Types, validateType] = typeValidator("Microsite header type", ["live", "alpha", "beta"], true);
|
|
10279
10364
|
let { type } = $$props;
|
|
10280
10365
|
let { version = "" } = $$props;
|
|
10281
10366
|
let { feedbackurl = "" } = $$props;
|
|
10367
|
+
let { maxcontentwidth = "100%" } = $$props;
|
|
10282
10368
|
|
|
10283
10369
|
onMount(() => {
|
|
10284
10370
|
setTimeout(() => validateType(type), 1);
|
|
@@ -10288,15 +10374,16 @@ function instance$j($$self, $$props, $$invalidate) {
|
|
|
10288
10374
|
if ('type' in $$props) $$invalidate(0, type = $$props.type);
|
|
10289
10375
|
if ('version' in $$props) $$invalidate(1, version = $$props.version);
|
|
10290
10376
|
if ('feedbackurl' in $$props) $$invalidate(2, feedbackurl = $$props.feedbackurl);
|
|
10377
|
+
if ('maxcontentwidth' in $$props) $$invalidate(3, maxcontentwidth = $$props.maxcontentwidth);
|
|
10291
10378
|
};
|
|
10292
10379
|
|
|
10293
|
-
return [type, version, feedbackurl];
|
|
10380
|
+
return [type, version, feedbackurl, maxcontentwidth];
|
|
10294
10381
|
}
|
|
10295
10382
|
|
|
10296
10383
|
class MicrositeHeader extends SvelteElement {
|
|
10297
10384
|
constructor(options) {
|
|
10298
10385
|
super();
|
|
10299
|
-
this.shadowRoot.innerHTML = `<style>:host{box-sizing:border-box;font-family:var(--goa-font-family-sans)}a{color:var(--goa-color-interactive-default);cursor:pointer}a:hover{color:var(--goa-color-interactive-hover)}a:focus{outline-width:thin;outline-style:solid;outline-color:var(--goa-color-interactive-hover);outline-offset:0px}.goa-official-site-header{
|
|
10386
|
+
this.shadowRoot.innerHTML = `<style>:host{box-sizing:border-box;font-family:var(--goa-font-family-sans)}a{color:var(--goa-color-interactive-default);cursor:pointer}a:hover{color:var(--goa-color-interactive-hover)}a:focus{outline-width:thin;outline-style:solid;outline-color:var(--goa-color-interactive-hover);outline-offset:0px}.goa-official-site-header{font-size:var(--goa-font-size-2);background-color:var(--goa-color-greyscale-100);padding:0.5rem 1rem}.content-container{display:flex;align-items:start;justify-content:space-between;max-width:min(var(--max-content-width), 100%);margin:0 auto}@media(min-width: 640px){.goa-official-site-header{padding:0.25rem 2rem}.content-container{align-items:center}}@media(min-width: 1024px){.goa-official-site-header{padding:0.25rem 4.5rem}}.spacer{flex:1 1 auto}.version{color:var(--goa-color-text-secondary);padding-left:1rem;line-height:1.25rem}.service-type{font-weight:bold;padding:0.125rem 0.25rem;display:flex;margin-right:1rem;line-height:initial}.service-type--alpha{background-color:var(--goa-color-warning-default);color:var(--goa-color-text-default)}.service-type--beta{background-color:var(--goa-color-brand-default);color:var(--goa-color-text-light)}.site-text{color:var(--goa-color-text-default);line-height:1.25rem}</style>`;
|
|
10300
10387
|
|
|
10301
10388
|
init(
|
|
10302
10389
|
this,
|
|
@@ -10305,10 +10392,15 @@ class MicrositeHeader extends SvelteElement {
|
|
|
10305
10392
|
props: attribute_to_object(this.attributes),
|
|
10306
10393
|
customElement: true
|
|
10307
10394
|
},
|
|
10308
|
-
instance$
|
|
10309
|
-
create_fragment$
|
|
10395
|
+
instance$k,
|
|
10396
|
+
create_fragment$m,
|
|
10310
10397
|
safe_not_equal,
|
|
10311
|
-
{
|
|
10398
|
+
{
|
|
10399
|
+
type: 0,
|
|
10400
|
+
version: 1,
|
|
10401
|
+
feedbackurl: 2,
|
|
10402
|
+
maxcontentwidth: 3
|
|
10403
|
+
},
|
|
10312
10404
|
null
|
|
10313
10405
|
);
|
|
10314
10406
|
|
|
@@ -10325,7 +10417,7 @@ class MicrositeHeader extends SvelteElement {
|
|
|
10325
10417
|
}
|
|
10326
10418
|
|
|
10327
10419
|
static get observedAttributes() {
|
|
10328
|
-
return ["type", "version", "feedbackurl"];
|
|
10420
|
+
return ["type", "version", "feedbackurl", "maxcontentwidth"];
|
|
10329
10421
|
}
|
|
10330
10422
|
|
|
10331
10423
|
get type() {
|
|
@@ -10354,6 +10446,15 @@ class MicrositeHeader extends SvelteElement {
|
|
|
10354
10446
|
this.$$set({ feedbackurl });
|
|
10355
10447
|
flush();
|
|
10356
10448
|
}
|
|
10449
|
+
|
|
10450
|
+
get maxcontentwidth() {
|
|
10451
|
+
return this.$$.ctx[3];
|
|
10452
|
+
}
|
|
10453
|
+
|
|
10454
|
+
set maxcontentwidth(maxcontentwidth) {
|
|
10455
|
+
this.$$set({ maxcontentwidth });
|
|
10456
|
+
flush();
|
|
10457
|
+
}
|
|
10357
10458
|
}
|
|
10358
10459
|
|
|
10359
10460
|
customElements.define("goa-microsite-header", MicrositeHeader);
|
|
@@ -10579,7 +10680,7 @@ function create_if_block$a(ctx) {
|
|
|
10579
10680
|
};
|
|
10580
10681
|
}
|
|
10581
10682
|
|
|
10582
|
-
// (
|
|
10683
|
+
// (137:8) {#if calloutvariant !== null}
|
|
10583
10684
|
function create_if_block_3$4(ctx) {
|
|
10584
10685
|
let div;
|
|
10585
10686
|
let goa_icon;
|
|
@@ -10623,7 +10724,7 @@ function create_if_block_3$4(ctx) {
|
|
|
10623
10724
|
};
|
|
10624
10725
|
}
|
|
10625
10726
|
|
|
10626
|
-
// (
|
|
10727
|
+
// (150:14) {:else}
|
|
10627
10728
|
function create_else_block$4(ctx) {
|
|
10628
10729
|
let slot;
|
|
10629
10730
|
|
|
@@ -10642,7 +10743,7 @@ function create_else_block$4(ctx) {
|
|
|
10642
10743
|
};
|
|
10643
10744
|
}
|
|
10644
10745
|
|
|
10645
|
-
// (
|
|
10746
|
+
// (148:14) {#if heading}
|
|
10646
10747
|
function create_if_block_2$4(ctx) {
|
|
10647
10748
|
let t;
|
|
10648
10749
|
|
|
@@ -10662,7 +10763,7 @@ function create_if_block_2$4(ctx) {
|
|
|
10662
10763
|
};
|
|
10663
10764
|
}
|
|
10664
10765
|
|
|
10665
|
-
// (
|
|
10766
|
+
// (154:12) {#if _isClosable}
|
|
10666
10767
|
function create_if_block_1$4(ctx) {
|
|
10667
10768
|
let div;
|
|
10668
10769
|
let goa_icon_button;
|
|
@@ -10696,7 +10797,7 @@ function create_if_block_1$4(ctx) {
|
|
|
10696
10797
|
};
|
|
10697
10798
|
}
|
|
10698
10799
|
|
|
10699
|
-
function create_fragment$
|
|
10800
|
+
function create_fragment$l(ctx) {
|
|
10700
10801
|
let if_block_anchor;
|
|
10701
10802
|
let current;
|
|
10702
10803
|
let if_block = /*_isOpen*/ ctx[7] && create_if_block$a(ctx);
|
|
@@ -10752,9 +10853,8 @@ function create_fragment$k(ctx) {
|
|
|
10752
10853
|
};
|
|
10753
10854
|
}
|
|
10754
10855
|
|
|
10755
|
-
function instance$
|
|
10856
|
+
function instance$j($$self, $$props, $$invalidate) {
|
|
10756
10857
|
let _isClosable;
|
|
10757
|
-
let _isOpen;
|
|
10758
10858
|
let _transitionTime;
|
|
10759
10859
|
let _iconType;
|
|
10760
10860
|
let { heading = "" } = $$props;
|
|
@@ -10776,8 +10876,14 @@ function instance$i($$self, $$props, $$invalidate) {
|
|
|
10776
10876
|
|
|
10777
10877
|
const [Transitions, validateTransition] = typeValidator("Modal transition", ["fast", "slow", "none"]);
|
|
10778
10878
|
|
|
10879
|
+
// Moving the reactive var into a timeout prevents accessing null stylesheet
|
|
10880
|
+
// reference to allow for creation of the @keyframes for the in:fade and out:fade transitions.
|
|
10881
|
+
// DDIDS-1288
|
|
10882
|
+
let _isOpen = false;
|
|
10883
|
+
|
|
10779
10884
|
// Hooks
|
|
10780
|
-
onMount(() => {
|
|
10885
|
+
onMount(async () => {
|
|
10886
|
+
await tick();
|
|
10781
10887
|
validateCalloutVariant(calloutvariant);
|
|
10782
10888
|
validateTransition(transition);
|
|
10783
10889
|
});
|
|
@@ -10876,7 +10982,7 @@ function instance$i($$self, $$props, $$invalidate) {
|
|
|
10876
10982
|
}
|
|
10877
10983
|
|
|
10878
10984
|
if ($$self.$$.dirty & /*open*/ 2) {
|
|
10879
|
-
$$invalidate(7, _isOpen = toBoolean(open));
|
|
10985
|
+
setTimeout(() => $$invalidate(7, _isOpen = toBoolean(open)), 1);
|
|
10880
10986
|
}
|
|
10881
10987
|
|
|
10882
10988
|
if ($$self.$$.dirty & /*_isOpen*/ 128) {
|
|
@@ -10964,8 +11070,8 @@ class Modal extends SvelteElement {
|
|
|
10964
11070
|
props: attribute_to_object(this.attributes),
|
|
10965
11071
|
customElement: true
|
|
10966
11072
|
},
|
|
10967
|
-
instance$
|
|
10968
|
-
create_fragment$
|
|
11073
|
+
instance$j,
|
|
11074
|
+
create_fragment$l,
|
|
10969
11075
|
safe_not_equal,
|
|
10970
11076
|
{
|
|
10971
11077
|
heading: 0,
|
|
@@ -11054,6 +11160,7 @@ customElements.define("goa-modal", Modal);
|
|
|
11054
11160
|
/* libs/web-components/src/components/notification/Notification.svelte generated by Svelte v3.51.0 */
|
|
11055
11161
|
|
|
11056
11162
|
function create_if_block$9(ctx) {
|
|
11163
|
+
let div4;
|
|
11057
11164
|
let div3;
|
|
11058
11165
|
let div0;
|
|
11059
11166
|
let goa_icon;
|
|
@@ -11064,14 +11171,16 @@ function create_if_block$9(ctx) {
|
|
|
11064
11171
|
let div2;
|
|
11065
11172
|
let goa_icon_button;
|
|
11066
11173
|
let goa_icon_button_inverted_value;
|
|
11067
|
-
let
|
|
11068
|
-
let
|
|
11174
|
+
let div4_class_value;
|
|
11175
|
+
let div4_style_value;
|
|
11176
|
+
let div4_transition;
|
|
11069
11177
|
let current;
|
|
11070
11178
|
let mounted;
|
|
11071
11179
|
let dispose;
|
|
11072
11180
|
|
|
11073
11181
|
return {
|
|
11074
11182
|
c() {
|
|
11183
|
+
div4 = element("div");
|
|
11075
11184
|
div3 = element("div");
|
|
11076
11185
|
div0 = element("div");
|
|
11077
11186
|
goa_icon = element("goa-icon");
|
|
@@ -11081,7 +11190,7 @@ function create_if_block$9(ctx) {
|
|
|
11081
11190
|
t1 = space();
|
|
11082
11191
|
div2 = element("div");
|
|
11083
11192
|
goa_icon_button = element("goa-icon-button");
|
|
11084
|
-
set_custom_element_data(goa_icon, "type", /*iconType*/ ctx[
|
|
11193
|
+
set_custom_element_data(goa_icon, "type", /*iconType*/ ctx[3]);
|
|
11085
11194
|
set_custom_element_data(goa_icon, "inverted", goa_icon_inverted_value = /*type*/ ctx[0] === "important" ? "false" : "true");
|
|
11086
11195
|
attr(div0, "class", "icon");
|
|
11087
11196
|
attr(div1, "class", "content");
|
|
@@ -11089,10 +11198,13 @@ function create_if_block$9(ctx) {
|
|
|
11089
11198
|
set_custom_element_data(goa_icon_button, "variant", "dark");
|
|
11090
11199
|
set_custom_element_data(goa_icon_button, "inverted", goa_icon_button_inverted_value = /*type*/ ctx[0] === "important" ? "false" : "true");
|
|
11091
11200
|
attr(div2, "class", "close");
|
|
11092
|
-
attr(div3, "class",
|
|
11201
|
+
attr(div3, "class", "content-container");
|
|
11202
|
+
attr(div4, "class", div4_class_value = "notification " + /*type*/ ctx[0]);
|
|
11203
|
+
attr(div4, "style", div4_style_value = `--max-content-width: ${/*maxcontentwidth*/ ctx[1]}`);
|
|
11093
11204
|
},
|
|
11094
11205
|
m(target, anchor) {
|
|
11095
|
-
insert(target,
|
|
11206
|
+
insert(target, div4, anchor);
|
|
11207
|
+
append(div4, div3);
|
|
11096
11208
|
append(div3, div0);
|
|
11097
11209
|
append(div0, goa_icon);
|
|
11098
11210
|
append(div3, t0);
|
|
@@ -11103,13 +11215,13 @@ function create_if_block$9(ctx) {
|
|
|
11103
11215
|
current = true;
|
|
11104
11216
|
|
|
11105
11217
|
if (!mounted) {
|
|
11106
|
-
dispose = listen(goa_icon_button, "click", /*close*/ ctx[
|
|
11218
|
+
dispose = listen(goa_icon_button, "click", /*close*/ ctx[4]);
|
|
11107
11219
|
mounted = true;
|
|
11108
11220
|
}
|
|
11109
11221
|
},
|
|
11110
11222
|
p(ctx, dirty) {
|
|
11111
|
-
if (!current || dirty & /*iconType*/
|
|
11112
|
-
set_custom_element_data(goa_icon, "type", /*iconType*/ ctx[
|
|
11223
|
+
if (!current || dirty & /*iconType*/ 8) {
|
|
11224
|
+
set_custom_element_data(goa_icon, "type", /*iconType*/ ctx[3]);
|
|
11113
11225
|
}
|
|
11114
11226
|
|
|
11115
11227
|
if (!current || dirty & /*type*/ 1 && goa_icon_inverted_value !== (goa_icon_inverted_value = /*type*/ ctx[0] === "important" ? "false" : "true")) {
|
|
@@ -11120,38 +11232,42 @@ function create_if_block$9(ctx) {
|
|
|
11120
11232
|
set_custom_element_data(goa_icon_button, "inverted", goa_icon_button_inverted_value);
|
|
11121
11233
|
}
|
|
11122
11234
|
|
|
11123
|
-
if (!current || dirty & /*type*/ 1 &&
|
|
11124
|
-
attr(
|
|
11235
|
+
if (!current || dirty & /*type*/ 1 && div4_class_value !== (div4_class_value = "notification " + /*type*/ ctx[0])) {
|
|
11236
|
+
attr(div4, "class", div4_class_value);
|
|
11237
|
+
}
|
|
11238
|
+
|
|
11239
|
+
if (!current || dirty & /*maxcontentwidth*/ 2 && div4_style_value !== (div4_style_value = `--max-content-width: ${/*maxcontentwidth*/ ctx[1]}`)) {
|
|
11240
|
+
attr(div4, "style", div4_style_value);
|
|
11125
11241
|
}
|
|
11126
11242
|
},
|
|
11127
11243
|
i(local) {
|
|
11128
11244
|
if (current) return;
|
|
11129
11245
|
|
|
11130
11246
|
add_render_callback(() => {
|
|
11131
|
-
if (!
|
|
11132
|
-
|
|
11247
|
+
if (!div4_transition) div4_transition = create_bidirectional_transition(div4, fade, {}, true);
|
|
11248
|
+
div4_transition.run(1);
|
|
11133
11249
|
});
|
|
11134
11250
|
|
|
11135
11251
|
current = true;
|
|
11136
11252
|
},
|
|
11137
11253
|
o(local) {
|
|
11138
|
-
if (!
|
|
11139
|
-
|
|
11254
|
+
if (!div4_transition) div4_transition = create_bidirectional_transition(div4, fade, {}, false);
|
|
11255
|
+
div4_transition.run(0);
|
|
11140
11256
|
current = false;
|
|
11141
11257
|
},
|
|
11142
11258
|
d(detaching) {
|
|
11143
|
-
if (detaching) detach(
|
|
11144
|
-
if (detaching &&
|
|
11259
|
+
if (detaching) detach(div4);
|
|
11260
|
+
if (detaching && div4_transition) div4_transition.end();
|
|
11145
11261
|
mounted = false;
|
|
11146
11262
|
dispose();
|
|
11147
11263
|
}
|
|
11148
11264
|
};
|
|
11149
11265
|
}
|
|
11150
11266
|
|
|
11151
|
-
function create_fragment$
|
|
11267
|
+
function create_fragment$k(ctx) {
|
|
11152
11268
|
let if_block_anchor;
|
|
11153
11269
|
let current;
|
|
11154
|
-
let if_block = /*show*/ ctx[
|
|
11270
|
+
let if_block = /*show*/ ctx[2] && create_if_block$9(ctx);
|
|
11155
11271
|
|
|
11156
11272
|
return {
|
|
11157
11273
|
c() {
|
|
@@ -11165,11 +11281,11 @@ function create_fragment$j(ctx) {
|
|
|
11165
11281
|
current = true;
|
|
11166
11282
|
},
|
|
11167
11283
|
p(ctx, [dirty]) {
|
|
11168
|
-
if (/*show*/ ctx[
|
|
11284
|
+
if (/*show*/ ctx[2]) {
|
|
11169
11285
|
if (if_block) {
|
|
11170
11286
|
if_block.p(ctx, dirty);
|
|
11171
11287
|
|
|
11172
|
-
if (dirty & /*show*/
|
|
11288
|
+
if (dirty & /*show*/ 4) {
|
|
11173
11289
|
transition_in(if_block, 1);
|
|
11174
11290
|
}
|
|
11175
11291
|
} else {
|
|
@@ -11204,10 +11320,11 @@ function create_fragment$j(ctx) {
|
|
|
11204
11320
|
};
|
|
11205
11321
|
}
|
|
11206
11322
|
|
|
11207
|
-
function instance$
|
|
11323
|
+
function instance$i($$self, $$props, $$invalidate) {
|
|
11208
11324
|
let iconType;
|
|
11209
11325
|
const [Types, validateType] = typeValidator("Notification type", ["emergency", "important", "information", "event"], true);
|
|
11210
11326
|
let { type = "" } = $$props;
|
|
11327
|
+
let { maxcontentwidth = "100%" } = $$props;
|
|
11211
11328
|
let show = true;
|
|
11212
11329
|
|
|
11213
11330
|
onMount(() => {
|
|
@@ -11215,18 +11332,19 @@ function instance$h($$self, $$props, $$invalidate) {
|
|
|
11215
11332
|
});
|
|
11216
11333
|
|
|
11217
11334
|
function close(e) {
|
|
11218
|
-
$$invalidate(
|
|
11335
|
+
$$invalidate(2, show = false);
|
|
11219
11336
|
e.target.dispatchEvent(new CustomEvent("_dismiss", { composed: true }));
|
|
11220
11337
|
e.stopPropagation();
|
|
11221
11338
|
}
|
|
11222
11339
|
|
|
11223
11340
|
$$self.$$set = $$props => {
|
|
11224
11341
|
if ('type' in $$props) $$invalidate(0, type = $$props.type);
|
|
11342
|
+
if ('maxcontentwidth' in $$props) $$invalidate(1, maxcontentwidth = $$props.maxcontentwidth);
|
|
11225
11343
|
};
|
|
11226
11344
|
|
|
11227
11345
|
$$self.$$.update = () => {
|
|
11228
11346
|
if ($$self.$$.dirty & /*type*/ 1) {
|
|
11229
|
-
$$invalidate(
|
|
11347
|
+
$$invalidate(3, iconType = type === "emergency"
|
|
11230
11348
|
? "warning"
|
|
11231
11349
|
: type === "important"
|
|
11232
11350
|
? "alert-circle"
|
|
@@ -11236,13 +11354,13 @@ function instance$h($$self, $$props, $$invalidate) {
|
|
|
11236
11354
|
}
|
|
11237
11355
|
};
|
|
11238
11356
|
|
|
11239
|
-
return [type, show, iconType, close];
|
|
11357
|
+
return [type, maxcontentwidth, show, iconType, close];
|
|
11240
11358
|
}
|
|
11241
11359
|
|
|
11242
11360
|
class Notification extends SvelteElement {
|
|
11243
11361
|
constructor(options) {
|
|
11244
11362
|
super();
|
|
11245
|
-
this.shadowRoot.innerHTML = `<style>:host{box-sizing:border-box;font-family:var(--goa-font-family-sans)}.notification{padding:1.5rem;display:flex
|
|
11363
|
+
this.shadowRoot.innerHTML = `<style>:host{box-sizing:border-box;font-family:var(--goa-font-family-sans)}.notification{padding:1.5rem 1rem;display:flex}@media(min-width: 640px){.notification{padding:1.5rem 2rem}}@media(min-width: 1024px){.notification{padding:1.5rem 4.5rem}}.emergency{background-color:var(--goa-color-emergency-default);color:var(--goa-color-greyscale-white)}.important{background-color:var(--goa-color-warning-default)}.information{background-color:var(--goa-color-info-default);color:var(--goa-color-greyscale-white)}.event{background-color:var(--goa-color-success-default);color:var(--goa-color-greyscale-white)}.icon{flex:0 0 auto}.content-container{display:flex;flex-direction:row;flex:1 1 auto;gap:1rem;margin:0 auto;max-width:min(var(--max-content-width), 100%)}.content{flex:1 1 auto}::slotted(a){color:unset !important;outline:unset !important}.close{flex:0 0 auto}</style>`;
|
|
11246
11364
|
|
|
11247
11365
|
init(
|
|
11248
11366
|
this,
|
|
@@ -11251,10 +11369,10 @@ class Notification extends SvelteElement {
|
|
|
11251
11369
|
props: attribute_to_object(this.attributes),
|
|
11252
11370
|
customElement: true
|
|
11253
11371
|
},
|
|
11254
|
-
instance$
|
|
11255
|
-
create_fragment$
|
|
11372
|
+
instance$i,
|
|
11373
|
+
create_fragment$k,
|
|
11256
11374
|
safe_not_equal,
|
|
11257
|
-
{ type: 0 },
|
|
11375
|
+
{ type: 0, maxcontentwidth: 1 },
|
|
11258
11376
|
null
|
|
11259
11377
|
);
|
|
11260
11378
|
|
|
@@ -11271,7 +11389,7 @@ class Notification extends SvelteElement {
|
|
|
11271
11389
|
}
|
|
11272
11390
|
|
|
11273
11391
|
static get observedAttributes() {
|
|
11274
|
-
return ["type"];
|
|
11392
|
+
return ["type", "maxcontentwidth"];
|
|
11275
11393
|
}
|
|
11276
11394
|
|
|
11277
11395
|
get type() {
|
|
@@ -11282,6 +11400,15 @@ class Notification extends SvelteElement {
|
|
|
11282
11400
|
this.$$set({ type });
|
|
11283
11401
|
flush();
|
|
11284
11402
|
}
|
|
11403
|
+
|
|
11404
|
+
get maxcontentwidth() {
|
|
11405
|
+
return this.$$.ctx[1];
|
|
11406
|
+
}
|
|
11407
|
+
|
|
11408
|
+
set maxcontentwidth(maxcontentwidth) {
|
|
11409
|
+
this.$$set({ maxcontentwidth });
|
|
11410
|
+
flush();
|
|
11411
|
+
}
|
|
11285
11412
|
}
|
|
11286
11413
|
|
|
11287
11414
|
customElements.define("goa-notification", Notification);
|
|
@@ -11293,7 +11420,7 @@ function isValidDimension(value) {
|
|
|
11293
11420
|
|
|
11294
11421
|
/* libs/web-components/src/components/page-block/PageBlock.svelte generated by Svelte v3.51.0 */
|
|
11295
11422
|
|
|
11296
|
-
function create_fragment$
|
|
11423
|
+
function create_fragment$j(ctx) {
|
|
11297
11424
|
let div;
|
|
11298
11425
|
let slot;
|
|
11299
11426
|
let div_style_value;
|
|
@@ -11323,7 +11450,7 @@ function create_fragment$i(ctx) {
|
|
|
11323
11450
|
};
|
|
11324
11451
|
}
|
|
11325
11452
|
|
|
11326
|
-
function instance$
|
|
11453
|
+
function instance$h($$self, $$props, $$invalidate) {
|
|
11327
11454
|
const Sizes = { "full": "100%" };
|
|
11328
11455
|
let { width } = $$props;
|
|
11329
11456
|
let { _width } = $$props;
|
|
@@ -11353,7 +11480,7 @@ function instance$g($$self, $$props, $$invalidate) {
|
|
|
11353
11480
|
class PageBlock extends SvelteElement {
|
|
11354
11481
|
constructor(options) {
|
|
11355
11482
|
super();
|
|
11356
|
-
this.shadowRoot.innerHTML = `<style>:host{box-sizing:border-box;font-family:var(--goa-font-family-sans)}.page-content{max-width:var(--max-width);margin:0 auto;padding:0
|
|
11483
|
+
this.shadowRoot.innerHTML = `<style>:host{box-sizing:border-box;font-family:var(--goa-font-family-sans)}.page-content{max-width:var(--max-width);margin:0 auto;padding:0 1rem}@media(min-width: 640px){.page-content{padding:0 2rem}}@media(min-width: 1024px){.page-content{padding:0 4.5rem}}</style>`;
|
|
11357
11484
|
|
|
11358
11485
|
init(
|
|
11359
11486
|
this,
|
|
@@ -11362,8 +11489,8 @@ class PageBlock extends SvelteElement {
|
|
|
11362
11489
|
props: attribute_to_object(this.attributes),
|
|
11363
11490
|
customElement: true
|
|
11364
11491
|
},
|
|
11365
|
-
instance$
|
|
11366
|
-
create_fragment$
|
|
11492
|
+
instance$h,
|
|
11493
|
+
create_fragment$j,
|
|
11367
11494
|
safe_not_equal,
|
|
11368
11495
|
{ width: 1, _width: 0 },
|
|
11369
11496
|
null
|
|
@@ -11537,7 +11664,7 @@ function create_each_block$3(ctx) {
|
|
|
11537
11664
|
};
|
|
11538
11665
|
}
|
|
11539
11666
|
|
|
11540
|
-
function create_fragment$
|
|
11667
|
+
function create_fragment$i(ctx) {
|
|
11541
11668
|
let goa_block1;
|
|
11542
11669
|
let div;
|
|
11543
11670
|
let t0;
|
|
@@ -11658,7 +11785,7 @@ function create_fragment$h(ctx) {
|
|
|
11658
11785
|
};
|
|
11659
11786
|
}
|
|
11660
11787
|
|
|
11661
|
-
function instance$
|
|
11788
|
+
function instance$g($$self, $$props, $$invalidate) {
|
|
11662
11789
|
let _pageCount;
|
|
11663
11790
|
const [Variants, validateVariant] = typeValidator("Pagination variant", ["all", "links-only"]);
|
|
11664
11791
|
let { pagenumber } = $$props;
|
|
@@ -11778,8 +11905,8 @@ class Pagination extends SvelteElement {
|
|
|
11778
11905
|
props: attribute_to_object(this.attributes),
|
|
11779
11906
|
customElement: true
|
|
11780
11907
|
},
|
|
11781
|
-
instance$
|
|
11782
|
-
create_fragment$
|
|
11908
|
+
instance$g,
|
|
11909
|
+
create_fragment$i,
|
|
11783
11910
|
safe_not_equal,
|
|
11784
11911
|
{
|
|
11785
11912
|
pagenumber: 0,
|
|
@@ -11910,9 +12037,9 @@ function create_if_block$7(ctx) {
|
|
|
11910
12037
|
attr(section, "data-testid", "popover-content");
|
|
11911
12038
|
attr(section, "class", "popover-content");
|
|
11912
12039
|
set_style(section, "max-width", /*maxwidth*/ ctx[1]);
|
|
11913
|
-
set_style(section, "padding", /*paddedContent*/ ctx[
|
|
12040
|
+
set_style(section, "padding", /*paddedContent*/ ctx[9] ? 'var(--goa-space-m)' : '0');
|
|
11914
12041
|
attr(div1, "class", "popover-container");
|
|
11915
|
-
set_custom_element_data(goa_focus_trap, "active", /*_isContentVisible*/ ctx[
|
|
12042
|
+
set_custom_element_data(goa_focus_trap, "active", /*_isContentVisible*/ ctx[6]);
|
|
11916
12043
|
},
|
|
11917
12044
|
m(target, anchor) {
|
|
11918
12045
|
insert(target, goa_focus_trap, anchor);
|
|
@@ -11921,9 +12048,10 @@ function create_if_block$7(ctx) {
|
|
|
11921
12048
|
append(goa_focus_trap, div1);
|
|
11922
12049
|
append(div1, section);
|
|
11923
12050
|
append(section, slot);
|
|
12051
|
+
/*section_binding*/ ctx[14](section);
|
|
11924
12052
|
|
|
11925
12053
|
if (!mounted) {
|
|
11926
|
-
dispose = listen(div0, "click", /*closePopover*/ ctx[
|
|
12054
|
+
dispose = listen(div0, "click", /*closePopover*/ ctx[11]);
|
|
11927
12055
|
mounted = true;
|
|
11928
12056
|
}
|
|
11929
12057
|
},
|
|
@@ -11932,29 +12060,31 @@ function create_if_block$7(ctx) {
|
|
|
11932
12060
|
set_style(section, "max-width", /*maxwidth*/ ctx[1]);
|
|
11933
12061
|
}
|
|
11934
12062
|
|
|
11935
|
-
if (dirty & /*paddedContent*/
|
|
11936
|
-
set_style(section, "padding", /*paddedContent*/ ctx[
|
|
12063
|
+
if (dirty & /*paddedContent*/ 512) {
|
|
12064
|
+
set_style(section, "padding", /*paddedContent*/ ctx[9] ? 'var(--goa-space-m)' : '0');
|
|
11937
12065
|
}
|
|
11938
12066
|
|
|
11939
|
-
if (dirty & /*_isContentVisible*/
|
|
11940
|
-
set_custom_element_data(goa_focus_trap, "active", /*_isContentVisible*/ ctx[
|
|
12067
|
+
if (dirty & /*_isContentVisible*/ 64) {
|
|
12068
|
+
set_custom_element_data(goa_focus_trap, "active", /*_isContentVisible*/ ctx[6]);
|
|
11941
12069
|
}
|
|
11942
12070
|
},
|
|
11943
12071
|
d(detaching) {
|
|
11944
12072
|
if (detaching) detach(goa_focus_trap);
|
|
12073
|
+
/*section_binding*/ ctx[14](null);
|
|
11945
12074
|
mounted = false;
|
|
11946
12075
|
dispose();
|
|
11947
12076
|
}
|
|
11948
12077
|
};
|
|
11949
12078
|
}
|
|
11950
12079
|
|
|
11951
|
-
function create_fragment$
|
|
12080
|
+
function create_fragment$h(ctx) {
|
|
11952
12081
|
let div1;
|
|
11953
12082
|
let div0;
|
|
11954
12083
|
let t;
|
|
12084
|
+
let div1_style_value;
|
|
11955
12085
|
let mounted;
|
|
11956
12086
|
let dispose;
|
|
11957
|
-
let if_block = /*_isContentVisible*/ ctx[
|
|
12087
|
+
let if_block = /*_isContentVisible*/ ctx[6] && create_if_block$7(ctx);
|
|
11958
12088
|
|
|
11959
12089
|
return {
|
|
11960
12090
|
c() {
|
|
@@ -11968,21 +12098,22 @@ function create_fragment$g(ctx) {
|
|
|
11968
12098
|
attr(div0, "tabindex", "0");
|
|
11969
12099
|
attr(div0, "data-testid", "popover-target");
|
|
11970
12100
|
attr(div1, "data-testid", /*testid*/ ctx[0]);
|
|
12101
|
+
attr(div1, "style", div1_style_value = calculateMargin(/*mt*/ ctx[2], /*mr*/ ctx[3], /*mb*/ ctx[4], /*ml*/ ctx[5]));
|
|
11971
12102
|
},
|
|
11972
12103
|
m(target, anchor) {
|
|
11973
12104
|
insert(target, div1, anchor);
|
|
11974
12105
|
append(div1, div0);
|
|
11975
|
-
/*div0_binding*/ ctx[
|
|
12106
|
+
/*div0_binding*/ ctx[13](div0);
|
|
11976
12107
|
append(div1, t);
|
|
11977
12108
|
if (if_block) if_block.m(div1, null);
|
|
11978
12109
|
|
|
11979
12110
|
if (!mounted) {
|
|
11980
|
-
dispose = listen(div0, "click", /*showPopover*/ ctx[
|
|
12111
|
+
dispose = listen(div0, "click", /*showPopover*/ ctx[10]);
|
|
11981
12112
|
mounted = true;
|
|
11982
12113
|
}
|
|
11983
12114
|
},
|
|
11984
12115
|
p(ctx, [dirty]) {
|
|
11985
|
-
if (/*_isContentVisible*/ ctx[
|
|
12116
|
+
if (/*_isContentVisible*/ ctx[6]) {
|
|
11986
12117
|
if (if_block) {
|
|
11987
12118
|
if_block.p(ctx, dirty);
|
|
11988
12119
|
} else {
|
|
@@ -11998,12 +12129,16 @@ function create_fragment$g(ctx) {
|
|
|
11998
12129
|
if (dirty & /*testid*/ 1) {
|
|
11999
12130
|
attr(div1, "data-testid", /*testid*/ ctx[0]);
|
|
12000
12131
|
}
|
|
12132
|
+
|
|
12133
|
+
if (dirty & /*mt, mr, mb, ml*/ 60 && div1_style_value !== (div1_style_value = calculateMargin(/*mt*/ ctx[2], /*mr*/ ctx[3], /*mb*/ ctx[4], /*ml*/ ctx[5]))) {
|
|
12134
|
+
attr(div1, "style", div1_style_value);
|
|
12135
|
+
}
|
|
12001
12136
|
},
|
|
12002
12137
|
i: noop,
|
|
12003
12138
|
o: noop,
|
|
12004
12139
|
d(detaching) {
|
|
12005
12140
|
if (detaching) detach(div1);
|
|
12006
|
-
/*div0_binding*/ ctx[
|
|
12141
|
+
/*div0_binding*/ ctx[13](null);
|
|
12007
12142
|
if (if_block) if_block.d();
|
|
12008
12143
|
mounted = false;
|
|
12009
12144
|
dispose();
|
|
@@ -12011,13 +12146,38 @@ function create_fragment$g(ctx) {
|
|
|
12011
12146
|
};
|
|
12012
12147
|
}
|
|
12013
12148
|
|
|
12014
|
-
function
|
|
12149
|
+
function getBoundingClientRectWithMargins(el) {
|
|
12150
|
+
const rect = el.getBoundingClientRect();
|
|
12151
|
+
const style = window.getComputedStyle(el);
|
|
12152
|
+
const mTop = parseInt(style.marginTop, 10) || 0;
|
|
12153
|
+
const mRight = parseInt(style.marginRight, 10) || 0;
|
|
12154
|
+
const mBottom = parseInt(style.marginBottom, 10) || 0;
|
|
12155
|
+
const mLeft = parseInt(style.marginLeft, 10) || 0;
|
|
12156
|
+
|
|
12157
|
+
return {
|
|
12158
|
+
top: rect.top - mTop,
|
|
12159
|
+
right: rect.right + mRight,
|
|
12160
|
+
bottom: rect.bottom + mBottom,
|
|
12161
|
+
left: rect.left - mLeft,
|
|
12162
|
+
width: rect.width + mLeft + mRight,
|
|
12163
|
+
height: rect.height + mTop + mBottom,
|
|
12164
|
+
x: rect.x - mLeft,
|
|
12165
|
+
y: rect.y - mTop
|
|
12166
|
+
};
|
|
12167
|
+
}
|
|
12168
|
+
|
|
12169
|
+
function instance$f($$self, $$props, $$invalidate) {
|
|
12015
12170
|
let paddedContent;
|
|
12016
12171
|
let { testid = "" } = $$props;
|
|
12017
12172
|
let { maxwidth = "320px" } = $$props;
|
|
12018
12173
|
let { padded = "true" } = $$props;
|
|
12019
12174
|
let _isContentVisible = false;
|
|
12020
12175
|
let _targetEl;
|
|
12176
|
+
let _popoverEl;
|
|
12177
|
+
let { mt = null } = $$props;
|
|
12178
|
+
let { mr = null } = $$props;
|
|
12179
|
+
let { mb = null } = $$props;
|
|
12180
|
+
let { ml = null } = $$props;
|
|
12021
12181
|
|
|
12022
12182
|
onMount(async () => {
|
|
12023
12183
|
await tick();
|
|
@@ -12028,12 +12188,14 @@ function instance$e($$self, $$props, $$invalidate) {
|
|
|
12028
12188
|
removeEventListeners();
|
|
12029
12189
|
});
|
|
12030
12190
|
|
|
12031
|
-
function showPopover() {
|
|
12032
|
-
$$invalidate(
|
|
12191
|
+
async function showPopover() {
|
|
12192
|
+
$$invalidate(6, _isContentVisible = true);
|
|
12193
|
+
await tick();
|
|
12194
|
+
setPopoverPosition();
|
|
12033
12195
|
}
|
|
12034
12196
|
|
|
12035
12197
|
function closePopover() {
|
|
12036
|
-
$$invalidate(
|
|
12198
|
+
$$invalidate(6, _isContentVisible = false);
|
|
12037
12199
|
}
|
|
12038
12200
|
|
|
12039
12201
|
const onInputKeyDown = e => {
|
|
@@ -12050,6 +12212,35 @@ function instance$e($$self, $$props, $$invalidate) {
|
|
|
12050
12212
|
}
|
|
12051
12213
|
};
|
|
12052
12214
|
|
|
12215
|
+
function setPopoverPosition() {
|
|
12216
|
+
// Get target and content rectangles
|
|
12217
|
+
const targetRect = getBoundingClientRectWithMargins(_targetEl);
|
|
12218
|
+
|
|
12219
|
+
const contentRect = getBoundingClientRectWithMargins(_popoverEl);
|
|
12220
|
+
|
|
12221
|
+
// Calculate available space above and below the target element
|
|
12222
|
+
const spaceAbove = targetRect.top;
|
|
12223
|
+
|
|
12224
|
+
const spaceBelow = window.innerHeight - targetRect.bottom;
|
|
12225
|
+
|
|
12226
|
+
// Determine if there's more space above or below the target element
|
|
12227
|
+
const displayAbove = spaceAbove > contentRect.height && spaceAbove > spaceBelow && spaceBelow < contentRect.height;
|
|
12228
|
+
|
|
12229
|
+
// If there's more space above, display the popover above the target element
|
|
12230
|
+
if (displayAbove) {
|
|
12231
|
+
$$invalidate(8, _popoverEl.style.top = `${-contentRect.height - targetRect.height - 4}px`, _popoverEl);
|
|
12232
|
+
} else {
|
|
12233
|
+
$$invalidate(8, _popoverEl.style.top = '0px', _popoverEl);
|
|
12234
|
+
}
|
|
12235
|
+
|
|
12236
|
+
// Move the popover to the left if it is too far to the right and only if there is space to the left
|
|
12237
|
+
if (window.innerWidth - targetRect.right < contentRect.width && targetRect.left > contentRect.width) {
|
|
12238
|
+
$$invalidate(8, _popoverEl.style.left = `-${contentRect.width - targetRect.width}px`, _popoverEl);
|
|
12239
|
+
} else {
|
|
12240
|
+
$$invalidate(8, _popoverEl.style.left = '0px', _popoverEl);
|
|
12241
|
+
}
|
|
12242
|
+
}
|
|
12243
|
+
|
|
12053
12244
|
function addFocusEventListener() {
|
|
12054
12245
|
_targetEl.addEventListener("focus", onFocus, true);
|
|
12055
12246
|
}
|
|
@@ -12067,39 +12258,56 @@ function instance$e($$self, $$props, $$invalidate) {
|
|
|
12067
12258
|
function div0_binding($$value) {
|
|
12068
12259
|
binding_callbacks[$$value ? 'unshift' : 'push'](() => {
|
|
12069
12260
|
_targetEl = $$value;
|
|
12070
|
-
$$invalidate(
|
|
12261
|
+
$$invalidate(7, _targetEl);
|
|
12262
|
+
});
|
|
12263
|
+
}
|
|
12264
|
+
|
|
12265
|
+
function section_binding($$value) {
|
|
12266
|
+
binding_callbacks[$$value ? 'unshift' : 'push'](() => {
|
|
12267
|
+
_popoverEl = $$value;
|
|
12268
|
+
$$invalidate(8, _popoverEl);
|
|
12071
12269
|
});
|
|
12072
12270
|
}
|
|
12073
12271
|
|
|
12074
12272
|
$$self.$$set = $$props => {
|
|
12075
12273
|
if ('testid' in $$props) $$invalidate(0, testid = $$props.testid);
|
|
12076
12274
|
if ('maxwidth' in $$props) $$invalidate(1, maxwidth = $$props.maxwidth);
|
|
12077
|
-
if ('padded' in $$props) $$invalidate(
|
|
12275
|
+
if ('padded' in $$props) $$invalidate(12, padded = $$props.padded);
|
|
12276
|
+
if ('mt' in $$props) $$invalidate(2, mt = $$props.mt);
|
|
12277
|
+
if ('mr' in $$props) $$invalidate(3, mr = $$props.mr);
|
|
12278
|
+
if ('mb' in $$props) $$invalidate(4, mb = $$props.mb);
|
|
12279
|
+
if ('ml' in $$props) $$invalidate(5, ml = $$props.ml);
|
|
12078
12280
|
};
|
|
12079
12281
|
|
|
12080
12282
|
$$self.$$.update = () => {
|
|
12081
|
-
if ($$self.$$.dirty & /*padded*/
|
|
12082
|
-
$$invalidate(
|
|
12283
|
+
if ($$self.$$.dirty & /*padded*/ 4096) {
|
|
12284
|
+
$$invalidate(9, paddedContent = toBoolean(padded));
|
|
12083
12285
|
}
|
|
12084
12286
|
};
|
|
12085
12287
|
|
|
12086
12288
|
return [
|
|
12087
12289
|
testid,
|
|
12088
12290
|
maxwidth,
|
|
12291
|
+
mt,
|
|
12292
|
+
mr,
|
|
12293
|
+
mb,
|
|
12294
|
+
ml,
|
|
12089
12295
|
_isContentVisible,
|
|
12090
12296
|
_targetEl,
|
|
12297
|
+
_popoverEl,
|
|
12091
12298
|
paddedContent,
|
|
12092
12299
|
showPopover,
|
|
12093
12300
|
closePopover,
|
|
12094
12301
|
padded,
|
|
12095
|
-
div0_binding
|
|
12302
|
+
div0_binding,
|
|
12303
|
+
section_binding
|
|
12096
12304
|
];
|
|
12097
12305
|
}
|
|
12098
12306
|
|
|
12099
12307
|
class Popover extends SvelteElement {
|
|
12100
12308
|
constructor(options) {
|
|
12101
12309
|
super();
|
|
12102
|
-
this.shadowRoot.innerHTML = `<style>:host{box-sizing:border-box;font-family:var(--goa-font-family-sans);font-size:var(--goa-font-size-4)}.popover-target{width:fit-content;cursor:pointer}.popover-target:focus{outline:var(--goa-border-width-l) solid var(--goa-color-interactive-focus)}.popover-content{position:absolute;left:0;right:0;margin-top:3px;list-style-type:none;background:var(--goa-color-greyscale-white);
|
|
12310
|
+
this.shadowRoot.innerHTML = `<style>:host{box-sizing:border-box;font-family:var(--goa-font-family-sans);font-size:var(--goa-font-size-4)}.popover-target{width:fit-content;cursor:pointer}.popover-target:focus{outline:var(--goa-border-width-l) solid var(--goa-color-interactive-focus)}.popover-content{position:absolute;left:0;right:0;margin-top:3px;list-style-type:none;background:var(--goa-color-greyscale-white);outline:none;filter:drop-shadow(0px 2px 4px rgba(0, 0, 0, 0.2));z-index:99;width:max-content}.popover-background{cursor:default;position:fixed;z-index:98;inset:0}.popover-container{position:relative}</style>`;
|
|
12103
12311
|
|
|
12104
12312
|
init(
|
|
12105
12313
|
this,
|
|
@@ -12108,10 +12316,18 @@ class Popover extends SvelteElement {
|
|
|
12108
12316
|
props: attribute_to_object(this.attributes),
|
|
12109
12317
|
customElement: true
|
|
12110
12318
|
},
|
|
12111
|
-
instance$
|
|
12112
|
-
create_fragment$
|
|
12319
|
+
instance$f,
|
|
12320
|
+
create_fragment$h,
|
|
12113
12321
|
safe_not_equal,
|
|
12114
|
-
{
|
|
12322
|
+
{
|
|
12323
|
+
testid: 0,
|
|
12324
|
+
maxwidth: 1,
|
|
12325
|
+
padded: 12,
|
|
12326
|
+
mt: 2,
|
|
12327
|
+
mr: 3,
|
|
12328
|
+
mb: 4,
|
|
12329
|
+
ml: 5
|
|
12330
|
+
},
|
|
12115
12331
|
null
|
|
12116
12332
|
);
|
|
12117
12333
|
|
|
@@ -12128,7 +12344,7 @@ class Popover extends SvelteElement {
|
|
|
12128
12344
|
}
|
|
12129
12345
|
|
|
12130
12346
|
static get observedAttributes() {
|
|
12131
|
-
return ["testid", "maxwidth", "padded"];
|
|
12347
|
+
return ["testid", "maxwidth", "padded", "mt", "mr", "mb", "ml"];
|
|
12132
12348
|
}
|
|
12133
12349
|
|
|
12134
12350
|
get testid() {
|
|
@@ -12150,13 +12366,49 @@ class Popover extends SvelteElement {
|
|
|
12150
12366
|
}
|
|
12151
12367
|
|
|
12152
12368
|
get padded() {
|
|
12153
|
-
return this.$$.ctx[
|
|
12369
|
+
return this.$$.ctx[12];
|
|
12154
12370
|
}
|
|
12155
12371
|
|
|
12156
12372
|
set padded(padded) {
|
|
12157
12373
|
this.$$set({ padded });
|
|
12158
12374
|
flush();
|
|
12159
12375
|
}
|
|
12376
|
+
|
|
12377
|
+
get mt() {
|
|
12378
|
+
return this.$$.ctx[2];
|
|
12379
|
+
}
|
|
12380
|
+
|
|
12381
|
+
set mt(mt) {
|
|
12382
|
+
this.$$set({ mt });
|
|
12383
|
+
flush();
|
|
12384
|
+
}
|
|
12385
|
+
|
|
12386
|
+
get mr() {
|
|
12387
|
+
return this.$$.ctx[3];
|
|
12388
|
+
}
|
|
12389
|
+
|
|
12390
|
+
set mr(mr) {
|
|
12391
|
+
this.$$set({ mr });
|
|
12392
|
+
flush();
|
|
12393
|
+
}
|
|
12394
|
+
|
|
12395
|
+
get mb() {
|
|
12396
|
+
return this.$$.ctx[4];
|
|
12397
|
+
}
|
|
12398
|
+
|
|
12399
|
+
set mb(mb) {
|
|
12400
|
+
this.$$set({ mb });
|
|
12401
|
+
flush();
|
|
12402
|
+
}
|
|
12403
|
+
|
|
12404
|
+
get ml() {
|
|
12405
|
+
return this.$$.ctx[5];
|
|
12406
|
+
}
|
|
12407
|
+
|
|
12408
|
+
set ml(ml) {
|
|
12409
|
+
this.$$set({ ml });
|
|
12410
|
+
flush();
|
|
12411
|
+
}
|
|
12160
12412
|
}
|
|
12161
12413
|
|
|
12162
12414
|
customElements.define("goa-popover", Popover);
|
|
@@ -12277,7 +12529,7 @@ function create_each_block$2(key_1, ctx) {
|
|
|
12277
12529
|
};
|
|
12278
12530
|
}
|
|
12279
12531
|
|
|
12280
|
-
function create_fragment$
|
|
12532
|
+
function create_fragment$g(ctx) {
|
|
12281
12533
|
let div;
|
|
12282
12534
|
let slot;
|
|
12283
12535
|
let t;
|
|
@@ -12352,7 +12604,7 @@ function create_fragment$f(ctx) {
|
|
|
12352
12604
|
};
|
|
12353
12605
|
}
|
|
12354
12606
|
|
|
12355
|
-
function instance$
|
|
12607
|
+
function instance$e($$self, $$props, $$invalidate) {
|
|
12356
12608
|
let isDisabled;
|
|
12357
12609
|
let isError;
|
|
12358
12610
|
const [Orientations, validateOrientation] = typeValidator("Radio group orientation", ["vertical", "horizontal"]);
|
|
@@ -12485,8 +12737,8 @@ class RadioGroup extends SvelteElement {
|
|
|
12485
12737
|
props: attribute_to_object(this.attributes),
|
|
12486
12738
|
customElement: true
|
|
12487
12739
|
},
|
|
12488
|
-
instance$
|
|
12489
|
-
create_fragment$
|
|
12740
|
+
instance$e,
|
|
12741
|
+
create_fragment$g,
|
|
12490
12742
|
safe_not_equal,
|
|
12491
12743
|
{
|
|
12492
12744
|
name: 1,
|
|
@@ -12636,7 +12888,7 @@ customElements.define("goa-radio-group", RadioGroup);
|
|
|
12636
12888
|
|
|
12637
12889
|
/* libs/web-components/src/components/scrollable/Scrollable.svelte generated by Svelte v3.51.0 */
|
|
12638
12890
|
|
|
12639
|
-
function create_fragment$
|
|
12891
|
+
function create_fragment$f(ctx) {
|
|
12640
12892
|
let div;
|
|
12641
12893
|
let slot;
|
|
12642
12894
|
let div_style_value;
|
|
@@ -12694,7 +12946,7 @@ function create_fragment$e(ctx) {
|
|
|
12694
12946
|
};
|
|
12695
12947
|
}
|
|
12696
12948
|
|
|
12697
|
-
function instance$
|
|
12949
|
+
function instance$d($$self, $$props, $$invalidate) {
|
|
12698
12950
|
let { direction = "vertical" } = $$props;
|
|
12699
12951
|
let { hpadding = "" } = $$props;
|
|
12700
12952
|
let { vpadding = "" } = $$props;
|
|
@@ -12765,8 +13017,8 @@ class Scrollable extends SvelteElement {
|
|
|
12765
13017
|
props: attribute_to_object(this.attributes),
|
|
12766
13018
|
customElement: true
|
|
12767
13019
|
},
|
|
12768
|
-
instance$
|
|
12769
|
-
create_fragment$
|
|
13020
|
+
instance$d,
|
|
13021
|
+
create_fragment$f,
|
|
12770
13022
|
safe_not_equal,
|
|
12771
13023
|
{
|
|
12772
13024
|
direction: 0,
|
|
@@ -13293,7 +13545,7 @@ function create_each_block$1(ctx) {
|
|
|
13293
13545
|
};
|
|
13294
13546
|
}
|
|
13295
13547
|
|
|
13296
|
-
function create_fragment$
|
|
13548
|
+
function create_fragment$e(ctx) {
|
|
13297
13549
|
let div;
|
|
13298
13550
|
let current_block_type_index;
|
|
13299
13551
|
let if_block;
|
|
@@ -13385,7 +13637,7 @@ function create_fragment$d(ctx) {
|
|
|
13385
13637
|
};
|
|
13386
13638
|
}
|
|
13387
13639
|
|
|
13388
|
-
function instance$
|
|
13640
|
+
function instance$c($$self, $$props, $$invalidate) {
|
|
13389
13641
|
const [Types, validateType] = typeValidator(
|
|
13390
13642
|
"Skeleton type",
|
|
13391
13643
|
[
|
|
@@ -13448,8 +13700,8 @@ class Skeleton extends SvelteElement {
|
|
|
13448
13700
|
props: attribute_to_object(this.attributes),
|
|
13449
13701
|
customElement: true
|
|
13450
13702
|
},
|
|
13451
|
-
instance$
|
|
13452
|
-
create_fragment$
|
|
13703
|
+
instance$c,
|
|
13704
|
+
create_fragment$e,
|
|
13453
13705
|
safe_not_equal,
|
|
13454
13706
|
{
|
|
13455
13707
|
maxwidth: 0,
|
|
@@ -13567,7 +13819,7 @@ customElements.define("goa-skeleton", Skeleton);
|
|
|
13567
13819
|
|
|
13568
13820
|
/* libs/web-components/src/components/spacer/Spacer.svelte generated by Svelte v3.51.0 */
|
|
13569
13821
|
|
|
13570
|
-
function create_fragment$
|
|
13822
|
+
function create_fragment$d(ctx) {
|
|
13571
13823
|
let div;
|
|
13572
13824
|
|
|
13573
13825
|
return {
|
|
@@ -13589,7 +13841,7 @@ function create_fragment$c(ctx) {
|
|
|
13589
13841
|
};
|
|
13590
13842
|
}
|
|
13591
13843
|
|
|
13592
|
-
function instance$
|
|
13844
|
+
function instance$b($$self, $$props, $$invalidate) {
|
|
13593
13845
|
let { hspacing = "none" } = $$props;
|
|
13594
13846
|
let { vspacing = "none" } = $$props;
|
|
13595
13847
|
let rootEl;
|
|
@@ -13630,8 +13882,8 @@ class Spacer extends SvelteElement {
|
|
|
13630
13882
|
props: attribute_to_object(this.attributes),
|
|
13631
13883
|
customElement: true
|
|
13632
13884
|
},
|
|
13633
|
-
instance$
|
|
13634
|
-
create_fragment$
|
|
13885
|
+
instance$b,
|
|
13886
|
+
create_fragment$d,
|
|
13635
13887
|
safe_not_equal,
|
|
13636
13888
|
{ hspacing: 1, vspacing: 2 },
|
|
13637
13889
|
null
|
|
@@ -13932,7 +14184,7 @@ function create_if_block$5(ctx) {
|
|
|
13932
14184
|
};
|
|
13933
14185
|
}
|
|
13934
14186
|
|
|
13935
|
-
function create_fragment$
|
|
14187
|
+
function create_fragment$c(ctx) {
|
|
13936
14188
|
let if_block_anchor;
|
|
13937
14189
|
let if_block = /*ready*/ ctx[6] && create_if_block$5(ctx);
|
|
13938
14190
|
|
|
@@ -13969,7 +14221,7 @@ function create_fragment$b(ctx) {
|
|
|
13969
14221
|
};
|
|
13970
14222
|
}
|
|
13971
14223
|
|
|
13972
|
-
function instance$
|
|
14224
|
+
function instance$a($$self, $$props, $$invalidate) {
|
|
13973
14225
|
let diameter;
|
|
13974
14226
|
let strokewidth;
|
|
13975
14227
|
let radius;
|
|
@@ -14088,8 +14340,8 @@ class Spinner extends SvelteElement {
|
|
|
14088
14340
|
props: attribute_to_object(this.attributes),
|
|
14089
14341
|
customElement: true
|
|
14090
14342
|
},
|
|
14091
|
-
instance$
|
|
14092
|
-
create_fragment$
|
|
14343
|
+
instance$a,
|
|
14344
|
+
create_fragment$c,
|
|
14093
14345
|
safe_not_equal,
|
|
14094
14346
|
{
|
|
14095
14347
|
size: 10,
|
|
@@ -14157,7 +14409,7 @@ customElements.define("goa-spinner", Spinner);
|
|
|
14157
14409
|
|
|
14158
14410
|
/* libs/web-components/src/components/table/Table.svelte generated by Svelte v3.51.0 */
|
|
14159
14411
|
|
|
14160
|
-
function create_fragment$
|
|
14412
|
+
function create_fragment$b(ctx) {
|
|
14161
14413
|
let table;
|
|
14162
14414
|
let slot;
|
|
14163
14415
|
let t0;
|
|
@@ -14217,7 +14469,7 @@ function create_fragment$a(ctx) {
|
|
|
14217
14469
|
};
|
|
14218
14470
|
}
|
|
14219
14471
|
|
|
14220
|
-
function instance$
|
|
14472
|
+
function instance$9($$self, $$props, $$invalidate) {
|
|
14221
14473
|
let _stickyHeader;
|
|
14222
14474
|
const [Variants, validateVariant] = typeValidator("Table variant", ["normal", "relaxed"], true);
|
|
14223
14475
|
let { width = "" } = $$props;
|
|
@@ -14321,7 +14573,7 @@ function instance$8($$self, $$props, $$invalidate) {
|
|
|
14321
14573
|
class Table extends SvelteElement {
|
|
14322
14574
|
constructor(options) {
|
|
14323
14575
|
super();
|
|
14324
|
-
this.shadowRoot.innerHTML = `<style>:host{overflow-x:auto}table{border-collapse:collapse}table.sticky{position:relative}table.sticky thead{position:sticky;top:0}td{font:var(--goa-typography-body-m);padding:0.75rem 1rem;border-bottom:1px solid var(--goa-color-greyscale-200)}table .goa-table-number-column{font:var(--goa-typography-number-m);text-align:right}table.relaxed td{padding:1rem}th{background-color:var(--goa-color-greyscale-white);color:var(--goa-color-text-secondary);padding:1rem;text-align:left;border-bottom:2px solid var(--goa-color-greyscale-
|
|
14576
|
+
this.shadowRoot.innerHTML = `<style>:host{overflow-x:auto}table{border-collapse:collapse}table.sticky{position:relative}table.sticky thead{position:sticky;top:0}td{font:var(--goa-typography-body-m);padding:0.75rem 1rem;border-bottom:1px solid var(--goa-color-greyscale-200)}table .goa-table-number-column{font:var(--goa-typography-number-m);text-align:right}table.relaxed td{padding:1rem}th{background-color:var(--goa-color-greyscale-white);color:var(--goa-color-text-secondary);padding:1rem;text-align:left;border-bottom:2px solid var(--goa-color-greyscale-600);vertical-align:bottom}th:has(goa-table-sort-header){padding:0}tfoot td{background-color:var(--goa-color-greyscale-100)}tfoot tr:first-child td{border-top:2px solid var(--goa-color-greyscale-200)}tfoot tr:last-child td{border-bottom:none}</style>`;
|
|
14325
14577
|
|
|
14326
14578
|
init(
|
|
14327
14579
|
this,
|
|
@@ -14330,8 +14582,8 @@ class Table extends SvelteElement {
|
|
|
14330
14582
|
props: attribute_to_object(this.attributes),
|
|
14331
14583
|
customElement: true
|
|
14332
14584
|
},
|
|
14333
|
-
instance$
|
|
14334
|
-
create_fragment$
|
|
14585
|
+
instance$9,
|
|
14586
|
+
create_fragment$b,
|
|
14335
14587
|
safe_not_equal,
|
|
14336
14588
|
{
|
|
14337
14589
|
width: 0,
|
|
@@ -14479,7 +14731,7 @@ function create_if_block$4(ctx) {
|
|
|
14479
14731
|
};
|
|
14480
14732
|
}
|
|
14481
14733
|
|
|
14482
|
-
function create_fragment$
|
|
14734
|
+
function create_fragment$a(ctx) {
|
|
14483
14735
|
let button;
|
|
14484
14736
|
let slot;
|
|
14485
14737
|
let t;
|
|
@@ -14528,7 +14780,7 @@ function create_fragment$9(ctx) {
|
|
|
14528
14780
|
};
|
|
14529
14781
|
}
|
|
14530
14782
|
|
|
14531
|
-
function instance$
|
|
14783
|
+
function instance$8($$self, $$props, $$invalidate) {
|
|
14532
14784
|
let { direction = "none" } = $$props;
|
|
14533
14785
|
|
|
14534
14786
|
$$self.$$set = $$props => {
|
|
@@ -14550,8 +14802,8 @@ class TableSortHeader extends SvelteElement {
|
|
|
14550
14802
|
props: attribute_to_object(this.attributes),
|
|
14551
14803
|
customElement: true
|
|
14552
14804
|
},
|
|
14553
|
-
instance$
|
|
14554
|
-
create_fragment$
|
|
14805
|
+
instance$8,
|
|
14806
|
+
create_fragment$a,
|
|
14555
14807
|
safe_not_equal,
|
|
14556
14808
|
{ direction: 0 },
|
|
14557
14809
|
null
|
|
@@ -14587,7 +14839,7 @@ customElements.define("goa-table-sort-header", TableSortHeader);
|
|
|
14587
14839
|
|
|
14588
14840
|
/* libs/web-components/src/components/text-area/TextArea.svelte generated by Svelte v3.51.0 */
|
|
14589
14841
|
|
|
14590
|
-
function create_fragment$
|
|
14842
|
+
function create_fragment$9(ctx) {
|
|
14591
14843
|
let div;
|
|
14592
14844
|
let textarea;
|
|
14593
14845
|
let textarea_aria_label_value;
|
|
@@ -14683,7 +14935,7 @@ function create_fragment$8(ctx) {
|
|
|
14683
14935
|
};
|
|
14684
14936
|
}
|
|
14685
14937
|
|
|
14686
|
-
function instance$
|
|
14938
|
+
function instance$7($$self, $$props, $$invalidate) {
|
|
14687
14939
|
let isError;
|
|
14688
14940
|
let isDisabled;
|
|
14689
14941
|
let isReadonly;
|
|
@@ -14789,8 +15041,8 @@ class TextArea extends SvelteElement {
|
|
|
14789
15041
|
props: attribute_to_object(this.attributes),
|
|
14790
15042
|
customElement: true
|
|
14791
15043
|
},
|
|
14792
|
-
instance$
|
|
14793
|
-
create_fragment$
|
|
15044
|
+
instance$7,
|
|
15045
|
+
create_fragment$9,
|
|
14794
15046
|
safe_not_equal,
|
|
14795
15047
|
{
|
|
14796
15048
|
name: 0,
|
|
@@ -14984,7 +15236,7 @@ customElements.define("goa-textarea", TextArea);
|
|
|
14984
15236
|
|
|
14985
15237
|
/* libs/web-components/src/layouts/FullScreenNavbarLayout.svelte generated by Svelte v3.51.0 */
|
|
14986
15238
|
|
|
14987
|
-
function create_fragment$
|
|
15239
|
+
function create_fragment$8(ctx) {
|
|
14988
15240
|
let div;
|
|
14989
15241
|
|
|
14990
15242
|
return {
|
|
@@ -15033,7 +15285,7 @@ class FullScreenNavbarLayout extends SvelteElement {
|
|
|
15033
15285
|
customElement: true
|
|
15034
15286
|
},
|
|
15035
15287
|
null,
|
|
15036
|
-
create_fragment$
|
|
15288
|
+
create_fragment$8,
|
|
15037
15289
|
safe_not_equal,
|
|
15038
15290
|
{},
|
|
15039
15291
|
null
|
|
@@ -15051,7 +15303,7 @@ customElements.define("goa-layout-full-nav", FullScreenNavbarLayout);
|
|
|
15051
15303
|
|
|
15052
15304
|
/* libs/web-components/src/layouts/one-column-layout/OneColumnLayout.svelte generated by Svelte v3.51.0 */
|
|
15053
15305
|
|
|
15054
|
-
function create_fragment$
|
|
15306
|
+
function create_fragment$7(ctx) {
|
|
15055
15307
|
let div;
|
|
15056
15308
|
|
|
15057
15309
|
return {
|
|
@@ -15092,7 +15344,7 @@ class OneColumnLayout extends SvelteElement {
|
|
|
15092
15344
|
customElement: true
|
|
15093
15345
|
},
|
|
15094
15346
|
null,
|
|
15095
|
-
create_fragment$
|
|
15347
|
+
create_fragment$7,
|
|
15096
15348
|
safe_not_equal,
|
|
15097
15349
|
{},
|
|
15098
15350
|
null
|
|
@@ -15110,7 +15362,7 @@ customElements.define("goa-one-column-layout", OneColumnLayout);
|
|
|
15110
15362
|
|
|
15111
15363
|
/* libs/web-components/src/layouts/two-column-layout/TwoColumnLayout.svelte generated by Svelte v3.51.0 */
|
|
15112
15364
|
|
|
15113
|
-
function create_fragment$
|
|
15365
|
+
function create_fragment$6(ctx) {
|
|
15114
15366
|
let div;
|
|
15115
15367
|
let header;
|
|
15116
15368
|
let t0;
|
|
@@ -15169,7 +15421,7 @@ function create_fragment$5(ctx) {
|
|
|
15169
15421
|
};
|
|
15170
15422
|
}
|
|
15171
15423
|
|
|
15172
|
-
function instance$
|
|
15424
|
+
function instance$6($$self, $$props, $$invalidate) {
|
|
15173
15425
|
let { navcolumnwidth = "" } = $$props;
|
|
15174
15426
|
let { maxcontentwidth = "" } = $$props;
|
|
15175
15427
|
|
|
@@ -15193,8 +15445,8 @@ class TwoColumnLayout extends SvelteElement {
|
|
|
15193
15445
|
props: attribute_to_object(this.attributes),
|
|
15194
15446
|
customElement: true
|
|
15195
15447
|
},
|
|
15196
|
-
instance$
|
|
15197
|
-
create_fragment$
|
|
15448
|
+
instance$6,
|
|
15449
|
+
create_fragment$6,
|
|
15198
15450
|
safe_not_equal,
|
|
15199
15451
|
{ navcolumnwidth: 0, maxcontentwidth: 1 },
|
|
15200
15452
|
null
|
|
@@ -15237,6 +15489,154 @@ class TwoColumnLayout extends SvelteElement {
|
|
|
15237
15489
|
|
|
15238
15490
|
customElements.define("goa-two-column-layout", TwoColumnLayout);
|
|
15239
15491
|
|
|
15492
|
+
/* libs/web-components/src/layouts/three-column-layout/ThreeColumnLayout.svelte generated by Svelte v3.51.0 */
|
|
15493
|
+
|
|
15494
|
+
function create_fragment$5(ctx) {
|
|
15495
|
+
let div;
|
|
15496
|
+
let header;
|
|
15497
|
+
let t0;
|
|
15498
|
+
let section;
|
|
15499
|
+
let t3;
|
|
15500
|
+
let footer;
|
|
15501
|
+
let div_style_value;
|
|
15502
|
+
|
|
15503
|
+
return {
|
|
15504
|
+
c() {
|
|
15505
|
+
div = element("div");
|
|
15506
|
+
header = element("header");
|
|
15507
|
+
header.innerHTML = `<slot name="header"></slot>`;
|
|
15508
|
+
t0 = space();
|
|
15509
|
+
section = element("section");
|
|
15510
|
+
|
|
15511
|
+
section.innerHTML = `<nav class="nav"><slot name="nav"></slot></nav>
|
|
15512
|
+
|
|
15513
|
+
<main><slot></slot></main>
|
|
15514
|
+
|
|
15515
|
+
<nav class="nav sidebar"><slot name="sidebar"></slot></nav>`;
|
|
15516
|
+
|
|
15517
|
+
t3 = space();
|
|
15518
|
+
footer = element("footer");
|
|
15519
|
+
footer.innerHTML = `<slot name="footer"></slot>`;
|
|
15520
|
+
this.c = noop;
|
|
15521
|
+
attr(header, "class", "header");
|
|
15522
|
+
attr(section, "class", "content");
|
|
15523
|
+
attr(footer, "class", "footer");
|
|
15524
|
+
attr(div, "class", "page");
|
|
15525
|
+
|
|
15526
|
+
attr(div, "style", div_style_value = `
|
|
15527
|
+
--max-content-width: ${/*maxcontentwidth*/ ctx[2] || "100%"};
|
|
15528
|
+
--nav-column-width: ${/*leftcolumnwidth*/ ctx[0] || "256px"};
|
|
15529
|
+
--sidebar-column-width: ${/*rightcolumnwidth*/ ctx[1] || "256px"}
|
|
15530
|
+
`);
|
|
15531
|
+
},
|
|
15532
|
+
m(target, anchor) {
|
|
15533
|
+
insert(target, div, anchor);
|
|
15534
|
+
append(div, header);
|
|
15535
|
+
append(div, t0);
|
|
15536
|
+
append(div, section);
|
|
15537
|
+
append(div, t3);
|
|
15538
|
+
append(div, footer);
|
|
15539
|
+
},
|
|
15540
|
+
p(ctx, [dirty]) {
|
|
15541
|
+
if (dirty & /*maxcontentwidth, leftcolumnwidth, rightcolumnwidth*/ 7 && div_style_value !== (div_style_value = `
|
|
15542
|
+
--max-content-width: ${/*maxcontentwidth*/ ctx[2] || "100%"};
|
|
15543
|
+
--nav-column-width: ${/*leftcolumnwidth*/ ctx[0] || "256px"};
|
|
15544
|
+
--sidebar-column-width: ${/*rightcolumnwidth*/ ctx[1] || "256px"}
|
|
15545
|
+
`)) {
|
|
15546
|
+
attr(div, "style", div_style_value);
|
|
15547
|
+
}
|
|
15548
|
+
},
|
|
15549
|
+
i: noop,
|
|
15550
|
+
o: noop,
|
|
15551
|
+
d(detaching) {
|
|
15552
|
+
if (detaching) detach(div);
|
|
15553
|
+
}
|
|
15554
|
+
};
|
|
15555
|
+
}
|
|
15556
|
+
|
|
15557
|
+
function instance$5($$self, $$props, $$invalidate) {
|
|
15558
|
+
let { leftcolumnwidth } = $$props;
|
|
15559
|
+
let { rightcolumnwidth } = $$props;
|
|
15560
|
+
let { maxcontentwidth } = $$props;
|
|
15561
|
+
|
|
15562
|
+
$$self.$$set = $$props => {
|
|
15563
|
+
if ('leftcolumnwidth' in $$props) $$invalidate(0, leftcolumnwidth = $$props.leftcolumnwidth);
|
|
15564
|
+
if ('rightcolumnwidth' in $$props) $$invalidate(1, rightcolumnwidth = $$props.rightcolumnwidth);
|
|
15565
|
+
if ('maxcontentwidth' in $$props) $$invalidate(2, maxcontentwidth = $$props.maxcontentwidth);
|
|
15566
|
+
};
|
|
15567
|
+
|
|
15568
|
+
return [leftcolumnwidth, rightcolumnwidth, maxcontentwidth];
|
|
15569
|
+
}
|
|
15570
|
+
|
|
15571
|
+
class ThreeColumnLayout extends SvelteElement {
|
|
15572
|
+
constructor(options) {
|
|
15573
|
+
super();
|
|
15574
|
+
this.shadowRoot.innerHTML = `<style>*{box-sizing:border-box}.page{min-height:100vh;display:flex;flex-direction:column;position:relative}.content{flex:1 1 auto;position:relative;display:flex;flex-direction:column;gap:2rem}.header,.footer{flex:0 0 auto}main{flex:1 1 auto;padding:0 1rem}.nav{padding:0 1rem;transition:transform 200ms ease-in-out;background-color:var(--goa-color-greyscale-white)}.nav>*{display:block;padding:0.5rem 0}@media(min-width: 640px){.page{gap:2rem}.content{display:flex;flex-direction:row;justify-content:center;width:min(var(--max-content-width), 100vw);margin:0 auto}.nav{padding:0 2rem;transform:translateX(0)}.nav:not(.sidebar){flex:0 0 var(--nav-column-width)}.nav.sidebar{flex:0 0 var(--sidebar-column-width)}main{padding-right:2rem}}@media(min-width: 1300px){main{padding-right:4.5rem}}</style>`;
|
|
15575
|
+
|
|
15576
|
+
init(
|
|
15577
|
+
this,
|
|
15578
|
+
{
|
|
15579
|
+
target: this.shadowRoot,
|
|
15580
|
+
props: attribute_to_object(this.attributes),
|
|
15581
|
+
customElement: true
|
|
15582
|
+
},
|
|
15583
|
+
instance$5,
|
|
15584
|
+
create_fragment$5,
|
|
15585
|
+
safe_not_equal,
|
|
15586
|
+
{
|
|
15587
|
+
leftcolumnwidth: 0,
|
|
15588
|
+
rightcolumnwidth: 1,
|
|
15589
|
+
maxcontentwidth: 2
|
|
15590
|
+
},
|
|
15591
|
+
null
|
|
15592
|
+
);
|
|
15593
|
+
|
|
15594
|
+
if (options) {
|
|
15595
|
+
if (options.target) {
|
|
15596
|
+
insert(options.target, this, options.anchor);
|
|
15597
|
+
}
|
|
15598
|
+
|
|
15599
|
+
if (options.props) {
|
|
15600
|
+
this.$set(options.props);
|
|
15601
|
+
flush();
|
|
15602
|
+
}
|
|
15603
|
+
}
|
|
15604
|
+
}
|
|
15605
|
+
|
|
15606
|
+
static get observedAttributes() {
|
|
15607
|
+
return ["leftcolumnwidth", "rightcolumnwidth", "maxcontentwidth"];
|
|
15608
|
+
}
|
|
15609
|
+
|
|
15610
|
+
get leftcolumnwidth() {
|
|
15611
|
+
return this.$$.ctx[0];
|
|
15612
|
+
}
|
|
15613
|
+
|
|
15614
|
+
set leftcolumnwidth(leftcolumnwidth) {
|
|
15615
|
+
this.$$set({ leftcolumnwidth });
|
|
15616
|
+
flush();
|
|
15617
|
+
}
|
|
15618
|
+
|
|
15619
|
+
get rightcolumnwidth() {
|
|
15620
|
+
return this.$$.ctx[1];
|
|
15621
|
+
}
|
|
15622
|
+
|
|
15623
|
+
set rightcolumnwidth(rightcolumnwidth) {
|
|
15624
|
+
this.$$set({ rightcolumnwidth });
|
|
15625
|
+
flush();
|
|
15626
|
+
}
|
|
15627
|
+
|
|
15628
|
+
get maxcontentwidth() {
|
|
15629
|
+
return this.$$.ctx[2];
|
|
15630
|
+
}
|
|
15631
|
+
|
|
15632
|
+
set maxcontentwidth(maxcontentwidth) {
|
|
15633
|
+
this.$$set({ maxcontentwidth });
|
|
15634
|
+
flush();
|
|
15635
|
+
}
|
|
15636
|
+
}
|
|
15637
|
+
|
|
15638
|
+
customElements.define("goa-three-column-layout", ThreeColumnLayout);
|
|
15639
|
+
|
|
15240
15640
|
/* libs/web-components/src/components/form-stepper/FormStepper.svelte generated by Svelte v3.51.0 */
|
|
15241
15641
|
|
|
15242
15642
|
function create_if_block$3(ctx) {
|
|
@@ -15651,7 +16051,7 @@ function create_else_block$1(ctx) {
|
|
|
15651
16051
|
};
|
|
15652
16052
|
}
|
|
15653
16053
|
|
|
15654
|
-
// (
|
|
16054
|
+
// (158:38)
|
|
15655
16055
|
function create_if_block_3$2(ctx) {
|
|
15656
16056
|
let goa_icon;
|
|
15657
16057
|
|
|
@@ -15670,7 +16070,7 @@ function create_if_block_3$2(ctx) {
|
|
|
15670
16070
|
};
|
|
15671
16071
|
}
|
|
15672
16072
|
|
|
15673
|
-
// (
|
|
16073
|
+
// (156:36)
|
|
15674
16074
|
function create_if_block_2$2(ctx) {
|
|
15675
16075
|
let goa_icon;
|
|
15676
16076
|
|
|
@@ -15690,7 +16090,7 @@ function create_if_block_2$2(ctx) {
|
|
|
15690
16090
|
};
|
|
15691
16091
|
}
|
|
15692
16092
|
|
|
15693
|
-
// (
|
|
16093
|
+
// (154:4) {#if _isCurrent}
|
|
15694
16094
|
function create_if_block_1$2(ctx) {
|
|
15695
16095
|
let goa_icon;
|
|
15696
16096
|
|
|
@@ -15709,7 +16109,7 @@ function create_if_block_1$2(ctx) {
|
|
|
15709
16109
|
};
|
|
15710
16110
|
}
|
|
15711
16111
|
|
|
15712
|
-
// (
|
|
16112
|
+
// (166:4) {#if status === "incomplete"}
|
|
15713
16113
|
function create_if_block$2(ctx) {
|
|
15714
16114
|
let div;
|
|
15715
16115
|
|
|
@@ -15732,7 +16132,7 @@ function create_if_block$2(ctx) {
|
|
|
15732
16132
|
function create_fragment$3(ctx) {
|
|
15733
16133
|
let label;
|
|
15734
16134
|
let input;
|
|
15735
|
-
let
|
|
16135
|
+
let input_aria_disabled_value;
|
|
15736
16136
|
let t0;
|
|
15737
16137
|
let div0;
|
|
15738
16138
|
let t1;
|
|
@@ -15772,7 +16172,7 @@ function create_fragment$3(ctx) {
|
|
|
15772
16172
|
attr(input, "id", /*text*/ ctx[0]);
|
|
15773
16173
|
attr(input, "type", "checkbox");
|
|
15774
16174
|
input.checked = /*_isCurrent*/ ctx[7];
|
|
15775
|
-
input
|
|
16175
|
+
attr(input, "aria-disabled", input_aria_disabled_value = !/*_isEnabled*/ ctx[6]);
|
|
15776
16176
|
attr(div0, "data-testid", "status");
|
|
15777
16177
|
attr(div0, "class", "status");
|
|
15778
16178
|
attr(div1, "class", "text");
|
|
@@ -15811,8 +16211,8 @@ function create_fragment$3(ctx) {
|
|
|
15811
16211
|
input.checked = /*_isCurrent*/ ctx[7];
|
|
15812
16212
|
}
|
|
15813
16213
|
|
|
15814
|
-
if (dirty & /*_isEnabled*/ 64 &&
|
|
15815
|
-
input
|
|
16214
|
+
if (dirty & /*_isEnabled*/ 64 && input_aria_disabled_value !== (input_aria_disabled_value = !/*_isEnabled*/ ctx[6])) {
|
|
16215
|
+
attr(input, "aria-disabled", input_aria_disabled_value);
|
|
15816
16216
|
}
|
|
15817
16217
|
|
|
15818
16218
|
if (current_block_type === (current_block_type = select_block_type(ctx)) && if_block0) {
|
|
@@ -15964,7 +16364,7 @@ class FormStep extends SvelteElement {
|
|
|
15964
16364
|
constructor(options) {
|
|
15965
16365
|
super();
|
|
15966
16366
|
|
|
15967
|
-
this.shadowRoot.innerHTML = `<style>input[type=checkbox]{position:absolute;left:-9999px}[role="listitem"]{display:flex;box-sizing:border-box;height:100%;text-align:center;flex-direction:column;align-items:center;padding:var(--goa-space-l)}[role="listitem"]:not([aria-disabled="true"]):focus-within,[role="listitem"]:not([aria-disabled="true"]):focus,[role="listitem"]:not([aria-disabled="true"]):active{outline:var(--goa-color-interactive-focus) solid var(--goa-border-width-l)}[role="listitem"]:not([aria-disabled="true"]):hover{background-color:rgba(0,0,0,0.05);cursor:pointer}.status{flex:0 0 auto;display:flex;align-items:center;justify-content:center;box-sizing:border-box;border-radius:999px;border:4px solid var(--goa-color-interactive-default);background:var(--goa-color-greyscale-white);height:2.5rem;width:2.5rem}[aria-current="step"] .text{font-weight:var(--goa-font-weight-bold)
|
|
16367
|
+
this.shadowRoot.innerHTML = `<style>input[type=checkbox]{position:absolute;left:-9999px}[role="listitem"]{display:flex;box-sizing:border-box;height:100%;text-align:center;flex-direction:column;align-items:center;padding:var(--goa-space-l)}[role="listitem"]:not([aria-disabled="true"]):not([aria-current="step"]):focus-within,[role="listitem"]:not([aria-disabled="true"]):not([aria-current="step"]):focus,[role="listitem"]:not([aria-disabled="true"]):not([aria-current="step"]):active{outline:var(--goa-color-interactive-focus) solid var(--goa-border-width-l)}[role="listitem"]:not([aria-disabled="true"]):not([aria-current="step"]):hover{background-color:rgba(0,0,0,0.05);cursor:pointer}.status{flex:0 0 auto;display:flex;align-items:center;justify-content:center;box-sizing:border-box;border-radius:999px;border:4px solid var(--goa-color-interactive-default);background:var(--goa-color-greyscale-white);height:2.5rem;width:2.5rem}.status>*{fill:var(--fill-color, var(--goa-color-interactive-default));color:var(--fill-color, var(--goa-color-interactive-default))}[aria-current="step"] .text{font-weight:var(--goa-font-weight-bold)
|
|
15968
16368
|
}[data-status=complete] .status{background:var(--goa-color-interactive-default)}[aria-current="step"][data-status=complete] .status{background:var(--goa-color-greyscale-white)}.step-number{margin-bottom:var(--font-valign-fix);font-weight:var(--goa-font-weight-bold);color:var(--goa-color-text-secondary)}[role="listitem"]:not(
|
|
15969
16369
|
[data-status=complete],
|
|
15970
16370
|
[data-status=incomplete],
|