@luscii-healthtech/web-ui 56.1.0 → 56.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/dist/index.development.js +60 -60
- 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/Radio/LabeledRadioCard.d.ts +1 -1
- package/dist/src/generated/components/Radio/LabeledRadioCard.d.ts +1 -1
- package/dist/web-ui.esm.js +1 -1
- package/dist/web-ui.esm.js.map +1 -1
- package/package.json +1 -1
|
@@ -1513,7 +1513,7 @@ const BaseListItem = React__namespace.default.forwardRef(({ itemId, title, toolt
|
|
|
1513
1513
|
title,
|
|
1514
1514
|
subtitle,
|
|
1515
1515
|
icon
|
|
1516
|
-
}, onAssetLoadError) }), jsxRuntime.jsxs("div", { className: "ui:py-4", children: [typeof title === "string" ? jsxRuntime.jsx(Text, { variant: isSelected ? "strong" : "base", children: title }) : title, subtitle && (typeof subtitle === "string" ? jsxRuntime.jsx(Text, { variant: "sm", color: "slate-500", children: subtitle }) : subtitle)] }), jsxRuntime.jsx("div", { className: "ui:grow" }), jsxRuntime.jsx(Stack, { axis: "x",
|
|
1516
|
+
}, onAssetLoadError) }), jsxRuntime.jsxs("div", { className: "ui:py-4", children: [typeof title === "string" ? jsxRuntime.jsx(Text, { variant: isSelected ? "strong" : "base", children: title }) : title, subtitle && (typeof subtitle === "string" ? jsxRuntime.jsx(Text, { variant: "sm", color: "slate-500", children: subtitle }) : subtitle)] }), jsxRuntime.jsx("div", { className: "ui:grow" }), jsxRuntime.jsx(Stack, { axis: "x", _gap: "base", align: "center", className: classNames__default.default({
|
|
1517
1517
|
"ui:opacity-0": onlyShowAccessoriesOnHover,
|
|
1518
1518
|
"ui:group-hover:opacity-100": onlyShowAccessoriesOnHover
|
|
1519
1519
|
}), children: accessories })] }));
|
|
@@ -1639,7 +1639,7 @@ const DefaultList = (_a) => {
|
|
|
1639
1639
|
});
|
|
1640
1640
|
};
|
|
1641
1641
|
const composeIconWithChevron = (parentItem, isExpanded) => {
|
|
1642
|
-
return jsxRuntime.jsxs(Stack, { axis: "x",
|
|
1642
|
+
return jsxRuntime.jsxs(Stack, { axis: "x", _gap: "m", align: "center", children: [jsxRuntime.jsx("button", { type: "button", "aria-expanded": isExpanded, onClick: (e) => {
|
|
1643
1643
|
e.stopPropagation();
|
|
1644
1644
|
toggleExpand(parentItem.itemId);
|
|
1645
1645
|
}, onKeyDown: (e) => {
|
|
@@ -1856,7 +1856,7 @@ const Content$2 = (_a) => {
|
|
|
1856
1856
|
return "ui:fill-secondary-background";
|
|
1857
1857
|
}
|
|
1858
1858
|
};
|
|
1859
|
-
return jsxRuntime.jsx(Tooltip__namespace.Portal, { container, children: jsxRuntime.jsxs(Tooltip__namespace.Content, Object.assign({ className: classNames__default.default(className, "ui:max-w-55", "ui:z-20", "ui:data-[state=delayed-open]:animate-in ui:data-[state=closed]:animate-out ui:data-[state=closed]:fade-out-0 ui:data-[state=delayed-open]:fade-in-0 ui:data-[state=closed]:zoom-out-95 ui:data-[state=delayed-open]:zoom-in-95 ui:data-[side=bottom]:slide-in-from-top-2 ui:data-[side=left]:slide-in-from-right-2 ui:data-[side=right]:slide-in-from-left-2 ui:data-[side=top]:slide-in-from-bottom-2"), sideOffset: 4 }, contentProps, { children: [jsxRuntime.jsx(Box, { backgroundColor: getBackgroundColor(),
|
|
1859
|
+
return jsxRuntime.jsx(Tooltip__namespace.Portal, { container, children: jsxRuntime.jsxs(Tooltip__namespace.Content, Object.assign({ className: classNames__default.default(className, "ui:max-w-55", "ui:z-20", "ui:data-[state=delayed-open]:animate-in ui:data-[state=closed]:animate-out ui:data-[state=closed]:fade-out-0 ui:data-[state=delayed-open]:fade-in-0 ui:data-[state=closed]:zoom-out-95 ui:data-[state=delayed-open]:zoom-in-95 ui:data-[side=bottom]:slide-in-from-top-2 ui:data-[side=left]:slide-in-from-right-2 ui:data-[side=right]:slide-in-from-left-2 ui:data-[side=top]:slide-in-from-bottom-2"), sideOffset: 4 }, contentProps, { children: [jsxRuntime.jsx(Box, { backgroundColor: getBackgroundColor(), _px: "l", _py: "m", borderRadius: "xxxxs", children }), jsxRuntime.jsx(Tooltip__namespace.Arrow, { width: 8, height: 8, className: getArrowBackgroundColor() })] })) });
|
|
1860
1860
|
};
|
|
1861
1861
|
Content$2.displayName = "Tooltip.Content";
|
|
1862
1862
|
const Root$1 = (props) => jsxRuntime.jsx(Tooltip__namespace.Root, Object.assign({}, props));
|
|
@@ -2004,7 +2004,7 @@ const CenteredHero = ({ title, text, image, slots, background = "slate-50", imag
|
|
|
2004
2004
|
}), "data-test-id": dataTestId, children: [image && jsxRuntime.jsx("img", { src: image, className: classNames__default.default("ui:mb-4", {
|
|
2005
2005
|
"ui:max-h-36": imageSize === "small",
|
|
2006
2006
|
"ui:max-h-72": imageSize === "large"
|
|
2007
|
-
}) }), title && jsxRuntime.jsx(Title, { variant: "base", children: title }), text && jsxRuntime.jsx(Text, { className: "ui:text-center", children: text }), (slots === null || slots === void 0 ? void 0 : slots.bottom) && jsxRuntime.jsx(Box, {
|
|
2007
|
+
}) }), title && jsxRuntime.jsx(Title, { variant: "base", children: title }), text && jsxRuntime.jsx(Text, { className: "ui:text-center", children: text }), (slots === null || slots === void 0 ? void 0 : slots.bottom) && jsxRuntime.jsx(Box, { _mt: "l", children: slots === null || slots === void 0 ? void 0 : slots.bottom })] });
|
|
2008
2008
|
};
|
|
2009
2009
|
|
|
2010
2010
|
const AccordionListActions = (props) => {
|
|
@@ -2206,7 +2206,7 @@ function ChatBubble(props) {
|
|
|
2206
2206
|
}, transitionClasses, className), children: jsxRuntime.jsxs("div", { className: classNames__default.default("ui:transition-colors ui:duration-150 ui:ease-out", backgroundColorClasses, "ui:relative ui:grid ui:p-m ui:radius-m", {
|
|
2207
2207
|
"ui:group-hover/chat-bubble:bg-blue-50": isInteractive && color === "blue",
|
|
2208
2208
|
"ui:group-hover/chat-bubble:bg-slate-50": isInteractive && color === "grey"
|
|
2209
|
-
}), children: [jsxRuntime.jsx("div", { className: classNames__default.default(tipColorClasses, tipPositionClasses, transitionClasses, "ui:absolute ui:h-[11px] ui:w-[11px] ui:transform ui:border-11") }), jsxRuntime.jsx(Meta, Object.assign({}, props)), jsxRuntime.jsxs(Stack, { width: "full",
|
|
2209
|
+
}), children: [jsxRuntime.jsx("div", { className: classNames__default.default(tipColorClasses, tipPositionClasses, transitionClasses, "ui:absolute ui:h-[11px] ui:w-[11px] ui:transform ui:border-11") }), jsxRuntime.jsx(Meta, Object.assign({}, props)), jsxRuntime.jsxs(Stack, { width: "full", _gap: "base", children: [jsxRuntime.jsx(Content$1, { children }), readReceipt || footerAccessory ? jsxRuntime.jsxs(Stack, { axis: "x", _gap: "base", align: "center", divider: jsxRuntime.jsx(Text, { as: "span", color: "on-surface-variant", children: "\u2022" }), children: [readReceipt && jsxRuntime.jsx(Text, { variant: "sm", children: readReceipt }), footerAccessory] }) : null] })] }) }));
|
|
2210
2210
|
}
|
|
2211
2211
|
function Meta(props) {
|
|
2212
2212
|
const { sender, timestamp } = props;
|
|
@@ -2335,7 +2335,7 @@ function MoreAvatarsLabel(props) {
|
|
|
2335
2335
|
if (amountOfAvatars <= maxAvatars) {
|
|
2336
2336
|
return null;
|
|
2337
2337
|
}
|
|
2338
|
-
return jsxRuntime.jsx(Box, {
|
|
2338
|
+
return jsxRuntime.jsx(Box, { _ml: "s", children: jsxRuntime.jsx(Text, { variant: "medium", color: "on-surface-variant", children: moreAvatarsLabel(amountOfAvatars - maxAvatars) }) });
|
|
2339
2339
|
}
|
|
2340
2340
|
|
|
2341
2341
|
const Badge = (props) => {
|
|
@@ -2399,7 +2399,7 @@ const DotButton = (_a) => {
|
|
|
2399
2399
|
};
|
|
2400
2400
|
const DotList = ({ activeIndex, amount, onClickIndex, buttonLabel }) => {
|
|
2401
2401
|
const items = Array.from({ length: amount }).map((_, i) => i);
|
|
2402
|
-
return jsxRuntime.jsx(Stack, { as: "ol", role: "tablist", axis: "x",
|
|
2402
|
+
return jsxRuntime.jsx(Stack, { as: "ol", role: "tablist", axis: "x", _gap: "m", children: items.map((index) => jsxRuntime.jsx(Box, { as: "li", children: jsxRuntime.jsx(DotButton, { isActive: activeIndex === index, onClick: () => onClickIndex(index), "aria-label": buttonLabel === null || buttonLabel === void 0 ? void 0 : buttonLabel(index), role: "tab" }) }, index)) });
|
|
2403
2403
|
};
|
|
2404
2404
|
const Carousel = ({ id, className, slides = [], labels }) => {
|
|
2405
2405
|
const [currentIndex, setCurrentIndex] = React.useState(0);
|
|
@@ -2435,7 +2435,7 @@ const Carousel = ({ id, className, slides = [], labels }) => {
|
|
|
2435
2435
|
const index = Math.round(scrollLeft / scrollWidth);
|
|
2436
2436
|
setCurrentIndexDebounced(index);
|
|
2437
2437
|
}, [setCurrentIndexDebounced]);
|
|
2438
|
-
return jsxRuntime.jsx("div", { ref: slidesContainer, id, className, children: jsxRuntime.jsxs(Stack, { width: "full", align: "stretch",
|
|
2438
|
+
return jsxRuntime.jsx("div", { ref: slidesContainer, id, className, children: jsxRuntime.jsxs(Stack, { width: "full", align: "stretch", _gap: "l", children: [jsxRuntime.jsxs(Stack, { axis: "x", align: "stretch", width: "full", _gap: "l", 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 }) })] }) });
|
|
2439
2439
|
};
|
|
2440
2440
|
|
|
2441
2441
|
var css_248z$7 = "/*! 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}";
|
|
@@ -2566,7 +2566,7 @@ const LabeledCheckboxBase = React__namespace.default.forwardRef((props, ref) =>
|
|
|
2566
2566
|
const { id, disabled } = attributes;
|
|
2567
2567
|
const semanticId = React__namespace.default.useId();
|
|
2568
2568
|
const isCard = variant === "card";
|
|
2569
|
-
return jsxRuntime.jsxs(Stack, { as: "label", axis: "x",
|
|
2569
|
+
return jsxRuntime.jsxs(Stack, { as: "label", axis: "x", _gap: "m", htmlFor: id, className: classNames__default.default(
|
|
2570
2570
|
"ui:cursor-pointer",
|
|
2571
2571
|
{
|
|
2572
2572
|
"ui:cursor-not-allowed": disabled
|
|
@@ -2613,13 +2613,13 @@ const LabeledCheckboxCard = React__namespace.default.forwardRef((props, ref) =>
|
|
|
2613
2613
|
const LabeledCheckboxGroup = (props) => {
|
|
2614
2614
|
const { children, title, className } = props;
|
|
2615
2615
|
const semanticId = React__namespace.default.useId();
|
|
2616
|
-
return jsxRuntime.jsxs(Stack, { as: "fieldset", "aria-describedby": semanticId, className: classNames__default.default(className),
|
|
2616
|
+
return jsxRuntime.jsxs(Stack, { as: "fieldset", "aria-describedby": semanticId, className: classNames__default.default(className), _gap: "base", children: [title && jsxRuntime.jsx("legend", { className: "ui:contents", children: jsxRuntime.jsx(Text, { children: title }) }), jsxRuntime.jsx(Stack, { _gap: "l", children }), jsxRuntime.jsx(HelperAndErrorText, { helperText: props.helperText, errorText: props.errorText, describingId: semanticId })] });
|
|
2617
2617
|
};
|
|
2618
2618
|
|
|
2619
2619
|
const LabeledCheckboxCardGroup = (props) => {
|
|
2620
2620
|
const { children, title, className, columns = 2, helperText, errorText } = props, attributes = __rest(props, ["children", "title", "className", "columns", "helperText", "errorText"]);
|
|
2621
2621
|
const semanticId = React__namespace.default.useId();
|
|
2622
|
-
return jsxRuntime.jsxs(Stack, Object.assign({ as: "fieldset", "aria-describedby": semanticId, className,
|
|
2622
|
+
return jsxRuntime.jsxs(Stack, Object.assign({ as: "fieldset", "aria-describedby": semanticId, className, _gap: "base" }, attributes, { children: [title && jsxRuntime.jsx("legend", { className: "ui:contents", children: jsxRuntime.jsx(Text, { children: title }) }), jsxRuntime.jsx("div", { className: classNames__default.default("ui:grid ui:gap-x-m ui:gap-y-xs ui:items-start", {
|
|
2623
2623
|
"ui:grid-cols-1": columns === 1,
|
|
2624
2624
|
"ui:grid-cols-2": columns === 2,
|
|
2625
2625
|
"ui:grid-cols-3": columns === 3,
|
|
@@ -2733,7 +2733,7 @@ const NotificationBanner = (_a) => {
|
|
|
2733
2733
|
blue: "blue-800"
|
|
2734
2734
|
};
|
|
2735
2735
|
const colour = color ? textColor[color] : "base";
|
|
2736
|
-
return jsxRuntime.jsxs(Stack, Object.assign({
|
|
2736
|
+
return jsxRuntime.jsxs(Stack, Object.assign({ _p: "l", as: "div", axis: "x", align: "center", justify: centerContent ? "center" : "start", "data-test-id": "notification-banner", borderRadius: "xxxxs", width: stretch ? "full" : void 0, className: classNames__default.default(classes, {
|
|
2737
2737
|
"ui:inline-flex": !stretch
|
|
2738
2738
|
}) }, boxProps, { children: [icon && (typeof icon === "function" ? React__namespace.default.createElement(icon, {
|
|
2739
2739
|
className: "ui:w-6 ui:h-6 ui:mr-3 ui:shrink-0"
|
|
@@ -2752,7 +2752,7 @@ function RadioInner(_a) {
|
|
|
2752
2752
|
const { value, disabled } = otherProps;
|
|
2753
2753
|
const nameHtmlFor = `${name}-field-${value}`;
|
|
2754
2754
|
const semanticId = React__namespace.default.useId();
|
|
2755
|
-
return jsxRuntime.jsxs(Stack, { as: "label", axis: "x",
|
|
2755
|
+
return jsxRuntime.jsxs(Stack, { as: "label", axis: "x", _gap: "m", className: "ui:radio-form-field-label ui:flex ui:flex-row ui:leading-none", htmlFor: nameHtmlFor, "data-has-error": isError, "data-test-id": nameHtmlFor, children: [jsxRuntime.jsx(StyledRadio, Object.assign({}, otherProps, { name, id: nameHtmlFor, ref: innerRef, "aria-describedby": semanticId })), jsxRuntime.jsxs("div", { children: [text && jsxRuntime.jsx(Text, { inline: true, variant: "base", color: disabled ? "slate-500" : void 0, children: text }), jsxRuntime.jsx(HelperAndErrorText, { helperText: info, describingId: semanticId })] })] });
|
|
2756
2756
|
}
|
|
2757
2757
|
const RadioV2 = React__namespace.default.forwardRef((props, ref) => jsxRuntime.jsx(RadioInner, Object.assign({}, props, { innerRef: ref })));
|
|
2758
2758
|
|
|
@@ -2913,7 +2913,7 @@ const InfoField = (props) => {
|
|
|
2913
2913
|
};
|
|
2914
2914
|
break;
|
|
2915
2915
|
}
|
|
2916
|
-
return jsxRuntime.jsxs(Stack, { axis: "x", align: "center",
|
|
2916
|
+
return jsxRuntime.jsxs(Stack, { axis: "x", align: "center", _gap: "m", className: props.className, children: [props.icon, jsxRuntime.jsxs(Stack, Object.assign({}, boxProps, { className: "ui:overflow-hidden", children: [jsxRuntime.jsx(Text, { type: "sm", color: "slate-500", className: classNames__default.default({ "ui:break-words": props.supportsMultiline }, { "ui:whitespace-nowrap": !props.supportsMultiline }), children: props.label }), jsxRuntime.jsx(Text, { className: classNames__default.default({ "ui:break-words": props.supportsMultiline }, { "ui:whitespace-nowrap": !props.supportsMultiline }), truncate: !props.supportsMultiline, children: props.value })] }))] });
|
|
2917
2917
|
};
|
|
2918
2918
|
|
|
2919
2919
|
function cn$1(...inputs) {
|
|
@@ -3002,20 +3002,20 @@ const LabeledDatePicker = (_a) => {
|
|
|
3002
3002
|
"ui:!border-negative-border": isError,
|
|
3003
3003
|
"ui:!focus:outline-negative": isError
|
|
3004
3004
|
}, classNameFromProps);
|
|
3005
|
-
return jsxRuntime.jsxs(Stack, { as: "label",
|
|
3005
|
+
return jsxRuntime.jsxs(Stack, { as: "label", _gap: "s", align: fullWidth ? "stretch" : void 0, children: [label && jsxRuntime.jsx(LabelText, { children: label }), jsxRuntime.jsx(DatePicker, Object.assign({}, props, { className: datePickerClassNames, "aria-describedby": helperErrorTextId })), jsxRuntime.jsx(HelperAndErrorText, { helperText, errorText, describingId: helperErrorTextId })] });
|
|
3006
3006
|
};
|
|
3007
3007
|
|
|
3008
3008
|
const LabeledInput = React__namespace.default.forwardRef((props, ref) => {
|
|
3009
3009
|
const { className, helperText, errorText, label, fullWidth, "aria-describedby": ariaDescribedBy } = props, rest = __rest(props, ["className", "helperText", "errorText", "label", "fullWidth", "aria-describedby"]);
|
|
3010
3010
|
const helperErrorTextId = React__namespace.default.useId();
|
|
3011
|
-
return jsxRuntime.jsxs(Stack, { as: "label",
|
|
3011
|
+
return jsxRuntime.jsxs(Stack, { as: "label", _gap: "s", align: fullWidth ? "stretch" : void 0, className, children: [label && jsxRuntime.jsx(LabelText, { children: props.label }), jsxRuntime.jsx(StyledInput, Object.assign({}, rest, { ref, isError: Boolean(errorText), "aria-describedby": [ariaDescribedBy, helperErrorTextId].join(" ") })), jsxRuntime.jsx(HelperAndErrorText, { helperText, errorText, describingId: helperErrorTextId })] });
|
|
3012
3012
|
});
|
|
3013
3013
|
|
|
3014
3014
|
const LabeledRadio = React__namespace.default.forwardRef((props, ref) => {
|
|
3015
3015
|
const { children, label, helperText, errorText, className, inputClassName } = props, attributes = __rest(props, ["children", "label", "helperText", "errorText", "className", "inputClassName"]);
|
|
3016
3016
|
const { id, disabled } = attributes;
|
|
3017
3017
|
const semanticId = React__namespace.default.useId();
|
|
3018
|
-
return jsxRuntime.jsxs(Stack, { as: "label", axis: "x",
|
|
3018
|
+
return jsxRuntime.jsxs(Stack, { as: "label", axis: "x", _gap: "m", htmlFor: id, className: classNames__default.default("ui:radio-form-field-label", className), children: [jsxRuntime.jsxs("div", { className: "ui:relative ui:flex ui:flex-row ui:items-center ui:self-start", children: [jsxRuntime.jsx(Text, { "aria-hidden": true, className: "ui:w-4 ui:opacity-0", children: "CENTER" }), jsxRuntime.jsx("div", { className: "ui:absolute", children: jsxRuntime.jsx(StyledRadio, Object.assign({ "aria-describedby": semanticId }, attributes, { ref, className: inputClassName })) })] }), jsxRuntime.jsxs("div", { children: [jsxRuntime.jsx(RadioLabel, { label, disabled, children }), jsxRuntime.jsx(HelperAndErrorText, { helperText, errorText, describingId: semanticId })] })] });
|
|
3019
3019
|
});
|
|
3020
3020
|
function RadioLabel(props) {
|
|
3021
3021
|
const { children, label, disabled } = props;
|
|
@@ -3038,7 +3038,7 @@ const LabeledRadioGroup = (props) => {
|
|
|
3038
3038
|
axis: "y",
|
|
3039
3039
|
_gap: "base"
|
|
3040
3040
|
};
|
|
3041
|
-
return jsxRuntime.jsxs(Stack, { as: "fieldset", "aria-describedby": semanticId, className: classNames__default.default(className),
|
|
3041
|
+
return jsxRuntime.jsxs(Stack, { as: "fieldset", "aria-describedby": semanticId, className: classNames__default.default(className), _gap: "s", children: [title && jsxRuntime.jsx("legend", { className: "ui:contents", children: jsxRuntime.jsx(Text, { children: title }) }), jsxRuntime.jsx(Stack, Object.assign({}, orientationProps, { children })), jsxRuntime.jsx(HelperAndErrorText, { helperText: props.helperText, errorText: props.errorText, describingId: semanticId })] });
|
|
3042
3042
|
};
|
|
3043
3043
|
|
|
3044
3044
|
const Actions$1 = (props) => {
|
|
@@ -3060,7 +3060,7 @@ const Padding$1 = (props) => {
|
|
|
3060
3060
|
const { children } = props, rest = __rest(props, ["children"]);
|
|
3061
3061
|
return (
|
|
3062
3062
|
// Using margin here, because adjacent margins collapse.
|
|
3063
|
-
jsxRuntime.jsx(Box, Object.assign({
|
|
3063
|
+
jsxRuntime.jsx(Box, Object.assign({ _m: "xl" }, rest, { children }))
|
|
3064
3064
|
);
|
|
3065
3065
|
};
|
|
3066
3066
|
|
|
@@ -3185,7 +3185,7 @@ const TabsContent = React__namespace.forwardRef((_a, ref) => {
|
|
|
3185
3185
|
});
|
|
3186
3186
|
TabsContent.displayName = "Tabs.Content";
|
|
3187
3187
|
const TabsPadding = (props) => {
|
|
3188
|
-
return jsxRuntime.jsx(Box, Object.assign({
|
|
3188
|
+
return jsxRuntime.jsx(Box, Object.assign({ _py: "xl" }, props));
|
|
3189
3189
|
};
|
|
3190
3190
|
const TabLabelText = (props) => {
|
|
3191
3191
|
return jsxRuntime.jsx(Text, Object.assign({ variant: "strong", color: "current", as: "span" }, props));
|
|
@@ -3405,7 +3405,7 @@ function TableBodyRowDataCell(props) {
|
|
|
3405
3405
|
}
|
|
3406
3406
|
const content = props.fieldConfig.content(props.item);
|
|
3407
3407
|
const isTextCellEmpty = isTableFieldText(content) && !content.text && !content.tag;
|
|
3408
|
-
return jsxRuntime.jsxs("td", { className: classNames__default.default("ui:px-2 ui:align-middle ui:first:pl-6 ui:last:pr-6"), children: [isTableFieldText(content) && jsxRuntime.jsxs(Stack, { axis: "x", align: "center",
|
|
3408
|
+
return jsxRuntime.jsxs("td", { className: classNames__default.default("ui:px-2 ui:align-middle ui:first:pl-6 ui:last:pr-6"), children: [isTableFieldText(content) && jsxRuntime.jsxs(Stack, { axis: "x", align: "center", _gap: "m", children: [content.tag && jsxRuntime.jsx(Tag, { _type: getTagType(content.tag.color), children: content.tag.text }), jsxRuntime.jsx(CellTextContent, { content, emptyFieldContent: isTextCellEmpty ? props.emptyFieldContentText : void 0 })] }), isTableFieldAction(content) && jsxRuntime.jsx("div", { className: classNames__default.default("ui:flex ui:flex-row ui:justify-end", "ui:transition-opacity ui:duration-300 ui:ease-in-out", {
|
|
3409
3409
|
"ui:opacity-0": props.fieldConfig.onlyShowContentOnHovering,
|
|
3410
3410
|
"ui:group-hover:opacity-100": props.fieldConfig.onlyShowContentOnHovering
|
|
3411
3411
|
}), children: content.map((action) => {
|
|
@@ -3422,7 +3422,7 @@ const CellTextContent = (props) => {
|
|
|
3422
3422
|
if (!props.content.description && !props.content.text && !props.emptyFieldContent) {
|
|
3423
3423
|
return null;
|
|
3424
3424
|
}
|
|
3425
|
-
return jsxRuntime.jsxs(Stack, {
|
|
3425
|
+
return jsxRuntime.jsxs(Stack, { _py: "l", children: [(props.content.text || props.emptyFieldContent) && jsxRuntime.jsx(Text, { className: classNames__default.default("ui:text-left ui:leading-5", {
|
|
3426
3426
|
"ui:break-all": props.content.breakAllWord,
|
|
3427
3427
|
"ui:break-words": !props.content.breakAllWord
|
|
3428
3428
|
}), children: (_a = props.content.text) !== null && _a !== void 0 ? _a : props.emptyFieldContent }), props.content.description && jsxRuntime.jsx(Text, { className: classNames__default.default({
|
|
@@ -3616,7 +3616,7 @@ const PaginationMenuLarge = (props) => {
|
|
|
3616
3616
|
props.onChange(Number.parseInt(newPage, 10), props.pageSize);
|
|
3617
3617
|
}
|
|
3618
3618
|
};
|
|
3619
|
-
return jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [jsxRuntime.jsxs(Stack, { axis: "x", align: "center",
|
|
3619
|
+
return jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [jsxRuntime.jsxs(Stack, { axis: "x", align: "center", _gap: "m", justify: "start", width: "full", children: [props.pageSize && props.resultCount && jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [jsxRuntime.jsx(Text, { children: props.localization.display }), jsxRuntime.jsx(StyledSelect, { onChange: handleOnPageSizeSelect, value: props.pageSize, children: PAGE_SIZE_OPTIONS.map((option) => jsxRuntime.jsx("option", { value: option.value, children: option.label }, option.value)) })] }), jsxRuntime.jsx(Text, { children: props.localization.page }), jsxRuntime.jsx(StyledSelect, { onChange: handleOnPageNumberSelect, value: props.currentPageNumber, disabled: props.pageCount < 2, children: getPageNumberOptions(props.pageCount).map((option) => jsxRuntime.jsx("option", { value: option.value, children: option.label }, option.value)) })] }), jsxRuntime.jsxs(Stack, { axis: "x", align: "center", justify: "end", width: "full", children: [jsxRuntime.jsx(Text, { color: "slate-500", children: getSummaryText(props.pageCount, props.currentPageNumber, props.localization, props.pageSize, props.resultCount) }), jsxRuntime.jsx(SecondaryButton, { "data-test-id": "prev-button", "data-page": props.currentPageNumber - 1, onClick: handleOnPrevNextButtonClick, disabled: props.currentPageNumber === 1 || props.pageCount === 0, className: "ui:ml-4", children: props.localization.previous }), jsxRuntime.jsx(SecondaryButton, { "data-test-id": "next-button", disabled: props.currentPageNumber === props.pageCount || props.pageCount === 0, "data-page": props.currentPageNumber + 1, onClick: handleOnPrevNextButtonClick, className: "ui:ml-4", children: props.localization.next })] })] });
|
|
3620
3620
|
};
|
|
3621
3621
|
|
|
3622
3622
|
const PaginationMenuCursor = (props) => {
|
|
@@ -3626,7 +3626,7 @@ const PaginationMenuCursor = (props) => {
|
|
|
3626
3626
|
props.onChange(cursor);
|
|
3627
3627
|
}
|
|
3628
3628
|
};
|
|
3629
|
-
return jsxRuntime.jsxs(Stack, { axis: "x",
|
|
3629
|
+
return jsxRuntime.jsxs(Stack, { axis: "x", _gap: "l", justify: "end", width: "full", children: [jsxRuntime.jsx(SecondaryButton, { "data-test-id": "prev-button", leadingIcon: jsxRuntime.jsx(LeftArrowIcon, {}), "data-cursor": props.previousCursor, disabled: !props.previousCursor, onClick: handleOnChange, children: props.localization.previous }), jsxRuntime.jsx(SecondaryButton, { "data-test-id": "next-button", trailingIcon: jsxRuntime.jsx(ChevronRightIcon, {}), "data-cursor": props.nextCursor, disabled: !props.nextCursor, onClick: handleOnChange, children: props.localization.next })] });
|
|
3630
3630
|
};
|
|
3631
3631
|
|
|
3632
3632
|
const Wrapper = ({ className, children }) => jsxRuntime.jsx(Stack, { axis: "x", align: "center", className: classNames__default.default(className), justify: "between", width: "full", children });
|
|
@@ -3686,7 +3686,7 @@ function Table(_a) {
|
|
|
3686
3686
|
const shouldDisplayHeaderSelectAll = isSelectable && items && items.length > 0;
|
|
3687
3687
|
const shouldDisplaySelectAllControls = shouldDisplayHeaderSelectAll && rowSelectionHeaderAccessories && selectedItems && selectedItems.length > 0;
|
|
3688
3688
|
const toggleAllCheckbox = jsxRuntime.jsxs("label", { children: [jsxRuntime.jsx("span", { className: "ui:sr-only", children: "Select all rows" }), jsxRuntime.jsx(Checkbox, { isChecked: getSelectAllCheckboxState() === "checked", isIndeterminate: getSelectAllCheckboxState() === "indeterminate", onChange: handleOnToggleAll })] });
|
|
3689
|
-
return jsxRuntime.jsxs("table", Object.assign({ className: classNames__default.default("ui:w-full ui:table-auto ui:bg-white", "ui:border-separate ui:border-spacing-0 ui:rounded-2xl", className), "data-test-id": dataTestId }, otherAttributes, { children: [showHeader ? jsxRuntime.jsx(TableHeader, { fieldConfigurations, colSpan, selectAllCheckbox: shouldDisplayHeaderSelectAll ? toggleAllCheckbox : null, selectAllComponent: shouldDisplaySelectAllControls ? jsxRuntime.jsxs(Stack, { axis: "x", align: "center",
|
|
3689
|
+
return jsxRuntime.jsxs("table", Object.assign({ className: classNames__default.default("ui:w-full ui:table-auto ui:bg-white", "ui:border-separate ui:border-spacing-0 ui:rounded-2xl", className), "data-test-id": dataTestId }, otherAttributes, { children: [showHeader ? jsxRuntime.jsx(TableHeader, { fieldConfigurations, colSpan, selectAllCheckbox: shouldDisplayHeaderSelectAll ? toggleAllCheckbox : null, selectAllComponent: shouldDisplaySelectAllControls ? jsxRuntime.jsxs(Stack, { axis: "x", align: "center", _gap: "m", _my: "base", children: [toggleAllCheckbox, rowSelectionHeaderAccessories] }) : null }) : null, jsxRuntime.jsx(
|
|
3690
3690
|
TableBody,
|
|
3691
3691
|
{
|
|
3692
3692
|
// TODO: early return to remove all the boolean juggling.
|
|
@@ -4083,12 +4083,12 @@ const Step = ({ title, subtitle, state = "completed" }) => {
|
|
|
4083
4083
|
titleColor = "blue-800";
|
|
4084
4084
|
break;
|
|
4085
4085
|
}
|
|
4086
|
-
return jsxRuntime.jsxs(Box, { width: "full", children: [jsxRuntime.jsx(Box, {
|
|
4086
|
+
return jsxRuntime.jsxs(Box, { width: "full", children: [jsxRuntime.jsx(Box, { _mb: "base", width: "full", className: classNames__default.default("ui:h-1 ui:rounded", barColorClassName) }), jsxRuntime.jsx(Text, { variant: "strong", color: titleColor, children: title }), subtitle && jsxRuntime.jsx(Text, { variant: "strong", color: subtitleColor, children: subtitle })] });
|
|
4087
4087
|
};
|
|
4088
4088
|
|
|
4089
4089
|
const Steps = (props) => {
|
|
4090
4090
|
const { children, className } = props;
|
|
4091
|
-
return jsxRuntime.jsx(Stack, { axis: "x", justify: "stretch",
|
|
4091
|
+
return jsxRuntime.jsx(Stack, { axis: "x", justify: "stretch", _gap: "xl", className, children: React__namespace.default.Children.map(children, (child) => {
|
|
4092
4092
|
if (!React__namespace.default.isValidElement(child)) {
|
|
4093
4093
|
return null;
|
|
4094
4094
|
}
|
|
@@ -4232,7 +4232,7 @@ const VerticalDivider = (props) => {
|
|
|
4232
4232
|
}, className) }, rest));
|
|
4233
4233
|
};
|
|
4234
4234
|
const VerticalFlowDivider = (props) => {
|
|
4235
|
-
return jsxRuntime.jsx(Stack, Object.assign({ width: "full", align: "center", role: "separator",
|
|
4235
|
+
return jsxRuntime.jsx(Stack, Object.assign({ width: "full", align: "center", role: "separator", _pb: "s" }, props, { children: jsxRuntime.jsxs("svg", { xmlns: "http://www.w3.org/2000/svg", width: 16, height: 29, fill: "none", children: [jsxRuntime.jsx("path", { fill: "#94A3B8", d: "M7.293 28.707a1 1 0 0 0 1.414 0l6.364-6.364a1 1 0 0 0-1.414-1.414L8 26.586l-5.657-5.657A1 1 0 0 0 .93 22.343l6.364 6.364ZM7 0v28h2V0H7Z" }), jsxRuntime.jsx("circle", { cx: 8, cy: 3, r: 2.5, fill: "#CBD5E1", stroke: "#64748B" })] }) }));
|
|
4236
4236
|
};
|
|
4237
4237
|
const HorizontalFlowDivider = (props) => {
|
|
4238
4238
|
return jsxRuntime.jsx(Stack, Object.assign({ axis: "x", align: "center", role: "separator" }, props, { children: jsxRuntime.jsx("svg", { width: "24", height: "24", viewBox: "0 0 24 24", fill: "none", xmlns: "http://www.w3.org/2000/svg", children: jsxRuntime.jsx("path", { d: "M16.6269 12.7491H5.25C5.03718 12.7491 4.85898 12.6773 4.7154 12.5337C4.5718 12.3901 4.5 12.2119 4.5 11.9991C4.5 11.7863 4.5718 11.6081 4.7154 11.4645C4.85898 11.3209 5.03718 11.2491 5.25 11.2491H16.6269L11.4577 6.07985C11.309 5.93114 11.2356 5.7571 11.2375 5.55775C11.2394 5.35839 11.3179 5.18114 11.4731 5.02603C11.6282 4.88116 11.8038 4.80616 12 4.80103C12.1961 4.79589 12.3718 4.87089 12.5269 5.02603L18.8672 11.3664C18.9608 11.46 19.0269 11.5587 19.0653 11.6626C19.1038 11.7664 19.123 11.8786 19.123 11.9991C19.123 12.1196 19.1038 12.2318 19.0653 12.3356C19.0269 12.4395 18.9608 12.5382 18.8672 12.6318L12.5269 18.9721C12.3884 19.1106 12.217 19.1814 12.0125 19.1846C11.808 19.1878 11.6282 19.117 11.4731 18.9721C11.3179 18.817 11.2404 18.6388 11.2404 18.4375C11.2404 18.2362 11.3179 18.058 11.4731 17.9029L16.6269 12.7491Z", fill: "#64748B" }) }) }));
|
|
@@ -4368,11 +4368,11 @@ const PreviewPhone = ({ className, children }) => {
|
|
|
4368
4368
|
};
|
|
4369
4369
|
|
|
4370
4370
|
const SectionHeader = ({ title, aside, isLoading = false }) => {
|
|
4371
|
-
return jsxRuntime.jsxs(Stack, { axis: "x", as: "header", justify: "between", align: "center", width: "full", "data-test-id": "section-header",
|
|
4371
|
+
return jsxRuntime.jsxs(Stack, { axis: "x", as: "header", justify: "between", align: "center", width: "full", "data-test-id": "section-header", _p: "l", children: [jsxRuntime.jsxs(Stack, { axis: "x", justify: "center", align: "center", _gap: "m", children: [typeof title === "string" ? jsxRuntime.jsx(Title, { variant: "sm", children: title }) : title, isLoading && jsxRuntime.jsx(LoadingIndicator, { asSpinner: true })] }), aside] });
|
|
4372
4372
|
};
|
|
4373
4373
|
|
|
4374
4374
|
const SectionFooter = ({ children }) => {
|
|
4375
|
-
return jsxRuntime.jsx(Stack, { as: "footer", width: "full",
|
|
4375
|
+
return jsxRuntime.jsx(Stack, { as: "footer", width: "full", _p: "l", className: "ui:border-t-slate-200", children });
|
|
4376
4376
|
};
|
|
4377
4377
|
|
|
4378
4378
|
const Section = (_a) => {
|
|
@@ -4639,7 +4639,7 @@ const Select = React__namespace.default.forwardRef((_a, innerRef) => {
|
|
|
4639
4639
|
const LabeledSelect = React__namespace.default.forwardRef((props, ref) => {
|
|
4640
4640
|
const { className, helperText, errorText, label, fullWidth, "aria-describedby": ariaDescribedBy } = props, rest = __rest(props, ["className", "helperText", "errorText", "label", "fullWidth", "aria-describedby"]);
|
|
4641
4641
|
const helperErrorTextId = React__namespace.default.useId();
|
|
4642
|
-
return jsxRuntime.jsxs(Stack, { as: "label",
|
|
4642
|
+
return jsxRuntime.jsxs(Stack, { as: "label", _gap: "s", align: fullWidth ? "stretch" : void 0, className, children: [label && jsxRuntime.jsx(LabelText, { children: props.label }), jsxRuntime.jsx(StyledSelect, Object.assign({}, rest, { ref, isError: Boolean(errorText), "aria-describedby": [ariaDescribedBy, helperErrorTextId].join(" ") })), jsxRuntime.jsx(HelperAndErrorText, { helperText, errorText, describingId: helperErrorTextId })] });
|
|
4643
4643
|
});
|
|
4644
4644
|
|
|
4645
4645
|
const LabeledSelectSearchable = React__namespace.default.forwardRef((props, ref) => {
|
|
@@ -4648,7 +4648,7 @@ const LabeledSelectSearchable = React__namespace.default.forwardRef((props, ref)
|
|
|
4648
4648
|
const helperErrorTextId = React__namespace.default.useId();
|
|
4649
4649
|
const hasError = Boolean(errorText);
|
|
4650
4650
|
const labelledBy = [ariaLabelledBy, label ? labelId : void 0].filter(Boolean).join(" ") || void 0;
|
|
4651
|
-
return jsxRuntime.jsxs(Stack, {
|
|
4651
|
+
return jsxRuntime.jsxs(Stack, { _gap: "s", align: fullWidth ? "stretch" : void 0, className, children: [label && jsxRuntime.jsx(Box, { id: labelId, children: jsxRuntime.jsx(LabelText, { children: label }) }), jsxRuntime.jsx(Select, Object.assign({}, rest, { ref, isError: hasError, "aria-labelledby": labelledBy, "aria-invalid": hasError || void 0, "aria-errormessage": hasError ? helperErrorTextId : void 0 })), jsxRuntime.jsx(HelperAndErrorText, { helperText, errorText, describingId: helperErrorTextId })] });
|
|
4652
4652
|
});
|
|
4653
4653
|
|
|
4654
4654
|
const useOutsideClick = (ref, callback) => {
|
|
@@ -4861,13 +4861,13 @@ const ModalDialog = (_a) => {
|
|
|
4861
4861
|
const Body = (_a) => {
|
|
4862
4862
|
var { className } = _a, rest = __rest(_a, ["className"]);
|
|
4863
4863
|
const classes = classNames__default.default(className, "ui:overflow-y-auto ui:flex-1");
|
|
4864
|
-
return jsxRuntime.jsx(Box, Object.assign({ className: classes,
|
|
4864
|
+
return jsxRuntime.jsx(Box, Object.assign({ className: classes, _p: "l" }, rest));
|
|
4865
4865
|
};
|
|
4866
4866
|
const Header$1 = (props) => {
|
|
4867
|
-
return jsxRuntime.jsx(Stack, Object.assign({ axis: "x", justify: "between", align: "center",
|
|
4867
|
+
return jsxRuntime.jsx(Stack, Object.assign({ axis: "x", justify: "between", align: "center", _gap: "l", _p: "l" }, props));
|
|
4868
4868
|
};
|
|
4869
4869
|
const Footer = (props) => {
|
|
4870
|
-
return jsxRuntime.jsx(Stack, Object.assign({ as: "footer",
|
|
4870
|
+
return jsxRuntime.jsx(Stack, Object.assign({ as: "footer", _p: "l", backgroundColor: "background", className: "ui:rounded-b-[inherit]" }, props));
|
|
4871
4871
|
};
|
|
4872
4872
|
const CloseButton = (props) => {
|
|
4873
4873
|
return jsxRuntime.jsx(TertiaryButton, Object.assign({ leadingIcon: jsxRuntime.jsx(CrossIcon, {}) }, props));
|
|
@@ -4875,7 +4875,7 @@ const CloseButton = (props) => {
|
|
|
4875
4875
|
const Actions = (_a) => {
|
|
4876
4876
|
var { className } = _a, rest = __rest(_a, ["className"]);
|
|
4877
4877
|
const classes = classNames__default.default(className, "ui:self-end");
|
|
4878
|
-
return jsxRuntime.jsx(Stack, Object.assign({ axis: "x",
|
|
4878
|
+
return jsxRuntime.jsx(Stack, Object.assign({ axis: "x", _gap: "m", className: classes }, rest));
|
|
4879
4879
|
};
|
|
4880
4880
|
ModalDialog.Header = Header$1;
|
|
4881
4881
|
ModalDialog.Title = Card.Title;
|
|
@@ -5021,7 +5021,7 @@ const ImagePickerInner = ({
|
|
|
5021
5021
|
var _a2;
|
|
5022
5022
|
setIsImagesPanelOpen(false);
|
|
5023
5023
|
(_a2 = fileInputRef.current) === null || _a2 === void 0 ? void 0 : _a2.click();
|
|
5024
|
-
}, children: localisation.uploadImage }), jsxRuntime.jsx("input", { ref: fileInputRef, type: "file", disabled: isDisabled, name: `uploaded-${name}`, accept: acceptedMimeTypes.join(","), onChange: uploadImage, className: "ui:hidden" })] }), isClearButtonVisible && selectedMedia !== placeholderImage && !isUploading && jsxRuntime.jsx(SecondaryButton, { text: localisation.clearSelection, isDisabled, isPending: isUploading, onClick: handleDeleteClick })] })] }), jsxRuntime.jsxs(ModalDialog, { open: isImagesPanelOpen, onClose: handleCloseModal, variant: "centered-dialog", size: "l", children: [jsxRuntime.jsxs(ModalDialog.Header, { children: [jsxRuntime.jsx(ModalDialog.Title, { children: localisation.modalTitle }), jsxRuntime.jsx(ModalDialog.CloseButton, { onClick: handleCloseModal })] }), jsxRuntime.jsx(Divider, {}), jsxRuntime.jsx(ModalDialog.Body, { children: jsxRuntime.jsxs(Stack, { axis: "y",
|
|
5024
|
+
}, children: localisation.uploadImage }), jsxRuntime.jsx("input", { ref: fileInputRef, type: "file", disabled: isDisabled, name: `uploaded-${name}`, accept: acceptedMimeTypes.join(","), onChange: uploadImage, className: "ui:hidden" })] }), isClearButtonVisible && selectedMedia !== placeholderImage && !isUploading && jsxRuntime.jsx(SecondaryButton, { text: localisation.clearSelection, isDisabled, isPending: isUploading, onClick: handleDeleteClick })] })] }), jsxRuntime.jsxs(ModalDialog, { open: isImagesPanelOpen, onClose: handleCloseModal, variant: "centered-dialog", size: "l", children: [jsxRuntime.jsxs(ModalDialog.Header, { children: [jsxRuntime.jsx(ModalDialog.Title, { children: localisation.modalTitle }), jsxRuntime.jsx(ModalDialog.CloseButton, { onClick: handleCloseModal })] }), jsxRuntime.jsx(Divider, {}), jsxRuntime.jsx(ModalDialog.Body, { children: jsxRuntime.jsxs(Stack, { axis: "y", _gap: "l", width: "full", className: "ui:max-h-135", children: [jsxRuntime.jsx(SearchInput, { name: "searchImages", className: "ui:w-full", value: search, placeholder: localisation.search, onChange: handleSearchChange }), jsxRuntime.jsx("div", { className: "ui:flex ui:w-full ui:flex-row ui:flex-wrap ui:items-center", children: filteredCategories === null || filteredCategories === void 0 ? void 0 : filteredCategories.map((category) => jsxRuntime.jsx(ImageCategory, { category, images: images === null || images === void 0 ? void 0 : images.filter((categoryImage) => categoryImage.includes(category.folder)), highlightedImage, handleImageClick, isTypeCompact }, category.folder)) })] }) }), jsxRuntime.jsx(ModalDialog.Footer, { children: jsxRuntime.jsx(ModalDialog.Actions, { width: "full", children: jsxRuntime.jsxs(Stack, { axis: "x", _gap: "m", justify: "end", width: "full", children: [jsxRuntime.jsx(SecondaryButton, { dataTestId: "modal-footer-trailing-secondary-button", onClick: handleCloseModal, children: localisation.cancel }), jsxRuntime.jsx(PrimaryButton, { dataTestId: "modal-footer-trailing-primary-button", onClick: handleConfirmSelection, children: localisation.selectButton })] }) }) })] })] });
|
|
5025
5025
|
};
|
|
5026
5026
|
const MediaPicker = React__namespace.default.forwardRef((props, ref) => {
|
|
5027
5027
|
var _a, _b;
|
|
@@ -5150,7 +5150,7 @@ const LinkTooltip = ({ linkElement, editorInstance, onClose, translations }) =>
|
|
|
5150
5150
|
top: "anchor(bottom)",
|
|
5151
5151
|
left: "anchor(left)",
|
|
5152
5152
|
marginTop: "8px"
|
|
5153
|
-
}, children: jsxRuntime.jsx(Card, { borderRadius: "s", elevation: "large", className: "ui:max-w-80", padding: false, border: true, children: jsxRuntime.jsxs(Stack, { width: "full", align: "stretch", children: [jsxRuntime.jsx(Box, {
|
|
5153
|
+
}, children: jsxRuntime.jsx(Card, { borderRadius: "s", elevation: "large", className: "ui:max-w-80", padding: false, border: true, children: jsxRuntime.jsxs(Stack, { width: "full", align: "stretch", children: [jsxRuntime.jsx(Box, { _p: "m", children: jsxRuntime.jsxs(Text, { children: [translations.visitUrlLabel, " ", jsxRuntime.jsx("a", { href: url, target: "_blank", rel: "noopener noreferrer", className: "ui:text-blue-600 ui:underline ui:text-sm ui:overflow-hidden ui:text-ellipsis ui:whitespace-nowrap hover:ui:text-blue-700", children: url })] }) }), jsxRuntime.jsx(Divider, { version: "v2" }), jsxRuntime.jsxs(Stack, { axis: "x", _gap: "base", _p: "m", children: [jsxRuntime.jsx(TertiaryButton, { onClick: handleEditLink, text: translations.editButtonText, size: "medium" }), jsxRuntime.jsx(TertiaryButton, { onClick: handleRemoveLink, text: translations.removeButtonText, size: "medium" }), jsxRuntime.jsx(TertiaryButton, { onClick: onClose, text: translations.closeButtonText, size: "medium" })] })] }) }) });
|
|
5154
5154
|
};
|
|
5155
5155
|
|
|
5156
5156
|
const TextEditorToolbarButton = ({ option, hasTextSelected, editor, translations }) => {
|
|
@@ -5234,7 +5234,7 @@ const getGroupKey = (group) => {
|
|
|
5234
5234
|
}).join("-");
|
|
5235
5235
|
};
|
|
5236
5236
|
const TextEditorToolbar = ({ toolbarId, toolbar, hasTextSelected, editor, translations }) => {
|
|
5237
|
-
return jsxRuntime.jsx(Stack, { axis: "x",
|
|
5237
|
+
return jsxRuntime.jsx(Stack, { axis: "x", _gap: "l", _px: "xs", id: toolbarId, children: toolbar.map((group) => jsxRuntime.jsx(Stack, { axis: "x", _gap: "xs", children: group.map((option, optionIndex) => jsxRuntime.jsx(TextEditorToolbarButton, { option, hasTextSelected, editor, translations }, getOptionKey(option, optionIndex))) }, getGroupKey(group))) });
|
|
5238
5238
|
};
|
|
5239
5239
|
|
|
5240
5240
|
const MentionList = React.forwardRef(({ items, command }, ref) => {
|
|
@@ -5750,7 +5750,7 @@ const OpenIndicator = ({ component: Component = DefaultOpenIndicator }) => {
|
|
|
5750
5750
|
const Summary = (_a) => {
|
|
5751
5751
|
var { children, omitOpenIndicator = false, className } = _a, rest = __rest(_a, ["children", "omitOpenIndicator", "className"]);
|
|
5752
5752
|
const { isOpen } = React.useContext(context$2);
|
|
5753
|
-
return jsxRuntime.jsx(Stack, Object.assign({ as: "summary", cursor: "pointer", className: classNames__default.default("ui:rounded-[inherit]", className) }, rest, { children: jsxRuntime.jsx(Stack, { axis: "x", justify: "between", align: "center", width: "full", children: jsxRuntime.jsxs(Stack, { axis: "x", width: "full", align: "center",
|
|
5753
|
+
return jsxRuntime.jsx(Stack, Object.assign({ as: "summary", cursor: "pointer", className: classNames__default.default("ui:rounded-[inherit]", className) }, rest, { children: jsxRuntime.jsx(Stack, { axis: "x", justify: "between", align: "center", width: "full", children: jsxRuntime.jsxs(Stack, { axis: "x", width: "full", align: "center", _gap: "base", children: [!omitOpenIndicator && jsxRuntime.jsx(DefaultOpenIndicator, { isOpen }), jsxRuntime.jsx(Box, { width: "full", children })] }) }) }));
|
|
5754
5754
|
};
|
|
5755
5755
|
DetailsDisclosure.Summary = Summary;
|
|
5756
5756
|
Summary.OpenIndicator = OpenIndicator;
|
|
@@ -5768,11 +5768,11 @@ const VerticalMenu = (props) => {
|
|
|
5768
5768
|
const shouldShowCollapseButton = localization && Boolean(onCollapseButtonClick);
|
|
5769
5769
|
const hasHeaderContent = title || shouldShowCollapseButton;
|
|
5770
5770
|
const contextValue = React.useMemo(() => ({ variant }), [variant]);
|
|
5771
|
-
return jsxRuntime.jsx(context$1.Provider, { value: contextValue, children: jsxRuntime.jsxs(Stack, Object.assign({ as: "div",
|
|
5771
|
+
return jsxRuntime.jsx(context$1.Provider, { value: contextValue, children: jsxRuntime.jsxs(Stack, Object.assign({ as: "div", _px: "base", _py: "l", align: "normal", className: classNames__default.default("ui:max-h-full", {
|
|
5772
5772
|
"ui:max-w-full": !isCollapsed,
|
|
5773
5773
|
[DEFAULT_TEXT_CLASS_NAME]: isCollapsed,
|
|
5774
5774
|
[COLLAPSED_WIDTH_CLASS_NAME]: isCollapsed
|
|
5775
|
-
}, className) }, rest, { children: [jsxRuntime.jsxs(Stack, { width: "full", children: [header && jsxRuntime.jsx(Box, { width: "full", children: header }), jsxRuntime.jsxs(Stack, { axis: "x",
|
|
5775
|
+
}, className) }, rest, { children: [jsxRuntime.jsxs(Stack, { width: "full", children: [header && jsxRuntime.jsx(Box, { width: "full", children: header }), jsxRuntime.jsxs(Stack, { axis: "x", _gap: "base", _p: hasHeaderContent ? "l" : void 0, align: "start", justify: "between", width: "full", children: [title && jsxRuntime.jsx(Box, { children: jsxRuntime.jsx(Text, { variant: "lg-strong", children: title }) }), shouldShowCollapseButton && jsxRuntime.jsx(
|
|
5776
5776
|
Box,
|
|
5777
5777
|
{
|
|
5778
5778
|
/**
|
|
@@ -5797,7 +5797,7 @@ const VerticalMenu = (props) => {
|
|
|
5797
5797
|
children: jsxRuntime.jsx(SidebarIcon, {})
|
|
5798
5798
|
}) })
|
|
5799
5799
|
}
|
|
5800
|
-
)] })] }), isPrimaryVariant && hasHeaderContent && jsxRuntime.jsx(VerticalMenu.Divider, {}), jsxRuntime.jsx(Stack, { width: "full", className: "ui:flex-1 ui:overflow-y-auto",
|
|
5800
|
+
)] })] }), isPrimaryVariant && hasHeaderContent && jsxRuntime.jsx(VerticalMenu.Divider, {}), jsxRuntime.jsx(Stack, { width: "full", className: "ui:flex-1 ui:overflow-y-auto", _gap: isCollapsed ? "base" : void 0, children: props.children }), jsxRuntime.jsx("div", { className: "ui:mt-auto", children: footer })] })) });
|
|
5801
5801
|
};
|
|
5802
5802
|
VerticalMenu.Divider = MenuDivider;
|
|
5803
5803
|
VerticalMenu.Item = MenuItem;
|
|
@@ -5896,7 +5896,7 @@ function MenuItemLayout(props) {
|
|
|
5896
5896
|
return jsxRuntime.jsx("div", { children });
|
|
5897
5897
|
}
|
|
5898
5898
|
const itemIsTextOrNumber = typeof text === "string" || typeof text === "number";
|
|
5899
|
-
return jsxRuntime.jsxs(Stack, { axis: isCollapsed ? "y" : "x", align: isCollapsed ? "center" : "start",
|
|
5899
|
+
return jsxRuntime.jsxs(Stack, { axis: isCollapsed ? "y" : "x", align: isCollapsed ? "center" : "start", _gap: isCollapsed ? "s" : "base", className: classNames__default.default("ui:relative", className), children: [icon && /**
|
|
5900
5900
|
* If the item is a text or number, we can to add an aria-label to the icon
|
|
5901
5901
|
* so that it can be read by screen readers. If the item is not a text or
|
|
5902
5902
|
* number, there's not much we can do and accessibility is up to the consumer.
|
|
@@ -5924,7 +5924,7 @@ function MenuItemNotificationBubble(props) {
|
|
|
5924
5924
|
), children: jsxRuntime.jsx(Text, { color: "white", as: "span", className: "ui:align-text-bottom", children: props.children }) });
|
|
5925
5925
|
}
|
|
5926
5926
|
function MenuDivider(props) {
|
|
5927
|
-
return jsxRuntime.jsx(Box, { width: "full",
|
|
5927
|
+
return jsxRuntime.jsx(Box, { width: "full", _my: "base", children: jsxRuntime.jsx(Divider, Object.assign({ className: "ui:border-neutral-border-high-contrast ui:last:border-b-1 ui:w-full" }, props)) });
|
|
5928
5928
|
}
|
|
5929
5929
|
function MenuItemGroupOpenIndicator({ isOpen }) {
|
|
5930
5930
|
return jsxRuntime.jsx(Text, { color: "on-surface", as: "span", children: jsxRuntime.jsx(ChevronDownIcon, { className: classNames__default.default("ui:shrink-0 ui:transition-transform", {
|
|
@@ -5933,7 +5933,7 @@ function MenuItemGroupOpenIndicator({ isOpen }) {
|
|
|
5933
5933
|
}
|
|
5934
5934
|
function MenuItemGroup(_a) {
|
|
5935
5935
|
var { title, children, className } = _a, rest = __rest(_a, ["title", "children", "className"]);
|
|
5936
|
-
return jsxRuntime.jsxs(DetailsDisclosure, Object.assign({ omitBorder: true, omitSummaryDivider: true, className: classNames__default.default("ui:w-full", className) }, rest, { children: [jsxRuntime.jsx(DetailsDisclosure.Summary, { hoverBackgroundColor: void 0,
|
|
5936
|
+
return jsxRuntime.jsxs(DetailsDisclosure, Object.assign({ omitBorder: true, omitSummaryDivider: true, className: classNames__default.default("ui:w-full", className) }, rest, { children: [jsxRuntime.jsx(DetailsDisclosure.Summary, { hoverBackgroundColor: void 0, omitOpenIndicator: true, children: jsxRuntime.jsx(MenuItemLayout, { children: jsxRuntime.jsx(MenuItemPadding, { children: jsxRuntime.jsxs(Stack, { axis: "x", align: "center", justify: "between", children: [jsxRuntime.jsx(MenuItemText, { children: title }), jsxRuntime.jsx(DetailsDisclosure.Summary.OpenIndicator, { component: MenuItemGroupOpenIndicator })] }) }) }) }), jsxRuntime.jsx(MenuItemPadding, { paddingX: true, paddingY: false, children })] }));
|
|
5937
5937
|
}
|
|
5938
5938
|
function SectionTitle(props) {
|
|
5939
5939
|
return jsxRuntime.jsx(MenuItemPadding, { children: jsxRuntime.jsx(Text, { variant: "strong", children: props.children }) });
|
|
@@ -5949,7 +5949,7 @@ const ActiveFilters = (props) => {
|
|
|
5949
5949
|
return categorizedFilterOption;
|
|
5950
5950
|
});
|
|
5951
5951
|
}).filter((activeFilter) => activeFilter.isChecked);
|
|
5952
|
-
return jsxRuntime.jsx("div", { className: "ui:bg-gray-100", children: jsxRuntime.jsxs("div", { className: "ui:min-h-15 ui:max-w-7xl ui:py-s ui:sm:flex ui:sm:items-center", children: [jsxRuntime.jsx(Text, { variant: "base", color: "slate-500", children: localization.filtersLabel }), jsxRuntime.jsx("div", { className: "ui:mt-2 ui:sm:ml-4 ui:sm:mt-0", children: jsxRuntime.jsx(Stack, { axis: "x",
|
|
5952
|
+
return jsxRuntime.jsx("div", { className: "ui:bg-gray-100", children: jsxRuntime.jsxs("div", { className: "ui:min-h-15 ui:max-w-7xl ui:py-s ui:sm:flex ui:sm:items-center", children: [jsxRuntime.jsx(Text, { variant: "base", color: "slate-500", children: localization.filtersLabel }), jsxRuntime.jsx("div", { className: "ui:mt-2 ui:sm:ml-4 ui:sm:mt-0", children: jsxRuntime.jsx(Stack, { axis: "x", _gap: "l", align: "center", wrap: true, children: activeFilters.map((activeFilter, idx) => jsxRuntime.jsxs(React.Fragment, { children: [jsxRuntime.jsxs("span", { className: "ui:mx-1 ui:inline-flex ui:items-center ui:rounded-full ui:border ui:border-neutral-border-high-contrast ui:bg-white ui:py-xxxxs ui:pl-m ui:pr-xxs ui:hover:border-neutral-interactive ui:hover:bg-primary-background", children: [jsxRuntime.jsx(Text, { variant: "base", children: activeFilter.label }), jsxRuntime.jsx("button", { type: "button", "aria-label": removeFilterOptionLabelGetter(activeFilter), className: "ui:mx-1 ui:inline-flex ui:h-6 ui:w-6 ui:shrink-0 ui:rounded-full ui:p-0 ui:text-on-surface", onClick: () => onRemoveActiveFilter({
|
|
5953
5953
|
changedFilterOption: {
|
|
5954
5954
|
isChecked: false,
|
|
5955
5955
|
id: activeFilter.id,
|
|
@@ -6080,7 +6080,7 @@ const FilterBar = (_a) => {
|
|
|
6080
6080
|
};
|
|
6081
6081
|
const hasFiltersApplied = categorizedFilters.some((categorizedFilter) => categorizedFilter.options.some((option) => option.isChecked));
|
|
6082
6082
|
const shouldShowActiveFilters = hasFiltersApplied ? true : !hideActiveFiltersWhenEmpty;
|
|
6083
|
-
return jsxRuntime.jsx("div", { children: jsxRuntime.jsxs("section", { "aria-labelledby": "filter-heading", children: [jsxRuntime.jsx(Box, { borderRadius: "l",
|
|
6083
|
+
return jsxRuntime.jsx("div", { children: jsxRuntime.jsxs("section", { "aria-labelledby": "filter-heading", children: [jsxRuntime.jsx(Box, { borderRadius: "l", _py: "l", children: jsxRuntime.jsxs(Stack, { axis: "x", align: "normal", justify: "between", className: "ui:-ml-m", children: [jsxRuntime.jsx(Stack, { axis: "x", align: "normal", children: menuOrder.map((menu, index) => {
|
|
6084
6084
|
const hasPresetMenu = presetFilterOptions && menuOrder.includes("presetFilters");
|
|
6085
6085
|
const hasSortingMenu = sortingOptions && menuOrder.includes("sorting");
|
|
6086
6086
|
const hasMultipleMenus = hasPresetMenu && hasSortingMenu;
|
|
@@ -6310,7 +6310,7 @@ const FileUpload = React.forwardRef((props, ref) => {
|
|
|
6310
6310
|
}, onChange: handleChangeEvent, disabled: isDisabled }, otherProps))] });
|
|
6311
6311
|
});
|
|
6312
6312
|
const UploadedFileSection = ({ file, onRemove }) => {
|
|
6313
|
-
return jsxRuntime.jsx("div", { className: "ui:inline-block ui:flex-row ui:rounded-lg ui:bg-blue-100", children: jsxRuntime.jsxs(Stack, { axis: "x", justify: "center", align: "center",
|
|
6313
|
+
return jsxRuntime.jsx("div", { className: "ui:inline-block ui:flex-row ui:rounded-lg ui:bg-blue-100", children: jsxRuntime.jsxs(Stack, { axis: "x", justify: "center", align: "center", _gap: "base", _py: "base", _px: "l", title: file.name, children: [jsxRuntime.jsx(Text, { truncate: true, className: "ui:max-w-55", children: file.name }), jsxRuntime.jsx(TertiaryButton, { icon: "TrashBinIcon", onClick: onRemove })] }) });
|
|
6314
6314
|
};
|
|
6315
6315
|
|
|
6316
6316
|
const StatusIndicator = (props) => {
|
|
@@ -6334,7 +6334,7 @@ const Skeleton = ({ width, height, variant = "text", children }) => {
|
|
|
6334
6334
|
var templateObject_1;
|
|
6335
6335
|
|
|
6336
6336
|
const LoadingState = () => {
|
|
6337
|
-
return jsxRuntime.jsx(Card, { className: classNames__default.default("ui:w-full ui:border ui:border-slate-100"), padding: false, elevation: "surface", children: jsxRuntime.jsx(Box, { children: jsxRuntime.jsxs(Stack, { width: "full",
|
|
6337
|
+
return jsxRuntime.jsx(Card, { className: classNames__default.default("ui:w-full ui:border ui:border-slate-100"), padding: false, elevation: "surface", children: jsxRuntime.jsx(Box, { children: jsxRuntime.jsxs(Stack, { width: "full", _p: "l", axis: "x", justify: "between", align: "center", children: [jsxRuntime.jsx(Stack, { _gap: "m", width: "full", children: jsxRuntime.jsxs(Stack, { _gap: "l", axis: "x", align: "center", width: "full", children: [jsxRuntime.jsx(Skeleton, { variant: "rounded", width: 24, height: 24 }), jsxRuntime.jsxs(Stack, { width: "full", children: [jsxRuntime.jsx(Title, { variant: "xs", children: jsxRuntime.jsx(Skeleton, { width: 120 }) }), jsxRuntime.jsx(Text, { variant: "sm", color: "slate-500", children: jsxRuntime.jsx(Skeleton, { width: 100 }) })] })] }) }), jsxRuntime.jsx(Skeleton, { variant: "rounded", width: 24, height: 24 })] }) }) });
|
|
6338
6338
|
};
|
|
6339
6339
|
|
|
6340
6340
|
const TimelineCard = ({ title, subtitle, icon, leadingIcon, trailingIcon, statusText, state = "default", variant, disabled = false, isLoading = false, onClick }) => {
|
|
@@ -6346,7 +6346,7 @@ const TimelineCard = ({ title, subtitle, icon, leadingIcon, trailingIcon, status
|
|
|
6346
6346
|
"ui:text-start ui:hover:border-slate-200 ui:focus:border-blue-800 ui:focus:outline-primary": onClick
|
|
6347
6347
|
}), padding: false, elevation: presentation === "highlighted" ? "medium" : "surface", onClick, disabled, children: jsxRuntime.jsx(Box, { className: classNames__default.default({
|
|
6348
6348
|
["ui:border-l-8 ui:border-primary"]: presentation === "highlighted"
|
|
6349
|
-
}), children: jsxRuntime.jsxs(Stack, { width: "full",
|
|
6349
|
+
}), children: jsxRuntime.jsxs(Stack, { width: "full", _p: "l", axis: "x", justify: "between", align: "center", children: [jsxRuntime.jsxs(Stack, { _gap: "m", children: [statusText && jsxRuntime.jsx(Text, { variant: "sm", color: "slate-500", children: statusText }), jsxRuntime.jsxs(Stack, { _gap: "l", axis: "x", align: "center", children: [(icon === null || icon === void 0 ? void 0 : icon.url) && jsxRuntime.jsx("img", { className: "ui:shrink-0", width: 24, height: 24, src: icon.url }), (icon === null || icon === void 0 ? void 0 : icon.iconKey) && jsxRuntime.jsx(Icon, { className: "ui:shrink-0", name: icon.iconKey }), leadingIcon, jsxRuntime.jsxs(Stack, { width: "full", children: [(presentation === "bold" || presentation === "highlighted") && jsxRuntime.jsx(Title, { variant: "xs", children: title }), presentation === "default" && getTitle(), typeof subtitle === "string" ? jsxRuntime.jsx(Text, { variant: "sm", color: "slate-500", children: subtitle }) : subtitle] })] })] }), trailingIcon] }) }) }), jsxRuntime.jsx("svg", { role: "presentation", width: "17", height: "27", viewBox: "0 0 17 27", fill: "none", className: classNames__default.default("ui:translate-x-[-1.5px]", {
|
|
6350
6350
|
["ui:invisible"]: presentation !== "highlighted"
|
|
6351
6351
|
}), children: jsxRuntime.jsx("path", { d: "M0.5 0.5L16 13L0.5 26", stroke: "rgb(226 232 240)", fill: "#fff" }) })] });
|
|
6352
6352
|
};
|
|
@@ -6355,7 +6355,7 @@ const TimelineDot = ({ className }) => jsxRuntime.jsx("svg", { width: "24", heig
|
|
|
6355
6355
|
const TimelineEmphasizedDot = ({ className }) => jsxRuntime.jsx("svg", { width: "24", height: "24", fill: "none", className, children: jsxRuntime.jsx("circle", { cx: "12", cy: "11.5", r: "9.5", className: "ui:fill-white ui:stroke-blue-800 ui:stroke-[4px]" }) });
|
|
6356
6356
|
const TimelineCardLayout = (_a) => {
|
|
6357
6357
|
var { dotStyle, lineStyle = "solid", children } = _a, stackProps = __rest(_a, ["dotStyle", "lineStyle", "children"]);
|
|
6358
|
-
return jsxRuntime.jsxs(Stack, Object.assign({ axis: "x",
|
|
6358
|
+
return jsxRuntime.jsxs(Stack, Object.assign({ axis: "x", _gap: "m", width: "full", align: "stretch" }, stackProps, { children: [jsxRuntime.jsx("div", { "aria-hidden": "true", className: classNames__default.default("ui:relative ui:w-full ui:max-w-[24px] ui:bg-position-[left_11px_top]"), children: jsxRuntime.jsxs("div", { className: classNames__default.default("ui:absolute ui:top-[-8px] ui:h-[calc(100%+16px)] ui:w-full ui:max-w-[24px] ui:bg-position-[left_11px_top]", {
|
|
6359
6359
|
"ui:timelineCardLayout-line--dashed": lineStyle === "dashed",
|
|
6360
6360
|
"ui:timelineCardLayout-line--solid": lineStyle === "solid"
|
|
6361
6361
|
}), children: [dotStyle === "emphasized" && jsxRuntime.jsx(TimelineEmphasizedDot, { className: "ui:absolute ui:bottom-0 ui:top-0 ui:my-auto" }), dotStyle === "regular" && jsxRuntime.jsx(TimelineDot, { className: "ui:absolute ui:bottom-0 ui:top-0 ui:my-auto" })] }) }), jsxRuntime.jsx(Box, { width: "full", children })] }));
|
|
@@ -6697,14 +6697,14 @@ const RangeCoverageComponent = (_a) => {
|
|
|
6697
6697
|
return jsxRuntime.jsx(Text, { variant: "strong", children: translations.sectionOverlapsMessage });
|
|
6698
6698
|
}
|
|
6699
6699
|
const segments = calculateSegments({ sections, start, end });
|
|
6700
|
-
return jsxRuntime.jsx(Box, Object.assign({ className }, rest, { children: jsxRuntime.jsxs(Stack, {
|
|
6700
|
+
return jsxRuntime.jsx(Box, Object.assign({ className }, rest, { children: jsxRuntime.jsxs(Stack, { _gap: "m", width: "full", align: "stretch", children: [jsxRuntime.jsxs(Stack, { justify: "between", axis: "x", align: "center", children: [jsxRuntime.jsx(Title, { variant: "xs", level: "3", children: title }), legendSwatches && (legendSwatches === null || legendSwatches === void 0 ? void 0 : legendSwatches.length) > 0 && jsxRuntime.jsx(Stack, { axis: "x", _gap: "l", children: jsxRuntime.jsx(Stack, { axis: "x", _gap: "base", align: "center", children: legendSwatches === null || legendSwatches === void 0 ? void 0 : legendSwatches.map((swatch) => {
|
|
6701
6701
|
const background = isColorTuple(swatch.color) ? createStripedPattern({
|
|
6702
6702
|
colorA: swatch.color[0],
|
|
6703
6703
|
colorB: swatch.color[1],
|
|
6704
6704
|
startOffset: -6
|
|
6705
6705
|
}) : swatch.color;
|
|
6706
6706
|
return jsxRuntime.jsxs(React.Fragment, { children: [jsxRuntime.jsx("div", { style: Object.assign(Object.assign({}, legendSwatchStyle), { background }) }), jsxRuntime.jsx(Text, { as: "span", children: swatch.label })] }, swatch.label);
|
|
6707
|
-
}) }) })] }), jsxRuntime.jsxs(Stack, {
|
|
6707
|
+
}) }) })] }), jsxRuntime.jsxs(Stack, { _gap: "m", width: "full", align: "stretch", children: [jsxRuntime.jsx("div", { style: barContainerStyle, children: jsxRuntime.jsx("div", { style: barStyle, children: segments.map((segment) => {
|
|
6708
6708
|
var _a2, _b;
|
|
6709
6709
|
const sectionDataWithBackground = Object.assign(Object.assign({}, segment.originalSection), { background: getSegmentStyle(segment.color).background });
|
|
6710
6710
|
const renderedTooltipContent = (_a2 = tooltipContent === null || tooltipContent === void 0 ? void 0 : tooltipContent.render) === null || _a2 === void 0 ? void 0 : _a2.call(tooltipContent, sectionDataWithBackground);
|
|
@@ -6801,7 +6801,7 @@ const isSupportedFileType = (fileUrl) => {
|
|
|
6801
6801
|
return isSupportedImage(fileUrl) || isSupportedFile(fileUrl);
|
|
6802
6802
|
};
|
|
6803
6803
|
const ButtonTooltipContent = ({ children }) => {
|
|
6804
|
-
return jsxRuntime.jsxs(Tooltip__namespace.Content, { className: classNames__default.default("ui:max-w-55", "ui:data-[state=delayed-open]:animate-in ui:data-[state=closed]:animate-out ui:data-[state=closed]:fade-out-0 ui:data-[state=delayed-open]:fade-in-0 ui:data-[state=closed]:zoom-out-95 ui:data-[state=delayed-open]:zoom-in-95 ui:data-[side=bottom]:slide-in-from-top-2 ui:data-[side=left]:slide-in-from-right-2 ui:data-[side=right]:slide-in-from-left-2 ui:data-[side=top]:slide-in-from-bottom-2"), sideOffset: 4, children: [jsxRuntime.jsx(Box, { backgroundColor: "secondary-background",
|
|
6804
|
+
return jsxRuntime.jsxs(Tooltip__namespace.Content, { className: classNames__default.default("ui:max-w-55", "ui:data-[state=delayed-open]:animate-in ui:data-[state=closed]:animate-out ui:data-[state=closed]:fade-out-0 ui:data-[state=delayed-open]:fade-in-0 ui:data-[state=closed]:zoom-out-95 ui:data-[state=delayed-open]:zoom-in-95 ui:data-[side=bottom]:slide-in-from-top-2 ui:data-[side=left]:slide-in-from-right-2 ui:data-[side=right]:slide-in-from-left-2 ui:data-[side=top]:slide-in-from-bottom-2"), sideOffset: 4, children: [jsxRuntime.jsx(Box, { backgroundColor: "secondary-background", _px: "l", _py: "m", borderRadius: "xxxxs", children: jsxRuntime.jsx(Text, { color: "on-secondary", children }) }), jsxRuntime.jsx(Tooltip__namespace.Arrow, { width: 8, height: 8, className: "ui:fill-secondary-background" })] });
|
|
6805
6805
|
};
|
|
6806
6806
|
const backdropClassNames = classNames__default.default("ui:backdrop:backdrop-blur-sm", "ui:backdrop:bg-overlay-dark");
|
|
6807
6807
|
const previewClassNames = classNames__default.default(
|
|
@@ -6833,7 +6833,7 @@ const FilePreview = (props) => {
|
|
|
6833
6833
|
const onCloseDialog = (event) => {
|
|
6834
6834
|
onClose(event);
|
|
6835
6835
|
};
|
|
6836
|
-
return jsxRuntime.jsx(ModalDialog, { className: classNames__default.default(backdropClassNames, "ui:[&>div]:bg-transparent"), variant: "full-screen", open: true, onClose: onCloseDialog, children: jsxRuntime.jsxs(Stack, { align: "center", justify: "center", width: "full", className: previewClassNames, children: [jsxRuntime.jsxs(Stack, { axis: "x",
|
|
6836
|
+
return jsxRuntime.jsx(ModalDialog, { className: classNames__default.default(backdropClassNames, "ui:[&>div]:bg-transparent"), variant: "full-screen", open: true, onClose: onCloseDialog, children: jsxRuntime.jsxs(Stack, { align: "center", justify: "center", width: "full", className: previewClassNames, children: [jsxRuntime.jsxs(Stack, { axis: "x", _gap: "l", className: buttonContainerClassNames, children: [jsxRuntime.jsx("a", { href: downloadUrl !== null && downloadUrl !== void 0 ? downloadUrl : fileUrl, target: "_blank", rel: "noopener noreferrer", onClick: onDownload, children: jsxRuntime.jsxs(Tooltip__namespace.Root, { children: [jsxRuntime.jsx(Tooltip__namespace.Trigger, { children: jsxRuntime.jsx(SecondaryIconButton, { label: localization.downloadButtonLabel, children: jsxRuntime.jsx(DownloadIcon, {}) }) }), jsxRuntime.jsx(ButtonTooltipContent, { children: localization.downloadButtonLabel })] }) }), jsxRuntime.jsxs(Tooltip__namespace.Root, { children: [jsxRuntime.jsx(Tooltip__namespace.Trigger, { children: jsxRuntime.jsx(SecondaryIconButton, { label: localization.closeButtonLabel, onClick: onClose, children: jsxRuntime.jsx(CrossIcon, {}) }) }), jsxRuntime.jsx(ButtonTooltipContent, { children: localization.closeButtonLabel })] })] }), isSupportedImage(fileUrl) && jsxRuntime.jsx(Image$1, { src: fileUrl, className: imageClassNames }), isSupportedFile(fileUrl) && jsxRuntime.jsx("embed", { src: fileUrl, className: fileClassNames })] }) });
|
|
6837
6837
|
};
|
|
6838
6838
|
|
|
6839
6839
|
const AlertWidget = (props) => {
|
|
@@ -6865,7 +6865,7 @@ const AlertWidget = (props) => {
|
|
|
6865
6865
|
"ui:bg-warning-background": props.variant === "amber",
|
|
6866
6866
|
"ui:border-on-warning": props.variant === "amber",
|
|
6867
6867
|
"ui:text-on-warning": props.variant === "amber"
|
|
6868
|
-
}), borderRadius: "xxs",
|
|
6868
|
+
}), borderRadius: "xxs", _px: "base", _py: "s", axis: "x", _gap: "base", align: "center", children: [jsxRuntime.jsx(IconComponent, {}), typeof props.content === "string" ? jsxRuntime.jsx(Text, { color: contentTextColor, variant: "strong", children: props.content }) : props.content] });
|
|
6869
6869
|
};
|
|
6870
6870
|
|
|
6871
6871
|
const context = React.createContext(false);
|
|
@@ -6945,13 +6945,13 @@ const Header = (props) => {
|
|
|
6945
6945
|
"ui:items-center": slotsAlignment === "center",
|
|
6946
6946
|
"ui:items-start": slotsAlignment === "start"
|
|
6947
6947
|
});
|
|
6948
|
-
return jsxRuntime.jsxs(Stack, Object.assign({ "data-component": "PageWithCenteredContentLayout.Header", as: "header",
|
|
6948
|
+
return jsxRuntime.jsxs(Stack, Object.assign({ "data-component": "PageWithCenteredContentLayout.Header", as: "header", _p: "2xl", axis: "x", className: classes, _gap: "2xl", align: "center", justify: "center", backgroundColor: "background" }, restProps, { children: [(leftActionSlot || rightActionSlot) && jsxRuntime.jsx(Box, { className: "ui:w-[--spacing(9)] ui:h-[--spacing(9)]", children: leftActionSlot }), jsxRuntime.jsx(Stack, { axis: "x", justify: "center", width: "full", className: "ui:lg:max-w-[--spacing(310)]", children: jsxRuntime.jsx(Box, { width: "full", children }) }), (leftActionSlot || rightActionSlot) && jsxRuntime.jsx(Box, { className: "ui:w-[--spacing(9)] ui:h-[--spacing(9)]", children: rightActionSlot })] }));
|
|
6949
6949
|
};
|
|
6950
6950
|
Header.displayName = "PageWithCenteredContentLayout.Header";
|
|
6951
6951
|
const Main = (props) => {
|
|
6952
6952
|
const { children, className } = props, restProps = __rest(props, ["children", "className"]);
|
|
6953
6953
|
const classes = classNames__default.default(className, "ui:max-w-[100vw] ui:h-full ui:content-center ui:z-10");
|
|
6954
|
-
return jsxRuntime.jsx(Stack, Object.assign({ "data-component": "PageWithCenteredContentLayout.Main", as: "main", width: "full", align: "center",
|
|
6954
|
+
return jsxRuntime.jsx(Stack, Object.assign({ "data-component": "PageWithCenteredContentLayout.Main", as: "main", width: "full", align: "center", _p: "2xl", className: classes }, restProps, { children: jsxRuntime.jsx(Box, { width: "full", className: "ui:lg:max-w-[--spacing(310)] ui:h-full", children }) }));
|
|
6955
6955
|
};
|
|
6956
6956
|
Main.displayName = "PageWithCenteredContentLayout.Main";
|
|
6957
6957
|
const PageWithCenteredContentLayout = (props) => {
|
|
@@ -7071,7 +7071,7 @@ const NaturalLanguageFormInputSelect = Object.assign(NaturalLanguageFormInputSel
|
|
|
7071
7071
|
|
|
7072
7072
|
const NaturalLanguageForm = React__namespace.default.forwardRef((props, ref) => {
|
|
7073
7073
|
const { className, children, height = "md" } = props;
|
|
7074
|
-
return jsxRuntime.jsx(NaturalLanguageFormContext.Provider, { value: { height }, children: jsxRuntime.jsx(Stack, { ref, axis: "x",
|
|
7074
|
+
return jsxRuntime.jsx(NaturalLanguageFormContext.Provider, { value: { height }, children: jsxRuntime.jsx(Stack, { ref, axis: "x", _gap: "m", align: "center", wrap: true, className, children }) });
|
|
7075
7075
|
});
|
|
7076
7076
|
NaturalLanguageForm.displayName = "NaturalLanguageForm";
|
|
7077
7077
|
const NaturalLanguageFormWithSubComponents = Object.assign(NaturalLanguageForm, {
|