@abgov/react-components 3.4.0-beta.60 → 3.4.0-beta.64
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 +2 -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 -617
- package/experimental/react-components.umd.js +879 -908
- 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/dropdown/dropdown.d.ts +1 -1
- package/package.json +4 -3
- package/react-components.esm.js +941 -991
- package/react-components.umd.js +955 -937
- 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
|
-
|
|
1169
|
+
var PropTypes = propTypes.exports;
|
|
1170
|
+
|
|
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);
|
|
1307
1173
|
|
|
1308
|
-
var GoACallout = function GoACallout(
|
|
1309
|
-
var title =
|
|
1310
|
-
|
|
1311
|
-
type =
|
|
1312
|
-
content =
|
|
1313
|
-
|
|
1314
|
-
children =
|
|
1315
|
-
|
|
1316
|
-
|
|
1317
|
-
return
|
|
1318
|
-
|
|
1319
|
-
|
|
1320
|
-
|
|
1321
|
-
|
|
1322
|
-
|
|
1323
|
-
|
|
1324
|
-
|
|
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(jsxRuntime.Fragment, {
|
|
1360
|
+
children: [jsxRuntime.jsxs("header", __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: [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,136 +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
|
-
|
|
1677
|
-
|
|
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);
|
|
1678
1625
|
};
|
|
1679
1626
|
|
|
1680
|
-
var css_248z$
|
|
1681
|
-
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);
|
|
1682
1629
|
|
|
1683
|
-
var GoAScrollable = function GoAScrollable(
|
|
1684
|
-
var vertical =
|
|
1685
|
-
horizontal =
|
|
1686
|
-
hPadding =
|
|
1687
|
-
vPadding =
|
|
1688
|
-
height =
|
|
1689
|
-
children =
|
|
1690
|
-
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;
|
|
1691
1638
|
var style = {
|
|
1692
1639
|
overflowY: vertical ? 'auto' : 'hidden',
|
|
1693
1640
|
overflowX: horizontal ? 'auto' : 'hidden',
|
|
1694
1641
|
maxHeight: height !== null && height !== void 0 ? height : '100%',
|
|
1695
|
-
padding:
|
|
1642
|
+
padding: (vPadding !== null && vPadding !== void 0 ? vPadding : 0) + "rem " + (hPadding !== null && hPadding !== void 0 ? hPadding : 0) + "rem"
|
|
1696
1643
|
};
|
|
1697
|
-
return
|
|
1698
|
-
className:
|
|
1644
|
+
return jsxRuntime.jsx("div", __assign({
|
|
1645
|
+
className: 'goa-scrollable',
|
|
1699
1646
|
style: style,
|
|
1700
1647
|
"data-testid": testId
|
|
1701
|
-
},
|
|
1648
|
+
}, {
|
|
1649
|
+
children: children
|
|
1650
|
+
}), void 0);
|
|
1702
1651
|
};
|
|
1703
1652
|
|
|
1704
|
-
var css_248z$
|
|
1705
|
-
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);
|
|
1706
1655
|
|
|
1707
|
-
var css_248z$
|
|
1708
|
-
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);
|
|
1709
1658
|
|
|
1710
|
-
var css_248z$
|
|
1711
|
-
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);
|
|
1712
1661
|
|
|
1713
|
-
var css_248z$
|
|
1714
|
-
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);
|
|
1715
1664
|
|
|
1716
1665
|
var GoADropdownOption = function GoADropdownOption(props) {
|
|
1717
1666
|
var onClick = function onClick() {
|
|
@@ -1720,34 +1669,33 @@
|
|
|
1720
1669
|
}
|
|
1721
1670
|
};
|
|
1722
1671
|
|
|
1723
|
-
return
|
|
1724
|
-
key: props.value,
|
|
1672
|
+
return jsxRuntime.jsx("li", __assign({
|
|
1725
1673
|
style: {
|
|
1726
1674
|
display: props.visible ? 'block' : 'none'
|
|
1727
1675
|
},
|
|
1728
|
-
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 ",
|
|
1729
1677
|
"data-testid": props._testId,
|
|
1730
1678
|
onClick: onClick
|
|
1731
|
-
},
|
|
1679
|
+
}, {
|
|
1680
|
+
children: props.children || props.label
|
|
1681
|
+
}), props.value);
|
|
1732
1682
|
};
|
|
1733
1683
|
|
|
1734
1684
|
var MAX_HEIGHT = 300;
|
|
1735
|
-
var GoADropdown = function GoADropdown(
|
|
1736
|
-
var
|
|
1737
|
-
selectedValues =
|
|
1738
|
-
props =
|
|
1739
|
-
|
|
1740
|
-
var
|
|
1741
|
-
|
|
1742
|
-
|
|
1743
|
-
|
|
1744
|
-
|
|
1745
|
-
|
|
1746
|
-
|
|
1747
|
-
|
|
1748
|
-
|
|
1749
|
-
/**
|
|
1750
|
-
* 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
|
|
1751
1699
|
*/
|
|
1752
1700
|
|
|
1753
1701
|
|
|
@@ -1756,19 +1704,22 @@
|
|
|
1756
1704
|
_setMenuVisibility(isVisible);
|
|
1757
1705
|
}
|
|
1758
1706
|
}
|
|
1759
|
-
/**
|
|
1760
|
-
* Binds the children with additional properties and events
|
|
1707
|
+
/**
|
|
1708
|
+
* Binds the children with additional properties and events
|
|
1761
1709
|
*/
|
|
1762
1710
|
|
|
1763
1711
|
|
|
1764
1712
|
function getChildren() {
|
|
1765
|
-
|
|
1713
|
+
var _filter = filter.toLowerCase();
|
|
1714
|
+
|
|
1715
|
+
return React__default["default"].Children.map(props.children, function (child) {
|
|
1766
1716
|
if (child.props.value) {
|
|
1767
|
-
|
|
1768
|
-
|
|
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,
|
|
1769
1720
|
onClick: handleSelection,
|
|
1770
1721
|
selected: selectedValues.includes(child.props.value),
|
|
1771
|
-
_testId:
|
|
1722
|
+
_testId: props.name + "-dropdown-option--" + child.props.value
|
|
1772
1723
|
}));
|
|
1773
1724
|
}
|
|
1774
1725
|
|
|
@@ -1779,8 +1730,8 @@
|
|
|
1779
1730
|
return child;
|
|
1780
1731
|
});
|
|
1781
1732
|
}
|
|
1782
|
-
/**
|
|
1783
|
-
* 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
|
|
1784
1735
|
*/
|
|
1785
1736
|
|
|
1786
1737
|
|
|
@@ -1793,7 +1744,7 @@
|
|
|
1793
1744
|
return v !== value;
|
|
1794
1745
|
});
|
|
1795
1746
|
} else {
|
|
1796
|
-
values = []
|
|
1747
|
+
values = __spreadArray(__spreadArray([], selectedValues), [value]);
|
|
1797
1748
|
}
|
|
1798
1749
|
} else {
|
|
1799
1750
|
values = selectedValues.includes(value) ? [] : [value];
|
|
@@ -1802,8 +1753,8 @@
|
|
|
1802
1753
|
props.onChange(props.name, values);
|
|
1803
1754
|
toggleMenuVisibility();
|
|
1804
1755
|
}
|
|
1805
|
-
/**
|
|
1806
|
-
* Controls whether the menu is hidden or not when clicked
|
|
1756
|
+
/**
|
|
1757
|
+
* Controls whether the menu is hidden or not when clicked
|
|
1807
1758
|
*/
|
|
1808
1759
|
|
|
1809
1760
|
|
|
@@ -1819,13 +1770,13 @@
|
|
|
1819
1770
|
setFilter('');
|
|
1820
1771
|
}
|
|
1821
1772
|
}
|
|
1822
|
-
/**
|
|
1823
|
-
* Generates a description of the selected options
|
|
1773
|
+
/**
|
|
1774
|
+
* Generates a description of the selected options
|
|
1824
1775
|
*/
|
|
1825
1776
|
|
|
1826
1777
|
|
|
1827
1778
|
function getSelectedLabel() {
|
|
1828
|
-
var selectedLabels = React__default.Children.map(props.children, function (child) {
|
|
1779
|
+
var selectedLabels = React__default["default"].Children.map(props.children, function (child) {
|
|
1829
1780
|
return child;
|
|
1830
1781
|
}).filter(function (child) {
|
|
1831
1782
|
return selectedValues.includes(child.props.value);
|
|
@@ -1834,7 +1785,7 @@
|
|
|
1834
1785
|
});
|
|
1835
1786
|
|
|
1836
1787
|
if (props.multiSelect && selectedLabels.length > 1) {
|
|
1837
|
-
return
|
|
1788
|
+
return selectedLabels.length + " items selected";
|
|
1838
1789
|
}
|
|
1839
1790
|
|
|
1840
1791
|
if (selectedLabels.length === 1) {
|
|
@@ -1844,58 +1795,67 @@
|
|
|
1844
1795
|
return '';
|
|
1845
1796
|
}
|
|
1846
1797
|
|
|
1847
|
-
return
|
|
1798
|
+
return jsxRuntime.jsxs("div", __assign({
|
|
1848
1799
|
className: "goa-dropdown-box"
|
|
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
|
-
|
|
1887
|
-
|
|
1888
|
-
|
|
1889
|
-
|
|
1890
|
-
|
|
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);
|
|
1891
1851
|
};
|
|
1892
1852
|
|
|
1893
|
-
var css_248z$
|
|
1894
|
-
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);
|
|
1895
1855
|
|
|
1896
1856
|
var GoARadio = function GoARadio(props) {
|
|
1897
1857
|
function getCss() {
|
|
1898
|
-
return
|
|
1858
|
+
return classnames__default["default"]({
|
|
1899
1859
|
'goa-radio': true,
|
|
1900
1860
|
'goa-radio--disabled': props.disabled
|
|
1901
1861
|
});
|
|
@@ -1905,30 +1865,34 @@
|
|
|
1905
1865
|
props.onChange(e.target.value);
|
|
1906
1866
|
}
|
|
1907
1867
|
|
|
1908
|
-
return
|
|
1868
|
+
return jsxRuntime.jsxs("label", __assign({
|
|
1909
1869
|
className: getCss()
|
|
1910
|
-
},
|
|
1911
|
-
|
|
1912
|
-
|
|
1913
|
-
|
|
1914
|
-
|
|
1915
|
-
|
|
1916
|
-
|
|
1917
|
-
|
|
1918
|
-
|
|
1919
|
-
|
|
1920
|
-
|
|
1921
|
-
|
|
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);
|
|
1922
1886
|
};
|
|
1923
1887
|
|
|
1924
|
-
var GoARadioGroup = function GoARadioGroup(
|
|
1925
|
-
var name =
|
|
1926
|
-
value =
|
|
1927
|
-
children =
|
|
1928
|
-
|
|
1929
|
-
orientation =
|
|
1930
|
-
onChange =
|
|
1931
|
-
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"]);
|
|
1932
1896
|
|
|
1933
1897
|
function onChangeHandler(value) {
|
|
1934
1898
|
onChange(name, value);
|
|
@@ -1936,11 +1900,11 @@
|
|
|
1936
1900
|
|
|
1937
1901
|
function getChildren() {
|
|
1938
1902
|
return React.Children.map(children, function (child) {
|
|
1939
|
-
var key =
|
|
1903
|
+
var key = name + "-" + child.props.value;
|
|
1940
1904
|
|
|
1941
|
-
var _name =
|
|
1905
|
+
var _name = name + "-" + Date.now();
|
|
1942
1906
|
|
|
1943
|
-
return React__default.cloneElement(child,
|
|
1907
|
+
return /*#__PURE__*/React__default["default"].cloneElement(child, __assign(__assign({}, childAttrs), {
|
|
1944
1908
|
name: _name,
|
|
1945
1909
|
checked: child.props.value === value,
|
|
1946
1910
|
onChange: onChangeHandler,
|
|
@@ -1949,147 +1913,176 @@
|
|
|
1949
1913
|
});
|
|
1950
1914
|
}
|
|
1951
1915
|
|
|
1952
|
-
return
|
|
1953
|
-
className: "goa-radio-group--"
|
|
1954
|
-
},
|
|
1916
|
+
return jsxRuntime.jsx("div", __assign({
|
|
1917
|
+
className: "goa-radio-group--" + orientation
|
|
1918
|
+
}, {
|
|
1919
|
+
children: getChildren()
|
|
1920
|
+
}), void 0);
|
|
1955
1921
|
};
|
|
1956
1922
|
|
|
1957
|
-
var css_248z$
|
|
1958
|
-
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);
|
|
1959
1925
|
|
|
1960
|
-
var GoASkeletonElement = function GoASkeletonElement(
|
|
1961
|
-
var
|
|
1962
|
-
type =
|
|
1963
|
-
var classes = "skeleton "
|
|
1964
|
-
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", {
|
|
1965
1931
|
className: classes
|
|
1966
|
-
});
|
|
1932
|
+
}, void 0);
|
|
1967
1933
|
};
|
|
1968
1934
|
|
|
1969
|
-
var GoASkeletonContent = function GoASkeletonContent(
|
|
1970
|
-
var
|
|
1971
|
-
rows =
|
|
1935
|
+
var GoASkeletonContent = function GoASkeletonContent(_a) {
|
|
1936
|
+
var _b = _a.rows,
|
|
1937
|
+
rows = _b === void 0 ? 1 : _b;
|
|
1972
1938
|
var elements = [];
|
|
1973
1939
|
|
|
1974
1940
|
for (var i = 0; i < rows; i++) {
|
|
1975
|
-
elements.push(
|
|
1941
|
+
elements.push(jsxRuntime.jsx(GoASkeletonElement, {
|
|
1976
1942
|
type: "text"
|
|
1977
|
-
}));
|
|
1943
|
+
}, void 0));
|
|
1978
1944
|
}
|
|
1979
1945
|
|
|
1980
|
-
return
|
|
1946
|
+
return jsxRuntime.jsx("div", __assign({
|
|
1981
1947
|
className: "skeleton-content"
|
|
1982
|
-
},
|
|
1983
|
-
|
|
1984
|
-
|
|
1948
|
+
}, {
|
|
1949
|
+
children: jsxRuntime.jsxs("div", {
|
|
1950
|
+
children: [jsxRuntime.jsx(GoASkeletonElement, {
|
|
1951
|
+
type: "title"
|
|
1952
|
+
}, void 0), elements]
|
|
1953
|
+
}, void 0)
|
|
1954
|
+
}), void 0);
|
|
1985
1955
|
};
|
|
1986
1956
|
|
|
1987
|
-
var GoASkeletonGridColumnContent = function GoASkeletonGridColumnContent(
|
|
1988
|
-
var
|
|
1989
|
-
rows =
|
|
1957
|
+
var GoASkeletonGridColumnContent = function GoASkeletonGridColumnContent(_a) {
|
|
1958
|
+
var _b = _a.rows,
|
|
1959
|
+
rows = _b === void 0 ? 1 : _b;
|
|
1990
1960
|
var elements = [];
|
|
1991
1961
|
|
|
1992
1962
|
for (var i = 0; i < rows; i++) {
|
|
1993
|
-
elements.push(
|
|
1963
|
+
elements.push(jsxRuntime.jsx(GoASkeletonElement, {
|
|
1994
1964
|
type: "text"
|
|
1995
|
-
}));
|
|
1965
|
+
}, void 0));
|
|
1996
1966
|
}
|
|
1997
1967
|
|
|
1998
|
-
return
|
|
1968
|
+
return jsxRuntime.jsx("div", __assign({
|
|
1999
1969
|
className: "skeleton-content"
|
|
2000
|
-
},
|
|
1970
|
+
}, {
|
|
1971
|
+
children: jsxRuntime.jsx("div", {
|
|
1972
|
+
children: elements
|
|
1973
|
+
}, void 0)
|
|
1974
|
+
}), void 0);
|
|
2001
1975
|
};
|
|
2002
1976
|
|
|
2003
|
-
var GoASkeletonImageContent = function GoASkeletonImageContent(
|
|
2004
|
-
var
|
|
2005
|
-
rows =
|
|
1977
|
+
var GoASkeletonImageContent = function GoASkeletonImageContent(_a) {
|
|
1978
|
+
var _b = _a.rows,
|
|
1979
|
+
rows = _b === void 0 ? 1 : _b;
|
|
2006
1980
|
var elements = [];
|
|
2007
1981
|
|
|
2008
1982
|
for (var i = 0; i < rows; i++) {
|
|
2009
|
-
elements.push(
|
|
1983
|
+
elements.push(jsxRuntime.jsx(GoASkeletonElement, {
|
|
2010
1984
|
type: "text"
|
|
2011
|
-
}));
|
|
1985
|
+
}, void 0));
|
|
2012
1986
|
}
|
|
2013
1987
|
|
|
2014
|
-
return
|
|
1988
|
+
return jsxRuntime.jsxs("div", __assign({
|
|
2015
1989
|
className: "skeleton-image-content"
|
|
2016
|
-
},
|
|
2017
|
-
|
|
2018
|
-
|
|
2019
|
-
|
|
2020
|
-
|
|
2021
|
-
|
|
2022
|
-
|
|
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);
|
|
2023
2001
|
};
|
|
2024
2002
|
|
|
2025
|
-
var css_248z$
|
|
2026
|
-
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);
|
|
2027
2005
|
|
|
2028
|
-
var GoACard = function GoACard(
|
|
2029
|
-
var title =
|
|
2030
|
-
content =
|
|
2031
|
-
|
|
2032
|
-
description =
|
|
2033
|
-
|
|
2034
|
-
cardImageUrl =
|
|
2035
|
-
|
|
2036
|
-
titleUrl =
|
|
2037
|
-
|
|
2038
|
-
children =
|
|
2039
|
-
|
|
2040
|
-
minWidth =
|
|
2041
|
-
|
|
2042
|
-
maxWidth =
|
|
2043
|
-
other =
|
|
2044
|
-
|
|
2045
|
-
var
|
|
2046
|
-
|
|
2047
|
-
|
|
2048
|
-
|
|
2049
|
-
|
|
2050
|
-
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({
|
|
2051
2028
|
className: "goa-card",
|
|
2052
|
-
"data-testid":
|
|
2029
|
+
"data-testid": 'card-container',
|
|
2053
2030
|
style: {
|
|
2054
2031
|
minWidth: minWidth,
|
|
2055
2032
|
maxWidth: maxWidth
|
|
2056
2033
|
}
|
|
2057
|
-
}, other
|
|
2058
|
-
|
|
2059
|
-
|
|
2060
|
-
|
|
2061
|
-
|
|
2062
|
-
|
|
2063
|
-
|
|
2064
|
-
|
|
2065
|
-
|
|
2066
|
-
|
|
2067
|
-
|
|
2068
|
-
|
|
2069
|
-
|
|
2070
|
-
|
|
2071
|
-
|
|
2072
|
-
|
|
2073
|
-
|
|
2074
|
-
|
|
2075
|
-
|
|
2076
|
-
|
|
2077
|
-
|
|
2078
|
-
|
|
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);
|
|
2079
2072
|
};
|
|
2080
2073
|
|
|
2081
|
-
var css_248z$
|
|
2082
|
-
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);
|
|
2083
2076
|
|
|
2084
|
-
var GoACardGroup = function GoACardGroup(
|
|
2085
|
-
var
|
|
2086
|
-
title =
|
|
2087
|
-
|
|
2088
|
-
children =
|
|
2089
|
-
|
|
2090
|
-
layout =
|
|
2091
|
-
|
|
2092
|
-
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;
|
|
2093
2086
|
|
|
2094
2087
|
function getCards() {
|
|
2095
2088
|
if (children) {
|
|
@@ -2097,108 +2090,122 @@
|
|
|
2097
2090
|
}
|
|
2098
2091
|
|
|
2099
2092
|
return cardItems.map(function (item, index) {
|
|
2100
|
-
return /*#__PURE__*/
|
|
2093
|
+
return /*#__PURE__*/React.createElement(GoACard, __assign({}, item, {
|
|
2101
2094
|
key: index
|
|
2102
2095
|
}), item.children);
|
|
2103
2096
|
});
|
|
2104
2097
|
}
|
|
2105
2098
|
|
|
2106
|
-
return
|
|
2099
|
+
return jsxRuntime.jsxs("div", __assign({
|
|
2107
2100
|
className: "goa-card-group"
|
|
2108
|
-
},
|
|
2109
|
-
|
|
2110
|
-
|
|
2111
|
-
|
|
2112
|
-
|
|
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);
|
|
2113
2112
|
};
|
|
2114
2113
|
|
|
2115
|
-
var css_248z$
|
|
2116
|
-
styleInject(css_248z$
|
|
2117
|
-
|
|
2118
|
-
/* 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);
|
|
2119
2116
|
|
|
2120
|
-
var GoACheckbox = function GoACheckbox(
|
|
2121
|
-
var name =
|
|
2122
|
-
checked =
|
|
2123
|
-
disabled =
|
|
2124
|
-
indeterminate =
|
|
2125
|
-
|
|
2126
|
-
value =
|
|
2127
|
-
content =
|
|
2128
|
-
children =
|
|
2129
|
-
|
|
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;
|
|
2130
2127
|
|
|
2131
2128
|
var rootCss = function rootCss() {
|
|
2132
|
-
return
|
|
2129
|
+
return classnames__default["default"]({
|
|
2133
2130
|
'goa-checkbox': true,
|
|
2134
2131
|
'goa-checkbox--disabled': disabled
|
|
2135
2132
|
});
|
|
2136
2133
|
};
|
|
2137
2134
|
|
|
2138
2135
|
var checkboxCss = function checkboxCss() {
|
|
2139
|
-
return
|
|
2136
|
+
return classnames__default["default"]({
|
|
2140
2137
|
'goa-checkbox-container': true,
|
|
2141
2138
|
'goa-checkbox--selected': checked
|
|
2142
2139
|
});
|
|
2143
2140
|
};
|
|
2144
2141
|
|
|
2145
|
-
return
|
|
2142
|
+
return jsxRuntime.jsxs("label", __assign({
|
|
2146
2143
|
className: rootCss()
|
|
2147
|
-
},
|
|
2148
|
-
|
|
2149
|
-
|
|
2150
|
-
|
|
2151
|
-
|
|
2152
|
-
|
|
2153
|
-
|
|
2154
|
-
|
|
2155
|
-
|
|
2156
|
-
|
|
2157
|
-
|
|
2158
|
-
|
|
2159
|
-
|
|
2160
|
-
|
|
2161
|
-
|
|
2162
|
-
|
|
2163
|
-
|
|
2164
|
-
|
|
2165
|
-
|
|
2166
|
-
|
|
2167
|
-
|
|
2168
|
-
|
|
2169
|
-
|
|
2170
|
-
|
|
2171
|
-
|
|
2172
|
-
|
|
2173
|
-
|
|
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);
|
|
2174
2181
|
};
|
|
2175
2182
|
|
|
2176
|
-
var css_248z$
|
|
2177
|
-
styleInject(css_248z$
|
|
2178
|
-
|
|
2179
|
-
var GoAPageLoader = function GoAPageLoader(_ref) {
|
|
2180
|
-
var _ref$type = _ref.type,
|
|
2181
|
-
type = _ref$type === void 0 ? 'infinite' : _ref$type,
|
|
2182
|
-
_ref$visible = _ref.visible,
|
|
2183
|
-
visible = _ref$visible === void 0 ? false : _ref$visible,
|
|
2184
|
-
_ref$message = _ref.message,
|
|
2185
|
-
message = _ref$message === void 0 ? 'Loading...' : _ref$message,
|
|
2186
|
-
_ref$value = _ref.value,
|
|
2187
|
-
value = _ref$value === void 0 ? 0 : _ref$value,
|
|
2188
|
-
_ref$pagelock = _ref.pagelock,
|
|
2189
|
-
pagelock = _ref$pagelock === void 0 ? true : _ref$pagelock,
|
|
2190
|
-
_ref$displayType = _ref.displayType,
|
|
2191
|
-
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);
|
|
2192
2185
|
|
|
2193
|
-
|
|
2194
|
-
|
|
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
|
|
2195
2201
|
*/
|
|
2202
|
+
|
|
2196
2203
|
var progressMaxValue = 283;
|
|
2197
2204
|
var strokeDashoffset = 0;
|
|
2198
|
-
/**
|
|
2199
|
-
* Sets the progress if in progress mode.
|
|
2200
|
-
* @param progress
|
|
2201
|
-
* @returns
|
|
2205
|
+
/**
|
|
2206
|
+
* Sets the progress if in progress mode.
|
|
2207
|
+
* @param progress
|
|
2208
|
+
* @returns
|
|
2202
2209
|
*/
|
|
2203
2210
|
|
|
2204
2211
|
function setProgress(progress) {
|
|
@@ -2232,32 +2239,38 @@
|
|
|
2232
2239
|
setProgress(value);
|
|
2233
2240
|
}
|
|
2234
2241
|
|
|
2235
|
-
return
|
|
2236
|
-
className: "progress-container--"
|
|
2237
|
-
onKeyDown: function
|
|
2242
|
+
return jsxRuntime.jsxs("div", __assign({
|
|
2243
|
+
className: "progress-container--" + displayType,
|
|
2244
|
+
onKeyDown: function (event) {
|
|
2238
2245
|
event.preventDefault();
|
|
2239
2246
|
}
|
|
2240
|
-
},
|
|
2241
|
-
|
|
2242
|
-
|
|
2243
|
-
|
|
2244
|
-
|
|
2245
|
-
|
|
2246
|
-
|
|
2247
|
-
|
|
2248
|
-
|
|
2249
|
-
|
|
2250
|
-
|
|
2251
|
-
|
|
2252
|
-
|
|
2253
|
-
|
|
2254
|
-
|
|
2255
|
-
|
|
2256
|
-
|
|
2257
|
-
|
|
2258
|
-
|
|
2259
|
-
|
|
2260
|
-
|
|
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);
|
|
2261
2274
|
} else {
|
|
2262
2275
|
document.body.style.removeProperty('height');
|
|
2263
2276
|
document.body.style.removeProperty('overflow');
|
|
@@ -2265,40 +2278,43 @@
|
|
|
2265
2278
|
}
|
|
2266
2279
|
};
|
|
2267
2280
|
GoAPageLoader.propTypes = {
|
|
2268
|
-
visible:
|
|
2269
|
-
message:
|
|
2270
|
-
value:
|
|
2271
|
-
type:
|
|
2272
|
-
pagelock:
|
|
2273
|
-
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
|
|
2274
2287
|
};
|
|
2275
2288
|
|
|
2276
|
-
var css_248z
|
|
2277
|
-
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);
|
|
2278
2291
|
|
|
2279
|
-
var GoAElementLoader = function GoAElementLoader(
|
|
2280
|
-
var
|
|
2281
|
-
visible =
|
|
2282
|
-
|
|
2283
|
-
baseColour =
|
|
2284
|
-
|
|
2285
|
-
spinnerColour =
|
|
2286
|
-
|
|
2287
|
-
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;
|
|
2288
2301
|
var radius = size === 'small' ? 16 : 18;
|
|
2289
2302
|
var diameter = radius * 2;
|
|
2290
|
-
var boxView = "0 0 "
|
|
2291
|
-
/**
|
|
2292
|
-
* Generates the value for an SVG arc.
|
|
2293
|
-
* @param current Current value.
|
|
2294
|
-
* @param total Maximum value.
|
|
2295
|
-
* @param pathRadius Radius of the SVG path.
|
|
2296
|
-
* @param elementRadius Radius of the SVG container.
|
|
2297
|
-
* @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.
|
|
2298
2311
|
*/
|
|
2299
2312
|
|
|
2300
|
-
function getArc(current, total, pathRadius, elementRadius) {
|
|
2301
|
-
|
|
2313
|
+
function getArc(current, total, pathRadius, elementRadius, isSemicircle) {
|
|
2314
|
+
if (isSemicircle === void 0) {
|
|
2315
|
+
isSemicircle = false;
|
|
2316
|
+
}
|
|
2317
|
+
|
|
2302
2318
|
var value = Math.max(0, Math.min(current || 0, total));
|
|
2303
2319
|
var maxAngle = isSemicircle ? 180 : 359.9999;
|
|
2304
2320
|
var percentage = total === 0 ? maxAngle : value / total * maxAngle;
|
|
@@ -2308,15 +2324,15 @@
|
|
|
2308
2324
|
var end = _polarToCartesian(elementRadius, pathRadius, 0);
|
|
2309
2325
|
|
|
2310
2326
|
var arcSweep = percentage <= 180 ? 0 : 1;
|
|
2311
|
-
return "M "
|
|
2327
|
+
return "M " + start + " A " + pathRadius + " " + pathRadius + " 0 " + arcSweep + " 0 " + end;
|
|
2312
2328
|
}
|
|
2313
2329
|
|
|
2314
2330
|
var DEGREE_IN_RADIANS = Math.PI / 180;
|
|
2315
|
-
/**
|
|
2316
|
-
* Converts polar cooradinates to Cartesian.
|
|
2317
|
-
* @param elementRadius Radius of the wrapper element.
|
|
2318
|
-
* @param pathRadius Radius of the path being described.
|
|
2319
|
-
* @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.
|
|
2320
2336
|
*/
|
|
2321
2337
|
|
|
2322
2338
|
function _polarToCartesian(elementRadius, pathRadius, angleInDegrees) {
|
|
@@ -2326,25 +2342,27 @@
|
|
|
2326
2342
|
return x + ' ' + y;
|
|
2327
2343
|
}
|
|
2328
2344
|
|
|
2329
|
-
return visible &&
|
|
2345
|
+
return visible && jsxRuntime.jsxs("svg", __assign({
|
|
2330
2346
|
className: "circular-loader",
|
|
2331
2347
|
fill: "none",
|
|
2332
2348
|
viewBox: boxView,
|
|
2333
2349
|
width: radius,
|
|
2334
2350
|
height: radius,
|
|
2335
2351
|
xmlns: "http://www.w3.org/2000/svg"
|
|
2336
|
-
},
|
|
2337
|
-
|
|
2338
|
-
|
|
2339
|
-
|
|
2340
|
-
|
|
2341
|
-
|
|
2342
|
-
|
|
2343
|
-
|
|
2344
|
-
|
|
2345
|
-
|
|
2346
|
-
|
|
2347
|
-
|
|
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);
|
|
2348
2366
|
};
|
|
2349
2367
|
|
|
2350
2368
|
exports.GoAButton = GoAButton;
|
|
@@ -2370,4 +2388,4 @@
|
|
|
2370
2388
|
|
|
2371
2389
|
Object.defineProperty(exports, '__esModule', { value: true });
|
|
2372
2390
|
|
|
2373
|
-
}))
|
|
2391
|
+
}));
|