@luscii-healthtech/web-ui 46.0.1 → 46.2.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/README.md +2 -2
- package/dist/index.development.js +93 -36
- package/dist/index.development.js.map +1 -1
- package/dist/index.js +1 -1
- package/dist/index.js.map +1 -1
- package/dist/src/components/Heading/Heading.d.ts +29 -0
- package/dist/src/components/NaturalLanguageForm/NaturalLanguageForm.d.ts +1 -16
- package/dist/src/components/Text/Text.d.ts +61 -3
- package/dist/src/components/Title/Title.d.ts +3 -0
- package/dist/src/generated/components/Heading/Heading.d.ts +29 -0
- package/dist/src/generated/components/NaturalLanguageForm/NaturalLanguageForm.d.ts +1 -16
- package/dist/src/generated/components/Text/Text.d.ts +61 -3
- package/dist/src/generated/components/Title/Title.d.ts +3 -0
- package/dist/src/generated/index.d.ts +1 -0
- package/dist/src/index.d.ts +1 -0
- package/dist/stories/DetailsDisclosure.stories.d.ts +32 -32
- package/dist/stories/Heading.stories.d.ts +31 -0
- package/dist/stories/ModalDialog.stories.d.ts +96 -96
- package/dist/stories/NaturalLanguageForm.stories.d.ts +1 -16
- package/dist/stories/StyledOrderedList.stories.d.ts +2 -2
- package/dist/stories/StyledUnorderedList.stories.d.ts +2 -2
- package/dist/stories/Tabs.stories.d.ts +1 -16
- package/dist/stories/Text.stories.d.ts +67 -35
- package/dist/stories/TextColors.stories.d.ts +2 -16
- package/dist/stories/TextLegacy.stories.d.ts +32 -0
- package/dist/stories/Title.stories.d.ts +1 -1
- package/dist/web-ui-tailwind.css +136 -91
- package/dist/web-ui.esm.js +1 -1
- package/dist/web-ui.esm.js.map +1 -1
- package/package.json +1 -1
package/README.md
CHANGED
|
@@ -29,13 +29,13 @@ function MyComponent() {
|
|
|
29
29
|
|
|
30
30
|
### Fonts
|
|
31
31
|
|
|
32
|
-
WebUI uses the Inter font family for most of its text. This font should be provided by your application if you're using WebUI. The weights needed to show the full gamut of weights in the design system are 400, 500, 600 and 700. One way of doing this is using a Google Fonts link in your HTML file:
|
|
32
|
+
WebUI uses the Inter font family for most of its text. This font should be provided by your application if you're using WebUI. The weights needed to show the full gamut of weights in the design system are 300, 400, 500, 600 and 700. One way of doing this is using a Google Fonts link in your HTML file:
|
|
33
33
|
|
|
34
34
|
```html
|
|
35
35
|
<link rel="preconnect" href="https://fonts.googleapis.com" />
|
|
36
36
|
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />
|
|
37
37
|
<link
|
|
38
|
-
href="https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700&display=swap"
|
|
38
|
+
href="https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700&display=swap"
|
|
39
39
|
rel="stylesheet"
|
|
40
40
|
/>
|
|
41
41
|
```
|
|
@@ -236,9 +236,37 @@ function styleInject(css, ref) {
|
|
|
236
236
|
}
|
|
237
237
|
}
|
|
238
238
|
|
|
239
|
-
var css_248z$
|
|
240
|
-
styleInject(css_248z$
|
|
241
|
-
|
|
239
|
+
var css_248z$g = "/* https://stackoverflow.com/a/13924997 */\n.ui\\:text-two-lines-max {\n overflow: hidden;\n text-overflow: ellipsis;\n display: -webkit-box;\n /* number of lines to show */\n -webkit-line-clamp: 2;\n line-clamp: 2;\n -webkit-box-orient: vertical;\n}\n";
|
|
240
|
+
styleInject(css_248z$g);
|
|
241
|
+
|
|
242
|
+
const newVariants = /* @__PURE__ */ new Set([
|
|
243
|
+
"body-base-light",
|
|
244
|
+
"body-base-regular",
|
|
245
|
+
"body-base-bold",
|
|
246
|
+
"body-small-light",
|
|
247
|
+
"body-small-regular",
|
|
248
|
+
"body-small-bold"
|
|
249
|
+
]);
|
|
250
|
+
const isNewVariant = (variant) => variant !== void 0 && newVariants.has(variant);
|
|
251
|
+
const newVariantClasses = {
|
|
252
|
+
"body-base-light": "ui-typo-body-base-light",
|
|
253
|
+
"body-base-regular": "ui-typo-body-base-regular",
|
|
254
|
+
"body-base-bold": "ui-typo-body-base-bold",
|
|
255
|
+
"body-small-light": "ui-typo-body-small-light",
|
|
256
|
+
"body-small-regular": "ui-typo-body-small-regular",
|
|
257
|
+
"body-small-bold": "ui-typo-body-small-bold"
|
|
258
|
+
};
|
|
259
|
+
const newTextColorClasses = {
|
|
260
|
+
neutral: "ui:text-text-neutral-primary-default",
|
|
261
|
+
"neutral-secondary": "ui:text-text-neutral-secondary-default",
|
|
262
|
+
brand: "ui:text-text-brand-primary-default",
|
|
263
|
+
error: "ui:text-text-error-primary-default",
|
|
264
|
+
success: "ui:text-text-success-primary-default",
|
|
265
|
+
warning: "ui:text-text-warning-primary-default",
|
|
266
|
+
info: "ui:text-text-info-primary-default",
|
|
267
|
+
inverse: "ui:text-text-inverse-primary-default",
|
|
268
|
+
disabled: "ui:text-text-neutral-primary-disabled"
|
|
269
|
+
};
|
|
242
270
|
const responsiveTextSizeVariants = {
|
|
243
271
|
xs: "ui:text-[12px]",
|
|
244
272
|
sm: "ui:text-sm ui:sm:text-xs",
|
|
@@ -297,9 +325,23 @@ const allowedGroupHoverColors = {
|
|
|
297
325
|
"blue-900": "ui:group-hover:text-primary-dark",
|
|
298
326
|
white: "ui:group-hover:text-white"
|
|
299
327
|
};
|
|
328
|
+
const DEFAULT_ELEMENT = "span";
|
|
300
329
|
const Text = (props) => {
|
|
301
|
-
var _a, _b;
|
|
302
|
-
|
|
330
|
+
var _a, _b, _c;
|
|
331
|
+
if (isNewVariant(props.variant)) {
|
|
332
|
+
const _d = props, { as, variant: variant2, color: color2 = "neutral", truncate: truncate2, containsDangerousHtml: containsDangerousHtml2, children: children2, className: className2 } = _d, rest2 = __rest(_d, ["as", "variant", "color", "truncate", "containsDangerousHtml", "children", "className"]);
|
|
333
|
+
const Element2 = as !== null && as !== void 0 ? as : DEFAULT_ELEMENT;
|
|
334
|
+
const newClassName = classNames__default.default(newVariantClasses[variant2], newTextColorClasses[color2], {
|
|
335
|
+
"ui:truncate": truncate2
|
|
336
|
+
}, className2);
|
|
337
|
+
if (containsDangerousHtml2) {
|
|
338
|
+
return jsxRuntime.jsx(Element2, Object.assign({ className: newClassName, dangerouslySetInnerHTML: {
|
|
339
|
+
__html: DOMPurify__default.default.sanitize((_a = children2 === null || children2 === void 0 ? void 0 : children2.toString()) !== null && _a !== void 0 ? _a : "")
|
|
340
|
+
} }, rest2));
|
|
341
|
+
}
|
|
342
|
+
return jsxRuntime.jsx(Element2, Object.assign({ className: newClassName }, rest2, { children: children2 }));
|
|
343
|
+
}
|
|
344
|
+
const _e = props, { as: Element = props.inline ? "span" : "p", children, text, type, variant = "base", inline, color = "base", hoverColor, hoverInGroup, className, containsDangerousHtml, truncate, clampLines, capitalize } = _e, rest = __rest(_e, ["as", "children", "text", "type", "variant", "inline", "color", "hoverColor", "hoverInGroup", "className", "containsDangerousHtml", "truncate", "clampLines", "capitalize"]);
|
|
303
345
|
const resolvedVariant = type !== null && type !== void 0 ? type : variant;
|
|
304
346
|
const selectedHoverColor = hoverColor && !hoverInGroup && allowedHoverColors[hoverColor];
|
|
305
347
|
const selectedGroupHoverColor = hoverColor && hoverInGroup && allowedGroupHoverColors[hoverColor];
|
|
@@ -326,7 +368,7 @@ const Text = (props) => {
|
|
|
326
368
|
)
|
|
327
369
|
};
|
|
328
370
|
return containsDangerousHtml ? jsxRuntime.jsx(Element, Object.assign({}, rest, containerProps, { dangerouslySetInnerHTML: {
|
|
329
|
-
__html: children ? DOMPurify__default.default.sanitize((
|
|
371
|
+
__html: children ? DOMPurify__default.default.sanitize((_b = children === null || children === void 0 ? void 0 : children.toString()) !== null && _b !== void 0 ? _b : "") : (_c = DOMPurify__default.default.sanitize(text !== null && text !== void 0 ? text : "")) !== null && _c !== void 0 ? _c : ""
|
|
330
372
|
} })) : jsxRuntime.jsx(Element, Object.assign({}, rest, containerProps, { children: children !== null && children !== void 0 ? children : text }));
|
|
331
373
|
};
|
|
332
374
|
|
|
@@ -962,8 +1004,8 @@ toast.info = (message) => {
|
|
|
962
1004
|
showToaster({ message, type: "success", showIcon: true, title: "" });
|
|
963
1005
|
};
|
|
964
1006
|
|
|
965
|
-
var css_248z$
|
|
966
|
-
styleInject(css_248z$
|
|
1007
|
+
var css_248z$f = "/**\n * --- DEPRECATED ---\n * DON'T USE ANYTHING FROM THIS FILE IN FUTURE CHANGES. WE SHOULD BE\n * USING TAILWIND CLASSES DIRECTLY IN OUR COMPONENTS.\n */\n/** Load Avenir fonts for titles */\n@font-face {\n font-family: \"AvenirNextLTPro-Regular\";\n src: url(\"../../../public/fonts/avenir/3A0AF8_1_0.eot\");\n src: url(\"../../../public/fonts/avenir/3A0AF8_1_0.eot\") format(\"embedded-opentype\"), url(\"../../../public/fonts/avenir/3A0AF8_1_0.woff2\") format(\"woff2\"), url(\"../../../public/fonts/avenir/3A0AF8_1_0.woff\") format(\"woff\"), url(\"../../../public/fonts/avenir/3A0AF8_1_0.ttf\") format(\"truetype\");\n}\n@font-face {\n font-family: \"AvenirNextLTPro-Bold\";\n src: url(\"../../../public/fonts/avenir/3A0AF8_0_0.eot\");\n src: url(\"../../../public/fonts/avenir/3A0AF8_0_0.eot\") format(\"embedded-opentype\"), url(\"../../../public/fonts/avenir/3A0AF8_0_0.woff2\") format(\"woff2\"), url(\"../../../public/fonts/avenir/3A0AF8_0_0.woff\") format(\"woff\"), url(\"../../../public/fonts/avenir/3A0AF8_0_0.ttf\") format(\"truetype\");\n}\n.title-avenir {\n font-family: \"AvenirNextLTPro-Bold\", \"Roboto\", sans-serif;\n}\n\n.title-inter {\n font-family: \"Inter\", \"Roboto\", \"Helvetica\", sans-serif;\n}";
|
|
1008
|
+
styleInject(css_248z$f);
|
|
967
1009
|
|
|
968
1010
|
const Title = (props) => {
|
|
969
1011
|
const { variant: variantFromProps = "base", type, className, text, children, color, level, ref } = props, rest = __rest(props, ["variant", "type", "className", "text", "children", "color", "level", "ref"]);
|
|
@@ -1039,8 +1081,8 @@ const isSubstring = (string, searchTerm, caseSensitive = false) => {
|
|
|
1039
1081
|
return (stringToSearch === null || stringToSearch === void 0 ? void 0 : stringToSearch.indexOf(searchTermWithCase)) > -1;
|
|
1040
1082
|
};
|
|
1041
1083
|
|
|
1042
|
-
var css_248z$
|
|
1043
|
-
styleInject(css_248z$
|
|
1084
|
+
var css_248z$e = ".list-skeleton .skeleton-box {\n display: inline-block;\n height: 1em;\n position: relative;\n overflow: hidden;\n background-color: #cbd5e1;\n border-radius: 3px;\n}\n.list-skeleton .skeleton-box::after {\n position: absolute;\n top: 0;\n right: 0;\n bottom: 0;\n left: 0;\n transform: translateX(-100%);\n background-image: linear-gradient(90deg, rgba(255, 255, 255, 0) 0, rgba(255, 255, 255, 0.2) 20%, rgba(255, 255, 255, 0.5) 60%, rgba(255, 255, 255, 0));\n animation: shimmer 800ms infinite;\n content: \"\";\n}\n.list-skeleton .skeleton-box.is-circle {\n border-radius: 50%;\n}\n.list-skeleton .skeleton-box.is-button::after {\n position: absolute;\n top: 0;\n right: 0;\n bottom: 0;\n left: 0;\n transform: translateX(-100%);\n background-image: linear-gradient(90deg, rgba(221, 221, 221, 0) 0, rgba(221, 221, 221, 0.2) 20%, rgba(221, 221, 221, 0.5) 60%, rgba(221, 221, 221, 0));\n animation: shimmer 800ms infinite;\n content: \"\";\n}\n@keyframes shimmer {\n 100% {\n transform: translateX(100%);\n }\n}";
|
|
1085
|
+
styleInject(css_248z$e);
|
|
1044
1086
|
|
|
1045
1087
|
const ListItemSkeleton = () => {
|
|
1046
1088
|
return jsxRuntime.jsxs("div", { className: "ui:flex ui:flex-row ui:items-center ui:p-4", children: [jsxRuntime.jsx("div", { className: "skeleton-box is-circle ui:mr-2", style: { width: `${32}px`, height: `${32}px` } }), jsxRuntime.jsxs("div", { className: "ui:flex ui:flex-col", children: [jsxRuntime.jsx("div", { className: "skeleton-box ui:mb-1", style: { width: `${160}px`, height: `${14}px` } }), jsxRuntime.jsx("div", { className: "skeleton-box", style: { width: `${110}px`, height: `${14}px` } })] }), jsxRuntime.jsx("div", { className: "skeleton-box is-button ui:ml-auto ui:rounded-full", style: { width: `${24}px`, height: `${24}px` } })] });
|
|
@@ -1465,8 +1507,8 @@ const DraggableBaseList = (_a) => {
|
|
|
1465
1507
|
return jsxRuntime.jsx(BaseList, Object.assign({}, props, { items, itemComponent: DraggableBaseListItem }));
|
|
1466
1508
|
};
|
|
1467
1509
|
|
|
1468
|
-
var css_248z$
|
|
1469
|
-
styleInject(css_248z$
|
|
1510
|
+
var css_248z$d = ".dropzone-dashed-border {\n border-image: url(\"data:image/svg+xml,%3Csvg xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22 width%3D%2224%22 height%3D%2224%22 fill%3D%22none%22%3E %3Cpath fill%3D%22%230074DD%22 fill-rule%3D%22evenodd%22 d%3D%22M8 0v1h8V0H8Zm0 23v1h8v-1H8ZM0 8h1v8H0V8Zm24 0h-1v8h1V8ZM1 0h3v1H1v3H0V0h1ZM0 23v-3h1v3h3v1H0v-1Zm20 0v1h4v-4h-1v3h-3Zm0-22V0h4v4h-1V1h-3Z%22 clip-rule%3D%22evenodd%22 %2F%3E%3C%2Fsvg%3E\") 1 1 1 1;\n border-image-width: 4px;\n border-image-slice: 4 4 4 4;\n border-image-repeat: round;\n}";
|
|
1511
|
+
styleInject(css_248z$d);
|
|
1470
1512
|
|
|
1471
1513
|
const DefaultState = ({ icon, message, horizontal = false, alignMessage = "center" }) => {
|
|
1472
1514
|
if (!icon && !message) {
|
|
@@ -1533,8 +1575,8 @@ const ListItem = (props) => {
|
|
|
1533
1575
|
return jsxRuntime.jsx(BaseListItem, Object.assign({}, props));
|
|
1534
1576
|
};
|
|
1535
1577
|
|
|
1536
|
-
var css_248z$
|
|
1537
|
-
styleInject(css_248z$
|
|
1578
|
+
var css_248z$c = "/*! tailwindcss v4.1.12 | MIT License | https://tailwindcss.com */\n@layer properties;\nli.gu-mirror {\n position: fixed;\n z-index: 9999;\n margin: calc(var(--ui-spacing, 0.25rem) * 0);\n --tw-shadow: 0 20px 25px -5px var(--tw-shadow-color, rgb(0 0 0 / 0.1)), 0 8px 10px -6px var(--tw-shadow-color, rgb(0 0 0 / 0.1));\n box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);\n}\nli.gu-hide {\n display: none;\n}\nli.gu-unselectable {\n user-select: none;\n}\nli.gu-transit {\n background-color: var(--ui-color-blue-50, #eff6ff);\n filter: none;\n border-radius: 0;\n --tw-border-style: none;\n border-style: none;\n opacity: 100%;\n}\nli.gu-transit > * {\n visibility: hidden;\n}\n@property --tw-shadow {\n syntax: \"*\";\n inherits: false;\n initial-value: 0 0 #0000;\n}\n@property --tw-shadow-color {\n syntax: \"*\";\n inherits: false;\n}\n@property --tw-shadow-alpha {\n syntax: \"<percentage>\";\n inherits: false;\n initial-value: 100%;\n}\n@property --tw-inset-shadow {\n syntax: \"*\";\n inherits: false;\n initial-value: 0 0 #0000;\n}\n@property --tw-inset-shadow-color {\n syntax: \"*\";\n inherits: false;\n}\n@property --tw-inset-shadow-alpha {\n syntax: \"<percentage>\";\n inherits: false;\n initial-value: 100%;\n}\n@property --tw-ring-color {\n syntax: \"*\";\n inherits: false;\n}\n@property --tw-ring-shadow {\n syntax: \"*\";\n inherits: false;\n initial-value: 0 0 #0000;\n}\n@property --tw-inset-ring-color {\n syntax: \"*\";\n inherits: false;\n}\n@property --tw-inset-ring-shadow {\n syntax: \"*\";\n inherits: false;\n initial-value: 0 0 #0000;\n}\n@property --tw-ring-inset {\n syntax: \"*\";\n inherits: false;\n}\n@property --tw-ring-offset-width {\n syntax: \"<length>\";\n inherits: false;\n initial-value: 0px;\n}\n@property --tw-ring-offset-color {\n syntax: \"*\";\n inherits: false;\n initial-value: #fff;\n}\n@property --tw-ring-offset-shadow {\n syntax: \"*\";\n inherits: false;\n initial-value: 0 0 #0000;\n}\n@layer properties {\n @supports ((-webkit-hyphens: none) and (not (margin-trim: inline))) or ((-moz-orient: inline) and (not (color:rgb(from red r g b)))) {\n *, ::before, ::after, ::backdrop {\n --tw-shadow: 0 0 #0000;\n --tw-shadow-color: initial;\n --tw-shadow-alpha: 100%;\n --tw-inset-shadow: 0 0 #0000;\n --tw-inset-shadow-color: initial;\n --tw-inset-shadow-alpha: 100%;\n --tw-ring-color: initial;\n --tw-ring-shadow: 0 0 #0000;\n --tw-inset-ring-color: initial;\n --tw-inset-ring-shadow: 0 0 #0000;\n --tw-ring-inset: initial;\n --tw-ring-offset-width: 0px;\n --tw-ring-offset-color: #fff;\n --tw-ring-offset-shadow: 0 0 #0000;\n }\n }\n}";
|
|
1579
|
+
styleInject(css_248z$c);
|
|
1538
1580
|
|
|
1539
1581
|
const DefaultList = (_a) => {
|
|
1540
1582
|
var { items, onDragEnd, onAssetLoadError, subtitle } = _a, props = __rest(_a, ["items", "onDragEnd", "onAssetLoadError", "subtitle"]);
|
|
@@ -1884,8 +1926,8 @@ var img$4 = "data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' xmlns:
|
|
|
1884
1926
|
|
|
1885
1927
|
var img$3 = "data:image/svg+xml,%3c%3fxml version='1.0' encoding='utf-8'%3f%3e%3csvg xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' style='margin: auto%3b background: none%3b display: block%3b shape-rendering: auto%3b' width='200px' height='200px' viewBox='0 0 100 100' preserveAspectRatio='xMidYMid'%3e%3ccircle cx='50' cy='50' fill='none' stroke='%23cbd5e1' stroke-width='16' r='36' stroke-dasharray='169.64600329384882 58.548667764616276'%3e %3canimateTransform attributeName='transform' type='rotate' repeatCount='indefinite' dur='1.1111111111111112s' values='0 50 50%3b360 50 50' keyTimes='0%3b1'%3e%3c/animateTransform%3e%3c/circle%3e%3c!-- %5bldio%5d generated by https://loading.io/ --%3e%3c/svg%3e";
|
|
1886
1928
|
|
|
1887
|
-
var css_248z$
|
|
1888
|
-
styleInject(css_248z$
|
|
1929
|
+
var css_248z$b = "/**\n * --- DEPRECATED ---\n * DON'T USE ANYTHING FROM THIS FILE IN FUTURE CHANGES. WE SHOULD BE\n * USING TAILWIND CLASSES DIRECTLY IN OUR COMPONENTS.\n */\n.cweb-loading {\n display: flex;\n justify-content: center;\n align-items: center;\n}\n.cweb-loading .cweb-loading-text {\n margin-bottom: 24px;\n}\n.cweb-loading.as-modal {\n position: fixed;\n left: 0;\n right: 0;\n top: 0;\n bottom: 0;\n z-index: 9999;\n background-color: rgba(255, 255, 255, 0.6);\n}\n.cweb-loading.as-modal .cweb-loading-panel {\n position: relative;\n width: 320px;\n min-height: 120px;\n border-radius: 4px;\n padding: 16px;\n box-shadow: 0 0 8px 0 rgba(0, 0, 0, 0.36);\n background-color: #ffffff;\n display: flex;\n flex-direction: column;\n justify-content: flex-start;\n align-items: center;\n}\n.cweb-loading.as-modal .cweb-loading-panel:before {\n position: absolute;\n content: \"\";\n top: 0;\n left: 0;\n right: 0;\n z-index: 1;\n height: 3px;\n background-color: #6abfa5;\n border-top-left-radius: 4px;\n border-top-right-radius: 4px;\n}";
|
|
1930
|
+
styleInject(css_248z$b);
|
|
1889
1931
|
|
|
1890
1932
|
function LoadingIndicator(_a) {
|
|
1891
1933
|
var { asModal = false, asSpinner = false, className = "", spinnerColor = "blue", dataTestId = "loading-indicator" } = _a, restProps = __rest(_a, ["asModal", "asSpinner", "className", "spinnerColor", "dataTestId"]);
|
|
@@ -2356,8 +2398,8 @@ const Carousel = ({ id, className, slides = [], labels }) => {
|
|
|
2356
2398
|
return jsxRuntime.jsx("div", { ref: slidesContainer, id, className, children: jsxRuntime.jsxs(Stack, { width: "full", align: "stretch", gap: "m", children: [jsxRuntime.jsxs(Stack, { axis: "x", align: "stretch", width: "full", gap: "m", children: [jsxRuntime.jsx(Stack, { justify: "center", children: jsxRuntime.jsx(SecondaryButton, { onClick: onClickPrevious, leadingIcon: jsxRuntime.jsx(LeftArrowIcon, {}), "aria-label": labels === null || labels === void 0 ? void 0 : labels.previousButton, disabled: slides.length === 0 }) }), jsxRuntime.jsx(Stack, { as: "ol", axis: "x", width: "full", align: "stretch", className: "ui:w-full ui:snap-x ui:snap-mandatory ui:overflow-x-auto", style: { scrollbarWidth: "none" }, onScroll, children: slides.map((slide, i) => jsxRuntime.jsx(Box, { width: "full", as: "li", className: "ui:shrink-0 ui:snap-start", children: slide }, i)) }), jsxRuntime.jsx(Stack, { justify: "center", children: jsxRuntime.jsx(SecondaryButton, { onClick: onClickNext, leadingIcon: jsxRuntime.jsx(ChevronRightIcon, {}), "aria-label": labels === null || labels === void 0 ? void 0 : labels.nextButton, disabled: slides.length === 0 }) })] }), jsxRuntime.jsx(Stack, { align: "center", children: jsxRuntime.jsx(DotList, { activeIndex: currentIndex, amount: slides.length, onClickIndex: scrollToIndex }) })] }) });
|
|
2357
2399
|
};
|
|
2358
2400
|
|
|
2359
|
-
var css_248z$
|
|
2360
|
-
styleInject(css_248z$
|
|
2401
|
+
var css_248z$a = "/*! tailwindcss v4.1.12 | MIT License | https://tailwindcss.com */\n.cweb-checkbox {\n outline: none;\n}\n.cweb-checkbox .cweb-checkbox-input {\n position: absolute;\n -webkit-appearance: none;\n height: 1px;\n opacity: 0;\n width: 1px;\n}\n.cweb-checkbox.type-regular .cweb-checkbox-icon-container {\n border-color: #cccccc;\n}\n.cweb-checkbox.type-regular .cweb-checkbox-icon-container {\n display: flex;\n align-items: center;\n justify-content: center;\n flex: 0 0 auto;\n border-width: 1px;\n border-style: solid;\n border-radius: 4px;\n}\n.cweb-checkbox.type-regular.hasError .cweb-checkbox-icon-container {\n border-color: var(--ui-color-red-800, #991b1b);\n}\n.cweb-checkbox.type-regular.is-focused .cweb-checkbox-icon-container {\n border-color: #1e40af;\n}\n.cweb-checkbox.type-regular.is-checked .cweb-checkbox-icon {\n padding: 4px;\n background: url(\"data:image/svg+xml,%3Csvg xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22 width%3D%2210%22 height%3D%228%22 viewBox%3D%220 0 10 8%22 fill%3D%22none%22%3E %3Cpath d%3D%22M9.207 0.792787C9.39447 0.980314 9.49979 1.23462 9.49979 1.49979C9.49979 1.76495 9.39447 2.01926 9.207 2.20679L4.207 7.20679C4.01947 7.39426 3.76516 7.49957 3.5 7.49957C3.23484 7.49957 2.98053 7.39426 2.793 7.20679L0.793 5.20679C0.610842 5.01818 0.510047 4.76558 0.512326 4.50339C0.514604 4.24119 0.619773 3.99038 0.805181 3.80497C0.990589 3.61956 1.2414 3.51439 1.5036 3.51211C1.7658 3.50983 2.0184 3.61063 2.207 3.79279L3.5 5.08579L7.793 0.792787C7.98053 0.605316 8.23484 0.5 8.5 0.5C8.76516 0.5 9.01947 0.605316 9.207 0.792787Z%22 fill%3D%22white%22%2F%3E%3C%2Fsvg%3E\") no-repeat center;\n background-size: contain;\n}\n.cweb-checkbox.type-regular.is-checked .cweb-checkbox-icon-container {\n border-color: #1e40af;\n}\n.cweb-checkbox.type-regular.is-checked.is-focused .cweb-checkbox-icon-container {\n border-color: #1d4ed8;\n}\n.cweb-checkbox.type-regular.is-indeterminate .cweb-checkbox-icon {\n width: 0.5rem;\n height: 0.5rem;\n padding: 4px;\n background: url(\"data:image/svg+xml,%3Csvg width%3D%2210%22 height%3D%222%22 viewBox%3D%220 0 10 2%22 fill%3D%22none%22 xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%3Cpath d%3D%22M9 -4.37114e-08C9.55228 -1.95703e-08 10 0.447715 10 1C10 1.55228 9.55228 2 9 2L1 2C0.447716 2 -6.78525e-08 1.55228 -4.37114e-08 1C-1.95703e-08 0.447715 0.447715 -4.17544e-07 1 -3.93402e-07L9 -4.37114e-08Z%22 fill%3D%22white%22%2F%3E%3C%2Fsvg%3E\") no-repeat center;\n background-size: contain;\n}\n.cweb-checkbox.type-regular.is-indeterminate .cweb-checkbox-icon-container {\n border-color: #1e40af;\n}\n.cweb-checkbox.type-regular.is-indeterminate.is-focused .cweb-checkbox-icon-container {\n border-color: #1d4ed8;\n}\n.cweb-checkbox.type-regular.is-disabled.show-cross-when-disabled .cweb-checkbox-icon {\n width: 10px;\n height: 10px;\n background: url(\"data:image/svg+xml,%3Csvg width%3D%2211px%22 height%3D%2211px%22 viewBox%3D%220 0 11 11%22 version%3D%221.1%22 xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E %3Cg stroke%3D%22none%22 stroke-width%3D%221%22 fill%3D%22none%22 fill-rule%3D%22evenodd%22 stroke-linecap%3D%22round%22%3E %3Cg transform%3D%22translate(-6.000000%2C -7.000000)%22 stroke%3D%22%232D2D2D%22 stroke-width%3D%222%22%3E %3Cpath d%3D%22M7%2C17 L16%2C8 M16%2C17 L7%2C8%22 %2F%3E %3C%2Fg%3E %3C%2Fg%3E%3C%2Fsvg%3E\") no-repeat center;\n background-size: contain;\n opacity: 0.6;\n}";
|
|
2402
|
+
styleInject(css_248z$a);
|
|
2361
2403
|
|
|
2362
2404
|
const CheckboxInner = (props) => {
|
|
2363
2405
|
const { id, explanation, type = "regular", isChecked = false, isIndeterminate = false, isDisabled, name, value, onChange, onClick, className, classNameCheckboxLabel, error, innerRef } = props;
|
|
@@ -2681,8 +2723,8 @@ const LOCALE_MAP = {
|
|
|
2681
2723
|
"pt-PT": pt.pt
|
|
2682
2724
|
};
|
|
2683
2725
|
|
|
2684
|
-
var css_248z$8 = "/**\n * --- DEPRECATED ---\n * DON'T USE ANYTHING FROM THIS FILE IN FUTURE CHANGES. WE SHOULD BE\n * USING TAILWIND CLASSES DIRECTLY IN OUR COMPONENTS.\n */\n.cweb-datepicker {\n width: 182px;\n height: 44px;\n border: 1px solid #cccccc;\n border-radius: 4px;\n background-color: #ffffff;\n outline: none;\n padding: 12px 12px 11px 12px;\n}\n.cweb-datepicker input.cweb-datepicker {\n font-size: 14px;\n}\n.cweb-datepicker::placeholder {\n color: #64748b;\n}\n.cweb-datepicker:-ms-input-placeholder {\n color: #64748b !important;\n}\n.cweb-datepicker::-ms-input-placeholder {\n color: #64748b;\n}\n\n.react-datepicker-popper[data-placement^=bottom] .react-datepicker__triangle.react-datepicker__triangle {\n border-bottom-color: #ffffff;\n margin-top: -4px;\n fill: #ffffff;\n color: #ffffff;\n}\n.react-datepicker-popper[data-placement^=top] {\n margin-bottom: 4px;\n}\n.react-datepicker-popper[data-placement^=top] .react-datepicker__triangle.react-datepicker__triangle {\n border-top-color: #ffffff;\n margin-bottom: -4px;\n fill: #ffffff;\n color: #ffffff;\n}\n.react-datepicker-popper .react-datepicker__children-container {\n width: 100%;\n margin: 0;\n}\n\n.cweb-datepicker-calendar {\n box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2);\n}\n@media screen and (-ms-high-contrast: active), (-ms-high-contrast: none) {\n .cweb-datepicker-calendar {\n box-shadow: 0 4px 8px 1px rgba(0, 0, 0, 0.2);\n }\n}\n.cweb-datepicker-calendar {\n padding: 0;\n border: 1px solid #cccccc;\n display: flex;\n flex-direction: column;\n justify-content: flex-start;\n align-items: center;\n}\n.cweb-datepicker-calendar .react-datepicker__triangle {\n left: 10px;\n border: 6px solid transparent;\n fill: #ffffff;\n color: #ffffff;\n}\n.cweb-datepicker-calendar .react-datepicker__navigation {\n top: 19px;\n width: 19px;\n height: 10px;\n}\n.cweb-datepicker-calendar .react-datepicker__navigation .react-datepicker__navigation-icon:before {\n border: 0;\n}\n.cweb-datepicker-calendar .react-datepicker__navigation.react-datepicker__navigation--previous {\n background: url(\"data:image/svg+xml,%3Csvg width%3D%2210%22 height%3D%227%22 xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E %3Cpath d%3D%22M0 1.5L1.5 0 5 3.5 8.5 0 10 1.5l-5 5z%22 fill%3D%22%231D9BD8%22 fill-rule%3D%22evenodd%22%2F%3E%3C%2Fsvg%3E\") no-repeat center;\n border: 0;\n transform: rotate(90deg);\n}\n.cweb-datepicker-calendar .react-datepicker__navigation.react-datepicker__navigation--next {\n background: url(\"data:image/svg+xml,%3Csvg width%3D%2210%22 height%3D%227%22 xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E %3Cpath d%3D%22M0 1.5L1.5 0 5 3.5 8.5 0 10 1.5l-5 5z%22 fill%3D%22%231D9BD8%22 fill-rule%3D%22evenodd%22%2F%3E%3C%2Fsvg%3E\") no-repeat center;\n border: 0;\n transform: rotate(-90deg);\n}\n.cweb-datepicker-calendar .react-datepicker__year-dropdown-container--select,\n.cweb-datepicker-calendar .react-datepicker__month-dropdown-container--select,\n.cweb-datepicker-calendar .react-datepicker__month-year-dropdown-container--select,\n.cweb-datepicker-calendar .react-datepicker__year-dropdown-container--scroll,\n.cweb-datepicker-calendar .react-datepicker__month-dropdown-container--scroll,\n.cweb-datepicker-calendar .react-datepicker__month-year-dropdown-container--scroll {\n margin: 2px;\n}\n.cweb-datepicker-calendar .react-datepicker__time-container .react-datepicker__time-box {\n width: auto;\n}\n.cweb-datepicker-calendar .react-datepicker__time-container .react-datepicker__time-list {\n overflow-x: hidden;\n}\n.cweb-datepicker-calendar .react-datepicker__time-container .react-datepicker__time-list-item {\n font-family: \"Inter\", \"Roboto\", sans-serif;\n font-size: 14px;\n font-weight: normal;\n line-height: 19px;\n color: #1e293b;\n margin: 0;\n display: flex;\n justify-content: center;\n flex-direction: row;\n align-items: center;\n height: 40px !important;\n padding: 0 !important;\n}\n.cweb-datepicker-calendar .react-datepicker__time-container .react-datepicker__time-list-item.react-datepicker__time-list-item--selected {\n color: #ffffff;\n background-color: #1e40af !important;\n position: relative;\n}\n.cweb-datepicker-calendar .react-datepicker__time-container .react-datepicker__time-list-item.react-datepicker__time-list-item--selected:hover {\n background-color: #1e40af !important;\n}\n.cweb-datepicker-calendar .react-datepicker__time-container .react-datepicker__time-list-item.react-datepicker__time-list-item--selected:before {\n content: \"\";\n position: absolute;\n bottom: -3px;\n right: 0;\n left: initial;\n top: initial;\n border-style: solid;\n border-width: 6px 6px 6px 0;\n border-color: transparent #ffffff transparent transparent;\n transform: rotate(-135deg);\n}\n.cweb-datepicker-calendar .react-datepicker__header {\n padding-top: 0;\n border: none;\n background-color: #ffffff;\n font-size: 14px;\n padding-bottom: 0;\n}\n.cweb-datepicker-calendar .react-datepicker__header .react-datepicker__current-month {\n font-family: \"Inter\", \"Roboto\", sans-serif;\n font-size: 14px;\n font-weight: 600;\n line-height: 19px;\n color: #2d2d2d;\n margin: 0;\n padding-top: 16px;\n padding-bottom: 16px;\n text-transform: capitalize;\n}\n.cweb-datepicker-calendar .react-datepicker__header .react-datepicker__header__dropdown {\n margin-bottom: 15px;\n}\n.cweb-datepicker-calendar .react-datepicker__header .react-datepicker__month-select,\n.cweb-datepicker-calendar .react-datepicker__header .react-datepicker__year-select {\n font-family: \"Inter\", \"Roboto\", sans-serif;\n font-size: 14px;\n font-weight: normal;\n line-height: 19px;\n color: #1e293b;\n margin: 0;\n height: 44px;\n padding-left: 12px;\n border-radius: 4px;\n background: #ffffff url(\"data:image/svg+xml,%3Csvg width%3D%228%22 height%3D%2214%22 viewBox%3D%220 0 8 14%22 fill%3D%22none%22 xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%3Cpath fill-rule%3D%22evenodd%22 clip-rule%3D%22evenodd%22 d%3D%22M4 0C4.26522 5.96046e-08 4.51957 0.105357 4.70711 0.292893L7.70711 3.29289C8.09763 3.68342 8.09763 4.31658 7.70711 4.70711C7.31658 5.09763 6.68342 5.09763 6.29289 4.70711L4 2.41421L1.70711 4.70711C1.31658 5.09763 0.683417 5.09763 0.292893 4.70711C-0.0976311 4.31658 -0.097631 3.68342 0.292893 3.29289L3.29289 0.292893C3.48043 0.105357 3.73478 0 4 0ZM0.292893 9.29289C0.683417 8.90237 1.31658 8.90237 1.70711 9.29289L4 11.5858L6.29289 9.29289C6.68342 8.90237 7.31658 8.90237 7.70711 9.29289C8.09763 9.68342 8.09763 10.3166 7.70711 10.7071L4.70711 13.7071C4.31658 14.0976 3.68342 14.0976 3.29289 13.7071L0.292893 10.7071C-0.0976311 10.3166 -0.0976311 9.68342 0.292893 9.29289Z%22 fill%3D%22%239CA3AF%22%2F%3E%3C%2Fsvg%3E\") no-repeat right 8px center;\n text-transform: capitalize;\n -webkit-appearance: none;\n -moz-appearance: none;\n border: 1px solid #cccccc;\n transition: all 0.4s ease;\n}\n.cweb-datepicker-calendar .react-datepicker__header .react-datepicker__month-select:hover, .cweb-datepicker-calendar .react-datepicker__header .react-datepicker__month-select:focus,\n.cweb-datepicker-calendar .react-datepicker__header .react-datepicker__year-select:hover,\n.cweb-datepicker-calendar .react-datepicker__header .react-datepicker__year-select:focus {\n color: #1e40af;\n border-color: #1e40af;\n cursor: pointer;\n}\n.cweb-datepicker-calendar .react-datepicker__header .react-datepicker__month-select {\n min-width: 172px;\n}\n.cweb-datepicker-calendar .react-datepicker__header .react-datepicker__year-select {\n min-width: 107px;\n}\n.cweb-datepicker-calendar .react-datepicker__header.react-datepicker__header--time {\n display: flex;\n justify-content: center;\n flex-direction: row;\n align-items: center;\n height: 52px;\n padding: 0;\n background-color: #f3f3f3;\n}\n.cweb-datepicker-calendar .react-datepicker__day-names,\n.cweb-datepicker-calendar .react-datepicker__month {\n margin: 0.4rem;\n}\n.cweb-datepicker-calendar .react-datepicker__day-names,\n.cweb-datepicker-calendar .react-datepicker__week {\n display: flex;\n justify-content: center;\n align-items: center;\n}\n.cweb-datepicker-calendar .react-datepicker__day-name,\n.cweb-datepicker-calendar .react-datepicker__day {\n font-family: \"Inter\", \"Roboto\", sans-serif;\n font-size: 14px;\n font-weight: normal;\n line-height: 19px;\n color: #1e293b;\n margin: 0;\n width: 41px;\n display: flex;\n justify-content: center;\n align-items: center;\n}\n.cweb-datepicker-calendar .react-datepicker__day-name {\n height: 19px;\n text-transform: capitalize;\n}\n.cweb-datepicker-calendar .react-datepicker__day {\n height: 30px;\n border-radius: 4px;\n transition: background-color 0.3s ease-in-out;\n}\n.cweb-datepicker-calendar .react-datepicker__day.react-datepicker__day--highlighted {\n background-color: #ffffff;\n color: #1e40af;\n position: relative;\n}\n.cweb-datepicker-calendar .react-datepicker__day.react-datepicker__day--highlighted:after {\n content: \"\";\n position: absolute;\n width: 4px;\n height: 4px;\n border-radius: 50%;\n background-color: #1e40af;\n left: 0;\n right: 0;\n bottom: 2px;\n margin: 0 auto;\n}\n.cweb-datepicker-calendar .react-datepicker__day.react-datepicker__day--highlighted.react-datepicker__day--selected:after, .cweb-datepicker-calendar .react-datepicker__day.react-datepicker__day--highlighted.react-datepicker__day--keyboard-selected:after, .cweb-datepicker-calendar .react-datepicker__day.react-datepicker__day--highlighted.react-datepicker__day--in-range:after {\n background-color: #ffffff;\n}\n.cweb-datepicker-calendar .react-datepicker__day.react-datepicker__day--today {\n font-weight: bold;\n}\n.cweb-datepicker-calendar .react-datepicker__day.react-datepicker__day--in-selecting-range {\n background-color: #e8f5fc;\n}\n.cweb-datepicker-calendar .react-datepicker__day:hover {\n background-color: #f8fafc;\n}\n.cweb-datepicker-calendar .react-datepicker__day.react-datepicker__day--in-range, .cweb-datepicker-calendar .react-datepicker__day.react-datepicker__day--selected {\n color: #ffffff;\n background-color: #1e40af;\n}\n.cweb-datepicker-calendar .react-datepicker__day.react-datepicker__day--in-range:hover, .cweb-datepicker-calendar .react-datepicker__day.react-datepicker__day--selected:hover {\n background-color: #1e40af;\n}\n.cweb-datepicker-calendar .react-datepicker__day.react-datepicker__day--keyboard-selected {\n color: #ffffff;\n background-color: #1e40af;\n}\n.cweb-datepicker-calendar .react-datepicker__day.react-datepicker__day--selected {\n position: relative;\n}\n.cweb-datepicker-calendar .react-datepicker__day.react-datepicker__day--range-start {\n position: relative;\n}\n.cweb-datepicker-calendar .react-datepicker__day.react-datepicker__day--range-start:before {\n content: \"\";\n position: absolute;\n top: -3px;\n left: 0;\n bottom: initial;\n right: initial;\n border-style: solid;\n border-width: 6px 6px 6px 0;\n border-color: transparent #ffffff transparent transparent;\n transform: rotate(45deg);\n}\n.cweb-datepicker-calendar .react-datepicker__day.react-datepicker__day--range-end {\n position: relative;\n}\n.cweb-datepicker-calendar .react-datepicker__day.react-datepicker__day--range-end:before {\n content: \"\";\n position: absolute;\n bottom: -3px;\n right: 0;\n left: initial;\n top: initial;\n border-style: solid;\n border-width: 6px 6px 6px 0;\n border-color: transparent #ffffff transparent transparent;\n transform: rotate(-135deg);\n}\n.cweb-datepicker-calendar .react-datepicker__day.react-datepicker__day--disabled {\n color: #cccccc;\n}\n.cweb-datepicker-calendar .react-datepicker__day.react-datepicker__day--disabled:hover {\n background-color: #ffffff;\n}\n.cweb-datepicker-calendar .react-datepicker__day.react-datepicker__day--outside-month {\n color: #cccccc;\n}";
|
|
2685
|
-
styleInject(css_248z$
|
|
2726
|
+
var css_248z$9 = "/**\n * --- DEPRECATED ---\n * DON'T USE ANYTHING FROM THIS FILE IN FUTURE CHANGES. WE SHOULD BE\n * USING TAILWIND CLASSES DIRECTLY IN OUR COMPONENTS.\n */\n.cweb-datepicker {\n width: 182px;\n height: 44px;\n border: 1px solid #cccccc;\n border-radius: 4px;\n background-color: #ffffff;\n outline: none;\n padding: 12px 12px 11px 12px;\n}\n.cweb-datepicker input.cweb-datepicker {\n font-size: 14px;\n}\n.cweb-datepicker::placeholder {\n color: #64748b;\n}\n.cweb-datepicker:-ms-input-placeholder {\n color: #64748b !important;\n}\n.cweb-datepicker::-ms-input-placeholder {\n color: #64748b;\n}\n\n.react-datepicker-popper[data-placement^=bottom] .react-datepicker__triangle.react-datepicker__triangle {\n border-bottom-color: #ffffff;\n margin-top: -4px;\n fill: #ffffff;\n color: #ffffff;\n}\n.react-datepicker-popper[data-placement^=top] {\n margin-bottom: 4px;\n}\n.react-datepicker-popper[data-placement^=top] .react-datepicker__triangle.react-datepicker__triangle {\n border-top-color: #ffffff;\n margin-bottom: -4px;\n fill: #ffffff;\n color: #ffffff;\n}\n.react-datepicker-popper .react-datepicker__children-container {\n width: 100%;\n margin: 0;\n}\n\n.cweb-datepicker-calendar {\n box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2);\n}\n@media screen and (-ms-high-contrast: active), (-ms-high-contrast: none) {\n .cweb-datepicker-calendar {\n box-shadow: 0 4px 8px 1px rgba(0, 0, 0, 0.2);\n }\n}\n.cweb-datepicker-calendar {\n padding: 0;\n border: 1px solid #cccccc;\n display: flex;\n flex-direction: column;\n justify-content: flex-start;\n align-items: center;\n}\n.cweb-datepicker-calendar .react-datepicker__triangle {\n left: 10px;\n border: 6px solid transparent;\n fill: #ffffff;\n color: #ffffff;\n}\n.cweb-datepicker-calendar .react-datepicker__navigation {\n top: 19px;\n width: 19px;\n height: 10px;\n}\n.cweb-datepicker-calendar .react-datepicker__navigation .react-datepicker__navigation-icon:before {\n border: 0;\n}\n.cweb-datepicker-calendar .react-datepicker__navigation.react-datepicker__navigation--previous {\n background: url(\"data:image/svg+xml,%3Csvg width%3D%2210%22 height%3D%227%22 xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E %3Cpath d%3D%22M0 1.5L1.5 0 5 3.5 8.5 0 10 1.5l-5 5z%22 fill%3D%22%231D9BD8%22 fill-rule%3D%22evenodd%22%2F%3E%3C%2Fsvg%3E\") no-repeat center;\n border: 0;\n transform: rotate(90deg);\n}\n.cweb-datepicker-calendar .react-datepicker__navigation.react-datepicker__navigation--next {\n background: url(\"data:image/svg+xml,%3Csvg width%3D%2210%22 height%3D%227%22 xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E %3Cpath d%3D%22M0 1.5L1.5 0 5 3.5 8.5 0 10 1.5l-5 5z%22 fill%3D%22%231D9BD8%22 fill-rule%3D%22evenodd%22%2F%3E%3C%2Fsvg%3E\") no-repeat center;\n border: 0;\n transform: rotate(-90deg);\n}\n.cweb-datepicker-calendar .react-datepicker__year-dropdown-container--select,\n.cweb-datepicker-calendar .react-datepicker__month-dropdown-container--select,\n.cweb-datepicker-calendar .react-datepicker__month-year-dropdown-container--select,\n.cweb-datepicker-calendar .react-datepicker__year-dropdown-container--scroll,\n.cweb-datepicker-calendar .react-datepicker__month-dropdown-container--scroll,\n.cweb-datepicker-calendar .react-datepicker__month-year-dropdown-container--scroll {\n margin: 2px;\n}\n.cweb-datepicker-calendar .react-datepicker__time-container .react-datepicker__time-box {\n width: auto;\n}\n.cweb-datepicker-calendar .react-datepicker__time-container .react-datepicker__time-list {\n overflow-x: hidden;\n}\n.cweb-datepicker-calendar .react-datepicker__time-container .react-datepicker__time-list-item {\n font-family: \"Inter\", \"Roboto\", sans-serif;\n font-size: 14px;\n font-weight: normal;\n line-height: 19px;\n color: #1e293b;\n margin: 0;\n display: flex;\n justify-content: center;\n flex-direction: row;\n align-items: center;\n height: 40px !important;\n padding: 0 !important;\n}\n.cweb-datepicker-calendar .react-datepicker__time-container .react-datepicker__time-list-item.react-datepicker__time-list-item--selected {\n color: #ffffff;\n background-color: #1e40af !important;\n position: relative;\n}\n.cweb-datepicker-calendar .react-datepicker__time-container .react-datepicker__time-list-item.react-datepicker__time-list-item--selected:hover {\n background-color: #1e40af !important;\n}\n.cweb-datepicker-calendar .react-datepicker__time-container .react-datepicker__time-list-item.react-datepicker__time-list-item--selected:before {\n content: \"\";\n position: absolute;\n bottom: -3px;\n right: 0;\n left: initial;\n top: initial;\n border-style: solid;\n border-width: 6px 6px 6px 0;\n border-color: transparent #ffffff transparent transparent;\n transform: rotate(-135deg);\n}\n.cweb-datepicker-calendar .react-datepicker__header {\n padding-top: 0;\n border: none;\n background-color: #ffffff;\n font-size: 14px;\n padding-bottom: 0;\n}\n.cweb-datepicker-calendar .react-datepicker__header .react-datepicker__current-month {\n font-family: \"Inter\", \"Roboto\", sans-serif;\n font-size: 14px;\n font-weight: 600;\n line-height: 19px;\n color: #2d2d2d;\n margin: 0;\n padding-top: 16px;\n padding-bottom: 16px;\n text-transform: capitalize;\n}\n.cweb-datepicker-calendar .react-datepicker__header .react-datepicker__header__dropdown {\n margin-bottom: 15px;\n}\n.cweb-datepicker-calendar .react-datepicker__header .react-datepicker__month-select,\n.cweb-datepicker-calendar .react-datepicker__header .react-datepicker__year-select {\n font-family: \"Inter\", \"Roboto\", sans-serif;\n font-size: 14px;\n font-weight: normal;\n line-height: 19px;\n color: #1e293b;\n margin: 0;\n height: 44px;\n padding-left: 12px;\n border-radius: 4px;\n background: #ffffff url(\"data:image/svg+xml,%3Csvg width%3D%228%22 height%3D%2214%22 viewBox%3D%220 0 8 14%22 fill%3D%22none%22 xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%3Cpath fill-rule%3D%22evenodd%22 clip-rule%3D%22evenodd%22 d%3D%22M4 0C4.26522 5.96046e-08 4.51957 0.105357 4.70711 0.292893L7.70711 3.29289C8.09763 3.68342 8.09763 4.31658 7.70711 4.70711C7.31658 5.09763 6.68342 5.09763 6.29289 4.70711L4 2.41421L1.70711 4.70711C1.31658 5.09763 0.683417 5.09763 0.292893 4.70711C-0.0976311 4.31658 -0.097631 3.68342 0.292893 3.29289L3.29289 0.292893C3.48043 0.105357 3.73478 0 4 0ZM0.292893 9.29289C0.683417 8.90237 1.31658 8.90237 1.70711 9.29289L4 11.5858L6.29289 9.29289C6.68342 8.90237 7.31658 8.90237 7.70711 9.29289C8.09763 9.68342 8.09763 10.3166 7.70711 10.7071L4.70711 13.7071C4.31658 14.0976 3.68342 14.0976 3.29289 13.7071L0.292893 10.7071C-0.0976311 10.3166 -0.0976311 9.68342 0.292893 9.29289Z%22 fill%3D%22%239CA3AF%22%2F%3E%3C%2Fsvg%3E\") no-repeat right 8px center;\n text-transform: capitalize;\n -webkit-appearance: none;\n -moz-appearance: none;\n border: 1px solid #cccccc;\n transition: all 0.4s ease;\n}\n.cweb-datepicker-calendar .react-datepicker__header .react-datepicker__month-select:hover, .cweb-datepicker-calendar .react-datepicker__header .react-datepicker__month-select:focus,\n.cweb-datepicker-calendar .react-datepicker__header .react-datepicker__year-select:hover,\n.cweb-datepicker-calendar .react-datepicker__header .react-datepicker__year-select:focus {\n color: #1e40af;\n border-color: #1e40af;\n cursor: pointer;\n}\n.cweb-datepicker-calendar .react-datepicker__header .react-datepicker__month-select {\n min-width: 172px;\n}\n.cweb-datepicker-calendar .react-datepicker__header .react-datepicker__year-select {\n min-width: 107px;\n}\n.cweb-datepicker-calendar .react-datepicker__header.react-datepicker__header--time {\n display: flex;\n justify-content: center;\n flex-direction: row;\n align-items: center;\n height: 52px;\n padding: 0;\n background-color: #f3f3f3;\n}\n.cweb-datepicker-calendar .react-datepicker__day-names,\n.cweb-datepicker-calendar .react-datepicker__month {\n margin: 0.4rem;\n}\n.cweb-datepicker-calendar .react-datepicker__day-names,\n.cweb-datepicker-calendar .react-datepicker__week {\n display: flex;\n justify-content: center;\n align-items: center;\n}\n.cweb-datepicker-calendar .react-datepicker__day-name,\n.cweb-datepicker-calendar .react-datepicker__day {\n font-family: \"Inter\", \"Roboto\", sans-serif;\n font-size: 14px;\n font-weight: normal;\n line-height: 19px;\n color: #1e293b;\n margin: 0;\n width: 41px;\n display: flex;\n justify-content: center;\n align-items: center;\n}\n.cweb-datepicker-calendar .react-datepicker__day-name {\n height: 19px;\n text-transform: capitalize;\n}\n.cweb-datepicker-calendar .react-datepicker__day {\n height: 30px;\n border-radius: 4px;\n transition: background-color 0.3s ease-in-out;\n}\n.cweb-datepicker-calendar .react-datepicker__day.react-datepicker__day--highlighted {\n background-color: #ffffff;\n color: #1e40af;\n position: relative;\n}\n.cweb-datepicker-calendar .react-datepicker__day.react-datepicker__day--highlighted:after {\n content: \"\";\n position: absolute;\n width: 4px;\n height: 4px;\n border-radius: 50%;\n background-color: #1e40af;\n left: 0;\n right: 0;\n bottom: 2px;\n margin: 0 auto;\n}\n.cweb-datepicker-calendar .react-datepicker__day.react-datepicker__day--highlighted.react-datepicker__day--selected:after, .cweb-datepicker-calendar .react-datepicker__day.react-datepicker__day--highlighted.react-datepicker__day--keyboard-selected:after, .cweb-datepicker-calendar .react-datepicker__day.react-datepicker__day--highlighted.react-datepicker__day--in-range:after {\n background-color: #ffffff;\n}\n.cweb-datepicker-calendar .react-datepicker__day.react-datepicker__day--today {\n font-weight: bold;\n}\n.cweb-datepicker-calendar .react-datepicker__day.react-datepicker__day--in-selecting-range {\n background-color: #e8f5fc;\n}\n.cweb-datepicker-calendar .react-datepicker__day:hover {\n background-color: #f8fafc;\n}\n.cweb-datepicker-calendar .react-datepicker__day.react-datepicker__day--in-range, .cweb-datepicker-calendar .react-datepicker__day.react-datepicker__day--selected {\n color: #ffffff;\n background-color: #1e40af;\n}\n.cweb-datepicker-calendar .react-datepicker__day.react-datepicker__day--in-range:hover, .cweb-datepicker-calendar .react-datepicker__day.react-datepicker__day--selected:hover {\n background-color: #1e40af;\n}\n.cweb-datepicker-calendar .react-datepicker__day.react-datepicker__day--keyboard-selected {\n color: #ffffff;\n background-color: #1e40af;\n}\n.cweb-datepicker-calendar .react-datepicker__day.react-datepicker__day--selected {\n position: relative;\n}\n.cweb-datepicker-calendar .react-datepicker__day.react-datepicker__day--range-start {\n position: relative;\n}\n.cweb-datepicker-calendar .react-datepicker__day.react-datepicker__day--range-start:before {\n content: \"\";\n position: absolute;\n top: -3px;\n left: 0;\n bottom: initial;\n right: initial;\n border-style: solid;\n border-width: 6px 6px 6px 0;\n border-color: transparent #ffffff transparent transparent;\n transform: rotate(45deg);\n}\n.cweb-datepicker-calendar .react-datepicker__day.react-datepicker__day--range-end {\n position: relative;\n}\n.cweb-datepicker-calendar .react-datepicker__day.react-datepicker__day--range-end:before {\n content: \"\";\n position: absolute;\n bottom: -3px;\n right: 0;\n left: initial;\n top: initial;\n border-style: solid;\n border-width: 6px 6px 6px 0;\n border-color: transparent #ffffff transparent transparent;\n transform: rotate(-135deg);\n}\n.cweb-datepicker-calendar .react-datepicker__day.react-datepicker__day--disabled {\n color: #cccccc;\n}\n.cweb-datepicker-calendar .react-datepicker__day.react-datepicker__day--disabled:hover {\n background-color: #ffffff;\n}\n.cweb-datepicker-calendar .react-datepicker__day.react-datepicker__day--outside-month {\n color: #cccccc;\n}";
|
|
2727
|
+
styleInject(css_248z$9);
|
|
2686
2728
|
|
|
2687
2729
|
function updateLocale(locale) {
|
|
2688
2730
|
const resolvedLocale = locale !== null && locale !== void 0 ? locale : "en-GB";
|
|
@@ -2731,8 +2773,8 @@ var img$2 = "data:image/svg+xml,%3csvg width='8' height='14' viewBox='0 0 8 14'
|
|
|
2731
2773
|
|
|
2732
2774
|
var img$1 = "data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 16 16'%3e %3cg transform='translate(1.5%2c 0.5)'%3e %3cpath fill='none' fill-rule='evenodd' stroke='%230074DD' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='M12.643 3.357L6.03 9.97l-2.674 2.674L0 9.286'/%3e %3c/g%3e%3c/svg%3e";
|
|
2733
2775
|
|
|
2734
|
-
var css_248z$
|
|
2735
|
-
styleInject(css_248z$
|
|
2776
|
+
var css_248z$8 = "/**\n * --- DEPRECATED ---\n * DON'T USE ANYTHING FROM THIS FILE IN FUTURE CHANGES. WE SHOULD BE\n * USING TAILWIND CLASSES DIRECTLY IN OUR COMPONENTS.\n */\n.cweb-dropdown {\n display: flex;\n justify-content: flex-start;\n flex-direction: column;\n align-items: flex-start;\n position: relative;\n outline: none;\n border-radius: 4px;\n}\n.cweb-dropdown:focus {\n outline: 4px solid rgba(0, 159, 227, 0.3);\n}\n.cweb-dropdown > .dropdown-header {\n display: flex;\n justify-content: space-between;\n flex-direction: row;\n align-items: center;\n align-self: stretch;\n height: 44px;\n border-radius: 4px;\n transition: all 0.4s ease;\n}\n.cweb-dropdown > .dropdown-header > .dropdown-header-icon {\n opacity: 0.5;\n transition: opacity 0.3s ease-in-out;\n}\n.cweb-dropdown > .dropdown-header:hover > .dropdown-header-icon {\n opacity: 1;\n}\n.cweb-dropdown > .dropdown-list {\n box-shadow: 0px 2px 4px -2px rgba(0, 0, 0, 0.56);\n display: none;\n position: absolute;\n top: 100%;\n z-index: 1;\n width: 100%;\n max-height: 360px;\n overflow-y: auto;\n align-self: stretch;\n margin-top: 8px;\n padding: 0;\n background-color: #ffffff;\n list-style: none;\n border: 1px solid #d1d5db;\n border-radius: 4px;\n}\n.cweb-dropdown > .dropdown-list > .dropdown-list-item {\n cursor: pointer;\n}\n.cweb-dropdown > .dropdown-list > .dropdown-list-item-group > .dropdown-list-item {\n cursor: pointer;\n}\n.cweb-dropdown.is-open > .dropdown-list {\n display: block;\n margin-bottom: 32px;\n}\n.cweb-dropdown.is-open > .dropdown-list.wider {\n width: 200%;\n}";
|
|
2777
|
+
styleInject(css_248z$8);
|
|
2736
2778
|
|
|
2737
2779
|
var __defProp = Object.defineProperty;
|
|
2738
2780
|
var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
|
|
@@ -3596,8 +3638,8 @@ const PaginationMenuSmall = (props) => {
|
|
|
3596
3638
|
return jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [jsxRuntime.jsx(TertiaryButton, { "data-test-id": "prev-button", leadingIcon: jsxRuntime.jsx(LeftArrowIcon, {}), "data-page": props.currentPageNumber - 1, onClick: handleOnChange, disabled: props.currentPageNumber === 1 }), jsxRuntime.jsx(Text, { className: "ui:ml-4", variant: "sm", color: "slate-500", children: `${props.currentPageNumber} / ${props.pageCount}` }), jsxRuntime.jsx(TertiaryButton, { className: "ui:ml-4", "data-test-id": "next-button", leadingIcon: jsxRuntime.jsx(ChevronRightIcon, {}), disabled: props.currentPageNumber === props.pageCount, "data-page": props.currentPageNumber + 1, onClick: handleOnChange })] });
|
|
3597
3639
|
};
|
|
3598
3640
|
|
|
3599
|
-
var css_248z$
|
|
3600
|
-
styleInject(css_248z$
|
|
3641
|
+
var css_248z$7 = ".styled-select {\n appearance: none;\n}\n.styled-select::picker-icon {\n appearance: none;\n}";
|
|
3642
|
+
styleInject(css_248z$7);
|
|
3601
3643
|
|
|
3602
3644
|
const StyledSelect = React__namespace.default.forwardRef((_a, ref) => {
|
|
3603
3645
|
var { children, suffix, prefix, className, width = "full", height = "lg", isError } = _a, attributes = __rest(_a, ["children", "suffix", "prefix", "className", "width", "height", "isError"]);
|
|
@@ -4167,8 +4209,8 @@ const NavLayout = (props) => {
|
|
|
4167
4209
|
}), children })] })] })] }));
|
|
4168
4210
|
};
|
|
4169
4211
|
|
|
4170
|
-
var css_248z$
|
|
4171
|
-
styleInject(css_248z$
|
|
4212
|
+
var css_248z$6 = ".cweb-page {\n width: 100%;\n max-width: 1140px;\n margin: 32px auto 0 auto;\n}\n.cweb-page .cweb-page-breadcrumbs {\n margin-bottom: 16px;\n}\n.cweb-page .page-spinner {\n margin-left: 8px;\n margin-bottom: 4px;\n}\n.cweb-page .page-spinner img {\n width: 21px;\n}\n.cweb-page .cweb-page-header {\n display: flex;\n align-items: center;\n width: 100%;\n flex-grow: 0;\n}\n.cweb-page .cweb-page-header .cweb-page-title {\n display: inline;\n}\n.cweb-page .cweb-page-header.accessory-right {\n flex-direction: row;\n justify-content: space-between;\n align-items: center;\n}\n@media screen and (max-width: 426px) {\n .cweb-page .cweb-page-header.accessory-bottom {\n max-width: 75vw;\n }\n .cweb-page .cweb-page-header.accessory-bottom img {\n max-width: 10vw;\n }\n .cweb-page .cweb-page-header.accessory-bottom button p {\n font-size: 4vw;\n }\n}\n.cweb-page .cweb-page-header.accessory-bottom {\n flex-direction: column;\n align-items: flex-start;\n}\n.cweb-page .cweb-page-header.accessory-bottom .cweb-page-title {\n margin-bottom: 8px;\n display: inline;\n}";
|
|
4213
|
+
styleInject(css_248z$6);
|
|
4172
4214
|
|
|
4173
4215
|
function Page({
|
|
4174
4216
|
dataTestId = "page",
|
|
@@ -4512,8 +4554,8 @@ const Section = (_a) => {
|
|
|
4512
4554
|
}), children: isLoading ? null : children }), footer && jsxRuntime.jsx(SectionFooter, { children: footer })] }));
|
|
4513
4555
|
};
|
|
4514
4556
|
|
|
4515
|
-
var css_248z$
|
|
4516
|
-
styleInject(css_248z$
|
|
4557
|
+
var css_248z$5 = "/**\n * --- DEPRECATED ---\n * DON'T USE ANYTHING FROM THIS FILE IN FUTURE CHANGES. WE SHOULD BE\n * USING TAILWIND CLASSES DIRECTLY IN OUR COMPONENTS.\n */\n.cweb-list-item {\n display: flex;\n justify-content: flex-start;\n flex-direction: row;\n align-items: center;\n padding: 16px 0 16px 0;\n border-bottom: 1px solid #eeeeee;\n}\n.cweb-list-item:last-child {\n border-bottom: none;\n}\n.cweb-list-item.cweb-list-item-clickable {\n cursor: pointer;\n}\n.cweb-list-item.cweb-list-item-clickable:hover {\n background-color: #f2fafd;\n}";
|
|
4558
|
+
styleInject(css_248z$5);
|
|
4517
4559
|
|
|
4518
4560
|
const SectionItem = (props) => {
|
|
4519
4561
|
const { children, className, onClick } = props, rest = __rest(props, ["children", "className", "onClick"]);
|
|
@@ -4530,8 +4572,8 @@ function SectionItemWithContent(props) {
|
|
|
4530
4572
|
return jsxRuntime.jsxs(SectionItem, Object.assign({ className: mergedClasses, onClick }, rest, { children: [icon && jsxRuntime.jsx("img", { className: iconClasses, src: icon, alt: "" }), jsxRuntime.jsx(Text, { text })] }));
|
|
4531
4573
|
}
|
|
4532
4574
|
|
|
4533
|
-
var css_248z$
|
|
4534
|
-
styleInject(css_248z$
|
|
4575
|
+
var css_248z$4 = ".customized-select [class*=MenuList] [class*=option]::after {\n position: absolute;\n content: \"\";\n background: url(\"data:image/svg+xml,%3Csvg xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22 width%3D%2216%22 height%3D%2216%22 viewBox%3D%220 0 16 16%22%3E %3Cg transform%3D%22translate(1.5%2C 0.5)%22%3E %3Cpath fill%3D%22none%22 fill-rule%3D%22evenodd%22 stroke%3D%22%230074DD%22 stroke-linecap%3D%22round%22 stroke-linejoin%3D%22round%22 stroke-width%3D%222%22 d%3D%22M12.643 3.357L6.03 9.97l-2.674 2.674L0 9.286%22%2F%3E %3C%2Fg%3E%3C%2Fsvg%3E\") no-repeat center;\n right: 12px;\n height: 1rem;\n width: 1rem;\n}";
|
|
4576
|
+
styleInject(css_248z$4);
|
|
4535
4577
|
|
|
4536
4578
|
const SelectDropdownIndicator = (props) => jsxRuntime.jsx(ReactSelect.components.DropdownIndicator, Object.assign({}, props, { children: jsxRuntime.jsx(ChevronDownIcon, {}) }));
|
|
4537
4579
|
|
|
@@ -4712,8 +4754,8 @@ const SettingsMenuButton = (props) => {
|
|
|
4712
4754
|
}), children: [menuTitle && jsxRuntime.jsx("div", { className: "ui:h-11 ui:w-full ui:bg-slate-50 ui:p-3", children: jsxRuntime.jsx(Text, { type: "sm", className: "ui:uppercase", text: menuTitle }) }), innerConfiguration.map((innerConfig) => jsxRuntime.jsxs("div", { className: "ui:flex ui:h-11 ui:w-full ui:items-center ui:justify-between ui:p-3", children: [jsxRuntime.jsx(Text, { text: innerConfig.itemName }), jsxRuntime.jsx(Checkbox, { name: innerConfig.itemName, id: innerConfig.itemId, type: "switch", isChecked: innerConfig.on, onChange: handleOnVisibilitySwitchChanged })] }, innerConfig.itemId))] })] });
|
|
4713
4755
|
};
|
|
4714
4756
|
|
|
4715
|
-
var css_248z$
|
|
4716
|
-
styleInject(css_248z$
|
|
4757
|
+
var css_248z$3 = "/**\n * --- DEPRECATED ---\n * DON'T USE ANYTHING FROM THIS FILE IN FUTURE CHANGES. WE SHOULD BE\n * USING TAILWIND CLASSES DIRECTLY IN OUR COMPONENTS.\n */\n.cweb-switcher-item {\n display: flex;\n justify-content: center;\n flex-direction: row;\n align-items: center;\n}\n.cweb-switcher-item .cweb-switcher-item-link {\n display: flex;\n align-items: center;\n text-decoration: none;\n padding: 0.5rem 1rem;\n cursor: pointer;\n}\n.cweb-switcher-item .cweb-switcher-item-link .cweb-switcher-item-link-icon {\n display: flex;\n align-items: center;\n}\n.cweb-switcher-item .cweb-switcher-item-link .cweb-switcher-item-link-icon .cweb-switcher-item-link-icon-default,\n.cweb-switcher-item .cweb-switcher-item-link .cweb-switcher-item-link-icon .cweb-switcher-item-link-icon-active {\n width: 20px;\n height: 20px;\n}\n.cweb-switcher-item .cweb-switcher-item-link .cweb-switcher-item-link-icon .cweb-switcher-item-link-icon-active {\n display: none;\n}\n.cweb-switcher-item .cweb-switcher-item-link .cweb-switcher-item-link-text {\n color: #737373;\n transition: color 0.4s ease;\n padding-bottom: 0;\n}\n.cweb-switcher-item .cweb-switcher-item-link .cweb-switcher-item-link-icon + .cweb-switcher-item-link-text {\n margin-left: 8px;\n padding: 0;\n}\n.cweb-switcher-item.is-selected, .cweb-switcher-item:hover, .cweb-switcher-item:active {\n border-color: #1e40af;\n z-index: 1;\n}\n.cweb-switcher-item.is-selected .cweb-switcher-item-link .cweb-switcher-item-link-icon .cweb-switcher-item-link-icon-default, .cweb-switcher-item:hover .cweb-switcher-item-link .cweb-switcher-item-link-icon .cweb-switcher-item-link-icon-default, .cweb-switcher-item:active .cweb-switcher-item-link .cweb-switcher-item-link-icon .cweb-switcher-item-link-icon-default {\n display: none;\n}\n.cweb-switcher-item.is-selected .cweb-switcher-item-link .cweb-switcher-item-link-icon .cweb-switcher-item-link-icon-active, .cweb-switcher-item:hover .cweb-switcher-item-link .cweb-switcher-item-link-icon .cweb-switcher-item-link-icon-active, .cweb-switcher-item:active .cweb-switcher-item-link .cweb-switcher-item-link-icon .cweb-switcher-item-link-icon-active {\n display: inherit;\n}\n.cweb-switcher-item.is-selected .cweb-switcher-item-link .cweb-switcher-item-link-text, .cweb-switcher-item:hover .cweb-switcher-item-link .cweb-switcher-item-link-text, .cweb-switcher-item:active .cweb-switcher-item-link .cweb-switcher-item-link-text {\n color: #1e40af;\n}\n.cweb-switcher-item.is-disabled {\n pointer-events: none;\n}";
|
|
4758
|
+
styleInject(css_248z$3);
|
|
4717
4759
|
|
|
4718
4760
|
SwitcherItem.propTypes = {
|
|
4719
4761
|
name: PropTypes__default.default.string,
|
|
@@ -5126,8 +5168,8 @@ const MediaPicker = React__namespace.default.forwardRef((props, ref) => {
|
|
|
5126
5168
|
|
|
5127
5169
|
const TagGroup = ({ children, tags, tagSize = "base", className }) => jsxRuntime.jsxs("div", { className: classNames__default.default("ui:flex ui:flex-row ui:flex-wrap ui:gap-2", className), children: [children, tags === null || tags === void 0 ? void 0 : tags.map((tag) => jsxRuntime.jsx(Tag, Object.assign({ size: tagSize }, tag)))] });
|
|
5128
5170
|
|
|
5129
|
-
var css_248z$
|
|
5130
|
-
styleInject(css_248z$
|
|
5171
|
+
var css_248z$2 = "/*! tailwindcss v4.1.12 | MIT License | https://tailwindcss.com */\n.cweb-textarea {\n resize: none;\n background-color: field;\n}\n.cweb-textarea.has-icon {\n background-size: 24px;\n background-position: 10px 10px;\n background-repeat: no-repeat;\n padding-left: 44px;\n}\n.cweb-textarea.resizable {\n resize: both;\n}\n.cweb-textarea.resizable-x {\n resize: horizontal;\n}\n.cweb-textarea.resizable-y {\n resize: vertical;\n}\n.cweb-textarea:focus {\n border-color: var(--color-primary);\n}\n.cweb-textarea:disabled {\n cursor: not-allowed;\n}\n.cweb-textarea.has-error {\n border: 1px solid #b91c1c;\n color: #991b1b;\n}";
|
|
5172
|
+
styleInject(css_248z$2);
|
|
5131
5173
|
|
|
5132
5174
|
const resizeTypes = {
|
|
5133
5175
|
BOTH: "both",
|
|
@@ -5189,8 +5231,8 @@ const Textarea = React__namespace.default.forwardRef((_a, ref) => {
|
|
|
5189
5231
|
]), style, ref }));
|
|
5190
5232
|
});
|
|
5191
5233
|
|
|
5192
|
-
var css_248z = "/**\n * --- DEPRECATED ---\n * DON'T USE ANYTHING FROM THIS FILE IN FUTURE CHANGES. WE SHOULD BE\n * USING TAILWIND CLASSES DIRECTLY IN OUR COMPONENTS.\n */\n.ql-editor {\n resize: vertical;\n min-height: 10rem;\n}\n\n.ql-snow.ql-toolbar {\n display: block;\n background: #f1f5f9;\n border-top-left-radius: 0.5em;\n border-top-right-radius: 0.5em;\n margin-top: 0.5em;\n}";
|
|
5193
|
-
styleInject(css_248z);
|
|
5234
|
+
var css_248z$1 = "/**\n * --- DEPRECATED ---\n * DON'T USE ANYTHING FROM THIS FILE IN FUTURE CHANGES. WE SHOULD BE\n * USING TAILWIND CLASSES DIRECTLY IN OUR COMPONENTS.\n */\n.ql-editor {\n resize: vertical;\n min-height: 10rem;\n}\n\n.ql-snow.ql-toolbar {\n display: block;\n background: #f1f5f9;\n border-top-left-radius: 0.5em;\n border-top-right-radius: 0.5em;\n margin-top: 0.5em;\n}";
|
|
5235
|
+
styleInject(css_248z$1);
|
|
5194
5236
|
|
|
5195
5237
|
const TextEditor = (_a) => {
|
|
5196
5238
|
var { defaultValue, formats, toolbar = [
|
|
@@ -5244,6 +5286,20 @@ const TextLink = (props) => {
|
|
|
5244
5286
|
return jsxRuntime.jsx("a", { href: props.href, rel: props.rel, target: props.target, onClick: props.onClick, className: classNames__default.default(className, props.className), children: props.text });
|
|
5245
5287
|
};
|
|
5246
5288
|
|
|
5289
|
+
var css_248z = "@font-face {\n font-family: \"Avenir Next\";\n font-weight: 600;\n src: url(\"../../../public/fonts/avenir/3A0AF8_0_0.eot\");\n src:\n url(\"../../../public/fonts/avenir/3A0AF8_0_0.eot\")\n format(\"embedded-opentype\"),\n url(\"../../../public/fonts/avenir/3A0AF8_0_0.woff2\") format(\"woff2\"),\n url(\"../../../public/fonts/avenir/3A0AF8_0_0.woff\") format(\"woff\"),\n url(\"../../../public/fonts/avenir/3A0AF8_0_0.ttf\") format(\"truetype\");\n}\n";
|
|
5290
|
+
styleInject(css_248z);
|
|
5291
|
+
|
|
5292
|
+
const variantClasses = {
|
|
5293
|
+
h1: "ui-typo-h1 ui:text-text-brand-primary-default",
|
|
5294
|
+
h2: "ui-typo-h2 ui:text-text-neutral-primary-default",
|
|
5295
|
+
h3: "ui-typo-h3 ui:text-text-neutral-primary-default",
|
|
5296
|
+
h4: "ui-typo-h4 ui:text-text-neutral-primary-default"
|
|
5297
|
+
};
|
|
5298
|
+
const Heading = (_a) => {
|
|
5299
|
+
var { as: Element = "h2", variant = "h2", className, children } = _a, rest = __rest(_a, ["as", "variant", "className", "children"]);
|
|
5300
|
+
return jsxRuntime.jsx(Element, Object.assign({ className: classNames__default.default(variantClasses[variant], className) }, rest, { children }));
|
|
5301
|
+
};
|
|
5302
|
+
|
|
5247
5303
|
const TimelineStep = React__namespace.default.forwardRef(({ content, type = "base", dataTestId, title }, ref) => {
|
|
5248
5304
|
const isWideStep = type === "wide";
|
|
5249
5305
|
const borderClassNames = "ui:ml-4 ui:pl-6 ui:border-primary ui:border-l-2";
|
|
@@ -6711,6 +6767,7 @@ exports.GroupOfThreeIcon = GroupOfThreeIcon;
|
|
|
6711
6767
|
exports.HamburgerIcon = HamburgerIcon;
|
|
6712
6768
|
exports.HandUp = HandUp;
|
|
6713
6769
|
exports.HandshakeIcon = HandshakeIcon;
|
|
6770
|
+
exports.Heading = Heading;
|
|
6714
6771
|
exports.HeartIcon = HeartIcon;
|
|
6715
6772
|
exports.HeartMinusIcon = HeartMinusIcon;
|
|
6716
6773
|
exports.HelperAndErrorText = HelperAndErrorText;
|