@abgov/react-components 3.4.0-beta.61 → 3.4.0-beta.65
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/app-version-header → app-version-header}/app-version-header.component.d.ts +0 -0
- package/experimental/{experimental/badge → badge}/badge.component.d.ts +0 -0
- package/experimental/{experimental/button → button}/button.d.ts +0 -0
- package/experimental/{experimental/card → card}/card.component.d.ts +0 -0
- package/{lib/_common/input.d.ts → experimental/common.d.ts} +3 -0
- package/experimental/{experimental/flex → flex}/index.d.ts +0 -0
- package/experimental/{experimental/flex → flex}/row.d.ts +0 -0
- package/experimental/{experimental/form → form}/form.actions.component.d.ts +0 -0
- package/experimental/{experimental/form → form}/form.component.d.ts +0 -0
- package/experimental/{experimental/form → form}/form.item.component.d.ts +0 -0
- package/experimental/{experimental/form → form}/index.d.ts +0 -0
- package/experimental/{experimental/form → form}/validators.d.ts +0 -0
- package/experimental/{experimental/icons → icons}/icon.component.d.ts +14 -1
- package/experimental/{experimental/icons → icons}/iconButton.component.d.ts +2 -1
- package/experimental/{experimental/icons → icons}/index.d.ts +0 -0
- package/experimental/{experimental/index.d.ts → index.d.ts} +0 -0
- package/experimental/{experimental/input → input}/input.component.d.ts +1 -1
- package/experimental/{experimental/modal → modal}/modal.component.d.ts +0 -0
- package/experimental/package.json +1 -1
- package/experimental/react-components.esm.js +557 -616
- package/experimental/react-components.umd.js +879 -907
- package/experimental/{experimental/scrollable → scrollable}/scrollable.component.d.ts +0 -0
- package/experimental/{experimental/textarea → textarea}/textarea.component.d.ts +1 -1
- package/experimental/{experimental/transitions → transitions}/index.d.ts +0 -0
- package/experimental/{experimental/transitions → transitions}/transition.d.ts +0 -0
- package/experimental/{experimental/transitions → transitions}/transitionSequence.d.ts +0 -0
- package/lib/hero-banner/hero-banner.component.d.ts +1 -1
- package/package.json +4 -3
- package/react-components.esm.js +941 -987
- package/react-components.umd.js +955 -933
- package/experimental/experimental/common.d.ts +0 -3
package/react-components.umd.js
CHANGED
|
@@ -1,11 +1,13 @@
|
|
|
1
1
|
(function (global, factory) {
|
|
2
|
-
typeof exports === 'object' && typeof module !== 'undefined' ? factory(exports, require('react'), require('classnames')) :
|
|
3
|
-
typeof define === 'function' && define.amd ? define(['exports', 'react', 'classnames'], factory) :
|
|
4
|
-
(global = global || self, factory(global.ReactComponents = {}, global.React, global.classnames));
|
|
5
|
-
}(this, (function (exports, React, classnames) { 'use strict';
|
|
2
|
+
typeof exports === 'object' && typeof module !== 'undefined' ? factory(exports, require('react/jsx-runtime'), require('react'), require('classnames')) :
|
|
3
|
+
typeof define === 'function' && define.amd ? define(['exports', 'react/jsx-runtime', 'react', 'classnames'], factory) :
|
|
4
|
+
(global = typeof globalThis !== 'undefined' ? globalThis : global || self, factory(global.ReactComponents = {}, global.jsxRuntime, global.React, global.classnames));
|
|
5
|
+
})(this, (function (exports, jsxRuntime, React, classnames) { 'use strict';
|
|
6
6
|
|
|
7
|
-
|
|
8
|
-
|
|
7
|
+
function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
|
|
8
|
+
|
|
9
|
+
var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
|
|
10
|
+
var classnames__default = /*#__PURE__*/_interopDefaultLegacy(classnames);
|
|
9
11
|
|
|
10
12
|
function styleInject(css, ref) {
|
|
11
13
|
if ( ref === void 0 ) ref = {};
|
|
@@ -34,172 +36,61 @@
|
|
|
34
36
|
}
|
|
35
37
|
}
|
|
36
38
|
|
|
37
|
-
var css_248z = ":host, :root {\n --color-white: #fff;\n --color-black: #333;\n --color-gray-100: #f1f1f1;\n --color-gray-200: #dcdcdc;\n --color-gray-500: #adadad;\n --color-gray-600: #767676;\n --color-gray-700: #666;\n --color-gray-900: #333;\n --color-tealblue-100: #c8eefa;\n --color-tealblue-500: #0081a2;\n --color-tealblue-900: #005072;\n --color-orange: #feba35;\n --color-orange-100: hsl(39.7, 99.01%, 98%);\n --color-orange-500: hsl(39.7, 99.01%, 60.2%);\n --color-orange-900: hsl(39.7, 99.01%, 30%);\n --color-red: #ec040b;\n --color-red-100: hsl(358.19, 96.67%, 98%);\n --color-red-500: hsl(358.19, 96.67%, 47.06%);\n --color-red-600: hsl(358.19, 96.67%, 40%);\n --color-red-900: hsl(358.19, 96.67%, 20%);\n --color-green: #00853F;\n --color-green-100: hsl(148, 100%, 95%);\n --color-green-500: hsl(148.42, 100%, 26.08%);\n --color-green-900: hsl(148, 100%, 10%);\n --color-blue-100: #e3f2ff;\n --color-blue-500: #0070c4;\n --color-blue-600: #004f84
|
|
38
|
-
styleInject(css_248z);
|
|
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
|
-
|
|
43
|
-
function _defineProperty(obj, key, value) {
|
|
44
|
-
if (key in obj) {
|
|
45
|
-
Object.defineProperty(obj, key, {
|
|
46
|
-
value: value,
|
|
47
|
-
enumerable: true,
|
|
48
|
-
configurable: true,
|
|
49
|
-
writable: true
|
|
50
|
-
});
|
|
51
|
-
} else {
|
|
52
|
-
obj[key] = value;
|
|
53
|
-
}
|
|
54
|
-
|
|
55
|
-
return obj;
|
|
56
|
-
}
|
|
57
|
-
|
|
58
|
-
function ownKeys(object, enumerableOnly) {
|
|
59
|
-
var keys = Object.keys(object);
|
|
60
|
-
|
|
61
|
-
if (Object.getOwnPropertySymbols) {
|
|
62
|
-
var symbols = Object.getOwnPropertySymbols(object);
|
|
63
|
-
if (enumerableOnly) symbols = symbols.filter(function (sym) {
|
|
64
|
-
return Object.getOwnPropertyDescriptor(object, sym).enumerable;
|
|
65
|
-
});
|
|
66
|
-
keys.push.apply(keys, symbols);
|
|
67
|
-
}
|
|
68
|
-
|
|
69
|
-
return keys;
|
|
70
|
-
}
|
|
71
|
-
|
|
72
|
-
function _objectSpread2(target) {
|
|
73
|
-
for (var i = 1; i < arguments.length; i++) {
|
|
74
|
-
var source = arguments[i] != null ? arguments[i] : {};
|
|
75
|
-
|
|
76
|
-
if (i % 2) {
|
|
77
|
-
ownKeys(Object(source), true).forEach(function (key) {
|
|
78
|
-
_defineProperty(target, key, source[key]);
|
|
79
|
-
});
|
|
80
|
-
} else if (Object.getOwnPropertyDescriptors) {
|
|
81
|
-
Object.defineProperties(target, Object.getOwnPropertyDescriptors(source));
|
|
82
|
-
} else {
|
|
83
|
-
ownKeys(Object(source)).forEach(function (key) {
|
|
84
|
-
Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key));
|
|
85
|
-
});
|
|
86
|
-
}
|
|
87
|
-
}
|
|
88
|
-
|
|
89
|
-
return target;
|
|
90
|
-
}
|
|
91
|
-
|
|
92
|
-
function _objectWithoutPropertiesLoose(source, excluded) {
|
|
93
|
-
if (source == null) return {};
|
|
94
|
-
var target = {};
|
|
95
|
-
var sourceKeys = Object.keys(source);
|
|
96
|
-
var key, i;
|
|
97
|
-
|
|
98
|
-
for (i = 0; i < sourceKeys.length; i++) {
|
|
99
|
-
key = sourceKeys[i];
|
|
100
|
-
if (excluded.indexOf(key) >= 0) continue;
|
|
101
|
-
target[key] = source[key];
|
|
102
|
-
}
|
|
103
|
-
|
|
104
|
-
return target;
|
|
105
|
-
}
|
|
106
|
-
|
|
107
|
-
function _objectWithoutProperties(source, excluded) {
|
|
108
|
-
if (source == null) return {};
|
|
109
|
-
|
|
110
|
-
var target = _objectWithoutPropertiesLoose(source, excluded);
|
|
111
|
-
|
|
112
|
-
var key, i;
|
|
113
|
-
|
|
114
|
-
if (Object.getOwnPropertySymbols) {
|
|
115
|
-
var sourceSymbolKeys = Object.getOwnPropertySymbols(source);
|
|
116
|
-
|
|
117
|
-
for (i = 0; i < sourceSymbolKeys.length; i++) {
|
|
118
|
-
key = sourceSymbolKeys[i];
|
|
119
|
-
if (excluded.indexOf(key) >= 0) continue;
|
|
120
|
-
if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue;
|
|
121
|
-
target[key] = source[key];
|
|
122
|
-
}
|
|
123
|
-
}
|
|
124
|
-
|
|
125
|
-
return target;
|
|
126
|
-
}
|
|
127
|
-
|
|
128
|
-
function _slicedToArray(arr, i) {
|
|
129
|
-
return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest();
|
|
130
|
-
}
|
|
131
|
-
|
|
132
|
-
function _toConsumableArray(arr) {
|
|
133
|
-
return _arrayWithoutHoles(arr) || _iterableToArray(arr) || _unsupportedIterableToArray(arr) || _nonIterableSpread();
|
|
134
|
-
}
|
|
135
|
-
|
|
136
|
-
function _arrayWithoutHoles(arr) {
|
|
137
|
-
if (Array.isArray(arr)) return _arrayLikeToArray(arr);
|
|
138
|
-
}
|
|
139
|
-
|
|
140
|
-
function _arrayWithHoles(arr) {
|
|
141
|
-
if (Array.isArray(arr)) return arr;
|
|
142
|
-
}
|
|
143
|
-
|
|
144
|
-
function _iterableToArray(iter) {
|
|
145
|
-
if (typeof Symbol !== "undefined" && Symbol.iterator in Object(iter)) return Array.from(iter);
|
|
146
|
-
}
|
|
147
|
-
|
|
148
|
-
function _iterableToArrayLimit(arr, i) {
|
|
149
|
-
if (typeof Symbol === "undefined" || !(Symbol.iterator in Object(arr))) return;
|
|
150
|
-
var _arr = [];
|
|
151
|
-
var _n = true;
|
|
152
|
-
var _d = false;
|
|
153
|
-
var _e = undefined;
|
|
154
|
-
|
|
155
|
-
try {
|
|
156
|
-
for (var _i = arr[Symbol.iterator](), _s; !(_n = (_s = _i.next()).done); _n = true) {
|
|
157
|
-
_arr.push(_s.value);
|
|
158
|
-
|
|
159
|
-
if (i && _arr.length === i) break;
|
|
160
|
-
}
|
|
161
|
-
} catch (err) {
|
|
162
|
-
_d = true;
|
|
163
|
-
_e = err;
|
|
164
|
-
} finally {
|
|
165
|
-
try {
|
|
166
|
-
if (!_n && _i["return"] != null) _i["return"]();
|
|
167
|
-
} finally {
|
|
168
|
-
if (_d) throw _e;
|
|
169
|
-
}
|
|
170
|
-
}
|
|
171
|
-
|
|
172
|
-
return _arr;
|
|
173
|
-
}
|
|
174
|
-
|
|
175
|
-
function _unsupportedIterableToArray(o, minLen) {
|
|
176
|
-
if (!o) return;
|
|
177
|
-
if (typeof o === "string") return _arrayLikeToArray(o, minLen);
|
|
178
|
-
var n = Object.prototype.toString.call(o).slice(8, -1);
|
|
179
|
-
if (n === "Object" && o.constructor) n = o.constructor.name;
|
|
180
|
-
if (n === "Map" || n === "Set") return Array.from(o);
|
|
181
|
-
if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen);
|
|
182
|
-
}
|
|
183
|
-
|
|
184
|
-
function _arrayLikeToArray(arr, len) {
|
|
185
|
-
if (len == null || len > arr.length) len = arr.length;
|
|
39
|
+
var css_248z$u = ":host, :root {\n --color-white: #fff;\n --color-black: #333;\n --color-gray-100: #f1f1f1;\n --color-gray-200: #dcdcdc;\n --color-gray-500: #adadad;\n --color-gray-600: #767676;\n --color-gray-700: #666;\n --color-gray-900: #333;\n --color-tealblue-100: #c8eefa;\n --color-tealblue-500: #0081a2;\n --color-tealblue-900: #005072;\n --color-orange: #feba35;\n --color-orange-100: hsl(39.7, 99.01%, 98%);\n --color-orange-500: hsl(39.7, 99.01%, 60.2%);\n --color-orange-900: hsl(39.7, 99.01%, 30%);\n --color-red: #ec040b;\n --color-red-100: hsl(358.19, 96.67%, 98%);\n --color-red-500: hsl(358.19, 96.67%, 47.06%);\n --color-red-600: hsl(358.19, 96.67%, 40%);\n --color-red-900: hsl(358.19, 96.67%, 20%);\n --color-green: #00853F;\n --color-green-100: hsl(148, 100%, 95%);\n --color-green-500: hsl(148.42, 100%, 26.08%);\n --color-green-900: hsl(148, 100%, 10%);\n --color-blue-100: #e3f2ff;\n --color-blue-500: #0070c4;\n --color-blue-600: #004f84;\n}\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 /* line-height */\n --lh-xs: 0.875rem;\n --lh-sm: 1rem;\n --lh-base: 1.5rem;\n --lh-lg: 2rem;\n --lh-xl: 2.75rem;\n --lh-2xl: 3.5rem;\n --border-radius-sm: 0.15rem;\n --border-radius: 0.25rem;\n --border-radius-base: 0.25rem;\n --border-radius-lg: 0.5rem;\n --spacing-1: 0.5rem;\n --spacing-2: 0.875rem;\n --spacing-3: 1.75rem;\n --input-height: 2.625rem;\n --input-padding: 0.5rem;\n --input-border-radius: 0.25rem;\n --input-font-size: var(--fs-base);\n}\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}\n\nbody {\n margin: 0;\n scroll-behavior: smooth;\n}\n\n*,\n*:before,\n*:after {\n box-sizing: border-box;\n}\n\np {\n margin: 0;\n margin-bottom: 1rem;\n}\n\nhr {\n border-width: 0;\n border-top: 1px solid #ccc;\n padding: 0;\n margin: 0;\n}\n\nul,\nol {\n padding-left: 0;\n padding-left: 1rem;\n}\n\nli > ul,\nli > ol,\nli > ul,\nli > ol {\n padding-left: 0;\n margin-top: 0;\n}\n\ndl {\n margin-top: 0;\n}\n\ndd {\n margin-left: 0.5rem;\n}\n\na {\n color: var(--color-blue-500);\n cursor: pointer;\n}\n\na:hover {\n color: var(--color-blue-600);\n}\n\na:focus {\n outline-width: thin;\n outline-style: solid;\n outline-color: var(--color-blue-600);\n outline-offset: 0px;\n}\n\n::-moz-placeholder {\n /* Chrome, Firefox, Opera, Safari 10.1+ */\n color: #999;\n opacity: 1;\n /* Firefox */\n}\n\n:-ms-input-placeholder {\n /* Chrome, Firefox, Opera, Safari 10.1+ */\n color: #999;\n opacity: 1;\n /* Firefox */\n}\n\n::placeholder {\n /* Chrome, Firefox, Opera, Safari 10.1+ */\n color: #999;\n opacity: 1;\n /* Firefox */\n}\n\n:-ms-input-placeholder {\n /* Internet Explorer 10-11 */\n color: #999;\n}\n\n::-ms-input-placeholder {\n /* Microsoft Edge */\n color: #999;\n}";
|
|
40
|
+
styleInject(css_248z$u);
|
|
186
41
|
|
|
187
|
-
|
|
42
|
+
var css_248z$t = "/* 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}";
|
|
43
|
+
styleInject(css_248z$t);
|
|
188
44
|
|
|
189
|
-
|
|
45
|
+
/*! *****************************************************************************
|
|
46
|
+
Copyright (c) Microsoft Corporation.
|
|
47
|
+
|
|
48
|
+
Permission to use, copy, modify, and/or distribute this software for any
|
|
49
|
+
purpose with or without fee is hereby granted.
|
|
50
|
+
|
|
51
|
+
THE SOFTWARE IS PROVIDED "AS IS" AND THE AUTHOR DISCLAIMS ALL WARRANTIES WITH
|
|
52
|
+
REGARD TO THIS SOFTWARE INCLUDING ALL IMPLIED WARRANTIES OF MERCHANTABILITY
|
|
53
|
+
AND FITNESS. IN NO EVENT SHALL THE AUTHOR BE LIABLE FOR ANY SPECIAL, DIRECT,
|
|
54
|
+
INDIRECT, OR CONSEQUENTIAL DAMAGES OR ANY DAMAGES WHATSOEVER RESULTING FROM
|
|
55
|
+
LOSS OF USE, DATA OR PROFITS, WHETHER IN AN ACTION OF CONTRACT, NEGLIGENCE OR
|
|
56
|
+
OTHER TORTIOUS ACTION, ARISING OUT OF OR IN CONNECTION WITH THE USE OR
|
|
57
|
+
PERFORMANCE OF THIS SOFTWARE.
|
|
58
|
+
***************************************************************************** */
|
|
59
|
+
|
|
60
|
+
var __assign = function() {
|
|
61
|
+
__assign = Object.assign || function __assign(t) {
|
|
62
|
+
for (var s, i = 1, n = arguments.length; i < n; i++) {
|
|
63
|
+
s = arguments[i];
|
|
64
|
+
for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p)) t[p] = s[p];
|
|
65
|
+
}
|
|
66
|
+
return t;
|
|
67
|
+
};
|
|
68
|
+
return __assign.apply(this, arguments);
|
|
69
|
+
};
|
|
70
|
+
|
|
71
|
+
function __rest(s, e) {
|
|
72
|
+
var t = {};
|
|
73
|
+
for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
|
|
74
|
+
t[p] = s[p];
|
|
75
|
+
if (s != null && typeof Object.getOwnPropertySymbols === "function")
|
|
76
|
+
for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
|
|
77
|
+
if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
|
|
78
|
+
t[p[i]] = s[p[i]];
|
|
79
|
+
}
|
|
80
|
+
return t;
|
|
81
|
+
}
|
|
82
|
+
|
|
83
|
+
function __spreadArray(to, from) {
|
|
84
|
+
for (var i = 0, il = from.length, j = to.length; i < il; i++, j++)
|
|
85
|
+
to[j] = from[i];
|
|
86
|
+
return to;
|
|
190
87
|
}
|
|
191
88
|
|
|
192
|
-
|
|
193
|
-
throw new TypeError("Invalid attempt to spread non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.");
|
|
194
|
-
}
|
|
89
|
+
var propTypes = {exports: {}};
|
|
195
90
|
|
|
196
|
-
|
|
197
|
-
throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.");
|
|
198
|
-
}
|
|
91
|
+
var reactIs = {exports: {}};
|
|
199
92
|
|
|
200
|
-
|
|
201
|
-
return module = { exports: {} }, fn(module, module.exports), module.exports;
|
|
202
|
-
}
|
|
93
|
+
var reactIs_production_min = {};
|
|
203
94
|
|
|
204
95
|
/** @license React v16.13.1
|
|
205
96
|
* react-is.production.min.js
|
|
@@ -211,43 +102,21 @@
|
|
|
211
102
|
*/
|
|
212
103
|
var b="function"===typeof Symbol&&Symbol.for,c=b?Symbol.for("react.element"):60103,d=b?Symbol.for("react.portal"):60106,e=b?Symbol.for("react.fragment"):60107,f=b?Symbol.for("react.strict_mode"):60108,g=b?Symbol.for("react.profiler"):60114,h=b?Symbol.for("react.provider"):60109,k=b?Symbol.for("react.context"):60110,l=b?Symbol.for("react.async_mode"):60111,m=b?Symbol.for("react.concurrent_mode"):60111,n=b?Symbol.for("react.forward_ref"):60112,p=b?Symbol.for("react.suspense"):60113,q=b?
|
|
213
104
|
Symbol.for("react.suspense_list"):60120,r=b?Symbol.for("react.memo"):60115,t=b?Symbol.for("react.lazy"):60116,v=b?Symbol.for("react.block"):60121,w=b?Symbol.for("react.fundamental"):60117,x=b?Symbol.for("react.responder"):60118,y=b?Symbol.for("react.scope"):60119;
|
|
214
|
-
function z(a){if("object"===typeof a&&null!==a){var u=a.$$typeof;switch(u){case c:switch(a=a.type,a){case l:case m:case e:case g:case f:case p:return a;default:switch(a=a&&a.$$typeof,a){case k:case n:case t:case r:case h:return a;default:return u}}case d:return u}}}function A(a){return z(a)===m}
|
|
215
|
-
|
|
216
|
-
|
|
217
|
-
|
|
218
|
-
|
|
219
|
-
var reactIs_production_min = {
|
|
220
|
-
AsyncMode: AsyncMode,
|
|
221
|
-
ConcurrentMode: ConcurrentMode,
|
|
222
|
-
ContextConsumer: ContextConsumer,
|
|
223
|
-
ContextProvider: ContextProvider,
|
|
224
|
-
Element: Element,
|
|
225
|
-
ForwardRef: ForwardRef,
|
|
226
|
-
Fragment: Fragment,
|
|
227
|
-
Lazy: Lazy,
|
|
228
|
-
Memo: Memo,
|
|
229
|
-
Portal: Portal,
|
|
230
|
-
Profiler: Profiler,
|
|
231
|
-
StrictMode: StrictMode,
|
|
232
|
-
Suspense: Suspense,
|
|
233
|
-
isAsyncMode: isAsyncMode,
|
|
234
|
-
isConcurrentMode: isConcurrentMode,
|
|
235
|
-
isContextConsumer: isContextConsumer,
|
|
236
|
-
isContextProvider: isContextProvider,
|
|
237
|
-
isElement: isElement,
|
|
238
|
-
isForwardRef: isForwardRef,
|
|
239
|
-
isFragment: isFragment,
|
|
240
|
-
isLazy: isLazy,
|
|
241
|
-
isMemo: isMemo,
|
|
242
|
-
isPortal: isPortal,
|
|
243
|
-
isProfiler: isProfiler,
|
|
244
|
-
isStrictMode: isStrictMode,
|
|
245
|
-
isSuspense: isSuspense,
|
|
246
|
-
isValidElementType: isValidElementType,
|
|
247
|
-
typeOf: typeOf
|
|
248
|
-
};
|
|
105
|
+
function z(a){if("object"===typeof a&&null!==a){var u=a.$$typeof;switch(u){case c:switch(a=a.type,a){case l:case m:case e:case g:case f:case p:return a;default:switch(a=a&&a.$$typeof,a){case k:case n:case t:case r:case h:return a;default:return u}}case d:return u}}}function A(a){return z(a)===m}reactIs_production_min.AsyncMode=l;reactIs_production_min.ConcurrentMode=m;reactIs_production_min.ContextConsumer=k;reactIs_production_min.ContextProvider=h;reactIs_production_min.Element=c;reactIs_production_min.ForwardRef=n;reactIs_production_min.Fragment=e;reactIs_production_min.Lazy=t;reactIs_production_min.Memo=r;reactIs_production_min.Portal=d;
|
|
106
|
+
reactIs_production_min.Profiler=g;reactIs_production_min.StrictMode=f;reactIs_production_min.Suspense=p;reactIs_production_min.isAsyncMode=function(a){return A(a)||z(a)===l};reactIs_production_min.isConcurrentMode=A;reactIs_production_min.isContextConsumer=function(a){return z(a)===k};reactIs_production_min.isContextProvider=function(a){return z(a)===h};reactIs_production_min.isElement=function(a){return "object"===typeof a&&null!==a&&a.$$typeof===c};reactIs_production_min.isForwardRef=function(a){return z(a)===n};reactIs_production_min.isFragment=function(a){return z(a)===e};reactIs_production_min.isLazy=function(a){return z(a)===t};
|
|
107
|
+
reactIs_production_min.isMemo=function(a){return z(a)===r};reactIs_production_min.isPortal=function(a){return z(a)===d};reactIs_production_min.isProfiler=function(a){return z(a)===g};reactIs_production_min.isStrictMode=function(a){return z(a)===f};reactIs_production_min.isSuspense=function(a){return z(a)===p};
|
|
108
|
+
reactIs_production_min.isValidElementType=function(a){return "string"===typeof a||"function"===typeof a||a===e||a===m||a===g||a===f||a===p||a===q||"object"===typeof a&&null!==a&&(a.$$typeof===t||a.$$typeof===r||a.$$typeof===h||a.$$typeof===k||a.$$typeof===n||a.$$typeof===w||a.$$typeof===x||a.$$typeof===y||a.$$typeof===v)};reactIs_production_min.typeOf=z;
|
|
249
109
|
|
|
250
|
-
var reactIs_development =
|
|
110
|
+
var reactIs_development = {};
|
|
111
|
+
|
|
112
|
+
/** @license React v16.13.1
|
|
113
|
+
* react-is.development.js
|
|
114
|
+
*
|
|
115
|
+
* Copyright (c) Facebook, Inc. and its affiliates.
|
|
116
|
+
*
|
|
117
|
+
* This source code is licensed under the MIT license found in the
|
|
118
|
+
* LICENSE file in the root directory of this source tree.
|
|
119
|
+
*/
|
|
251
120
|
|
|
252
121
|
|
|
253
122
|
|
|
@@ -388,74 +257,42 @@
|
|
|
388
257
|
return typeOf(object) === REACT_SUSPENSE_TYPE;
|
|
389
258
|
}
|
|
390
259
|
|
|
391
|
-
|
|
392
|
-
|
|
393
|
-
|
|
394
|
-
|
|
395
|
-
|
|
396
|
-
|
|
397
|
-
|
|
398
|
-
|
|
399
|
-
|
|
400
|
-
|
|
401
|
-
|
|
402
|
-
|
|
403
|
-
|
|
404
|
-
|
|
405
|
-
|
|
406
|
-
|
|
407
|
-
|
|
408
|
-
|
|
409
|
-
|
|
410
|
-
|
|
411
|
-
|
|
412
|
-
|
|
413
|
-
|
|
414
|
-
|
|
415
|
-
|
|
416
|
-
|
|
417
|
-
|
|
418
|
-
|
|
260
|
+
reactIs_development.AsyncMode = AsyncMode;
|
|
261
|
+
reactIs_development.ConcurrentMode = ConcurrentMode;
|
|
262
|
+
reactIs_development.ContextConsumer = ContextConsumer;
|
|
263
|
+
reactIs_development.ContextProvider = ContextProvider;
|
|
264
|
+
reactIs_development.Element = Element;
|
|
265
|
+
reactIs_development.ForwardRef = ForwardRef;
|
|
266
|
+
reactIs_development.Fragment = Fragment;
|
|
267
|
+
reactIs_development.Lazy = Lazy;
|
|
268
|
+
reactIs_development.Memo = Memo;
|
|
269
|
+
reactIs_development.Portal = Portal;
|
|
270
|
+
reactIs_development.Profiler = Profiler;
|
|
271
|
+
reactIs_development.StrictMode = StrictMode;
|
|
272
|
+
reactIs_development.Suspense = Suspense;
|
|
273
|
+
reactIs_development.isAsyncMode = isAsyncMode;
|
|
274
|
+
reactIs_development.isConcurrentMode = isConcurrentMode;
|
|
275
|
+
reactIs_development.isContextConsumer = isContextConsumer;
|
|
276
|
+
reactIs_development.isContextProvider = isContextProvider;
|
|
277
|
+
reactIs_development.isElement = isElement;
|
|
278
|
+
reactIs_development.isForwardRef = isForwardRef;
|
|
279
|
+
reactIs_development.isFragment = isFragment;
|
|
280
|
+
reactIs_development.isLazy = isLazy;
|
|
281
|
+
reactIs_development.isMemo = isMemo;
|
|
282
|
+
reactIs_development.isPortal = isPortal;
|
|
283
|
+
reactIs_development.isProfiler = isProfiler;
|
|
284
|
+
reactIs_development.isStrictMode = isStrictMode;
|
|
285
|
+
reactIs_development.isSuspense = isSuspense;
|
|
286
|
+
reactIs_development.isValidElementType = isValidElementType;
|
|
287
|
+
reactIs_development.typeOf = typeOf;
|
|
419
288
|
})();
|
|
420
289
|
}
|
|
421
|
-
});
|
|
422
|
-
var reactIs_development_1 = reactIs_development.AsyncMode;
|
|
423
|
-
var reactIs_development_2 = reactIs_development.ConcurrentMode;
|
|
424
|
-
var reactIs_development_3 = reactIs_development.ContextConsumer;
|
|
425
|
-
var reactIs_development_4 = reactIs_development.ContextProvider;
|
|
426
|
-
var reactIs_development_5 = reactIs_development.Element;
|
|
427
|
-
var reactIs_development_6 = reactIs_development.ForwardRef;
|
|
428
|
-
var reactIs_development_7 = reactIs_development.Fragment;
|
|
429
|
-
var reactIs_development_8 = reactIs_development.Lazy;
|
|
430
|
-
var reactIs_development_9 = reactIs_development.Memo;
|
|
431
|
-
var reactIs_development_10 = reactIs_development.Portal;
|
|
432
|
-
var reactIs_development_11 = reactIs_development.Profiler;
|
|
433
|
-
var reactIs_development_12 = reactIs_development.StrictMode;
|
|
434
|
-
var reactIs_development_13 = reactIs_development.Suspense;
|
|
435
|
-
var reactIs_development_14 = reactIs_development.isAsyncMode;
|
|
436
|
-
var reactIs_development_15 = reactIs_development.isConcurrentMode;
|
|
437
|
-
var reactIs_development_16 = reactIs_development.isContextConsumer;
|
|
438
|
-
var reactIs_development_17 = reactIs_development.isContextProvider;
|
|
439
|
-
var reactIs_development_18 = reactIs_development.isElement;
|
|
440
|
-
var reactIs_development_19 = reactIs_development.isForwardRef;
|
|
441
|
-
var reactIs_development_20 = reactIs_development.isFragment;
|
|
442
|
-
var reactIs_development_21 = reactIs_development.isLazy;
|
|
443
|
-
var reactIs_development_22 = reactIs_development.isMemo;
|
|
444
|
-
var reactIs_development_23 = reactIs_development.isPortal;
|
|
445
|
-
var reactIs_development_24 = reactIs_development.isProfiler;
|
|
446
|
-
var reactIs_development_25 = reactIs_development.isStrictMode;
|
|
447
|
-
var reactIs_development_26 = reactIs_development.isSuspense;
|
|
448
|
-
var reactIs_development_27 = reactIs_development.isValidElementType;
|
|
449
|
-
var reactIs_development_28 = reactIs_development.typeOf;
|
|
450
|
-
|
|
451
|
-
var reactIs = createCommonjsModule(function (module) {
|
|
452
290
|
|
|
453
291
|
if (process.env.NODE_ENV === 'production') {
|
|
454
|
-
|
|
292
|
+
reactIs.exports = reactIs_production_min;
|
|
455
293
|
} else {
|
|
456
|
-
|
|
294
|
+
reactIs.exports = reactIs_development;
|
|
457
295
|
}
|
|
458
|
-
});
|
|
459
296
|
|
|
460
297
|
/*
|
|
461
298
|
object-assign
|
|
@@ -553,18 +390,25 @@
|
|
|
553
390
|
* LICENSE file in the root directory of this source tree.
|
|
554
391
|
*/
|
|
555
392
|
|
|
556
|
-
var ReactPropTypesSecret = 'SECRET_DO_NOT_PASS_THIS_OR_YOU_WILL_BE_FIRED';
|
|
393
|
+
var ReactPropTypesSecret$3 = 'SECRET_DO_NOT_PASS_THIS_OR_YOU_WILL_BE_FIRED';
|
|
557
394
|
|
|
558
|
-
var ReactPropTypesSecret_1 = ReactPropTypesSecret;
|
|
395
|
+
var ReactPropTypesSecret_1 = ReactPropTypesSecret$3;
|
|
559
396
|
|
|
560
|
-
|
|
397
|
+
/**
|
|
398
|
+
* Copyright (c) 2013-present, Facebook, Inc.
|
|
399
|
+
*
|
|
400
|
+
* This source code is licensed under the MIT license found in the
|
|
401
|
+
* LICENSE file in the root directory of this source tree.
|
|
402
|
+
*/
|
|
403
|
+
|
|
404
|
+
var printWarning$1 = function() {};
|
|
561
405
|
|
|
562
406
|
if (process.env.NODE_ENV !== 'production') {
|
|
563
|
-
var ReactPropTypesSecret$
|
|
407
|
+
var ReactPropTypesSecret$2 = ReactPropTypesSecret_1;
|
|
564
408
|
var loggedTypeFailures = {};
|
|
565
|
-
var has = Function.call.bind(Object.prototype.hasOwnProperty);
|
|
409
|
+
var has$1 = Function.call.bind(Object.prototype.hasOwnProperty);
|
|
566
410
|
|
|
567
|
-
printWarning = function(text) {
|
|
411
|
+
printWarning$1 = function(text) {
|
|
568
412
|
var message = 'Warning: ' + text;
|
|
569
413
|
if (typeof console !== 'undefined') {
|
|
570
414
|
console.error(message);
|
|
@@ -589,10 +433,10 @@
|
|
|
589
433
|
* @param {?Function} getStack Returns the component stack.
|
|
590
434
|
* @private
|
|
591
435
|
*/
|
|
592
|
-
function checkPropTypes(typeSpecs, values, location, componentName, getStack) {
|
|
436
|
+
function checkPropTypes$1(typeSpecs, values, location, componentName, getStack) {
|
|
593
437
|
if (process.env.NODE_ENV !== 'production') {
|
|
594
438
|
for (var typeSpecName in typeSpecs) {
|
|
595
|
-
if (has(typeSpecs, typeSpecName)) {
|
|
439
|
+
if (has$1(typeSpecs, typeSpecName)) {
|
|
596
440
|
var error;
|
|
597
441
|
// Prop type validation may throw. In case they do, we don't want to
|
|
598
442
|
// fail the render phase where it didn't fail before. So we log it.
|
|
@@ -608,12 +452,12 @@
|
|
|
608
452
|
err.name = 'Invariant Violation';
|
|
609
453
|
throw err;
|
|
610
454
|
}
|
|
611
|
-
error = typeSpecs[typeSpecName](values, typeSpecName, componentName, location, null, ReactPropTypesSecret$
|
|
455
|
+
error = typeSpecs[typeSpecName](values, typeSpecName, componentName, location, null, ReactPropTypesSecret$2);
|
|
612
456
|
} catch (ex) {
|
|
613
457
|
error = ex;
|
|
614
458
|
}
|
|
615
459
|
if (error && !(error instanceof Error)) {
|
|
616
|
-
printWarning(
|
|
460
|
+
printWarning$1(
|
|
617
461
|
(componentName || 'React class') + ': type specification of ' +
|
|
618
462
|
location + ' `' + typeSpecName + '` is invalid; the type checker ' +
|
|
619
463
|
'function must return `null` or an `Error` but returned a ' + typeof error + '. ' +
|
|
@@ -629,7 +473,7 @@
|
|
|
629
473
|
|
|
630
474
|
var stack = getStack ? getStack() : '';
|
|
631
475
|
|
|
632
|
-
printWarning(
|
|
476
|
+
printWarning$1(
|
|
633
477
|
'Failed ' + location + ' type: ' + error.message + (stack != null ? stack : '')
|
|
634
478
|
);
|
|
635
479
|
}
|
|
@@ -643,19 +487,32 @@
|
|
|
643
487
|
*
|
|
644
488
|
* @private
|
|
645
489
|
*/
|
|
646
|
-
checkPropTypes.resetWarningCache = function() {
|
|
490
|
+
checkPropTypes$1.resetWarningCache = function() {
|
|
647
491
|
if (process.env.NODE_ENV !== 'production') {
|
|
648
492
|
loggedTypeFailures = {};
|
|
649
493
|
}
|
|
650
494
|
};
|
|
651
495
|
|
|
652
|
-
var checkPropTypes_1 = checkPropTypes;
|
|
496
|
+
var checkPropTypes_1 = checkPropTypes$1;
|
|
653
497
|
|
|
654
|
-
|
|
655
|
-
|
|
498
|
+
/**
|
|
499
|
+
* Copyright (c) 2013-present, Facebook, Inc.
|
|
500
|
+
*
|
|
501
|
+
* This source code is licensed under the MIT license found in the
|
|
502
|
+
* LICENSE file in the root directory of this source tree.
|
|
503
|
+
*/
|
|
504
|
+
|
|
505
|
+
var ReactIs$1 = reactIs.exports;
|
|
506
|
+
var assign = objectAssign;
|
|
507
|
+
|
|
508
|
+
var ReactPropTypesSecret$1 = ReactPropTypesSecret_1;
|
|
509
|
+
var checkPropTypes = checkPropTypes_1;
|
|
510
|
+
|
|
511
|
+
var has = Function.call.bind(Object.prototype.hasOwnProperty);
|
|
512
|
+
var printWarning = function() {};
|
|
656
513
|
|
|
657
514
|
if (process.env.NODE_ENV !== 'production') {
|
|
658
|
-
printWarning
|
|
515
|
+
printWarning = function(text) {
|
|
659
516
|
var message = 'Warning: ' + text;
|
|
660
517
|
if (typeof console !== 'undefined') {
|
|
661
518
|
console.error(message);
|
|
@@ -813,7 +670,7 @@
|
|
|
813
670
|
componentName = componentName || ANONYMOUS;
|
|
814
671
|
propFullName = propFullName || propName;
|
|
815
672
|
|
|
816
|
-
if (secret !==
|
|
673
|
+
if (secret !== ReactPropTypesSecret$1) {
|
|
817
674
|
if (throwOnDirectAccess) {
|
|
818
675
|
// New behavior only for users of `prop-types` package
|
|
819
676
|
var err = new Error(
|
|
@@ -831,7 +688,7 @@
|
|
|
831
688
|
// Avoid spamming the console because they are often not actionable except for lib authors
|
|
832
689
|
manualPropTypeWarningCount < 3
|
|
833
690
|
) {
|
|
834
|
-
printWarning
|
|
691
|
+
printWarning(
|
|
835
692
|
'You are manually calling a React.PropTypes validation ' +
|
|
836
693
|
'function for the `' + propFullName + '` prop on `' + componentName + '`. This is deprecated ' +
|
|
837
694
|
'and will throw in the standalone `prop-types` package. ' +
|
|
@@ -894,7 +751,7 @@
|
|
|
894
751
|
return new PropTypeError('Invalid ' + location + ' `' + propFullName + '` of type ' + ('`' + propType + '` supplied to `' + componentName + '`, expected an array.'));
|
|
895
752
|
}
|
|
896
753
|
for (var i = 0; i < propValue.length; i++) {
|
|
897
|
-
var error = typeChecker(propValue, i, componentName, location, propFullName + '[' + i + ']',
|
|
754
|
+
var error = typeChecker(propValue, i, componentName, location, propFullName + '[' + i + ']', ReactPropTypesSecret$1);
|
|
898
755
|
if (error instanceof Error) {
|
|
899
756
|
return error;
|
|
900
757
|
}
|
|
@@ -919,7 +776,7 @@
|
|
|
919
776
|
function createElementTypeTypeChecker() {
|
|
920
777
|
function validate(props, propName, componentName, location, propFullName) {
|
|
921
778
|
var propValue = props[propName];
|
|
922
|
-
if (!
|
|
779
|
+
if (!ReactIs$1.isValidElementType(propValue)) {
|
|
923
780
|
var propType = getPropType(propValue);
|
|
924
781
|
return new PropTypeError('Invalid ' + location + ' `' + propFullName + '` of type ' + ('`' + propType + '` supplied to `' + componentName + '`, expected a single ReactElement type.'));
|
|
925
782
|
}
|
|
@@ -944,12 +801,12 @@
|
|
|
944
801
|
if (!Array.isArray(expectedValues)) {
|
|
945
802
|
if (process.env.NODE_ENV !== 'production') {
|
|
946
803
|
if (arguments.length > 1) {
|
|
947
|
-
printWarning
|
|
804
|
+
printWarning(
|
|
948
805
|
'Invalid arguments supplied to oneOf, expected an array, got ' + arguments.length + ' arguments. ' +
|
|
949
806
|
'A common mistake is to write oneOf(x, y, z) instead of oneOf([x, y, z]).'
|
|
950
807
|
);
|
|
951
808
|
} else {
|
|
952
|
-
printWarning
|
|
809
|
+
printWarning('Invalid argument supplied to oneOf, expected an array.');
|
|
953
810
|
}
|
|
954
811
|
}
|
|
955
812
|
return emptyFunctionThatReturnsNull;
|
|
@@ -986,8 +843,8 @@
|
|
|
986
843
|
return new PropTypeError('Invalid ' + location + ' `' + propFullName + '` of type ' + ('`' + propType + '` supplied to `' + componentName + '`, expected an object.'));
|
|
987
844
|
}
|
|
988
845
|
for (var key in propValue) {
|
|
989
|
-
if (has
|
|
990
|
-
var error = typeChecker(propValue, key, componentName, location, propFullName + '.' + key,
|
|
846
|
+
if (has(propValue, key)) {
|
|
847
|
+
var error = typeChecker(propValue, key, componentName, location, propFullName + '.' + key, ReactPropTypesSecret$1);
|
|
991
848
|
if (error instanceof Error) {
|
|
992
849
|
return error;
|
|
993
850
|
}
|
|
@@ -1000,14 +857,14 @@
|
|
|
1000
857
|
|
|
1001
858
|
function createUnionTypeChecker(arrayOfTypeCheckers) {
|
|
1002
859
|
if (!Array.isArray(arrayOfTypeCheckers)) {
|
|
1003
|
-
process.env.NODE_ENV !== 'production' ? printWarning
|
|
860
|
+
process.env.NODE_ENV !== 'production' ? printWarning('Invalid argument supplied to oneOfType, expected an instance of array.') : void 0;
|
|
1004
861
|
return emptyFunctionThatReturnsNull;
|
|
1005
862
|
}
|
|
1006
863
|
|
|
1007
864
|
for (var i = 0; i < arrayOfTypeCheckers.length; i++) {
|
|
1008
865
|
var checker = arrayOfTypeCheckers[i];
|
|
1009
866
|
if (typeof checker !== 'function') {
|
|
1010
|
-
printWarning
|
|
867
|
+
printWarning(
|
|
1011
868
|
'Invalid argument supplied to oneOfType. Expected an array of check functions, but ' +
|
|
1012
869
|
'received ' + getPostfixForTypeWarning(checker) + ' at index ' + i + '.'
|
|
1013
870
|
);
|
|
@@ -1018,7 +875,7 @@
|
|
|
1018
875
|
function validate(props, propName, componentName, location, propFullName) {
|
|
1019
876
|
for (var i = 0; i < arrayOfTypeCheckers.length; i++) {
|
|
1020
877
|
var checker = arrayOfTypeCheckers[i];
|
|
1021
|
-
if (checker(props, propName, componentName, location, propFullName,
|
|
878
|
+
if (checker(props, propName, componentName, location, propFullName, ReactPropTypesSecret$1) == null) {
|
|
1022
879
|
return null;
|
|
1023
880
|
}
|
|
1024
881
|
}
|
|
@@ -1050,7 +907,7 @@
|
|
|
1050
907
|
if (!checker) {
|
|
1051
908
|
continue;
|
|
1052
909
|
}
|
|
1053
|
-
var error = checker(propValue, key, componentName, location, propFullName + '.' + key,
|
|
910
|
+
var error = checker(propValue, key, componentName, location, propFullName + '.' + key, ReactPropTypesSecret$1);
|
|
1054
911
|
if (error) {
|
|
1055
912
|
return error;
|
|
1056
913
|
}
|
|
@@ -1069,7 +926,7 @@
|
|
|
1069
926
|
}
|
|
1070
927
|
// We need to check all keys in case some are required but missing from
|
|
1071
928
|
// props.
|
|
1072
|
-
var allKeys =
|
|
929
|
+
var allKeys = assign({}, props[propName], shapeTypes);
|
|
1073
930
|
for (var key in allKeys) {
|
|
1074
931
|
var checker = shapeTypes[key];
|
|
1075
932
|
if (!checker) {
|
|
@@ -1079,7 +936,7 @@
|
|
|
1079
936
|
'\nValid keys: ' + JSON.stringify(Object.keys(shapeTypes), null, ' ')
|
|
1080
937
|
);
|
|
1081
938
|
}
|
|
1082
|
-
var error = checker(propValue, key, componentName, location, propFullName + '.' + key,
|
|
939
|
+
var error = checker(propValue, key, componentName, location, propFullName + '.' + key, ReactPropTypesSecret$1);
|
|
1083
940
|
if (error) {
|
|
1084
941
|
return error;
|
|
1085
942
|
}
|
|
@@ -1221,20 +1078,29 @@
|
|
|
1221
1078
|
return propValue.constructor.name;
|
|
1222
1079
|
}
|
|
1223
1080
|
|
|
1224
|
-
ReactPropTypes.checkPropTypes =
|
|
1225
|
-
ReactPropTypes.resetWarningCache =
|
|
1081
|
+
ReactPropTypes.checkPropTypes = checkPropTypes;
|
|
1082
|
+
ReactPropTypes.resetWarningCache = checkPropTypes.resetWarningCache;
|
|
1226
1083
|
ReactPropTypes.PropTypes = ReactPropTypes;
|
|
1227
1084
|
|
|
1228
1085
|
return ReactPropTypes;
|
|
1229
1086
|
};
|
|
1230
1087
|
|
|
1088
|
+
/**
|
|
1089
|
+
* Copyright (c) 2013-present, Facebook, Inc.
|
|
1090
|
+
*
|
|
1091
|
+
* This source code is licensed under the MIT license found in the
|
|
1092
|
+
* LICENSE file in the root directory of this source tree.
|
|
1093
|
+
*/
|
|
1094
|
+
|
|
1095
|
+
var ReactPropTypesSecret = ReactPropTypesSecret_1;
|
|
1096
|
+
|
|
1231
1097
|
function emptyFunction() {}
|
|
1232
1098
|
function emptyFunctionWithReset() {}
|
|
1233
1099
|
emptyFunctionWithReset.resetWarningCache = emptyFunction;
|
|
1234
1100
|
|
|
1235
1101
|
var factoryWithThrowingShims = function() {
|
|
1236
1102
|
function shim(props, propName, componentName, location, propFullName, secret) {
|
|
1237
|
-
if (secret ===
|
|
1103
|
+
if (secret === ReactPropTypesSecret) {
|
|
1238
1104
|
// It is still safe when called from React.
|
|
1239
1105
|
return;
|
|
1240
1106
|
}
|
|
@@ -1280,7 +1146,6 @@
|
|
|
1280
1146
|
return ReactPropTypes;
|
|
1281
1147
|
};
|
|
1282
1148
|
|
|
1283
|
-
var propTypes = createCommonjsModule(function (module) {
|
|
1284
1149
|
/**
|
|
1285
1150
|
* Copyright (c) 2013-present, Facebook, Inc.
|
|
1286
1151
|
*
|
|
@@ -1289,69 +1154,79 @@
|
|
|
1289
1154
|
*/
|
|
1290
1155
|
|
|
1291
1156
|
if (process.env.NODE_ENV !== 'production') {
|
|
1292
|
-
var ReactIs = reactIs;
|
|
1157
|
+
var ReactIs = reactIs.exports;
|
|
1293
1158
|
|
|
1294
1159
|
// By explicitly using `prop-types` you are opting into new development behavior.
|
|
1295
1160
|
// http://fb.me/prop-types-in-prod
|
|
1296
1161
|
var throwOnDirectAccess = true;
|
|
1297
|
-
|
|
1162
|
+
propTypes.exports = factoryWithTypeCheckers(ReactIs.isElement, throwOnDirectAccess);
|
|
1298
1163
|
} else {
|
|
1299
1164
|
// By explicitly using `prop-types` you are opting into new production behavior.
|
|
1300
1165
|
// http://fb.me/prop-types-in-prod
|
|
1301
|
-
|
|
1166
|
+
propTypes.exports = factoryWithThrowingShims();
|
|
1302
1167
|
}
|
|
1303
|
-
});
|
|
1304
1168
|
|
|
1305
|
-
var
|
|
1306
|
-
styleInject(css_248z$2);
|
|
1169
|
+
var PropTypes = propTypes.exports;
|
|
1307
1170
|
|
|
1308
|
-
var
|
|
1309
|
-
|
|
1310
|
-
|
|
1311
|
-
|
|
1312
|
-
|
|
1313
|
-
|
|
1314
|
-
|
|
1315
|
-
|
|
1316
|
-
|
|
1317
|
-
|
|
1318
|
-
|
|
1319
|
-
|
|
1320
|
-
|
|
1321
|
-
|
|
1322
|
-
|
|
1323
|
-
|
|
1324
|
-
|
|
1171
|
+
var css_248z$s = "/* 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}\n.goa-callout *:first-child {\n margin-top: 0;\n}\n.goa-callout *:last-child {\n margin-bottom: 0;\n}\n.goa-callout.goa--important {\n border-color: #feba35;\n}\n.goa-callout.goa--emergency {\n border-color: #EC040B;\n}\n.goa-callout.goa--error {\n border-color: #EC040B;\n}\n.goa-callout.goa--success {\n border-color: #00853f;\n}\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}\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}\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}\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}\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}\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}\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}\n.goa-callout .messages {\n margin-bottom: 0;\n margin-top: 1em;\n}";
|
|
1172
|
+
styleInject(css_248z$s);
|
|
1173
|
+
|
|
1174
|
+
var GoACallout = function GoACallout(_a) {
|
|
1175
|
+
var title = _a.title,
|
|
1176
|
+
_b = _a.type,
|
|
1177
|
+
type = _b === void 0 ? "information" : _b,
|
|
1178
|
+
content = _a.content,
|
|
1179
|
+
_c = _a.children,
|
|
1180
|
+
children = _c === void 0 ? null : _c;
|
|
1181
|
+
__rest(_a, ["title", "type", "content", "children"]);
|
|
1182
|
+
|
|
1183
|
+
return jsxRuntime.jsx("div", {
|
|
1184
|
+
children: jsxRuntime.jsx("div", __assign({
|
|
1185
|
+
className: "goa-callout goa--" + type
|
|
1186
|
+
}, {
|
|
1187
|
+
children: jsxRuntime.jsxs("div", {
|
|
1188
|
+
children: [jsxRuntime.jsx("h3", __assign({
|
|
1189
|
+
"data-testid": 'callout-title'
|
|
1190
|
+
}, {
|
|
1191
|
+
children: title
|
|
1192
|
+
}), void 0), jsxRuntime.jsx("div", __assign({
|
|
1193
|
+
className: "messages",
|
|
1194
|
+
"data-testid": 'callout-content'
|
|
1195
|
+
}, {
|
|
1196
|
+
children: content || children
|
|
1197
|
+
}), void 0)]
|
|
1198
|
+
}, void 0)
|
|
1199
|
+
}), void 0)
|
|
1200
|
+
}, void 0);
|
|
1325
1201
|
};
|
|
1326
1202
|
GoACallout.propTypes = {
|
|
1327
|
-
title:
|
|
1328
|
-
type:
|
|
1329
|
-
content:
|
|
1203
|
+
title: PropTypes.string,
|
|
1204
|
+
type: PropTypes.string.isRequired,
|
|
1205
|
+
content: PropTypes.string
|
|
1330
1206
|
};
|
|
1331
1207
|
|
|
1332
|
-
var css_248z$
|
|
1333
|
-
styleInject(css_248z$
|
|
1208
|
+
var css_248z$r = "/* 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}\n.goa-notification.dismissed {\n display: none;\n}\n@media screen and (min-width: 768px) and (max-width: 1199px) {\n .goa-notification {\n padding-left: 24px;\n padding-right: 24px;\n }\n}\n@media screen and (max-width: 767px) {\n .goa-notification {\n padding-left: 24px;\n padding-right: 24px;\n }\n}\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}\n.goa-notification .content .message {\n flex: 1 0 0;\n box-sizing: border-box;\n min-height: 56px;\n padding: 28px 0;\n}\n.goa-notification .content .close {\n flex: 0 1 auto;\n color: #fff;\n}\n.goa-notification a {\n color: #fff;\n}\n.goa-notification a:hover, .goa-notification a:focus {\n color: #fff;\n text-decoration: none;\n}\n.goa-notification.goa--event {\n background-color: #00853f;\n}\n.goa-notification.goa--important {\n background-color: #feba35;\n}\n.goa-notification.goa--important .message {\n color: #333;\n}\n.goa-notification.goa--important a {\n color: #333;\n}\n.goa-notification.goa--important a:hover, .goa-notification.goa--important a:focus {\n color: #333;\n}\n.goa-notification.goa--emergency {\n background-color: #EC040B;\n}\n.goa-notification .close {\n align-self: center;\n position: absolute;\n right: 12px;\n cursor: pointer;\n}\n.goa-notification .close svg {\n fill: #fff;\n color: #fff;\n}\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}\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}\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}\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}";
|
|
1209
|
+
styleInject(css_248z$r);
|
|
1334
1210
|
|
|
1335
|
-
var css_248z$
|
|
1336
|
-
styleInject(css_248z$
|
|
1211
|
+
var css_248z$q = ".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}\n.goa-notifications ul li {\n box-sizing: border-box;\n display: block;\n width: 100%;\n margin: 0;\n padding: 0;\n}";
|
|
1212
|
+
styleInject(css_248z$q);
|
|
1337
1213
|
|
|
1338
|
-
var GoANotification = function GoANotification(
|
|
1339
|
-
var title =
|
|
1340
|
-
|
|
1341
|
-
type =
|
|
1342
|
-
message =
|
|
1343
|
-
notificationUrl =
|
|
1344
|
-
|
|
1345
|
-
isDismissable =
|
|
1346
|
-
|
|
1347
|
-
children =
|
|
1348
|
-
onDismiss =
|
|
1349
|
-
|
|
1350
|
-
|
|
1351
|
-
var
|
|
1352
|
-
|
|
1353
|
-
|
|
1354
|
-
setDismissed = _useState2[1];
|
|
1214
|
+
var GoANotification = function GoANotification(_a) {
|
|
1215
|
+
var title = _a.title,
|
|
1216
|
+
_b = _a.type,
|
|
1217
|
+
type = _b === void 0 ? "information" : _b,
|
|
1218
|
+
message = _a.message,
|
|
1219
|
+
notificationUrl = _a.notificationUrl,
|
|
1220
|
+
_c = _a.isDismissable,
|
|
1221
|
+
isDismissable = _c === void 0 ? true : _c,
|
|
1222
|
+
_d = _a.children,
|
|
1223
|
+
children = _d === void 0 ? null : _d,
|
|
1224
|
+
onDismiss = _a.onDismiss;
|
|
1225
|
+
__rest(_a, ["title", "type", "message", "notificationUrl", "isDismissable", "children", "onDismiss"]);
|
|
1226
|
+
|
|
1227
|
+
var _e = React.useState(false),
|
|
1228
|
+
dismissed = _e[0],
|
|
1229
|
+
setDismissed = _e[1];
|
|
1355
1230
|
|
|
1356
1231
|
var dismissTrigger = function dismissTrigger(dismissAction) {
|
|
1357
1232
|
setDismissed(dismissAction);
|
|
@@ -1359,177 +1234,231 @@
|
|
|
1359
1234
|
};
|
|
1360
1235
|
|
|
1361
1236
|
if (!dismissed) {
|
|
1362
|
-
return
|
|
1363
|
-
|
|
1364
|
-
|
|
1365
|
-
|
|
1366
|
-
|
|
1367
|
-
|
|
1368
|
-
|
|
1369
|
-
|
|
1370
|
-
|
|
1371
|
-
|
|
1372
|
-
|
|
1373
|
-
|
|
1374
|
-
|
|
1375
|
-
|
|
1376
|
-
|
|
1377
|
-
|
|
1378
|
-
|
|
1379
|
-
|
|
1380
|
-
|
|
1381
|
-
|
|
1382
|
-
|
|
1383
|
-
|
|
1384
|
-
|
|
1385
|
-
|
|
1386
|
-
|
|
1387
|
-
|
|
1388
|
-
|
|
1389
|
-
|
|
1390
|
-
|
|
1237
|
+
return jsxRuntime.jsxs("div", {
|
|
1238
|
+
children: [jsxRuntime.jsx("div", __assign({
|
|
1239
|
+
className: "goa-notifications"
|
|
1240
|
+
}, {
|
|
1241
|
+
children: jsxRuntime.jsx("h2", __assign({
|
|
1242
|
+
className: "title"
|
|
1243
|
+
}, {
|
|
1244
|
+
children: title
|
|
1245
|
+
}), void 0)
|
|
1246
|
+
}), void 0), jsxRuntime.jsx("div", __assign({
|
|
1247
|
+
role: "notification",
|
|
1248
|
+
className: "goa-notification goa--" + type
|
|
1249
|
+
}, {
|
|
1250
|
+
children: jsxRuntime.jsxs("div", __assign({
|
|
1251
|
+
className: 'content'
|
|
1252
|
+
}, {
|
|
1253
|
+
children: [notificationUrl ? jsxRuntime.jsx("a", __assign({
|
|
1254
|
+
className: "message",
|
|
1255
|
+
role: "url",
|
|
1256
|
+
href: notificationUrl
|
|
1257
|
+
}, {
|
|
1258
|
+
children: message || children
|
|
1259
|
+
}), void 0) : jsxRuntime.jsx("span", __assign({
|
|
1260
|
+
className: "message"
|
|
1261
|
+
}, {
|
|
1262
|
+
children: message || children
|
|
1263
|
+
}), void 0), isDismissable && jsxRuntime.jsx("a", __assign({
|
|
1264
|
+
role: "closeBox",
|
|
1265
|
+
className: "close",
|
|
1266
|
+
title: "Dismiss",
|
|
1267
|
+
onClick: function () {
|
|
1268
|
+
return dismissTrigger(!dismissed);
|
|
1269
|
+
}
|
|
1270
|
+
}, {
|
|
1271
|
+
children: jsxRuntime.jsx("svg", __assign({
|
|
1272
|
+
width: "16px",
|
|
1273
|
+
height: "16px",
|
|
1274
|
+
viewBox: "0 0 16 16"
|
|
1275
|
+
}, {
|
|
1276
|
+
children: jsxRuntime.jsx("path", {
|
|
1277
|
+
d: "M 15.99 14.54C 15.99 14.54 14.54 15.99 14.54 15.99 14.54 15.99 8 9.45 8 9.45 8 9.45 1.46 15.99 1.46 15.99 1.46 15.99 0.01 14.54 0.01 14.54 0.01 14.54 6.55 8 6.55 8 6.55 8 0.01 1.46 0.01 1.46 0.01 1.46 1.46 0.01 1.46 0.01 1.46 0.01 8 6.55 8 6.55 8 6.55 14.54 0.01 14.54 0.01 14.54 0.01 15.99 1.46 15.99 1.46 15.99 1.46 9.45 8 9.45 8 9.45 8 15.99 14.54 15.99 14.54Z"
|
|
1278
|
+
}, void 0)
|
|
1279
|
+
}), void 0)
|
|
1280
|
+
}), void 0)]
|
|
1281
|
+
}), void 0)
|
|
1282
|
+
}), void 0)]
|
|
1283
|
+
}, void 0);
|
|
1391
1284
|
} else {
|
|
1392
1285
|
return null;
|
|
1393
1286
|
}
|
|
1394
1287
|
};
|
|
1395
1288
|
GoANotification.propTypes = {
|
|
1396
|
-
title:
|
|
1397
|
-
type:
|
|
1398
|
-
content:
|
|
1289
|
+
title: PropTypes.string,
|
|
1290
|
+
type: PropTypes.string.isRequired,
|
|
1291
|
+
content: PropTypes.string
|
|
1399
1292
|
};
|
|
1400
1293
|
|
|
1401
|
-
var css_248z$
|
|
1402
|
-
styleInject(css_248z$
|
|
1294
|
+
var css_248z$p = "/* 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}\nbutton.goa-button.btn-small,\ninput[type=button].goa-button.btn-small,\ninput[type=submit].goa-button.btn-small {\n font-size: 16px;\n padding: 8px;\n margin: 12px 12px 0 0;\n}\nbutton.goa-button:last-of-type,\ninput[type=button].goa-button:last-of-type,\ninput[type=submit].goa-button:last-of-type {\n margin-right: 0;\n}\nbutton.goa-button:disabled, button.goa-button:disabled.goa--secondary, button.goa-button:disabled.goa--tertiary,\ninput[type=button].goa-button:disabled,\ninput[type=button].goa-button:disabled.goa--secondary,\ninput[type=button].goa-button:disabled.goa--tertiary,\ninput[type=submit].goa-button:disabled,\ninput[type=submit].goa-button:disabled.goa--secondary,\ninput[type=submit].goa-button:disabled.goa--tertiary {\n pointer-events: none;\n color: #666;\n background-color: #f1f1f1;\n border-color: #f1f1f1;\n}\nbutton.goa-button:hover,\ninput[type=button].goa-button:hover,\ninput[type=submit].goa-button:hover {\n border-color: #004f84;\n background: #004f84;\n}\nbutton.goa-button:focus, button.goa-button:active,\ninput[type=button].goa-button:focus,\ninput[type=button].goa-button:active,\ninput[type=submit].goa-button:focus,\ninput[type=submit].goa-button:active {\n border-color: #004f84;\n box-shadow: 0 0 0 3px #feba35;\n background: #004f84;\n outline: none;\n}\nbutton.goa-button.goa--secondary,\ninput[type=button].goa-button.goa--secondary,\ninput[type=submit].goa-button.goa--secondary {\n border: 2px solid #0070c4;\n background: #fff;\n color: #0070c4;\n}\nbutton.goa-button.goa--secondary:hover,\ninput[type=button].goa-button.goa--secondary:hover,\ninput[type=submit].goa-button.goa--secondary:hover {\n border-color: #004f84;\n background: #fff;\n color: #004f84;\n}\nbutton.goa-button.goa--secondary:focus, button.goa-button.goa--secondary:active,\ninput[type=button].goa-button.goa--secondary:focus,\ninput[type=button].goa-button.goa--secondary:active,\ninput[type=submit].goa-button.goa--secondary:focus,\ninput[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}\nbutton.goa-button.goa--tertiary,\ninput[type=button].goa-button.goa--tertiary,\ninput[type=submit].goa-button.goa--tertiary {\n border-color: #dcdcdc;\n background: #fff;\n color: #0070c4;\n}\nbutton.goa-button.goa--tertiary:hover,\ninput[type=button].goa-button.goa--tertiary:hover,\ninput[type=submit].goa-button.goa--tertiary:hover {\n background: #fff;\n color: #004f84;\n}\nbutton.goa-button.goa--tertiary:focus, button.goa-button.goa--tertiary:active,\ninput[type=button].goa-button.goa--tertiary:focus,\ninput[type=button].goa-button.goa--tertiary:active,\ninput[type=submit].goa-button.goa--tertiary:focus,\ninput[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}\nbutton.goa-button.goa--borderless,\ninput[type=button].goa-button.goa--borderless,\ninput[type=submit].goa-button.goa--borderless {\n background: none;\n color: var(--color-blue-500);\n border: none;\n transition: transform 0.1s ease-in-out;\n transform: scale(1);\n}\nbutton.goa-button.goa--borderless:hover,\ninput[type=button].goa-button.goa--borderless:hover,\ninput[type=submit].goa-button.goa--borderless:hover {\n background: var(--color-blue-100);\n color: var(--color-blue-500);\n}\nbutton.goa-button.goa--borderless:focus, button.goa-button.goa--borderless:active,\ninput[type=button].goa-button.goa--borderless:focus,\ninput[type=button].goa-button.goa--borderless:active,\ninput[type=submit].goa-button.goa--borderless:focus,\ninput[type=submit].goa-button.goa--borderless:active {\n background-color: var(--color-blue-100);\n outline: none;\n box-shadow: none;\n}\nbutton.goa-button.goa--borderless:active,\ninput[type=button].goa-button.goa--borderless:active,\ninput[type=submit].goa-button.goa--borderless:active {\n transform: scale(0.95);\n}\nbutton.goa-button.goa--red,\ninput[type=button].goa-button.goa--red,\ninput[type=submit].goa-button.goa--red {\n color: var(--color-red-500);\n background: none;\n border: none;\n transition: transform 0.1s ease-in-out;\n transform: scale(1);\n}\nbutton.goa-button.goa--red:hover,\ninput[type=button].goa-button.goa--red:hover,\ninput[type=submit].goa-button.goa--red:hover {\n background: var(--color-red-100);\n color: var(--color-red-500);\n}\nbutton.goa-button.goa--red:focus, button.goa-button.goa--red:active,\ninput[type=button].goa-button.goa--red:focus,\ninput[type=button].goa-button.goa--red:active,\ninput[type=submit].goa-button.goa--red:focus,\ninput[type=submit].goa-button.goa--red:active {\n background: var(--color-red-100);\n color: var(--color-red-500);\n outline: none;\n box-shadow: none;\n}\nbutton.goa-button.goa--red:active,\ninput[type=button].goa-button.goa--red:active,\ninput[type=submit].goa-button.goa--red:active {\n transform: scale(0.95);\n}";
|
|
1295
|
+
styleInject(css_248z$p);
|
|
1403
1296
|
|
|
1404
|
-
var GoAButton = function GoAButton(
|
|
1405
|
-
var
|
|
1406
|
-
buttonType =
|
|
1407
|
-
|
|
1408
|
-
buttonSize =
|
|
1409
|
-
|
|
1410
|
-
title =
|
|
1411
|
-
|
|
1412
|
-
children =
|
|
1413
|
-
|
|
1414
|
-
onClick =
|
|
1415
|
-
props =
|
|
1416
|
-
|
|
1417
|
-
var btnTypeClass = buttonType === 'primary' ? '' : "goa--"
|
|
1297
|
+
var GoAButton = function GoAButton(_a) {
|
|
1298
|
+
var _b = _a.buttonType,
|
|
1299
|
+
buttonType = _b === void 0 ? 'primary' : _b,
|
|
1300
|
+
_c = _a.buttonSize,
|
|
1301
|
+
buttonSize = _c === void 0 ? 'normal' : _c,
|
|
1302
|
+
_d = _a.title,
|
|
1303
|
+
title = _d === void 0 ? null : _d,
|
|
1304
|
+
_e = _a.children,
|
|
1305
|
+
children = _e === void 0 ? null : _e,
|
|
1306
|
+
_f = _a.onClick,
|
|
1307
|
+
onClick = _f === void 0 ? null : _f,
|
|
1308
|
+
props = __rest(_a, ["buttonType", "buttonSize", "title", "children", "onClick"]);
|
|
1309
|
+
|
|
1310
|
+
var btnTypeClass = buttonType === 'primary' ? '' : "goa--" + buttonType;
|
|
1418
1311
|
var btnSize = buttonSize === 'small' ? 'btn-small' : '';
|
|
1419
|
-
return
|
|
1420
|
-
className: "goa-button "
|
|
1312
|
+
return jsxRuntime.jsx("button", __assign({
|
|
1313
|
+
className: "goa-button " + btnSize + " " + btnTypeClass,
|
|
1421
1314
|
title: title,
|
|
1422
1315
|
onClick: onClick
|
|
1423
|
-
}, props
|
|
1316
|
+
}, props, {
|
|
1317
|
+
children: children
|
|
1318
|
+
}), void 0);
|
|
1424
1319
|
};
|
|
1425
1320
|
GoAButton.propTypes = {
|
|
1426
|
-
buttonSize:
|
|
1427
|
-
buttonType:
|
|
1428
|
-
title:
|
|
1429
|
-
children:
|
|
1430
|
-
onClick:
|
|
1321
|
+
buttonSize: PropTypes.string,
|
|
1322
|
+
buttonType: PropTypes.string,
|
|
1323
|
+
title: PropTypes.string,
|
|
1324
|
+
children: PropTypes.node,
|
|
1325
|
+
onClick: PropTypes.func
|
|
1431
1326
|
};
|
|
1432
1327
|
|
|
1433
|
-
var css_248z$
|
|
1434
|
-
styleInject(css_248z$
|
|
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);
|
|
1328
|
+
var css_248z$o = "/* Palette */\n/* Semantic usages */\n.goa-header {\n display: flex;\n align-items: center;\n padding-left: 28px;\n padding-right: 28px;\n}\n@media screen and (min-width: 768px) and (max-width: 1199px) {\n .goa-header {\n padding-left: 28px;\n padding-right: 28px;\n }\n}\n@media screen and (max-width: 767px) {\n .goa-header {\n padding-left: 28px;\n padding-right: 28px;\n }\n}\n.goa-header.goa-microsite-header, .goa-header > .goa-microsite-header {\n background-color: #fff;\n top: 0;\n display: flex;\n justify-content: space-between;\n}\n.goa-header.goa-official-site-header, .goa-header > .goa-official-site-header {\n font-size: 12px;\n background-color: #f1f1f1;\n line-height: 22px;\n}\n.goa-header.goa-official-site-header .site-text, .goa-header > .goa-official-site-header .site-text {\n white-space: nowrap;\n padding: 0 4px;\n}\n.goa-header.goa-official-site-header .service-level, .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}\n.goa-header.goa-official-site-header .service-level--alpha, .goa-header > .goa-official-site-header .service-level--alpha {\n background-color: #feba35;\n color: #333;\n}\n.goa-header.goa-official-site-header .service-level--beta, .goa-header > .goa-official-site-header .service-level--beta {\n background-color: #0081a2;\n color: #fff;\n}\n.goa-header.goa-official-site-header .service-level--live, .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}\n.goa-header .web-link {\n color: #0070c4;\n text-align: left;\n}";
|
|
1329
|
+
styleInject(css_248z$o);
|
|
1438
1330
|
|
|
1439
|
-
|
|
1331
|
+
var css_248z$n = "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}\na.microsite-link:focus, a.microsite-link:hover, a.microsite-link:active {\n outline: none;\n}\na.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}\n@media screen and (max-width: 767px) {\n a.microsite-link .image-desktop-tablet {\n display: none;\n }\n}\n@media screen and (min-width: 768px) and (max-width: 1199px) {\n a.microsite-link .image-mobile {\n display: none;\n }\n}\n@media screen and (min-width: 1200px) {\n a.microsite-link .image-mobile {\n display: none;\n }\n}\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 }\n}\na.microsite-link .name {\n margin-left: 8px;\n font-size: 16px;\n overflow: hidden;\n white-space: nowrap;\n text-overflow: ellipsis;\n}\n@media screen and (min-width: 1200px) {\n a.microsite-link .name {\n margin-left: 28px;\n }\n}\n@media screen and (min-width: 768px) and (max-width: 1199px) {\n a.microsite-link .name {\n margin-left: 28px;\n }\n}";
|
|
1332
|
+
styleInject(css_248z$n);
|
|
1440
1333
|
|
|
1441
1334
|
var GoaMicrositeLogo = function GoaMicrositeLogo(props) {
|
|
1442
|
-
return
|
|
1335
|
+
return jsxRuntime.jsxs("a", __assign({
|
|
1443
1336
|
href: props.serviceHome,
|
|
1444
1337
|
"aria-label": props.serviceHome,
|
|
1445
1338
|
className: "microsite-link"
|
|
1446
|
-
},
|
|
1447
|
-
|
|
1448
|
-
|
|
1449
|
-
|
|
1450
|
-
|
|
1451
|
-
|
|
1452
|
-
|
|
1339
|
+
}, {
|
|
1340
|
+
children: [jsxRuntime.jsx("span", {
|
|
1341
|
+
className: "image-desktop-tablet"
|
|
1342
|
+
}, void 0), jsxRuntime.jsx("span", {
|
|
1343
|
+
className: "image-mobile"
|
|
1344
|
+
}, void 0), jsxRuntime.jsx("span", __assign({
|
|
1345
|
+
className: "name"
|
|
1346
|
+
}, {
|
|
1347
|
+
children: props.serviceName
|
|
1348
|
+
}), void 0)]
|
|
1349
|
+
}), void 0);
|
|
1453
1350
|
};
|
|
1454
1351
|
|
|
1455
1352
|
var GoAHeader = function GoAHeader(props) {
|
|
1456
|
-
var serviceLevelCss =
|
|
1353
|
+
var serviceLevelCss = classnames__default["default"]('service-level', "service-level--" + props.serviceLevel.toString().toLowerCase());
|
|
1457
1354
|
|
|
1458
1355
|
function serviceLevelFormatted() {
|
|
1459
1356
|
return props.serviceLevel.toLowerCase();
|
|
1460
1357
|
}
|
|
1461
1358
|
|
|
1462
|
-
return
|
|
1463
|
-
|
|
1464
|
-
|
|
1465
|
-
|
|
1466
|
-
|
|
1467
|
-
|
|
1468
|
-
|
|
1469
|
-
|
|
1470
|
-
|
|
1471
|
-
|
|
1472
|
-
|
|
1473
|
-
|
|
1474
|
-
|
|
1475
|
-
|
|
1476
|
-
|
|
1477
|
-
|
|
1478
|
-
|
|
1479
|
-
|
|
1480
|
-
|
|
1481
|
-
|
|
1359
|
+
return jsxRuntime.jsxs("header", {
|
|
1360
|
+
children: [jsxRuntime.jsxs("div", __assign({
|
|
1361
|
+
className: "goa-header goa-official-site-header"
|
|
1362
|
+
}, {
|
|
1363
|
+
children: [jsxRuntime.jsx("div", {
|
|
1364
|
+
children: jsxRuntime.jsx("span", __assign({
|
|
1365
|
+
className: serviceLevelCss
|
|
1366
|
+
}, {
|
|
1367
|
+
children: serviceLevelFormatted()
|
|
1368
|
+
}), void 0)
|
|
1369
|
+
}, void 0), props.serviceLevel === 'live' && jsxRuntime.jsxs("div", __assign({
|
|
1370
|
+
className: "site-text"
|
|
1371
|
+
}, {
|
|
1372
|
+
children: ["An official site of the ", jsxRuntime.jsx("a", __assign({
|
|
1373
|
+
href: "https://www.alberta.ca/index.aspx",
|
|
1374
|
+
className: "web-link"
|
|
1375
|
+
}, {
|
|
1376
|
+
children: "Alberta Government"
|
|
1377
|
+
}), void 0)]
|
|
1378
|
+
}), void 0), props.serviceLevel !== 'live' && jsxRuntime.jsxs("div", __assign({
|
|
1379
|
+
className: "site-text"
|
|
1380
|
+
}, {
|
|
1381
|
+
children: ["This is a new ", jsxRuntime.jsx("a", __assign({
|
|
1382
|
+
href: "https://www.alberta.ca/index.aspx",
|
|
1383
|
+
className: "web-link"
|
|
1384
|
+
}, {
|
|
1385
|
+
children: "Alberta Government"
|
|
1386
|
+
}), void 0), " service"]
|
|
1387
|
+
}), void 0)]
|
|
1388
|
+
}), void 0), jsxRuntime.jsxs("div", __assign({
|
|
1389
|
+
className: "goa-header goa-microsite-header"
|
|
1390
|
+
}, {
|
|
1391
|
+
children: [jsxRuntime.jsx(GoaMicrositeLogo, {
|
|
1392
|
+
serviceName: props.serviceName,
|
|
1393
|
+
serviceHome: props.serviceHome
|
|
1394
|
+
}, void 0), jsxRuntime.jsx("div", {
|
|
1395
|
+
children: props.children
|
|
1396
|
+
}, void 0)]
|
|
1397
|
+
}), void 0)]
|
|
1398
|
+
}, void 0);
|
|
1482
1399
|
};
|
|
1483
1400
|
|
|
1484
|
-
var css_248z$
|
|
1485
|
-
styleInject(css_248z$
|
|
1401
|
+
var css_248z$m = ".goa-hero-banner-content {\n font-size: 24px;\n line-height: 32px;\n margin: 0;\n color: #fff;\n}\n@media screen and (min-width: 768px) and (max-width: 1199px) {\n .goa-hero-banner-content {\n width: 80%;\n }\n}\n@media screen and (min-width: 1200px) {\n .goa-hero-banner-content {\n width: 40%;\n }\n}\n.goa-hero-banner-content:last-of-type {\n margin-bottom: 28px;\n}";
|
|
1402
|
+
styleInject(css_248z$m);
|
|
1486
1403
|
|
|
1487
|
-
var GoAHeroBannerContent = function GoAHeroBannerContent(
|
|
1488
|
-
var content =
|
|
1489
|
-
children =
|
|
1490
|
-
return
|
|
1404
|
+
var GoAHeroBannerContent = function GoAHeroBannerContent(_a) {
|
|
1405
|
+
var content = _a.content,
|
|
1406
|
+
children = _a.children;
|
|
1407
|
+
return jsxRuntime.jsx("p", __assign({
|
|
1491
1408
|
className: "goa-hero-banner-content",
|
|
1492
1409
|
role: "note"
|
|
1493
|
-
},
|
|
1410
|
+
}, {
|
|
1411
|
+
children: children || content
|
|
1412
|
+
}), void 0);
|
|
1494
1413
|
};
|
|
1495
1414
|
|
|
1496
|
-
var css_248z$
|
|
1497
|
-
styleInject(css_248z$
|
|
1415
|
+
var css_248z$l = "@charset \"UTF-8\";\n/* 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}\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}\n.goa-link-button.goa-link-button.btn-small {\n font-size: 16px;\n padding: 8px;\n margin: 12px 12px 0 0;\n}\n.goa-link-button.goa-link-button:last-of-type {\n margin-right: 0;\n}\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}\n.goa-link-button.goa-link-button:hover {\n border-color: #004f84;\n background: #004f84;\n}\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}\n.goa-link-button.goa-link-button.goa--secondary {\n border: 2px solid #0070c4;\n background: #fff;\n color: #0070c4;\n}\n.goa-link-button.goa-link-button.goa--secondary:hover {\n border-color: #004f84;\n background: #fff;\n color: #004f84;\n}\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}\n.goa-link-button.goa-link-button.goa--tertiary {\n border-color: #dcdcdc;\n background: #fff;\n color: #0070c4;\n}\n.goa-link-button.goa-link-button.goa--tertiary:hover {\n background: #fff;\n color: #004f84;\n}\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}\n.goa-link-button.goa-link-button.goa--borderless {\n background: none;\n color: var(--color-blue-500);\n border: none;\n transition: transform 0.1s ease-in-out;\n transform: scale(1);\n}\n.goa-link-button.goa-link-button.goa--borderless:hover {\n background: var(--color-blue-100);\n color: var(--color-blue-500);\n}\n.goa-link-button.goa-link-button.goa--borderless:focus, .goa-link-button.goa-link-button.goa--borderless:active {\n background-color: var(--color-blue-100);\n outline: none;\n box-shadow: none;\n}\n.goa-link-button.goa-link-button.goa--borderless:active {\n transform: scale(0.95);\n}\n.goa-link-button.goa-link-button.goa--red {\n color: var(--color-red-500);\n background: none;\n border: none;\n transition: transform 0.1s ease-in-out;\n transform: scale(1);\n}\n.goa-link-button.goa-link-button.goa--red:hover {\n background: var(--color-red-100);\n color: var(--color-red-500);\n}\n.goa-link-button.goa-link-button.goa--red:focus, .goa-link-button.goa-link-button.goa--red:active {\n background: var(--color-red-100);\n color: var(--color-red-500);\n outline: none;\n box-shadow: none;\n}\n.goa-link-button.goa-link-button.goa--red:active {\n transform: scale(0.95);\n}\n.goa-link-button.goa-link-button.right-arrow::after {\n color: #fff;\n margin-left: 8px;\n content: \"→\";\n}\n.goa-link-button.goa-link-button.up-arrow::after {\n color: #fff;\n margin-left: 8px;\n content: \"↑\";\n}\n.goa-link-button.goa-link-button:visited, .goa-link-button.goa-link-button:link {\n color: #fff;\n}";
|
|
1416
|
+
styleInject(css_248z$l);
|
|
1498
1417
|
|
|
1499
|
-
var GoAHeroBannerLink = function GoAHeroBannerLink(
|
|
1500
|
-
var linkText =
|
|
1501
|
-
linkUrl =
|
|
1502
|
-
return linkText && linkUrl ?
|
|
1503
|
-
|
|
1504
|
-
|
|
1505
|
-
|
|
1506
|
-
|
|
1418
|
+
var GoAHeroBannerLink = function GoAHeroBannerLink(_a) {
|
|
1419
|
+
var linkText = _a.linkText,
|
|
1420
|
+
linkUrl = _a.linkUrl;
|
|
1421
|
+
return linkText && linkUrl ? jsxRuntime.jsx("div", {
|
|
1422
|
+
children: jsxRuntime.jsx("a", __assign({
|
|
1423
|
+
className: "goa-link-button right-arrow",
|
|
1424
|
+
href: linkUrl,
|
|
1425
|
+
role: "link"
|
|
1426
|
+
}, {
|
|
1427
|
+
children: linkText
|
|
1428
|
+
}), void 0)
|
|
1429
|
+
}, void 0) : jsxRuntime.jsx(React.Fragment, {}, void 0);
|
|
1507
1430
|
};
|
|
1508
1431
|
|
|
1509
|
-
var css_248z$
|
|
1510
|
-
styleInject(css_248z$
|
|
1432
|
+
var css_248z$k = "/* 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}\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}";
|
|
1433
|
+
styleInject(css_248z$k);
|
|
1511
1434
|
|
|
1512
|
-
var GoAHeroBanner = function GoAHeroBanner(
|
|
1513
|
-
var title =
|
|
1514
|
-
backgroundUrl =
|
|
1515
|
-
content =
|
|
1516
|
-
linkText =
|
|
1517
|
-
linkUrl =
|
|
1518
|
-
children =
|
|
1519
|
-
return
|
|
1435
|
+
var GoAHeroBanner = function GoAHeroBanner(_a) {
|
|
1436
|
+
var title = _a.title,
|
|
1437
|
+
backgroundUrl = _a.backgroundUrl,
|
|
1438
|
+
content = _a.content,
|
|
1439
|
+
linkText = _a.linkText,
|
|
1440
|
+
linkUrl = _a.linkUrl,
|
|
1441
|
+
children = _a.children;
|
|
1442
|
+
return jsxRuntime.jsxs("div", __assign({
|
|
1520
1443
|
className: "goa-hero",
|
|
1521
1444
|
style: {
|
|
1522
|
-
backgroundImage: "linear-gradient(rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0.40) 40%, rgba(0, 0, 0, 0.6) 100%), url('"
|
|
1445
|
+
backgroundImage: "linear-gradient(rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0.40) 40%, rgba(0, 0, 0, 0.6) 100%), url('" + backgroundUrl + "')"
|
|
1523
1446
|
}
|
|
1524
|
-
},
|
|
1525
|
-
|
|
1526
|
-
|
|
1527
|
-
|
|
1528
|
-
|
|
1529
|
-
|
|
1530
|
-
|
|
1531
|
-
|
|
1532
|
-
|
|
1447
|
+
}, {
|
|
1448
|
+
children: [title && jsxRuntime.jsx("h1", __assign({
|
|
1449
|
+
role: "heading",
|
|
1450
|
+
"aria-level": 1
|
|
1451
|
+
}, {
|
|
1452
|
+
children: title
|
|
1453
|
+
}), void 0), children || jsxRuntime.jsxs(React.Fragment, {
|
|
1454
|
+
children: [content && jsxRuntime.jsx(GoAHeroBannerContent, {
|
|
1455
|
+
content: content
|
|
1456
|
+
}, void 0), linkText && linkUrl && jsxRuntime.jsx(GoAHeroBannerLink, {
|
|
1457
|
+
linkText: linkText,
|
|
1458
|
+
linkUrl: linkUrl
|
|
1459
|
+
}, void 0)]
|
|
1460
|
+
}, void 0)]
|
|
1461
|
+
}), void 0);
|
|
1533
1462
|
};
|
|
1534
1463
|
GoAHeroBanner.defaultProps = {
|
|
1535
1464
|
content: '',
|
|
@@ -1537,33 +1466,35 @@
|
|
|
1537
1466
|
linkUrl: ''
|
|
1538
1467
|
};
|
|
1539
1468
|
|
|
1540
|
-
var css_248z$
|
|
1541
|
-
styleInject(css_248z$
|
|
1469
|
+
var css_248z$j = ":host, :root {\n --color-white: #fff;\n --color-black: #333;\n --color-gray-100: #f1f1f1;\n --color-gray-200: #dcdcdc;\n --color-gray-500: #adadad;\n --color-gray-600: #767676;\n --color-gray-700: #666;\n --color-gray-900: #333;\n --color-tealblue-100: #c8eefa;\n --color-tealblue-500: #0081a2;\n --color-tealblue-900: #005072;\n --color-orange: #feba35;\n --color-orange-100: hsl(39.7, 99.01%, 98%);\n --color-orange-500: hsl(39.7, 99.01%, 60.2%);\n --color-orange-900: hsl(39.7, 99.01%, 30%);\n --color-red: #ec040b;\n --color-red-100: hsl(358.19, 96.67%, 98%);\n --color-red-500: hsl(358.19, 96.67%, 47.06%);\n --color-red-600: hsl(358.19, 96.67%, 40%);\n --color-red-900: hsl(358.19, 96.67%, 20%);\n --color-green: #00853F;\n --color-green-100: hsl(148, 100%, 95%);\n --color-green-500: hsl(148.42, 100%, 26.08%);\n --color-green-900: hsl(148, 100%, 10%);\n --color-blue-100: #e3f2ff;\n --color-blue-500: #0070c4;\n --color-blue-600: #004f84;\n}\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 /* line-height */\n --lh-xs: 0.875rem;\n --lh-sm: 1rem;\n --lh-base: 1.5rem;\n --lh-lg: 2rem;\n --lh-xl: 2.75rem;\n --lh-2xl: 3.5rem;\n --border-radius-sm: 0.15rem;\n --border-radius: 0.25rem;\n --border-radius-base: 0.25rem;\n --border-radius-lg: 0.5rem;\n --spacing-1: 0.5rem;\n --spacing-2: 0.875rem;\n --spacing-3: 1.75rem;\n --input-height: 2.625rem;\n --input-padding: 0.5rem;\n --input-border-radius: 0.25rem;\n --input-font-size: var(--fs-base);\n}\n\n.goa-badge-icon {\n font-size: var(--fs-sm);\n}\n\n.badge-module_goa-badge__3F6Ve {\n display: inline-flex;\n align-items: center;\n border-radius: 0.25rem;\n padding: 0 0.5rem;\n gap: 0.25rem;\n}\n\n.badge-module_goa-badge__3F6Ve + .badge-module_goa-badge__3F6Ve {\n margin-left: 0.25rem;\n}\n\n.badge-module_goa-badge-content__3UN-3 {\n text-transform: capitalize;\n font-size: var(--fs-sm);\n font-weight: var(--fw-regular);\n line-height: var(--lh-base);\n}\n\n.badge-module_goa-badge__3F6Ve.badge-module_badge-information__2r_Eq {\n background-color: var(--color-gray-100);\n color: var(--color-tealblue-900);\n}\n\n.badge-module_goa-badge__3F6Ve.badge-module_badge-success__18wcm {\n background-color: var(--color-green-500);\n color: var(--color-white);\n}\n\n.badge-module_goa-badge__3F6Ve.badge-module_badge-warning__20BNM {\n background-color: var(--color-orange-500);\n color: var(--color-black);\n}\n\n.badge-module_goa-badge__3F6Ve.badge-module_badge-emergency__E4mHn {\n background-color: var(--color-red-500);\n color: var(--color-white);\n}\n\n.badge-module_goa-badge__3F6Ve.badge-module_badge-dark__1thw- {\n background-color: var(--color-black);\n color: var(--color-white);\n}\n\n.badge-module_goa-badge__3F6Ve.badge-module_badge-midtone__1Gt4T {\n background-color: var(--color-gray-600);\n color: var(--color-white);\n}\n\n.badge-module_goa-badge__3F6Ve.badge-module_badge-light__B8ZMt {\n background-color: var(--color-white);\n color: var(--color-black);\n}\n\n.badge-module_goa-badge__3F6Ve.badge-module_badge-inactive__35PEw {\n background-color: var(--color-white);\n color: var(--color-black);\n}";
|
|
1470
|
+
styleInject(css_248z$j);
|
|
1542
1471
|
|
|
1543
|
-
var css_248z$
|
|
1544
|
-
styleInject(css_248z$
|
|
1472
|
+
var css_248z$i = ".goa-icon {\n display: flex;\n}\n\n.goa-icon-button {\n cursor: pointer;\n display: inline-flex;\n align-items: center;\n justify-content: center;\n border: none;\n}\n\n/* Primary */\n.goa-icon-button-primary {\n padding: 0.5rem;\n border-radius: 0.5rem;\n color: var(--color-blue-500);\n fill: var(--color-blue-500);\n cursor: pointer;\n transition: background-color 100ms ease-in, transform 100ms ease-in;\n}\n\n.goa-icon-button-primary:active {\n transform: scale(0.9);\n}\n\n.goa-icon-button-primary:hover {\n background-color: var(--color-blue-100);\n}\n\n/* Secondary */\n.goa-icon-button-secondary {\n padding: 0.5rem;\n border-radius: 0.5rem;\n transition: background-color 100ms ease-in, transform 100ms ease-in;\n cursor: pointer;\n}\n\n.goa-icon-button-secondary:active {\n transform: scale(0.9);\n}\n\n.goa-icon-button-secondary:hover {\n background: rgba(0, 0, 0, 0.1);\n color: #000;\n fill: #000;\n}\n\n/* tertiary */\n.goa-icon-button-tertiary {\n padding: 0.5rem;\n transition: background-color 100ms ease-in, transform 100ms ease-in;\n cursor: pointer;\n}\n\n.goa-icon-button-tertiary:active {\n transform: scale(0.9);\n}\n\n.goa-icon-button-tertiary:hover {\n color: #000;\n fill: #000;\n}";
|
|
1473
|
+
styleInject(css_248z$i);
|
|
1545
1474
|
|
|
1546
|
-
function GoAIcon(
|
|
1547
|
-
var type =
|
|
1548
|
-
|
|
1549
|
-
style =
|
|
1550
|
-
|
|
1551
|
-
size =
|
|
1475
|
+
function GoAIcon(_a) {
|
|
1476
|
+
var type = _a.type,
|
|
1477
|
+
_b = _a.style,
|
|
1478
|
+
style = _b === void 0 ? 'outline' : _b,
|
|
1479
|
+
_c = _a.size,
|
|
1480
|
+
size = _c === void 0 ? 'medium' : _c;
|
|
1552
1481
|
|
|
1553
1482
|
var _size = getSize(size);
|
|
1554
1483
|
|
|
1555
|
-
return
|
|
1484
|
+
return jsxRuntime.jsx("div", __assign({
|
|
1556
1485
|
style: {
|
|
1557
1486
|
width: _size
|
|
1558
1487
|
},
|
|
1559
1488
|
className: "goa-icon",
|
|
1560
|
-
"data-testid": "icon-"
|
|
1561
|
-
},
|
|
1562
|
-
|
|
1563
|
-
|
|
1564
|
-
|
|
1565
|
-
|
|
1566
|
-
|
|
1489
|
+
"data-testid": "icon-" + type
|
|
1490
|
+
}, {
|
|
1491
|
+
children: jsxRuntime.jsx("ion-icon", {
|
|
1492
|
+
style: {
|
|
1493
|
+
fontSize: _size
|
|
1494
|
+
},
|
|
1495
|
+
name: style === 'filled' ? type : type + "-" + style
|
|
1496
|
+
}, void 0)
|
|
1497
|
+
}), void 0);
|
|
1567
1498
|
}
|
|
1568
1499
|
|
|
1569
1500
|
function getSize(size) {
|
|
@@ -1582,135 +1513,154 @@
|
|
|
1582
1513
|
}
|
|
1583
1514
|
}
|
|
1584
1515
|
|
|
1585
|
-
function GoAIconButton(
|
|
1586
|
-
var type =
|
|
1587
|
-
|
|
1588
|
-
|
|
1589
|
-
|
|
1590
|
-
|
|
1591
|
-
|
|
1592
|
-
|
|
1593
|
-
|
|
1594
|
-
|
|
1516
|
+
function GoAIconButton(_a) {
|
|
1517
|
+
var type = _a.type,
|
|
1518
|
+
disabled = _a.disabled,
|
|
1519
|
+
_b = _a.variant,
|
|
1520
|
+
variant = _b === void 0 ? 'primary' : _b,
|
|
1521
|
+
onClick = _a.onClick,
|
|
1522
|
+
_c = _a.size,
|
|
1523
|
+
size = _c === void 0 ? 'medium' : _c,
|
|
1524
|
+
title = _a.title,
|
|
1525
|
+
testId = _a.testId;
|
|
1526
|
+
return jsxRuntime.jsx("button", __assign({
|
|
1595
1527
|
title: title,
|
|
1596
|
-
|
|
1528
|
+
disabled: disabled,
|
|
1529
|
+
className: "goa-icon-button goa-icon-button-" + variant,
|
|
1597
1530
|
"data-testid": testId,
|
|
1598
1531
|
onClick: onClick
|
|
1599
|
-
},
|
|
1600
|
-
|
|
1601
|
-
|
|
1602
|
-
|
|
1532
|
+
}, {
|
|
1533
|
+
children: jsxRuntime.jsx(GoAIcon, {
|
|
1534
|
+
type: type,
|
|
1535
|
+
size: size
|
|
1536
|
+
}, void 0)
|
|
1537
|
+
}), void 0);
|
|
1603
1538
|
}
|
|
1604
1539
|
|
|
1605
|
-
var css_248z$
|
|
1606
|
-
styleInject(css_248z$
|
|
1607
|
-
|
|
1608
|
-
var css_248z$e = "/* Palette */\n/* Semantic usages */\n.app-version-header-module_goa-app-version-header__3ngyf {\n display: flex;\n justify-content: center;\n background-color: #dcdcdc; }\n .app-version-header-module_goa-app-version-header__3ngyf .app-version-header-module_content-wrapper__15exd {\n display: flex;\n flex: 1 1 auto;\n margin: 0 24px;\n max-width: 1200px; }\n @media (min-width: 768px) {\n .app-version-header-module_goa-app-version-header__3ngyf .app-version-header-module_content-wrapper__15exd {\n margin: 0 72px; } }\n .app-version-header-module_goa-app-version-header__3ngyf .app-version-header-module_content-wrapper__15exd .app-version-header-module_environment-and-version__1-GPd {\n display: flex;\n flex: 1 1 auto;\n justify-content: center;\n padding-left: 20px; }\n .app-version-header-module_goa-app-version-header__3ngyf .app-version-header-module_content-wrapper__15exd .app-version-header-module_close__1beXI {\n margin-left: auto;\n width: 20px;\n text-align: right;\n font-weight: bold;\n font-size: small;\n align-self: center;\n cursor: pointer;\n display: flex; }\n .app-version-header-module_goa-app-version-header__3ngyf .app-version-header-module_content-wrapper__15exd .app-version-header-module_close__1beXI svg {\n color: #0070c4; }\n";
|
|
1609
|
-
styleInject(css_248z$e);
|
|
1610
|
-
|
|
1611
|
-
var css_248z$f = ":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 /* line-height */\n --lh-xs: 0.875rem;\n --lh-sm: 1rem;\n --lh-base: 1.5rem;\n --lh-lg: 2rem;\n --lh-xl: 2.75rem;\n --lh-2xl: 3.5rem;\n --border-radius-sm: 0.15rem;\n --border-radius: 0.25rem;\n --border-radius-base: 0.25rem;\n --border-radius-lg: 0.5rem;\n --spacing-1: 0.5rem;\n --spacing-2: 0.875rem;\n --spacing-3: 1.75rem;\n --input-padding: 0.5rem;\n --input-border-radius: 0.25rem;\n --input-font-size: var(--fs-base); }\n\n:host, :root {\n --color-white: #fff;\n --color-black: #333;\n --color-gray-100: #f1f1f1;\n --color-gray-200: #dcdcdc;\n --color-gray-500: #adadad;\n --color-gray-600: #767676;\n --color-gray-700: #666;\n --color-gray-900: #333;\n --color-tealblue-100: #c8eefa;\n --color-tealblue-500: #0081a2;\n --color-tealblue-900: #005072;\n --color-orange: #feba35;\n --color-orange-100: hsl(39.7, 99.01%, 98%);\n --color-orange-500: hsl(39.7, 99.01%, 60.2%);\n --color-orange-900: hsl(39.7, 99.01%, 30%);\n --color-red: #ec040b;\n --color-red-100: hsl(358.19, 96.67%, 98%);\n --color-red-500: hsl(358.19, 96.67%, 47.06%);\n --color-red-600: hsl(358.19, 96.67%, 40%);\n --color-red-900: hsl(358.19, 96.67%, 20%);\n --color-green: #00853F;\n --color-green-100: hsl(148, 100%, 95%);\n --color-green-500: hsl(148.42, 100%, 26.08%);\n --color-green-900: hsl(148, 100%, 10%);\n --color-blue-100: #e3f2ff;\n --color-blue-500: #0070c4;\n --color-blue-600: #004f84; }\n\nh1:first-child,\nh2:first-child,\nh3:first-child {\n margin-top: 0; }\n\n/* Base header margins */\nh1,\nh2,\nh3,\nh4 {\n margin-bottom: 1rem; }\n\n/* Font sizes */\nh1 {\n font-size: var(--fs-3xl);\n line-height: var(--lh-2xl);\n font-weight: var(--fw-bold); }\n\nh2 {\n font-size: var(--fs-2xl);\n line-height: var(--lh-xl);\n font-weight: var(--fw-regular); }\n\nh3 {\n font-size: var(--fs-xl);\n line-height: var(--lh-lg);\n font-weight: var(--fw-regular); }\n\nh4,\nh5,\nh6 {\n font-size: var(--fs-base);\n line-height: var(--lh-base);\n font-weight: var(--fw-bold); }\n\n/* Set top margin to subsequent headers */\nh1 + h2,\nh1 + h3,\nh1 + h4,\nh2 + h3,\nh2 + h4,\nh3 + h4 {\n margin-top: 2rem; }\n\np {\n margin-bottom: 1rem;\n font-size: var(--fs-base); }\n\nhr + h1,\nhr + h2,\nhr + h3 {\n margin-top: 0; }\n\nem {\n font-size: var(--fs-xs);\n line-height: var(--lh-sm);\n color: var(--color-gray); }\n\nsmall {\n font-size: var(--fs-xs);\n font-style: normal;\n color: var(--color-gray); }\n\n.card-module_goa-card__OjjJX {\n --card-spacing: 1rem;\n --card-child-spacing: 0.5rem;\n box-sizing: border-box;\n background: var(--color-white);\n transition: opacity 300ms ease-in-out;\n border-radius: var(--border-radius); }\n .card-module_goa-card__OjjJX a:hover {\n color: var(--color-blue-600);\n text-decoration: none; }\n .card-module_goa-card__OjjJX a:focus {\n outline: 3px solid var(--color-orange);\n outline-offset: 0; }\n .card-module_goa-card__OjjJX h6 {\n font-size: var(--fs-xs);\n line-height: var(--lh-sm);\n font-weight: var(--fw-base);\n color: var(--color-gray);\n margin: 0;\n padding: 0; }\n\n.card-module_goa-card--tertiary__1BV7k {\n border-radius: var(--border-radius-sm); }\n\n.card-module_goa-card-top__RM4IA {\n border-top-left-radius: var(--border-radius);\n border-top-right-radius: var(--border-radius);\n min-height: 0.5rem; }\n\n.card-module_goa-card-top--primary__g2XEU {\n background-color: var(--color-tealblue-500); }\n\n.card-module_goa-card-top--secondary__mSrLl {\n background-color: var(--color-gray-200); }\n\n.card-module_goa-card-top--tertiary__2fG-A {\n display: none; }\n\n.card-module_goa-card__OjjJX .card-module_goa-card__OjjJX .card-module_goa-card-top--primary__g2XEU,\n.card-module_goa-card__OjjJX .card-module_goa-card__OjjJX .card-module_goa-card-top--secondary__mSrLl {\n min-height: 0.2rem; }\n\n.card-module_goa-card-details__4KtfS > .card-module_goa-card__OjjJX:first-child {\n margin-top: 0; }\n\n.card-module_goa-card-details__4KtfS > .card-module_goa-card__OjjJX h3 {\n font-size: var(--fs-lg); }\n\n.card-module_goa-card-details__4KtfS > .card-module_goa-card__OjjJX {\n margin-top: 1rem; }\n\n.card-module_goa-card-content__3gE5R {\n padding: var(--card-spacing);\n border-top-width: 0;\n border: 1px solid var(--color-gray-200);\n border-bottom-left-radius: var(--border-radius);\n border-bottom-right-radius: var(--border-radius); }\n\n.card-module_goa-card-content--tertiary__1dbYr {\n border-radius: var(--border-radius-sm);\n padding: calc(var(--card-spacing) / 2); }\n\n.card-module_goa-card-details__4KtfS ul {\n margin-left: var(--card-spacing); }\n";
|
|
1612
|
-
styleInject(css_248z$f);
|
|
1540
|
+
var css_248z$h = ".button-module_goa-button__fikCc {\n border-radius: 0.25rem;\n border: 2px solid var(--color-blue-500);\n box-sizing: border-box;\n cursor: pointer;\n font-size: 18px;\n font-weight: 700;\n line-height: 1em;\n padding: 0 0.75rem;\n transition: transform 0.1s ease-in-out, background-color 0.2s ease-in-out;\n transform: scale(1);\n}\n.button-module_goa-button__fikCc:disabled {\n pointer-events: none;\n color: var(--color-gray-700);\n background-color: var(--color-gray-100);\n border-color: var(--color-gray-100);\n}\n.button-module_goa-button__fikCc:active {\n transform: scale(0.98);\n}\n\n.button-module_goa-button--primary__2V_nV {\n border: 2px solid var(--color-blue-500);\n background: var(--color-blue-500);\n color: var(--color-white);\n}\n.button-module_goa-button--primary__2V_nV:hover {\n border-color: var(--color-blue-600);\n background: var(--color-blue-600);\n}\n.button-module_goa-button--primary__2V_nV:focus, .button-module_goa-button--primary__2V_nV:active {\n border-color: var(--color-blue-600);\n box-shadow: 0 0 0 3px var(--color-orange-500);\n background: var(--color-blue-600);\n outline: none;\n}\n\n.button-module_goa-button--secondary__3_OjG {\n border: 2px solid var(--color-blue-500);\n background: var(--color-white);\n color: var(--color-blue-500);\n}\n.button-module_goa-button--secondary__3_OjG:hover {\n border-color: var(--color-blue-600);\n color: var(--color-blue-600);\n}\n.button-module_goa-button--secondary__3_OjG:focus, .button-module_goa-button--secondary__3_OjG:active {\n border-color: var(--color-blue-600);\n color: var(--color-blue-600);\n box-shadow: 0 0 0 3px var(--color-orange-500);\n outline: none;\n}\n\n.button-module_goa-button--tertiary__3mvRP {\n border-color: var(--color-gray-200);\n background: var(--color-white);\n color: var(--color-blue-500);\n}\n.button-module_goa-button--tertiary__3mvRP:hover {\n color: var(--color-blue-600);\n}\n.button-module_goa-button--tertiary__3mvRP:focus, .button-module_goa-button--tertiary__3mvRP:active {\n border-color: var(--color-blue-600);\n color: var(--color-blue-600);\n box-shadow: 0 0 0 3px var(--color-orange-500);\n outline: none;\n}\n\n.button-module_goa-button--borderless__2PWz1 {\n background: none;\n color: var(--color-blue-500);\n border: none;\n}\n.button-module_goa-button--borderless__2PWz1:hover {\n background-color: var(--color-blue-100);\n color: var(--color-blue-500);\n}\n.button-module_goa-button--borderless__2PWz1:focus, .button-module_goa-button--borderless__2PWz1:active {\n outline: none;\n box-shadow: none;\n background-color: var(--color-blue-100);\n}\n\n.button-module_goa-button--primary__2V_nV.button-module_goa-button--danger__2jXqa {\n color: var(--color-white);\n background: var(--color-red-500);\n border-color: var(--color-red-500);\n}\n.button-module_goa-button--primary__2V_nV.button-module_goa-button--danger__2jXqa:hover {\n background: var(--color-red-600);\n border-color: var(--color-red-600);\n}\n.button-module_goa-button--primary__2V_nV.button-module_goa-button--danger__2jXqa:focus, .button-module_goa-button--primary__2V_nV.button-module_goa-button--danger__2jXqa:active {\n background: var(--color-red-600);\n border-color: var(--color-red-600);\n}\n\n.button-module_goa-button--secondary__3_OjG.button-module_goa-button--danger__2jXqa {\n color: var(--color-red-500);\n border-color: var(--color-red-500);\n}\n.button-module_goa-button--secondary__3_OjG.button-module_goa-button--danger__2jXqa:hover {\n border-color: var(--color-red-600);\n color: var(--color-red-600);\n}\n.button-module_goa-button--secondary__3_OjG.button-module_goa-button--danger__2jXqa:focus, .button-module_goa-button--secondary__3_OjG.button-module_goa-button--danger__2jXqa:active {\n color: var(--color-red-600);\n border-color: var(--color-red-600);\n}\n\n.button-module_goa-button--tertiary__3mvRP.button-module_goa-button--danger__2jXqa {\n color: var(--color-red-500);\n border-color: var(--color-gray-200);\n}\n.button-module_goa-button--tertiary__3mvRP.button-module_goa-button--danger__2jXqa:hover {\n border-color: var(--color-red-600);\n color: var(--color-red-600);\n}\n.button-module_goa-button--tertiary__3mvRP.button-module_goa-button--danger__2jXqa:focus, .button-module_goa-button--tertiary__3mvRP.button-module_goa-button--danger__2jXqa:active {\n color: var(--color-red-600);\n border-color: var(--color-red-600);\n}\n\n.button-module_goa-button--borderless__2PWz1.button-module_goa-button--danger__2jXqa {\n color: var(--color-red-500);\n}\n.button-module_goa-button--borderless__2PWz1.button-module_goa-button--danger__2jXqa:hover {\n background: var(--color-red-100);\n color: var(--color-red-500);\n}\n.button-module_goa-button--borderless__2PWz1.button-module_goa-button--danger__2jXqa:focus, .button-module_goa-button--borderless__2PWz1.button-module_goa-button--danger__2jXqa:active {\n background: var(--color-red-100);\n color: var(--color-red-500);\n}\n\n.button-module_goa-button--large__1iRt7 {\n font-size: var(--fs-lg);\n line-height: 3rem;\n}\n\n.button-module_goa-button--large__1iRt7.button-module_goa-button--borderless__2PWz1 {\n line-height: calc(3rem + 4px);\n}\n\n.button-module_goa-button--medium__1xeCJ {\n font-size: var(--fs-base);\n line-height: 2.375rem;\n}\n\n.button-module_goa-button--medium__1xeCJ.button-module_goa-button--borderless__2PWz1 {\n line-height: calc(2.375rem + 4px);\n}\n\n.button-module_goa-button--small__1sl63 {\n font-size: var(--fs-sm);\n line-height: 1.75rem;\n}\n\n.button-module_goa-button--small__1sl63.button-module_goa-button--borderless__2PWz1 {\n line-height: calc(1.75rem + 4px);\n}\n\n.button-module_goa-button__fikCc {\n min-width: 100%;\n}\n\n.button-module_goa-button__fikCc + .button-module_goa-button__fikCc {\n margin: 0;\n margin-top: 0.5rem;\n}\n\n@media (min-width: 480px) {\n .button-module_goa-button__fikCc {\n min-width: 4rem;\n }\n\n .button-module_goa-button__fikCc + .button-module_goa-button__fikCc {\n margin: 0;\n margin-left: 0.5rem;\n }\n}";
|
|
1541
|
+
styleInject(css_248z$h);
|
|
1613
1542
|
|
|
1614
|
-
var css_248z$g = ".
|
|
1543
|
+
var css_248z$g = "/* Palette */\n/* Semantic usages */\n.app-version-header-module_goa-app-version-header__3ngyf {\n display: flex;\n justify-content: center;\n background-color: #dcdcdc;\n}\n.app-version-header-module_goa-app-version-header__3ngyf .app-version-header-module_content-wrapper__15exd {\n display: flex;\n flex: 1 1 auto;\n margin: 0 24px;\n max-width: 1200px;\n}\n@media (min-width: 768px) {\n .app-version-header-module_goa-app-version-header__3ngyf .app-version-header-module_content-wrapper__15exd {\n margin: 0 72px;\n }\n}\n.app-version-header-module_goa-app-version-header__3ngyf .app-version-header-module_content-wrapper__15exd .app-version-header-module_environment-and-version__1-GPd {\n display: flex;\n flex: 1 1 auto;\n justify-content: center;\n padding-left: 20px;\n}\n.app-version-header-module_goa-app-version-header__3ngyf .app-version-header-module_content-wrapper__15exd .app-version-header-module_close__1beXI {\n margin-left: auto;\n width: 20px;\n text-align: right;\n font-weight: bold;\n font-size: small;\n align-self: center;\n cursor: pointer;\n display: flex;\n}\n.app-version-header-module_goa-app-version-header__3ngyf .app-version-header-module_content-wrapper__15exd .app-version-header-module_close__1beXI svg {\n color: #0070c4;\n}";
|
|
1615
1544
|
styleInject(css_248z$g);
|
|
1616
1545
|
|
|
1617
|
-
var css_248z$
|
|
1618
|
-
styleInject(css_248z$
|
|
1546
|
+
var css_248z$f = ":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 /* line-height */\n --lh-xs: 0.875rem;\n --lh-sm: 1rem;\n --lh-base: 1.5rem;\n --lh-lg: 2rem;\n --lh-xl: 2.75rem;\n --lh-2xl: 3.5rem;\n --border-radius-sm: 0.15rem;\n --border-radius: 0.25rem;\n --border-radius-base: 0.25rem;\n --border-radius-lg: 0.5rem;\n --spacing-1: 0.5rem;\n --spacing-2: 0.875rem;\n --spacing-3: 1.75rem;\n --input-height: 2.625rem;\n --input-padding: 0.5rem;\n --input-border-radius: 0.25rem;\n --input-font-size: var(--fs-base);\n}\n\n:host, :root {\n --color-white: #fff;\n --color-black: #333;\n --color-gray-100: #f1f1f1;\n --color-gray-200: #dcdcdc;\n --color-gray-500: #adadad;\n --color-gray-600: #767676;\n --color-gray-700: #666;\n --color-gray-900: #333;\n --color-tealblue-100: #c8eefa;\n --color-tealblue-500: #0081a2;\n --color-tealblue-900: #005072;\n --color-orange: #feba35;\n --color-orange-100: hsl(39.7, 99.01%, 98%);\n --color-orange-500: hsl(39.7, 99.01%, 60.2%);\n --color-orange-900: hsl(39.7, 99.01%, 30%);\n --color-red: #ec040b;\n --color-red-100: hsl(358.19, 96.67%, 98%);\n --color-red-500: hsl(358.19, 96.67%, 47.06%);\n --color-red-600: hsl(358.19, 96.67%, 40%);\n --color-red-900: hsl(358.19, 96.67%, 20%);\n --color-green: #00853F;\n --color-green-100: hsl(148, 100%, 95%);\n --color-green-500: hsl(148.42, 100%, 26.08%);\n --color-green-900: hsl(148, 100%, 10%);\n --color-blue-100: #e3f2ff;\n --color-blue-500: #0070c4;\n --color-blue-600: #004f84;\n}\n\nh1:first-child,\nh2:first-child,\nh3:first-child {\n margin-top: 0;\n}\n\n/* Base header margins */\nh1,\nh2,\nh3,\nh4 {\n margin-bottom: 1rem;\n}\n\n/* Font sizes */\nh1 {\n font-size: var(--fs-3xl);\n line-height: var(--lh-2xl);\n font-weight: var(--fw-bold);\n}\n\nh2 {\n font-size: var(--fs-2xl);\n line-height: var(--lh-xl);\n font-weight: var(--fw-regular);\n}\n\nh3 {\n font-size: var(--fs-xl);\n line-height: var(--lh-lg);\n font-weight: var(--fw-regular);\n}\n\nh4,\nh5,\nh6 {\n font-size: var(--fs-base);\n line-height: var(--lh-base);\n font-weight: var(--fw-bold);\n}\n\n/* Set top margin to subsequent headers */\nh1 + h2,\nh1 + h3,\nh1 + h4,\nh2 + h3,\nh2 + h4,\nh3 + h4 {\n margin-top: 2rem;\n}\n\np {\n margin-bottom: 1rem;\n font-size: var(--fs-base);\n}\n\nhr + h1,\nhr + h2,\nhr + h3 {\n margin-top: 0;\n}\n\nem {\n font-size: var(--fs-xs);\n line-height: var(--lh-sm);\n color: var(--color-gray);\n}\n\nsmall {\n font-size: var(--fs-xs);\n font-style: normal;\n color: var(--color-gray);\n}\n\n.card-module_goa-card__OjjJX {\n --card-spacing: 1rem;\n --card-child-spacing: 0.5rem;\n box-sizing: border-box;\n background: var(--color-white);\n transition: opacity 300ms ease-in-out;\n border-radius: var(--border-radius);\n}\n.card-module_goa-card__OjjJX a:hover {\n color: var(--color-blue-600);\n text-decoration: none;\n}\n.card-module_goa-card__OjjJX a:focus {\n outline: 3px solid var(--color-orange);\n outline-offset: 0;\n}\n.card-module_goa-card__OjjJX h6 {\n font-size: var(--fs-xs);\n line-height: var(--lh-sm);\n font-weight: var(--fw-base);\n color: var(--color-gray);\n margin: 0;\n padding: 0;\n}\n\n.card-module_goa-card--tertiary__1BV7k {\n border-radius: var(--border-radius-sm);\n}\n\n.card-module_goa-card-top__RM4IA {\n border-top-left-radius: var(--border-radius);\n border-top-right-radius: var(--border-radius);\n min-height: 0.5rem;\n}\n\n.card-module_goa-card-top--primary__g2XEU {\n background-color: var(--color-tealblue-500);\n}\n\n.card-module_goa-card-top--secondary__mSrLl {\n background-color: var(--color-gray-200);\n}\n\n.card-module_goa-card-top--tertiary__2fG-A {\n display: none;\n}\n\n.card-module_goa-card__OjjJX .card-module_goa-card__OjjJX .card-module_goa-card-top--primary__g2XEU,\n.card-module_goa-card__OjjJX .card-module_goa-card__OjjJX .card-module_goa-card-top--secondary__mSrLl {\n min-height: 0.2rem;\n}\n\n.card-module_goa-card-details__4KtfS > .card-module_goa-card__OjjJX:first-child {\n margin-top: 0;\n}\n\n.card-module_goa-card-details__4KtfS > .card-module_goa-card__OjjJX h3 {\n font-size: var(--fs-lg);\n}\n\n.card-module_goa-card-details__4KtfS > .card-module_goa-card__OjjJX {\n margin-top: 1rem;\n}\n\n.card-module_goa-card-content__3gE5R {\n padding: var(--card-spacing);\n border-top-width: 0;\n border: 1px solid var(--color-gray-200);\n border-bottom-left-radius: var(--border-radius);\n border-bottom-right-radius: var(--border-radius);\n}\n\n.card-module_goa-card-content--tertiary__1dbYr {\n border-radius: var(--border-radius-sm);\n padding: calc(var(--card-spacing) / 2);\n}\n\n.card-module_goa-card-details__4KtfS ul {\n margin-left: var(--card-spacing);\n}";
|
|
1547
|
+
styleInject(css_248z$f);
|
|
1619
1548
|
|
|
1620
|
-
var css_248z$
|
|
1621
|
-
styleInject(css_248z$
|
|
1549
|
+
var css_248z$e = ".goa-flex-row {\n display: flex;\n flex-direction: row;\n flex-wrap: wrap;\n justify-content: space-between;\n align-items: top;\n margin-bottom: 1.5rem;\n}\n.goa-flex-row *:last-child {\n margin-bottom: 0;\n}\n\n.goa-flex-row > * {\n flex: 1 1 30ch;\n}";
|
|
1550
|
+
styleInject(css_248z$e);
|
|
1622
1551
|
|
|
1623
|
-
var
|
|
1624
|
-
|
|
1552
|
+
var css_248z$d = ":host, :root {\n --color-white: #fff;\n --color-black: #333;\n --color-gray-100: #f1f1f1;\n --color-gray-200: #dcdcdc;\n --color-gray-500: #adadad;\n --color-gray-600: #767676;\n --color-gray-700: #666;\n --color-gray-900: #333;\n --color-tealblue-100: #c8eefa;\n --color-tealblue-500: #0081a2;\n --color-tealblue-900: #005072;\n --color-orange: #feba35;\n --color-orange-100: hsl(39.7, 99.01%, 98%);\n --color-orange-500: hsl(39.7, 99.01%, 60.2%);\n --color-orange-900: hsl(39.7, 99.01%, 30%);\n --color-red: #ec040b;\n --color-red-100: hsl(358.19, 96.67%, 98%);\n --color-red-500: hsl(358.19, 96.67%, 47.06%);\n --color-red-600: hsl(358.19, 96.67%, 40%);\n --color-red-900: hsl(358.19, 96.67%, 20%);\n --color-green: #00853F;\n --color-green-100: hsl(148, 100%, 95%);\n --color-green-500: hsl(148.42, 100%, 26.08%);\n --color-green-900: hsl(148, 100%, 10%);\n --color-blue-100: #e3f2ff;\n --color-blue-500: #0070c4;\n --color-blue-600: #004f84;\n}\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 /* line-height */\n --lh-xs: 0.875rem;\n --lh-sm: 1rem;\n --lh-base: 1.5rem;\n --lh-lg: 2rem;\n --lh-xl: 2.75rem;\n --lh-2xl: 3.5rem;\n --border-radius-sm: 0.15rem;\n --border-radius: 0.25rem;\n --border-radius-base: 0.25rem;\n --border-radius-lg: 0.5rem;\n --spacing-1: 0.5rem;\n --spacing-2: 0.875rem;\n --spacing-3: 1.75rem;\n --input-height: 2.625rem;\n --input-padding: 0.5rem;\n --input-border-radius: 0.25rem;\n --input-font-size: var(--fs-base);\n}\n\n.goa-form {\n box-sizing: border-box;\n}\n\n.goa-form *,\n.goa-form *:before,\n.goa-form *:after {\n box-sizing: inherit;\n}\n\n.goa-form-row {\n display: flex;\n flex-direction: column;\n justify-content: space-between;\n}\n\n@media screen and (min-width: 640px) {\n .goa-form-row {\n gap: 1.75rem;\n flex-direction: row;\n }\n}\n.goa-form-item {\n flex: 1 1 auto;\n margin-bottom: 1rem;\n}\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}\n.goa-form-item label em {\n color: var(--color-gray-700);\n font-weight: var(--fw-regular);\n font-size: var(--fs-sm);\n}\n.goa-form-item input,\n.goa-form-item textarea {\n display: block;\n width: 100%;\n font-size: var(--fs-base);\n}\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\n.help-msg {\n font-size: var(--fs-sm);\n color: var(--color-gray-900);\n line-height: calc(var(--fs-sm) + 0.5rem);\n}\n\n.goa-form-actions {\n display: flex;\n flex-wrap: wrap;\n margin-top: 2rem;\n}\n.goa-form-actions button,\n.goa-form-actions .goa-link-button {\n margin: 0;\n}\n@media (max-width: 639px) {\n .goa-form-actions button,\n.goa-form-actions .goa-link-button {\n width: 100%;\n }\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 }\n}\n@media (min-width: 640px) {\n .goa-form-actions button,\n.goa-form-actions .goa-link-button {\n min-width: 6rem;\n }\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}\n\n.goa-form-actions--left {\n justify-content: flex-start;\n}\n\n.goa-form-actions--right {\n justify-content: flex-end;\n}";
|
|
1553
|
+
styleInject(css_248z$d);
|
|
1625
1554
|
|
|
1626
|
-
|
|
1627
|
-
|
|
1628
|
-
_onChange = _ref.onChange,
|
|
1629
|
-
leadingIcon = _ref.leadingIcon,
|
|
1630
|
-
trailingIcon = _ref.trailingIcon,
|
|
1631
|
-
_ref$variant = _ref.variant,
|
|
1632
|
-
variant = _ref$variant === void 0 ? 'goa' : _ref$variant,
|
|
1633
|
-
focused = _ref.focused,
|
|
1634
|
-
other = _objectWithoutProperties(_ref, ["name", "onTrailingIconClick", "onChange", "leadingIcon", "trailingIcon", "variant", "focused"]);
|
|
1555
|
+
var css_248z$c = ":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 /* line-height */\n --lh-xs: 0.875rem;\n --lh-sm: 1rem;\n --lh-base: 1.5rem;\n --lh-lg: 2rem;\n --lh-xl: 2.75rem;\n --lh-2xl: 3.5rem;\n --border-radius-sm: 0.15rem;\n --border-radius: 0.25rem;\n --border-radius-base: 0.25rem;\n --border-radius-lg: 0.5rem;\n --spacing-1: 0.5rem;\n --spacing-2: 0.875rem;\n --spacing-3: 1.75rem;\n --input-height: 2.625rem;\n --input-padding: 0.5rem;\n --input-border-radius: 0.25rem;\n --input-font-size: var(--fs-base);\n}\n\n:host, :root {\n --color-white: #fff;\n --color-black: #333;\n --color-gray-100: #f1f1f1;\n --color-gray-200: #dcdcdc;\n --color-gray-500: #adadad;\n --color-gray-600: #767676;\n --color-gray-700: #666;\n --color-gray-900: #333;\n --color-tealblue-100: #c8eefa;\n --color-tealblue-500: #0081a2;\n --color-tealblue-900: #005072;\n --color-orange: #feba35;\n --color-orange-100: hsl(39.7, 99.01%, 98%);\n --color-orange-500: hsl(39.7, 99.01%, 60.2%);\n --color-orange-900: hsl(39.7, 99.01%, 30%);\n --color-red: #ec040b;\n --color-red-100: hsl(358.19, 96.67%, 98%);\n --color-red-500: hsl(358.19, 96.67%, 47.06%);\n --color-red-600: hsl(358.19, 96.67%, 40%);\n --color-red-900: hsl(358.19, 96.67%, 20%);\n --color-green: #00853F;\n --color-green-100: hsl(148, 100%, 95%);\n --color-green-500: hsl(148.42, 100%, 26.08%);\n --color-green-900: hsl(148, 100%, 10%);\n --color-blue-100: #e3f2ff;\n --color-blue-500: #0070c4;\n --color-blue-600: #004f84;\n}\n\n/* Forms */\n.goa-input {\n outline: none;\n transition: box-shadow 0.1s ease-in;\n border: 1px solid var(--color-gray-700);\n border-radius: 3px;\n background: white;\n color: var(--color-gray-900);\n padding: var(--input-padding);\n font-size: var(--input-font-size);\n display: flex;\n align-content: center;\n line-height: var(--input-height);\n height: var(--input-height);\n}\n.goa-input:hover {\n border-color: var(--color-blue-600);\n}\n.goa-input:active, .goa-input:focus, .goa-input:focus-within {\n box-shadow: 0 0 0 3px var(--color-orange);\n}\n.goa-input:disabled {\n border-color: var(--color-gray-500);\n}\n.goa-input:disabled:hover {\n border-color: var(--color-gray-500);\n}\n.goa-input:disabled:focus {\n box-shadow: none;\n}\n\n.goa-input-leading-icon {\n display: flex;\n align-items: center;\n}\n\n.goa-input-leading-icon ~ input {\n padding-left: 0.25rem;\n}\n\n.goa-input-trailing-icon {\n display: flex;\n align-items: center;\n}\n\n.goa-input-trailing-icon > .goa-icon-button {\n margin-right: -0.5rem;\n}\n\ninput.input--goa {\n display: block;\n border: none;\n flex: 1 1 auto;\n}\n\ninput.input--goa::-webkit-calendar-picker-indicator {\n display: none;\n}\n\n.goa-input input,\n.goa-input input:focus,\n.goa-input input:hover,\n.goa-input input:active,\n.goa-input input {\n display: block;\n width: 100%;\n outline: none;\n border: none;\n}\n\n.goa-input--disabled {\n opacity: 0.5;\n cursor: default;\n border-color: var(--color-black);\n}\n.goa-input--disabled:hover, .goa-input--disabled:active, .goa-input--disabled:focus {\n border-color: var(--color-black);\n cursor: default;\n box-shadow: none;\n}\n.goa-input--disabled input:hover {\n cursor: default !important;\n}\n\n.goa-input .input--bare {\n border: none;\n}\n\n.goa-state--error .goa-input {\n border: 2px solid var(--color-red);\n}";
|
|
1556
|
+
styleInject(css_248z$c);
|
|
1635
1557
|
|
|
1636
|
-
|
|
1558
|
+
var GoAInput = function GoAInput(_a) {
|
|
1559
|
+
var _b;
|
|
1560
|
+
|
|
1561
|
+
var name = _a.name,
|
|
1562
|
+
onTrailingIconClick = _a.onTrailingIconClick,
|
|
1563
|
+
onChange = _a.onChange,
|
|
1564
|
+
leadingIcon = _a.leadingIcon,
|
|
1565
|
+
trailingIcon = _a.trailingIcon,
|
|
1566
|
+
_c = _a.variant,
|
|
1567
|
+
variant = _c === void 0 ? 'goa' : _c,
|
|
1568
|
+
focused = _a.focused,
|
|
1569
|
+
disabled = _a.disabled,
|
|
1570
|
+
readonly = _a.readonly,
|
|
1571
|
+
other = __rest(_a, ["name", "onTrailingIconClick", "onChange", "leadingIcon", "trailingIcon", "variant", "focused", "disabled", "readonly"]);
|
|
1572
|
+
|
|
1573
|
+
var inputRef = React__default["default"].useRef(null);
|
|
1637
1574
|
React.useEffect(function () {
|
|
1638
|
-
|
|
1639
|
-
var _inputRef$current;
|
|
1575
|
+
var _a, _b;
|
|
1640
1576
|
|
|
1641
|
-
|
|
1577
|
+
if (focused) {
|
|
1578
|
+
(_a = inputRef.current) === null || _a === void 0 ? void 0 : _a.focus();
|
|
1642
1579
|
} else {
|
|
1643
|
-
|
|
1644
|
-
|
|
1645
|
-
(_inputRef$current2 = inputRef.current) === null || _inputRef$current2 === void 0 ? void 0 : _inputRef$current2.blur();
|
|
1580
|
+
(_b = inputRef.current) === null || _b === void 0 ? void 0 : _b.blur();
|
|
1646
1581
|
}
|
|
1647
1582
|
}, [focused, inputRef]);
|
|
1648
|
-
|
|
1649
|
-
|
|
1650
|
-
|
|
1651
|
-
|
|
1652
|
-
|
|
1653
|
-
|
|
1654
|
-
}
|
|
1655
|
-
|
|
1656
|
-
|
|
1657
|
-
|
|
1658
|
-
|
|
1659
|
-
|
|
1660
|
-
|
|
1661
|
-
|
|
1662
|
-
|
|
1663
|
-
|
|
1664
|
-
|
|
1665
|
-
|
|
1666
|
-
|
|
1667
|
-
|
|
1668
|
-
|
|
1669
|
-
|
|
1670
|
-
|
|
1671
|
-
|
|
1672
|
-
|
|
1673
|
-
|
|
1674
|
-
|
|
1675
|
-
|
|
1676
|
-
|
|
1583
|
+
var rootCss = classnames__default["default"]({
|
|
1584
|
+
'goa-input': true,
|
|
1585
|
+
'goa-input--disabled': disabled
|
|
1586
|
+
});
|
|
1587
|
+
return jsxRuntime.jsxs("div", __assign({
|
|
1588
|
+
className: rootCss
|
|
1589
|
+
}, {
|
|
1590
|
+
children: [leadingIcon && jsxRuntime.jsx("div", __assign({
|
|
1591
|
+
className: "goa-input-leading-icon"
|
|
1592
|
+
}, {
|
|
1593
|
+
children: jsxRuntime.jsx(GoAIcon, {
|
|
1594
|
+
type: leadingIcon
|
|
1595
|
+
}, void 0)
|
|
1596
|
+
}), void 0), jsxRuntime.jsx("input", __assign({
|
|
1597
|
+
ref: inputRef,
|
|
1598
|
+
className: classnames__default["default"]((_b = {}, _b["input--" + variant] = true, _b['input--leading-icon'] = leadingIcon, _b)),
|
|
1599
|
+
readOnly: readonly,
|
|
1600
|
+
disabled: disabled,
|
|
1601
|
+
onChange: function (e) {
|
|
1602
|
+
return onChange(name, e.target.value);
|
|
1603
|
+
}
|
|
1604
|
+
}, other), void 0), trailingIcon && !onTrailingIconClick && jsxRuntime.jsx("div", __assign({
|
|
1605
|
+
className: "goa-input-trailing-icon"
|
|
1606
|
+
}, {
|
|
1607
|
+
children: jsxRuntime.jsx(GoAIcon, {
|
|
1608
|
+
size: "medium",
|
|
1609
|
+
type: trailingIcon
|
|
1610
|
+
}, void 0)
|
|
1611
|
+
}), void 0), trailingIcon && onTrailingIconClick && jsxRuntime.jsx("div", __assign({
|
|
1612
|
+
onClick: onTrailingIconClick,
|
|
1613
|
+
className: "goa-input-trailing-icon"
|
|
1614
|
+
}, {
|
|
1615
|
+
children: jsxRuntime.jsx(GoAIconButton, {
|
|
1616
|
+
variant: "tertiary",
|
|
1617
|
+
onClick: onTrailingIconClick,
|
|
1618
|
+
disabled: disabled,
|
|
1619
|
+
size: "medium",
|
|
1620
|
+
type: trailingIcon,
|
|
1621
|
+
testId: name + "-input-trailing-button"
|
|
1622
|
+
}, void 0)
|
|
1623
|
+
}), void 0)]
|
|
1624
|
+
}), void 0);
|
|
1677
1625
|
};
|
|
1678
1626
|
|
|
1679
|
-
var css_248z$
|
|
1680
|
-
styleInject(css_248z$
|
|
1627
|
+
var css_248z$b = ".goa-scrollable {\n scroll-behavior: smooth;\n}\n\n.goa-scrollable::-webkit-scrollbar {\n width: 6px;\n}\n\n.goa-scrollable::-webkit-scrollbar-track {\n background: #f1f1f1;\n}\n\n.goa-scrollable::-webkit-scrollbar-thumb {\n background: #888;\n}\n\n.goa-scrollable::-webkit-scrollbar-thumb:hover {\n background: #555;\n}";
|
|
1628
|
+
styleInject(css_248z$b);
|
|
1681
1629
|
|
|
1682
|
-
var GoAScrollable = function GoAScrollable(
|
|
1683
|
-
var vertical =
|
|
1684
|
-
horizontal =
|
|
1685
|
-
hPadding =
|
|
1686
|
-
vPadding =
|
|
1687
|
-
height =
|
|
1688
|
-
children =
|
|
1689
|
-
testId =
|
|
1630
|
+
var GoAScrollable = function GoAScrollable(_a) {
|
|
1631
|
+
var vertical = _a.vertical,
|
|
1632
|
+
horizontal = _a.horizontal,
|
|
1633
|
+
hPadding = _a.hPadding,
|
|
1634
|
+
vPadding = _a.vPadding,
|
|
1635
|
+
height = _a.height,
|
|
1636
|
+
children = _a.children,
|
|
1637
|
+
testId = _a.testId;
|
|
1690
1638
|
var style = {
|
|
1691
1639
|
overflowY: vertical ? 'auto' : 'hidden',
|
|
1692
1640
|
overflowX: horizontal ? 'auto' : 'hidden',
|
|
1693
1641
|
maxHeight: height !== null && height !== void 0 ? height : '100%',
|
|
1694
|
-
padding:
|
|
1642
|
+
padding: (vPadding !== null && vPadding !== void 0 ? vPadding : 0) + "rem " + (hPadding !== null && hPadding !== void 0 ? hPadding : 0) + "rem"
|
|
1695
1643
|
};
|
|
1696
|
-
return
|
|
1697
|
-
className:
|
|
1644
|
+
return jsxRuntime.jsx("div", __assign({
|
|
1645
|
+
className: 'goa-scrollable',
|
|
1698
1646
|
style: style,
|
|
1699
1647
|
"data-testid": testId
|
|
1700
|
-
},
|
|
1648
|
+
}, {
|
|
1649
|
+
children: children
|
|
1650
|
+
}), void 0);
|
|
1701
1651
|
};
|
|
1702
1652
|
|
|
1703
|
-
var css_248z$
|
|
1704
|
-
styleInject(css_248z$
|
|
1653
|
+
var css_248z$a = "/* Fade in */\n.fade-in-init {\n display: none;\n}\n\n.fade-in-start {\n display: block;\n opacity: 0;\n transition: opacity 200ms ease-in;\n}\n\n.fade-in-active {\n opacity: 1;\n}\n\n/* Fade out */\n.fade-out-init {\n display: block;\n}\n\n.fade-out-start {\n display: block;\n opacity: 1;\n transition: opacity 200ms ease-in;\n}\n\n.fade-out-active {\n opacity: 0;\n}\n\n/* ======= Slide in/out Up */\n/* Slide in up */\n.slide-in-up-init {\n transition: translateY(0);\n display: none;\n}\n\n.slide-in-up-start {\n display: block;\n transform: translateY(100vh);\n transition: transform 300ms ease-out;\n}\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\n.slide-out-up-start {\n transition: transform 300ms ease-in;\n}\n\n.slide-out-up-active {\n transform: translateY(-100vh);\n}\n\n/* ======= Slide in/out Down */\n/* Slide in down */\n.slide-in-down-init {\n transition: translateY(0);\n display: none;\n}\n\n.slide-in-down-start {\n display: block;\n transform: translateY(-100vh);\n transition: transform 300ms ease-out;\n}\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\n.slide-out-down-start {\n transform: translateY(0);\n transition: transform 300ms ease-in;\n}\n\n.slide-out-down-active {\n transform: translateY(100vh);\n}\n\n/* ======= Slide in/out Left */\n/* Slide in left */\n.slide-in-left-init {\n transition: translateX(0);\n display: none;\n}\n\n.slide-in-left-start {\n display: block;\n transform: translateX(-100vw);\n transition: transform 300ms ease-out;\n}\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\n.slide-out-left-start {\n transform: translateX(0);\n transition: transform 300ms ease-in;\n}\n\n.slide-out-left-active {\n transform: translateX(-100vw);\n}\n\n/* ======= Slide in/out Right */\n/* Slide in left */\n.slide-in-right-init {\n transition: translateX(0);\n display: none;\n}\n\n.slide-in-right-start {\n display: block;\n transform: translateX(100vw);\n transition: transform 300ms ease-out;\n}\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\n.slide-out-right-start {\n transform: translateX(0);\n transition: transform 300ms ease-in;\n}\n\n.slide-out-right-active {\n transform: translateX(100vw);\n}";
|
|
1654
|
+
styleInject(css_248z$a);
|
|
1705
1655
|
|
|
1706
|
-
var css_248z$
|
|
1707
|
-
styleInject(css_248z$
|
|
1656
|
+
var css_248z$9 = "/* Root ============================================================================== */\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 --modal-spacing: 1.75rem;\n --button-min-width: 5rem;\n}\n\n/* Modal ============================================================================== */\n.modal {\n position: relative;\n background: #fff;\n z-index: 1002;\n box-shadow: 0 15px 25px rgba(0, 0, 0, 0.2), 0 5px 10px 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@media (min-width: 640px) {\n .modal {\n margin: 1rem;\n max-height: 80%;\n min-width: 60ch;\n }\n}\n/* Modal Container =========================================================================== */\n.modal-container {\n display: flex;\n flex-direction: column;\n height: 100%;\n}\n\n/* Modal Actions ============================================================================== */\n.modal-actions {\n text-align: right;\n margin: var(--modal-spacing);\n flex: 0 0 auto;\n}\n\n.modal-actions button {\n min-width: var(--button-min-width);\n}\n\n@media (max-width: 639px) {\n .modal-actions button + button {\n margin-top: 0.5rem;\n }\n\n .modal-actions button {\n display: block;\n width: 100%;\n }\n}\n@media (min-width: 640px) {\n .modal-actions > button {\n margin-right: 0;\n }\n\n .modal-actions > button + button {\n margin-left: 0.5rem;\n }\n}\n/* Modal Title ============================================================================ */\n.modal-title {\n font-size: var(--fs-xl);\n padding: 1rem var(--modal-spacing);\n margin-right: 40px;\n /* close icon spacing */\n flex: 0 0 auto;\n}\n\n/* Modal Background ======================================================================= */\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.modal-close {\n position: absolute;\n top: 1rem;\n right: 1rem;\n}";
|
|
1657
|
+
styleInject(css_248z$9);
|
|
1708
1658
|
|
|
1709
|
-
var css_248z$
|
|
1710
|
-
styleInject(css_248z$
|
|
1659
|
+
var css_248z$8 = ":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 /* line-height */\n --lh-xs: 0.875rem;\n --lh-sm: 1rem;\n --lh-base: 1.5rem;\n --lh-lg: 2rem;\n --lh-xl: 2.75rem;\n --lh-2xl: 3.5rem;\n --border-radius-sm: 0.15rem;\n --border-radius: 0.25rem;\n --border-radius-base: 0.25rem;\n --border-radius-lg: 0.5rem;\n --spacing-1: 0.5rem;\n --spacing-2: 0.875rem;\n --spacing-3: 1.75rem;\n --input-height: 2.625rem;\n --input-padding: 0.5rem;\n --input-border-radius: 0.25rem;\n --input-font-size: var(--fs-base);\n}\n\n:host, :root {\n --color-white: #fff;\n --color-black: #333;\n --color-gray-100: #f1f1f1;\n --color-gray-200: #dcdcdc;\n --color-gray-500: #adadad;\n --color-gray-600: #767676;\n --color-gray-700: #666;\n --color-gray-900: #333;\n --color-tealblue-100: #c8eefa;\n --color-tealblue-500: #0081a2;\n --color-tealblue-900: #005072;\n --color-orange: #feba35;\n --color-orange-100: hsl(39.7, 99.01%, 98%);\n --color-orange-500: hsl(39.7, 99.01%, 60.2%);\n --color-orange-900: hsl(39.7, 99.01%, 30%);\n --color-red: #ec040b;\n --color-red-100: hsl(358.19, 96.67%, 98%);\n --color-red-500: hsl(358.19, 96.67%, 47.06%);\n --color-red-600: hsl(358.19, 96.67%, 40%);\n --color-red-900: hsl(358.19, 96.67%, 20%);\n --color-green: #00853F;\n --color-green-100: hsl(148, 100%, 95%);\n --color-green-500: hsl(148.42, 100%, 26.08%);\n --color-green-900: hsl(148, 100%, 10%);\n --color-blue-100: #e3f2ff;\n --color-blue-500: #0070c4;\n --color-blue-600: #004f84;\n}\n\n/* Forms */\n.goa-textarea {\n outline: none;\n transition: box-shadow 0.1s ease-in;\n border: 1px solid var(--color-gray-700);\n border-radius: 3px;\n background: white;\n color: var(--color-gray-900);\n padding: var(--input-padding);\n font-size: var(--input-font-size);\n display: block;\n width: 100%;\n}\n.goa-textarea:hover {\n border-color: var(--color-blue-600);\n}\n.goa-textarea:active, .goa-textarea:focus, .goa-textarea:focus-within {\n box-shadow: 0 0 0 3px var(--color-orange);\n}\n.goa-textarea:disabled {\n border-color: var(--color-gray-500);\n}\n.goa-textarea:disabled:hover {\n border-color: var(--color-gray-500);\n}\n.goa-textarea:disabled:focus {\n box-shadow: none;\n}\n\n.goa-state--error textarea,\n.goa-state--error textarea:hover {\n border: 2px solid var(--color-red);\n}";
|
|
1660
|
+
styleInject(css_248z$8);
|
|
1711
1661
|
|
|
1712
|
-
var css_248z$
|
|
1713
|
-
styleInject(css_248z$
|
|
1662
|
+
var css_248z$7 = ":host, :root {\n --color-white: #fff;\n --color-black: #333;\n --color-gray-100: #f1f1f1;\n --color-gray-200: #dcdcdc;\n --color-gray-500: #adadad;\n --color-gray-600: #767676;\n --color-gray-700: #666;\n --color-gray-900: #333;\n --color-tealblue-100: #c8eefa;\n --color-tealblue-500: #0081a2;\n --color-tealblue-900: #005072;\n --color-orange: #feba35;\n --color-orange-100: hsl(39.7, 99.01%, 98%);\n --color-orange-500: hsl(39.7, 99.01%, 60.2%);\n --color-orange-900: hsl(39.7, 99.01%, 30%);\n --color-red: #ec040b;\n --color-red-100: hsl(358.19, 96.67%, 98%);\n --color-red-500: hsl(358.19, 96.67%, 47.06%);\n --color-red-600: hsl(358.19, 96.67%, 40%);\n --color-red-900: hsl(358.19, 96.67%, 20%);\n --color-green: #00853F;\n --color-green-100: hsl(148, 100%, 95%);\n --color-green-500: hsl(148.42, 100%, 26.08%);\n --color-green-900: hsl(148, 100%, 10%);\n --color-blue-100: #e3f2ff;\n --color-blue-500: #0070c4;\n --color-blue-600: #004f84;\n}\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 /* line-height */\n --lh-xs: 0.875rem;\n --lh-sm: 1rem;\n --lh-base: 1.5rem;\n --lh-lg: 2rem;\n --lh-xl: 2.75rem;\n --lh-2xl: 3.5rem;\n --border-radius-sm: 0.15rem;\n --border-radius: 0.25rem;\n --border-radius-base: 0.25rem;\n --border-radius-lg: 0.5rem;\n --spacing-1: 0.5rem;\n --spacing-2: 0.875rem;\n --spacing-3: 1.75rem;\n --input-height: 2.625rem;\n --input-padding: 0.5rem;\n --input-border-radius: 0.25rem;\n --input-font-size: var(--fs-base);\n}\n\n/* Forms */\n.goa-dropdown-box {\n position: relative;\n}\n\n.goa-dropdown-box input[readonly] {\n cursor: pointer;\n}\n\n.goa-dropdown-background {\n position: fixed;\n inset: 0;\n opacity: 1;\n}\n\n.goa-icon ~ input {\n padding-left: 0.5rem;\n}\n\n.goa-dropdown-list {\n position: absolute;\n left: 0;\n right: 0;\n padding: 0;\n margin: 0;\n margin-top: 3px;\n list-style-type: none;\n background: var(--color-white);\n border-radius: var(--input-border-radius);\n box-shadow: 0 8px 8px rgba(0, 0, 0, 0.2), 0 4px 4px rgba(0, 0, 0, 0.1);\n z-index: 99;\n}\n\n.goa-dropdown-list hr {\n border: none;\n border-top: 1px solid var(--color-gray-100);\n margin: 0;\n}\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\n.goa-dropdown-option {\n margin: 0;\n padding: 0.5rem;\n cursor: pointer;\n color: var(--color-gray-900);\n}\n.goa-dropdown-option:hover {\n background: var(--color-gray-100);\n color: var(--color-blue-600);\n}\n.goa-dropdown-option:last-child:hover {\n border-bottom-left-radius: var(--input-border-radius);\n border-bottom-right-radius: var(--input-border-radius);\n}\n\n.goa-dropdown-option--disabled {\n opacity: 0.5;\n cursor: default;\n}\n.goa-dropdown-option--disabled:hover {\n cursor: default;\n color: var(--color-gray-700);\n}\n\n.goa-dropdown-option--selected {\n background: var(--color-blue-500);\n color: var(--color-white);\n}\n.goa-dropdown-option--selected:hover {\n background: var(--color-blue-600);\n color: var(--color-white);\n}\n\n.dropdown-group-content .goa-dropdown-option {\n padding-left: 1.5rem;\n}\n\n.goa-state--error .goa-dropdown-input {\n border: 2px solid var(--color-red);\n}";
|
|
1663
|
+
styleInject(css_248z$7);
|
|
1714
1664
|
|
|
1715
1665
|
var GoADropdownOption = function GoADropdownOption(props) {
|
|
1716
1666
|
var onClick = function onClick() {
|
|
@@ -1719,34 +1669,33 @@
|
|
|
1719
1669
|
}
|
|
1720
1670
|
};
|
|
1721
1671
|
|
|
1722
|
-
return
|
|
1723
|
-
key: props.value,
|
|
1672
|
+
return jsxRuntime.jsx("li", __assign({
|
|
1724
1673
|
style: {
|
|
1725
1674
|
display: props.visible ? 'block' : 'none'
|
|
1726
1675
|
},
|
|
1727
|
-
className: "\n goa-dropdown-option\n "
|
|
1676
|
+
className: "\n goa-dropdown-option\n " + (props.disabled ? 'goa-dropdown-option--disabled' : '') + "\n " + (props.selected ? 'goa-dropdown-option--selected' : '') + "\n ",
|
|
1728
1677
|
"data-testid": props._testId,
|
|
1729
1678
|
onClick: onClick
|
|
1730
|
-
},
|
|
1679
|
+
}, {
|
|
1680
|
+
children: props.children || props.label
|
|
1681
|
+
}), props.value);
|
|
1731
1682
|
};
|
|
1732
1683
|
|
|
1733
1684
|
var MAX_HEIGHT = 300;
|
|
1734
|
-
var GoADropdown = function GoADropdown(
|
|
1735
|
-
var
|
|
1736
|
-
selectedValues =
|
|
1737
|
-
props =
|
|
1738
|
-
|
|
1739
|
-
var
|
|
1740
|
-
|
|
1741
|
-
|
|
1742
|
-
|
|
1743
|
-
|
|
1744
|
-
|
|
1745
|
-
|
|
1746
|
-
|
|
1747
|
-
|
|
1748
|
-
/**
|
|
1749
|
-
* Override the useState method to set the menu visibility to allow for conditional rendering
|
|
1685
|
+
var GoADropdown = function GoADropdown(_a) {
|
|
1686
|
+
var _b = _a.selectedValues,
|
|
1687
|
+
selectedValues = _b === void 0 ? [] : _b,
|
|
1688
|
+
props = __rest(_a, ["selectedValues"]);
|
|
1689
|
+
|
|
1690
|
+
var _c = React.useState(false),
|
|
1691
|
+
isMenuVisible = _c[0],
|
|
1692
|
+
_setMenuVisibility = _c[1];
|
|
1693
|
+
|
|
1694
|
+
var _d = React.useState(''),
|
|
1695
|
+
filter = _d[0],
|
|
1696
|
+
setFilter = _d[1];
|
|
1697
|
+
/**
|
|
1698
|
+
* Override the useState method to set the menu visibility to allow for conditional rendering
|
|
1750
1699
|
*/
|
|
1751
1700
|
|
|
1752
1701
|
|
|
@@ -1755,19 +1704,22 @@
|
|
|
1755
1704
|
_setMenuVisibility(isVisible);
|
|
1756
1705
|
}
|
|
1757
1706
|
}
|
|
1758
|
-
/**
|
|
1759
|
-
* Binds the children with additional properties and events
|
|
1707
|
+
/**
|
|
1708
|
+
* Binds the children with additional properties and events
|
|
1760
1709
|
*/
|
|
1761
1710
|
|
|
1762
1711
|
|
|
1763
1712
|
function getChildren() {
|
|
1764
|
-
|
|
1713
|
+
var _filter = filter.toLowerCase();
|
|
1714
|
+
|
|
1715
|
+
return React__default["default"].Children.map(props.children, function (child) {
|
|
1765
1716
|
if (child.props.value) {
|
|
1766
|
-
|
|
1767
|
-
|
|
1717
|
+
var visible = !_filter || child.props.value.toLowerCase().includes(_filter) || child.props.label.toLowerCase().includes(_filter);
|
|
1718
|
+
return /*#__PURE__*/React__default["default"].cloneElement(child, __assign(__assign({}, child.props), {
|
|
1719
|
+
visible: visible,
|
|
1768
1720
|
onClick: handleSelection,
|
|
1769
1721
|
selected: selectedValues.includes(child.props.value),
|
|
1770
|
-
_testId:
|
|
1722
|
+
_testId: props.name + "-dropdown-option--" + child.props.value
|
|
1771
1723
|
}));
|
|
1772
1724
|
}
|
|
1773
1725
|
|
|
@@ -1778,8 +1730,8 @@
|
|
|
1778
1730
|
return child;
|
|
1779
1731
|
});
|
|
1780
1732
|
}
|
|
1781
|
-
/**
|
|
1782
|
-
* Allows for conditional value relaying to the parent component and updates the selected labels
|
|
1733
|
+
/**
|
|
1734
|
+
* Allows for conditional value relaying to the parent component and updates the selected labels
|
|
1783
1735
|
*/
|
|
1784
1736
|
|
|
1785
1737
|
|
|
@@ -1792,7 +1744,7 @@
|
|
|
1792
1744
|
return v !== value;
|
|
1793
1745
|
});
|
|
1794
1746
|
} else {
|
|
1795
|
-
values = []
|
|
1747
|
+
values = __spreadArray(__spreadArray([], selectedValues), [value]);
|
|
1796
1748
|
}
|
|
1797
1749
|
} else {
|
|
1798
1750
|
values = selectedValues.includes(value) ? [] : [value];
|
|
@@ -1801,8 +1753,8 @@
|
|
|
1801
1753
|
props.onChange(props.name, values);
|
|
1802
1754
|
toggleMenuVisibility();
|
|
1803
1755
|
}
|
|
1804
|
-
/**
|
|
1805
|
-
* Controls whether the menu is hidden or not when clicked
|
|
1756
|
+
/**
|
|
1757
|
+
* Controls whether the menu is hidden or not when clicked
|
|
1806
1758
|
*/
|
|
1807
1759
|
|
|
1808
1760
|
|
|
@@ -1818,13 +1770,13 @@
|
|
|
1818
1770
|
setFilter('');
|
|
1819
1771
|
}
|
|
1820
1772
|
}
|
|
1821
|
-
/**
|
|
1822
|
-
* Generates a description of the selected options
|
|
1773
|
+
/**
|
|
1774
|
+
* Generates a description of the selected options
|
|
1823
1775
|
*/
|
|
1824
1776
|
|
|
1825
1777
|
|
|
1826
1778
|
function getSelectedLabel() {
|
|
1827
|
-
var selectedLabels = React__default.Children.map(props.children, function (child) {
|
|
1779
|
+
var selectedLabels = React__default["default"].Children.map(props.children, function (child) {
|
|
1828
1780
|
return child;
|
|
1829
1781
|
}).filter(function (child) {
|
|
1830
1782
|
return selectedValues.includes(child.props.value);
|
|
@@ -1833,7 +1785,7 @@
|
|
|
1833
1785
|
});
|
|
1834
1786
|
|
|
1835
1787
|
if (props.multiSelect && selectedLabels.length > 1) {
|
|
1836
|
-
return
|
|
1788
|
+
return selectedLabels.length + " items selected";
|
|
1837
1789
|
}
|
|
1838
1790
|
|
|
1839
1791
|
if (selectedLabels.length === 1) {
|
|
@@ -1843,55 +1795,67 @@
|
|
|
1843
1795
|
return '';
|
|
1844
1796
|
}
|
|
1845
1797
|
|
|
1846
|
-
return
|
|
1798
|
+
return jsxRuntime.jsxs("div", __assign({
|
|
1847
1799
|
className: "goa-dropdown-box"
|
|
1848
|
-
},
|
|
1849
|
-
|
|
1850
|
-
|
|
1851
|
-
|
|
1852
|
-
|
|
1853
|
-
|
|
1854
|
-
|
|
1855
|
-
|
|
1856
|
-
|
|
1857
|
-
|
|
1858
|
-
|
|
1859
|
-
|
|
1860
|
-
|
|
1861
|
-
|
|
1862
|
-
|
|
1863
|
-
|
|
1864
|
-
|
|
1865
|
-
|
|
1866
|
-
|
|
1867
|
-
|
|
1868
|
-
|
|
1869
|
-
|
|
1870
|
-
|
|
1871
|
-
|
|
1872
|
-
|
|
1873
|
-
|
|
1874
|
-
|
|
1875
|
-
|
|
1876
|
-
|
|
1877
|
-
|
|
1878
|
-
|
|
1879
|
-
|
|
1880
|
-
|
|
1881
|
-
|
|
1882
|
-
|
|
1883
|
-
|
|
1884
|
-
|
|
1885
|
-
|
|
1886
|
-
|
|
1800
|
+
}, {
|
|
1801
|
+
children: [isMenuVisible && jsxRuntime.jsx("div", {
|
|
1802
|
+
"data-testid": props.name + "-dropdown-background",
|
|
1803
|
+
className: "goa-dropdown-background",
|
|
1804
|
+
onClick: function () {
|
|
1805
|
+
return setMenuVisibility(false);
|
|
1806
|
+
}
|
|
1807
|
+
}, void 0), jsxRuntime.jsxs("div", {
|
|
1808
|
+
children: [(!isMenuVisible || !props.autoComplete) && jsxRuntime.jsx("div", __assign({
|
|
1809
|
+
onClick: toggleMenuVisibility,
|
|
1810
|
+
"data-testid": props.name + "-dropdown"
|
|
1811
|
+
}, {
|
|
1812
|
+
children: jsxRuntime.jsx(GoAInput, {
|
|
1813
|
+
type: "text",
|
|
1814
|
+
disabled: props.disabled,
|
|
1815
|
+
trailingIcon: "chevron-down",
|
|
1816
|
+
leadingIcon: props.leadingIcon,
|
|
1817
|
+
name: "search",
|
|
1818
|
+
readonly: true,
|
|
1819
|
+
onChange: null,
|
|
1820
|
+
placeholder: props.placeholder,
|
|
1821
|
+
value: getSelectedLabel()
|
|
1822
|
+
}, void 0)
|
|
1823
|
+
}), void 0), isMenuVisible && jsxRuntime.jsxs(jsxRuntime.Fragment, {
|
|
1824
|
+
children: [props.autoComplete && jsxRuntime.jsx(GoAInput, {
|
|
1825
|
+
type: "text",
|
|
1826
|
+
placeholder: "Filter",
|
|
1827
|
+
focused: isMenuVisible,
|
|
1828
|
+
variant: "goa",
|
|
1829
|
+
name: "filter",
|
|
1830
|
+
value: filter,
|
|
1831
|
+
trailingIcon: filter.length > 0 ? 'close-circle' : 'search',
|
|
1832
|
+
onTrailingIconClick: function () {
|
|
1833
|
+
return filter.length > 0 && setFilter('');
|
|
1834
|
+
},
|
|
1835
|
+
onChange: function (_name, value) {
|
|
1836
|
+
return setFilter(value);
|
|
1837
|
+
}
|
|
1838
|
+
}, void 0), jsxRuntime.jsx("ul", __assign({
|
|
1839
|
+
className: "goa-dropdown-list"
|
|
1840
|
+
}, {
|
|
1841
|
+
children: jsxRuntime.jsx(GoAScrollable, __assign({
|
|
1842
|
+
vertical: true,
|
|
1843
|
+
height: props.maxHeight || MAX_HEIGHT
|
|
1844
|
+
}, {
|
|
1845
|
+
children: getChildren()
|
|
1846
|
+
}), void 0)
|
|
1847
|
+
}), void 0)]
|
|
1848
|
+
}, void 0)]
|
|
1849
|
+
}, void 0)]
|
|
1850
|
+
}), void 0);
|
|
1887
1851
|
};
|
|
1888
1852
|
|
|
1889
|
-
var css_248z$
|
|
1890
|
-
styleInject(css_248z$
|
|
1853
|
+
var css_248z$6 = ":host, :root {\n --color-white: #fff;\n --color-black: #333;\n --color-gray-100: #f1f1f1;\n --color-gray-200: #dcdcdc;\n --color-gray-500: #adadad;\n --color-gray-600: #767676;\n --color-gray-700: #666;\n --color-gray-900: #333;\n --color-tealblue-100: #c8eefa;\n --color-tealblue-500: #0081a2;\n --color-tealblue-900: #005072;\n --color-orange: #feba35;\n --color-orange-100: hsl(39.7, 99.01%, 98%);\n --color-orange-500: hsl(39.7, 99.01%, 60.2%);\n --color-orange-900: hsl(39.7, 99.01%, 30%);\n --color-red: #ec040b;\n --color-red-100: hsl(358.19, 96.67%, 98%);\n --color-red-500: hsl(358.19, 96.67%, 47.06%);\n --color-red-600: hsl(358.19, 96.67%, 40%);\n --color-red-900: hsl(358.19, 96.67%, 20%);\n --color-green: #00853F;\n --color-green-100: hsl(148, 100%, 95%);\n --color-green-500: hsl(148.42, 100%, 26.08%);\n --color-green-900: hsl(148, 100%, 10%);\n --color-blue-100: #e3f2ff;\n --color-blue-500: #0070c4;\n --color-blue-600: #004f84;\n}\n\n/* Radio Group */\n.goa-radio-group--horizontal {\n display: flex;\n flex-direction: row;\n}\n\n.goa-radio-group--vertical {\n display: inline-flex;\n flex-direction: column;\n}\n\n/* Radio */\nlabel.goa-radio {\n --goa-border-color: var(--color-gray-700);\n --goa-border-color--checked: var(--color-blue-500);\n --goa-radio-color--error: var(--color-red);\n --goa-radio-outline-color: var(--color-orange);\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 !important;\n align-items: center;\n min-height: 3rem;\n}\n\n.goa-radio:hover {\n cursor: pointer;\n}\n\n.goa-radio *,\n.goa-radio *:before,\n.goa-radio *:after {\n box-sizing: border-box;\n}\n\n.goa-radio input[type=radio] {\n display: none;\n}\n\n.goa-radio-label {\n padding: 0.5rem 1.5rem 0.5rem 0.5rem;\n font-weight: var(--fw-regular);\n}\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 background-color: #fff;\n transition: box-shadow 100ms ease-in-out;\n}\n\n.goa-radio:focus > input:not(:disabled) ~ .goa-radio-icon {\n box-shadow: 0 0 0 var(--goa-radio-outline-width) var(--goa-radio-outline-color);\n}\n\n.goa-radio--disabled:hover {\n cursor: default;\n}\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\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\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\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\n/* Error */\n.goa-state--error input[type=radio]:checked ~ .goa-radio-icon {\n border: 7px solid var(--goa-radio-color--error);\n}\n\n.goa-state--error input[type=radio]:not(:checked) ~ .goa-radio-icon {\n border: 2px solid var(--goa-radio-color--error);\n}";
|
|
1854
|
+
styleInject(css_248z$6);
|
|
1891
1855
|
|
|
1892
1856
|
var GoARadio = function GoARadio(props) {
|
|
1893
1857
|
function getCss() {
|
|
1894
|
-
return
|
|
1858
|
+
return classnames__default["default"]({
|
|
1895
1859
|
'goa-radio': true,
|
|
1896
1860
|
'goa-radio--disabled': props.disabled
|
|
1897
1861
|
});
|
|
@@ -1901,30 +1865,34 @@
|
|
|
1901
1865
|
props.onChange(e.target.value);
|
|
1902
1866
|
}
|
|
1903
1867
|
|
|
1904
|
-
return
|
|
1868
|
+
return jsxRuntime.jsxs("label", __assign({
|
|
1905
1869
|
className: getCss()
|
|
1906
|
-
},
|
|
1907
|
-
|
|
1908
|
-
|
|
1909
|
-
|
|
1910
|
-
|
|
1911
|
-
|
|
1912
|
-
|
|
1913
|
-
|
|
1914
|
-
|
|
1915
|
-
|
|
1916
|
-
|
|
1917
|
-
|
|
1870
|
+
}, {
|
|
1871
|
+
children: [jsxRuntime.jsx("input", {
|
|
1872
|
+
type: "radio",
|
|
1873
|
+
name: props.name,
|
|
1874
|
+
value: props.value,
|
|
1875
|
+
checked: props.checked,
|
|
1876
|
+
disabled: props.disabled,
|
|
1877
|
+
onChange: onRadioChange
|
|
1878
|
+
}, void 0), jsxRuntime.jsx("div", {
|
|
1879
|
+
className: 'goa-radio-icon'
|
|
1880
|
+
}, void 0), jsxRuntime.jsx("span", __assign({
|
|
1881
|
+
className: "goa-radio-label"
|
|
1882
|
+
}, {
|
|
1883
|
+
children: props.children || props.label
|
|
1884
|
+
}), void 0)]
|
|
1885
|
+
}), void 0);
|
|
1918
1886
|
};
|
|
1919
1887
|
|
|
1920
|
-
var GoARadioGroup = function GoARadioGroup(
|
|
1921
|
-
var name =
|
|
1922
|
-
value =
|
|
1923
|
-
children =
|
|
1924
|
-
|
|
1925
|
-
orientation =
|
|
1926
|
-
onChange =
|
|
1927
|
-
childAttrs =
|
|
1888
|
+
var GoARadioGroup = function GoARadioGroup(_a) {
|
|
1889
|
+
var name = _a.name,
|
|
1890
|
+
value = _a.value,
|
|
1891
|
+
children = _a.children,
|
|
1892
|
+
_b = _a.orientation,
|
|
1893
|
+
orientation = _b === void 0 ? 'vertical' : _b,
|
|
1894
|
+
onChange = _a.onChange,
|
|
1895
|
+
childAttrs = __rest(_a, ["name", "value", "children", "orientation", "onChange"]);
|
|
1928
1896
|
|
|
1929
1897
|
function onChangeHandler(value) {
|
|
1930
1898
|
onChange(name, value);
|
|
@@ -1932,11 +1900,11 @@
|
|
|
1932
1900
|
|
|
1933
1901
|
function getChildren() {
|
|
1934
1902
|
return React.Children.map(children, function (child) {
|
|
1935
|
-
var key =
|
|
1903
|
+
var key = name + "-" + child.props.value;
|
|
1936
1904
|
|
|
1937
|
-
var _name =
|
|
1905
|
+
var _name = name + "-" + Date.now();
|
|
1938
1906
|
|
|
1939
|
-
return React__default.cloneElement(child,
|
|
1907
|
+
return /*#__PURE__*/React__default["default"].cloneElement(child, __assign(__assign({}, childAttrs), {
|
|
1940
1908
|
name: _name,
|
|
1941
1909
|
checked: child.props.value === value,
|
|
1942
1910
|
onChange: onChangeHandler,
|
|
@@ -1945,147 +1913,176 @@
|
|
|
1945
1913
|
});
|
|
1946
1914
|
}
|
|
1947
1915
|
|
|
1948
|
-
return
|
|
1949
|
-
className: "goa-radio-group--"
|
|
1950
|
-
},
|
|
1916
|
+
return jsxRuntime.jsx("div", __assign({
|
|
1917
|
+
className: "goa-radio-group--" + orientation
|
|
1918
|
+
}, {
|
|
1919
|
+
children: getChildren()
|
|
1920
|
+
}), void 0);
|
|
1951
1921
|
};
|
|
1952
1922
|
|
|
1953
|
-
var css_248z$
|
|
1954
|
-
styleInject(css_248z$
|
|
1923
|
+
var css_248z$5 = ":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}\n\n/* Palette */\n/* Semantic usages */\n@-webkit-keyframes pulse {\n 0% {\n opacity: 0.5;\n }\n 50% {\n opacity: 1;\n }\n 100% {\n opacity: 0.5;\n }\n}\n@keyframes pulse {\n 0% {\n opacity: 0.5;\n }\n 50% {\n opacity: 1;\n }\n 100% {\n opacity: 0.5;\n }\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}\n[data-skeleton] * {\n border-color: #ddd !important;\n color: transparent !important;\n}\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}\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}\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}\n[data-skeleton] h1 {\n height: calc(0.6 * var(--fs-3xl)) !important;\n}\n[data-skeleton] h2 {\n height: calc(0.6 * var(--fs-2xl)) !important;\n}\n[data-skeleton] h3 {\n height: calc(0.6 * var(--fs-xl)) !important;\n}\n[data-skeleton] h4 {\n height: calc(0.6 * var(--fs-lg)) !important;\n}\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\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\n.skeleton.text {\n width: 100%;\n height: 12px;\n border-radius: 4px;\n}\n\n.skeleton.paragraph {\n width: 100%;\n height: 70px;\n border-radius: 4px;\n}\n\n.skeleton.title {\n width: 50%;\n height: 20px;\n margin-bottom: 15px;\n border-radius: 4px;\n}\n\n.skeleton.avatar {\n width: 100px;\n height: 100px;\n border-radius: 50%;\n}\n\n.skeleton.thumbnail {\n width: 100px;\n height: 100px;\n border-radius: 4px;\n}\n\n/* skeleton image text */\n.skeleton-image-content {\n display: flex;\n flex-direction: row;\n gap: 30px;\n}\n\n.skeleton-image-content__text {\n flex: 1 1 auto;\n}\n\n/* skeleton content */\n.skeleton-content {\n display: grid;\n grid-template-columns: 1fr;\n gap: 30px;\n align-items: left;\n}";
|
|
1924
|
+
styleInject(css_248z$5);
|
|
1955
1925
|
|
|
1956
|
-
var GoASkeletonElement = function GoASkeletonElement(
|
|
1957
|
-
var
|
|
1958
|
-
type =
|
|
1959
|
-
var classes = "skeleton "
|
|
1960
|
-
return
|
|
1926
|
+
var GoASkeletonElement = function GoASkeletonElement(_a) {
|
|
1927
|
+
var _b = _a.type,
|
|
1928
|
+
type = _b === void 0 ? 'text' : _b;
|
|
1929
|
+
var classes = "skeleton " + type;
|
|
1930
|
+
return jsxRuntime.jsx("div", {
|
|
1961
1931
|
className: classes
|
|
1962
|
-
});
|
|
1932
|
+
}, void 0);
|
|
1963
1933
|
};
|
|
1964
1934
|
|
|
1965
|
-
var GoASkeletonContent = function GoASkeletonContent(
|
|
1966
|
-
var
|
|
1967
|
-
rows =
|
|
1935
|
+
var GoASkeletonContent = function GoASkeletonContent(_a) {
|
|
1936
|
+
var _b = _a.rows,
|
|
1937
|
+
rows = _b === void 0 ? 1 : _b;
|
|
1968
1938
|
var elements = [];
|
|
1969
1939
|
|
|
1970
1940
|
for (var i = 0; i < rows; i++) {
|
|
1971
|
-
elements.push(
|
|
1941
|
+
elements.push(jsxRuntime.jsx(GoASkeletonElement, {
|
|
1972
1942
|
type: "text"
|
|
1973
|
-
}));
|
|
1943
|
+
}, void 0));
|
|
1974
1944
|
}
|
|
1975
1945
|
|
|
1976
|
-
return
|
|
1946
|
+
return jsxRuntime.jsx("div", __assign({
|
|
1977
1947
|
className: "skeleton-content"
|
|
1978
|
-
},
|
|
1979
|
-
|
|
1980
|
-
|
|
1948
|
+
}, {
|
|
1949
|
+
children: jsxRuntime.jsxs("div", {
|
|
1950
|
+
children: [jsxRuntime.jsx(GoASkeletonElement, {
|
|
1951
|
+
type: "title"
|
|
1952
|
+
}, void 0), elements]
|
|
1953
|
+
}, void 0)
|
|
1954
|
+
}), void 0);
|
|
1981
1955
|
};
|
|
1982
1956
|
|
|
1983
|
-
var GoASkeletonGridColumnContent = function GoASkeletonGridColumnContent(
|
|
1984
|
-
var
|
|
1985
|
-
rows =
|
|
1957
|
+
var GoASkeletonGridColumnContent = function GoASkeletonGridColumnContent(_a) {
|
|
1958
|
+
var _b = _a.rows,
|
|
1959
|
+
rows = _b === void 0 ? 1 : _b;
|
|
1986
1960
|
var elements = [];
|
|
1987
1961
|
|
|
1988
1962
|
for (var i = 0; i < rows; i++) {
|
|
1989
|
-
elements.push(
|
|
1963
|
+
elements.push(jsxRuntime.jsx(GoASkeletonElement, {
|
|
1990
1964
|
type: "text"
|
|
1991
|
-
}));
|
|
1965
|
+
}, void 0));
|
|
1992
1966
|
}
|
|
1993
1967
|
|
|
1994
|
-
return
|
|
1968
|
+
return jsxRuntime.jsx("div", __assign({
|
|
1995
1969
|
className: "skeleton-content"
|
|
1996
|
-
},
|
|
1970
|
+
}, {
|
|
1971
|
+
children: jsxRuntime.jsx("div", {
|
|
1972
|
+
children: elements
|
|
1973
|
+
}, void 0)
|
|
1974
|
+
}), void 0);
|
|
1997
1975
|
};
|
|
1998
1976
|
|
|
1999
|
-
var GoASkeletonImageContent = function GoASkeletonImageContent(
|
|
2000
|
-
var
|
|
2001
|
-
rows =
|
|
1977
|
+
var GoASkeletonImageContent = function GoASkeletonImageContent(_a) {
|
|
1978
|
+
var _b = _a.rows,
|
|
1979
|
+
rows = _b === void 0 ? 1 : _b;
|
|
2002
1980
|
var elements = [];
|
|
2003
1981
|
|
|
2004
1982
|
for (var i = 0; i < rows; i++) {
|
|
2005
|
-
elements.push(
|
|
1983
|
+
elements.push(jsxRuntime.jsx(GoASkeletonElement, {
|
|
2006
1984
|
type: "text"
|
|
2007
|
-
}));
|
|
1985
|
+
}, void 0));
|
|
2008
1986
|
}
|
|
2009
1987
|
|
|
2010
|
-
return
|
|
1988
|
+
return jsxRuntime.jsxs("div", __assign({
|
|
2011
1989
|
className: "skeleton-image-content"
|
|
2012
|
-
},
|
|
2013
|
-
|
|
2014
|
-
|
|
2015
|
-
|
|
2016
|
-
|
|
2017
|
-
|
|
2018
|
-
|
|
1990
|
+
}, {
|
|
1991
|
+
children: [jsxRuntime.jsx(GoASkeletonElement, {
|
|
1992
|
+
type: "thumbnail"
|
|
1993
|
+
}, void 0), jsxRuntime.jsxs("div", __assign({
|
|
1994
|
+
className: "skeleton-image-content__text"
|
|
1995
|
+
}, {
|
|
1996
|
+
children: [jsxRuntime.jsx(GoASkeletonElement, {
|
|
1997
|
+
type: "title"
|
|
1998
|
+
}, void 0), elements]
|
|
1999
|
+
}), void 0)]
|
|
2000
|
+
}), void 0);
|
|
2019
2001
|
};
|
|
2020
2002
|
|
|
2021
|
-
var css_248z$
|
|
2022
|
-
styleInject(css_248z$
|
|
2003
|
+
var css_248z$4 = "/* Palette */\n/* Semantic usages */\n: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}\n\n/* Palette */\n/* Semantic usages */\n@-webkit-keyframes pulse {\n 0% {\n opacity: 0.5;\n }\n 50% {\n opacity: 1;\n }\n 100% {\n opacity: 0.5;\n }\n}\n@keyframes pulse {\n 0% {\n opacity: 0.5;\n }\n 50% {\n opacity: 1;\n }\n 100% {\n opacity: 0.5;\n }\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}\n[data-skeleton] * {\n border-color: #ddd !important;\n color: transparent !important;\n}\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}\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}\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}\n[data-skeleton] h1 {\n height: calc(0.6 * var(--fs-3xl)) !important;\n}\n[data-skeleton] h2 {\n height: calc(0.6 * var(--fs-2xl)) !important;\n}\n[data-skeleton] h3 {\n height: calc(0.6 * var(--fs-xl)) !important;\n}\n[data-skeleton] h4 {\n height: calc(0.6 * var(--fs-lg)) !important;\n}\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\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\n.skeleton.text {\n width: 100%;\n height: 12px;\n border-radius: 4px;\n}\n\n.skeleton.paragraph {\n width: 100%;\n height: 70px;\n border-radius: 4px;\n}\n\n.skeleton.title {\n width: 50%;\n height: 20px;\n margin-bottom: 15px;\n border-radius: 4px;\n}\n\n.skeleton.avatar {\n width: 100px;\n height: 100px;\n border-radius: 50%;\n}\n\n.skeleton.thumbnail {\n width: 100px;\n height: 100px;\n border-radius: 4px;\n}\n\n/* skeleton image text */\n.skeleton-image-content {\n display: flex;\n flex-direction: row;\n gap: 30px;\n}\n\n.skeleton-image-content__text {\n flex: 1 1 auto;\n}\n\n/* skeleton content */\n.skeleton-content {\n display: grid;\n grid-template-columns: 1fr;\n gap: 30px;\n align-items: left;\n}\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}\n.goa-card .card-content {\n padding: 28px;\n border-top: 8px solid #0081a2;\n}\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}\n.goa-card .card-content .goa-text {\n color: #333;\n font-size: var(--fs-base);\n line-height: 28px;\n}\n.goa-card .card-content .goa-footer {\n font-size: var(--fs-base);\n}\n.goa-card .card-content .goa-title {\n font-size: var(--fs-xl);\n font-weight: 400;\n line-height: 32px;\n}\n.goa-card .goa-poster {\n position: relative;\n display: block;\n padding: 56.25% 0 0;\n overflow: hidden;\n background: #e5e5e5;\n}\n.goa-card .goa-poster:empty {\n display: none;\n}\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}\n.goa-card .goa-poster-image img {\n display: block;\n width: 100%;\n -o-object-fit: cover;\n object-fit: cover;\n}\n.goa-card.card-auto {\n width: auto;\n}\n.goa-card.card-auto .card {\n flex-basis: auto;\n width: auto;\n}\n.goa-card a:hover {\n color: #004f84;\n text-decoration: none;\n}\n.goa-card a:focus {\n outline: 3px solid #feba35;\n outline-offset: 0;\n}\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}\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}";
|
|
2004
|
+
styleInject(css_248z$4);
|
|
2023
2005
|
|
|
2024
|
-
var GoACard = function GoACard(
|
|
2025
|
-
var title =
|
|
2026
|
-
content =
|
|
2027
|
-
|
|
2028
|
-
description =
|
|
2029
|
-
|
|
2030
|
-
cardImageUrl =
|
|
2031
|
-
|
|
2032
|
-
titleUrl =
|
|
2033
|
-
|
|
2034
|
-
children =
|
|
2035
|
-
|
|
2036
|
-
minWidth =
|
|
2037
|
-
|
|
2038
|
-
maxWidth =
|
|
2039
|
-
other =
|
|
2040
|
-
|
|
2041
|
-
var
|
|
2042
|
-
|
|
2043
|
-
|
|
2044
|
-
|
|
2045
|
-
|
|
2046
|
-
return /*#__PURE__*/React__default.createElement("div", Object.assign({
|
|
2006
|
+
var GoACard = function GoACard(_a) {
|
|
2007
|
+
var title = _a.title,
|
|
2008
|
+
content = _a.content,
|
|
2009
|
+
_b = _a.description,
|
|
2010
|
+
description = _b === void 0 ? null : _b,
|
|
2011
|
+
_c = _a.cardImageUrl,
|
|
2012
|
+
cardImageUrl = _c === void 0 ? null : _c,
|
|
2013
|
+
_d = _a.titleUrl,
|
|
2014
|
+
titleUrl = _d === void 0 ? null : _d,
|
|
2015
|
+
_e = _a.children,
|
|
2016
|
+
children = _e === void 0 ? null : _e,
|
|
2017
|
+
_f = _a.minWidth,
|
|
2018
|
+
minWidth = _f === void 0 ? 'auto' : _f,
|
|
2019
|
+
_g = _a.maxWidth,
|
|
2020
|
+
maxWidth = _g === void 0 ? 'auto' : _g,
|
|
2021
|
+
other = __rest(_a, ["title", "content", "description", "cardImageUrl", "titleUrl", "children", "minWidth", "maxWidth"]);
|
|
2022
|
+
|
|
2023
|
+
var _h = React.useState(null),
|
|
2024
|
+
imgHeight = _h[0];
|
|
2025
|
+
_h[1];
|
|
2026
|
+
|
|
2027
|
+
return jsxRuntime.jsxs("div", __assign({
|
|
2047
2028
|
className: "goa-card",
|
|
2048
|
-
"data-testid":
|
|
2029
|
+
"data-testid": 'card-container',
|
|
2049
2030
|
style: {
|
|
2050
2031
|
minWidth: minWidth,
|
|
2051
2032
|
maxWidth: maxWidth
|
|
2052
2033
|
}
|
|
2053
|
-
}, other
|
|
2054
|
-
|
|
2055
|
-
|
|
2056
|
-
|
|
2057
|
-
|
|
2058
|
-
|
|
2059
|
-
|
|
2060
|
-
|
|
2061
|
-
|
|
2062
|
-
|
|
2063
|
-
|
|
2064
|
-
|
|
2065
|
-
|
|
2066
|
-
|
|
2067
|
-
|
|
2068
|
-
|
|
2069
|
-
|
|
2070
|
-
|
|
2071
|
-
|
|
2072
|
-
|
|
2073
|
-
|
|
2074
|
-
|
|
2034
|
+
}, other, {
|
|
2035
|
+
children: [cardImageUrl && jsxRuntime.jsx("div", __assign({
|
|
2036
|
+
className: "goa-poster-image",
|
|
2037
|
+
"data-testid": 'card-img'
|
|
2038
|
+
}, {
|
|
2039
|
+
children: jsxRuntime.jsx("img", {
|
|
2040
|
+
height: imgHeight,
|
|
2041
|
+
src: cardImageUrl,
|
|
2042
|
+
alt: "Card cardImageUrl"
|
|
2043
|
+
}, void 0)
|
|
2044
|
+
}), void 0), jsxRuntime.jsxs("div", __assign({
|
|
2045
|
+
className: "card-content"
|
|
2046
|
+
}, {
|
|
2047
|
+
children: [jsxRuntime.jsx("div", __assign({
|
|
2048
|
+
className: "goa-title",
|
|
2049
|
+
"data-testid": 'card-title'
|
|
2050
|
+
}, {
|
|
2051
|
+
children: titleUrl ? jsxRuntime.jsx("a", __assign({
|
|
2052
|
+
href: titleUrl,
|
|
2053
|
+
"data-testid": 'card-title-link'
|
|
2054
|
+
}, {
|
|
2055
|
+
children: title
|
|
2056
|
+
}), void 0) : jsxRuntime.jsx("div", {
|
|
2057
|
+
children: title
|
|
2058
|
+
}, void 0)
|
|
2059
|
+
}), void 0), jsxRuntime.jsx("p", __assign({
|
|
2060
|
+
className: "goa-text",
|
|
2061
|
+
"data-testid": 'card-content'
|
|
2062
|
+
}, {
|
|
2063
|
+
children: content !== null && content !== void 0 ? content : description
|
|
2064
|
+
}), void 0), children && jsxRuntime.jsx("div", __assign({
|
|
2065
|
+
className: "goa-footer",
|
|
2066
|
+
"data-testid": 'card-footer'
|
|
2067
|
+
}, {
|
|
2068
|
+
children: children
|
|
2069
|
+
}), void 0)]
|
|
2070
|
+
}), void 0)]
|
|
2071
|
+
}), void 0);
|
|
2075
2072
|
};
|
|
2076
2073
|
|
|
2077
|
-
var css_248z$
|
|
2078
|
-
styleInject(css_248z$
|
|
2074
|
+
var css_248z$3 = "/* Palette */\n/* Semantic usages */\n.goa-card-group {\n margin-top: 14px;\n vertical-align: top;\n}\n.goa-card-group .card-group-title {\n font-size: 24px;\n font-weight: bold;\n color: #333;\n}\n.goa-card-group .card-group-basic {\n display: flex;\n flex-direction: row;\n flex-wrap: wrap;\n align-items: stretch;\n}\n.goa-card-group .card-group-basic > div {\n margin: 14px 10px;\n}\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}\n.goa-card-group .card-group-basic-vue > div > div {\n margin: 14px 10px;\n}\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}\n.goa-card-group .card-group-column > div {\n margin: 14px;\n}\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}\n.goa-card-group .card-group-column > div > div {\n margin: 14px;\n}";
|
|
2075
|
+
styleInject(css_248z$3);
|
|
2079
2076
|
|
|
2080
|
-
var GoACardGroup = function GoACardGroup(
|
|
2081
|
-
var
|
|
2082
|
-
title =
|
|
2083
|
-
|
|
2084
|
-
children =
|
|
2085
|
-
|
|
2086
|
-
layout =
|
|
2087
|
-
|
|
2088
|
-
cardItems =
|
|
2077
|
+
var GoACardGroup = function GoACardGroup(_a) {
|
|
2078
|
+
var _b = _a.title,
|
|
2079
|
+
title = _b === void 0 ? null : _b,
|
|
2080
|
+
_c = _a.children,
|
|
2081
|
+
children = _c === void 0 ? null : _c,
|
|
2082
|
+
_d = _a.layout,
|
|
2083
|
+
layout = _d === void 0 ? 'basic' : _d,
|
|
2084
|
+
_e = _a.cardItems,
|
|
2085
|
+
cardItems = _e === void 0 ? null : _e;
|
|
2089
2086
|
|
|
2090
2087
|
function getCards() {
|
|
2091
2088
|
if (children) {
|
|
@@ -2093,108 +2090,122 @@
|
|
|
2093
2090
|
}
|
|
2094
2091
|
|
|
2095
2092
|
return cardItems.map(function (item, index) {
|
|
2096
|
-
return /*#__PURE__*/
|
|
2093
|
+
return /*#__PURE__*/React.createElement(GoACard, __assign({}, item, {
|
|
2097
2094
|
key: index
|
|
2098
2095
|
}), item.children);
|
|
2099
2096
|
});
|
|
2100
2097
|
}
|
|
2101
2098
|
|
|
2102
|
-
return
|
|
2099
|
+
return jsxRuntime.jsxs("div", __assign({
|
|
2103
2100
|
className: "goa-card-group"
|
|
2104
|
-
},
|
|
2105
|
-
|
|
2106
|
-
|
|
2107
|
-
|
|
2108
|
-
|
|
2101
|
+
}, {
|
|
2102
|
+
children: [jsxRuntime.jsx("div", __assign({
|
|
2103
|
+
className: "card-group-title"
|
|
2104
|
+
}, {
|
|
2105
|
+
children: title
|
|
2106
|
+
}), void 0), jsxRuntime.jsx("div", __assign({
|
|
2107
|
+
className: "card-group-" + layout
|
|
2108
|
+
}, {
|
|
2109
|
+
children: getCards()
|
|
2110
|
+
}), void 0)]
|
|
2111
|
+
}), void 0);
|
|
2109
2112
|
};
|
|
2110
2113
|
|
|
2111
|
-
var css_248z$
|
|
2112
|
-
styleInject(css_248z$
|
|
2113
|
-
|
|
2114
|
-
/* eslint-disable-next-line */
|
|
2114
|
+
var css_248z$2 = ":host, :root {\n --color-white: #fff;\n --color-black: #333;\n --color-gray-100: #f1f1f1;\n --color-gray-200: #dcdcdc;\n --color-gray-500: #adadad;\n --color-gray-600: #767676;\n --color-gray-700: #666;\n --color-gray-900: #333;\n --color-tealblue-100: #c8eefa;\n --color-tealblue-500: #0081a2;\n --color-tealblue-900: #005072;\n --color-orange: #feba35;\n --color-orange-100: hsl(39.7, 99.01%, 98%);\n --color-orange-500: hsl(39.7, 99.01%, 60.2%);\n --color-orange-900: hsl(39.7, 99.01%, 30%);\n --color-red: #ec040b;\n --color-red-100: hsl(358.19, 96.67%, 98%);\n --color-red-500: hsl(358.19, 96.67%, 47.06%);\n --color-red-600: hsl(358.19, 96.67%, 40%);\n --color-red-900: hsl(358.19, 96.67%, 20%);\n --color-green: #00853F;\n --color-green-100: hsl(148, 100%, 95%);\n --color-green-500: hsl(148.42, 100%, 26.08%);\n --color-green-900: hsl(148, 100%, 10%);\n --color-blue-100: #e3f2ff;\n --color-blue-500: #0070c4;\n --color-blue-600: #004f84;\n}\n\n.goa-checkbox {\n box-sizing: border-box;\n display: flex !important;\n align-items: center;\n min-height: calc(3rem - 4px);\n}\n.goa-checkbox input[type=checkbox] {\n height: 0px;\n width: 0px;\n position: absolute;\n}\n\n.goa-checkbox--disabled {\n opacity: 30%;\n}\n.goa-checkbox--disabled .goa-checkbox-label {\n cursor: default;\n}\n\n.goa-checkbox-container {\n cursor: pointer;\n border: 1px solid var(--color-gray-700);\n border-radius: 2px;\n background-color: var(--color-white);\n height: 1.5rem;\n line-height: 1.5rem;\n width: 1.5rem;\n display: flex;\n justify-content: center;\n padding: 3px;\n}\n.goa-checkbox-container svg {\n fill: var(--color-white);\n}\n.goa-checkbox-container.goa-checkbox--selected {\n background-color: var(--color-blue-500);\n}\n.goa-checkbox-container:hover:not(.goa-checkbox--selected) {\n background-color: var(--color-gray-100);\n}\n.goa-checkbox-container:focus-within {\n box-shadow: 0 0 0 3px var(--color-orange-500);\n outline: none;\n}\n\n.goa-checkbox-text {\n padding-left: 0.5rem;\n -webkit-user-select: none;\n -moz-user-select: none;\n -ms-user-select: none;\n user-select: none;\n cursor: pointer;\n font-weight: var(--fw-regular);\n}\n\n.goa-state--error .goa-checkbox-container {\n border: 2px solid var(--color-red-500);\n}";
|
|
2115
|
+
styleInject(css_248z$2);
|
|
2115
2116
|
|
|
2116
|
-
var GoACheckbox = function GoACheckbox(
|
|
2117
|
-
var name =
|
|
2118
|
-
checked =
|
|
2119
|
-
disabled =
|
|
2120
|
-
indeterminate =
|
|
2121
|
-
|
|
2122
|
-
value =
|
|
2123
|
-
content =
|
|
2124
|
-
children =
|
|
2125
|
-
|
|
2117
|
+
var GoACheckbox = function GoACheckbox(_a) {
|
|
2118
|
+
var name = _a.name,
|
|
2119
|
+
checked = _a.checked,
|
|
2120
|
+
disabled = _a.disabled,
|
|
2121
|
+
indeterminate = _a.indeterminate,
|
|
2122
|
+
_b = _a.value,
|
|
2123
|
+
value = _b === void 0 ? true : _b,
|
|
2124
|
+
content = _a.content,
|
|
2125
|
+
children = _a.children,
|
|
2126
|
+
onChange = _a.onChange;
|
|
2126
2127
|
|
|
2127
2128
|
var rootCss = function rootCss() {
|
|
2128
|
-
return
|
|
2129
|
+
return classnames__default["default"]({
|
|
2129
2130
|
'goa-checkbox': true,
|
|
2130
2131
|
'goa-checkbox--disabled': disabled
|
|
2131
2132
|
});
|
|
2132
2133
|
};
|
|
2133
2134
|
|
|
2134
2135
|
var checkboxCss = function checkboxCss() {
|
|
2135
|
-
return
|
|
2136
|
+
return classnames__default["default"]({
|
|
2136
2137
|
'goa-checkbox-container': true,
|
|
2137
2138
|
'goa-checkbox--selected': checked
|
|
2138
2139
|
});
|
|
2139
2140
|
};
|
|
2140
2141
|
|
|
2141
|
-
return
|
|
2142
|
+
return jsxRuntime.jsxs("label", __assign({
|
|
2142
2143
|
className: rootCss()
|
|
2143
|
-
},
|
|
2144
|
-
|
|
2145
|
-
|
|
2146
|
-
|
|
2147
|
-
|
|
2148
|
-
|
|
2149
|
-
|
|
2150
|
-
|
|
2151
|
-
|
|
2152
|
-
|
|
2153
|
-
|
|
2154
|
-
|
|
2155
|
-
|
|
2156
|
-
|
|
2157
|
-
|
|
2158
|
-
|
|
2159
|
-
|
|
2160
|
-
|
|
2161
|
-
|
|
2162
|
-
|
|
2163
|
-
|
|
2164
|
-
|
|
2165
|
-
|
|
2166
|
-
|
|
2167
|
-
|
|
2168
|
-
|
|
2169
|
-
|
|
2144
|
+
}, {
|
|
2145
|
+
children: [jsxRuntime.jsxs("div", __assign({
|
|
2146
|
+
className: checkboxCss()
|
|
2147
|
+
}, {
|
|
2148
|
+
children: [jsxRuntime.jsx("input", {
|
|
2149
|
+
name: name,
|
|
2150
|
+
type: "checkbox",
|
|
2151
|
+
checked: checked,
|
|
2152
|
+
disabled: disabled,
|
|
2153
|
+
value: "" + value,
|
|
2154
|
+
onChange: function (e) {
|
|
2155
|
+
return onChange(name, e.target.checked ? "" + value : null);
|
|
2156
|
+
}
|
|
2157
|
+
}, void 0), indeterminate && checked && jsxRuntime.jsx("svg", __assign({
|
|
2158
|
+
id: 'dashmark',
|
|
2159
|
+
xmlns: "http://www.w3.org/2000/svg",
|
|
2160
|
+
viewBox: "0 0 15 2"
|
|
2161
|
+
}, {
|
|
2162
|
+
children: jsxRuntime.jsx("rect", {
|
|
2163
|
+
width: "15",
|
|
2164
|
+
height: "2"
|
|
2165
|
+
}, void 0)
|
|
2166
|
+
}), void 0), !indeterminate && checked && jsxRuntime.jsx("svg", __assign({
|
|
2167
|
+
id: 'checkmark',
|
|
2168
|
+
xmlns: "http://www.w3.org/2000/svg",
|
|
2169
|
+
viewBox: "0 0 16 12.18"
|
|
2170
|
+
}, {
|
|
2171
|
+
children: jsxRuntime.jsx("path", {
|
|
2172
|
+
d: "M5.09,9.64,1.27,5.82,0,7.09l5.09,5.09L16,1.27,14.73,0Z"
|
|
2173
|
+
}, void 0)
|
|
2174
|
+
}), void 0)]
|
|
2175
|
+
}), void 0), jsxRuntime.jsx("div", __assign({
|
|
2176
|
+
className: "goa-checkbox-text"
|
|
2177
|
+
}, {
|
|
2178
|
+
children: content || children
|
|
2179
|
+
}), void 0)]
|
|
2180
|
+
}), void 0);
|
|
2170
2181
|
};
|
|
2171
2182
|
|
|
2172
|
-
var css_248z$
|
|
2173
|
-
styleInject(css_248z$
|
|
2174
|
-
|
|
2175
|
-
var GoAPageLoader = function GoAPageLoader(_ref) {
|
|
2176
|
-
var _ref$type = _ref.type,
|
|
2177
|
-
type = _ref$type === void 0 ? 'infinite' : _ref$type,
|
|
2178
|
-
_ref$visible = _ref.visible,
|
|
2179
|
-
visible = _ref$visible === void 0 ? false : _ref$visible,
|
|
2180
|
-
_ref$message = _ref.message,
|
|
2181
|
-
message = _ref$message === void 0 ? 'Loading...' : _ref$message,
|
|
2182
|
-
_ref$value = _ref.value,
|
|
2183
|
-
value = _ref$value === void 0 ? 0 : _ref$value,
|
|
2184
|
-
_ref$pagelock = _ref.pagelock,
|
|
2185
|
-
pagelock = _ref$pagelock === void 0 ? true : _ref$pagelock,
|
|
2186
|
-
_ref$displayType = _ref.displayType,
|
|
2187
|
-
displayType = _ref$displayType === void 0 ? 'large' : _ref$displayType;
|
|
2183
|
+
var css_248z$1 = "/* Palette */\n/* Semantic usages */\n.svg {\n max-width: 100px;\n}\n\n.svg--small {\n max-width: 65px;\n}\n\n@-webkit-keyframes circle-animation {\n 0% {\n stroke-dashoffset: 75;\n transform: rotate(0);\n }\n 100% {\n stroke-dashoffset: 75;\n transform: rotate(360deg);\n }\n}\n\n@keyframes circle-animation {\n 0% {\n stroke-dashoffset: 75;\n transform: rotate(0);\n }\n 100% {\n stroke-dashoffset: 75;\n transform: rotate(360deg);\n }\n}\n.base-circle {\n display: block;\n fill: transparent;\n stroke: #c8eef9;\n stroke-width: 7px;\n}\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}\n.progress-circle--infinite {\n -webkit-animation: circle-animation 1.2s linear infinite;\n animation: circle-animation 1.2s linear infinite;\n}\n\n.progress-message, .progress-message--small, .progress-message--large {\n font-style: normal;\n font-weight: normal;\n}\n.progress-message--large {\n margin-top: 32px;\n font-size: 24px;\n color: #000;\n}\n.progress-message--small {\n margin-top: 18px;\n font-size: 18px;\n color: #000;\n}\n\n.progress-container, .progress-container--large, .progress-container--small {\n display: flex;\n flex-direction: column;\n align-items: center;\n justify-content: center;\n background: white;\n}\n.progress-container--large {\n width: 100%;\n height: 100%;\n}";
|
|
2184
|
+
styleInject(css_248z$1);
|
|
2188
2185
|
|
|
2189
|
-
|
|
2190
|
-
|
|
2186
|
+
var GoAPageLoader = function GoAPageLoader(_a) {
|
|
2187
|
+
var _b = _a.type,
|
|
2188
|
+
type = _b === void 0 ? 'infinite' : _b,
|
|
2189
|
+
_c = _a.visible,
|
|
2190
|
+
visible = _c === void 0 ? false : _c,
|
|
2191
|
+
_d = _a.message,
|
|
2192
|
+
message = _d === void 0 ? 'Loading...' : _d,
|
|
2193
|
+
_e = _a.value,
|
|
2194
|
+
value = _e === void 0 ? 0 : _e,
|
|
2195
|
+
_f = _a.pagelock,
|
|
2196
|
+
pagelock = _f === void 0 ? true : _f,
|
|
2197
|
+
_g = _a.displayType,
|
|
2198
|
+
displayType = _g === void 0 ? 'large' : _g;
|
|
2199
|
+
/**
|
|
2200
|
+
* Set defaults
|
|
2191
2201
|
*/
|
|
2202
|
+
|
|
2192
2203
|
var progressMaxValue = 283;
|
|
2193
2204
|
var strokeDashoffset = 0;
|
|
2194
|
-
/**
|
|
2195
|
-
* Sets the progress if in progress mode.
|
|
2196
|
-
* @param progress
|
|
2197
|
-
* @returns
|
|
2205
|
+
/**
|
|
2206
|
+
* Sets the progress if in progress mode.
|
|
2207
|
+
* @param progress
|
|
2208
|
+
* @returns
|
|
2198
2209
|
*/
|
|
2199
2210
|
|
|
2200
2211
|
function setProgress(progress) {
|
|
@@ -2228,32 +2239,38 @@
|
|
|
2228
2239
|
setProgress(value);
|
|
2229
2240
|
}
|
|
2230
2241
|
|
|
2231
|
-
return
|
|
2232
|
-
className: "progress-container--"
|
|
2233
|
-
onKeyDown: function
|
|
2242
|
+
return jsxRuntime.jsxs("div", __assign({
|
|
2243
|
+
className: "progress-container--" + displayType,
|
|
2244
|
+
onKeyDown: function (event) {
|
|
2234
2245
|
event.preventDefault();
|
|
2235
2246
|
}
|
|
2236
|
-
},
|
|
2237
|
-
|
|
2238
|
-
|
|
2239
|
-
|
|
2240
|
-
|
|
2241
|
-
|
|
2242
|
-
|
|
2243
|
-
|
|
2244
|
-
|
|
2245
|
-
|
|
2246
|
-
|
|
2247
|
-
|
|
2248
|
-
|
|
2249
|
-
|
|
2250
|
-
|
|
2251
|
-
|
|
2252
|
-
|
|
2253
|
-
|
|
2254
|
-
|
|
2255
|
-
|
|
2256
|
-
|
|
2247
|
+
}, {
|
|
2248
|
+
children: [jsxRuntime.jsxs("svg", __assign({
|
|
2249
|
+
className: "" + (displayType === 'large' ? 'svg' : "svg--small"),
|
|
2250
|
+
fill: "none",
|
|
2251
|
+
viewBox: "0 0 100 100",
|
|
2252
|
+
xmlns: "http://www.w3.org/2000/svg"
|
|
2253
|
+
}, {
|
|
2254
|
+
children: [jsxRuntime.jsx("circle", {
|
|
2255
|
+
className: "base-circle",
|
|
2256
|
+
cx: "50",
|
|
2257
|
+
cy: "50",
|
|
2258
|
+
r: "45"
|
|
2259
|
+
}, void 0), jsxRuntime.jsx("circle", {
|
|
2260
|
+
className: "" + (type === 'infinite' ? 'progress-circle--infinite' : 'progress-circle'),
|
|
2261
|
+
cx: "50",
|
|
2262
|
+
cy: "50",
|
|
2263
|
+
r: "45",
|
|
2264
|
+
style: {
|
|
2265
|
+
strokeDashoffset: strokeDashoffset
|
|
2266
|
+
}
|
|
2267
|
+
}, void 0)]
|
|
2268
|
+
}), void 0), jsxRuntime.jsx("span", __assign({
|
|
2269
|
+
className: "progress-message--" + displayType
|
|
2270
|
+
}, {
|
|
2271
|
+
children: message
|
|
2272
|
+
}), void 0)]
|
|
2273
|
+
}), void 0);
|
|
2257
2274
|
} else {
|
|
2258
2275
|
document.body.style.removeProperty('height');
|
|
2259
2276
|
document.body.style.removeProperty('overflow');
|
|
@@ -2261,40 +2278,43 @@
|
|
|
2261
2278
|
}
|
|
2262
2279
|
};
|
|
2263
2280
|
GoAPageLoader.propTypes = {
|
|
2264
|
-
visible:
|
|
2265
|
-
message:
|
|
2266
|
-
value:
|
|
2267
|
-
type:
|
|
2268
|
-
pagelock:
|
|
2269
|
-
displayType:
|
|
2281
|
+
visible: PropTypes.bool,
|
|
2282
|
+
message: PropTypes.string,
|
|
2283
|
+
value: PropTypes.number,
|
|
2284
|
+
type: PropTypes.string,
|
|
2285
|
+
pagelock: PropTypes.bool,
|
|
2286
|
+
displayType: PropTypes.string
|
|
2270
2287
|
};
|
|
2271
2288
|
|
|
2272
|
-
var css_248z
|
|
2273
|
-
styleInject(css_248z
|
|
2289
|
+
var css_248z = "@-webkit-keyframes rotate {\n 100% {\n transform: rotate(360deg);\n }\n}\n@keyframes rotate {\n 100% {\n transform: rotate(360deg);\n }\n}\n.circular-loader {\n -webkit-animation: rotate 1s linear infinite;\n animation: rotate 1s linear infinite;\n}\n\n.base-circle {\n display: block;\n fill: transparent;\n stroke-width: 7px;\n}\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}";
|
|
2290
|
+
styleInject(css_248z);
|
|
2274
2291
|
|
|
2275
|
-
var GoAElementLoader = function GoAElementLoader(
|
|
2276
|
-
var
|
|
2277
|
-
visible =
|
|
2278
|
-
|
|
2279
|
-
baseColour =
|
|
2280
|
-
|
|
2281
|
-
spinnerColour =
|
|
2282
|
-
|
|
2283
|
-
size =
|
|
2292
|
+
var GoAElementLoader = function GoAElementLoader(_a) {
|
|
2293
|
+
var _b = _a.visible,
|
|
2294
|
+
visible = _b === void 0 ? false : _b,
|
|
2295
|
+
_c = _a.baseColour,
|
|
2296
|
+
baseColour = _c === void 0 ? '#c8eef9' : _c,
|
|
2297
|
+
_d = _a.spinnerColour,
|
|
2298
|
+
spinnerColour = _d === void 0 ? '#0070c4' : _d,
|
|
2299
|
+
_e = _a.size,
|
|
2300
|
+
size = _e === void 0 ? 'default' : _e;
|
|
2284
2301
|
var radius = size === 'small' ? 16 : 18;
|
|
2285
2302
|
var diameter = radius * 2;
|
|
2286
|
-
var boxView = "0 0 "
|
|
2287
|
-
/**
|
|
2288
|
-
* Generates the value for an SVG arc.
|
|
2289
|
-
* @param current Current value.
|
|
2290
|
-
* @param total Maximum value.
|
|
2291
|
-
* @param pathRadius Radius of the SVG path.
|
|
2292
|
-
* @param elementRadius Radius of the SVG container.
|
|
2293
|
-
* @param isSemicircle Whether the element should be a semicircle.
|
|
2303
|
+
var boxView = "0 0 " + diameter + " " + diameter;
|
|
2304
|
+
/**
|
|
2305
|
+
* Generates the value for an SVG arc.
|
|
2306
|
+
* @param current Current value.
|
|
2307
|
+
* @param total Maximum value.
|
|
2308
|
+
* @param pathRadius Radius of the SVG path.
|
|
2309
|
+
* @param elementRadius Radius of the SVG container.
|
|
2310
|
+
* @param isSemicircle Whether the element should be a semicircle.
|
|
2294
2311
|
*/
|
|
2295
2312
|
|
|
2296
|
-
function getArc(current, total, pathRadius, elementRadius) {
|
|
2297
|
-
|
|
2313
|
+
function getArc(current, total, pathRadius, elementRadius, isSemicircle) {
|
|
2314
|
+
if (isSemicircle === void 0) {
|
|
2315
|
+
isSemicircle = false;
|
|
2316
|
+
}
|
|
2317
|
+
|
|
2298
2318
|
var value = Math.max(0, Math.min(current || 0, total));
|
|
2299
2319
|
var maxAngle = isSemicircle ? 180 : 359.9999;
|
|
2300
2320
|
var percentage = total === 0 ? maxAngle : value / total * maxAngle;
|
|
@@ -2304,15 +2324,15 @@
|
|
|
2304
2324
|
var end = _polarToCartesian(elementRadius, pathRadius, 0);
|
|
2305
2325
|
|
|
2306
2326
|
var arcSweep = percentage <= 180 ? 0 : 1;
|
|
2307
|
-
return "M "
|
|
2327
|
+
return "M " + start + " A " + pathRadius + " " + pathRadius + " 0 " + arcSweep + " 0 " + end;
|
|
2308
2328
|
}
|
|
2309
2329
|
|
|
2310
2330
|
var DEGREE_IN_RADIANS = Math.PI / 180;
|
|
2311
|
-
/**
|
|
2312
|
-
* Converts polar cooradinates to Cartesian.
|
|
2313
|
-
* @param elementRadius Radius of the wrapper element.
|
|
2314
|
-
* @param pathRadius Radius of the path being described.
|
|
2315
|
-
* @param angleInDegrees Degree to be converted.
|
|
2331
|
+
/**
|
|
2332
|
+
* Converts polar cooradinates to Cartesian.
|
|
2333
|
+
* @param elementRadius Radius of the wrapper element.
|
|
2334
|
+
* @param pathRadius Radius of the path being described.
|
|
2335
|
+
* @param angleInDegrees Degree to be converted.
|
|
2316
2336
|
*/
|
|
2317
2337
|
|
|
2318
2338
|
function _polarToCartesian(elementRadius, pathRadius, angleInDegrees) {
|
|
@@ -2322,25 +2342,27 @@
|
|
|
2322
2342
|
return x + ' ' + y;
|
|
2323
2343
|
}
|
|
2324
2344
|
|
|
2325
|
-
return visible &&
|
|
2345
|
+
return visible && jsxRuntime.jsxs("svg", __assign({
|
|
2326
2346
|
className: "circular-loader",
|
|
2327
2347
|
fill: "none",
|
|
2328
2348
|
viewBox: boxView,
|
|
2329
2349
|
width: radius,
|
|
2330
2350
|
height: radius,
|
|
2331
2351
|
xmlns: "http://www.w3.org/2000/svg"
|
|
2332
|
-
},
|
|
2333
|
-
|
|
2334
|
-
|
|
2335
|
-
|
|
2336
|
-
|
|
2337
|
-
|
|
2338
|
-
|
|
2339
|
-
|
|
2340
|
-
|
|
2341
|
-
|
|
2342
|
-
|
|
2343
|
-
|
|
2352
|
+
}, {
|
|
2353
|
+
children: [jsxRuntime.jsx("circle", {
|
|
2354
|
+
cx: radius,
|
|
2355
|
+
cy: radius,
|
|
2356
|
+
stroke: baseColour,
|
|
2357
|
+
strokeWidth: "7",
|
|
2358
|
+
r: radius - 4
|
|
2359
|
+
}, void 0), jsxRuntime.jsx("path", {
|
|
2360
|
+
d: getArc(75, 100, radius - 4, radius, false),
|
|
2361
|
+
strokeWidth: "7",
|
|
2362
|
+
stroke: spinnerColour,
|
|
2363
|
+
strokeLinecap: "round"
|
|
2364
|
+
}, void 0)]
|
|
2365
|
+
}), void 0);
|
|
2344
2366
|
};
|
|
2345
2367
|
|
|
2346
2368
|
exports.GoAButton = GoAButton;
|
|
@@ -2366,4 +2388,4 @@
|
|
|
2366
2388
|
|
|
2367
2389
|
Object.defineProperty(exports, '__esModule', { value: true });
|
|
2368
2390
|
|
|
2369
|
-
}))
|
|
2391
|
+
}));
|