@abgov/react-components 3.4.0-beta.29 → 3.4.0-beta.32
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/experimental/experimental/form/form.row.d.ts +2 -0
- package/experimental/experimental/form/index.d.ts +2 -0
- package/experimental/experimental/form/validators.d.ts +10 -2
- package/experimental/experimental/input/input.component.d.ts +1 -1
- package/experimental/react-components.esm.js +9 -8
- package/experimental/react-components.umd.js +9 -8
- package/index.d.ts +2 -1
- package/lib/radio-group/radio-group.d.ts +2 -2
- package/lib/radio-group/radio.d.ts +2 -2
- package/package.json +1 -1
- package/react-components.esm.js +79 -67
- package/react-components.umd.js +79 -67
- package/lib/_common/errorState.d.ts +0 -5
package/react-components.umd.js
CHANGED
|
@@ -34,9 +34,12 @@
|
|
|
34
34
|
}
|
|
35
35
|
}
|
|
36
36
|
|
|
37
|
-
var css_248z = "
|
|
37
|
+
var css_248z = ":root {\n --color-white: #fff;\n --color-black: #333;\n --color-gray-l5: #f1f1f1;\n --color-gray-l2: #adadad;\n --color-gray-l1: #dcdcdc;\n --color-gray-d1: #666;\n --color-gray-d3: #333;\n --color-orange: #feba35;\n --color-red: #ec040b;\n --color-green: hsl(148, 100%, 26%);\n --color-primary: #0070c4;\n --color-primary-d1: #004f84;\n --color-primary--hover: var(--color-primary-d1);\n --color-text: var(--color-gray-d3);\n --color-error: var(--color-red);\n --color-disabled: var(--color-gray-l2);\n --color-input-background: var(--color-white);\n --color-input-border: var(--color-gray-d1);\n --color-input-border--hover: var(--color-primary-d1);\n --color-input: var(--color-gray-d3);\n --color-input--focused: var(--color-orange);\n --color-button-primary: var(--color-primary);\n --color-button-primary--hover: var(--color-primary-d1);\n --color-button-tertiary: var(--color-gray-l2);\n --color-button-tertiary--hover: var(--color-gray-l5); }\n\n:root {\n /* font-size */\n --fs-xs: 0.75rem;\n --fs-sm: 0.875rem;\n --fs-base: 1.125rem;\n --fs-lg: 1.25rem;\n --fs-xl: 1.5rem;\n --fs-2xl: 2.25rem;\n --fs-3xl: 3rem;\n /* font-weight */\n --fw-thin: 100;\n --fw-light: 300;\n --fw-regular: 400;\n --fw-medium: 500;\n --fw-bold: 700;\n --fw-black: 900;\n --input-padding: 0.5rem;\n --input-border-radius: 0.25rem;\n --input-font-size: var(--fs-base); }\n\nbody,\ninput,\nbutton,\ntextarea {\n background: #fff;\n font-family: acumin-pro-semi-condensed, sans-serif;\n font-weight: 400;\n font-size: var(--fs-base);\n color: #333; }\n\nbody {\n margin: 0; }\n\n*,\n*:before,\n*:after {\n box-sizing: border-box; }\n\np {\n margin: 0;\n margin-bottom: 1rem; }\n\nhr {\n border-width: 0;\n border-top: 1px solid #ccc;\n padding: 0;\n margin: 0; }\n\nem {\n font-size: var(--fs-xs);\n color: var(--color-gray-l1); }\n\nul,\nol {\n padding-left: 0; }\n\nli > ul,\nli > ol,\nli > ul,\nli > ol {\n padding-left: 0;\n margin-top: 0; }\n\na {\n color: var(--color-primary);\n cursor: pointer; }\n\na:hover {\n color: var(--color-primary--hover); }\n\na:focus {\n outline-width: thin;\n outline-style: solid;\n outline-color: var(--color-primary-d1);\n outline-offset: 0px; }\n\n::-moz-placeholder {\n /* Chrome, Firefox, Opera, Safari 10.1+ */\n color: #999;\n opacity: 1;\n /* Firefox */ }\n\n:-ms-input-placeholder {\n /* Chrome, Firefox, Opera, Safari 10.1+ */\n color: #999;\n opacity: 1;\n /* Firefox */ }\n\n::placeholder {\n /* Chrome, Firefox, Opera, Safari 10.1+ */\n color: #999;\n opacity: 1;\n /* Firefox */ }\n\n:-ms-input-placeholder {\n /* Internet Explorer 10-11 */\n color: #999; }\n\n::-ms-input-placeholder {\n /* Microsoft Edge */\n color: #999; }\n";
|
|
38
38
|
styleInject(css_248z);
|
|
39
39
|
|
|
40
|
+
var css_248z$1 = "/* typekit ***/\n/* This style is from the alberta design system */\n@import url(\"https://p.typekit.net/p.css?s=1&k=nur5yta&ht=tk&f=26036.26037.26044.26046.26047&a=14638192&app=typekit&e=css\");\n@font-face {\n font-family: 'acumin-pro-semi-condensed';\n src: url(\"https://use.typekit.net/af/3f7b4d/00000000000000003b9acb2d/27/l?subset_id=1&fvd=n4&v=3\") format(\"woff2\"), url(\"https://use.typekit.net/af/3f7b4d/00000000000000003b9acb2d/27/d?subset_id=1&fvd=n4&v=3\") format(\"woff\"), url(\"https://use.typekit.net/af/3f7b4d/00000000000000003b9acb2d/27/a?subset_id=1&fvd=n4&v=3\") format(\"opentype\");\n font-style: normal;\n font-weight: 400; }\n\n@font-face {\n font-family: 'acumin-pro-semi-condensed';\n src: url(\"https://use.typekit.net/af/761912/00000000000000003b9acb2e/27/l?subset_id=1&fvd=i4&v=3\") format(\"woff2\"), url(\"https://use.typekit.net/af/761912/00000000000000003b9acb2e/27/d?subset_id=1&fvd=i4&v=3\") format(\"woff\"), url(\"https://use.typekit.net/af/761912/00000000000000003b9acb2e/27/a?subset_id=1&fvd=i4&v=3\") format(\"opentype\");\n font-style: italic;\n font-weight: 400; }\n\n@font-face {\n font-family: 'acumin-pro-semi-condensed';\n src: url(\"https://use.typekit.net/af/ee7f3d/00000000000000003b9acb33/27/l?subset_id=1&fvd=n7&v=3\") format(\"woff2\"), url(\"https://use.typekit.net/af/ee7f3d/00000000000000003b9acb33/27/d?subset_id=1&fvd=n7&v=3\") format(\"woff\"), url(\"https://use.typekit.net/af/ee7f3d/00000000000000003b9acb33/27/a?subset_id=1&fvd=n7&v=3\") format(\"opentype\");\n font-style: normal;\n font-weight: 700; }\n\n@font-face {\n font-family: 'acumin-pro-semi-condensed';\n src: url(\"https://use.typekit.net/af/503f80/00000000000000003b9acb34/27/l?subset_id=1&fvd=i7&v=3\") format(\"woff2\"), url(\"https://use.typekit.net/af/503f80/00000000000000003b9acb34/27/d?subset_id=1&fvd=i7&v=3\") format(\"woff\"), url(\"https://use.typekit.net/af/503f80/00000000000000003b9acb34/27/a?subset_id=1&fvd=i7&v=3\") format(\"opentype\");\n font-style: italic;\n font-weight: 700; }\n\n@font-face {\n font-family: 'acumin-pro-semi-condensed';\n src: url(\"https://use.typekit.net/af/e60e87/00000000000000003b9acb31/27/l?subset_id=1&fvd=n6&v=3\") format(\"woff2\"), url(\"https://use.typekit.net/af/e60e87/00000000000000003b9acb31/27/d?subset_id=1&fvd=n6&v=3\") format(\"woff\"), url(\"https://use.typekit.net/af/e60e87/00000000000000003b9acb31/27/a?subset_id=1&fvd=n6&v=3\") format(\"opentype\");\n font-style: normal;\n font-weight: 600; }\n";
|
|
41
|
+
styleInject(css_248z$1);
|
|
42
|
+
|
|
40
43
|
function _defineProperty(obj, key, value) {
|
|
41
44
|
if (key in obj) {
|
|
42
45
|
Object.defineProperty(obj, key, {
|
|
@@ -1299,8 +1302,8 @@
|
|
|
1299
1302
|
}
|
|
1300
1303
|
});
|
|
1301
1304
|
|
|
1302
|
-
var css_248z$
|
|
1303
|
-
styleInject(css_248z$
|
|
1305
|
+
var css_248z$2 = "/* Palette */\n/* Semantic usages */\n.goa-callout {\n box-sizing: border-box;\n display: inline-block;\n position: relative;\n width: 100%;\n margin: 24px 0 0;\n padding: 23px 24px 23px 24px;\n border-width: 0;\n border-left-width: 48px;\n border-style: solid;\n border-color: #0070c4;\n background: #f1f1f1;\n /* variants ***/ }\n .goa-callout *:first-child {\n margin-top: 0; }\n .goa-callout *:last-child {\n margin-bottom: 0; }\n .goa-callout.goa--important {\n border-color: #feba35; }\n .goa-callout.goa--emergency {\n border-color: #EC040B; }\n .goa-callout.goa--error {\n border-color: #EC040B; }\n .goa-callout.goa--success {\n border-color: #00853f; }\n .goa-callout:before {\n position: absolute;\n top: 28px;\n left: -36px;\n width: 24px;\n height: 24px;\n content: '';\n background-image: url(\"data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='%23fff' d='M12,1A11,11,0,1,0,23,12,11,11,0,0,0,12,1Zm0,20a9,9,0,1,1,9-9A9,9,0,0,1,12,21Z'/%3E%3Cpath fill='%23fff' d='M15.16,15.5h-2V9a1,1,0,0,0-1-1H9.82a1,1,0,0,0,0,2h1.36V15.5h-2a1,1,0,1,0,0,2h6a1,1,0,0,0,0-2Z'/%3E%3Cpath fill='%23fff' d='M12,7.33A1.29,1.29,0,1,0,10.73,6,1.29,1.29,0,0,0,12,7.33Z'/%3E%3C/svg%3E\");\n background-color: transparent;\n background-repeat: no-repeat;\n background-position: center center; }\n .goa-callout.goa--emergency:before {\n background-image: url(\"data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='%23fff' d='M11,9.41v4.52a1,1,0,0,0,2,0V9.41a1,1,0,0,0-2,0Z'/%3E%3Cpath fill='%23fff' d='M12,16.15a1.29,1.29,0,1,0,1.29,1.29A1.29,1.29,0,0,0,12,16.15Z'/%3E%3Cpath fill='%23fff' d='M22.87,20.14l-10-17.32a1,1,0,0,0-1.74,0l-10,17.32a1,1,0,0,0,0,1,1,1,0,0,0,.87.5H22a1,1,0,0,0,.87-.5A1,1,0,0,0,22.87,20.14Zm-19.14-.5L12,5.32l8.27,14.32Z'/%3E%3C/svg%3E\");\n background-color: transparent;\n background-repeat: no-repeat;\n background-position: center center; }\n .goa-callout.goa--error:before {\n background-image: url('data:image/svg+xml,<svg xmlns=\"http://www.w3.org/2000/svg\" width=\"24\" height=\"24\" viewBox=\"0 0 24 24\"><defs><style>.a{fill:none;}.b{fill:white;}</style></defs><rect class=\"a\" width=\"24\" height=\"24\"/><path class=\"b\" d=\"M48.1,23a11,11,0,1,0-11-11A10.968,10.968,0,0,0,48.1,23Zm0-20a9,9,0,1,1-9,9A8.963,8.963,0,0,1,48.1,3Z\" transform=\"translate(-36)\"/><path class=\"b\" d=\"M43.6,16.4a.967.967,0,0,0,1.4,0l3-3,3,3a.967.967,0,0,0,1.4,0,.967.967,0,0,0,0-1.4l-3-3,3-3A.99.99,0,0,0,51,7.6l-3,3-3-3A.99.99,0,0,0,43.6,9l3,3-3,3A1.2,1.2,0,0,0,43.6,16.4Z\" transform=\"translate(-36)\"/></svg>');\n background-repeat: no-repeat;\n background-size: contain;\n background-position: center center; }\n .goa-callout.goa--important:before {\n background-image: url(\"data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='%23000' d='M12,1A11,11,0,1,0,23,12,11,11,0,0,0,12,1Zm0,20a9,9,0,1,1,9-9A9,9,0,0,1,12,21Z'/%3E%3Cpath fill='%23000' d='M12,14.46a1,1,0,0,0,1-1V6.57a1,1,0,0,0-2,0v6.89A1,1,0,0,0,12,14.46Z'/%3E%3Cpath fill='%23000' d='M12,15.68A1.29,1.29,0,1,0,13.29,17,1.29,1.29,0,0,0,12,15.68Z'/%3E%3C/svg%3E\");\n background-color: transparent;\n background-repeat: no-repeat;\n background-position: center center; }\n .goa-callout.goa--event:before {\n background-image: url(\"data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='%23fff' d='M3.27,22.85H20.73a2.14,2.14,0,0,0,2.14-2.14V5A2.14,2.14,0,0,0,20.73,2.9h-2.1v2h2.1a.14.14,0,0,1,.14.14V8.31H3.13V5a.14.14,0,0,1,.14-.14H5.48V6.28a1,1,0,1,0,2,0V1.85a1,1,0,1,0-2,0v1H3.27A2.14,2.14,0,0,0,1.13,5V20.71A2.14,2.14,0,0,0,3.27,22.85Zm17.6-12.54v10.4a.14.14,0,0,1-.14.14H3.27a.14.14,0,0,1-.14-.14V10.31Z'/%3E%3Cpath fill='%23fff' d='M16.45,7.28a1,1,0,0,0,1-1V1.85a1,1,0,0,0-2,0v1h-1.8v2h1.8V6.28A1,1,0,0,0,16.45,7.28Z'/%3E%3Cpath fill='%23fff' d='M11.47,7.28a1,1,0,0,0,1-1V1.85a1,1,0,1,0-2,0v1H8.66v2h1.81V6.28A1,1,0,0,0,11.47,7.28Z'/%3E%3Crect fill='%23fff' x='6.67' y='11.52' width='2.33' height='2.33'/%3E%3Crect fill='%23fff' x='11.22' y='11.52' width='2.33' height='2.33'/%3E%3Crect fill='%23fff' x='15.77' y='11.52' width='2.33' height='2.33'/%3E%3Crect fill='%23fff' x='3.64' y='15.83' width='2.33' height='2.33'/%3E%3Crect fill='%23fff' x='8.19' y='15.83' width='2.33' height='2.33'/%3E%3Crect fill='%23fff' x='12.74' y='15.83' width='2.33' height='2.33'/%3E%3C/svg%3E\");\n background-color: transparent;\n background-repeat: no-repeat;\n background-position: center center; }\n .goa-callout.goa--event:before {\n background-image: url(\"data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='%23fff' d='M3.27,22.85H20.73a2.14,2.14,0,0,0,2.14-2.14V5A2.14,2.14,0,0,0,20.73,2.9h-2.1v2h2.1a.14.14,0,0,1,.14.14V8.31H3.13V5a.14.14,0,0,1,.14-.14H5.48V6.28a1,1,0,1,0,2,0V1.85a1,1,0,1,0-2,0v1H3.27A2.14,2.14,0,0,0,1.13,5V20.71A2.14,2.14,0,0,0,3.27,22.85Zm17.6-12.54v10.4a.14.14,0,0,1-.14.14H3.27a.14.14,0,0,1-.14-.14V10.31Z'/%3E%3Cpath fill='%23fff' d='M16.45,7.28a1,1,0,0,0,1-1V1.85a1,1,0,0,0-2,0v1h-1.8v2h1.8V6.28A1,1,0,0,0,16.45,7.28Z'/%3E%3Cpath fill='%23fff' d='M11.47,7.28a1,1,0,0,0,1-1V1.85a1,1,0,1,0-2,0v1H8.66v2h1.81V6.28A1,1,0,0,0,11.47,7.28Z'/%3E%3Crect fill='%23fff' x='6.67' y='11.52' width='2.33' height='2.33'/%3E%3Crect fill='%23fff' x='11.22' y='11.52' width='2.33' height='2.33'/%3E%3Crect fill='%23fff' x='15.77' y='11.52' width='2.33' height='2.33'/%3E%3Crect fill='%23fff' x='3.64' y='15.83' width='2.33' height='2.33'/%3E%3Crect fill='%23fff' x='8.19' y='15.83' width='2.33' height='2.33'/%3E%3Crect fill='%23fff' x='12.74' y='15.83' width='2.33' height='2.33'/%3E%3C/svg%3E\");\n background-color: transparent;\n background-repeat: no-repeat;\n background-position: center center; }\n .goa-callout.goa--success:before {\n background-image: url('data:image/svg+xml,<svg xmlns=\"http://www.w3.org/2000/svg\" width=\"24\" height=\"24\" viewBox=\"0 0 24 24\"><defs><style>.a{fill:none;}.b{fill:white;}</style></defs><g transform=\"translate(-23 -68)\"><rect class=\"a\" width=\"24\" height=\"24\" transform=\"translate(23 68)\"/><path class=\"b\" d=\"M12,23A11,11,0,1,0,1,12,10.968,10.968,0,0,0,12,23ZM12,3a9,9,0,1,1-9,9A8.963,8.963,0,0,1,12,3Z\" transform=\"translate(23 68)\"/><path class=\"b\" d=\"M10.9,16.4a.908.908,0,0,0,.7.3h.1a.842.842,0,0,0,.7-.4L17.6,9a.913.913,0,0,0-.2-1.4,1,1,0,0,0-1.4.3l-4.5,6.3L8,10.5a.99.99,0,0,0-1.4,1.4Z\" transform=\"translate(23 68)\"/></g></svg>');\n background-repeat: no-repeat;\n background-size: contain;\n background-position: center center; }\n .goa-callout .messages {\n margin-bottom: 0;\n margin-top: 1em; }\n";
|
|
1306
|
+
styleInject(css_248z$2);
|
|
1304
1307
|
|
|
1305
1308
|
var GoACallout = function GoACallout(_ref) {
|
|
1306
1309
|
var title = _ref.title,
|
|
@@ -1326,12 +1329,12 @@
|
|
|
1326
1329
|
content: propTypes.string
|
|
1327
1330
|
};
|
|
1328
1331
|
|
|
1329
|
-
var css_248z$
|
|
1330
|
-
styleInject(css_248z$2);
|
|
1331
|
-
|
|
1332
|
-
var css_248z$3 = ".goa-notifications .title {\n position: absolute;\n overflow: hidden;\n clip: rect(1px, 1px, 1px, 1px);\n left: -10px;\n width: 1px;\n height: 1px;\n white-space: nowrap; }\n\n.goa-notifications ul {\n box-sizing: border-box;\n display: inline-block;\n width: 100%;\n margin: 0;\n padding: 0;\n list-style-type: none; }\n .goa-notifications ul li {\n box-sizing: border-box;\n display: block;\n width: 100%;\n margin: 0;\n padding: 0; }\n";
|
|
1332
|
+
var css_248z$3 = "/* Palette */\n/* Semantic usages */\n.goa-notification {\n box-sizing: border-box;\n display: inline-block;\n position: relative;\n width: 100%;\n padding-left: 72px;\n padding-right: 72px;\n color: #fff;\n background: #0070c4;\n /* variants ***/ }\n .goa-notification.dismissed {\n display: none; }\n @media screen and (min-width: 768px) and (max-width: 1199px) {\n .goa-notification {\n padding-left: 24px;\n padding-right: 24px; } }\n @media screen and (max-width: 767px) {\n .goa-notification {\n padding-left: 24px;\n padding-right: 24px; } }\n .goa-notification .content {\n box-sizing: border-box;\n display: flex;\n width: 100%;\n margin: 0;\n position: relative;\n padding: 0 36px; }\n .goa-notification .content .message {\n flex: 1 0 0;\n box-sizing: border-box;\n min-height: 56px;\n padding: 28px 0; }\n .goa-notification .content .close {\n flex: 0 1 auto;\n color: #fff; }\n .goa-notification a {\n color: #fff; }\n .goa-notification a:hover, .goa-notification a:focus {\n color: #fff;\n text-decoration: none; }\n .goa-notification.goa--event {\n background-color: #00853f; }\n .goa-notification.goa--important {\n background-color: #feba35; }\n .goa-notification.goa--important .message {\n color: #333; }\n .goa-notification.goa--important a {\n color: #333; }\n .goa-notification.goa--important a:hover, .goa-notification.goa--important a:focus {\n color: #333; }\n .goa-notification.goa--emergency {\n background-color: #EC040B; }\n .goa-notification .close {\n align-self: center;\n position: absolute;\n right: 12px;\n cursor: pointer; }\n .goa-notification .close svg {\n fill: #fff;\n color: #fff; }\n .goa-notification .content:before {\n position: absolute;\n top: 50%;\n left: 6px;\n width: 24px;\n height: 24px;\n margin-top: -12px;\n content: '';\n background-image: url(\"data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='%23fff' d='M12,1A11,11,0,1,0,23,12,11,11,0,0,0,12,1Zm0,20a9,9,0,1,1,9-9A9,9,0,0,1,12,21Z'/%3E%3Cpath fill='%23fff' d='M15.16,15.5h-2V9a1,1,0,0,0-1-1H9.82a1,1,0,0,0,0,2h1.36V15.5h-2a1,1,0,1,0,0,2h6a1,1,0,0,0,0-2Z'/%3E%3Cpath fill='%23fff' d='M12,7.33A1.29,1.29,0,1,0,10.73,6,1.29,1.29,0,0,0,12,7.33Z'/%3E%3C/svg%3E\");\n background-color: transparent;\n background-repeat: no-repeat;\n background-position: center center; }\n .goa-notification.goa--emergency .content:before {\n background-image: url(\"data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='%23fff' d='M11,9.41v4.52a1,1,0,0,0,2,0V9.41a1,1,0,0,0-2,0Z'/%3E%3Cpath fill='%23fff' d='M12,16.15a1.29,1.29,0,1,0,1.29,1.29A1.29,1.29,0,0,0,12,16.15Z'/%3E%3Cpath fill='%23fff' d='M22.87,20.14l-10-17.32a1,1,0,0,0-1.74,0l-10,17.32a1,1,0,0,0,0,1,1,1,0,0,0,.87.5H22a1,1,0,0,0,.87-.5A1,1,0,0,0,22.87,20.14Zm-19.14-.5L12,5.32l8.27,14.32Z'/%3E%3C/svg%3E\");\n background-color: transparent;\n background-repeat: no-repeat;\n background-position: center center; }\n .goa-notification.goa--important .content:before {\n background-image: url(\"data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='%23000' d='M12,1A11,11,0,1,0,23,12,11,11,0,0,0,12,1Zm0,20a9,9,0,1,1,9-9A9,9,0,0,1,12,21Z'/%3E%3Cpath fill='%23000' d='M12,14.46a1,1,0,0,0,1-1V6.57a1,1,0,0,0-2,0v6.89A1,1,0,0,0,12,14.46Z'/%3E%3Cpath fill='%23000' d='M12,15.68A1.29,1.29,0,1,0,13.29,17,1.29,1.29,0,0,0,12,15.68Z'/%3E%3C/svg%3E\");\n background-color: transparent;\n background-repeat: no-repeat;\n background-position: center center; }\n .goa-notification.goa--event .content:before {\n background-image: url(\"data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='%23fff' d='M3.27,22.85H20.73a2.14,2.14,0,0,0,2.14-2.14V5A2.14,2.14,0,0,0,20.73,2.9h-2.1v2h2.1a.14.14,0,0,1,.14.14V8.31H3.13V5a.14.14,0,0,1,.14-.14H5.48V6.28a1,1,0,1,0,2,0V1.85a1,1,0,1,0-2,0v1H3.27A2.14,2.14,0,0,0,1.13,5V20.71A2.14,2.14,0,0,0,3.27,22.85Zm17.6-12.54v10.4a.14.14,0,0,1-.14.14H3.27a.14.14,0,0,1-.14-.14V10.31Z'/%3E%3Cpath fill='%23fff' d='M16.45,7.28a1,1,0,0,0,1-1V1.85a1,1,0,0,0-2,0v1h-1.8v2h1.8V6.28A1,1,0,0,0,16.45,7.28Z'/%3E%3Cpath fill='%23fff' d='M11.47,7.28a1,1,0,0,0,1-1V1.85a1,1,0,1,0-2,0v1H8.66v2h1.81V6.28A1,1,0,0,0,11.47,7.28Z'/%3E%3Crect fill='%23fff' x='6.67' y='11.52' width='2.33' height='2.33'/%3E%3Crect fill='%23fff' x='11.22' y='11.52' width='2.33' height='2.33'/%3E%3Crect fill='%23fff' x='15.77' y='11.52' width='2.33' height='2.33'/%3E%3Crect fill='%23fff' x='3.64' y='15.83' width='2.33' height='2.33'/%3E%3Crect fill='%23fff' x='8.19' y='15.83' width='2.33' height='2.33'/%3E%3Crect fill='%23fff' x='12.74' y='15.83' width='2.33' height='2.33'/%3E%3C/svg%3E\");\n background-color: transparent;\n background-repeat: no-repeat;\n background-position: center center; }\n";
|
|
1333
1333
|
styleInject(css_248z$3);
|
|
1334
1334
|
|
|
1335
|
+
var css_248z$4 = ".goa-notifications .title {\n position: absolute;\n overflow: hidden;\n clip: rect(1px, 1px, 1px, 1px);\n left: -10px;\n width: 1px;\n height: 1px;\n white-space: nowrap; }\n\n.goa-notifications ul {\n box-sizing: border-box;\n display: inline-block;\n width: 100%;\n margin: 0;\n padding: 0;\n list-style-type: none; }\n .goa-notifications ul li {\n box-sizing: border-box;\n display: block;\n width: 100%;\n margin: 0;\n padding: 0; }\n";
|
|
1336
|
+
styleInject(css_248z$4);
|
|
1337
|
+
|
|
1335
1338
|
var GoANotification = function GoANotification(_ref) {
|
|
1336
1339
|
var title = _ref.title,
|
|
1337
1340
|
_ref$type = _ref.type,
|
|
@@ -1395,8 +1398,8 @@
|
|
|
1395
1398
|
content: propTypes.string
|
|
1396
1399
|
};
|
|
1397
1400
|
|
|
1398
|
-
var css_248z$
|
|
1399
|
-
styleInject(css_248z$
|
|
1401
|
+
var css_248z$5 = "/* Palette */\n/* Semantic usages */\n/* Common button colors */\n/* Primary colors */\n/* Secondary colors */\n/* Tertiary colors */\n/* This style is from the alberta design system */\nbutton.goa-button,\ninput[type='button'].goa-button,\ninput[type='submit'].goa-button {\n box-sizing: border-box;\n min-width: 70px;\n padding: 12px;\n border: 2px solid #0070c4;\n border-radius: 4px;\n background: #0070c4;\n cursor: pointer;\n color: #fff;\n font-size: 18px;\n font-weight: 700;\n line-height: 1em; }\n button.goa-button.btn-small,\n input[type='button'].goa-button.btn-small,\n input[type='submit'].goa-button.btn-small {\n font-size: 16px;\n padding: 8px;\n margin: 12px 12px 0 0; }\n button.goa-button:last-of-type,\n input[type='button'].goa-button:last-of-type,\n input[type='submit'].goa-button:last-of-type {\n margin-right: 0; }\n button.goa-button:disabled, button.goa-button:disabled.goa--secondary, button.goa-button:disabled.goa--tertiary,\n input[type='button'].goa-button:disabled,\n input[type='button'].goa-button:disabled.goa--secondary,\n input[type='button'].goa-button:disabled.goa--tertiary,\n input[type='submit'].goa-button:disabled,\n input[type='submit'].goa-button:disabled.goa--secondary,\n input[type='submit'].goa-button:disabled.goa--tertiary {\n pointer-events: none;\n color: #666;\n background-color: #f1f1f1;\n border-color: #f1f1f1; }\n button.goa-button:hover,\n input[type='button'].goa-button:hover,\n input[type='submit'].goa-button:hover {\n border-color: #004f84;\n background: #004f84; }\n button.goa-button:focus, button.goa-button:active,\n input[type='button'].goa-button:focus,\n input[type='button'].goa-button:active,\n input[type='submit'].goa-button:focus,\n input[type='submit'].goa-button:active {\n border-color: #004f84;\n box-shadow: 0 0 0 3px #feba35;\n background: #004f84;\n outline: none; }\n button.goa-button.goa--secondary,\n input[type='button'].goa-button.goa--secondary,\n input[type='submit'].goa-button.goa--secondary {\n border: 2px solid #0070c4;\n background: #fff;\n color: #0070c4; }\n button.goa-button.goa--secondary:hover,\n input[type='button'].goa-button.goa--secondary:hover,\n input[type='submit'].goa-button.goa--secondary:hover {\n border-color: #004f84;\n background: #fff;\n color: #004f84; }\n button.goa-button.goa--secondary:focus, button.goa-button.goa--secondary:active,\n input[type='button'].goa-button.goa--secondary:focus,\n input[type='button'].goa-button.goa--secondary:active,\n input[type='submit'].goa-button.goa--secondary:focus,\n input[type='submit'].goa-button.goa--secondary:active {\n color: #004f84;\n background-color: #fff;\n border: 2px solid #004f84;\n box-shadow: 0 0 0 3px #feba35;\n outline: none; }\n button.goa-button.goa--tertiary,\n input[type='button'].goa-button.goa--tertiary,\n input[type='submit'].goa-button.goa--tertiary {\n border-color: #dcdcdc;\n background: #fff;\n color: #0070c4; }\n button.goa-button.goa--tertiary:hover,\n input[type='button'].goa-button.goa--tertiary:hover,\n input[type='submit'].goa-button.goa--tertiary:hover {\n background: #fff;\n color: #004f84; }\n button.goa-button.goa--tertiary:focus, button.goa-button.goa--tertiary:active,\n input[type='button'].goa-button.goa--tertiary:focus,\n input[type='button'].goa-button.goa--tertiary:active,\n input[type='submit'].goa-button.goa--tertiary:focus,\n input[type='submit'].goa-button.goa--tertiary:active {\n border: 2px solid #004f84;\n color: #004f84;\n background-color: #fff;\n box-shadow: 0 0 0 3px #feba35;\n outline: none; }\n";
|
|
1402
|
+
styleInject(css_248z$5);
|
|
1400
1403
|
|
|
1401
1404
|
var GoAButton = function GoAButton(_ref) {
|
|
1402
1405
|
var _ref$buttonType = _ref.buttonType,
|
|
@@ -1427,12 +1430,12 @@
|
|
|
1427
1430
|
onClick: propTypes.func
|
|
1428
1431
|
};
|
|
1429
1432
|
|
|
1430
|
-
var css_248z$
|
|
1431
|
-
styleInject(css_248z$5);
|
|
1432
|
-
|
|
1433
|
-
var css_248z$6 = "a.microsite-link {\n color: inherit;\n text-decoration: none;\n white-space: nowrap;\n display: flex;\n align-items: center;\n height: 66px; }\n a.microsite-link:focus, a.microsite-link:hover, a.microsite-link:active {\n outline: none; }\n a.microsite-link .image-desktop-tablet {\n width: 150px;\n height: 42px;\n display: inline-block;\n background-image: url(\"data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' width='149.351' height='42' viewBox='0 0 149.351 42'%3E%3Cdefs%3E%3Cstyle%3E.a%7Bfill:none;%7D.b%7Bclip-path:url(%23a);%7D.c%7Bfill:%2300aad2;%7D.d%7Bfill:%235f6a72;%7D%3C/style%3E%3CclipPath id='a'%3E%3Crect class='a' width='149.351' height='42'/%3E%3C/clipPath%3E%3C/defs%3E%3Cg class='b'%3E%3Crect class='c' width='13.555' height='13.555' transform='translate(135.796 21.524)'/%3E%3Cpath class='d' d='M63.082,33.088c-1.383.138-2.835.277-4.357.346.553-4.357,2.835-10.373,5.671-9.405,1.66.553.761,5.671-1.314,9.059m-3.527,2.974a3.761,3.761,0,0,1-1.245,0,.851.851,0,0,0,.346-.692v-.553c.761,0,1.936-.138,3.389-.277a4.327,4.327,0,0,1-2.49,1.521M76.844,25.688c1.8-1.66,2.7-1.521,2.9-1.106.484.968-1.591,4.357-5.671,6.224a10.328,10.328,0,0,1,2.766-5.118m66.736,1.66c-.207-3.389-3.181-3.942-3.6-2.974-.138.346,1.106.207,1.106,2.628,0,3.942-4.011,9.129-9.129,9.129-5.532,0-6.985-4.357-7.261-6.432-.207-1.452.138-3.458-2.351-3.181-1.729.207-3.25,3.527-5.463,6.362-1.867,2.42-2.7,2.213-2.282.138.553-2.628,2.7-8.714,5.187-9.129,1.176-.207,1.591,1.8,2.075.553s.069-4.011-2.559-4.011c-1.8,0-3.942,1.936-5.74,4.08-1.521,1.936-9.336,13.416-12.656,10.927-1.521-1.176-1.383-5.878-.415-11.411,3.873-1.521,7.123-1.037,8.921-.138.9.415,1.037.346.622-.622-.553-1.452-3.665-3.734-8.575-2.7-.138,0-.207.069-.346.069.415-1.8.83-3.665,1.383-5.463.484-1.66,1.8-4.5-1.729-4.979-1.106-.207-.622.346-1.037,1.867-.692,2.766-1.521,6.362-2.144,10.028a19.745,19.745,0,0,0-7.538,8.091,38.59,38.59,0,0,0,.9-4.772,1.589,1.589,0,0,0-1.245-1.729c-.761-.207-1.729.138-2.628,1.452-2.144,3.043-4.841,7.815-8.99,9.82-2.974,1.452-4.288,0-4.357-2.282a9.869,9.869,0,0,0,1.521-.553c5.394-2.351,7.192-5.947,5.878-8.16-1.314-2.075-4.979-1.452-7.953,1.66a11.175,11.175,0,0,0-2.7,6.5c-1.245.277-2.628.484-4.219.692,2.49-4.08,2.282-9.613-1.383-10.581-4.288-1.106-6.432,3.043-7.331,6.5.346-3.873.9-7.745,1.591-11.549.346-1.66,1.452-4.5-2.075-4.979-1.106-.207-.968.346-.9,1.867.138,2.075-2.144,14.454-.968,19.848-1.521.484-2.144,1.66-.207,2.835,1.383.83,4.357,1.106,7.331-.346a9.3,9.3,0,0,0,2.766-2.144c1.8-.207,3.665-.553,5.394-.83.277,2.42,1.867,4.219,5.463,3.873,5.118-.484,9.682-6.777,11.411-9.82-.346,3.25-2.42,10.373,1.176,10.028,1.383-.138.83-.346.9-1.591.346-4.288,3.873-7.953,7.4-10.166-.622,5.256-.415,9.958,2.006,11.411,4.426,2.766,10.581-4.5,14.039-8.921-1.729,3.942-2.7,8.921-.138,9.682,3.043.9,5.463-4.219,8.3-8.091.346,2.766,2.213,7.607,9.682,7.607,8.022-.069,13.071-4.91,12.863-10.1m-108.3,8.645A66.439,66.439,0,0,1,27.4,32.534a59.168,59.168,0,0,0,6.777-2.974,54.453,54.453,0,0,0,1.106,6.432m20.4,3.873c-.069-.207-.622.069-1.106,0-1.452-.207-3.389-2.213-3.942-5.463-1.037-5.878-.415-11.687,1.314-20.332.346-1.66,1.452-4.5-2.075-5.048-1.106-.138-.553.415-.83,1.867C47.66,17.32,42.4,21.954,37.149,25.066,36.6,17.735,36.8,9.505,38.186,4.526c1.176-4.219,2.559-3.458.83-4.357s-3.734.277-5.325,3.458S24.839,23.89,13.221,35.439C7.273,41.317,1.879,38.274.842,37.375c-.9-.761-1.176.415-.138,1.591,4.772,5.256,11.826,2.282,14.384-.277,7.054-7.054,15.283-22.268,18.6-28.7a98.251,98.251,0,0,0,.277,16.874,50.129,50.129,0,0,1-8.3,3.181c-1.66.415-2.7,1.106-2.7,1.867s1.106,1.521,2.7,2.282c2.835,1.383,11.2,5.256,13.209,6.5,1.729,1.037,2.628.207,3.112-.9.692-1.452-1.176-2.282-2.974-2.766a60.545,60.545,0,0,1-1.66-9.267c4.219-2.628,8.437-6.086,10.788-10.443C47.522,20.916,46,33.3,49.873,38.482a5.451,5.451,0,0,0,4.564,2.213c.968-.069,1.383-.692,1.245-.83' transform='translate(-0.038 0.124)'/%3E%3C/g%3E%3C/svg%3E\");\n background-repeat: no-repeat;\n background-size: contain;\n background-position: center center; }\n @media screen and (max-width: 767px) {\n a.microsite-link .image-desktop-tablet {\n display: none; } }\n @media screen and (min-width: 768px) and (max-width: 1199px) {\n a.microsite-link .image-mobile {\n display: none; } }\n @media screen and (min-width: 1200px) {\n a.microsite-link .image-mobile {\n display: none; } }\n @media screen and (max-width: 767px) {\n a.microsite-link .image-mobile {\n width: 34px;\n height: 34px;\n display: inline-block;\n background-image: url(\"data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' width='16' height='16' viewBox='0 0 16 16'%3E%3Cdefs%3E%3Cstyle%3E.a%7Bfill:none;%7D.b%7Bfill:%2300aad2;%7D.c%7Bclip-path:url(%23a);%7D.d%7Bfill:%23fff;%7D%3C/style%3E%3CclipPath id='a'%3E%3Crect class='a' width='14' height='14' transform='translate(-0.345 -0.21)'/%3E%3C/clipPath%3E%3C/defs%3E%3Cg transform='translate(0 -0.135)'%3E%3Ccircle class='b' cx='8' cy='8' r='8' transform='translate(0 0.135)'/%3E%3Cg transform='translate(1.345 1.344)'%3E%3Cg class='c' transform='translate(0 0)'%3E%3Cpath class='d' d='M12.612,13.636a16.24,16.24,0,0,1-1.86-.822,13.436,13.436,0,0,0,1.6-.708,11.312,11.312,0,0,0,.264,1.53M16.032,7.3c-.266-.034-.128.091-.2.442a5.465,5.465,0,0,1-2.8,3.338,16.141,16.141,0,0,1,.249-4.84c.275-1,.6-.813.2-1.022-.427-.22-.887.071-1.258.813A27.247,27.247,0,0,1,7.4,13.522a2.141,2.141,0,0,1-2.918.461c-.206-.174-.282.095-.026.37a2.412,2.412,0,0,0,3.387-.082A32.715,32.715,0,0,0,12.219,7.51a23.541,23.541,0,0,0,.063,3.971,11.464,11.464,0,0,1-1.964.749c-.388.1-.628.26-.635.439-.007.2.253.363.63.541.67.318,2.633,1.246,3.117,1.527.414.24.616.053.739-.207.16-.338-.279-.533-.7-.661a13.175,13.175,0,0,1-.382-2.179,7.143,7.143,0,0,0,2.547-2.454,4.7,4.7,0,0,0,.4-1.133,2.125,2.125,0,0,0,.048-.742s-.007-.054-.048-.059' transform='translate(-3.51 -3.943)'/%3E%3C/g%3E%3C/g%3E%3C/g%3E%3C/svg%3E\");\n background-repeat: no-repeat;\n background-size: contain;\n background-position: center center; } }\n a.microsite-link .name {\n margin-left: 8px;\n font-size: 16px;\n overflow: hidden;\n white-space: nowrap;\n text-overflow: ellipsis; }\n @media screen and (min-width: 1200px) {\n a.microsite-link .name {\n margin-left: 28px; } }\n @media screen and (min-width: 768px) and (max-width: 1199px) {\n a.microsite-link .name {\n margin-left: 28px; } }\n";
|
|
1433
|
+
var css_248z$6 = "/* Palette */\n/* Semantic usages */\n.goa-header {\n display: flex;\n align-items: center;\n padding-left: 28px;\n padding-right: 28px; }\n @media screen and (min-width: 768px) and (max-width: 1199px) {\n .goa-header {\n padding-left: 28px;\n padding-right: 28px; } }\n @media screen and (max-width: 767px) {\n .goa-header {\n padding-left: 28px;\n padding-right: 28px; } }\n .goa-header.goa-microsite-header,\n .goa-header > .goa-microsite-header {\n background-color: #fff;\n top: 0;\n display: flex;\n justify-content: space-between; }\n .goa-header.goa-official-site-header,\n .goa-header > .goa-official-site-header {\n font-size: 12px;\n background-color: #f1f1f1;\n line-height: 22px; }\n .goa-header.goa-official-site-header .site-text,\n .goa-header > .goa-official-site-header .site-text {\n white-space: nowrap;\n padding: 0 4px; }\n .goa-header.goa-official-site-header .service-level,\n .goa-header > .goa-official-site-header .service-level {\n padding: 0 3px;\n font-weight: bold;\n vertical-align: baseline;\n text-transform: capitalize; }\n .goa-header.goa-official-site-header .service-level--alpha,\n .goa-header > .goa-official-site-header .service-level--alpha {\n background-color: #feba35;\n color: #333; }\n .goa-header.goa-official-site-header .service-level--beta,\n .goa-header > .goa-official-site-header .service-level--beta {\n background-color: #0081a2;\n color: #fff; }\n .goa-header.goa-official-site-header .service-level--live,\n .goa-header > .goa-official-site-header .service-level--live {\n height: 16px;\n width: 16px;\n padding: 0;\n color: transparent;\n background-image: url(\"data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' width='16' height='16' viewBox='0 0 16 16'%3E%3Cdefs%3E%3Cstyle%3E.a%7Bfill:none;%7D.b%7Bfill:%2300aad2;%7D.c%7Bclip-path:url(%23a);%7D.d%7Bfill:%23fff;%7D%3C/style%3E%3CclipPath id='a'%3E%3Crect class='a' width='14' height='14' transform='translate(-0.345 -0.21)'/%3E%3C/clipPath%3E%3C/defs%3E%3Cg transform='translate(0 -0.135)'%3E%3Ccircle class='b' cx='8' cy='8' r='8' transform='translate(0 0.135)'/%3E%3Cg transform='translate(1.345 1.344)'%3E%3Cg class='c' transform='translate(0 0)'%3E%3Cpath class='d' d='M12.612,13.636a16.24,16.24,0,0,1-1.86-.822,13.436,13.436,0,0,0,1.6-.708,11.312,11.312,0,0,0,.264,1.53M16.032,7.3c-.266-.034-.128.091-.2.442a5.465,5.465,0,0,1-2.8,3.338,16.141,16.141,0,0,1,.249-4.84c.275-1,.6-.813.2-1.022-.427-.22-.887.071-1.258.813A27.247,27.247,0,0,1,7.4,13.522a2.141,2.141,0,0,1-2.918.461c-.206-.174-.282.095-.026.37a2.412,2.412,0,0,0,3.387-.082A32.715,32.715,0,0,0,12.219,7.51a23.541,23.541,0,0,0,.063,3.971,11.464,11.464,0,0,1-1.964.749c-.388.1-.628.26-.635.439-.007.2.253.363.63.541.67.318,2.633,1.246,3.117,1.527.414.24.616.053.739-.207.16-.338-.279-.533-.7-.661a13.175,13.175,0,0,1-.382-2.179,7.143,7.143,0,0,0,2.547-2.454,4.7,4.7,0,0,0,.4-1.133,2.125,2.125,0,0,0,.048-.742s-.007-.054-.048-.059' transform='translate(-3.51 -3.943)'/%3E%3C/g%3E%3C/g%3E%3C/g%3E%3C/svg%3E\");\n background-repeat: no-repeat;\n background-size: contain;\n background-position: center center; }\n .goa-header .web-link {\n color: #0070c4;\n text-align: left; }\n";
|
|
1434
1434
|
styleInject(css_248z$6);
|
|
1435
1435
|
|
|
1436
|
+
var css_248z$7 = "a.microsite-link {\n color: inherit;\n text-decoration: none;\n white-space: nowrap;\n display: flex;\n align-items: center;\n height: 66px; }\n a.microsite-link:focus, a.microsite-link:hover, a.microsite-link:active {\n outline: none; }\n a.microsite-link .image-desktop-tablet {\n width: 150px;\n height: 42px;\n display: inline-block;\n background-image: url(\"data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' width='149.351' height='42' viewBox='0 0 149.351 42'%3E%3Cdefs%3E%3Cstyle%3E.a%7Bfill:none;%7D.b%7Bclip-path:url(%23a);%7D.c%7Bfill:%2300aad2;%7D.d%7Bfill:%235f6a72;%7D%3C/style%3E%3CclipPath id='a'%3E%3Crect class='a' width='149.351' height='42'/%3E%3C/clipPath%3E%3C/defs%3E%3Cg class='b'%3E%3Crect class='c' width='13.555' height='13.555' transform='translate(135.796 21.524)'/%3E%3Cpath class='d' d='M63.082,33.088c-1.383.138-2.835.277-4.357.346.553-4.357,2.835-10.373,5.671-9.405,1.66.553.761,5.671-1.314,9.059m-3.527,2.974a3.761,3.761,0,0,1-1.245,0,.851.851,0,0,0,.346-.692v-.553c.761,0,1.936-.138,3.389-.277a4.327,4.327,0,0,1-2.49,1.521M76.844,25.688c1.8-1.66,2.7-1.521,2.9-1.106.484.968-1.591,4.357-5.671,6.224a10.328,10.328,0,0,1,2.766-5.118m66.736,1.66c-.207-3.389-3.181-3.942-3.6-2.974-.138.346,1.106.207,1.106,2.628,0,3.942-4.011,9.129-9.129,9.129-5.532,0-6.985-4.357-7.261-6.432-.207-1.452.138-3.458-2.351-3.181-1.729.207-3.25,3.527-5.463,6.362-1.867,2.42-2.7,2.213-2.282.138.553-2.628,2.7-8.714,5.187-9.129,1.176-.207,1.591,1.8,2.075.553s.069-4.011-2.559-4.011c-1.8,0-3.942,1.936-5.74,4.08-1.521,1.936-9.336,13.416-12.656,10.927-1.521-1.176-1.383-5.878-.415-11.411,3.873-1.521,7.123-1.037,8.921-.138.9.415,1.037.346.622-.622-.553-1.452-3.665-3.734-8.575-2.7-.138,0-.207.069-.346.069.415-1.8.83-3.665,1.383-5.463.484-1.66,1.8-4.5-1.729-4.979-1.106-.207-.622.346-1.037,1.867-.692,2.766-1.521,6.362-2.144,10.028a19.745,19.745,0,0,0-7.538,8.091,38.59,38.59,0,0,0,.9-4.772,1.589,1.589,0,0,0-1.245-1.729c-.761-.207-1.729.138-2.628,1.452-2.144,3.043-4.841,7.815-8.99,9.82-2.974,1.452-4.288,0-4.357-2.282a9.869,9.869,0,0,0,1.521-.553c5.394-2.351,7.192-5.947,5.878-8.16-1.314-2.075-4.979-1.452-7.953,1.66a11.175,11.175,0,0,0-2.7,6.5c-1.245.277-2.628.484-4.219.692,2.49-4.08,2.282-9.613-1.383-10.581-4.288-1.106-6.432,3.043-7.331,6.5.346-3.873.9-7.745,1.591-11.549.346-1.66,1.452-4.5-2.075-4.979-1.106-.207-.968.346-.9,1.867.138,2.075-2.144,14.454-.968,19.848-1.521.484-2.144,1.66-.207,2.835,1.383.83,4.357,1.106,7.331-.346a9.3,9.3,0,0,0,2.766-2.144c1.8-.207,3.665-.553,5.394-.83.277,2.42,1.867,4.219,5.463,3.873,5.118-.484,9.682-6.777,11.411-9.82-.346,3.25-2.42,10.373,1.176,10.028,1.383-.138.83-.346.9-1.591.346-4.288,3.873-7.953,7.4-10.166-.622,5.256-.415,9.958,2.006,11.411,4.426,2.766,10.581-4.5,14.039-8.921-1.729,3.942-2.7,8.921-.138,9.682,3.043.9,5.463-4.219,8.3-8.091.346,2.766,2.213,7.607,9.682,7.607,8.022-.069,13.071-4.91,12.863-10.1m-108.3,8.645A66.439,66.439,0,0,1,27.4,32.534a59.168,59.168,0,0,0,6.777-2.974,54.453,54.453,0,0,0,1.106,6.432m20.4,3.873c-.069-.207-.622.069-1.106,0-1.452-.207-3.389-2.213-3.942-5.463-1.037-5.878-.415-11.687,1.314-20.332.346-1.66,1.452-4.5-2.075-5.048-1.106-.138-.553.415-.83,1.867C47.66,17.32,42.4,21.954,37.149,25.066,36.6,17.735,36.8,9.505,38.186,4.526c1.176-4.219,2.559-3.458.83-4.357s-3.734.277-5.325,3.458S24.839,23.89,13.221,35.439C7.273,41.317,1.879,38.274.842,37.375c-.9-.761-1.176.415-.138,1.591,4.772,5.256,11.826,2.282,14.384-.277,7.054-7.054,15.283-22.268,18.6-28.7a98.251,98.251,0,0,0,.277,16.874,50.129,50.129,0,0,1-8.3,3.181c-1.66.415-2.7,1.106-2.7,1.867s1.106,1.521,2.7,2.282c2.835,1.383,11.2,5.256,13.209,6.5,1.729,1.037,2.628.207,3.112-.9.692-1.452-1.176-2.282-2.974-2.766a60.545,60.545,0,0,1-1.66-9.267c4.219-2.628,8.437-6.086,10.788-10.443C47.522,20.916,46,33.3,49.873,38.482a5.451,5.451,0,0,0,4.564,2.213c.968-.069,1.383-.692,1.245-.83' transform='translate(-0.038 0.124)'/%3E%3C/g%3E%3C/svg%3E\");\n background-repeat: no-repeat;\n background-size: contain;\n background-position: center center; }\n @media screen and (max-width: 767px) {\n a.microsite-link .image-desktop-tablet {\n display: none; } }\n @media screen and (min-width: 768px) and (max-width: 1199px) {\n a.microsite-link .image-mobile {\n display: none; } }\n @media screen and (min-width: 1200px) {\n a.microsite-link .image-mobile {\n display: none; } }\n @media screen and (max-width: 767px) {\n a.microsite-link .image-mobile {\n width: 34px;\n height: 34px;\n display: inline-block;\n background-image: url(\"data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' width='16' height='16' viewBox='0 0 16 16'%3E%3Cdefs%3E%3Cstyle%3E.a%7Bfill:none;%7D.b%7Bfill:%2300aad2;%7D.c%7Bclip-path:url(%23a);%7D.d%7Bfill:%23fff;%7D%3C/style%3E%3CclipPath id='a'%3E%3Crect class='a' width='14' height='14' transform='translate(-0.345 -0.21)'/%3E%3C/clipPath%3E%3C/defs%3E%3Cg transform='translate(0 -0.135)'%3E%3Ccircle class='b' cx='8' cy='8' r='8' transform='translate(0 0.135)'/%3E%3Cg transform='translate(1.345 1.344)'%3E%3Cg class='c' transform='translate(0 0)'%3E%3Cpath class='d' d='M12.612,13.636a16.24,16.24,0,0,1-1.86-.822,13.436,13.436,0,0,0,1.6-.708,11.312,11.312,0,0,0,.264,1.53M16.032,7.3c-.266-.034-.128.091-.2.442a5.465,5.465,0,0,1-2.8,3.338,16.141,16.141,0,0,1,.249-4.84c.275-1,.6-.813.2-1.022-.427-.22-.887.071-1.258.813A27.247,27.247,0,0,1,7.4,13.522a2.141,2.141,0,0,1-2.918.461c-.206-.174-.282.095-.026.37a2.412,2.412,0,0,0,3.387-.082A32.715,32.715,0,0,0,12.219,7.51a23.541,23.541,0,0,0,.063,3.971,11.464,11.464,0,0,1-1.964.749c-.388.1-.628.26-.635.439-.007.2.253.363.63.541.67.318,2.633,1.246,3.117,1.527.414.24.616.053.739-.207.16-.338-.279-.533-.7-.661a13.175,13.175,0,0,1-.382-2.179,7.143,7.143,0,0,0,2.547-2.454,4.7,4.7,0,0,0,.4-1.133,2.125,2.125,0,0,0,.048-.742s-.007-.054-.048-.059' transform='translate(-3.51 -3.943)'/%3E%3C/g%3E%3C/g%3E%3C/g%3E%3C/svg%3E\");\n background-repeat: no-repeat;\n background-size: contain;\n background-position: center center; } }\n a.microsite-link .name {\n margin-left: 8px;\n font-size: 16px;\n overflow: hidden;\n white-space: nowrap;\n text-overflow: ellipsis; }\n @media screen and (min-width: 1200px) {\n a.microsite-link .name {\n margin-left: 28px; } }\n @media screen and (min-width: 768px) and (max-width: 1199px) {\n a.microsite-link .name {\n margin-left: 28px; } }\n";
|
|
1437
|
+
styleInject(css_248z$7);
|
|
1438
|
+
|
|
1436
1439
|
/* eslint-disable-next-line */
|
|
1437
1440
|
|
|
1438
1441
|
var MicrositeLogo = function MicrositeLogo(props) {
|
|
@@ -1478,8 +1481,8 @@
|
|
|
1478
1481
|
}), /*#__PURE__*/React__default.createElement("div", null, props.children)));
|
|
1479
1482
|
};
|
|
1480
1483
|
|
|
1481
|
-
var css_248z$
|
|
1482
|
-
styleInject(css_248z$
|
|
1484
|
+
var css_248z$8 = ".goa-hero-banner-content {\n font-size: 24px;\n line-height: 32px;\n margin: 0;\n color: #fff; }\n @media screen and (min-width: 768px) and (max-width: 1199px) {\n .goa-hero-banner-content {\n width: 80%; } }\n @media screen and (min-width: 1200px) {\n .goa-hero-banner-content {\n width: 40%; } }\n .goa-hero-banner-content:last-of-type {\n margin-bottom: 28px; }\n";
|
|
1485
|
+
styleInject(css_248z$8);
|
|
1483
1486
|
|
|
1484
1487
|
var GoAHeroBannerContent = function GoAHeroBannerContent(_ref) {
|
|
1485
1488
|
var content = _ref.content,
|
|
@@ -1490,8 +1493,8 @@
|
|
|
1490
1493
|
}, children || content);
|
|
1491
1494
|
};
|
|
1492
1495
|
|
|
1493
|
-
var css_248z$
|
|
1494
|
-
styleInject(css_248z$
|
|
1496
|
+
var css_248z$9 = "/* Palette */\n/* Semantic usages */\n/* Palette */\n/* Semantic usages */\n/* Common button colors */\n/* Primary colors */\n/* Secondary colors */\n/* Tertiary colors */\n/* This style is from the alberta design system */\n/* This style is from the alberta design system */\n.goa-link-button.goa-link-button {\n display: inline-block;\n text-decoration: none; }\n .goa-link-button.goa-link-button {\n box-sizing: border-box;\n min-width: 70px;\n padding: 12px;\n border: 2px solid #0070c4;\n border-radius: 4px;\n background: #0070c4;\n cursor: pointer;\n color: #fff;\n font-size: 18px;\n font-weight: 700;\n line-height: 1em; }\n .goa-link-button.goa-link-button.btn-small {\n font-size: 16px;\n padding: 8px;\n margin: 12px 12px 0 0; }\n .goa-link-button.goa-link-button:last-of-type {\n margin-right: 0; }\n .goa-link-button.goa-link-button:disabled, .goa-link-button.goa-link-button:disabled.goa--secondary, .goa-link-button.goa-link-button:disabled.goa--tertiary {\n pointer-events: none;\n color: #666;\n background-color: #f1f1f1;\n border-color: #f1f1f1; }\n .goa-link-button.goa-link-button:hover {\n border-color: #004f84;\n background: #004f84; }\n .goa-link-button.goa-link-button:focus, .goa-link-button.goa-link-button:active {\n border-color: #004f84;\n box-shadow: 0 0 0 3px #feba35;\n background: #004f84;\n outline: none; }\n .goa-link-button.goa-link-button.goa--secondary {\n border: 2px solid #0070c4;\n background: #fff;\n color: #0070c4; }\n .goa-link-button.goa-link-button.goa--secondary:hover {\n border-color: #004f84;\n background: #fff;\n color: #004f84; }\n .goa-link-button.goa-link-button.goa--secondary:focus, .goa-link-button.goa-link-button.goa--secondary:active {\n color: #004f84;\n background-color: #fff;\n border: 2px solid #004f84;\n box-shadow: 0 0 0 3px #feba35;\n outline: none; }\n .goa-link-button.goa-link-button.goa--tertiary {\n border-color: #dcdcdc;\n background: #fff;\n color: #0070c4; }\n .goa-link-button.goa-link-button.goa--tertiary:hover {\n background: #fff;\n color: #004f84; }\n .goa-link-button.goa-link-button.goa--tertiary:focus, .goa-link-button.goa-link-button.goa--tertiary:active {\n border: 2px solid #004f84;\n color: #004f84;\n background-color: #fff;\n box-shadow: 0 0 0 3px #feba35;\n outline: none; }\n .goa-link-button.goa-link-button.right-arrow::after {\n color: #fff;\n margin-left: 8px;\n content: '\\2192'; }\n .goa-link-button.goa-link-button.up-arrow::after {\n color: #fff;\n margin-left: 8px;\n content: '\\2191'; }\n .goa-link-button.goa-link-button:visited, .goa-link-button.goa-link-button:link {\n color: #fff; }\n";
|
|
1497
|
+
styleInject(css_248z$9);
|
|
1495
1498
|
|
|
1496
1499
|
var GoAHeroBannerLink = function GoAHeroBannerLink(_ref) {
|
|
1497
1500
|
var linkText = _ref.linkText,
|
|
@@ -1503,8 +1506,8 @@
|
|
|
1503
1506
|
}, linkText)) : /*#__PURE__*/React__default.createElement(React.Fragment, null);
|
|
1504
1507
|
};
|
|
1505
1508
|
|
|
1506
|
-
var css_248z$
|
|
1507
|
-
styleInject(css_248z$
|
|
1509
|
+
var css_248z$a = "/* Palette */\n/* Semantic usages */\n.goa-hero {\n box-sizing: border-box;\n display: flex;\n justify-content: flex-end;\n align-items: stretch;\n flex-direction: column;\n height: 600px;\n border-bottom: 8px solid #0081a2;\n color: #fff;\n background-position: center center;\n width: 100%;\n padding: 56px 28px; }\n .goa-hero h1 {\n margin: 0 0 28px;\n padding: 0;\n font-size: 48px;\n line-height: 56px;\n font-weight: 700;\n color: #fff; }\n";
|
|
1510
|
+
styleInject(css_248z$a);
|
|
1508
1511
|
|
|
1509
1512
|
var GoAHeroBanner = function GoAHeroBanner(_ref) {
|
|
1510
1513
|
var title = _ref.title,
|
|
@@ -1534,12 +1537,12 @@
|
|
|
1534
1537
|
linkUrl: ''
|
|
1535
1538
|
};
|
|
1536
1539
|
|
|
1537
|
-
var css_248z$
|
|
1538
|
-
styleInject(css_248z$a);
|
|
1539
|
-
|
|
1540
|
-
var css_248z$b = ".goa-icon {\n display: flex;\n}\n\n.goa-icon svg {\n color: #666;\n fill: #666;\n width: 100%;\n height: 100%;\n}\n\n.goa-icon-button {\n cursor: pointer;\n display: inline-flex;\n align-items: center;\n justify-content: center;\n}\n\n/* GoA */\n.goa-icon-button-goa {\n padding: 0.25rem;\n border: 2px solid var(--color-button-tertiary);\n border-radius: 0.5rem;\n color: var(--color-primary);\n fill: var(--color-primary);\n}\n\n.goa-icon-button-goa:hover {\n background-color: var(--color-button-tertiary);\n}\n\n/* Simple */\n.goa-icon-button-simple {\n padding: 0.4rem;\n border-radius: 999px;\n transition: background 200ms ease-in;\n}\n\n.goa-icon-button-simple:hover {\n background: rgba(0, 0, 0, 0.1);\n}\n";
|
|
1540
|
+
var css_248z$b = "/* Palette */\n/* Semantic usages */\n.goa-badge-icon {\n font-size: 14px; }\n\n.badge-module_goa-badge__3F6Ve {\n display: inline-flex;\n align-items: center;\n border-radius: 4px;\n padding: 0 0.5rem;\n gap: 2px; }\n\n.badge-module_goa-badge-content__3UN-3 {\n font-size: 14px;\n font-weight: 400; }\n\n.badge-module_goa-badge__3F6Ve.badge-module_badge-information__2r_Eq {\n background-color: #f1f1f1;\n color: #005DAA; }\n\n.badge-module_goa-badge__3F6Ve.badge-module_badge-success__18wcm {\n background-color: #00853f;\n color: #fff; }\n\n.badge-module_goa-badge__3F6Ve.badge-module_badge-warning__20BNM {\n background-color: #feba35;\n color: #333; }\n\n.badge-module_goa-badge__3F6Ve.badge-module_badge-emergency__E4mHn {\n background-color: #ec040b;\n color: #fff; }\n\n.badge-module_goa-badge__3F6Ve.badge-module_badge-dark__1thw- {\n background-color: #333;\n color: #fff; }\n\n.badge-module_goa-badge__3F6Ve.badge-module_badge-midtone__1Gt4T {\n background-color: #767676;\n color: #fff; }\n\n.badge-module_goa-badge__3F6Ve.badge-module_badge-light__B8ZMt {\n background-color: #fff;\n color: #333; }\n\n.badge-module_goa-badge__3F6Ve.badge-module_badge-inactive__35PEw {\n background-color: #fff;\n color: #333; }\n";
|
|
1541
1541
|
styleInject(css_248z$b);
|
|
1542
1542
|
|
|
1543
|
+
var css_248z$c = ".goa-icon {\n display: flex;\n}\n\n.goa-icon svg {\n color: #666;\n fill: #666;\n width: 100%;\n height: 100%;\n}\n\n.goa-icon-button {\n cursor: pointer;\n display: inline-flex;\n align-items: center;\n justify-content: center;\n}\n\n/* GoA */\n.goa-icon-button-goa {\n padding: 0.25rem;\n border: 2px solid var(--color-button-tertiary);\n border-radius: 0.5rem;\n color: var(--color-primary);\n fill: var(--color-primary);\n}\n\n.goa-icon-button-goa:hover {\n background-color: var(--color-button-tertiary);\n}\n\n/* Simple */\n.goa-icon-button-simple {\n padding: 0.4rem;\n border-radius: 999px;\n transition: background 200ms ease-in;\n}\n\n.goa-icon-button-simple:hover {\n background: rgba(0, 0, 0, 0.1);\n}\n";
|
|
1544
|
+
styleInject(css_248z$c);
|
|
1545
|
+
|
|
1543
1546
|
var Icons = {
|
|
1544
1547
|
barChart: /*#__PURE__*/React__default.createElement("svg", {
|
|
1545
1548
|
xmlns: "http://www.w3.org/2000/svg",
|
|
@@ -2064,15 +2067,15 @@
|
|
|
2064
2067
|
}
|
|
2065
2068
|
}
|
|
2066
2069
|
|
|
2067
|
-
var css_248z$
|
|
2068
|
-
styleInject(css_248z$c);
|
|
2069
|
-
|
|
2070
|
-
var css_248z$d = ":root {\n /* font-size */\n --fs-xs: 0.75rem;\n --fs-sm: 0.875rem;\n --fs-base: 1.125rem;\n /* base */\n --fs-lg: 1.25rem;\n /* h4 */\n --fs-xl: 1.5rem;\n /* h3 */\n --fs-2xl: 2.25rem;\n /* h2 */\n --fs-3xl: 3rem;\n /* h1 */\n /* font-weight */\n --fw-thin: 100;\n --fw-light: 300;\n --fw-regular: 400;\n --fw-medium: 500;\n --fw-bold: 700;\n --fw-black: 900;\n --input-padding: 0.5rem;\n --input-border-radius: 0.25rem;\n --input-font-size: calc(18px / 16)rem; }\n\n:root {\n --color-white: #fff;\n --color-black: #333;\n --color-gray-l5: #f1f1f1;\n --color-gray-l2: #adadad;\n --color-gray-l1: #dcdcdc;\n --color-gray-d1: #666;\n --color-gray-d3: #333;\n --color-orange: #feba35;\n --color-red: red;\n --color-green: hsl(148, 100%, 26%);\n --color-primary: #0070c4;\n --color-primary-d1: #004f84;\n --color-primary--hover: var(--color-primary-d1);\n --color-text: var(--color-gray-d3);\n --color-error: var(--color-red);\n --color-disabled: var(--color-gray-l2);\n --color-input-background: var(--color-white);\n --color-input-border: var(--color-gray-l1);\n --color-input-border--hover: var(--color-primary-d1);\n --color-input: var(--color-gray-d3);\n --color-input--focused: var(--color-orange);\n --color-button-primary: var(--color-primary);\n --color-button-primary--hover: var(--color-primary-d1);\n --color-button-tertiary: var(--color-gray-l2);\n --color-button-tertiary--hover: var(--color-gray-l5); }\n\n.goa-textarea {\n outline: none;\n transition: box-shadow 0.1s ease-in;\n border: 1px solid var(--color-input-border);\n border-radius: 3px;\n background: white;\n color: var(--color-input);\n padding: var(--input-padding);\n font-size: var(--input-font-size);\n display: block;\n width: 100%; }\n .goa-textarea:hover {\n border-color: var(--color-input-border--hover); }\n .goa-textarea:active, .goa-textarea:focus {\n box-shadow: 0 0 0 3px var(--color-input--focused); }\n .goa-textarea:disabled {\n border-color: var(--color-disabled); }\n .goa-textarea:disabled:hover {\n border-color: var(--color-disabled); }\n .goa-textarea:disabled:focus {\n box-shadow: none; }\n\n.goa-textarea:disabled {\n border-color: var(--color-disabled); }\n .goa-textarea:disabled:hover {\n border-color: var(--color-disabled); }\n .goa-textarea:disabled:focus {\n box-shadow: none; }\n";
|
|
2070
|
+
var css_248z$d = ":root {\n /* font-size */\n --fs-xs: 0.75rem;\n --fs-sm: 0.875rem;\n --fs-base: 1.125rem;\n --fs-lg: 1.25rem;\n --fs-xl: 1.5rem;\n --fs-2xl: 2.25rem;\n --fs-3xl: 3rem;\n /* font-weight */\n --fw-thin: 100;\n --fw-light: 300;\n --fw-regular: 400;\n --fw-medium: 500;\n --fw-bold: 700;\n --fw-black: 900;\n --input-padding: 0.5rem;\n --input-border-radius: 0.25rem;\n --input-font-size: var(--fs-base); }\n\n:root {\n --color-white: #fff;\n --color-black: #333;\n --color-gray-l5: #f1f1f1;\n --color-gray-l2: #adadad;\n --color-gray-l1: #dcdcdc;\n --color-gray-d1: #666;\n --color-gray-d3: #333;\n --color-orange: #feba35;\n --color-red: #ec040b;\n --color-green: hsl(148, 100%, 26%);\n --color-primary: #0070c4;\n --color-primary-d1: #004f84;\n --color-primary--hover: var(--color-primary-d1);\n --color-text: var(--color-gray-d3);\n --color-error: var(--color-red);\n --color-disabled: var(--color-gray-l2);\n --color-input-background: var(--color-white);\n --color-input-border: var(--color-gray-d1);\n --color-input-border--hover: var(--color-primary-d1);\n --color-input: var(--color-gray-d3);\n --color-input--focused: var(--color-orange);\n --color-button-primary: var(--color-primary);\n --color-button-primary--hover: var(--color-primary-d1);\n --color-button-tertiary: var(--color-gray-l2);\n --color-button-tertiary--hover: var(--color-gray-l5); }\n\n.goa-input {\n position: relative; }\n\n.goa-input-leading-icon {\n position: absolute;\n display: flex;\n align-items: center;\n top: 0;\n bottom: 0;\n left: 0.5rem; }\n\n.goa-input input {\n outline: none;\n transition: box-shadow 0.1s ease-in;\n border: 1px solid var(--color-input-border);\n border-radius: 3px;\n background: white;\n color: var(--color-input);\n padding: var(--input-padding);\n font-size: var(--input-font-size);\n display: block;\n width: 100%;\n line-height: 1.5rem;\n padding: 0.5rem 2rem 0.5rem 0.5rem; }\n .goa-input input:hover {\n border-color: var(--color-input-border--hover); }\n .goa-input input:active, .goa-input input:focus {\n box-shadow: 0 0 0 3px var(--color-input--focused); }\n .goa-input input:disabled {\n border-color: var(--color-disabled); }\n .goa-input input:disabled:hover {\n border-color: var(--color-disabled); }\n .goa-input input:disabled:focus {\n box-shadow: none; }\n\n.goa-input input:disabled {\n border-color: var(--color-disabled); }\n .goa-input input:disabled:hover {\n border-color: var(--color-disabled); }\n .goa-input input:disabled:focus {\n box-shadow: none; }\n\n.goa-input svg {\n width: 80%; }\n\n.goa-input .input--leading-icon {\n padding-left: 2rem; }\n\n.goa-state--error .goa-input input {\n border: 2px solid var(--color-error); }\n";
|
|
2071
2071
|
styleInject(css_248z$d);
|
|
2072
2072
|
|
|
2073
|
-
var css_248z$e = ".
|
|
2073
|
+
var css_248z$e = ":root {\n /* font-size */\n --fs-xs: 0.75rem;\n --fs-sm: 0.875rem;\n --fs-base: 1.125rem;\n --fs-lg: 1.25rem;\n --fs-xl: 1.5rem;\n --fs-2xl: 2.25rem;\n --fs-3xl: 3rem;\n /* font-weight */\n --fw-thin: 100;\n --fw-light: 300;\n --fw-regular: 400;\n --fw-medium: 500;\n --fw-bold: 700;\n --fw-black: 900;\n --input-padding: 0.5rem;\n --input-border-radius: 0.25rem;\n --input-font-size: var(--fs-base); }\n\n:root {\n --color-white: #fff;\n --color-black: #333;\n --color-gray-l5: #f1f1f1;\n --color-gray-l2: #adadad;\n --color-gray-l1: #dcdcdc;\n --color-gray-d1: #666;\n --color-gray-d3: #333;\n --color-orange: #feba35;\n --color-red: #ec040b;\n --color-green: hsl(148, 100%, 26%);\n --color-primary: #0070c4;\n --color-primary-d1: #004f84;\n --color-primary--hover: var(--color-primary-d1);\n --color-text: var(--color-gray-d3);\n --color-error: var(--color-red);\n --color-disabled: var(--color-gray-l2);\n --color-input-background: var(--color-white);\n --color-input-border: var(--color-gray-d1);\n --color-input-border--hover: var(--color-primary-d1);\n --color-input: var(--color-gray-d3);\n --color-input--focused: var(--color-orange);\n --color-button-primary: var(--color-primary);\n --color-button-primary--hover: var(--color-primary-d1);\n --color-button-tertiary: var(--color-gray-l2);\n --color-button-tertiary--hover: var(--color-gray-l5); }\n\n.goa-textarea {\n outline: none;\n transition: box-shadow 0.1s ease-in;\n border: 1px solid var(--color-input-border);\n border-radius: 3px;\n background: white;\n color: var(--color-input);\n padding: var(--input-padding);\n font-size: var(--input-font-size);\n display: block;\n width: 100%; }\n .goa-textarea:hover {\n border-color: var(--color-input-border--hover); }\n .goa-textarea:active, .goa-textarea:focus {\n box-shadow: 0 0 0 3px var(--color-input--focused); }\n .goa-textarea:disabled {\n border-color: var(--color-disabled); }\n .goa-textarea:disabled:hover {\n border-color: var(--color-disabled); }\n .goa-textarea:disabled:focus {\n box-shadow: none; }\n\n.goa-textarea:disabled {\n border-color: var(--color-disabled); }\n .goa-textarea:disabled:hover {\n border-color: var(--color-disabled); }\n .goa-textarea:disabled:focus {\n box-shadow: none; }\n\n.goa-state--error textarea,\n.goa-state--error textarea:hover {\n border: 2px solid var(--color-red); }\n";
|
|
2074
2074
|
styleInject(css_248z$e);
|
|
2075
2075
|
|
|
2076
|
+
var css_248z$f = ".goa-scrollable {\n overflow: hidden;\n height: 100%;\n}\n\n.goa-scrollable > div::-webkit-scrollbar {\n width: 6px;\n}\n\n.goa-scrollable > div::-webkit-scrollbar-track {\n background: #f1f1f1;\n}\n\n.goa-scrollable > div::-webkit-scrollbar-thumb {\n background: #888;\n}\n\n.goa-scrollable > div::-webkit-scrollbar-thumb:hover {\n background: #555;\n}\n";
|
|
2077
|
+
styleInject(css_248z$f);
|
|
2078
|
+
|
|
2076
2079
|
var GoAScrollable = function GoAScrollable(_ref) {
|
|
2077
2080
|
var vertical = _ref.vertical,
|
|
2078
2081
|
horizontal = _ref.horizontal,
|
|
@@ -2095,18 +2098,18 @@
|
|
|
2095
2098
|
}, children));
|
|
2096
2099
|
};
|
|
2097
2100
|
|
|
2098
|
-
var css_248z$
|
|
2099
|
-
styleInject(css_248z$f);
|
|
2100
|
-
|
|
2101
|
-
var css_248z$g = "/* Root ============================================================================== */\n\n.modal-root {\n position: fixed;\n top: 0;\n left: 0;\n bottom: 0;\n width: 100%;\n display: flex;\n flex-direction: column;\n align-items: center;\n justify-content: center;\n z-index: 1000;\n}\n\n/* Modal ============================================================================== */\n\n.modal {\n position: relative;\n background: #fff;\n z-index: 1002;\n box-shadow: 6px 6px 6px rgba(0, 0, 0, 0.2);\n border-radius: 4px;\n}\n\n@media (max-width: 639px) {\n .modal {\n width: 90%;\n max-height: 90%;\n }\n}\n\n@media (min-width: 640px) {\n .modal {\n margin: 1rem;\n max-height: 80%;\n width: 600px;\n }\n}\n@media (min-width: 1024px) {\n .modal {\n width: 65ch;\n }\n}\n\n/* Modal Content ============================================================================== */\n\n.modal-content {\n display: flex;\n flex-direction: column;\n height: 100%;\n}\n\n/* Modal Actions ============================================================================== */\n\n.modal-actions {\n text-align: right;\n margin: 1.5rem;\n}\n\n@media (max-width: 639px) {\n .modal-actions button + button {\n margin-top: 0.5rem;\n }\n .modal-actions button {\n display: block;\n width: 100%;\n }\n}\n\n@media (min-width: 640px) {\n .modal-actions > button {\n margin-right: 0;\n }\n .modal-actions > button + button {\n margin-left: 0.5rem;\n }\n}\n\n/* Modal Title ============================================================================ */\n\n.modal-title {\n font-size: var(--fs-xl);\n padding: 1rem 1.5rem;\n margin-right: 40px; /* close icon spacing */\n}\n\n/* Modal Background ======================================================================= */\n\n.modal-background {\n position: fixed;\n inset: 0;\n background: rgba(0, 0, 0, 0.5);\n z-index: 1001;\n}\n\n/* Modal Close Icon ======================================================================= */\n\n.modal-close {\n position: absolute;\n top: 0.5rem;\n right: 0.5rem;\n}\n";
|
|
2101
|
+
var css_248z$g = "/* Fade in */\n.fade-in-init {\n display: none;\n}\n.fade-in-start {\n display: block;\n opacity: 0;\n transition: opacity 200ms ease-in;\n}\n.fade-in-active {\n opacity: 1;\n}\n\n/* Fade out */\n.fade-out-init {\n display: block;\n}\n.fade-out-start {\n display: block;\n opacity: 1;\n transition: opacity 200ms ease-in;\n}\n.fade-out-active {\n opacity: 0;\n}\n\n/* ======= Slide in/out Up */\n\n/* Slide in up */\n.slide-in-up-init {\n transition: translateY(0);\n display: none;\n}\n.slide-in-up-start {\n display: block;\n transform: translateY(100vh);\n transition: transform 300ms ease-out;\n}\n.slide-in-up-active {\n transform: translateY(0);\n}\n\n/* Slide out up */\n.slide-out-up-init {\n transform: translateY(0);\n display: block;\n}\n.slide-out-up-start {\n transition: transform 300ms ease-in;\n}\n.slide-out-up-active {\n transform: translateY(-100vh);\n}\n\n/* ======= Slide in/out Down */\n\n/* Slide in down */\n.slide-in-down-init {\n transition: translateY(0);\n display: none;\n}\n.slide-in-down-start {\n display: block;\n transform: translateY(-100vh);\n transition: transform 300ms ease-out;\n}\n.slide-in-down-active {\n transform: translateY(0);\n}\n\n/* Slide out down */\n.slide-out-down-init {\n transform: translateY(0);\n display: block;\n}\n.slide-out-down-start {\n transform: translateY(0);\n transition: transform 300ms ease-in;\n}\n.slide-out-down-active {\n transform: translateY(100vh);\n}\n/* ======= Slide in/out Left */\n\n/* Slide in left */\n.slide-in-left-init {\n transition: translateX(0);\n display: none;\n}\n.slide-in-left-start {\n display: block;\n transform: translateX(-100vw);\n transition: transform 300ms ease-out;\n}\n.slide-in-left-active {\n transform: translateX(0);\n}\n\n/* Slide out left */\n.slide-out-left-init {\n transform: translateX(0);\n display: block;\n}\n.slide-out-left-start {\n transform: translateX(0);\n transition: transform 300ms ease-in;\n}\n.slide-out-left-active {\n transform: translateX(-100vw);\n}\n\n/* ======= Slide in/out Right */\n\n/* Slide in left */\n.slide-in-right-init {\n transition: translateX(0);\n display: none;\n}\n.slide-in-right-start {\n display: block;\n transform: translateX(100vw);\n transition: transform 300ms ease-out;\n}\n.slide-in-right-active {\n transform: translateX(0);\n}\n\n/* Slide out right */\n.slide-out-right-init {\n transform: translateX(0);\n display: block;\n}\n.slide-out-right-start {\n transform: translateX(0);\n transition: transform 300ms ease-in;\n}\n.slide-out-right-active {\n transform: translateX(100vw);\n}\n";
|
|
2102
2102
|
styleInject(css_248z$g);
|
|
2103
2103
|
|
|
2104
|
-
var css_248z$h = "/*
|
|
2104
|
+
var css_248z$h = "/* Root ============================================================================== */\n\n.modal-root {\n position: fixed;\n top: 0;\n left: 0;\n bottom: 0;\n width: 100%;\n display: flex;\n flex-direction: column;\n align-items: center;\n justify-content: center;\n z-index: 1000;\n}\n\n/* Modal ============================================================================== */\n\n.modal {\n position: relative;\n background: #fff;\n z-index: 1002;\n box-shadow: 6px 6px 6px rgba(0, 0, 0, 0.2);\n border-radius: 4px;\n}\n\n@media (max-width: 639px) {\n .modal {\n width: 90%;\n max-height: 90%;\n }\n}\n\n@media (min-width: 640px) {\n .modal {\n margin: 1rem;\n max-height: 80%;\n width: 600px;\n }\n}\n@media (min-width: 1024px) {\n .modal {\n width: 65ch;\n }\n}\n\n/* Modal Content ============================================================================== */\n\n.modal-content {\n display: flex;\n flex-direction: column;\n height: 100%;\n}\n\n/* Modal Actions ============================================================================== */\n\n.modal-actions {\n text-align: right;\n margin: 1.5rem;\n}\n\n@media (max-width: 639px) {\n .modal-actions button + button {\n margin-top: 0.5rem;\n }\n .modal-actions button {\n display: block;\n width: 100%;\n }\n}\n\n@media (min-width: 640px) {\n .modal-actions > button {\n margin-right: 0;\n }\n .modal-actions > button + button {\n margin-left: 0.5rem;\n }\n}\n\n/* Modal Title ============================================================================ */\n\n.modal-title {\n font-size: var(--fs-xl);\n padding: 1rem 1.5rem;\n margin-right: 40px; /* close icon spacing */\n}\n\n/* Modal Background ======================================================================= */\n\n.modal-background {\n position: fixed;\n inset: 0;\n background: rgba(0, 0, 0, 0.5);\n z-index: 1001;\n}\n\n/* Modal Close Icon ======================================================================= */\n\n.modal-close {\n position: absolute;\n top: 0.5rem;\n right: 0.5rem;\n}\n";
|
|
2105
2105
|
styleInject(css_248z$h);
|
|
2106
2106
|
|
|
2107
|
-
var css_248z$i = ":root {\n --color-white: #fff;\n --color-black: #333;\n --color-gray-l5: #f1f1f1;\n --color-gray-l2: #adadad;\n --color-gray-l1: #dcdcdc;\n --color-gray-d1: #666;\n --color-gray-d3: #333;\n --color-orange: #feba35;\n --color-red:
|
|
2107
|
+
var css_248z$i = ":root {\n --color-white: #fff;\n --color-black: #333;\n --color-gray-l5: #f1f1f1;\n --color-gray-l2: #adadad;\n --color-gray-l1: #dcdcdc;\n --color-gray-d1: #666;\n --color-gray-d3: #333;\n --color-orange: #feba35;\n --color-red: #ec040b;\n --color-green: hsl(148, 100%, 26%);\n --color-primary: #0070c4;\n --color-primary-d1: #004f84;\n --color-primary--hover: var(--color-primary-d1);\n --color-text: var(--color-gray-d3);\n --color-error: var(--color-red);\n --color-disabled: var(--color-gray-l2);\n --color-input-background: var(--color-white);\n --color-input-border: var(--color-gray-d1);\n --color-input-border--hover: var(--color-primary-d1);\n --color-input: var(--color-gray-d3);\n --color-input--focused: var(--color-orange);\n --color-button-primary: var(--color-primary);\n --color-button-primary--hover: var(--color-primary-d1);\n --color-button-tertiary: var(--color-gray-l2);\n --color-button-tertiary--hover: var(--color-gray-l5); }\n\n:root {\n /* font-size */\n --fs-xs: 0.75rem;\n --fs-sm: 0.875rem;\n --fs-base: 1.125rem;\n --fs-lg: 1.25rem;\n --fs-xl: 1.5rem;\n --fs-2xl: 2.25rem;\n --fs-3xl: 3rem;\n /* font-weight */\n --fw-thin: 100;\n --fw-light: 300;\n --fw-regular: 400;\n --fw-medium: 500;\n --fw-bold: 700;\n --fw-black: 900;\n --input-padding: 0.5rem;\n --input-border-radius: 0.25rem;\n --input-font-size: var(--fs-base); }\n\n.goa-form {\n box-sizing: border-box; }\n\n.goa-form *,\n.goa-form *:before,\n.goa-form *:after {\n box-sizing: inherit; }\n\n.goa-form-row {\n display: flex;\n flex-direction: column;\n justify-content: space-between; }\n\n@media screen and (min-width: 640px) {\n .goa-form-row {\n gap: 1.75rem;\n flex-direction: row; } }\n\n.goa-form-item {\n flex: 1 1 auto;\n margin-bottom: 1rem; }\n .goa-form-item label {\n display: block;\n font-weight: bold;\n color: #333;\n font-size: var(--fs-base);\n line-height: calc(var(--fs-base) + 1rem); }\n .goa-form-item label em {\n color: var(--color-gray-d1);\n font-style: normal;\n font-weight: var(--fw-regular);\n font-size: var(--fs-sm); }\n .goa-form-item input,\n .goa-form-item textarea {\n display: block;\n width: 100%;\n font-size: var(--fs-base); }\n .goa-form-item.goa-state--error .error-msg {\n font-size: var(--fs-sm);\n line-height: calc(var(--fs-sm) + 0.5rem);\n color: var(--color-red); }\n\n.help-msg {\n font-size: var(--fs-sm);\n color: var(--color-gray-d3);\n line-height: calc(var(--fs-sm) + 0.5rem); }\n\n.goa-form-actions {\n display: flex;\n flex-wrap: wrap;\n margin-top: 2rem; }\n .goa-form-actions button,\n .goa-form-actions .goa-link-button {\n margin: 0; }\n @media (max-width: 639px) {\n .goa-form-actions button,\n .goa-form-actions .goa-link-button {\n width: 100%; }\n .goa-form-actions button + button,\n .goa-form-actions button + .goa-link-button,\n .goa-form-actions .goa-link-button + button,\n .goa-form-actions .goa-link-button + .goa-link-button {\n margin-top: 0.5rem; } }\n @media (min-width: 640px) {\n .goa-form-actions button,\n .goa-form-actions .goa-link-button {\n min-width: 6rem; }\n .goa-form-actions button + button,\n .goa-form-actions button + .goa-link-button,\n .goa-form-actions .goa-link-button + button,\n .goa-form-actions .goa-link-button + .goa-link-button {\n margin-left: 0.5rem; } }\n\n.goa-form-actions--left {\n justify-content: flex-start; }\n\n.goa-form-actions--right {\n justify-content: flex-end; }\n";
|
|
2108
2108
|
styleInject(css_248z$i);
|
|
2109
2109
|
|
|
2110
|
+
var css_248z$j = ":root {\n --color-white: #fff;\n --color-black: #333;\n --color-gray-l5: #f1f1f1;\n --color-gray-l2: #adadad;\n --color-gray-l1: #dcdcdc;\n --color-gray-d1: #666;\n --color-gray-d3: #333;\n --color-orange: #feba35;\n --color-red: #ec040b;\n --color-green: hsl(148, 100%, 26%);\n --color-primary: #0070c4;\n --color-primary-d1: #004f84;\n --color-primary--hover: var(--color-primary-d1);\n --color-text: var(--color-gray-d3);\n --color-error: var(--color-red);\n --color-disabled: var(--color-gray-l2);\n --color-input-background: var(--color-white);\n --color-input-border: var(--color-gray-d1);\n --color-input-border--hover: var(--color-primary-d1);\n --color-input: var(--color-gray-d3);\n --color-input--focused: var(--color-orange);\n --color-button-primary: var(--color-primary);\n --color-button-primary--hover: var(--color-primary-d1);\n --color-button-tertiary: var(--color-gray-l2);\n --color-button-tertiary--hover: var(--color-gray-l5); }\n\n:root {\n /* font-size */\n --fs-xs: 0.75rem;\n --fs-sm: 0.875rem;\n --fs-base: 1.125rem;\n --fs-lg: 1.25rem;\n --fs-xl: 1.5rem;\n --fs-2xl: 2.25rem;\n --fs-3xl: 3rem;\n /* font-weight */\n --fw-thin: 100;\n --fw-light: 300;\n --fw-regular: 400;\n --fw-medium: 500;\n --fw-bold: 700;\n --fw-black: 900;\n --input-padding: 0.5rem;\n --input-border-radius: 0.25rem;\n --input-font-size: var(--fs-base); }\n\n.goa-dropdown-box {\n --color-selected-bg--hover: var(--color-gray-l5);\n --color-selected-text--hover: var(--color-gray-d1);\n position: relative; }\n\n.goa-dropdown-background {\n position: fixed;\n inset: 0;\n opacity: 1; }\n\n.goa-dropdown-input {\n outline: none;\n transition: box-shadow 0.1s ease-in;\n border: 1px solid var(--color-input-border);\n border-radius: 3px;\n background: white;\n color: var(--color-input);\n padding: var(--input-padding);\n font-size: var(--input-font-size);\n display: flex;\n align-items: center;\n justify-content: space-between;\n cursor: pointer; }\n .goa-dropdown-input:hover {\n border-color: var(--color-input-border--hover); }\n .goa-dropdown-input:active, .goa-dropdown-input:focus {\n box-shadow: 0 0 0 3px var(--color-input--focused); }\n .goa-dropdown-input:disabled {\n border-color: var(--color-disabled); }\n .goa-dropdown-input:disabled:hover {\n border-color: var(--color-disabled); }\n .goa-dropdown-input:disabled:focus {\n box-shadow: none; }\n .goa-dropdown-input input {\n line-height: 1.5rem;\n padding: 0;\n -webkit-user-select: none;\n -moz-user-select: none;\n -ms-user-select: none;\n user-select: none; }\n .goa-dropdown-input input,\n .goa-dropdown-input input:hover,\n .goa-dropdown-input input:focus {\n box-shadow: none; }\n\n.goa-dropdown-input--disabled {\n opacity: 0.5;\n cursor: default; }\n .goa-dropdown-input--disabled:hover, .goa-dropdown-input--disabled:focus {\n cursor: default;\n box-shadow: none; }\n\n.goa-dropdown-leading-icon svg {\n width: 80%; }\n\n.goa-dropdown-input input {\n flex: 1 1 auto;\n border: none;\n outline: none;\n cursor: pointer; }\n .goa-dropdown-input input ::-moz-placeholder {\n text-overflow: ellipsis; }\n .goa-dropdown-input input :-ms-input-placeholder {\n text-overflow: ellipsis; }\n .goa-dropdown-input input ::placeholder {\n text-overflow: ellipsis; }\n\n.goa-icon ~ input {\n padding-left: 0.5rem; }\n\n.goa-dropdown-input--disabled input {\n cursor: default; }\n\n.goa-dropdown-list {\n position: absolute;\n left: 0;\n right: 0;\n margin: 0;\n padding: 0;\n list-style-type: none;\n background: var(--color-input-background);\n border-bottom-left-radius: var(--input-border-radius);\n border-bottom-right-radius: var(--input-border-radius);\n box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);\n z-index: 99; }\n\n.goa-dropdown-list hr {\n border: none;\n border-top: 1px solid var(--color-gray-l5);\n margin: 0; }\n\n.goa-dropdown-list label {\n font-size: var(--fs-sm);\n font-weight: var(--fw-bold);\n padding-left: 0.5rem; }\n\n.goa-dropdown-option {\n margin: 0;\n padding: 0.5rem;\n cursor: pointer;\n color: var(--color-input); }\n .goa-dropdown-option:hover {\n background: var(--color-selected-bg--hover);\n color: var(--color-primary-d1); }\n\n.goa-dropdown-option--disabled {\n opacity: 0.5;\n cursor: default; }\n .goa-dropdown-option--disabled:hover {\n cursor: default;\n color: var(--color-selected-text--hover); }\n\n.goa-dropdown-option--selected {\n background: var(--color-primary);\n color: var(--color-white); }\n .goa-dropdown-option--selected:hover {\n background: var(--color-primary-d1);\n color: var(--color-white); }\n\n.dropdown-group-content .goa-dropdown-option {\n padding-left: 1.5rem; }\n\n.goa-state--error .goa-dropdown-input {\n border: 2px solid var(--color-error); }\n";
|
|
2111
|
+
styleInject(css_248z$j);
|
|
2112
|
+
|
|
2110
2113
|
var GoADropdownOption = function GoADropdownOption(props) {
|
|
2111
2114
|
var onClick = function onClick() {
|
|
2112
2115
|
if (!props.disabled) {
|
|
@@ -2122,7 +2125,11 @@
|
|
|
2122
2125
|
};
|
|
2123
2126
|
|
|
2124
2127
|
var MAX_HEIGHT = 300;
|
|
2125
|
-
var GoADropdown = function GoADropdown(
|
|
2128
|
+
var GoADropdown = function GoADropdown(_ref) {
|
|
2129
|
+
var _ref$selectedValues = _ref.selectedValues,
|
|
2130
|
+
selectedValues = _ref$selectedValues === void 0 ? [] : _ref$selectedValues,
|
|
2131
|
+
props = _objectWithoutProperties(_ref, ["selectedValues"]);
|
|
2132
|
+
|
|
2126
2133
|
var _useState = React.useState(false),
|
|
2127
2134
|
_useState2 = _slicedToArray(_useState, 2),
|
|
2128
2135
|
isMenuVisible = _useState2[0],
|
|
@@ -2147,7 +2154,7 @@
|
|
|
2147
2154
|
if (child.props.value) {
|
|
2148
2155
|
return React__default.cloneElement(child, _objectSpread2(_objectSpread2({}, child.props), {}, {
|
|
2149
2156
|
onClick: handleSelection,
|
|
2150
|
-
selected:
|
|
2157
|
+
selected: selectedValues.includes(child.props.value),
|
|
2151
2158
|
_testId: "".concat(props.name, "-dropdown-option--").concat(child.props.value)
|
|
2152
2159
|
}));
|
|
2153
2160
|
}
|
|
@@ -2164,12 +2171,12 @@
|
|
|
2164
2171
|
var values;
|
|
2165
2172
|
|
|
2166
2173
|
if (props.multiSelect) {
|
|
2167
|
-
if (
|
|
2168
|
-
values =
|
|
2174
|
+
if (selectedValues.includes(value)) {
|
|
2175
|
+
values = selectedValues.filter(function (v) {
|
|
2169
2176
|
return v !== value;
|
|
2170
2177
|
});
|
|
2171
2178
|
} else {
|
|
2172
|
-
values = [].concat(_toConsumableArray(
|
|
2179
|
+
values = [].concat(_toConsumableArray(selectedValues), [value]);
|
|
2173
2180
|
}
|
|
2174
2181
|
} else {
|
|
2175
2182
|
values = [value];
|
|
@@ -2203,7 +2210,7 @@
|
|
|
2203
2210
|
var selectedLabels = React__default.Children.map(props.children, function (child) {
|
|
2204
2211
|
return child;
|
|
2205
2212
|
}).filter(function (child) {
|
|
2206
|
-
return
|
|
2213
|
+
return selectedValues.includes(child.props.value);
|
|
2207
2214
|
}).map(function (child) {
|
|
2208
2215
|
return child.props.label;
|
|
2209
2216
|
});
|
|
@@ -2251,19 +2258,14 @@
|
|
|
2251
2258
|
}, bindChildren())));
|
|
2252
2259
|
};
|
|
2253
2260
|
|
|
2254
|
-
var css_248z$
|
|
2255
|
-
styleInject(css_248z$
|
|
2256
|
-
|
|
2257
|
-
var GoARadio = function GoARadio(_ref) {
|
|
2258
|
-
var _ref$state = _ref.state,
|
|
2259
|
-
state = _ref$state === void 0 ? 'valid' : _ref$state,
|
|
2260
|
-
props = _objectWithoutProperties(_ref, ["state"]);
|
|
2261
|
+
var css_248z$k = ":root {\n --color-white: #fff;\n --color-black: #333;\n --color-gray-l5: #f1f1f1;\n --color-gray-l2: #adadad;\n --color-gray-l1: #dcdcdc;\n --color-gray-d1: #666;\n --color-gray-d3: #333;\n --color-orange: #feba35;\n --color-red: #ec040b;\n --color-green: hsl(148, 100%, 26%);\n --color-primary: #0070c4;\n --color-primary-d1: #004f84;\n --color-primary--hover: var(--color-primary-d1);\n --color-text: var(--color-gray-d3);\n --color-error: var(--color-red);\n --color-disabled: var(--color-gray-l2);\n --color-input-background: var(--color-white);\n --color-input-border: var(--color-gray-d1);\n --color-input-border--hover: var(--color-primary-d1);\n --color-input: var(--color-gray-d3);\n --color-input--focused: var(--color-orange);\n --color-button-primary: var(--color-primary);\n --color-button-primary--hover: var(--color-primary-d1);\n --color-button-tertiary: var(--color-gray-l2);\n --color-button-tertiary--hover: var(--color-gray-l5); }\n\n/* Radio Group */\n.goa-radio-group--horizontal {\n display: flex;\n flex-direction: row; }\n\n.goa-radio-group--vertical {\n display: inline-flex;\n flex-direction: column; }\n\n/* Radio */\nlabel.goa-radio {\n --goa-border-color: var(--color-input-border);\n --goa-border-color--checked: var(--color-primary);\n --goa-radio-color--error: var(--color-error);\n --goa-radio-outline-color: var(--color-input--focused);\n --goa-radio-outline-width: 3px;\n --goa-radio-diameter: 1.5rem;\n --goa-radio-border-width: 1px;\n --goa-radio-border-width--checked: 7px;\n box-sizing: border-box;\n display: flex;\n align-items: center;\n min-height: 3rem; }\n\n.goa-radio:hover {\n cursor: pointer; }\n\n.goa-radio *,\n.goa-radio *:before,\n.goa-radio *:after {\n box-sizing: border-box; }\n\n.goa-radio input[type='radio'] {\n display: none; }\n\n.goa-radio-label {\n padding: 0.5rem 1.5rem 0.5rem 0.5rem; }\n\n.goa-radio-icon {\n display: inline-block;\n height: var(--goa-radio-diameter);\n width: var(--goa-radio-diameter);\n border-radius: 50%;\n transition: box-shadow 100ms ease-in-out; }\n\n.goa-radio:hover > input:not(:disabled) ~ .goa-radio-icon {\n box-shadow: 0 0 0 var(--goa-radio-outline-width) var(--goa-radio-outline-color); }\n\n.goa-radio--disabled:hover {\n cursor: default; }\n\n/* States */\n/* Checked */\ninput[type='radio']:checked ~ .goa-radio-icon {\n border: var(--goa-radio-border-width--checked) solid var(--goa-border-color--checked); }\n\n/* Not checked */\ninput[type='radio']:not(:checked) ~ .goa-radio-icon {\n border: var(--goa-radio-border-width) solid var(--goa-border-color); }\n\n/* Disabled */\ninput[type='radio']:disabled ~ .goa-radio-icon {\n border: var(--goa-radio-border-width) solid var(--goa-border-color);\n opacity: 0.3; }\n\n/* Disabled and checked */\ninput[type='radio']:disabled:checked ~ .goa-radio-icon {\n border: var(--goa-radio-border-width--checked) solid var(--goa-border-color--checked);\n opacity: 0.3; }\n\n/* Error */\n.goa-state--error input[type='radio']:checked ~ .goa-radio-icon {\n border: 7px solid var(--goa-radio-color--error); }\n\n.goa-state--error input[type='radio']:not(:checked) ~ .goa-radio-icon {\n border: 2px solid var(--goa-radio-color--error); }\n";
|
|
2262
|
+
styleInject(css_248z$k);
|
|
2261
2263
|
|
|
2264
|
+
var GoARadio = function GoARadio(props) {
|
|
2262
2265
|
function getCss() {
|
|
2263
2266
|
return classnames({
|
|
2264
2267
|
'goa-radio': true,
|
|
2265
|
-
'goa-radio--disabled': props.disabled
|
|
2266
|
-
'goa-error': state === 'error'
|
|
2268
|
+
'goa-radio--disabled': props.disabled
|
|
2267
2269
|
});
|
|
2268
2270
|
}
|
|
2269
2271
|
|
|
@@ -2284,22 +2286,32 @@
|
|
|
2284
2286
|
className: "goa-radio-icon"
|
|
2285
2287
|
}), /*#__PURE__*/React__default.createElement("span", {
|
|
2286
2288
|
className: "goa-radio-label"
|
|
2287
|
-
}, props.children));
|
|
2289
|
+
}, props.children || props.label));
|
|
2288
2290
|
};
|
|
2289
2291
|
|
|
2290
2292
|
var GoARadioGroup = function GoARadioGroup(_ref) {
|
|
2291
|
-
var
|
|
2293
|
+
var name = _ref.name,
|
|
2292
2294
|
value = _ref.value,
|
|
2293
2295
|
children = _ref.children,
|
|
2294
|
-
orientation = _ref.orientation,
|
|
2295
|
-
|
|
2296
|
+
_ref$orientation = _ref.orientation,
|
|
2297
|
+
orientation = _ref$orientation === void 0 ? 'vertical' : _ref$orientation,
|
|
2298
|
+
onChange = _ref.onChange,
|
|
2299
|
+
childAttrs = _objectWithoutProperties(_ref, ["name", "value", "children", "orientation", "onChange"]);
|
|
2300
|
+
|
|
2301
|
+
function onChangeHandler(value) {
|
|
2302
|
+
onChange(name, value);
|
|
2303
|
+
}
|
|
2296
2304
|
|
|
2297
2305
|
function getChildren() {
|
|
2298
2306
|
return React.Children.map(children, function (child) {
|
|
2299
|
-
var key = "".concat(
|
|
2307
|
+
var key = "".concat(name, "-").concat(child.props.value);
|
|
2308
|
+
|
|
2309
|
+
var _name = "".concat(name, "-").concat(Date.now());
|
|
2310
|
+
|
|
2300
2311
|
return React__default.cloneElement(child, _objectSpread2(_objectSpread2({}, childAttrs), {}, {
|
|
2312
|
+
name: _name,
|
|
2301
2313
|
checked: child.props.value === value,
|
|
2302
|
-
onChange:
|
|
2314
|
+
onChange: onChangeHandler,
|
|
2303
2315
|
key: key
|
|
2304
2316
|
}));
|
|
2305
2317
|
});
|
|
@@ -2310,8 +2322,8 @@
|
|
|
2310
2322
|
}, getChildren()));
|
|
2311
2323
|
};
|
|
2312
2324
|
|
|
2313
|
-
var css_248z$
|
|
2314
|
-
styleInject(css_248z$
|
|
2325
|
+
var css_248z$l = "@use '../variables/main.css';\n/* Palette */\n/* Semantic usages */\n@-webkit-keyframes pulse {\n 0% {\n opacity: 0.5; }\n 50% {\n opacity: 1; }\n 100% {\n opacity: 0.5; } }\n@keyframes pulse {\n 0% {\n opacity: 0.5; }\n 50% {\n opacity: 1; }\n 100% {\n opacity: 0.5; } }\n\n[data-skeleton] {\n pointer-events: none;\n -webkit-user-select: none;\n -moz-user-select: none;\n -ms-user-select: none;\n user-select: none; }\n [data-skeleton] * {\n border-color: #ddd !important;\n color: transparent !important; }\n [data-skeleton] p,\n [data-skeleton] a {\n background-color: #ddd !important;\n -webkit-animation: pulse 2s infinite ease-in-out;\n animation: pulse 2s infinite ease-in-out;\n display: inline;\n line-height: 0 !important;\n font-size: 50% !important; }\n [data-skeleton] p::after,\n [data-skeleton] a::after {\n content: '' !important;\n display: block !important;\n margin-bottom: 1rem !important;\n background-size: contain; }\n [data-skeleton] h1,\n [data-skeleton] h2,\n [data-skeleton] h3,\n [data-skeleton] h4,\n [data-skeleton] h5,\n [data-skeleton] h6 {\n background-color: #ddd !important;\n -webkit-animation: pulse 2s infinite ease-in-out;\n animation: pulse 2s infinite ease-in-out;\n margin-bottom: 1rem; }\n [data-skeleton] h1 {\n height: calc(0.6 * var(--fs-3xl)) !important; }\n [data-skeleton] h2 {\n height: calc(0.6 * var(--fs-2xl)) !important; }\n [data-skeleton] h3 {\n height: calc(0.6 * var(--fs-xl)) !important; }\n [data-skeleton] h4 {\n height: calc(0.6 * var(--fs-lg)) !important; }\n [data-skeleton] img {\n background-color: #ddd !important;\n -webkit-animation: pulse 2s infinite ease-in-out;\n animation: pulse 2s infinite ease-in-out; }\n\n/* basic styles */\n.skeleton {\n background-color: #ddd !important;\n -webkit-animation: pulse 2s infinite ease-in-out;\n animation: pulse 2s infinite ease-in-out;\n background: #dcdcdc;\n overflow: hidden;\n margin: 10px 0; }\n\n.skeleton.text {\n width: 100%;\n height: 12px;\n border-radius: 4px; }\n\n.skeleton.paragraph {\n width: 100%;\n height: 70px;\n border-radius: 4px; }\n\n.skeleton.title {\n width: 50%;\n height: 20px;\n margin-bottom: 15px;\n border-radius: 4px; }\n\n.skeleton.avatar {\n width: 100px;\n height: 100px;\n border-radius: 50%; }\n\n.skeleton.thumbnail {\n width: 100px;\n height: 100px;\n border-radius: 4px; }\n\n/* skeleton image text */\n.skeleton-image-content {\n display: flex;\n flex-direction: row;\n gap: 30px; }\n\n.skeleton-image-content__text {\n flex: 1 1 auto; }\n\n/* skeleton content */\n.skeleton-content {\n display: grid;\n grid-template-columns: 1fr;\n gap: 30px;\n align-items: left; }\n";
|
|
2326
|
+
styleInject(css_248z$l);
|
|
2315
2327
|
|
|
2316
2328
|
var GoASkeletonElement = function GoASkeletonElement(_ref) {
|
|
2317
2329
|
var _ref$type = _ref.type,
|
|
@@ -2378,8 +2390,8 @@
|
|
|
2378
2390
|
}), elements));
|
|
2379
2391
|
};
|
|
2380
2392
|
|
|
2381
|
-
var css_248z$
|
|
2382
|
-
styleInject(css_248z$
|
|
2393
|
+
var css_248z$m = "/* Palette */\n/* Semantic usages */\n@use '../variables/main.css';\n/* Palette */\n/* Semantic usages */\n@-webkit-keyframes pulse {\n 0% {\n opacity: 0.5; }\n 50% {\n opacity: 1; }\n 100% {\n opacity: 0.5; } }\n@keyframes pulse {\n 0% {\n opacity: 0.5; }\n 50% {\n opacity: 1; }\n 100% {\n opacity: 0.5; } }\n\n[data-skeleton] {\n pointer-events: none;\n -webkit-user-select: none;\n -moz-user-select: none;\n -ms-user-select: none;\n user-select: none; }\n [data-skeleton] * {\n border-color: #ddd !important;\n color: transparent !important; }\n [data-skeleton] p,\n [data-skeleton] a {\n background-color: #ddd !important;\n -webkit-animation: pulse 2s infinite ease-in-out;\n animation: pulse 2s infinite ease-in-out;\n display: inline;\n line-height: 0 !important;\n font-size: 50% !important; }\n [data-skeleton] p::after,\n [data-skeleton] a::after {\n content: '' !important;\n display: block !important;\n margin-bottom: 1rem !important;\n background-size: contain; }\n [data-skeleton] h1,\n [data-skeleton] h2,\n [data-skeleton] h3,\n [data-skeleton] h4,\n [data-skeleton] h5,\n [data-skeleton] h6 {\n background-color: #ddd !important;\n -webkit-animation: pulse 2s infinite ease-in-out;\n animation: pulse 2s infinite ease-in-out;\n margin-bottom: 1rem; }\n [data-skeleton] h1 {\n height: calc(0.6 * var(--fs-3xl)) !important; }\n [data-skeleton] h2 {\n height: calc(0.6 * var(--fs-2xl)) !important; }\n [data-skeleton] h3 {\n height: calc(0.6 * var(--fs-xl)) !important; }\n [data-skeleton] h4 {\n height: calc(0.6 * var(--fs-lg)) !important; }\n [data-skeleton] img {\n background-color: #ddd !important;\n -webkit-animation: pulse 2s infinite ease-in-out;\n animation: pulse 2s infinite ease-in-out; }\n\n/* basic styles */\n.skeleton {\n background-color: #ddd !important;\n -webkit-animation: pulse 2s infinite ease-in-out;\n animation: pulse 2s infinite ease-in-out;\n background: #dcdcdc;\n overflow: hidden;\n margin: 10px 0; }\n\n.skeleton.text {\n width: 100%;\n height: 12px;\n border-radius: 4px; }\n\n.skeleton.paragraph {\n width: 100%;\n height: 70px;\n border-radius: 4px; }\n\n.skeleton.title {\n width: 50%;\n height: 20px;\n margin-bottom: 15px;\n border-radius: 4px; }\n\n.skeleton.avatar {\n width: 100px;\n height: 100px;\n border-radius: 50%; }\n\n.skeleton.thumbnail {\n width: 100px;\n height: 100px;\n border-radius: 4px; }\n\n/* skeleton image text */\n.skeleton-image-content {\n display: flex;\n flex-direction: row;\n gap: 30px; }\n\n.skeleton-image-content__text {\n flex: 1 1 auto; }\n\n/* skeleton content */\n.skeleton-content {\n display: grid;\n grid-template-columns: 1fr;\n gap: 30px;\n align-items: left; }\n\n.goa-card {\n box-sizing: border-box;\n background: #fff;\n border: 1px solid #dcdcdc;\n transition: opacity 300ms ease-in-out;\n /* size variants ***/ }\n .goa-card .card-content {\n padding: 28px;\n border-top: 8px solid #0081a2; }\n .goa-card .card-content .goa-title,\n .goa-card .card-content .goa-text,\n .goa-card .card-content .goa-content {\n margin-bottom: 28px; }\n .goa-card .card-content .goa-text {\n color: #333;\n font-size: var(--fs-base);\n line-height: 28px; }\n .goa-card .card-content .goa-footer {\n font-size: var(--fs-base); }\n .goa-card .card-content .goa-title {\n font-size: var(--fs-xl);\n font-weight: 400;\n line-height: 32px; }\n .goa-card .goa-poster {\n position: relative;\n display: block;\n padding: 56.25% 0 0;\n overflow: hidden;\n background: #e5e5e5; }\n .goa-card .goa-poster:empty {\n display: none; }\n .goa-card .goa-poster img,\n .goa-card .goa-poster iframe {\n position: absolute;\n top: 0;\n left: 0;\n width: 100%;\n height: 100%;\n border: none; }\n .goa-card .goa-poster-image img {\n display: block;\n width: 100%;\n -o-object-fit: cover;\n object-fit: cover; }\n .goa-card.card-auto {\n width: auto; }\n .goa-card.card-auto .card {\n flex-basis: auto;\n width: auto; }\n .goa-card a:hover {\n color: #004f84;\n text-decoration: none; }\n .goa-card a:focus {\n outline: 3px solid #feba35;\n outline-offset: 0; }\n\n.goa-card[data-skeleton] .goa-poster-image {\n background-color: #ddd !important;\n -webkit-animation: pulse 2s infinite ease-in-out;\n animation: pulse 2s infinite ease-in-out;\n padding-bottom: 56.25%; }\n .goa-card[data-skeleton] .goa-poster-image img {\n display: none; }\n\n.goa-card[data-skeleton] .goa-title {\n margin-bottom: 1rem; }\n\n.goa-card[data-skeleton] .goa-footer {\n background-color: #ddd !important;\n -webkit-animation: pulse 2s infinite ease-in-out;\n animation: pulse 2s infinite ease-in-out;\n max-height: 1rem; }\n";
|
|
2394
|
+
styleInject(css_248z$m);
|
|
2383
2395
|
|
|
2384
2396
|
var GoACard = function GoACard(_ref) {
|
|
2385
2397
|
var title = _ref.title,
|
|
@@ -2434,8 +2446,8 @@
|
|
|
2434
2446
|
}, children)));
|
|
2435
2447
|
};
|
|
2436
2448
|
|
|
2437
|
-
var css_248z$
|
|
2438
|
-
styleInject(css_248z$
|
|
2449
|
+
var css_248z$n = "/* Palette */\n/* Semantic usages */\n.goa-card-group {\n margin-top: 14px;\n vertical-align: top; }\n .goa-card-group .card-group-title {\n font-size: 24px;\n font-weight: bold;\n color: #333; }\n .goa-card-group .card-group-basic {\n display: flex;\n flex-direction: row;\n flex-wrap: wrap;\n align-items: stretch; }\n .goa-card-group .card-group-basic > div {\n margin: 14px 10px; }\n .goa-card-group .card-group-basic-vue > div {\n display: flex;\n flex-direction: row;\n flex-wrap: wrap;\n align-items: stretch; }\n .goa-card-group .card-group-basic-vue > div > div {\n margin: 14px 10px; }\n .goa-card-group .card-group-column {\n display: inline-block;\n flex-direction: column;\n -moz-column-count: 3;\n column-count: 3;\n flex-wrap: wrap;\n align-items: stretch; }\n .goa-card-group .card-group-column > div {\n margin: 14px; }\n .goa-card-group .card-group-column-vue > div {\n display: inline-block;\n flex-direction: column;\n -moz-column-count: 3;\n column-count: 3;\n flex-wrap: wrap;\n align-items: stretch; }\n .goa-card-group .card-group-column > div > div {\n margin: 14px; }\n";
|
|
2450
|
+
styleInject(css_248z$n);
|
|
2439
2451
|
|
|
2440
2452
|
var GoACardGroup = function GoACardGroup(_ref) {
|
|
2441
2453
|
var _ref$title = _ref.title,
|
|
@@ -2468,8 +2480,8 @@
|
|
|
2468
2480
|
}, getCards()));
|
|
2469
2481
|
};
|
|
2470
2482
|
|
|
2471
|
-
var css_248z$
|
|
2472
|
-
styleInject(css_248z$
|
|
2483
|
+
var css_248z$o = "/* Palette */\n/* Semantic usages */\n.goa-checkbox input[type='checkbox'] {\n border: 0;\n clip: rect(0 0 0 0);\n height: 1px;\n margin: -1px;\n overflow: hidden;\n padding: 0;\n position: absolute;\n width: 1px;\n outline: 0;\n -webkit-appearance: none; }\n\n.goa-checkbox .goa-checkbox-label {\n z-index: 2;\n box-sizing: border-box;\n margin: 0;\n padding: 0 0 0 8px;\n cursor: pointer;\n -webkit-user-select: none;\n -moz-user-select: none;\n -ms-user-select: none;\n user-select: none;\n height: 46px;\n display: flex;\n align-items: center; }\n\n.goa-checkbox.goa-checkbox-disabled {\n opacity: 30%; }\n .goa-checkbox.goa-checkbox-disabled .goa-checkbox-label {\n cursor: default; }\n\n.goa-checkbox.has-error .goa-checkbox-container {\n border: solid 2px #fc1921;\n color: #fc1921; }\n .goa-checkbox.has-error .goa-checkbox-container svg {\n fill: #fc1921; }\n\n.goa-checkbox .goa-checkbox-container {\n box-sizing: border-box;\n border: 1px solid #666;\n border-radius: 2px;\n height: 24px;\n line-height: 24px;\n width: 24px;\n display: flex;\n flex-direction: column;\n justify-content: center;\n padding: 3px; }\n .goa-checkbox .goa-checkbox-container svg {\n display: none;\n flex: 1 1 auto;\n fill: #fff; }\n .goa-checkbox .goa-checkbox-container.goa-checkbox-selected {\n background-color: #0070c4; }\n .goa-checkbox .goa-checkbox-container.goa-checkbox-selected .goa-checkmark {\n display: block !important; }\n .goa-checkbox .goa-checkbox-container.goa-checkbox-selected .goa-indeterminate {\n display: none !important; }\n .goa-checkbox .goa-checkbox-container.goa-checkbox-indeterminate {\n background-color: #0070c4; }\n .goa-checkbox .goa-checkbox-container.goa-checkbox-indeterminate .goa-checkmark {\n display: none; }\n .goa-checkbox .goa-checkbox-container.goa-checkbox-indeterminate .goa-indeterminate {\n display: block; }\n .goa-checkbox .goa-checkbox-container:hover:not(.goa-checkbox-selected):not(.goa-checkbox-indeterminate) {\n background-color: #f1f1f1; }\n .goa-checkbox .goa-checkbox-container:focus-within {\n box-shadow: 0 0 0 3px #feba35;\n outline: none; }\n\n.goa-checkbox.goa-checkbox-label-before .goa-checkbox-container {\n order: 1;\n margin-left: 8px;\n margin-right: auto; }\n\n.goa-checkbox-layout {\n display: inline-flex;\n align-items: center;\n line-height: 2.5rem; }\n";
|
|
2484
|
+
styleInject(css_248z$o);
|
|
2473
2485
|
|
|
2474
2486
|
var GoACheckbox = function GoACheckbox(_ref) {
|
|
2475
2487
|
var _ref$checked = _ref.checked,
|
|
@@ -2544,8 +2556,8 @@
|
|
|
2544
2556
|
}, content || children)));
|
|
2545
2557
|
};
|
|
2546
2558
|
|
|
2547
|
-
var css_248z$
|
|
2548
|
-
styleInject(css_248z$
|
|
2559
|
+
var css_248z$p = "/* Palette */\n/* Semantic usages */\n.svg {\n max-width: 100px; }\n\n.svg--small {\n max-width: 65px; }\n\n@-webkit-keyframes circle-animation {\n 0% {\n stroke-dashoffset: 75;\n transform: rotate(0); }\n 100% {\n stroke-dashoffset: 75;\n transform: rotate(360deg); } }\n\n@keyframes circle-animation {\n 0% {\n stroke-dashoffset: 75;\n transform: rotate(0); }\n 100% {\n stroke-dashoffset: 75;\n transform: rotate(360deg); } }\n\n.base-circle {\n display: block;\n fill: transparent;\n stroke: #c8eef9;\n stroke-width: 7px; }\n\n.progress-circle, .progress-circle--infinite {\n display: block;\n fill: transparent;\n stroke: #0070c4;\n stroke-linecap: round;\n stroke-dasharray: 283;\n stroke-dashoffset: 280;\n stroke-width: 7px;\n transform-origin: 50% 50%; }\n .progress-circle--infinite {\n -webkit-animation: circle-animation 1.2s linear infinite;\n animation: circle-animation 1.2s linear infinite; }\n\n.progress-message, .progress-message--large, .progress-message--small {\n font-style: normal;\n font-weight: normal; }\n .progress-message--large {\n margin-top: 32px;\n font-size: 24px;\n color: #000; }\n .progress-message--small {\n margin-top: 18px;\n font-size: 18px;\n color: #000; }\n\n.progress-container, .progress-container--small, .progress-container--large {\n display: flex;\n flex-direction: column;\n align-items: center;\n justify-content: center;\n background: white; }\n .progress-container--large {\n width: 100%;\n height: 100%; }\n";
|
|
2560
|
+
styleInject(css_248z$p);
|
|
2549
2561
|
|
|
2550
2562
|
var GoAPageLoader = function GoAPageLoader(_ref) {
|
|
2551
2563
|
var _ref$type = _ref.type,
|
|
@@ -2644,8 +2656,8 @@
|
|
|
2644
2656
|
displayType: propTypes.string
|
|
2645
2657
|
};
|
|
2646
2658
|
|
|
2647
|
-
var css_248z$
|
|
2648
|
-
styleInject(css_248z$
|
|
2659
|
+
var css_248z$q = "@-webkit-keyframes rotate {\n 100% {\n transform: rotate(360deg); } }\n\n@keyframes rotate {\n 100% {\n transform: rotate(360deg); } }\n\n.circular-loader {\n -webkit-animation: rotate 1s linear infinite;\n animation: rotate 1s linear infinite; }\n\n.base-circle {\n display: block;\n fill: transparent;\n stroke-width: 7px; }\n\n.rotating-circle {\n -webkit-animation: rotate 1s linear infinite;\n animation: rotate 1s linear infinite;\n display: block;\n fill: transparent;\n stroke-linecap: round;\n stroke-width: 7px;\n transform-origin: 50% 50%; }\n";
|
|
2660
|
+
styleInject(css_248z$q);
|
|
2649
2661
|
|
|
2650
2662
|
var GoAElementLoader = function GoAElementLoader(_ref) {
|
|
2651
2663
|
var _ref$visible = _ref.visible,
|