@abgov/react-components 3.4.0-beta.63 → 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 +0 -0
- package/experimental/{experimental/icons → icons}/index.d.ts +0 -0
- package/experimental/{experimental/index.d.ts → index.d.ts} +0 -0
- package/experimental/{experimental/input → input}/input.component.d.ts +1 -1
- package/experimental/{experimental/modal → modal}/modal.component.d.ts +0 -0
- package/experimental/package.json +1 -1
- package/experimental/react-components.esm.js +552 -614
- package/experimental/react-components.umd.js +879 -910
- 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/package.json +4 -3
- package/react-components.esm.js +934 -992
- package/react-components.umd.js +946 -936
- 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,144 +1513,154 @@
|
|
|
1582
1513
|
}
|
|
1583
1514
|
}
|
|
1584
1515
|
|
|
1585
|
-
function GoAIconButton(
|
|
1586
|
-
var type =
|
|
1587
|
-
disabled =
|
|
1588
|
-
|
|
1589
|
-
variant =
|
|
1590
|
-
onClick =
|
|
1591
|
-
|
|
1592
|
-
size =
|
|
1593
|
-
title =
|
|
1594
|
-
testId =
|
|
1595
|
-
return
|
|
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({
|
|
1596
1527
|
title: title,
|
|
1597
1528
|
disabled: disabled,
|
|
1598
|
-
className: "goa-icon-button goa-icon-button-"
|
|
1529
|
+
className: "goa-icon-button goa-icon-button-" + variant,
|
|
1599
1530
|
"data-testid": testId,
|
|
1600
1531
|
onClick: onClick
|
|
1601
|
-
},
|
|
1602
|
-
|
|
1603
|
-
|
|
1604
|
-
|
|
1532
|
+
}, {
|
|
1533
|
+
children: jsxRuntime.jsx(GoAIcon, {
|
|
1534
|
+
type: type,
|
|
1535
|
+
size: size
|
|
1536
|
+
}, void 0)
|
|
1537
|
+
}), void 0);
|
|
1605
1538
|
}
|
|
1606
1539
|
|
|
1607
|
-
var css_248z$
|
|
1608
|
-
styleInject(css_248z$
|
|
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);
|
|
1609
1542
|
|
|
1610
|
-
var css_248z$
|
|
1611
|
-
styleInject(css_248z$
|
|
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}";
|
|
1544
|
+
styleInject(css_248z$g);
|
|
1612
1545
|
|
|
1613
|
-
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)
|
|
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}";
|
|
1614
1547
|
styleInject(css_248z$f);
|
|
1615
1548
|
|
|
1616
|
-
var css_248z$
|
|
1617
|
-
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);
|
|
1618
1551
|
|
|
1619
|
-
var css_248z$
|
|
1620
|
-
styleInject(css_248z$
|
|
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);
|
|
1621
1554
|
|
|
1622
|
-
var css_248z$
|
|
1623
|
-
styleInject(css_248z$
|
|
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);
|
|
1624
1557
|
|
|
1625
|
-
var GoAInput = function GoAInput(
|
|
1626
|
-
var
|
|
1627
|
-
|
|
1628
|
-
var name =
|
|
1629
|
-
onTrailingIconClick =
|
|
1630
|
-
|
|
1631
|
-
leadingIcon =
|
|
1632
|
-
trailingIcon =
|
|
1633
|
-
|
|
1634
|
-
variant =
|
|
1635
|
-
focused =
|
|
1636
|
-
disabled =
|
|
1637
|
-
readonly =
|
|
1638
|
-
other =
|
|
1639
|
-
|
|
1640
|
-
var inputRef = React__default.useRef(null);
|
|
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);
|
|
1641
1574
|
React.useEffect(function () {
|
|
1642
|
-
|
|
1643
|
-
var _inputRef$current;
|
|
1575
|
+
var _a, _b;
|
|
1644
1576
|
|
|
1645
|
-
|
|
1577
|
+
if (focused) {
|
|
1578
|
+
(_a = inputRef.current) === null || _a === void 0 ? void 0 : _a.focus();
|
|
1646
1579
|
} else {
|
|
1647
|
-
|
|
1648
|
-
|
|
1649
|
-
(_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();
|
|
1650
1581
|
}
|
|
1651
1582
|
}, [focused, inputRef]);
|
|
1652
|
-
var rootCss =
|
|
1583
|
+
var rootCss = classnames__default["default"]({
|
|
1653
1584
|
'goa-input': true,
|
|
1654
1585
|
'goa-input--disabled': disabled
|
|
1655
1586
|
});
|
|
1656
|
-
return
|
|
1587
|
+
return jsxRuntime.jsxs("div", __assign({
|
|
1657
1588
|
className: rootCss
|
|
1658
|
-
},
|
|
1659
|
-
|
|
1660
|
-
|
|
1661
|
-
|
|
1662
|
-
|
|
1663
|
-
|
|
1664
|
-
|
|
1665
|
-
|
|
1666
|
-
|
|
1667
|
-
|
|
1668
|
-
|
|
1669
|
-
|
|
1670
|
-
|
|
1671
|
-
|
|
1672
|
-
|
|
1673
|
-
|
|
1674
|
-
|
|
1675
|
-
|
|
1676
|
-
|
|
1677
|
-
|
|
1678
|
-
|
|
1679
|
-
|
|
1680
|
-
|
|
1681
|
-
|
|
1682
|
-
|
|
1683
|
-
|
|
1684
|
-
|
|
1685
|
-
|
|
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);
|
|
1686
1625
|
};
|
|
1687
1626
|
|
|
1688
|
-
var css_248z$
|
|
1689
|
-
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);
|
|
1690
1629
|
|
|
1691
|
-
var GoAScrollable = function GoAScrollable(
|
|
1692
|
-
var vertical =
|
|
1693
|
-
horizontal =
|
|
1694
|
-
hPadding =
|
|
1695
|
-
vPadding =
|
|
1696
|
-
height =
|
|
1697
|
-
children =
|
|
1698
|
-
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;
|
|
1699
1638
|
var style = {
|
|
1700
1639
|
overflowY: vertical ? 'auto' : 'hidden',
|
|
1701
1640
|
overflowX: horizontal ? 'auto' : 'hidden',
|
|
1702
1641
|
maxHeight: height !== null && height !== void 0 ? height : '100%',
|
|
1703
|
-
padding:
|
|
1642
|
+
padding: (vPadding !== null && vPadding !== void 0 ? vPadding : 0) + "rem " + (hPadding !== null && hPadding !== void 0 ? hPadding : 0) + "rem"
|
|
1704
1643
|
};
|
|
1705
|
-
return
|
|
1706
|
-
className:
|
|
1644
|
+
return jsxRuntime.jsx("div", __assign({
|
|
1645
|
+
className: 'goa-scrollable',
|
|
1707
1646
|
style: style,
|
|
1708
1647
|
"data-testid": testId
|
|
1709
|
-
},
|
|
1648
|
+
}, {
|
|
1649
|
+
children: children
|
|
1650
|
+
}), void 0);
|
|
1710
1651
|
};
|
|
1711
1652
|
|
|
1712
|
-
var css_248z$
|
|
1713
|
-
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);
|
|
1714
1655
|
|
|
1715
|
-
var css_248z$
|
|
1716
|
-
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);
|
|
1717
1658
|
|
|
1718
|
-
var css_248z$
|
|
1719
|
-
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);
|
|
1720
1661
|
|
|
1721
|
-
var css_248z$
|
|
1722
|
-
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);
|
|
1723
1664
|
|
|
1724
1665
|
var GoADropdownOption = function GoADropdownOption(props) {
|
|
1725
1666
|
var onClick = function onClick() {
|
|
@@ -1728,34 +1669,33 @@
|
|
|
1728
1669
|
}
|
|
1729
1670
|
};
|
|
1730
1671
|
|
|
1731
|
-
return
|
|
1732
|
-
key: props.value,
|
|
1672
|
+
return jsxRuntime.jsx("li", __assign({
|
|
1733
1673
|
style: {
|
|
1734
1674
|
display: props.visible ? 'block' : 'none'
|
|
1735
1675
|
},
|
|
1736
|
-
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 ",
|
|
1737
1677
|
"data-testid": props._testId,
|
|
1738
1678
|
onClick: onClick
|
|
1739
|
-
},
|
|
1679
|
+
}, {
|
|
1680
|
+
children: props.children || props.label
|
|
1681
|
+
}), props.value);
|
|
1740
1682
|
};
|
|
1741
1683
|
|
|
1742
1684
|
var MAX_HEIGHT = 300;
|
|
1743
|
-
var GoADropdown = function GoADropdown(
|
|
1744
|
-
var
|
|
1745
|
-
selectedValues =
|
|
1746
|
-
props =
|
|
1747
|
-
|
|
1748
|
-
var
|
|
1749
|
-
|
|
1750
|
-
|
|
1751
|
-
|
|
1752
|
-
|
|
1753
|
-
|
|
1754
|
-
|
|
1755
|
-
|
|
1756
|
-
|
|
1757
|
-
/**
|
|
1758
|
-
* 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
|
|
1759
1699
|
*/
|
|
1760
1700
|
|
|
1761
1701
|
|
|
@@ -1764,22 +1704,22 @@
|
|
|
1764
1704
|
_setMenuVisibility(isVisible);
|
|
1765
1705
|
}
|
|
1766
1706
|
}
|
|
1767
|
-
/**
|
|
1768
|
-
* Binds the children with additional properties and events
|
|
1707
|
+
/**
|
|
1708
|
+
* Binds the children with additional properties and events
|
|
1769
1709
|
*/
|
|
1770
1710
|
|
|
1771
1711
|
|
|
1772
1712
|
function getChildren() {
|
|
1773
1713
|
var _filter = filter.toLowerCase();
|
|
1774
1714
|
|
|
1775
|
-
return React__default.Children.map(props.children, function (child) {
|
|
1715
|
+
return React__default["default"].Children.map(props.children, function (child) {
|
|
1776
1716
|
if (child.props.value) {
|
|
1777
1717
|
var visible = !_filter || child.props.value.toLowerCase().includes(_filter) || child.props.label.toLowerCase().includes(_filter);
|
|
1778
|
-
return React__default.cloneElement(child,
|
|
1718
|
+
return /*#__PURE__*/React__default["default"].cloneElement(child, __assign(__assign({}, child.props), {
|
|
1779
1719
|
visible: visible,
|
|
1780
1720
|
onClick: handleSelection,
|
|
1781
1721
|
selected: selectedValues.includes(child.props.value),
|
|
1782
|
-
_testId:
|
|
1722
|
+
_testId: props.name + "-dropdown-option--" + child.props.value
|
|
1783
1723
|
}));
|
|
1784
1724
|
}
|
|
1785
1725
|
|
|
@@ -1790,8 +1730,8 @@
|
|
|
1790
1730
|
return child;
|
|
1791
1731
|
});
|
|
1792
1732
|
}
|
|
1793
|
-
/**
|
|
1794
|
-
* 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
|
|
1795
1735
|
*/
|
|
1796
1736
|
|
|
1797
1737
|
|
|
@@ -1804,7 +1744,7 @@
|
|
|
1804
1744
|
return v !== value;
|
|
1805
1745
|
});
|
|
1806
1746
|
} else {
|
|
1807
|
-
values = []
|
|
1747
|
+
values = __spreadArray(__spreadArray([], selectedValues), [value]);
|
|
1808
1748
|
}
|
|
1809
1749
|
} else {
|
|
1810
1750
|
values = selectedValues.includes(value) ? [] : [value];
|
|
@@ -1813,8 +1753,8 @@
|
|
|
1813
1753
|
props.onChange(props.name, values);
|
|
1814
1754
|
toggleMenuVisibility();
|
|
1815
1755
|
}
|
|
1816
|
-
/**
|
|
1817
|
-
* Controls whether the menu is hidden or not when clicked
|
|
1756
|
+
/**
|
|
1757
|
+
* Controls whether the menu is hidden or not when clicked
|
|
1818
1758
|
*/
|
|
1819
1759
|
|
|
1820
1760
|
|
|
@@ -1830,13 +1770,13 @@
|
|
|
1830
1770
|
setFilter('');
|
|
1831
1771
|
}
|
|
1832
1772
|
}
|
|
1833
|
-
/**
|
|
1834
|
-
* Generates a description of the selected options
|
|
1773
|
+
/**
|
|
1774
|
+
* Generates a description of the selected options
|
|
1835
1775
|
*/
|
|
1836
1776
|
|
|
1837
1777
|
|
|
1838
1778
|
function getSelectedLabel() {
|
|
1839
|
-
var selectedLabels = React__default.Children.map(props.children, function (child) {
|
|
1779
|
+
var selectedLabels = React__default["default"].Children.map(props.children, function (child) {
|
|
1840
1780
|
return child;
|
|
1841
1781
|
}).filter(function (child) {
|
|
1842
1782
|
return selectedValues.includes(child.props.value);
|
|
@@ -1845,7 +1785,7 @@
|
|
|
1845
1785
|
});
|
|
1846
1786
|
|
|
1847
1787
|
if (props.multiSelect && selectedLabels.length > 1) {
|
|
1848
|
-
return
|
|
1788
|
+
return selectedLabels.length + " items selected";
|
|
1849
1789
|
}
|
|
1850
1790
|
|
|
1851
1791
|
if (selectedLabels.length === 1) {
|
|
@@ -1855,55 +1795,67 @@
|
|
|
1855
1795
|
return '';
|
|
1856
1796
|
}
|
|
1857
1797
|
|
|
1858
|
-
return
|
|
1798
|
+
return jsxRuntime.jsxs("div", __assign({
|
|
1859
1799
|
className: "goa-dropdown-box"
|
|
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
|
-
|
|
1891
|
-
|
|
1892
|
-
|
|
1893
|
-
|
|
1894
|
-
|
|
1895
|
-
|
|
1896
|
-
|
|
1897
|
-
|
|
1898
|
-
|
|
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);
|
|
1899
1851
|
};
|
|
1900
1852
|
|
|
1901
|
-
var css_248z$
|
|
1902
|
-
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);
|
|
1903
1855
|
|
|
1904
1856
|
var GoARadio = function GoARadio(props) {
|
|
1905
1857
|
function getCss() {
|
|
1906
|
-
return
|
|
1858
|
+
return classnames__default["default"]({
|
|
1907
1859
|
'goa-radio': true,
|
|
1908
1860
|
'goa-radio--disabled': props.disabled
|
|
1909
1861
|
});
|
|
@@ -1913,30 +1865,34 @@
|
|
|
1913
1865
|
props.onChange(e.target.value);
|
|
1914
1866
|
}
|
|
1915
1867
|
|
|
1916
|
-
return
|
|
1868
|
+
return jsxRuntime.jsxs("label", __assign({
|
|
1917
1869
|
className: getCss()
|
|
1918
|
-
},
|
|
1919
|
-
|
|
1920
|
-
|
|
1921
|
-
|
|
1922
|
-
|
|
1923
|
-
|
|
1924
|
-
|
|
1925
|
-
|
|
1926
|
-
|
|
1927
|
-
|
|
1928
|
-
|
|
1929
|
-
|
|
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);
|
|
1930
1886
|
};
|
|
1931
1887
|
|
|
1932
|
-
var GoARadioGroup = function GoARadioGroup(
|
|
1933
|
-
var name =
|
|
1934
|
-
value =
|
|
1935
|
-
children =
|
|
1936
|
-
|
|
1937
|
-
orientation =
|
|
1938
|
-
onChange =
|
|
1939
|
-
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"]);
|
|
1940
1896
|
|
|
1941
1897
|
function onChangeHandler(value) {
|
|
1942
1898
|
onChange(name, value);
|
|
@@ -1944,11 +1900,11 @@
|
|
|
1944
1900
|
|
|
1945
1901
|
function getChildren() {
|
|
1946
1902
|
return React.Children.map(children, function (child) {
|
|
1947
|
-
var key =
|
|
1903
|
+
var key = name + "-" + child.props.value;
|
|
1948
1904
|
|
|
1949
|
-
var _name =
|
|
1905
|
+
var _name = name + "-" + Date.now();
|
|
1950
1906
|
|
|
1951
|
-
return React__default.cloneElement(child,
|
|
1907
|
+
return /*#__PURE__*/React__default["default"].cloneElement(child, __assign(__assign({}, childAttrs), {
|
|
1952
1908
|
name: _name,
|
|
1953
1909
|
checked: child.props.value === value,
|
|
1954
1910
|
onChange: onChangeHandler,
|
|
@@ -1957,147 +1913,176 @@
|
|
|
1957
1913
|
});
|
|
1958
1914
|
}
|
|
1959
1915
|
|
|
1960
|
-
return
|
|
1961
|
-
className: "goa-radio-group--"
|
|
1962
|
-
},
|
|
1916
|
+
return jsxRuntime.jsx("div", __assign({
|
|
1917
|
+
className: "goa-radio-group--" + orientation
|
|
1918
|
+
}, {
|
|
1919
|
+
children: getChildren()
|
|
1920
|
+
}), void 0);
|
|
1963
1921
|
};
|
|
1964
1922
|
|
|
1965
|
-
var css_248z$
|
|
1966
|
-
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);
|
|
1967
1925
|
|
|
1968
|
-
var GoASkeletonElement = function GoASkeletonElement(
|
|
1969
|
-
var
|
|
1970
|
-
type =
|
|
1971
|
-
var classes = "skeleton "
|
|
1972
|
-
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", {
|
|
1973
1931
|
className: classes
|
|
1974
|
-
});
|
|
1932
|
+
}, void 0);
|
|
1975
1933
|
};
|
|
1976
1934
|
|
|
1977
|
-
var GoASkeletonContent = function GoASkeletonContent(
|
|
1978
|
-
var
|
|
1979
|
-
rows =
|
|
1935
|
+
var GoASkeletonContent = function GoASkeletonContent(_a) {
|
|
1936
|
+
var _b = _a.rows,
|
|
1937
|
+
rows = _b === void 0 ? 1 : _b;
|
|
1980
1938
|
var elements = [];
|
|
1981
1939
|
|
|
1982
1940
|
for (var i = 0; i < rows; i++) {
|
|
1983
|
-
elements.push(
|
|
1941
|
+
elements.push(jsxRuntime.jsx(GoASkeletonElement, {
|
|
1984
1942
|
type: "text"
|
|
1985
|
-
}));
|
|
1943
|
+
}, void 0));
|
|
1986
1944
|
}
|
|
1987
1945
|
|
|
1988
|
-
return
|
|
1946
|
+
return jsxRuntime.jsx("div", __assign({
|
|
1989
1947
|
className: "skeleton-content"
|
|
1990
|
-
},
|
|
1991
|
-
|
|
1992
|
-
|
|
1948
|
+
}, {
|
|
1949
|
+
children: jsxRuntime.jsxs("div", {
|
|
1950
|
+
children: [jsxRuntime.jsx(GoASkeletonElement, {
|
|
1951
|
+
type: "title"
|
|
1952
|
+
}, void 0), elements]
|
|
1953
|
+
}, void 0)
|
|
1954
|
+
}), void 0);
|
|
1993
1955
|
};
|
|
1994
1956
|
|
|
1995
|
-
var GoASkeletonGridColumnContent = function GoASkeletonGridColumnContent(
|
|
1996
|
-
var
|
|
1997
|
-
rows =
|
|
1957
|
+
var GoASkeletonGridColumnContent = function GoASkeletonGridColumnContent(_a) {
|
|
1958
|
+
var _b = _a.rows,
|
|
1959
|
+
rows = _b === void 0 ? 1 : _b;
|
|
1998
1960
|
var elements = [];
|
|
1999
1961
|
|
|
2000
1962
|
for (var i = 0; i < rows; i++) {
|
|
2001
|
-
elements.push(
|
|
1963
|
+
elements.push(jsxRuntime.jsx(GoASkeletonElement, {
|
|
2002
1964
|
type: "text"
|
|
2003
|
-
}));
|
|
1965
|
+
}, void 0));
|
|
2004
1966
|
}
|
|
2005
1967
|
|
|
2006
|
-
return
|
|
1968
|
+
return jsxRuntime.jsx("div", __assign({
|
|
2007
1969
|
className: "skeleton-content"
|
|
2008
|
-
},
|
|
1970
|
+
}, {
|
|
1971
|
+
children: jsxRuntime.jsx("div", {
|
|
1972
|
+
children: elements
|
|
1973
|
+
}, void 0)
|
|
1974
|
+
}), void 0);
|
|
2009
1975
|
};
|
|
2010
1976
|
|
|
2011
|
-
var GoASkeletonImageContent = function GoASkeletonImageContent(
|
|
2012
|
-
var
|
|
2013
|
-
rows =
|
|
1977
|
+
var GoASkeletonImageContent = function GoASkeletonImageContent(_a) {
|
|
1978
|
+
var _b = _a.rows,
|
|
1979
|
+
rows = _b === void 0 ? 1 : _b;
|
|
2014
1980
|
var elements = [];
|
|
2015
1981
|
|
|
2016
1982
|
for (var i = 0; i < rows; i++) {
|
|
2017
|
-
elements.push(
|
|
1983
|
+
elements.push(jsxRuntime.jsx(GoASkeletonElement, {
|
|
2018
1984
|
type: "text"
|
|
2019
|
-
}));
|
|
1985
|
+
}, void 0));
|
|
2020
1986
|
}
|
|
2021
1987
|
|
|
2022
|
-
return
|
|
1988
|
+
return jsxRuntime.jsxs("div", __assign({
|
|
2023
1989
|
className: "skeleton-image-content"
|
|
2024
|
-
},
|
|
2025
|
-
|
|
2026
|
-
|
|
2027
|
-
|
|
2028
|
-
|
|
2029
|
-
|
|
2030
|
-
|
|
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);
|
|
2031
2001
|
};
|
|
2032
2002
|
|
|
2033
|
-
var css_248z$
|
|
2034
|
-
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);
|
|
2035
2005
|
|
|
2036
|
-
var GoACard = function GoACard(
|
|
2037
|
-
var title =
|
|
2038
|
-
content =
|
|
2039
|
-
|
|
2040
|
-
description =
|
|
2041
|
-
|
|
2042
|
-
cardImageUrl =
|
|
2043
|
-
|
|
2044
|
-
titleUrl =
|
|
2045
|
-
|
|
2046
|
-
children =
|
|
2047
|
-
|
|
2048
|
-
minWidth =
|
|
2049
|
-
|
|
2050
|
-
maxWidth =
|
|
2051
|
-
other =
|
|
2052
|
-
|
|
2053
|
-
var
|
|
2054
|
-
|
|
2055
|
-
|
|
2056
|
-
|
|
2057
|
-
|
|
2058
|
-
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({
|
|
2059
2028
|
className: "goa-card",
|
|
2060
|
-
"data-testid":
|
|
2029
|
+
"data-testid": 'card-container',
|
|
2061
2030
|
style: {
|
|
2062
2031
|
minWidth: minWidth,
|
|
2063
2032
|
maxWidth: maxWidth
|
|
2064
2033
|
}
|
|
2065
|
-
}, other
|
|
2066
|
-
|
|
2067
|
-
|
|
2068
|
-
|
|
2069
|
-
|
|
2070
|
-
|
|
2071
|
-
|
|
2072
|
-
|
|
2073
|
-
|
|
2074
|
-
|
|
2075
|
-
|
|
2076
|
-
|
|
2077
|
-
|
|
2078
|
-
|
|
2079
|
-
|
|
2080
|
-
|
|
2081
|
-
|
|
2082
|
-
|
|
2083
|
-
|
|
2084
|
-
|
|
2085
|
-
|
|
2086
|
-
|
|
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);
|
|
2087
2072
|
};
|
|
2088
2073
|
|
|
2089
|
-
var css_248z$
|
|
2090
|
-
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);
|
|
2091
2076
|
|
|
2092
|
-
var GoACardGroup = function GoACardGroup(
|
|
2093
|
-
var
|
|
2094
|
-
title =
|
|
2095
|
-
|
|
2096
|
-
children =
|
|
2097
|
-
|
|
2098
|
-
layout =
|
|
2099
|
-
|
|
2100
|
-
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;
|
|
2101
2086
|
|
|
2102
2087
|
function getCards() {
|
|
2103
2088
|
if (children) {
|
|
@@ -2105,108 +2090,122 @@
|
|
|
2105
2090
|
}
|
|
2106
2091
|
|
|
2107
2092
|
return cardItems.map(function (item, index) {
|
|
2108
|
-
return /*#__PURE__*/
|
|
2093
|
+
return /*#__PURE__*/React.createElement(GoACard, __assign({}, item, {
|
|
2109
2094
|
key: index
|
|
2110
2095
|
}), item.children);
|
|
2111
2096
|
});
|
|
2112
2097
|
}
|
|
2113
2098
|
|
|
2114
|
-
return
|
|
2099
|
+
return jsxRuntime.jsxs("div", __assign({
|
|
2115
2100
|
className: "goa-card-group"
|
|
2116
|
-
},
|
|
2117
|
-
|
|
2118
|
-
|
|
2119
|
-
|
|
2120
|
-
|
|
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);
|
|
2121
2112
|
};
|
|
2122
2113
|
|
|
2123
|
-
var css_248z$
|
|
2124
|
-
styleInject(css_248z$
|
|
2125
|
-
|
|
2126
|
-
/* 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);
|
|
2127
2116
|
|
|
2128
|
-
var GoACheckbox = function GoACheckbox(
|
|
2129
|
-
var name =
|
|
2130
|
-
checked =
|
|
2131
|
-
disabled =
|
|
2132
|
-
indeterminate =
|
|
2133
|
-
|
|
2134
|
-
value =
|
|
2135
|
-
content =
|
|
2136
|
-
children =
|
|
2137
|
-
|
|
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;
|
|
2138
2127
|
|
|
2139
2128
|
var rootCss = function rootCss() {
|
|
2140
|
-
return
|
|
2129
|
+
return classnames__default["default"]({
|
|
2141
2130
|
'goa-checkbox': true,
|
|
2142
2131
|
'goa-checkbox--disabled': disabled
|
|
2143
2132
|
});
|
|
2144
2133
|
};
|
|
2145
2134
|
|
|
2146
2135
|
var checkboxCss = function checkboxCss() {
|
|
2147
|
-
return
|
|
2136
|
+
return classnames__default["default"]({
|
|
2148
2137
|
'goa-checkbox-container': true,
|
|
2149
2138
|
'goa-checkbox--selected': checked
|
|
2150
2139
|
});
|
|
2151
2140
|
};
|
|
2152
2141
|
|
|
2153
|
-
return
|
|
2142
|
+
return jsxRuntime.jsxs("label", __assign({
|
|
2154
2143
|
className: rootCss()
|
|
2155
|
-
},
|
|
2156
|
-
|
|
2157
|
-
|
|
2158
|
-
|
|
2159
|
-
|
|
2160
|
-
|
|
2161
|
-
|
|
2162
|
-
|
|
2163
|
-
|
|
2164
|
-
|
|
2165
|
-
|
|
2166
|
-
|
|
2167
|
-
|
|
2168
|
-
|
|
2169
|
-
|
|
2170
|
-
|
|
2171
|
-
|
|
2172
|
-
|
|
2173
|
-
|
|
2174
|
-
|
|
2175
|
-
|
|
2176
|
-
|
|
2177
|
-
|
|
2178
|
-
|
|
2179
|
-
|
|
2180
|
-
|
|
2181
|
-
|
|
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);
|
|
2182
2181
|
};
|
|
2183
2182
|
|
|
2184
|
-
var css_248z$
|
|
2185
|
-
styleInject(css_248z$
|
|
2186
|
-
|
|
2187
|
-
var GoAPageLoader = function GoAPageLoader(_ref) {
|
|
2188
|
-
var _ref$type = _ref.type,
|
|
2189
|
-
type = _ref$type === void 0 ? 'infinite' : _ref$type,
|
|
2190
|
-
_ref$visible = _ref.visible,
|
|
2191
|
-
visible = _ref$visible === void 0 ? false : _ref$visible,
|
|
2192
|
-
_ref$message = _ref.message,
|
|
2193
|
-
message = _ref$message === void 0 ? 'Loading...' : _ref$message,
|
|
2194
|
-
_ref$value = _ref.value,
|
|
2195
|
-
value = _ref$value === void 0 ? 0 : _ref$value,
|
|
2196
|
-
_ref$pagelock = _ref.pagelock,
|
|
2197
|
-
pagelock = _ref$pagelock === void 0 ? true : _ref$pagelock,
|
|
2198
|
-
_ref$displayType = _ref.displayType,
|
|
2199
|
-
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);
|
|
2200
2185
|
|
|
2201
|
-
|
|
2202
|
-
|
|
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
|
|
2203
2201
|
*/
|
|
2202
|
+
|
|
2204
2203
|
var progressMaxValue = 283;
|
|
2205
2204
|
var strokeDashoffset = 0;
|
|
2206
|
-
/**
|
|
2207
|
-
* Sets the progress if in progress mode.
|
|
2208
|
-
* @param progress
|
|
2209
|
-
* @returns
|
|
2205
|
+
/**
|
|
2206
|
+
* Sets the progress if in progress mode.
|
|
2207
|
+
* @param progress
|
|
2208
|
+
* @returns
|
|
2210
2209
|
*/
|
|
2211
2210
|
|
|
2212
2211
|
function setProgress(progress) {
|
|
@@ -2240,32 +2239,38 @@
|
|
|
2240
2239
|
setProgress(value);
|
|
2241
2240
|
}
|
|
2242
2241
|
|
|
2243
|
-
return
|
|
2244
|
-
className: "progress-container--"
|
|
2245
|
-
onKeyDown: function
|
|
2242
|
+
return jsxRuntime.jsxs("div", __assign({
|
|
2243
|
+
className: "progress-container--" + displayType,
|
|
2244
|
+
onKeyDown: function (event) {
|
|
2246
2245
|
event.preventDefault();
|
|
2247
2246
|
}
|
|
2248
|
-
},
|
|
2249
|
-
|
|
2250
|
-
|
|
2251
|
-
|
|
2252
|
-
|
|
2253
|
-
|
|
2254
|
-
|
|
2255
|
-
|
|
2256
|
-
|
|
2257
|
-
|
|
2258
|
-
|
|
2259
|
-
|
|
2260
|
-
|
|
2261
|
-
|
|
2262
|
-
|
|
2263
|
-
|
|
2264
|
-
|
|
2265
|
-
|
|
2266
|
-
|
|
2267
|
-
|
|
2268
|
-
|
|
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);
|
|
2269
2274
|
} else {
|
|
2270
2275
|
document.body.style.removeProperty('height');
|
|
2271
2276
|
document.body.style.removeProperty('overflow');
|
|
@@ -2273,40 +2278,43 @@
|
|
|
2273
2278
|
}
|
|
2274
2279
|
};
|
|
2275
2280
|
GoAPageLoader.propTypes = {
|
|
2276
|
-
visible:
|
|
2277
|
-
message:
|
|
2278
|
-
value:
|
|
2279
|
-
type:
|
|
2280
|
-
pagelock:
|
|
2281
|
-
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
|
|
2282
2287
|
};
|
|
2283
2288
|
|
|
2284
|
-
var css_248z
|
|
2285
|
-
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);
|
|
2286
2291
|
|
|
2287
|
-
var GoAElementLoader = function GoAElementLoader(
|
|
2288
|
-
var
|
|
2289
|
-
visible =
|
|
2290
|
-
|
|
2291
|
-
baseColour =
|
|
2292
|
-
|
|
2293
|
-
spinnerColour =
|
|
2294
|
-
|
|
2295
|
-
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;
|
|
2296
2301
|
var radius = size === 'small' ? 16 : 18;
|
|
2297
2302
|
var diameter = radius * 2;
|
|
2298
|
-
var boxView = "0 0 "
|
|
2299
|
-
/**
|
|
2300
|
-
* Generates the value for an SVG arc.
|
|
2301
|
-
* @param current Current value.
|
|
2302
|
-
* @param total Maximum value.
|
|
2303
|
-
* @param pathRadius Radius of the SVG path.
|
|
2304
|
-
* @param elementRadius Radius of the SVG container.
|
|
2305
|
-
* @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.
|
|
2306
2311
|
*/
|
|
2307
2312
|
|
|
2308
|
-
function getArc(current, total, pathRadius, elementRadius) {
|
|
2309
|
-
|
|
2313
|
+
function getArc(current, total, pathRadius, elementRadius, isSemicircle) {
|
|
2314
|
+
if (isSemicircle === void 0) {
|
|
2315
|
+
isSemicircle = false;
|
|
2316
|
+
}
|
|
2317
|
+
|
|
2310
2318
|
var value = Math.max(0, Math.min(current || 0, total));
|
|
2311
2319
|
var maxAngle = isSemicircle ? 180 : 359.9999;
|
|
2312
2320
|
var percentage = total === 0 ? maxAngle : value / total * maxAngle;
|
|
@@ -2316,15 +2324,15 @@
|
|
|
2316
2324
|
var end = _polarToCartesian(elementRadius, pathRadius, 0);
|
|
2317
2325
|
|
|
2318
2326
|
var arcSweep = percentage <= 180 ? 0 : 1;
|
|
2319
|
-
return "M "
|
|
2327
|
+
return "M " + start + " A " + pathRadius + " " + pathRadius + " 0 " + arcSweep + " 0 " + end;
|
|
2320
2328
|
}
|
|
2321
2329
|
|
|
2322
2330
|
var DEGREE_IN_RADIANS = Math.PI / 180;
|
|
2323
|
-
/**
|
|
2324
|
-
* Converts polar cooradinates to Cartesian.
|
|
2325
|
-
* @param elementRadius Radius of the wrapper element.
|
|
2326
|
-
* @param pathRadius Radius of the path being described.
|
|
2327
|
-
* @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.
|
|
2328
2336
|
*/
|
|
2329
2337
|
|
|
2330
2338
|
function _polarToCartesian(elementRadius, pathRadius, angleInDegrees) {
|
|
@@ -2334,25 +2342,27 @@
|
|
|
2334
2342
|
return x + ' ' + y;
|
|
2335
2343
|
}
|
|
2336
2344
|
|
|
2337
|
-
return visible &&
|
|
2345
|
+
return visible && jsxRuntime.jsxs("svg", __assign({
|
|
2338
2346
|
className: "circular-loader",
|
|
2339
2347
|
fill: "none",
|
|
2340
2348
|
viewBox: boxView,
|
|
2341
2349
|
width: radius,
|
|
2342
2350
|
height: radius,
|
|
2343
2351
|
xmlns: "http://www.w3.org/2000/svg"
|
|
2344
|
-
},
|
|
2345
|
-
|
|
2346
|
-
|
|
2347
|
-
|
|
2348
|
-
|
|
2349
|
-
|
|
2350
|
-
|
|
2351
|
-
|
|
2352
|
-
|
|
2353
|
-
|
|
2354
|
-
|
|
2355
|
-
|
|
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);
|
|
2356
2366
|
};
|
|
2357
2367
|
|
|
2358
2368
|
exports.GoAButton = GoAButton;
|
|
@@ -2378,4 +2388,4 @@
|
|
|
2378
2388
|
|
|
2379
2389
|
Object.defineProperty(exports, '__esModule', { value: true });
|
|
2380
2390
|
|
|
2381
|
-
}))
|
|
2391
|
+
}));
|