@uniformdev/design-system 19.51.1-alpha.10 → 19.53.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/esm/index.js +865 -876
- package/dist/index.d.mts +15 -11
- package/dist/index.d.ts +15 -11
- package/dist/index.js +1000 -1007
- package/package.json +4 -4
package/dist/esm/index.js
CHANGED
|
@@ -328,34 +328,6 @@ var buttonRippleEffect = (props) => css`
|
|
|
328
328
|
transition: background 0s;
|
|
329
329
|
}
|
|
330
330
|
`;
|
|
331
|
-
var buttonAccentAltDark = css`
|
|
332
|
-
background: var(--accent-alt-dark);
|
|
333
|
-
color: var(--white);
|
|
334
|
-
|
|
335
|
-
&:disabled {
|
|
336
|
-
background: var(--gray-300);
|
|
337
|
-
color: var(--white);
|
|
338
|
-
}
|
|
339
|
-
|
|
340
|
-
${buttonRippleEffect({ hoverColor: "var(--brand-secondary-1)" })}
|
|
341
|
-
`;
|
|
342
|
-
var buttonAccentAltDarkOutline = css`
|
|
343
|
-
background: var(--white);
|
|
344
|
-
color: var(--accent-alt-dark);
|
|
345
|
-
box-shadow: 0 0 0 1px var(--accent-alt-dark);
|
|
346
|
-
transition: box-shadow var(--duration-fast) var(--timing-ease-out);
|
|
347
|
-
|
|
348
|
-
&:hover {
|
|
349
|
-
color: var(--primary-action-hover);
|
|
350
|
-
}
|
|
351
|
-
|
|
352
|
-
&:disabled {
|
|
353
|
-
color: var(--gray-300);
|
|
354
|
-
box-shadow: 0 0 0 1px var(--gray-300);
|
|
355
|
-
}
|
|
356
|
-
|
|
357
|
-
${buttonRippleEffect({ hoverColor: "var(--gray-50)" })}
|
|
358
|
-
`;
|
|
359
331
|
var buttonPrimary = css`
|
|
360
332
|
background: var(--brand-secondary-1);
|
|
361
333
|
color: var(--white);
|
|
@@ -1053,9 +1025,6 @@ var IconImg = css8`
|
|
|
1053
1025
|
vertical-align: middle;
|
|
1054
1026
|
}
|
|
1055
1027
|
`;
|
|
1056
|
-
var IconWhite = css8`
|
|
1057
|
-
color: var(--white);
|
|
1058
|
-
`;
|
|
1059
1028
|
var IconColorDefault = css8`
|
|
1060
1029
|
color: var(--brand-secondary-3);
|
|
1061
1030
|
`;
|
|
@@ -1110,7 +1079,6 @@ var IconInner = ({ icon, iconColor = "default", size = "1.5rem", ...otherProps }
|
|
|
1110
1079
|
const isIconName = typeof icon === "string";
|
|
1111
1080
|
const { iconsMap, isLoading } = useIconContext();
|
|
1112
1081
|
const customColor = {
|
|
1113
|
-
white: IconWhite,
|
|
1114
1082
|
action: IconColorAction,
|
|
1115
1083
|
default: IconColorDefault,
|
|
1116
1084
|
gray: IconColorGray,
|
|
@@ -1720,60 +1688,6 @@ var diamondFill = GenIcon({
|
|
|
1720
1688
|
}
|
|
1721
1689
|
]
|
|
1722
1690
|
});
|
|
1723
|
-
var magicWand = GenIcon({
|
|
1724
|
-
tag: "svg",
|
|
1725
|
-
attr: {
|
|
1726
|
-
role: "img",
|
|
1727
|
-
viewBox: "0 0 24 24"
|
|
1728
|
-
},
|
|
1729
|
-
child: [
|
|
1730
|
-
{
|
|
1731
|
-
tag: "path",
|
|
1732
|
-
attr: {
|
|
1733
|
-
fill: "currentColor",
|
|
1734
|
-
fillOpacity: "0.5",
|
|
1735
|
-
d: "M12.6021 0.799316C12.5443 0.799316 12.487 0.802204 12.4305 0.807862C12.3484 1.91145 11.5902 2.79082 10.6387 2.88601C10.6338 2.9516 10.6313 3.01798 10.6313 3.08503C10.6313 3.15208 10.6338 3.21846 10.6387 3.28405C11.5902 3.37924 12.3484 4.25862 12.4305 5.3622C12.487 5.36786 12.5443 5.37074 12.6021 5.37074C12.6599 5.37074 12.7171 5.36786 12.7737 5.3622C12.8558 4.25862 13.614 3.37924 14.5655 3.28405C14.5704 3.21846 14.5729 3.15208 14.5729 3.08503C14.5729 3.01798 14.5704 2.9516 14.5655 2.88601C13.614 2.79082 12.8558 1.91145 12.7737 0.807862C12.7171 0.802204 12.6599 0.799316 12.6021 0.799316Z"
|
|
1736
|
-
},
|
|
1737
|
-
child: []
|
|
1738
|
-
},
|
|
1739
|
-
{
|
|
1740
|
-
tag: "path",
|
|
1741
|
-
attr: {
|
|
1742
|
-
fill: "currentColor",
|
|
1743
|
-
fillOpacity: "0.5",
|
|
1744
|
-
d: "M17.8945 12.4247C17.8367 12.4247 17.7795 12.4276 17.7229 12.4332C17.6409 13.5368 16.8826 14.4162 15.9311 14.5114C15.9262 14.577 15.9237 14.6433 15.9237 14.7104C15.9237 14.7774 15.9262 14.8438 15.9311 14.9094C16.8826 15.0046 17.6409 15.884 17.7229 16.9876C17.7795 16.9932 17.8367 16.9961 17.8945 16.9961C17.9523 16.9961 18.0096 16.9932 18.0661 16.9876C18.1482 15.884 18.9064 15.0046 19.858 14.9094C19.8628 14.8438 19.8653 14.7774 19.8653 14.7104C19.8653 14.6433 19.8628 14.577 19.858 14.5114C18.9064 14.4162 18.1482 13.5368 18.0661 12.4332C18.0096 12.4276 17.9523 12.4247 17.8945 12.4247Z"
|
|
1745
|
-
},
|
|
1746
|
-
child: []
|
|
1747
|
-
},
|
|
1748
|
-
{
|
|
1749
|
-
tag: "path",
|
|
1750
|
-
attr: {
|
|
1751
|
-
fill: "currentColor",
|
|
1752
|
-
fillOpacity: "0.5",
|
|
1753
|
-
d: "M21.571 1.6413C21.509 1.6413 21.4476 1.6449 21.387 1.65195C21.299 3.02718 20.4858 4.12302 19.4653 4.24164C19.4601 4.32337 19.4574 4.40609 19.4574 4.48965C19.4574 4.57321 19.4601 4.65592 19.4653 4.73766C20.4858 4.85628 21.299 5.95211 21.387 7.32734C21.4476 7.33439 21.509 7.33799 21.571 7.33799C21.633 7.33799 21.6944 7.33439 21.755 7.32734C21.8431 5.95211 22.6562 4.85628 23.6767 4.73766C23.6819 4.65592 23.6846 4.57321 23.6846 4.48965C23.6846 4.40609 23.6819 4.32337 23.6767 4.24164C22.6562 4.12302 21.8431 3.02718 21.755 1.65195C21.6944 1.6449 21.633 1.6413 21.571 1.6413Z"
|
|
1754
|
-
},
|
|
1755
|
-
child: []
|
|
1756
|
-
},
|
|
1757
|
-
{
|
|
1758
|
-
tag: "path",
|
|
1759
|
-
attr: {
|
|
1760
|
-
fill: "currentColor",
|
|
1761
|
-
d: "M15.6875 11.9141L12.5116 8.73823L2.07262 19.1773C1.9166 19.3333 1.9166 19.5862 2.07262 19.7422L4.68354 22.3532C4.83956 22.5092 5.0925 22.5092 5.24852 22.3532L15.6875 11.9141Z"
|
|
1762
|
-
},
|
|
1763
|
-
child: []
|
|
1764
|
-
},
|
|
1765
|
-
{
|
|
1766
|
-
tag: "path",
|
|
1767
|
-
attr: {
|
|
1768
|
-
fill: "currentColor",
|
|
1769
|
-
fillRule: "evenodd",
|
|
1770
|
-
clipRule: "evenodd",
|
|
1771
|
-
d: "M16.8929 4.92196L19.5038 7.53288L14.8688 12.1679L12.2578 9.55702L16.8929 4.92196ZM19.7863 7.2504C19.9423 7.40641 19.9423 7.65936 19.7863 7.81537L15.6875 11.9141L12.5116 8.73823L16.6104 4.63947C16.7664 4.48346 17.0194 4.48346 17.1754 4.63947L19.7863 7.2504Z"
|
|
1772
|
-
},
|
|
1773
|
-
child: []
|
|
1774
|
-
}
|
|
1775
|
-
]
|
|
1776
|
-
});
|
|
1777
1691
|
var customIcons = {
|
|
1778
1692
|
"rectangle-rounded": rectangleRoundedIcon,
|
|
1779
1693
|
card: cardIcon,
|
|
@@ -1797,8 +1711,7 @@ var customIcons = {
|
|
|
1797
1711
|
"clear-formatting": clearFormatting,
|
|
1798
1712
|
"yes-no": yesNoIcon,
|
|
1799
1713
|
"diamond-outline": diamondOutline,
|
|
1800
|
-
"diamond-fill": diamondFill
|
|
1801
|
-
"magic-wand": magicWand
|
|
1714
|
+
"diamond-fill": diamondFill
|
|
1802
1715
|
};
|
|
1803
1716
|
|
|
1804
1717
|
// src/components/AddListButton/AddListButton.styles.ts
|
|
@@ -2354,7 +2267,7 @@ var PageHeaderSection = ({
|
|
|
2354
2267
|
if (linkText && linkProps && !linkManagerComponent) {
|
|
2355
2268
|
throw Error("You must provide a linkManagerComponent");
|
|
2356
2269
|
}
|
|
2357
|
-
return /* @__PURE__ */ jsxs6("div", { css: PageHeaderSectionContainer, children: [
|
|
2270
|
+
return /* @__PURE__ */ jsxs6("div", { css: PageHeaderSectionContainer, "data-testid": "page-header", children: [
|
|
2358
2271
|
/* @__PURE__ */ jsxs6("section", { css: PageHeaderSectionDetails, children: [
|
|
2359
2272
|
linkText && linkProps && linkManagerComponent ? /* @__PURE__ */ jsxs6("div", { css: PageHeaderSectionLinkContainer, children: [
|
|
2360
2273
|
/* @__PURE__ */ jsx14(Icon, { icon: CgChevronLeft, size: 18, css: PageHeaderSectionLinkIcon, iconColor: "currentColor" }),
|
|
@@ -2364,7 +2277,8 @@ var PageHeaderSection = ({
|
|
|
2364
2277
|
linkManagerComponent,
|
|
2365
2278
|
...linkProps,
|
|
2366
2279
|
css: PageHeaderSectionLink,
|
|
2367
|
-
text: linkText
|
|
2280
|
+
text: linkText,
|
|
2281
|
+
"data-testid": "page-header-link"
|
|
2368
2282
|
}
|
|
2369
2283
|
)
|
|
2370
2284
|
] }) : null,
|
|
@@ -11386,8 +11300,6 @@ var Button = React6.forwardRef(
|
|
|
11386
11300
|
const buttonTheme = {
|
|
11387
11301
|
primary: buttonPrimary,
|
|
11388
11302
|
primaryInvert: buttonPrimaryInvert,
|
|
11389
|
-
"accent-alt-dark": buttonAccentAltDark,
|
|
11390
|
-
"accent-alt-dark-outline": buttonAccentAltDarkOutline,
|
|
11391
11303
|
destructive: buttonDestructive,
|
|
11392
11304
|
secondary: buttonSecondary,
|
|
11393
11305
|
secondaryInvert: buttonSecondaryInvert,
|
|
@@ -11621,6 +11533,7 @@ var Menu = ({
|
|
|
11621
11533
|
typeof menuItemsContainerCssClasses === "object" ? menuItemsContainerCssClasses : void 0
|
|
11622
11534
|
],
|
|
11623
11535
|
className: typeof menuItemsContainerCssClasses === "string" ? menuItemsContainerCssClasses : "",
|
|
11536
|
+
"data-testid": "more-menu",
|
|
11624
11537
|
children: disableAutoSeparatorManagement ? children : filterMenuSeparators(children)
|
|
11625
11538
|
}
|
|
11626
11539
|
) })
|
|
@@ -13456,50 +13369,57 @@ import { forwardRef as forwardRef4 } from "react";
|
|
|
13456
13369
|
// src/components/IconButton/IconButton.styles.ts
|
|
13457
13370
|
import { css as css44 } from "@emotion/react";
|
|
13458
13371
|
var iconButton = css44`
|
|
13459
|
-
|
|
13460
|
-
|
|
13461
|
-
|
|
13372
|
+
padding: 0;
|
|
13373
|
+
max-width: unset;
|
|
13374
|
+
justify-content: center;
|
|
13375
|
+
width: var(--button-size);
|
|
13376
|
+
height: var(--button-size);
|
|
13377
|
+
`;
|
|
13378
|
+
var sizes = {
|
|
13379
|
+
xs: css44`
|
|
13380
|
+
--button-size: 2rem;
|
|
13381
|
+
`,
|
|
13382
|
+
sm: css44`
|
|
13383
|
+
--button-size: 2.25rem;
|
|
13384
|
+
`,
|
|
13385
|
+
md: css44`
|
|
13386
|
+
--button-size: 2.5rem;
|
|
13387
|
+
`
|
|
13388
|
+
};
|
|
13389
|
+
var variants = {
|
|
13390
|
+
square: null,
|
|
13391
|
+
rounded: css44`
|
|
13392
|
+
border-radius: 50%;
|
|
13393
|
+
`
|
|
13394
|
+
};
|
|
13462
13395
|
|
|
13463
13396
|
// src/components/IconButton/IconButton.tsx
|
|
13464
13397
|
import { jsx as jsx47 } from "@emotion/react/jsx-runtime";
|
|
13465
|
-
var IconButton = forwardRef4(
|
|
13466
|
-
|
|
13467
|
-
});
|
|
13398
|
+
var IconButton = forwardRef4(
|
|
13399
|
+
({ children, size = "md", variant = "square", ...props }, ref) => {
|
|
13400
|
+
return /* @__PURE__ */ jsx47(Button, { ref, css: [iconButton, variants[variant], sizes[size]], ...props, children });
|
|
13401
|
+
}
|
|
13402
|
+
);
|
|
13468
13403
|
IconButton.displayName = "IconButton";
|
|
13469
13404
|
|
|
13470
|
-
// src/components/Image/
|
|
13471
|
-
import {
|
|
13472
|
-
|
|
13473
|
-
|
|
13474
|
-
|
|
13475
|
-
|
|
13476
|
-
|
|
13477
|
-
|
|
13478
|
-
|
|
13479
|
-
|
|
13480
|
-
|
|
13481
|
-
|
|
13482
|
-
|
|
13483
|
-
"data-testid": "broken-image",
|
|
13484
|
-
...props,
|
|
13485
|
-
children: [
|
|
13486
|
-
/* @__PURE__ */ jsx48("rect", { width: "214", height: "214", fill: "#F9FAFB" }),
|
|
13487
|
-
/* @__PURE__ */ jsx48("rect", { width: "214", height: "214", fill: "url(#pattern0)" }),
|
|
13488
|
-
/* @__PURE__ */ jsxs29("defs", { children: [
|
|
13489
|
-
/* @__PURE__ */ jsx48("pattern", { id: "pattern0", patternContentUnits: "objectBoundingBox", width: "1", height: "1", children: /* @__PURE__ */ jsx48("use", { xlinkHref: "#image0_761_4353", transform: "scale(0.0025)" }) }),
|
|
13490
|
-
/* @__PURE__ */ jsx48(
|
|
13491
|
-
"image",
|
|
13492
|
-
{
|
|
13493
|
-
id: "image0_761_4353",
|
|
13494
|
-
width: "400",
|
|
13495
|
-
height: "400",
|
|
13496
|
-
xlinkHref: "data:image/png;base64,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UfKBgDEBDMtYXFKDgBsBDMtNUfKBgDEBDMtYXFKDgBsBDMtNUfKBgDEBDMtYXFKDgBsBDMtNUfKBgDEBDMtYXFKDgBsBDMtNUfKBgDEBDMtYXFKDgBsBDMtNUfKBgDEBDMtYXFKDgBsBDMtNUfKBgDEBDMtYXFKDgBsBDMtNUfKBgDEBDMtYXFKDgBsBDMtNUfKBgDEBDMtYXFKDgBsBDMtNUfKBgDEBDMtYXFKDgBsBDMtNUfKBgDEBDMtYXFKDgBsBDMtNUfKBgDEBDMtYXFKDgBsBDMtNUfKBgDEBDMtYXFKDgBsBDMtNUfKBgDEBDMtYXFKDgBsBDMtNUfKBgDEBDMtYXFKDgBsBDMtNUfKBgDEBDMtYXFKDgBsBDMtNUfKBgDEBDMtYXFKDgBsBDMtNUfKBgDEBDMtYXFKDgBsBDMtNUfKBgDEBDMtYXFKDgBsBDMtNUfKBgDEBDMtYXFKDgBsBDMtNUfKBgDEBDMtYXFKDgBsBDMtNUfKBgDEBDMtYXFKDgBsBDMtNUfKBgDEBDMtYXFKDgBsBDMtNUfKBgDEBDMtYXFKDgBsBDMtNUfKBgDEBDMtYXFKDgBsBDMtNUfKBgDEBDMtYXFKDgBsBDMtNUfKBgDEBDMtYXFKDgBsBDMtNUfKBgDEBDMtYXFKDgBsBDMtNUfKBgDEBDMtYXFKDgBsBDMtNUfKBgDEBDMtYXFKDgBsBDMtNUfKBgDEBDMtYXFKDgBsBDMtNUfKBgDEBDMtYXFKDgBsBDMtNUfKBgDEBDMtYXFKDgBsBDMtNUfKBgDEBDMtYXFKDgBsBDMtNUfKBgDEBDMtYXFKDgBsBDMtNUfKBgDEBDMtYXFKDgBsBDMtNUfKBgDEBDMtYXFKDgBsBDMtNUfKBgDEBDMtYXFKDgBsBDMtNUfKBgDEBDMtYXFKDgBsBDMtNUfKBgDEBDMtYXFKDgBsBDMtNUfKBgDEBDMtYXFKDgBsBDMtNUfKBgDEBDMtYXFKDgBsBDMtNUfKBgDEBDMtYXFKDgBsBDMtNUfKBgDEBDMtYXFKDgBsBDMtNUfKBgDEBDMtYXFKDgBsBDMtNUfKBgDEBDMtYXFKDgBsBDMtNUfKBgDEBDMtYXFKDgBsBDMtNUfKBgDEBDMtYXFKDgBsBDMtNUfKBgDEBDMtYXFKDgBsBDMtNUfKBgDEBDMtYXFKDgBsBDMtNUfKBgDEBDMtYXFKDgBsBDMtNUfKBgDEBDMtYXFKDgBsBDMtNUfKBgDEBDMtYXFKDgBsBDMtNUfKBgDEBDMtYXFKDgBsBDMtNUfKBgDEBDMtYXFKDgBsBDMtNUfKBgDEBDMtYXFKDgBsBDMtNUfKBgDEBDMtYXFKDgBsBDMtNUfKBgDEBDMtYXFKDgBsBDMtNUfKBgDEBDMtYXFKDgBsBDMtNUfKBgDEBDMtYXFKDgBsBDMtNUfKBgDEBDMtYXFKDgBsBDMtNUfKBgDEBDMtYXFKDgBsBDMtNUfKBgDEBDMtYXFKDgBsBDMtNUfKBgDEBDMtYXFKDgBsBDMtNUfKBgDEBDMtYXFKDgBsBDMtNUfKBgDEBDMtYXFKDgBsBDMtNUfKBgDEBDMtYXFKDgBsBDMtNUfKBgDEBDMtYXFKDgBuB/we75KcVO2CRagAAAABJRU5ErkJggg=="
|
|
13497
|
-
}
|
|
13498
|
-
)
|
|
13499
|
-
] })
|
|
13500
|
-
]
|
|
13405
|
+
// src/components/Image/Image.tsx
|
|
13406
|
+
import { useCallback as useCallback2, useEffect as useEffect7, useState as useState8 } from "react";
|
|
13407
|
+
|
|
13408
|
+
// src/utils/url.ts
|
|
13409
|
+
var isValidUrl = (urlString, options = {}) => {
|
|
13410
|
+
try {
|
|
13411
|
+
const isRelativeToLocation = /^([/.])/.test(urlString);
|
|
13412
|
+
const url = new URL(
|
|
13413
|
+
urlString,
|
|
13414
|
+
options.allowRelative && isRelativeToLocation ? "https://defaultbaseurl.com" : void 0
|
|
13415
|
+
);
|
|
13416
|
+
if (options.isSecure) {
|
|
13417
|
+
return url.protocol === "https:";
|
|
13501
13418
|
}
|
|
13502
|
-
|
|
13419
|
+
return true;
|
|
13420
|
+
} catch (e) {
|
|
13421
|
+
return false;
|
|
13422
|
+
}
|
|
13503
13423
|
};
|
|
13504
13424
|
|
|
13505
13425
|
// src/components/Input/styles/CaptionText.styles.ts
|
|
@@ -13513,9 +13433,9 @@ var CaptionText = (dynamicSize) => css45`
|
|
|
13513
13433
|
`;
|
|
13514
13434
|
|
|
13515
13435
|
// src/components/Input/Caption.tsx
|
|
13516
|
-
import { jsx as
|
|
13436
|
+
import { jsx as jsx48 } from "@emotion/react/jsx-runtime";
|
|
13517
13437
|
var Caption = ({ children, testId, dynamicSize = false, ...props }) => {
|
|
13518
|
-
return /* @__PURE__ */
|
|
13438
|
+
return /* @__PURE__ */ jsx48("small", { css: CaptionText(dynamicSize), "data-testid": testId, ...props, children });
|
|
13519
13439
|
};
|
|
13520
13440
|
|
|
13521
13441
|
// src/components/Input/CheckboxWithInfo.tsx
|
|
@@ -13594,21 +13514,21 @@ var InfoDialogMessage = css46`
|
|
|
13594
13514
|
`;
|
|
13595
13515
|
|
|
13596
13516
|
// src/components/Input/CheckboxWithInfo.tsx
|
|
13597
|
-
import { jsx as
|
|
13517
|
+
import { jsx as jsx49, jsxs as jsxs29 } from "@emotion/react/jsx-runtime";
|
|
13598
13518
|
var InfoDialog = ({ message }) => {
|
|
13599
|
-
return /* @__PURE__ */
|
|
13600
|
-
/* @__PURE__ */
|
|
13601
|
-
/* @__PURE__ */
|
|
13519
|
+
return /* @__PURE__ */ jsxs29("div", { "data-testid": "info-dialog", css: InfoDialogContainer, children: [
|
|
13520
|
+
/* @__PURE__ */ jsx49(Icon, { icon: "info", iconColor: "action", size: "0.9rem" }),
|
|
13521
|
+
/* @__PURE__ */ jsx49("div", { role: "paragraph", css: InfoDialogMessage, className: "info-message", children: message })
|
|
13602
13522
|
] });
|
|
13603
13523
|
};
|
|
13604
13524
|
var CheckboxWithInfo = forwardRef5(
|
|
13605
13525
|
({ label, name, info, ...props }, ref) => {
|
|
13606
|
-
return /* @__PURE__ */
|
|
13607
|
-
/* @__PURE__ */
|
|
13608
|
-
/* @__PURE__ */
|
|
13609
|
-
/* @__PURE__ */
|
|
13526
|
+
return /* @__PURE__ */ jsxs29("div", { css: CheckboxWithInfoContainer, children: [
|
|
13527
|
+
/* @__PURE__ */ jsxs29("label", { css: CheckboxWithInfoLabel, children: [
|
|
13528
|
+
/* @__PURE__ */ jsx49("input", { type: "checkbox", name, ref, css: CheckboxWithInfoInput, ...props }),
|
|
13529
|
+
/* @__PURE__ */ jsx49("span", { children: label })
|
|
13610
13530
|
] }),
|
|
13611
|
-
info ? /* @__PURE__ */
|
|
13531
|
+
info ? /* @__PURE__ */ jsx49(InfoDialog, { message: info }) : null
|
|
13612
13532
|
] });
|
|
13613
13533
|
}
|
|
13614
13534
|
);
|
|
@@ -13626,10 +13546,10 @@ var ErrorText = css47`
|
|
|
13626
13546
|
`;
|
|
13627
13547
|
|
|
13628
13548
|
// src/components/Input/ErrorMessage.tsx
|
|
13629
|
-
import { jsx as
|
|
13549
|
+
import { jsx as jsx50, jsxs as jsxs30 } from "@emotion/react/jsx-runtime";
|
|
13630
13550
|
var ErrorMessage = ({ message, testId, ...otherProps }) => {
|
|
13631
|
-
return message ? /* @__PURE__ */
|
|
13632
|
-
/* @__PURE__ */
|
|
13551
|
+
return message ? /* @__PURE__ */ jsxs30("span", { role: "alert", css: ErrorText, "data-testid": testId, ...otherProps, children: [
|
|
13552
|
+
/* @__PURE__ */ jsx50("span", { children: /* @__PURE__ */ jsx50(Icon, { icon: MdWarning, size: "1rem", iconColor: "currentColor" }) }),
|
|
13633
13553
|
message
|
|
13634
13554
|
] }) : null;
|
|
13635
13555
|
};
|
|
@@ -13678,12 +13598,12 @@ var fieldsetBody = css48`
|
|
|
13678
13598
|
`;
|
|
13679
13599
|
|
|
13680
13600
|
// src/components/Input/Fieldset.tsx
|
|
13681
|
-
import { jsx as
|
|
13601
|
+
import { jsx as jsx51, jsxs as jsxs31 } from "@emotion/react/jsx-runtime";
|
|
13682
13602
|
var Fieldset = React15.forwardRef(
|
|
13683
13603
|
({ legend, disabled, children, invert, ...props }, ref) => {
|
|
13684
|
-
return /* @__PURE__ */
|
|
13604
|
+
return /* @__PURE__ */ jsxs31("fieldset", { css: fieldsetContainer(Boolean(invert)), ref, disabled, ...props, children: [
|
|
13685
13605
|
legend,
|
|
13686
|
-
/* @__PURE__ */
|
|
13606
|
+
/* @__PURE__ */ jsx51("div", { css: fieldsetBody, children })
|
|
13687
13607
|
] });
|
|
13688
13608
|
}
|
|
13689
13609
|
);
|
|
@@ -13707,10 +13627,10 @@ var InfoIcon2 = css49`
|
|
|
13707
13627
|
`;
|
|
13708
13628
|
|
|
13709
13629
|
// src/components/Input/InfoMessage.tsx
|
|
13710
|
-
import { jsx as
|
|
13630
|
+
import { jsx as jsx52, jsxs as jsxs32 } from "@emotion/react/jsx-runtime";
|
|
13711
13631
|
var InfoMessage = ({ message, testId, ...props }) => {
|
|
13712
|
-
return message ? /* @__PURE__ */
|
|
13713
|
-
/* @__PURE__ */
|
|
13632
|
+
return message ? /* @__PURE__ */ jsxs32("span", { role: "status", css: InfoText, "data-testid": testId, ...props, children: [
|
|
13633
|
+
/* @__PURE__ */ jsx52("span", { children: /* @__PURE__ */ jsx52(Icon, { css: InfoIcon2, icon: MdInfoOutline, size: "1rem", iconColor: "currentColor" }) }),
|
|
13714
13634
|
message
|
|
13715
13635
|
] }) : null;
|
|
13716
13636
|
};
|
|
@@ -13719,9 +13639,9 @@ var InfoMessage = ({ message, testId, ...props }) => {
|
|
|
13719
13639
|
import * as React16 from "react";
|
|
13720
13640
|
|
|
13721
13641
|
// src/components/Input/Label.tsx
|
|
13722
|
-
import { jsx as
|
|
13642
|
+
import { jsx as jsx53 } from "@emotion/react/jsx-runtime";
|
|
13723
13643
|
var Label = ({ children, className, testId, ...props }) => {
|
|
13724
|
-
return /* @__PURE__ */
|
|
13644
|
+
return /* @__PURE__ */ jsx53(
|
|
13725
13645
|
"label",
|
|
13726
13646
|
{
|
|
13727
13647
|
css: [labelText, typeof className === "object" ? className : void 0],
|
|
@@ -13749,16 +13669,16 @@ var WarningIcon = css50`
|
|
|
13749
13669
|
`;
|
|
13750
13670
|
|
|
13751
13671
|
// src/components/Input/WarningMessage.tsx
|
|
13752
|
-
import { jsx as
|
|
13672
|
+
import { jsx as jsx54, jsxs as jsxs33 } from "@emotion/react/jsx-runtime";
|
|
13753
13673
|
var WarningMessage = ({ message, testId, ...props }) => {
|
|
13754
|
-
return message ? /* @__PURE__ */
|
|
13755
|
-
/* @__PURE__ */
|
|
13674
|
+
return message ? /* @__PURE__ */ jsxs33("span", { role: "status", css: WarningText, "data-testid": testId, ...props, children: [
|
|
13675
|
+
/* @__PURE__ */ jsx54("span", { children: /* @__PURE__ */ jsx54(Icon, { css: WarningIcon, icon: MdWarning2, size: "1rem", iconColor: "currentColor" }) }),
|
|
13756
13676
|
message
|
|
13757
13677
|
] }) : null;
|
|
13758
13678
|
};
|
|
13759
13679
|
|
|
13760
13680
|
// src/components/Input/Input.tsx
|
|
13761
|
-
import { jsx as
|
|
13681
|
+
import { jsx as jsx55, jsxs as jsxs34 } from "@emotion/react/jsx-runtime";
|
|
13762
13682
|
var Input = React16.forwardRef(
|
|
13763
13683
|
({
|
|
13764
13684
|
label,
|
|
@@ -13778,13 +13698,13 @@ var Input = React16.forwardRef(
|
|
|
13778
13698
|
classNameLabel,
|
|
13779
13699
|
...props
|
|
13780
13700
|
}, ref) => {
|
|
13781
|
-
return /* @__PURE__ */
|
|
13701
|
+
return /* @__PURE__ */ jsxs34(
|
|
13782
13702
|
"div",
|
|
13783
13703
|
{
|
|
13784
13704
|
css: [inputContainer, typeof classNameRoot === "object" ? classNameRoot : void 0],
|
|
13785
13705
|
"data-testid": containerTestId ? containerTestId : "container-input-field",
|
|
13786
13706
|
children: [
|
|
13787
|
-
showLabel ? /* @__PURE__ */
|
|
13707
|
+
showLabel ? /* @__PURE__ */ jsx55(
|
|
13788
13708
|
Label,
|
|
13789
13709
|
{
|
|
13790
13710
|
htmlFor: id,
|
|
@@ -13794,13 +13714,13 @@ var Input = React16.forwardRef(
|
|
|
13794
13714
|
children: label
|
|
13795
13715
|
}
|
|
13796
13716
|
) : null,
|
|
13797
|
-
/* @__PURE__ */
|
|
13717
|
+
/* @__PURE__ */ jsxs34(
|
|
13798
13718
|
"div",
|
|
13799
13719
|
{
|
|
13800
13720
|
css: [inputContainer, typeof classNameContainer === "object" ? classNameContainer : void 0],
|
|
13801
13721
|
className: typeof classNameContainer === "string" ? classNameContainer : "",
|
|
13802
13722
|
children: [
|
|
13803
|
-
/* @__PURE__ */
|
|
13723
|
+
/* @__PURE__ */ jsx55(
|
|
13804
13724
|
"input",
|
|
13805
13725
|
{
|
|
13806
13726
|
id,
|
|
@@ -13816,13 +13736,13 @@ var Input = React16.forwardRef(
|
|
|
13816
13736
|
ref
|
|
13817
13737
|
}
|
|
13818
13738
|
),
|
|
13819
|
-
icon ? /* @__PURE__ */
|
|
13739
|
+
icon ? /* @__PURE__ */ jsx55("div", { css: inputIcon, children: icon }) : null
|
|
13820
13740
|
]
|
|
13821
13741
|
}
|
|
13822
13742
|
),
|
|
13823
|
-
caption ? /* @__PURE__ */
|
|
13824
|
-
errorMessage ? /* @__PURE__ */
|
|
13825
|
-
warningMessage && !errorMessage ? /* @__PURE__ */
|
|
13743
|
+
caption ? /* @__PURE__ */ jsx55(Caption, { testId: captionTestId, children: caption }) : null,
|
|
13744
|
+
errorMessage ? /* @__PURE__ */ jsx55(ErrorMessage, { message: errorMessage, testId: errorTestId }) : null,
|
|
13745
|
+
warningMessage && !errorMessage ? /* @__PURE__ */ jsx55(WarningMessage, { message: warningMessage }) : null
|
|
13826
13746
|
]
|
|
13827
13747
|
}
|
|
13828
13748
|
);
|
|
@@ -13831,10 +13751,10 @@ var Input = React16.forwardRef(
|
|
|
13831
13751
|
|
|
13832
13752
|
// src/components/Input/InputComboBox.tsx
|
|
13833
13753
|
import Select from "react-select";
|
|
13834
|
-
import { jsx as
|
|
13754
|
+
import { jsx as jsx56 } from "@emotion/react/jsx-runtime";
|
|
13835
13755
|
function InputComboBox(props) {
|
|
13836
13756
|
var _a;
|
|
13837
|
-
return /* @__PURE__ */
|
|
13757
|
+
return /* @__PURE__ */ jsx56(
|
|
13838
13758
|
Select,
|
|
13839
13759
|
{
|
|
13840
13760
|
...props,
|
|
@@ -14034,7 +13954,7 @@ var inlineSelectMenuClosed = css51`
|
|
|
14034
13954
|
`;
|
|
14035
13955
|
|
|
14036
13956
|
// src/components/Input/InputInlineSelect.tsx
|
|
14037
|
-
import { jsx as
|
|
13957
|
+
import { jsx as jsx57, jsxs as jsxs35 } from "@emotion/react/jsx-runtime";
|
|
14038
13958
|
var InputInlineSelect = ({
|
|
14039
13959
|
classNameContainer,
|
|
14040
13960
|
options,
|
|
@@ -14048,7 +13968,7 @@ var InputInlineSelect = ({
|
|
|
14048
13968
|
const divRef = useRef4(null);
|
|
14049
13969
|
useOutsideClick(divRef, () => setMenuVisible(false));
|
|
14050
13970
|
const selected = options.find((option) => option.value === value);
|
|
14051
|
-
return /* @__PURE__ */
|
|
13971
|
+
return /* @__PURE__ */ jsxs35(
|
|
14052
13972
|
"div",
|
|
14053
13973
|
{
|
|
14054
13974
|
ref: divRef,
|
|
@@ -14058,7 +13978,7 @@ var InputInlineSelect = ({
|
|
|
14058
13978
|
`,
|
|
14059
13979
|
className: typeof classNameContainer === "string" ? classNameContainer : "",
|
|
14060
13980
|
children: [
|
|
14061
|
-
/* @__PURE__ */
|
|
13981
|
+
/* @__PURE__ */ jsxs35(
|
|
14062
13982
|
"button",
|
|
14063
13983
|
{
|
|
14064
13984
|
type: "button",
|
|
@@ -14072,18 +13992,18 @@ var InputInlineSelect = ({
|
|
|
14072
13992
|
disabled,
|
|
14073
13993
|
...props,
|
|
14074
13994
|
children: [
|
|
14075
|
-
/* @__PURE__ */
|
|
14076
|
-
disabled ? null : /* @__PURE__ */
|
|
13995
|
+
/* @__PURE__ */ jsx57("span", { children: (_a = selected == null ? void 0 : selected.label) != null ? _a : value }),
|
|
13996
|
+
disabled ? null : /* @__PURE__ */ jsx57(Icon, { icon: CgChevronDown2, iconColor: "currentColor", size: 24 })
|
|
14077
13997
|
]
|
|
14078
13998
|
}
|
|
14079
13999
|
),
|
|
14080
|
-
/* @__PURE__ */
|
|
14000
|
+
/* @__PURE__ */ jsx57(
|
|
14081
14001
|
"div",
|
|
14082
14002
|
{
|
|
14083
14003
|
id: `and-or-${props.id}`,
|
|
14084
14004
|
css: [inlineSelectMenu, menuVisible ? void 0 : inlineSelectMenuClosed],
|
|
14085
14005
|
"aria-hidden": !menuVisible,
|
|
14086
|
-
children: options.map((opt) => /* @__PURE__ */
|
|
14006
|
+
children: options.map((opt) => /* @__PURE__ */ jsx57(
|
|
14087
14007
|
"button",
|
|
14088
14008
|
{
|
|
14089
14009
|
type: "button",
|
|
@@ -14106,7 +14026,7 @@ var InputInlineSelect = ({
|
|
|
14106
14026
|
// src/components/Input/InputKeywordSearch.tsx
|
|
14107
14027
|
import { CgClose as CgClose4 } from "@react-icons/all-files/cg/CgClose";
|
|
14108
14028
|
import { CgSearch } from "@react-icons/all-files/cg/CgSearch";
|
|
14109
|
-
import { jsx as
|
|
14029
|
+
import { jsx as jsx58 } from "@emotion/react/jsx-runtime";
|
|
14110
14030
|
var InputKeywordSearch = ({
|
|
14111
14031
|
onSearchTextChanged,
|
|
14112
14032
|
disabled = false,
|
|
@@ -14127,7 +14047,7 @@ var InputKeywordSearch = ({
|
|
|
14127
14047
|
e.preventDefault();
|
|
14128
14048
|
}
|
|
14129
14049
|
};
|
|
14130
|
-
return /* @__PURE__ */
|
|
14050
|
+
return /* @__PURE__ */ jsx58(
|
|
14131
14051
|
Input,
|
|
14132
14052
|
{
|
|
14133
14053
|
type: "text",
|
|
@@ -14135,7 +14055,7 @@ var InputKeywordSearch = ({
|
|
|
14135
14055
|
placeholder,
|
|
14136
14056
|
showLabel: false,
|
|
14137
14057
|
value,
|
|
14138
|
-
icon: value ? /* @__PURE__ */
|
|
14058
|
+
icon: value ? /* @__PURE__ */ jsx58("button", { css: inputSearchCloseBtn, onClick: onClear, type: "button", children: /* @__PURE__ */ jsx58(Icon, { icon: CgClose4, iconColor: "red", size: "1rem" }) }) : /* @__PURE__ */ jsx58(Icon, { icon: CgSearch, iconColor: "gray", size: "1rem" }),
|
|
14139
14059
|
onChange: handleSearchTextChanged,
|
|
14140
14060
|
onKeyPress: preventSubmitOnField,
|
|
14141
14061
|
disabled,
|
|
@@ -14153,7 +14073,7 @@ var InputKeywordSearch = ({
|
|
|
14153
14073
|
};
|
|
14154
14074
|
|
|
14155
14075
|
// src/components/Input/InputSelect.tsx
|
|
14156
|
-
import { Fragment as Fragment8, jsx as
|
|
14076
|
+
import { Fragment as Fragment8, jsx as jsx59, jsxs as jsxs36 } from "@emotion/react/jsx-runtime";
|
|
14157
14077
|
var InputSelect = ({
|
|
14158
14078
|
label,
|
|
14159
14079
|
defaultOption,
|
|
@@ -14169,13 +14089,13 @@ var InputSelect = ({
|
|
|
14169
14089
|
classNameLabel,
|
|
14170
14090
|
...props
|
|
14171
14091
|
}) => {
|
|
14172
|
-
return /* @__PURE__ */
|
|
14092
|
+
return /* @__PURE__ */ jsxs36(
|
|
14173
14093
|
"div",
|
|
14174
14094
|
{
|
|
14175
14095
|
css: [inputContainer, typeof classNameContainer === "object" ? classNameContainer : void 0],
|
|
14176
14096
|
className: typeof classNameContainer === "string" ? classNameContainer : "",
|
|
14177
14097
|
children: [
|
|
14178
|
-
showLabel ? /* @__PURE__ */
|
|
14098
|
+
showLabel ? /* @__PURE__ */ jsx59(Fragment8, { children: /* @__PURE__ */ jsxs36(
|
|
14179
14099
|
Label,
|
|
14180
14100
|
{
|
|
14181
14101
|
htmlFor: props.id,
|
|
@@ -14187,7 +14107,7 @@ var InputSelect = ({
|
|
|
14187
14107
|
]
|
|
14188
14108
|
}
|
|
14189
14109
|
) }) : null,
|
|
14190
|
-
/* @__PURE__ */
|
|
14110
|
+
/* @__PURE__ */ jsxs36(
|
|
14191
14111
|
"select",
|
|
14192
14112
|
{
|
|
14193
14113
|
title: label,
|
|
@@ -14202,14 +14122,14 @@ var InputSelect = ({
|
|
|
14202
14122
|
className: typeof classNameControl === "string" ? classNameControl : "",
|
|
14203
14123
|
...props,
|
|
14204
14124
|
children: [
|
|
14205
|
-
defaultOption ? /* @__PURE__ */
|
|
14206
|
-
options.map((opt, index) => /* @__PURE__ */
|
|
14125
|
+
defaultOption ? /* @__PURE__ */ jsx59("option", { value: "", children: defaultOption }) : null,
|
|
14126
|
+
options.map((opt, index) => /* @__PURE__ */ jsx59("option", { value: opt.label, ...opt }, index))
|
|
14207
14127
|
]
|
|
14208
14128
|
}
|
|
14209
14129
|
),
|
|
14210
|
-
caption ? /* @__PURE__ */
|
|
14211
|
-
errorMessage ? /* @__PURE__ */
|
|
14212
|
-
warningMessage && !errorMessage ? /* @__PURE__ */
|
|
14130
|
+
caption ? /* @__PURE__ */ jsx59(Caption, { children: caption }) : null,
|
|
14131
|
+
errorMessage ? /* @__PURE__ */ jsx59(ErrorMessage, { message: errorMessage }) : null,
|
|
14132
|
+
warningMessage && !errorMessage ? /* @__PURE__ */ jsx59(WarningMessage, { message: warningMessage }) : null
|
|
14213
14133
|
]
|
|
14214
14134
|
}
|
|
14215
14135
|
);
|
|
@@ -14217,7 +14137,7 @@ var InputSelect = ({
|
|
|
14217
14137
|
|
|
14218
14138
|
// src/components/Input/InputToggle.tsx
|
|
14219
14139
|
import * as React17 from "react";
|
|
14220
|
-
import { jsx as
|
|
14140
|
+
import { jsx as jsx60, jsxs as jsxs37 } from "@emotion/react/jsx-runtime";
|
|
14221
14141
|
var InputToggle = React17.forwardRef(
|
|
14222
14142
|
({
|
|
14223
14143
|
label,
|
|
@@ -14232,13 +14152,13 @@ var InputToggle = React17.forwardRef(
|
|
|
14232
14152
|
fontWeight = "medium",
|
|
14233
14153
|
...props
|
|
14234
14154
|
}, ref) => {
|
|
14235
|
-
return /* @__PURE__ */
|
|
14155
|
+
return /* @__PURE__ */ jsxs37(
|
|
14236
14156
|
Label,
|
|
14237
14157
|
{
|
|
14238
14158
|
css: [inputToggleLabel, disabled ? inputDisabled : void 0],
|
|
14239
14159
|
"data-testid": testId ? testId : "input-toggle",
|
|
14240
14160
|
children: [
|
|
14241
|
-
/* @__PURE__ */
|
|
14161
|
+
/* @__PURE__ */ jsx60(
|
|
14242
14162
|
"input",
|
|
14243
14163
|
{
|
|
14244
14164
|
ref,
|
|
@@ -14250,11 +14170,11 @@ var InputToggle = React17.forwardRef(
|
|
|
14250
14170
|
...props
|
|
14251
14171
|
}
|
|
14252
14172
|
),
|
|
14253
|
-
/* @__PURE__ */
|
|
14254
|
-
caption || errorMessage ? /* @__PURE__ */
|
|
14255
|
-
caption ? /* @__PURE__ */
|
|
14256
|
-
errorMessage ? /* @__PURE__ */
|
|
14257
|
-
warningMessage && !errorMessage ? /* @__PURE__ */
|
|
14173
|
+
/* @__PURE__ */ jsx60("span", { css: inlineLabel(fontWeight), children: label }),
|
|
14174
|
+
caption || errorMessage ? /* @__PURE__ */ jsxs37("span", { css: inputToggleMessageContainer, children: [
|
|
14175
|
+
caption ? /* @__PURE__ */ jsx60(Caption, { children: caption }) : null,
|
|
14176
|
+
errorMessage ? /* @__PURE__ */ jsx60(ErrorMessage, { message: errorMessage }) : null,
|
|
14177
|
+
warningMessage && !errorMessage ? /* @__PURE__ */ jsx60(WarningMessage, { message: warningMessage }) : null
|
|
14258
14178
|
] }) : null
|
|
14259
14179
|
]
|
|
14260
14180
|
}
|
|
@@ -14263,9 +14183,9 @@ var InputToggle = React17.forwardRef(
|
|
|
14263
14183
|
);
|
|
14264
14184
|
|
|
14265
14185
|
// src/components/Input/Legend.tsx
|
|
14266
|
-
import { jsx as
|
|
14186
|
+
import { jsx as jsx61 } from "@emotion/react/jsx-runtime";
|
|
14267
14187
|
var Legend = ({ children }) => {
|
|
14268
|
-
return /* @__PURE__ */
|
|
14188
|
+
return /* @__PURE__ */ jsx61("legend", { css: fieldsetLegend, children });
|
|
14269
14189
|
};
|
|
14270
14190
|
|
|
14271
14191
|
// src/components/Input/SuccessMessage.tsx
|
|
@@ -14287,23 +14207,23 @@ var SuccessIcon2 = css53`
|
|
|
14287
14207
|
`;
|
|
14288
14208
|
|
|
14289
14209
|
// src/components/Input/SuccessMessage.tsx
|
|
14290
|
-
import { jsx as
|
|
14210
|
+
import { jsx as jsx62, jsxs as jsxs38 } from "@emotion/react/jsx-runtime";
|
|
14291
14211
|
var SuccessMessage = ({ message, testId, ...props }) => {
|
|
14292
|
-
return message ? /* @__PURE__ */
|
|
14293
|
-
/* @__PURE__ */
|
|
14212
|
+
return message ? /* @__PURE__ */ jsxs38("span", { role: "status", css: SuccessText, "data-testid": testId, ...props, children: [
|
|
14213
|
+
/* @__PURE__ */ jsx62("span", { children: /* @__PURE__ */ jsx62(Icon, { css: SuccessIcon2, icon: CgCheckO, size: "1rem", iconColor: "currentColor" }) }),
|
|
14294
14214
|
message
|
|
14295
14215
|
] }) : null;
|
|
14296
14216
|
};
|
|
14297
14217
|
|
|
14298
14218
|
// src/components/Input/Textarea.tsx
|
|
14299
14219
|
import { forwardRef as forwardRef9 } from "react";
|
|
14300
|
-
import { Fragment as Fragment9, jsx as
|
|
14220
|
+
import { Fragment as Fragment9, jsx as jsx63, jsxs as jsxs39 } from "@emotion/react/jsx-runtime";
|
|
14301
14221
|
var Textarea = forwardRef9(
|
|
14302
14222
|
({ label, icon, id, caption, showLabel = true, errorMessage, warningMessage, ...props }, ref) => {
|
|
14303
|
-
return /* @__PURE__ */
|
|
14304
|
-
showLabel ? /* @__PURE__ */
|
|
14305
|
-
/* @__PURE__ */
|
|
14306
|
-
/* @__PURE__ */
|
|
14223
|
+
return /* @__PURE__ */ jsxs39(Fragment9, { children: [
|
|
14224
|
+
showLabel ? /* @__PURE__ */ jsx63("label", { htmlFor: id, css: [labelText], children: label }) : null,
|
|
14225
|
+
/* @__PURE__ */ jsxs39("div", { css: [inputContainer], children: [
|
|
14226
|
+
/* @__PURE__ */ jsx63(
|
|
14307
14227
|
"textarea",
|
|
14308
14228
|
{
|
|
14309
14229
|
ref,
|
|
@@ -14318,23 +14238,196 @@ var Textarea = forwardRef9(
|
|
|
14318
14238
|
...props
|
|
14319
14239
|
}
|
|
14320
14240
|
),
|
|
14321
|
-
icon ? /* @__PURE__ */
|
|
14241
|
+
icon ? /* @__PURE__ */ jsx63("div", { css: inputIcon, children: icon }) : null
|
|
14322
14242
|
] }),
|
|
14323
|
-
caption ? /* @__PURE__ */
|
|
14324
|
-
errorMessage ? /* @__PURE__ */
|
|
14325
|
-
warningMessage && !errorMessage ? /* @__PURE__ */
|
|
14243
|
+
caption ? /* @__PURE__ */ jsx63(Caption, { children: caption }) : null,
|
|
14244
|
+
errorMessage ? /* @__PURE__ */ jsx63(ErrorMessage, { message: errorMessage }) : null,
|
|
14245
|
+
warningMessage && !errorMessage ? /* @__PURE__ */ jsx63(WarningMessage, { message: warningMessage }) : null
|
|
14326
14246
|
] });
|
|
14327
14247
|
}
|
|
14328
14248
|
);
|
|
14329
14249
|
|
|
14250
|
+
// src/components/Image/Image.styles.ts
|
|
14251
|
+
import { css as css54 } from "@emotion/react";
|
|
14252
|
+
var imageWrapper = css54`
|
|
14253
|
+
position: relative;
|
|
14254
|
+
display: inline-flex;
|
|
14255
|
+
flex-direction: column;
|
|
14256
|
+
background: var(--gray-50);
|
|
14257
|
+
max-width: 100%;
|
|
14258
|
+
max-height: 100%;
|
|
14259
|
+
`;
|
|
14260
|
+
var imageWrapperLoading = css54`
|
|
14261
|
+
animation: ${skeletonLoading} var(--duration-slow) linear infinite alternate;
|
|
14262
|
+
`;
|
|
14263
|
+
var img = css54`
|
|
14264
|
+
object-fit: contain;
|
|
14265
|
+
max-width: 100%;
|
|
14266
|
+
max-height: 100%;
|
|
14267
|
+
height: auto;
|
|
14268
|
+
opacity: var(--opacity-0);
|
|
14269
|
+
margin: 0 auto;
|
|
14270
|
+
`;
|
|
14271
|
+
var imgLoading = css54`
|
|
14272
|
+
opacity: 0;
|
|
14273
|
+
`;
|
|
14274
|
+
var imgLoaded = css54`
|
|
14275
|
+
animation: ${fadeIn} var(--duration-slow) var(--timing-ease-out) forwards;
|
|
14276
|
+
opacity: 1;
|
|
14277
|
+
`;
|
|
14278
|
+
var brokenImage = css54`
|
|
14279
|
+
height: 160px;
|
|
14280
|
+
`;
|
|
14281
|
+
var variantFillImageWrapper = css54`
|
|
14282
|
+
display: flex;
|
|
14283
|
+
justify-content: center;
|
|
14284
|
+
height: 100%;
|
|
14285
|
+
width: 100%;
|
|
14286
|
+
`;
|
|
14287
|
+
var variantFillImageImg = css54`
|
|
14288
|
+
height: inherit;
|
|
14289
|
+
`;
|
|
14290
|
+
|
|
14291
|
+
// src/components/Image/ImageBroken.tsx
|
|
14292
|
+
import { jsx as jsx64, jsxs as jsxs40 } from "@emotion/react/jsx-runtime";
|
|
14293
|
+
var ImageBroken = ({ width, height, ...props }) => {
|
|
14294
|
+
return /* @__PURE__ */ jsxs40(
|
|
14295
|
+
"svg",
|
|
14296
|
+
{
|
|
14297
|
+
role: "img",
|
|
14298
|
+
width: width != null ? width : "214",
|
|
14299
|
+
height: height != null ? height : "214",
|
|
14300
|
+
viewBox: "0 0 214 214",
|
|
14301
|
+
fill: "none",
|
|
14302
|
+
xmlns: "http://www.w3.org/2000/svg",
|
|
14303
|
+
xmlnsXlink: "http://www.w3.org/1999/xlink",
|
|
14304
|
+
"data-testid": "broken-image",
|
|
14305
|
+
...props,
|
|
14306
|
+
children: [
|
|
14307
|
+
/* @__PURE__ */ jsx64("rect", { width: "214", height: "214", fill: "#F9FAFB" }),
|
|
14308
|
+
/* @__PURE__ */ jsx64("rect", { width: "214", height: "214", fill: "url(#pattern0)" }),
|
|
14309
|
+
/* @__PURE__ */ jsxs40("defs", { children: [
|
|
14310
|
+
/* @__PURE__ */ jsx64("pattern", { id: "pattern0", patternContentUnits: "objectBoundingBox", width: "1", height: "1", children: /* @__PURE__ */ jsx64("use", { xlinkHref: "#image0_761_4353", transform: "scale(0.0025)" }) }),
|
|
14311
|
+
/* @__PURE__ */ jsx64(
|
|
14312
|
+
"image",
|
|
14313
|
+
{
|
|
14314
|
+
id: "image0_761_4353",
|
|
14315
|
+
width: "400",
|
|
14316
|
+
height: "400",
|
|
14317
|
+
xlinkHref: "data:image/png;base64,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UfKBgDEBDMtYXFKDgBsBDMtNUfKBgDEBDMtYXFKDgBsBDMtNUfKBgDEBDMtYXFKDgBsBDMtNUfKBgDEBDMtYXFKDgBsBDMtNUfKBgDEBDMtYXFKDgBsBDMtNUfKBgDEBDMtYXFKDgBsBDMtNUfKBgDEBDMtYXFKDgBsBDMtNUfKBgDEBDMtYXFKDgBsBDMtNUfKBgDEBDMtYXFKDgBsBDMtNUfKBgDEBDMtYXFKDgBsBDMtNUfKBgDEBDMtYXFKDgBsBDMtNUfKBgDEBDMtYXFKDgBsBDMtNUfKBgDEBDMtYXFKDgBsBDMtNUfKBgDEBDMtYXFKDgBsBDMtNUfKBgDEBDMtYXFKDgBsBDMtNUfKBgDEBDMtYXFKDgBsBDMtNUfKBgDEBDMtYXFKDgBsBDMtNUfKBgDEBDMtYXFKDgBsBDMtNUfKBgDEBDMtYXFKDgBsBDMtNUfKBgDEBDMtYXFKDgBsBDMtNUfKBgDEBDMtYXFKDgBsBDMtNUfKBgDEBDMtYXFKDgBsBDMtNUfKBgDEBDMtYXFKDgBsBDMtNUfKBgDEBDMtYXFKDgBsBDMtNUfKBgDEBDMtYXFKDgBsBDMtNUfKBgDEBDMtYXFKDgBsBDMtNUfKBgDEBDMtYXFKDgBsBDMtNUfKBgDEBDMtYXFKDgBsBDMtNUfKBgDEBDMtYXFKDgBsBDMtNUfKBgDEBDMtYXFKDgBsBDMtNUfKBgDEBDMtYXFKDgBsBDMtNUfKBgDEBDMtYXFKDgBsBDMtNUfKBgDEBDMtYXFKDgBsBDMtNUfKBgDEBDMtYXFKDgBsBDMtNUfKBgDEBDMtYXFKDgBsBDMtNUfKBgDEBDMtYXFKDgBsBDMtNUfKBgDEBDMtYXFKDgBsBDMtNUfKBgDEBDMtYXFKDgBsBDMtNUfKBgDEBDMtYXFKDgBsBDMtNUfKBgDEBDMtYXFKDgBsBDMtNUfKBgDEBDMtYXFKDgBsBDMtNUfKBgDEBDMtYXFKDgBsBDMtNUfKBgDEBDMtYXFKDgBsBDMtNUfKBgDEBDMtYXFKDgBsBDMtNUfKBgDEBDMtYXFKDgBsBDMtNUfKBgDEBDMtYXFKDgBsBDMtNUfKBgDEBDMtYXFKDgBsBDMtNUfKBgDEBDMtYXFKDgBsBDMtNUfKBgDEBDMtYXFKDgBsBDMtNUfKBgDEBDMtYXFKDgBsBDMtNUfKBgDEBDMtYXFKDgBsBDMtNUfKBgDEBDMtYXFKDgBsBDMtNUfKBgDEBDMtYXFKDgBsBDMtNUfKBgDEBDMtYXFKDgBsBDMtNUfKBgDEBDMtYXFKDgBsBDMtNUfKBgDEBDMtYXFKDgBsBDMtNUfKBgDEBDMtYXFKDgBsBDMtNUfKBgDEBDMtYXFKDgBsBDMtNUfKBgDEBDMtYXFKDgBsBDMtNUfKBgDEBDMtYXFKDgBsBDMtNUfKBgDEBDMtYXFKDgBsBDMtNUfKBgDEBDMtYXFKDgBsBDMtNUfKBgDEBDMtYXFKDgBsBDMtNUfKBgDEBDMtYXFKDgBsBDMtNUfKBgDEBDMtYXFKDgBsBDMtNUfKBgDEBDMtYXFKDgBsBDMtNUfKBgDEBDMtYXFKDgBsBDMtNUfKBgDEBDMtYXFKDgBuB/we75KcVO2CRagAAAABJRU5ErkJggg=="
|
|
14318
|
+
}
|
|
14319
|
+
)
|
|
14320
|
+
] })
|
|
14321
|
+
]
|
|
14322
|
+
}
|
|
14323
|
+
);
|
|
14324
|
+
};
|
|
14325
|
+
|
|
14326
|
+
// src/components/Image/Image.tsx
|
|
14327
|
+
import { Fragment as Fragment10, jsx as jsx65, jsxs as jsxs41 } from "@emotion/react/jsx-runtime";
|
|
14328
|
+
var MIN_LOADING_MS = 500;
|
|
14329
|
+
function Image({
|
|
14330
|
+
alt,
|
|
14331
|
+
src,
|
|
14332
|
+
className,
|
|
14333
|
+
imgClassName,
|
|
14334
|
+
variant = "inline",
|
|
14335
|
+
width,
|
|
14336
|
+
height,
|
|
14337
|
+
...imgAttribs
|
|
14338
|
+
}) {
|
|
14339
|
+
const [loading, setLoading] = useState8(true);
|
|
14340
|
+
const [loadErrorText, setLoadErrorText] = useState8("");
|
|
14341
|
+
const errorText = "The text you provided is not a valid URL";
|
|
14342
|
+
const updateImageSrc = useCallback2(() => {
|
|
14343
|
+
let message = "";
|
|
14344
|
+
try {
|
|
14345
|
+
if (src === "") {
|
|
14346
|
+
setLoading(false);
|
|
14347
|
+
} else {
|
|
14348
|
+
const url = String(src).startsWith("//") ? `${location.protocol}${src}` : String(src);
|
|
14349
|
+
if (!isValidUrl(url, { allowRelative: true, isSecure: true })) {
|
|
14350
|
+
throw Error(errorText);
|
|
14351
|
+
}
|
|
14352
|
+
}
|
|
14353
|
+
message = "";
|
|
14354
|
+
} catch (e) {
|
|
14355
|
+
message = errorText;
|
|
14356
|
+
setLoading(false);
|
|
14357
|
+
}
|
|
14358
|
+
setLoadErrorText(message);
|
|
14359
|
+
}, [setLoadErrorText, src]);
|
|
14360
|
+
useEffect7(() => {
|
|
14361
|
+
updateImageSrc();
|
|
14362
|
+
}, [src]);
|
|
14363
|
+
const handleLoadEvent = () => {
|
|
14364
|
+
setLoadErrorText("");
|
|
14365
|
+
if (src) {
|
|
14366
|
+
setLoading(true);
|
|
14367
|
+
}
|
|
14368
|
+
const timer = setTimeout(() => {
|
|
14369
|
+
setLoading(false);
|
|
14370
|
+
}, MIN_LOADING_MS);
|
|
14371
|
+
return () => clearTimeout(timer);
|
|
14372
|
+
};
|
|
14373
|
+
const handleErrorEvent = () => {
|
|
14374
|
+
setLoadErrorText("The value you provided is not a valid image URL");
|
|
14375
|
+
setLoading(false);
|
|
14376
|
+
};
|
|
14377
|
+
return /* @__PURE__ */ jsxs41(
|
|
14378
|
+
"span",
|
|
14379
|
+
{
|
|
14380
|
+
className,
|
|
14381
|
+
css: [
|
|
14382
|
+
imageWrapper,
|
|
14383
|
+
loading ? imageWrapperLoading : null,
|
|
14384
|
+
variant === "fill-container" ? variantFillImageWrapper : null
|
|
14385
|
+
],
|
|
14386
|
+
children: [
|
|
14387
|
+
src && !loadErrorText ? /* @__PURE__ */ jsx65(
|
|
14388
|
+
"img",
|
|
14389
|
+
{
|
|
14390
|
+
...imgAttribs,
|
|
14391
|
+
className: imgClassName,
|
|
14392
|
+
alt,
|
|
14393
|
+
src,
|
|
14394
|
+
css: [
|
|
14395
|
+
img,
|
|
14396
|
+
variant === "fill-container" ? variantFillImageImg : null,
|
|
14397
|
+
loading ? imgLoading : imgLoaded
|
|
14398
|
+
],
|
|
14399
|
+
loading: "lazy",
|
|
14400
|
+
width,
|
|
14401
|
+
height,
|
|
14402
|
+
onLoad: handleLoadEvent,
|
|
14403
|
+
onError: handleErrorEvent
|
|
14404
|
+
}
|
|
14405
|
+
) : null,
|
|
14406
|
+
src && loadErrorText ? /* @__PURE__ */ jsxs41(Fragment10, { children: [
|
|
14407
|
+
/* @__PURE__ */ jsx65(
|
|
14408
|
+
ImageBroken,
|
|
14409
|
+
{
|
|
14410
|
+
css: [brokenImage, img, imgLoaded],
|
|
14411
|
+
width,
|
|
14412
|
+
height,
|
|
14413
|
+
"data-testid": "broken-image"
|
|
14414
|
+
}
|
|
14415
|
+
),
|
|
14416
|
+
/* @__PURE__ */ jsx65(ErrorMessage, { message: loadErrorText })
|
|
14417
|
+
] }) : null
|
|
14418
|
+
]
|
|
14419
|
+
}
|
|
14420
|
+
);
|
|
14421
|
+
}
|
|
14422
|
+
|
|
14330
14423
|
// src/components/Tiles/CreateTeamIntegrationTile.tsx
|
|
14331
|
-
import { css as
|
|
14424
|
+
import { css as css56 } from "@emotion/react";
|
|
14332
14425
|
import { CgAdd as CgAdd2 } from "@react-icons/all-files/cg/CgAdd";
|
|
14333
14426
|
import { CgChevronRight as CgChevronRight2 } from "@react-icons/all-files/cg/CgChevronRight";
|
|
14334
14427
|
|
|
14335
14428
|
// src/components/Tiles/styles/IntegrationTile.styles.ts
|
|
14336
|
-
import { css as
|
|
14337
|
-
var IntegrationTileContainer =
|
|
14429
|
+
import { css as css55 } from "@emotion/react";
|
|
14430
|
+
var IntegrationTileContainer = css55`
|
|
14338
14431
|
align-items: center;
|
|
14339
14432
|
box-sizing: border-box;
|
|
14340
14433
|
border-radius: var(--rounded-base);
|
|
@@ -14365,22 +14458,22 @@ var IntegrationTileContainer = css54`
|
|
|
14365
14458
|
}
|
|
14366
14459
|
}
|
|
14367
14460
|
`;
|
|
14368
|
-
var IntegrationTileBtnDashedBorder =
|
|
14461
|
+
var IntegrationTileBtnDashedBorder = css55`
|
|
14369
14462
|
border: 1px dashed var(--brand-secondary-1);
|
|
14370
14463
|
`;
|
|
14371
|
-
var IntegrationTileTitle =
|
|
14464
|
+
var IntegrationTileTitle = css55`
|
|
14372
14465
|
display: block;
|
|
14373
14466
|
font-weight: var(--fw-bold);
|
|
14374
14467
|
margin: 0 0 var(--spacing-base);
|
|
14375
14468
|
max-width: 13rem;
|
|
14376
14469
|
`;
|
|
14377
|
-
var IntegrationTitleLogo =
|
|
14470
|
+
var IntegrationTitleLogo = css55`
|
|
14378
14471
|
display: block;
|
|
14379
14472
|
max-width: 10rem;
|
|
14380
14473
|
max-height: 4rem;
|
|
14381
14474
|
margin: 0 auto;
|
|
14382
14475
|
`;
|
|
14383
|
-
var IntegrationTileName =
|
|
14476
|
+
var IntegrationTileName = css55`
|
|
14384
14477
|
color: var(--gray-500);
|
|
14385
14478
|
display: -webkit-box;
|
|
14386
14479
|
-webkit-line-clamp: 1;
|
|
@@ -14393,7 +14486,7 @@ var IntegrationTileName = css54`
|
|
|
14393
14486
|
position: absolute;
|
|
14394
14487
|
bottom: calc(var(--spacing-base) * 3.8);
|
|
14395
14488
|
`;
|
|
14396
|
-
var IntegrationAddedText =
|
|
14489
|
+
var IntegrationAddedText = css55`
|
|
14397
14490
|
align-items: center;
|
|
14398
14491
|
background: var(--brand-secondary-3);
|
|
14399
14492
|
border-radius: 0 var(--rounded-md) 0 var(--rounded-md);
|
|
@@ -14408,7 +14501,7 @@ var IntegrationAddedText = css54`
|
|
|
14408
14501
|
top: 0;
|
|
14409
14502
|
right: 0;
|
|
14410
14503
|
`;
|
|
14411
|
-
var IntegrationCustomBadgeText = (theme) =>
|
|
14504
|
+
var IntegrationCustomBadgeText = (theme) => css55`
|
|
14412
14505
|
align-items: center;
|
|
14413
14506
|
border-radius: var(--rounded-sm) 0 var(--rounded-sm) 0;
|
|
14414
14507
|
background: ${theme === "gray" ? "var(--brand-secondary-2)" : "var(--brand-secondary-1)"};
|
|
@@ -14422,26 +14515,26 @@ var IntegrationCustomBadgeText = (theme) => css54`
|
|
|
14422
14515
|
top: 0;
|
|
14423
14516
|
left: 0;
|
|
14424
14517
|
`;
|
|
14425
|
-
var IntegrationAuthorBadgeIcon =
|
|
14518
|
+
var IntegrationAuthorBadgeIcon = css55`
|
|
14426
14519
|
position: absolute;
|
|
14427
14520
|
bottom: var(--spacing-sm);
|
|
14428
14521
|
right: var(--spacing-xs);
|
|
14429
14522
|
max-height: 1rem;
|
|
14430
14523
|
`;
|
|
14431
|
-
var IntegrationTitleFakeButton =
|
|
14524
|
+
var IntegrationTitleFakeButton = css55`
|
|
14432
14525
|
font-size: var(--fs-xs);
|
|
14433
14526
|
gap: var(--spacing-sm);
|
|
14434
14527
|
padding: var(--spacing-sm) var(--spacing-base);
|
|
14435
14528
|
text-transform: uppercase;
|
|
14436
14529
|
`;
|
|
14437
|
-
var IntegrationTileFloatingButton =
|
|
14530
|
+
var IntegrationTileFloatingButton = css55`
|
|
14438
14531
|
position: absolute;
|
|
14439
14532
|
bottom: var(--spacing-base);
|
|
14440
14533
|
gap: var(--spacing-sm);
|
|
14441
14534
|
font-size: var(--fs-xs);
|
|
14442
14535
|
overflow: hidden;
|
|
14443
14536
|
`;
|
|
14444
|
-
var IntegrationTileFloatingButtonMessage = (clicked) =>
|
|
14537
|
+
var IntegrationTileFloatingButtonMessage = (clicked) => css55`
|
|
14445
14538
|
strong,
|
|
14446
14539
|
span:first-of-type {
|
|
14447
14540
|
transition: opacity var(--duration-fast) var(--timing-ease-out);
|
|
@@ -14462,7 +14555,7 @@ var IntegrationTileFloatingButtonMessage = (clicked) => css54`
|
|
|
14462
14555
|
`;
|
|
14463
14556
|
|
|
14464
14557
|
// src/components/Tiles/CreateTeamIntegrationTile.tsx
|
|
14465
|
-
import { jsx as
|
|
14558
|
+
import { jsx as jsx66, jsxs as jsxs42 } from "@emotion/react/jsx-runtime";
|
|
14466
14559
|
var CreateTeamIntegrationTile = ({
|
|
14467
14560
|
title = "Create a custom integration for your team",
|
|
14468
14561
|
buttonText = "Add Integration",
|
|
@@ -14470,9 +14563,9 @@ var CreateTeamIntegrationTile = ({
|
|
|
14470
14563
|
asDeepLink = false,
|
|
14471
14564
|
...props
|
|
14472
14565
|
}) => {
|
|
14473
|
-
return /* @__PURE__ */
|
|
14474
|
-
/* @__PURE__ */
|
|
14475
|
-
/* @__PURE__ */
|
|
14566
|
+
return /* @__PURE__ */ jsxs42("div", { css: [IntegrationTileContainer, IntegrationTileBtnDashedBorder], ...props, children: [
|
|
14567
|
+
/* @__PURE__ */ jsx66("span", { css: IntegrationTileTitle, title, children: title }),
|
|
14568
|
+
/* @__PURE__ */ jsxs42(
|
|
14476
14569
|
Button,
|
|
14477
14570
|
{
|
|
14478
14571
|
buttonType: "tertiary",
|
|
@@ -14482,23 +14575,23 @@ var CreateTeamIntegrationTile = ({
|
|
|
14482
14575
|
css: IntegrationTitleFakeButton,
|
|
14483
14576
|
children: [
|
|
14484
14577
|
buttonText,
|
|
14485
|
-
asDeepLink ? /* @__PURE__ */
|
|
14578
|
+
asDeepLink ? /* @__PURE__ */ jsx66(
|
|
14486
14579
|
Icon,
|
|
14487
14580
|
{
|
|
14488
14581
|
icon: CgChevronRight2,
|
|
14489
14582
|
iconColor: "currentColor",
|
|
14490
14583
|
size: 20,
|
|
14491
|
-
css:
|
|
14584
|
+
css: css56`
|
|
14492
14585
|
order: 1;
|
|
14493
14586
|
`
|
|
14494
14587
|
}
|
|
14495
|
-
) : /* @__PURE__ */
|
|
14588
|
+
) : /* @__PURE__ */ jsx66(
|
|
14496
14589
|
Icon,
|
|
14497
14590
|
{
|
|
14498
14591
|
icon: CgAdd2,
|
|
14499
14592
|
iconColor: "currentColor",
|
|
14500
14593
|
size: 16,
|
|
14501
|
-
css:
|
|
14594
|
+
css: css56`
|
|
14502
14595
|
order: -1;
|
|
14503
14596
|
`
|
|
14504
14597
|
}
|
|
@@ -14513,31 +14606,31 @@ var CreateTeamIntegrationTile = ({
|
|
|
14513
14606
|
import { CgCheck } from "@react-icons/all-files/cg/CgCheck";
|
|
14514
14607
|
import { CgLock } from "@react-icons/all-files/cg/CgLock";
|
|
14515
14608
|
import { CgSandClock } from "@react-icons/all-files/cg/CgSandClock";
|
|
14516
|
-
import { jsx as
|
|
14609
|
+
import { jsx as jsx67, jsxs as jsxs43 } from "@emotion/react/jsx-runtime";
|
|
14517
14610
|
var IntegrationedAddedBadge = ({ text = "Added" }) => {
|
|
14518
|
-
return /* @__PURE__ */
|
|
14519
|
-
/* @__PURE__ */
|
|
14611
|
+
return /* @__PURE__ */ jsxs43("span", { "data-testid": "integration-icon-installed", css: IntegrationAddedText, children: [
|
|
14612
|
+
/* @__PURE__ */ jsx67(Icon, { icon: CgCheck, iconColor: "currentColor" }),
|
|
14520
14613
|
text
|
|
14521
14614
|
] });
|
|
14522
14615
|
};
|
|
14523
14616
|
var IntegrationCustomBadge = ({ text = "Custom" }) => {
|
|
14524
|
-
return /* @__PURE__ */
|
|
14617
|
+
return /* @__PURE__ */ jsx67("span", { "data-testid": "integration-is-private", css: IntegrationCustomBadgeText("gray"), children: text });
|
|
14525
14618
|
};
|
|
14526
14619
|
var IntegrationPremiumBadge = ({ text = "Premium" }) => {
|
|
14527
|
-
return /* @__PURE__ */
|
|
14528
|
-
/* @__PURE__ */
|
|
14620
|
+
return /* @__PURE__ */ jsxs43("span", { css: IntegrationCustomBadgeText("blue"), children: [
|
|
14621
|
+
/* @__PURE__ */ jsx67(Icon, { icon: CgLock, iconColor: "currentColor", size: 12 }),
|
|
14529
14622
|
text
|
|
14530
14623
|
] });
|
|
14531
14624
|
};
|
|
14532
14625
|
var IntegrationComingSoonBadge = ({ text = "Coming soon" }) => {
|
|
14533
|
-
return /* @__PURE__ */
|
|
14534
|
-
/* @__PURE__ */
|
|
14626
|
+
return /* @__PURE__ */ jsxs43("span", { css: IntegrationCustomBadgeText("blue"), children: [
|
|
14627
|
+
/* @__PURE__ */ jsx67(Icon, { icon: CgSandClock, iconColor: "currentColor", size: 12 }),
|
|
14535
14628
|
text
|
|
14536
14629
|
] });
|
|
14537
14630
|
};
|
|
14538
14631
|
|
|
14539
14632
|
// src/components/Tiles/ResolveIcon.tsx
|
|
14540
|
-
import { jsx as
|
|
14633
|
+
import { jsx as jsx68 } from "@emotion/react/jsx-runtime";
|
|
14541
14634
|
var ResolveIcon = ({ icon, name, styleType = "logo", ...props }) => {
|
|
14542
14635
|
const CompIcon = icon && typeof icon !== "string" ? icon : null;
|
|
14543
14636
|
const mapClassName = {
|
|
@@ -14545,13 +14638,13 @@ var ResolveIcon = ({ icon, name, styleType = "logo", ...props }) => {
|
|
|
14545
14638
|
logo: IntegrationTitleLogo
|
|
14546
14639
|
};
|
|
14547
14640
|
if (icon) {
|
|
14548
|
-
return CompIcon ? /* @__PURE__ */
|
|
14641
|
+
return CompIcon ? /* @__PURE__ */ jsx68(CompIcon, { css: mapClassName[styleType], ...props }) : /* @__PURE__ */ jsx68("img", { src: icon, alt: name, css: mapClassName[styleType], ...props });
|
|
14549
14642
|
}
|
|
14550
14643
|
return null;
|
|
14551
14644
|
};
|
|
14552
14645
|
|
|
14553
14646
|
// src/components/Tiles/EditTeamIntegrationTile.tsx
|
|
14554
|
-
import { jsx as
|
|
14647
|
+
import { jsx as jsx69, jsxs as jsxs44 } from "@emotion/react/jsx-runtime";
|
|
14555
14648
|
var EditTeamIntegrationTile = ({
|
|
14556
14649
|
id,
|
|
14557
14650
|
icon,
|
|
@@ -14560,17 +14653,17 @@ var EditTeamIntegrationTile = ({
|
|
|
14560
14653
|
isPublic,
|
|
14561
14654
|
canEdit = false
|
|
14562
14655
|
}) => {
|
|
14563
|
-
return /* @__PURE__ */
|
|
14656
|
+
return /* @__PURE__ */ jsxs44(
|
|
14564
14657
|
"div",
|
|
14565
14658
|
{
|
|
14566
14659
|
css: IntegrationTileContainer,
|
|
14567
14660
|
"data-testid": "configure-integration-container",
|
|
14568
14661
|
"integration-id": `${id.toLocaleLowerCase()}`,
|
|
14569
14662
|
children: [
|
|
14570
|
-
/* @__PURE__ */
|
|
14571
|
-
/* @__PURE__ */
|
|
14572
|
-
!isPublic ? /* @__PURE__ */
|
|
14573
|
-
canEdit ? /* @__PURE__ */
|
|
14663
|
+
/* @__PURE__ */ jsx69(ResolveIcon, { icon, name, "data-testid": "integration-logo" }),
|
|
14664
|
+
/* @__PURE__ */ jsx69("span", { css: IntegrationTileName, "data-testid": "integration-card-name", children: name }),
|
|
14665
|
+
!isPublic ? /* @__PURE__ */ jsx69(IntegrationCustomBadge, {}) : null,
|
|
14666
|
+
canEdit ? /* @__PURE__ */ jsx69(
|
|
14574
14667
|
Button,
|
|
14575
14668
|
{
|
|
14576
14669
|
buttonType: "unimportant",
|
|
@@ -14588,10 +14681,10 @@ var EditTeamIntegrationTile = ({
|
|
|
14588
14681
|
};
|
|
14589
14682
|
|
|
14590
14683
|
// src/components/Tiles/IntegrationComingSoon.tsx
|
|
14591
|
-
import { css as
|
|
14684
|
+
import { css as css57 } from "@emotion/react";
|
|
14592
14685
|
import { CgHeart } from "@react-icons/all-files/cg/CgHeart";
|
|
14593
|
-
import { useEffect as
|
|
14594
|
-
import { jsx as
|
|
14686
|
+
import { useEffect as useEffect8, useState as useState9 } from "react";
|
|
14687
|
+
import { jsx as jsx70, jsxs as jsxs45 } from "@emotion/react/jsx-runtime";
|
|
14595
14688
|
var IntegrationComingSoon = ({
|
|
14596
14689
|
name,
|
|
14597
14690
|
icon,
|
|
@@ -14600,12 +14693,12 @@ var IntegrationComingSoon = ({
|
|
|
14600
14693
|
timing = 1e3,
|
|
14601
14694
|
...props
|
|
14602
14695
|
}) => {
|
|
14603
|
-
const [upVote, setUpVote] =
|
|
14696
|
+
const [upVote, setUpVote] = useState9(false);
|
|
14604
14697
|
const handleUpVoteInteraction = () => {
|
|
14605
14698
|
setUpVote((prev) => !prev);
|
|
14606
14699
|
onUpVoteClick();
|
|
14607
14700
|
};
|
|
14608
|
-
|
|
14701
|
+
useEffect8(() => {
|
|
14609
14702
|
if (upVote) {
|
|
14610
14703
|
const timer = setTimeout(() => setUpVote(false), timing);
|
|
14611
14704
|
return () => {
|
|
@@ -14613,17 +14706,17 @@ var IntegrationComingSoon = ({
|
|
|
14613
14706
|
};
|
|
14614
14707
|
}
|
|
14615
14708
|
}, [upVote, setUpVote, timing]);
|
|
14616
|
-
return /* @__PURE__ */
|
|
14709
|
+
return /* @__PURE__ */ jsxs45(
|
|
14617
14710
|
"div",
|
|
14618
14711
|
{
|
|
14619
14712
|
css: IntegrationTileContainer,
|
|
14620
14713
|
"data-testid": `coming-soon-${id.toLowerCase()}-integration`,
|
|
14621
14714
|
...props,
|
|
14622
14715
|
children: [
|
|
14623
|
-
/* @__PURE__ */
|
|
14624
|
-
/* @__PURE__ */
|
|
14625
|
-
/* @__PURE__ */
|
|
14626
|
-
/* @__PURE__ */
|
|
14716
|
+
/* @__PURE__ */ jsx70(IntegrationComingSoonBadge, {}),
|
|
14717
|
+
/* @__PURE__ */ jsx70(ResolveIcon, { icon, name }),
|
|
14718
|
+
/* @__PURE__ */ jsx70("span", { css: IntegrationTileName, title: name, children: name }),
|
|
14719
|
+
/* @__PURE__ */ jsxs45(
|
|
14627
14720
|
Button,
|
|
14628
14721
|
{
|
|
14629
14722
|
buttonType: "unimportant",
|
|
@@ -14633,19 +14726,19 @@ var IntegrationComingSoon = ({
|
|
|
14633
14726
|
role: "link",
|
|
14634
14727
|
css: [IntegrationTileFloatingButton, IntegrationTileFloatingButtonMessage(upVote)],
|
|
14635
14728
|
children: [
|
|
14636
|
-
/* @__PURE__ */
|
|
14637
|
-
/* @__PURE__ */
|
|
14729
|
+
/* @__PURE__ */ jsx70("strong", { children: "+1" }),
|
|
14730
|
+
/* @__PURE__ */ jsx70(
|
|
14638
14731
|
"span",
|
|
14639
14732
|
{
|
|
14640
|
-
css:
|
|
14733
|
+
css: css57`
|
|
14641
14734
|
text-transform: uppercase;
|
|
14642
14735
|
color: var(--gray-500);
|
|
14643
14736
|
`,
|
|
14644
14737
|
children: "(I want this)"
|
|
14645
14738
|
}
|
|
14646
14739
|
),
|
|
14647
|
-
/* @__PURE__ */
|
|
14648
|
-
/* @__PURE__ */
|
|
14740
|
+
/* @__PURE__ */ jsxs45("span", { "aria-hidden": !upVote, children: [
|
|
14741
|
+
/* @__PURE__ */ jsx70(Icon, { icon: CgHeart, iconColor: "currentColor", size: 18 }),
|
|
14649
14742
|
"Thanks!"
|
|
14650
14743
|
] })
|
|
14651
14744
|
]
|
|
@@ -14657,8 +14750,8 @@ var IntegrationComingSoon = ({
|
|
|
14657
14750
|
};
|
|
14658
14751
|
|
|
14659
14752
|
// src/components/Tiles/styles/IntegrationLoadingTile.styles.ts
|
|
14660
|
-
import { css as
|
|
14661
|
-
var IntegrationLoadingTileContainer =
|
|
14753
|
+
import { css as css58 } from "@emotion/react";
|
|
14754
|
+
var IntegrationLoadingTileContainer = css58`
|
|
14662
14755
|
align-items: center;
|
|
14663
14756
|
box-sizing: border-box;
|
|
14664
14757
|
border-radius: var(--rounded-base);
|
|
@@ -14685,39 +14778,39 @@ var IntegrationLoadingTileContainer = css57`
|
|
|
14685
14778
|
}
|
|
14686
14779
|
}
|
|
14687
14780
|
`;
|
|
14688
|
-
var IntegrationLoadingTileImg =
|
|
14781
|
+
var IntegrationLoadingTileImg = css58`
|
|
14689
14782
|
width: 10rem;
|
|
14690
14783
|
height: 4rem;
|
|
14691
14784
|
margin: 0 auto;
|
|
14692
14785
|
`;
|
|
14693
|
-
var IntegrationLoadingTileText =
|
|
14786
|
+
var IntegrationLoadingTileText = css58`
|
|
14694
14787
|
width: 5rem;
|
|
14695
14788
|
height: var(--spacing-sm);
|
|
14696
14789
|
margin: var(--spacing-sm) 0;
|
|
14697
14790
|
`;
|
|
14698
|
-
var IntegrationLoadingFrame =
|
|
14791
|
+
var IntegrationLoadingFrame = css58`
|
|
14699
14792
|
animation: ${skeletonLoading} 1s linear infinite alternate;
|
|
14700
14793
|
border-radius: var(--rounded-base);
|
|
14701
14794
|
`;
|
|
14702
14795
|
|
|
14703
14796
|
// src/components/Tiles/IntegrationLoadingTile.tsx
|
|
14704
|
-
import { Fragment as
|
|
14797
|
+
import { Fragment as Fragment11, jsx as jsx71, jsxs as jsxs46 } from "@emotion/react/jsx-runtime";
|
|
14705
14798
|
var IntegrationLoadingTile = ({ count = 1 }) => {
|
|
14706
14799
|
const componentCount = Array.from(Array(count).keys());
|
|
14707
|
-
return /* @__PURE__ */
|
|
14708
|
-
/* @__PURE__ */
|
|
14709
|
-
/* @__PURE__ */
|
|
14800
|
+
return /* @__PURE__ */ jsx71(Fragment11, { children: componentCount.map((i) => /* @__PURE__ */ jsxs46("div", { css: IntegrationLoadingTileContainer, children: [
|
|
14801
|
+
/* @__PURE__ */ jsx71("div", { css: [IntegrationLoadingTileImg, IntegrationLoadingFrame], role: "presentation" }),
|
|
14802
|
+
/* @__PURE__ */ jsx71("div", { css: [IntegrationLoadingTileText, IntegrationLoadingFrame] })
|
|
14710
14803
|
] }, i)) });
|
|
14711
14804
|
};
|
|
14712
14805
|
|
|
14713
14806
|
// src/components/Tiles/styles/IntegrationModalIcon.styles.ts
|
|
14714
|
-
import { css as
|
|
14715
|
-
var IntegrationModalIconContainer =
|
|
14807
|
+
import { css as css59 } from "@emotion/react";
|
|
14808
|
+
var IntegrationModalIconContainer = css59`
|
|
14716
14809
|
position: relative;
|
|
14717
14810
|
width: 50px;
|
|
14718
14811
|
margin-bottom: var(--spacing-base);
|
|
14719
14812
|
`;
|
|
14720
|
-
var IntegrationModalImage =
|
|
14813
|
+
var IntegrationModalImage = css59`
|
|
14721
14814
|
position: absolute;
|
|
14722
14815
|
inset: 0;
|
|
14723
14816
|
margin: auto;
|
|
@@ -14726,7 +14819,7 @@ var IntegrationModalImage = css58`
|
|
|
14726
14819
|
`;
|
|
14727
14820
|
|
|
14728
14821
|
// src/components/Tiles/IntegrationModalIcon.tsx
|
|
14729
|
-
import { jsx as
|
|
14822
|
+
import { jsx as jsx72, jsxs as jsxs47 } from "@emotion/react/jsx-runtime";
|
|
14730
14823
|
var IntegrationModalIcon = ({ icon, name, ...imgProps }) => {
|
|
14731
14824
|
const CompIcon = icon && typeof icon !== "string" ? icon : null;
|
|
14732
14825
|
let iconSrc = void 0;
|
|
@@ -14742,9 +14835,9 @@ var IntegrationModalIcon = ({ icon, name, ...imgProps }) => {
|
|
|
14742
14835
|
}
|
|
14743
14836
|
}
|
|
14744
14837
|
}
|
|
14745
|
-
return /* @__PURE__ */
|
|
14746
|
-
/* @__PURE__ */
|
|
14747
|
-
/* @__PURE__ */
|
|
14838
|
+
return /* @__PURE__ */ jsxs47("div", { css: IntegrationModalIconContainer, children: [
|
|
14839
|
+
/* @__PURE__ */ jsxs47("svg", { width: "49", height: "57", fill: "none", xmlns: "http://www.w3.org/2000/svg", role: "img", children: [
|
|
14840
|
+
/* @__PURE__ */ jsx72(
|
|
14748
14841
|
"path",
|
|
14749
14842
|
{
|
|
14750
14843
|
d: "m24.367 1.813 22.786 13.322V41.78L24.367 55.102 1.581 41.78V15.135L24.367 1.814Z",
|
|
@@ -14753,12 +14846,12 @@ var IntegrationModalIcon = ({ icon, name, ...imgProps }) => {
|
|
|
14753
14846
|
strokeWidth: "2"
|
|
14754
14847
|
}
|
|
14755
14848
|
),
|
|
14756
|
-
/* @__PURE__ */
|
|
14757
|
-
/* @__PURE__ */
|
|
14758
|
-
/* @__PURE__ */
|
|
14849
|
+
/* @__PURE__ */ jsx72("defs", { children: /* @__PURE__ */ jsxs47("linearGradient", { id: "a", x1: "41.353", y1: "49.107", x2: "8.048", y2: "4.478", gradientUnits: "userSpaceOnUse", children: [
|
|
14850
|
+
/* @__PURE__ */ jsx72("stop", { stopColor: "#1768B2" }),
|
|
14851
|
+
/* @__PURE__ */ jsx72("stop", { offset: "1", stopColor: "#B3EFE4" })
|
|
14759
14852
|
] }) })
|
|
14760
14853
|
] }),
|
|
14761
|
-
CompIcon ? /* @__PURE__ */
|
|
14854
|
+
CompIcon ? /* @__PURE__ */ jsx72(CompIcon, { role: "img", css: IntegrationModalImage, ...imgProps }) : iconSrc ? /* @__PURE__ */ jsx72(
|
|
14762
14855
|
"img",
|
|
14763
14856
|
{
|
|
14764
14857
|
src: iconSrc,
|
|
@@ -14772,7 +14865,7 @@ var IntegrationModalIcon = ({ icon, name, ...imgProps }) => {
|
|
|
14772
14865
|
};
|
|
14773
14866
|
|
|
14774
14867
|
// src/components/Tiles/IntegrationTile.tsx
|
|
14775
|
-
import { jsx as
|
|
14868
|
+
import { jsx as jsx73, jsxs as jsxs48 } from "@emotion/react/jsx-runtime";
|
|
14776
14869
|
var IntegrationTile = ({
|
|
14777
14870
|
id,
|
|
14778
14871
|
icon,
|
|
@@ -14784,7 +14877,7 @@ var IntegrationTile = ({
|
|
|
14784
14877
|
authorIcon,
|
|
14785
14878
|
...btnProps
|
|
14786
14879
|
}) => {
|
|
14787
|
-
return /* @__PURE__ */
|
|
14880
|
+
return /* @__PURE__ */ jsxs48(
|
|
14788
14881
|
"button",
|
|
14789
14882
|
{
|
|
14790
14883
|
type: "button",
|
|
@@ -14794,21 +14887,21 @@ var IntegrationTile = ({
|
|
|
14794
14887
|
"aria-label": name,
|
|
14795
14888
|
...btnProps,
|
|
14796
14889
|
children: [
|
|
14797
|
-
/* @__PURE__ */
|
|
14798
|
-
/* @__PURE__ */
|
|
14799
|
-
isInstalled ? /* @__PURE__ */
|
|
14800
|
-
requiedEntitlement && isPublic ? /* @__PURE__ */
|
|
14801
|
-
!isPublic ? /* @__PURE__ */
|
|
14802
|
-
authorIcon ? /* @__PURE__ */
|
|
14890
|
+
/* @__PURE__ */ jsx73(ResolveIcon, { icon, name }),
|
|
14891
|
+
/* @__PURE__ */ jsx73("span", { css: IntegrationTileName, title: name, children: name }),
|
|
14892
|
+
isInstalled ? /* @__PURE__ */ jsx73(IntegrationedAddedBadge, {}) : null,
|
|
14893
|
+
requiedEntitlement && isPublic ? /* @__PURE__ */ jsx73(IntegrationPremiumBadge, {}) : null,
|
|
14894
|
+
!isPublic ? /* @__PURE__ */ jsx73(IntegrationCustomBadge, {}) : null,
|
|
14895
|
+
authorIcon ? /* @__PURE__ */ jsx73(ResolveIcon, { icon: authorIcon, name }) : null
|
|
14803
14896
|
]
|
|
14804
14897
|
}
|
|
14805
14898
|
);
|
|
14806
14899
|
};
|
|
14807
14900
|
|
|
14808
14901
|
// src/components/Tiles/styles/Tile.styles.ts
|
|
14809
|
-
import { css as
|
|
14902
|
+
import { css as css60 } from "@emotion/react";
|
|
14810
14903
|
var tileBorderSize = "1px";
|
|
14811
|
-
var Tile =
|
|
14904
|
+
var Tile = css60`
|
|
14812
14905
|
background: var(--white);
|
|
14813
14906
|
cursor: pointer;
|
|
14814
14907
|
border: ${tileBorderSize} solid var(--gray-300);
|
|
@@ -14832,18 +14925,18 @@ var Tile = css59`
|
|
|
14832
14925
|
`;
|
|
14833
14926
|
|
|
14834
14927
|
// src/components/Tiles/Tile.tsx
|
|
14835
|
-
import { jsx as
|
|
14928
|
+
import { jsx as jsx74 } from "@emotion/react/jsx-runtime";
|
|
14836
14929
|
var Tile2 = ({ children, disabled, ...props }) => {
|
|
14837
|
-
return /* @__PURE__ */
|
|
14930
|
+
return /* @__PURE__ */ jsx74("button", { type: "button", css: Tile, disabled, ...props, children });
|
|
14838
14931
|
};
|
|
14839
14932
|
|
|
14840
14933
|
// src/components/Tiles/styles/TileContainer.styles.ts
|
|
14841
|
-
import { css as
|
|
14842
|
-
var TileContainerWrapper = (theme, padding) =>
|
|
14934
|
+
import { css as css61 } from "@emotion/react";
|
|
14935
|
+
var TileContainerWrapper = (theme, padding) => css61`
|
|
14843
14936
|
background: ${theme};
|
|
14844
14937
|
padding: ${padding != "none" ? `var(--spacing-${padding})` : "0"};
|
|
14845
14938
|
`;
|
|
14846
|
-
var TileContainerInner = (gap, templateColumns) =>
|
|
14939
|
+
var TileContainerInner = (gap, templateColumns) => css61`
|
|
14847
14940
|
display: grid;
|
|
14848
14941
|
grid-template-columns: ${templateColumns};
|
|
14849
14942
|
gap: var(--spacing-${gap});
|
|
@@ -14857,7 +14950,7 @@ var TileContainerInner = (gap, templateColumns) => css60`
|
|
|
14857
14950
|
`;
|
|
14858
14951
|
|
|
14859
14952
|
// src/components/Tiles/TileContainer.tsx
|
|
14860
|
-
import { jsx as
|
|
14953
|
+
import { jsx as jsx75 } from "@emotion/react/jsx-runtime";
|
|
14861
14954
|
var TileContainer = ({
|
|
14862
14955
|
bgColor = "var(--brand-secondary-2)",
|
|
14863
14956
|
containerPadding = "base",
|
|
@@ -14866,25 +14959,25 @@ var TileContainer = ({
|
|
|
14866
14959
|
children,
|
|
14867
14960
|
...props
|
|
14868
14961
|
}) => {
|
|
14869
|
-
return /* @__PURE__ */
|
|
14962
|
+
return /* @__PURE__ */ jsx75("div", { css: TileContainerWrapper(bgColor, containerPadding), ...props, children: /* @__PURE__ */ jsx75("div", { css: TileContainerInner(gap, gridTemplateColumns), children }) });
|
|
14870
14963
|
};
|
|
14871
14964
|
|
|
14872
14965
|
// src/components/Tiles/styles/TileText.styles.ts
|
|
14873
|
-
import { css as
|
|
14874
|
-
var TileHeading =
|
|
14966
|
+
import { css as css62 } from "@emotion/react";
|
|
14967
|
+
var TileHeading = css62`
|
|
14875
14968
|
font-size: var(--fs-base);
|
|
14876
14969
|
`;
|
|
14877
|
-
var TileText =
|
|
14970
|
+
var TileText = css62`
|
|
14878
14971
|
color: var(--gray-500);
|
|
14879
14972
|
font-size: var(--fs-sm);
|
|
14880
14973
|
line-height: 1.2;
|
|
14881
14974
|
`;
|
|
14882
14975
|
|
|
14883
14976
|
// src/components/Tiles/TileText.tsx
|
|
14884
|
-
import { jsx as
|
|
14977
|
+
import { jsx as jsx76 } from "@emotion/react/jsx-runtime";
|
|
14885
14978
|
var TileText2 = ({ as = "heading", children, ...props }) => {
|
|
14886
14979
|
const isHeading = as === "heading";
|
|
14887
|
-
return /* @__PURE__ */
|
|
14980
|
+
return /* @__PURE__ */ jsx76(
|
|
14888
14981
|
"span",
|
|
14889
14982
|
{
|
|
14890
14983
|
role: isHeading ? "heading" : void 0,
|
|
@@ -14896,39 +14989,39 @@ var TileText2 = ({ as = "heading", children, ...props }) => {
|
|
|
14896
14989
|
};
|
|
14897
14990
|
|
|
14898
14991
|
// src/components/IntegrationModalHeader/IntegrationModalHeader.styles.ts
|
|
14899
|
-
import { css as
|
|
14900
|
-
var IntegrationModalHeaderSVGBackground =
|
|
14992
|
+
import { css as css63 } from "@emotion/react";
|
|
14993
|
+
var IntegrationModalHeaderSVGBackground = css63`
|
|
14901
14994
|
position: absolute;
|
|
14902
14995
|
top: 0;
|
|
14903
14996
|
left: 0;
|
|
14904
14997
|
`;
|
|
14905
|
-
var IntegrationModalHeaderGroup =
|
|
14998
|
+
var IntegrationModalHeaderGroup = css63`
|
|
14906
14999
|
align-items: center;
|
|
14907
15000
|
display: flex;
|
|
14908
15001
|
gap: var(--spacing-sm);
|
|
14909
15002
|
margin: 0 0 var(--spacing-md);
|
|
14910
15003
|
position: relative;
|
|
14911
15004
|
`;
|
|
14912
|
-
var IntegrationModalHeaderTitleGroup =
|
|
15005
|
+
var IntegrationModalHeaderTitleGroup = css63`
|
|
14913
15006
|
align-items: center;
|
|
14914
15007
|
display: flex;
|
|
14915
15008
|
gap: var(--spacing-base);
|
|
14916
15009
|
`;
|
|
14917
|
-
var IntegrationModalHeaderTitle =
|
|
15010
|
+
var IntegrationModalHeaderTitle = css63`
|
|
14918
15011
|
margin-top: 0;
|
|
14919
15012
|
`;
|
|
14920
|
-
var IntegrationModalHeaderMenuPlacement =
|
|
15013
|
+
var IntegrationModalHeaderMenuPlacement = css63`
|
|
14921
15014
|
margin-bottom: var(--spacing-base);
|
|
14922
15015
|
`;
|
|
14923
|
-
var IntegrationModalHeaderContentWrapper =
|
|
15016
|
+
var IntegrationModalHeaderContentWrapper = css63`
|
|
14924
15017
|
position: relative;
|
|
14925
15018
|
z-index: var(--z-10);
|
|
14926
15019
|
`;
|
|
14927
15020
|
|
|
14928
15021
|
// src/components/IntegrationModalHeader/IntegrationModalHeader.tsx
|
|
14929
|
-
import { Fragment as
|
|
15022
|
+
import { Fragment as Fragment12, jsx as jsx77, jsxs as jsxs49 } from "@emotion/react/jsx-runtime";
|
|
14930
15023
|
var HexModalBackground = ({ ...props }) => {
|
|
14931
|
-
return /* @__PURE__ */
|
|
15024
|
+
return /* @__PURE__ */ jsxs49(
|
|
14932
15025
|
"svg",
|
|
14933
15026
|
{
|
|
14934
15027
|
width: "236",
|
|
@@ -14938,7 +15031,7 @@ var HexModalBackground = ({ ...props }) => {
|
|
|
14938
15031
|
xmlns: "http://www.w3.org/2000/svg",
|
|
14939
15032
|
...props,
|
|
14940
15033
|
children: [
|
|
14941
|
-
/* @__PURE__ */
|
|
15034
|
+
/* @__PURE__ */ jsx77(
|
|
14942
15035
|
"path",
|
|
14943
15036
|
{
|
|
14944
15037
|
fillRule: "evenodd",
|
|
@@ -14947,7 +15040,7 @@ var HexModalBackground = ({ ...props }) => {
|
|
|
14947
15040
|
fill: "url(#paint0_linear_196_2737)"
|
|
14948
15041
|
}
|
|
14949
15042
|
),
|
|
14950
|
-
/* @__PURE__ */
|
|
15043
|
+
/* @__PURE__ */ jsx77("defs", { children: /* @__PURE__ */ jsxs49(
|
|
14951
15044
|
"linearGradient",
|
|
14952
15045
|
{
|
|
14953
15046
|
id: "paint0_linear_196_2737",
|
|
@@ -14957,8 +15050,8 @@ var HexModalBackground = ({ ...props }) => {
|
|
|
14957
15050
|
y2: "-95.2742",
|
|
14958
15051
|
gradientUnits: "userSpaceOnUse",
|
|
14959
15052
|
children: [
|
|
14960
|
-
/* @__PURE__ */
|
|
14961
|
-
/* @__PURE__ */
|
|
15053
|
+
/* @__PURE__ */ jsx77("stop", { stopColor: "#81DCDE" }),
|
|
15054
|
+
/* @__PURE__ */ jsx77("stop", { offset: "1", stopColor: "#428ED4" })
|
|
14962
15055
|
]
|
|
14963
15056
|
}
|
|
14964
15057
|
) })
|
|
@@ -14967,23 +15060,23 @@ var HexModalBackground = ({ ...props }) => {
|
|
|
14967
15060
|
);
|
|
14968
15061
|
};
|
|
14969
15062
|
var IntegrationModalHeader = ({ icon, name, menu: menu2, children }) => {
|
|
14970
|
-
return /* @__PURE__ */
|
|
14971
|
-
/* @__PURE__ */
|
|
14972
|
-
/* @__PURE__ */
|
|
14973
|
-
icon ? /* @__PURE__ */
|
|
14974
|
-
/* @__PURE__ */
|
|
14975
|
-
menu2 ? /* @__PURE__ */
|
|
15063
|
+
return /* @__PURE__ */ jsxs49(Fragment12, { children: [
|
|
15064
|
+
/* @__PURE__ */ jsx77(HexModalBackground, { css: IntegrationModalHeaderSVGBackground, role: "presentation" }),
|
|
15065
|
+
/* @__PURE__ */ jsx77("div", { css: IntegrationModalHeaderGroup, children: /* @__PURE__ */ jsxs49("div", { css: IntegrationModalHeaderTitleGroup, children: [
|
|
15066
|
+
icon ? /* @__PURE__ */ jsx77(IntegrationModalIcon, { icon, name: name || "" }) : null,
|
|
15067
|
+
/* @__PURE__ */ jsx77(Heading, { level: 3, css: IntegrationModalHeaderTitle, "data-testid": "integration-modal-title", children: name || "Create Team Integration" }),
|
|
15068
|
+
menu2 ? /* @__PURE__ */ jsxs49("div", { css: IntegrationModalHeaderMenuPlacement, children: [
|
|
14976
15069
|
menu2,
|
|
14977
15070
|
" "
|
|
14978
15071
|
] }) : null
|
|
14979
15072
|
] }) }),
|
|
14980
|
-
/* @__PURE__ */
|
|
15073
|
+
/* @__PURE__ */ jsx77("div", { css: IntegrationModalHeaderContentWrapper, children })
|
|
14981
15074
|
] });
|
|
14982
15075
|
};
|
|
14983
15076
|
|
|
14984
15077
|
// src/components/JsonEditor/JsonEditor.tsx
|
|
14985
15078
|
import MonacoEditor from "@monaco-editor/react";
|
|
14986
|
-
import { jsx as
|
|
15079
|
+
import { jsx as jsx78 } from "@emotion/react/jsx-runtime";
|
|
14987
15080
|
var minEditorHeightPx = 150;
|
|
14988
15081
|
var JsonEditor = ({ defaultValue, onChange, jsonSchema, height, readOnly }) => {
|
|
14989
15082
|
let effectiveHeight = height;
|
|
@@ -14993,7 +15086,7 @@ var JsonEditor = ({ defaultValue, onChange, jsonSchema, height, readOnly }) => {
|
|
|
14993
15086
|
if (typeof effectiveHeight === "number" && effectiveHeight < minEditorHeightPx) {
|
|
14994
15087
|
effectiveHeight = minEditorHeightPx;
|
|
14995
15088
|
}
|
|
14996
|
-
return /* @__PURE__ */
|
|
15089
|
+
return /* @__PURE__ */ jsx78(
|
|
14997
15090
|
MonacoEditor,
|
|
14998
15091
|
{
|
|
14999
15092
|
height: effectiveHeight,
|
|
@@ -15030,39 +15123,39 @@ var JsonEditor = ({ defaultValue, onChange, jsonSchema, height, readOnly }) => {
|
|
|
15030
15123
|
};
|
|
15031
15124
|
|
|
15032
15125
|
// src/components/LimitsBar/LimitsBar.styles.ts
|
|
15033
|
-
import { css as
|
|
15034
|
-
var LimitsBarContainer =
|
|
15126
|
+
import { css as css64 } from "@emotion/react";
|
|
15127
|
+
var LimitsBarContainer = css64`
|
|
15035
15128
|
margin-block: var(--spacing-sm);
|
|
15036
15129
|
`;
|
|
15037
|
-
var LimitsBarProgressBar =
|
|
15130
|
+
var LimitsBarProgressBar = css64`
|
|
15038
15131
|
background: var(--gray-100);
|
|
15039
15132
|
margin-top: var(--spacing-sm);
|
|
15040
15133
|
position: relative;
|
|
15041
15134
|
overflow: hidden;
|
|
15042
15135
|
height: 0.25rem;
|
|
15043
15136
|
`;
|
|
15044
|
-
var LimitsBarProgressBarLine =
|
|
15137
|
+
var LimitsBarProgressBarLine = css64`
|
|
15045
15138
|
position: absolute;
|
|
15046
15139
|
inset: 0;
|
|
15047
15140
|
transition: transform var(--duration-fast) var(--timing-ease-out);
|
|
15048
15141
|
`;
|
|
15049
|
-
var LimitsBarLabelContainer =
|
|
15142
|
+
var LimitsBarLabelContainer = css64`
|
|
15050
15143
|
display: flex;
|
|
15051
15144
|
justify-content: space-between;
|
|
15052
15145
|
font-weight: var(--fw-bold);
|
|
15053
15146
|
`;
|
|
15054
|
-
var LimitsBarLabel =
|
|
15147
|
+
var LimitsBarLabel = css64`
|
|
15055
15148
|
font-size: var(--fs-baase);
|
|
15056
15149
|
`;
|
|
15057
|
-
var LimitsBarBgColor = (statusColor) =>
|
|
15150
|
+
var LimitsBarBgColor = (statusColor) => css64`
|
|
15058
15151
|
background: ${statusColor};
|
|
15059
15152
|
`;
|
|
15060
|
-
var LimitsBarTextColor = (statusColor) =>
|
|
15153
|
+
var LimitsBarTextColor = (statusColor) => css64`
|
|
15061
15154
|
color: ${statusColor};
|
|
15062
15155
|
`;
|
|
15063
15156
|
|
|
15064
15157
|
// src/components/LimitsBar/LimitsBar.tsx
|
|
15065
|
-
import { jsx as
|
|
15158
|
+
import { jsx as jsx79, jsxs as jsxs50 } from "@emotion/react/jsx-runtime";
|
|
15066
15159
|
var LimitsBar = ({ current, max, label }) => {
|
|
15067
15160
|
const maxPercentage = 100;
|
|
15068
15161
|
const progressBarValue = Math.ceil(current / max * maxPercentage);
|
|
@@ -15073,16 +15166,16 @@ var LimitsBar = ({ current, max, label }) => {
|
|
|
15073
15166
|
danger: "var(--brand-secondary-5)"
|
|
15074
15167
|
};
|
|
15075
15168
|
const statusColor = progressBarValue === 100 ? colorMap.danger : progressBarValue >= 75 ? colorMap.warn : colorMap.base;
|
|
15076
|
-
return /* @__PURE__ */
|
|
15077
|
-
/* @__PURE__ */
|
|
15078
|
-
/* @__PURE__ */
|
|
15079
|
-
/* @__PURE__ */
|
|
15169
|
+
return /* @__PURE__ */ jsxs50("div", { css: LimitsBarContainer, children: [
|
|
15170
|
+
/* @__PURE__ */ jsxs50("div", { css: LimitsBarLabelContainer, children: [
|
|
15171
|
+
/* @__PURE__ */ jsx79("span", { css: LimitsBarLabel, children: label }),
|
|
15172
|
+
/* @__PURE__ */ jsxs50("span", { css: [LimitsBarLabel, LimitsBarTextColor(statusColor)], children: [
|
|
15080
15173
|
current,
|
|
15081
15174
|
" of ",
|
|
15082
15175
|
max
|
|
15083
15176
|
] })
|
|
15084
15177
|
] }),
|
|
15085
|
-
/* @__PURE__ */
|
|
15178
|
+
/* @__PURE__ */ jsx79(
|
|
15086
15179
|
"div",
|
|
15087
15180
|
{
|
|
15088
15181
|
role: "progressbar",
|
|
@@ -15091,7 +15184,7 @@ var LimitsBar = ({ current, max, label }) => {
|
|
|
15091
15184
|
"aria-valuemax": max,
|
|
15092
15185
|
"aria-valuetext": `${current} of ${max}`,
|
|
15093
15186
|
css: LimitsBarProgressBar,
|
|
15094
|
-
children: /* @__PURE__ */
|
|
15187
|
+
children: /* @__PURE__ */ jsx79(
|
|
15095
15188
|
"span",
|
|
15096
15189
|
{
|
|
15097
15190
|
role: "presentation",
|
|
@@ -15107,8 +15200,8 @@ var LimitsBar = ({ current, max, label }) => {
|
|
|
15107
15200
|
};
|
|
15108
15201
|
|
|
15109
15202
|
// src/components/LinkList/LinkList.styles.ts
|
|
15110
|
-
import { css as
|
|
15111
|
-
var LinkListContainer = (padding) =>
|
|
15203
|
+
import { css as css65 } from "@emotion/react";
|
|
15204
|
+
var LinkListContainer = (padding) => css65`
|
|
15112
15205
|
padding: ${padding};
|
|
15113
15206
|
|
|
15114
15207
|
${mq("sm")} {
|
|
@@ -15116,30 +15209,30 @@ var LinkListContainer = (padding) => css64`
|
|
|
15116
15209
|
grid-row: 1 / last-line;
|
|
15117
15210
|
}
|
|
15118
15211
|
`;
|
|
15119
|
-
var LinkListTitle =
|
|
15212
|
+
var LinkListTitle = css65`
|
|
15120
15213
|
font-weight: var(--fw-bold);
|
|
15121
15214
|
font-size: var(--fs-sm);
|
|
15122
15215
|
text-transform: uppercase;
|
|
15123
15216
|
`;
|
|
15124
15217
|
|
|
15125
15218
|
// src/components/LinkList/LinkList.tsx
|
|
15126
|
-
import { jsx as
|
|
15219
|
+
import { jsx as jsx80, jsxs as jsxs51 } from "@emotion/react/jsx-runtime";
|
|
15127
15220
|
var LinkList = ({ title, padding = "var(--spacing-md)", children, ...props }) => {
|
|
15128
|
-
return /* @__PURE__ */
|
|
15129
|
-
/* @__PURE__ */
|
|
15221
|
+
return /* @__PURE__ */ jsxs51("div", { css: LinkListContainer(padding), ...props, children: [
|
|
15222
|
+
/* @__PURE__ */ jsx80(Heading, { level: 3, css: LinkListTitle, children: title }),
|
|
15130
15223
|
children
|
|
15131
15224
|
] });
|
|
15132
15225
|
};
|
|
15133
15226
|
|
|
15134
15227
|
// src/components/List/ScrollableList.tsx
|
|
15135
|
-
import { css as
|
|
15228
|
+
import { css as css67 } from "@emotion/react";
|
|
15136
15229
|
|
|
15137
15230
|
// src/components/List/styles/ScrollableList.styles.ts
|
|
15138
|
-
import { css as
|
|
15139
|
-
var ScrollableListContainer =
|
|
15231
|
+
import { css as css66 } from "@emotion/react";
|
|
15232
|
+
var ScrollableListContainer = css66`
|
|
15140
15233
|
position: relative;
|
|
15141
15234
|
`;
|
|
15142
|
-
var ScrollableListInner =
|
|
15235
|
+
var ScrollableListInner = css66`
|
|
15143
15236
|
background: var(--gray-50);
|
|
15144
15237
|
border-top: 1px solid var(--gray-200);
|
|
15145
15238
|
border-bottom: 1px solid var(--gray-200);
|
|
@@ -15162,19 +15255,19 @@ var ScrollableListInner = css65`
|
|
|
15162
15255
|
`;
|
|
15163
15256
|
|
|
15164
15257
|
// src/components/List/ScrollableList.tsx
|
|
15165
|
-
import { jsx as
|
|
15258
|
+
import { jsx as jsx81, jsxs as jsxs52 } from "@emotion/react/jsx-runtime";
|
|
15166
15259
|
var ScrollableList = ({ label, children, ...props }) => {
|
|
15167
|
-
return /* @__PURE__ */
|
|
15168
|
-
label ? /* @__PURE__ */
|
|
15260
|
+
return /* @__PURE__ */ jsxs52("div", { css: [ScrollableListContainer, scrollbarStyles], ...props, children: [
|
|
15261
|
+
label ? /* @__PURE__ */ jsx81(
|
|
15169
15262
|
"span",
|
|
15170
15263
|
{
|
|
15171
|
-
css:
|
|
15264
|
+
css: css67`
|
|
15172
15265
|
${labelText}
|
|
15173
15266
|
`,
|
|
15174
15267
|
children: label
|
|
15175
15268
|
}
|
|
15176
15269
|
) : null,
|
|
15177
|
-
/* @__PURE__ */
|
|
15270
|
+
/* @__PURE__ */ jsx81("div", { css: [ScrollableListInner, scrollbarStyles], children })
|
|
15178
15271
|
] });
|
|
15179
15272
|
};
|
|
15180
15273
|
|
|
@@ -15182,8 +15275,8 @@ var ScrollableList = ({ label, children, ...props }) => {
|
|
|
15182
15275
|
import { CgCheck as CgCheck2 } from "@react-icons/all-files/cg/CgCheck";
|
|
15183
15276
|
|
|
15184
15277
|
// src/components/List/styles/ScrollableListItem.styles.ts
|
|
15185
|
-
import { css as
|
|
15186
|
-
var ScrollableListItemContainer =
|
|
15278
|
+
import { css as css68 } from "@emotion/react";
|
|
15279
|
+
var ScrollableListItemContainer = css68`
|
|
15187
15280
|
align-items: center;
|
|
15188
15281
|
background: var(--white);
|
|
15189
15282
|
border-radius: var(--rounded-base);
|
|
@@ -15192,13 +15285,13 @@ var ScrollableListItemContainer = css67`
|
|
|
15192
15285
|
min-height: 52px;
|
|
15193
15286
|
transition: border-color var(--duration-fast) var(--timing-ease-out);
|
|
15194
15287
|
`;
|
|
15195
|
-
var ScrollableListItemShadow =
|
|
15288
|
+
var ScrollableListItemShadow = css68`
|
|
15196
15289
|
box-shadow: var(--shadow-base);
|
|
15197
15290
|
`;
|
|
15198
|
-
var ScrollableListItemActive =
|
|
15291
|
+
var ScrollableListItemActive = css68`
|
|
15199
15292
|
border-color: var(--brand-secondary-3);
|
|
15200
15293
|
`;
|
|
15201
|
-
var ScrollableListItemBtn =
|
|
15294
|
+
var ScrollableListItemBtn = css68`
|
|
15202
15295
|
align-items: center;
|
|
15203
15296
|
border: none;
|
|
15204
15297
|
background: transparent;
|
|
@@ -15213,27 +15306,27 @@ var ScrollableListItemBtn = css67`
|
|
|
15213
15306
|
outline: none;
|
|
15214
15307
|
}
|
|
15215
15308
|
`;
|
|
15216
|
-
var ScrollableListInputLabel =
|
|
15309
|
+
var ScrollableListInputLabel = css68`
|
|
15217
15310
|
align-items: center;
|
|
15218
15311
|
cursor: pointer;
|
|
15219
15312
|
display: flex;
|
|
15220
15313
|
padding: var(--spacing-xs) var(--spacing-base) var(--spacing-xs);
|
|
15221
15314
|
flex-grow: 1;
|
|
15222
15315
|
`;
|
|
15223
|
-
var ScrollableListInputText =
|
|
15316
|
+
var ScrollableListInputText = css68`
|
|
15224
15317
|
align-items: center;
|
|
15225
15318
|
display: flex;
|
|
15226
15319
|
gap: var(--spacing-sm);
|
|
15227
15320
|
flex-grow: 1;
|
|
15228
15321
|
flex-wrap: wrap;
|
|
15229
15322
|
`;
|
|
15230
|
-
var ScrollableListHiddenInput =
|
|
15323
|
+
var ScrollableListHiddenInput = css68`
|
|
15231
15324
|
position: absolute;
|
|
15232
15325
|
height: 0;
|
|
15233
15326
|
width: 0;
|
|
15234
15327
|
opacity: 0;
|
|
15235
15328
|
`;
|
|
15236
|
-
var ScrollableListIcon =
|
|
15329
|
+
var ScrollableListIcon = css68`
|
|
15237
15330
|
border-radius: var(--rounded-full);
|
|
15238
15331
|
background: var(--brand-secondary-3);
|
|
15239
15332
|
color: var(--white);
|
|
@@ -15241,12 +15334,12 @@ var ScrollableListIcon = css67`
|
|
|
15241
15334
|
min-width: 24px;
|
|
15242
15335
|
opacity: 0;
|
|
15243
15336
|
`;
|
|
15244
|
-
var ScrollableListIconVisible =
|
|
15337
|
+
var ScrollableListIconVisible = css68`
|
|
15245
15338
|
animation: ${fadeInBottom} var(--duration-fast) var(--timing-ease-out) forwards;
|
|
15246
15339
|
`;
|
|
15247
15340
|
|
|
15248
15341
|
// src/components/List/ScrollableListInputItem.tsx
|
|
15249
|
-
import { jsx as
|
|
15342
|
+
import { jsx as jsx82, jsxs as jsxs53 } from "@emotion/react/jsx-runtime";
|
|
15250
15343
|
var ScrollableListInputItem = ({
|
|
15251
15344
|
label,
|
|
15252
15345
|
icon,
|
|
@@ -15256,7 +15349,7 @@ var ScrollableListInputItem = ({
|
|
|
15256
15349
|
labelTestId,
|
|
15257
15350
|
...props
|
|
15258
15351
|
}) => {
|
|
15259
|
-
return /* @__PURE__ */
|
|
15352
|
+
return /* @__PURE__ */ jsx82(
|
|
15260
15353
|
"div",
|
|
15261
15354
|
{
|
|
15262
15355
|
css: [
|
|
@@ -15265,13 +15358,13 @@ var ScrollableListInputItem = ({
|
|
|
15265
15358
|
active ? ScrollableListItemActive : void 0
|
|
15266
15359
|
],
|
|
15267
15360
|
...props,
|
|
15268
|
-
children: /* @__PURE__ */
|
|
15269
|
-
/* @__PURE__ */
|
|
15361
|
+
children: /* @__PURE__ */ jsxs53("label", { "data-testid": labelTestId, css: ScrollableListInputLabel, children: [
|
|
15362
|
+
/* @__PURE__ */ jsxs53("span", { css: ScrollableListInputText, children: [
|
|
15270
15363
|
icon,
|
|
15271
15364
|
label
|
|
15272
15365
|
] }),
|
|
15273
|
-
/* @__PURE__ */
|
|
15274
|
-
/* @__PURE__ */
|
|
15366
|
+
/* @__PURE__ */ jsx82("div", { css: ScrollableListHiddenInput, children }),
|
|
15367
|
+
/* @__PURE__ */ jsx82(
|
|
15275
15368
|
Icon,
|
|
15276
15369
|
{
|
|
15277
15370
|
icon: CgCheck2,
|
|
@@ -15289,15 +15382,14 @@ var ScrollableListInputItem = ({
|
|
|
15289
15382
|
|
|
15290
15383
|
// src/components/List/ScrollableListItem.tsx
|
|
15291
15384
|
import { CgCheck as CgCheck3 } from "@react-icons/all-files/cg/CgCheck";
|
|
15292
|
-
import { jsx as
|
|
15385
|
+
import { jsx as jsx83, jsxs as jsxs54 } from "@emotion/react/jsx-runtime";
|
|
15293
15386
|
var ScrollableListItem = ({
|
|
15294
15387
|
buttonText,
|
|
15295
|
-
icon,
|
|
15296
15388
|
active,
|
|
15297
15389
|
disableShadow,
|
|
15298
15390
|
...props
|
|
15299
15391
|
}) => {
|
|
15300
|
-
return /* @__PURE__ */
|
|
15392
|
+
return /* @__PURE__ */ jsx83(
|
|
15301
15393
|
"div",
|
|
15302
15394
|
{
|
|
15303
15395
|
css: [
|
|
@@ -15305,12 +15397,9 @@ var ScrollableListItem = ({
|
|
|
15305
15397
|
disableShadow ? void 0 : ScrollableListItemShadow,
|
|
15306
15398
|
active ? ScrollableListItemActive : void 0
|
|
15307
15399
|
],
|
|
15308
|
-
children: /* @__PURE__ */
|
|
15309
|
-
/* @__PURE__ */
|
|
15310
|
-
|
|
15311
|
-
/* @__PURE__ */ jsx82("span", { children: buttonText })
|
|
15312
|
-
] }),
|
|
15313
|
-
/* @__PURE__ */ jsx82(
|
|
15400
|
+
children: /* @__PURE__ */ jsxs54("button", { css: ScrollableListItemBtn, type: "button", ...props, children: [
|
|
15401
|
+
/* @__PURE__ */ jsx83("span", { children: buttonText }),
|
|
15402
|
+
/* @__PURE__ */ jsx83(
|
|
15314
15403
|
Icon,
|
|
15315
15404
|
{
|
|
15316
15405
|
icon: CgCheck3,
|
|
@@ -15325,7 +15414,7 @@ var ScrollableListItem = ({
|
|
|
15325
15414
|
};
|
|
15326
15415
|
|
|
15327
15416
|
// src/components/LoadingIndicator/LoadingIndicator.styles.ts
|
|
15328
|
-
import { css as
|
|
15417
|
+
import { css as css69, keyframes as keyframes3 } from "@emotion/react";
|
|
15329
15418
|
function bounceFade(size) {
|
|
15330
15419
|
const bounceHeight = size === "lg" ? 10 : 5;
|
|
15331
15420
|
return keyframes3`
|
|
@@ -15346,13 +15435,13 @@ function bounceFade(size) {
|
|
|
15346
15435
|
}
|
|
15347
15436
|
`;
|
|
15348
15437
|
}
|
|
15349
|
-
var loader =
|
|
15438
|
+
var loader = css69`
|
|
15350
15439
|
display: inline-flex;
|
|
15351
15440
|
justify-content: center;
|
|
15352
15441
|
`;
|
|
15353
15442
|
function loadingDot(size) {
|
|
15354
15443
|
const dotSize = size === "lg" ? 8 : 4;
|
|
15355
|
-
return
|
|
15444
|
+
return css69`
|
|
15356
15445
|
background-color: var(--gray-700);
|
|
15357
15446
|
display: block;
|
|
15358
15447
|
border-radius: var(--rounded-full);
|
|
@@ -15377,25 +15466,25 @@ function loadingDot(size) {
|
|
|
15377
15466
|
}
|
|
15378
15467
|
|
|
15379
15468
|
// src/components/LoadingIndicator/LoadingIndicator.tsx
|
|
15380
|
-
import { jsx as
|
|
15469
|
+
import { jsx as jsx84, jsxs as jsxs55 } from "@emotion/react/jsx-runtime";
|
|
15381
15470
|
var LoadingIndicator = ({
|
|
15382
15471
|
size = "lg",
|
|
15383
15472
|
...props
|
|
15384
15473
|
}) => {
|
|
15385
15474
|
const dotStyle = loadingDot(size);
|
|
15386
|
-
return /* @__PURE__ */
|
|
15387
|
-
/* @__PURE__ */
|
|
15388
|
-
/* @__PURE__ */
|
|
15389
|
-
/* @__PURE__ */
|
|
15475
|
+
return /* @__PURE__ */ jsxs55("div", { role: "alert", css: loader, "data-testid": "loading-indicator", ...props, children: [
|
|
15476
|
+
/* @__PURE__ */ jsx84("span", { css: dotStyle }),
|
|
15477
|
+
/* @__PURE__ */ jsx84("span", { css: dotStyle }),
|
|
15478
|
+
/* @__PURE__ */ jsx84("span", { css: dotStyle })
|
|
15390
15479
|
] });
|
|
15391
15480
|
};
|
|
15392
15481
|
|
|
15393
15482
|
// src/components/LoadingOverlay/LoadingOverlay.tsx
|
|
15394
|
-
import { useCallback as
|
|
15483
|
+
import { useCallback as useCallback3, useEffect as useEffect9, useRef as useRef5 } from "react";
|
|
15395
15484
|
|
|
15396
15485
|
// src/components/LoadingOverlay/LoadingOverlay.styles.ts
|
|
15397
|
-
import { css as
|
|
15398
|
-
var loadingOverlayContainer =
|
|
15486
|
+
import { css as css70 } from "@emotion/react";
|
|
15487
|
+
var loadingOverlayContainer = css70`
|
|
15399
15488
|
position: absolute;
|
|
15400
15489
|
inset: 0;
|
|
15401
15490
|
overflow: hidden;
|
|
@@ -15403,30 +15492,30 @@ var loadingOverlayContainer = css69`
|
|
|
15403
15492
|
padding: var(--spacing-xl);
|
|
15404
15493
|
overflow-y: auto;
|
|
15405
15494
|
`;
|
|
15406
|
-
var loadingOverlayVisible =
|
|
15495
|
+
var loadingOverlayVisible = css70`
|
|
15407
15496
|
display: flex;
|
|
15408
15497
|
`;
|
|
15409
|
-
var loadingOverlayHidden =
|
|
15498
|
+
var loadingOverlayHidden = css70`
|
|
15410
15499
|
display: none;
|
|
15411
15500
|
`;
|
|
15412
|
-
var loadingOverlayBackground = (bgColor) =>
|
|
15501
|
+
var loadingOverlayBackground = (bgColor) => css70`
|
|
15413
15502
|
background: ${bgColor};
|
|
15414
15503
|
opacity: 0.92;
|
|
15415
15504
|
position: absolute;
|
|
15416
15505
|
inset: 0 0;
|
|
15417
15506
|
`;
|
|
15418
|
-
var loadingOverlayBody =
|
|
15507
|
+
var loadingOverlayBody = css70`
|
|
15419
15508
|
align-items: center;
|
|
15420
15509
|
display: flex;
|
|
15421
15510
|
flex-direction: column;
|
|
15422
15511
|
`;
|
|
15423
|
-
var loadingOverlayMessage =
|
|
15512
|
+
var loadingOverlayMessage = css70`
|
|
15424
15513
|
color: var(--gray-600);
|
|
15425
15514
|
margin: var(--spacing-base) 0 0;
|
|
15426
15515
|
`;
|
|
15427
15516
|
|
|
15428
15517
|
// src/components/LoadingOverlay/LoadingOverlay.tsx
|
|
15429
|
-
import { jsx as
|
|
15518
|
+
import { jsx as jsx85, jsxs as jsxs56 } from "@emotion/react/jsx-runtime";
|
|
15430
15519
|
var LoadingOverlay = ({
|
|
15431
15520
|
isActive,
|
|
15432
15521
|
statusMessage,
|
|
@@ -15438,13 +15527,13 @@ var LoadingOverlay = ({
|
|
|
15438
15527
|
children
|
|
15439
15528
|
}) => {
|
|
15440
15529
|
const lottieRef = useRef5(null);
|
|
15441
|
-
const onLoopComplete =
|
|
15530
|
+
const onLoopComplete = useCallback3(() => {
|
|
15442
15531
|
var _a, _b, _c;
|
|
15443
15532
|
if (isPaused && !((_b = (_a = lottieRef.current) == null ? void 0 : _a.animationItem) == null ? void 0 : _b.isPaused)) {
|
|
15444
15533
|
(_c = lottieRef.current) == null ? void 0 : _c.stop();
|
|
15445
15534
|
}
|
|
15446
15535
|
}, [isPaused]);
|
|
15447
|
-
|
|
15536
|
+
useEffect9(() => {
|
|
15448
15537
|
var _a, _b, _c, _d, _e, _f;
|
|
15449
15538
|
if (!isPaused && ((_b = (_a = lottieRef.current) == null ? void 0 : _a.animationItem) == null ? void 0 : _b.isPaused)) {
|
|
15450
15539
|
(_c = lottieRef.current) == null ? void 0 : _c.play();
|
|
@@ -15452,7 +15541,7 @@ var LoadingOverlay = ({
|
|
|
15452
15541
|
(_f = lottieRef.current) == null ? void 0 : _f.stop();
|
|
15453
15542
|
}
|
|
15454
15543
|
}, [isPaused]);
|
|
15455
|
-
return /* @__PURE__ */
|
|
15544
|
+
return /* @__PURE__ */ jsxs56(
|
|
15456
15545
|
"div",
|
|
15457
15546
|
{
|
|
15458
15547
|
role: "alert",
|
|
@@ -15460,9 +15549,9 @@ var LoadingOverlay = ({
|
|
|
15460
15549
|
"aria-hidden": !isActive,
|
|
15461
15550
|
"aria-busy": isActive && !isPaused,
|
|
15462
15551
|
children: [
|
|
15463
|
-
/* @__PURE__ */
|
|
15464
|
-
/* @__PURE__ */
|
|
15465
|
-
/* @__PURE__ */
|
|
15552
|
+
/* @__PURE__ */ jsx85("div", { css: loadingOverlayBackground(overlayBackgroundColor) }),
|
|
15553
|
+
/* @__PURE__ */ jsx85("div", { css: { position: "relative", maxWidth: "100%", margin: isTopAligned ? "0" : "auto" }, children: /* @__PURE__ */ jsxs56("div", { css: loadingOverlayBody, children: [
|
|
15554
|
+
/* @__PURE__ */ jsx85(
|
|
15466
15555
|
AnimationFile,
|
|
15467
15556
|
{
|
|
15468
15557
|
lottieRef,
|
|
@@ -15477,15 +15566,15 @@ var LoadingOverlay = ({
|
|
|
15477
15566
|
}
|
|
15478
15567
|
}
|
|
15479
15568
|
),
|
|
15480
|
-
statusMessage ? /* @__PURE__ */
|
|
15481
|
-
/* @__PURE__ */
|
|
15569
|
+
statusMessage ? /* @__PURE__ */ jsx85("div", { css: loadingOverlayMessage, children: statusMessage }) : null,
|
|
15570
|
+
/* @__PURE__ */ jsx85("div", { css: { width: "100%", marginTop: "var(--spacing-md)" }, children })
|
|
15482
15571
|
] }) })
|
|
15483
15572
|
]
|
|
15484
15573
|
}
|
|
15485
15574
|
);
|
|
15486
15575
|
};
|
|
15487
15576
|
var LoadingIcon = ({ height, width, ...props }) => {
|
|
15488
|
-
return /* @__PURE__ */
|
|
15577
|
+
return /* @__PURE__ */ jsx85(
|
|
15489
15578
|
"svg",
|
|
15490
15579
|
{
|
|
15491
15580
|
viewBox: "0 0 38 38",
|
|
@@ -15495,9 +15584,9 @@ var LoadingIcon = ({ height, width, ...props }) => {
|
|
|
15495
15584
|
stroke: "currentColor",
|
|
15496
15585
|
...props,
|
|
15497
15586
|
"data-testid": "loading-icon",
|
|
15498
|
-
children: /* @__PURE__ */
|
|
15499
|
-
/* @__PURE__ */
|
|
15500
|
-
/* @__PURE__ */
|
|
15587
|
+
children: /* @__PURE__ */ jsx85("g", { fill: "none", fillRule: "evenodd", children: /* @__PURE__ */ jsxs56("g", { transform: "translate(1 1)", strokeWidth: "2", children: [
|
|
15588
|
+
/* @__PURE__ */ jsx85("circle", { strokeOpacity: ".25", cx: "18", cy: "18", r: "18" }),
|
|
15589
|
+
/* @__PURE__ */ jsx85("path", { d: "M36 18c0-9.94-8.06-18-18-18", transform: "rotate(166.645 18 18)", children: /* @__PURE__ */ jsx85(
|
|
15501
15590
|
"animateTransform",
|
|
15502
15591
|
{
|
|
15503
15592
|
attributeName: "transform",
|
|
@@ -15521,12 +15610,12 @@ import {
|
|
|
15521
15610
|
} from "reakit/Popover";
|
|
15522
15611
|
|
|
15523
15612
|
// src/components/Popover/Popover.styles.ts
|
|
15524
|
-
import { css as
|
|
15525
|
-
var PopoverBtn =
|
|
15613
|
+
import { css as css71 } from "@emotion/react";
|
|
15614
|
+
var PopoverBtn = css71`
|
|
15526
15615
|
border: none;
|
|
15527
15616
|
background: none;
|
|
15528
15617
|
`;
|
|
15529
|
-
var PopoverDefaulterTriggerBtn =
|
|
15618
|
+
var PopoverDefaulterTriggerBtn = css71`
|
|
15530
15619
|
border: none;
|
|
15531
15620
|
background: none;
|
|
15532
15621
|
padding: var(--spacing-2xs);
|
|
@@ -15536,7 +15625,7 @@ var PopoverDefaulterTriggerBtn = css70`
|
|
|
15536
15625
|
background-color: rgba(0, 0, 0, 0.05);
|
|
15537
15626
|
}
|
|
15538
15627
|
`;
|
|
15539
|
-
var Popover =
|
|
15628
|
+
var Popover = css71`
|
|
15540
15629
|
border-left: var(--spacing-xs) solid var(--brand-secondary-3);
|
|
15541
15630
|
border-radius: var(--rounded-base);
|
|
15542
15631
|
box-shadow: var(--shadow-base);
|
|
@@ -15550,7 +15639,7 @@ var Popover = css70`
|
|
|
15550
15639
|
`;
|
|
15551
15640
|
|
|
15552
15641
|
// src/components/Popover/Popover.tsx
|
|
15553
|
-
import { Fragment as
|
|
15642
|
+
import { Fragment as Fragment13, jsx as jsx86, jsxs as jsxs57 } from "@emotion/react/jsx-runtime";
|
|
15554
15643
|
var Popover2 = ({
|
|
15555
15644
|
iconColor = "action",
|
|
15556
15645
|
icon = "info",
|
|
@@ -15564,27 +15653,27 @@ var Popover2 = ({
|
|
|
15564
15653
|
...otherProps
|
|
15565
15654
|
}) => {
|
|
15566
15655
|
const popover = usePopoverState({ placement });
|
|
15567
|
-
return /* @__PURE__ */
|
|
15568
|
-
/* @__PURE__ */
|
|
15656
|
+
return /* @__PURE__ */ jsxs57(Fragment13, { children: [
|
|
15657
|
+
/* @__PURE__ */ jsx86(
|
|
15569
15658
|
PopoverDisclosure,
|
|
15570
15659
|
{
|
|
15571
15660
|
...popover,
|
|
15572
15661
|
css: [PopoverBtn, trigger ? void 0 : PopoverDefaulterTriggerBtn],
|
|
15573
15662
|
title: buttonText,
|
|
15574
15663
|
"data-testid": testId,
|
|
15575
|
-
children: trigger ? trigger : /* @__PURE__ */
|
|
15576
|
-
/* @__PURE__ */
|
|
15577
|
-
/* @__PURE__ */
|
|
15664
|
+
children: trigger ? trigger : /* @__PURE__ */ jsxs57(Fragment13, { children: [
|
|
15665
|
+
/* @__PURE__ */ jsx86(Icon, { icon, iconColor, size: iconSize }),
|
|
15666
|
+
/* @__PURE__ */ jsx86("span", { hidden: true, children: buttonText })
|
|
15578
15667
|
] })
|
|
15579
15668
|
}
|
|
15580
15669
|
),
|
|
15581
|
-
/* @__PURE__ */
|
|
15670
|
+
/* @__PURE__ */ jsx86(ReakitPopover, { css: Popover, ...otherProps, ...popover, role: "tooltip", "aria-label": ariaLabel, children })
|
|
15582
15671
|
] });
|
|
15583
15672
|
};
|
|
15584
15673
|
|
|
15585
15674
|
// src/components/MediaCard/MediaCard.styles.ts
|
|
15586
|
-
import { css as
|
|
15587
|
-
var cardBaseStyles =
|
|
15675
|
+
import { css as css72 } from "@emotion/react";
|
|
15676
|
+
var cardBaseStyles = css72`
|
|
15588
15677
|
display: flex;
|
|
15589
15678
|
flex-direction: column;
|
|
15590
15679
|
justify-content: flex-start;
|
|
@@ -15598,7 +15687,7 @@ var cardBaseStyles = css71`
|
|
|
15598
15687
|
outline: 2px solid var(--primary-action-default);
|
|
15599
15688
|
}
|
|
15600
15689
|
`;
|
|
15601
|
-
var cardBaseCoverIconWrapperStyles =
|
|
15690
|
+
var cardBaseCoverIconWrapperStyles = css72`
|
|
15602
15691
|
position: relative;
|
|
15603
15692
|
display: flex;
|
|
15604
15693
|
align-items: center;
|
|
@@ -15610,19 +15699,19 @@ var cardBaseCoverIconWrapperStyles = css71`
|
|
|
15610
15699
|
padding: var(--spacing-sm);
|
|
15611
15700
|
cursor: pointer;
|
|
15612
15701
|
`;
|
|
15613
|
-
var cardBaseContentStyles =
|
|
15702
|
+
var cardBaseContentStyles = css72`
|
|
15614
15703
|
padding: var(--spacing-sm);
|
|
15615
15704
|
`;
|
|
15616
|
-
var cardBaseTitleStyles =
|
|
15705
|
+
var cardBaseTitleStyles = css72`
|
|
15617
15706
|
font-size: var(--fs-sm);
|
|
15618
15707
|
color: var(--gray-500);
|
|
15619
15708
|
cursor: pointer;
|
|
15620
15709
|
`;
|
|
15621
|
-
var cardBaseSubtitleStyles =
|
|
15710
|
+
var cardBaseSubtitleStyles = css72`
|
|
15622
15711
|
font-size: var(--fs-xs);
|
|
15623
15712
|
color: var(--gray-500);
|
|
15624
15713
|
`;
|
|
15625
|
-
var cardBaseMenuButtonStyles =
|
|
15714
|
+
var cardBaseMenuButtonStyles = css72`
|
|
15626
15715
|
padding: var(--spacing-2xs);
|
|
15627
15716
|
border-radius: var(--rounded-sm);
|
|
15628
15717
|
border-width: 0;
|
|
@@ -15634,7 +15723,7 @@ var cardBaseMenuButtonStyles = css71`
|
|
|
15634
15723
|
`;
|
|
15635
15724
|
|
|
15636
15725
|
// src/components/MediaCard/MediaCard.tsx
|
|
15637
|
-
import { jsx as
|
|
15726
|
+
import { jsx as jsx87, jsxs as jsxs58 } from "@emotion/react/jsx-runtime";
|
|
15638
15727
|
var MediaCard = ({
|
|
15639
15728
|
title,
|
|
15640
15729
|
subtitle,
|
|
@@ -15645,13 +15734,13 @@ var MediaCard = ({
|
|
|
15645
15734
|
onClick,
|
|
15646
15735
|
...cardProps
|
|
15647
15736
|
}) => {
|
|
15648
|
-
return /* @__PURE__ */
|
|
15649
|
-
/* @__PURE__ */
|
|
15650
|
-
/* @__PURE__ */
|
|
15651
|
-
/* @__PURE__ */
|
|
15652
|
-
/* @__PURE__ */
|
|
15653
|
-
/* @__PURE__ */
|
|
15654
|
-
!infoPopover ? null : /* @__PURE__ */
|
|
15737
|
+
return /* @__PURE__ */ jsxs58(Card, { tag: "button", css: cardBaseStyles, ...cardProps, onClick, children: [
|
|
15738
|
+
/* @__PURE__ */ jsx87("div", { css: cardBaseCoverIconWrapperStyles, children: cover }),
|
|
15739
|
+
/* @__PURE__ */ jsx87("div", { css: cardBaseContentStyles, children: /* @__PURE__ */ jsxs58(HorizontalRhythm, { gap: "sm", justify: "space-between", align: "center", css: { width: "100%" }, children: [
|
|
15740
|
+
/* @__PURE__ */ jsxs58(VerticalRhythm, { gap: "0", align: "flex-start", css: { flex: 1 }, children: [
|
|
15741
|
+
/* @__PURE__ */ jsxs58(HorizontalRhythm, { gap: "xs", align: "center", children: [
|
|
15742
|
+
/* @__PURE__ */ jsx87("div", { css: cardBaseTitleStyles, "data-testid": "card-title", children: title }),
|
|
15743
|
+
!infoPopover ? null : /* @__PURE__ */ jsx87("div", { css: { display: "flex", cursor: "default" }, onClick: (e) => e.stopPropagation(), children: /* @__PURE__ */ jsx87(
|
|
15655
15744
|
Popover2,
|
|
15656
15745
|
{
|
|
15657
15746
|
baseId: `info-of-${title}`,
|
|
@@ -15660,17 +15749,17 @@ var MediaCard = ({
|
|
|
15660
15749
|
iconColor: "default",
|
|
15661
15750
|
tabIndex: 0,
|
|
15662
15751
|
css: { display: "block" },
|
|
15663
|
-
children: /* @__PURE__ */
|
|
15752
|
+
children: /* @__PURE__ */ jsx87("div", { children: infoPopover })
|
|
15664
15753
|
}
|
|
15665
15754
|
) })
|
|
15666
15755
|
] }),
|
|
15667
|
-
!subtitle ? null : /* @__PURE__ */
|
|
15756
|
+
!subtitle ? null : /* @__PURE__ */ jsx87("div", { css: cardBaseSubtitleStyles, children: subtitle })
|
|
15668
15757
|
] }),
|
|
15669
|
-
/* @__PURE__ */
|
|
15670
|
-
/* @__PURE__ */
|
|
15758
|
+
/* @__PURE__ */ jsx87("div", { css: { cursor: "default" }, onClick: (e) => e.stopPropagation(), children: sideSection }),
|
|
15759
|
+
/* @__PURE__ */ jsx87(VerticalRhythm, { align: "center", justify: "center", onClick: (e) => e.stopPropagation(), children: !menuItems || Array.isArray(menuItems) && !menuItems.length ? null : /* @__PURE__ */ jsx87(
|
|
15671
15760
|
Menu,
|
|
15672
15761
|
{
|
|
15673
|
-
menuTrigger: /* @__PURE__ */
|
|
15762
|
+
menuTrigger: /* @__PURE__ */ jsx87("button", { type: "button", "aria-label": "More options", css: cardBaseMenuButtonStyles, children: /* @__PURE__ */ jsx87(Icon, { icon: "more-alt", iconColor: "gray", size: 16 }) }),
|
|
15674
15763
|
menuLabel: `Menu of ${title}`,
|
|
15675
15764
|
children: menuItems
|
|
15676
15765
|
}
|
|
@@ -15684,8 +15773,8 @@ import { CgClose as CgClose5 } from "@react-icons/all-files/cg/CgClose";
|
|
|
15684
15773
|
import React19 from "react";
|
|
15685
15774
|
|
|
15686
15775
|
// src/components/Modal/Modal.styles.ts
|
|
15687
|
-
import { css as
|
|
15688
|
-
var modalWrapperStyles =
|
|
15776
|
+
import { css as css73 } from "@emotion/react";
|
|
15777
|
+
var modalWrapperStyles = css73`
|
|
15689
15778
|
position: fixed;
|
|
15690
15779
|
inset: 0;
|
|
15691
15780
|
display: flex;
|
|
@@ -15693,13 +15782,13 @@ var modalWrapperStyles = css72`
|
|
|
15693
15782
|
justify-content: center;
|
|
15694
15783
|
z-index: var(--z-drawer);
|
|
15695
15784
|
`;
|
|
15696
|
-
var modalBackdropStyles =
|
|
15785
|
+
var modalBackdropStyles = css73`
|
|
15697
15786
|
position: absolute;
|
|
15698
15787
|
inset: 0;
|
|
15699
15788
|
background-color: var(--brand-secondary-1);
|
|
15700
15789
|
opacity: 0.4;
|
|
15701
15790
|
`;
|
|
15702
|
-
var modalStyles =
|
|
15791
|
+
var modalStyles = css73`
|
|
15703
15792
|
position: relative;
|
|
15704
15793
|
display: flex;
|
|
15705
15794
|
flex-direction: column;
|
|
@@ -15714,21 +15803,21 @@ var modalStyles = css72`
|
|
|
15714
15803
|
color: unset;
|
|
15715
15804
|
z-index: 1;
|
|
15716
15805
|
`;
|
|
15717
|
-
var modalHeaderStyles =
|
|
15806
|
+
var modalHeaderStyles = css73`
|
|
15718
15807
|
display: flex;
|
|
15719
15808
|
align-items: flex-start;
|
|
15720
15809
|
gap: var(--spacing-base);
|
|
15721
15810
|
font-size: var(--fs-md);
|
|
15722
15811
|
line-height: 1.2;
|
|
15723
15812
|
`;
|
|
15724
|
-
var modalCloseButtonStyles =
|
|
15813
|
+
var modalCloseButtonStyles = css73`
|
|
15725
15814
|
display: block;
|
|
15726
15815
|
padding: 0;
|
|
15727
15816
|
background: transparent;
|
|
15728
15817
|
border: none;
|
|
15729
15818
|
margin-left: auto;
|
|
15730
15819
|
`;
|
|
15731
|
-
var modalContentStyles =
|
|
15820
|
+
var modalContentStyles = css73`
|
|
15732
15821
|
flex: 1;
|
|
15733
15822
|
background-color: white;
|
|
15734
15823
|
padding: var(--spacing-md);
|
|
@@ -15737,7 +15826,7 @@ var modalContentStyles = css72`
|
|
|
15737
15826
|
`;
|
|
15738
15827
|
|
|
15739
15828
|
// src/components/Modal/Modal.tsx
|
|
15740
|
-
import { jsx as
|
|
15829
|
+
import { jsx as jsx88, jsxs as jsxs59 } from "@emotion/react/jsx-runtime";
|
|
15741
15830
|
var defaultModalWidth = "75rem";
|
|
15742
15831
|
var defaultModalHeight = "51rem";
|
|
15743
15832
|
var Modal = React19.forwardRef(
|
|
@@ -15756,12 +15845,12 @@ var Modal = React19.forwardRef(
|
|
|
15756
15845
|
handler: onRequestClose,
|
|
15757
15846
|
shortcut: "escape"
|
|
15758
15847
|
});
|
|
15759
|
-
return /* @__PURE__ */
|
|
15760
|
-
/* @__PURE__ */
|
|
15761
|
-
/* @__PURE__ */
|
|
15762
|
-
/* @__PURE__ */
|
|
15763
|
-
/* @__PURE__ */
|
|
15764
|
-
/* @__PURE__ */
|
|
15848
|
+
return /* @__PURE__ */ jsxs59("div", { css: [modalWrapperStyles, wrapperClassName], children: [
|
|
15849
|
+
/* @__PURE__ */ jsx88("div", { onClick: onRequestClose, css: modalBackdropStyles }),
|
|
15850
|
+
/* @__PURE__ */ jsxs59("dialog", { ref, css: modalStyles, style: { width, height }, ...modalProps, children: [
|
|
15851
|
+
/* @__PURE__ */ jsxs59("div", { css: modalHeaderStyles, children: [
|
|
15852
|
+
/* @__PURE__ */ jsx88("div", { children: header }),
|
|
15853
|
+
/* @__PURE__ */ jsx88(
|
|
15765
15854
|
Button,
|
|
15766
15855
|
{
|
|
15767
15856
|
type: "button",
|
|
@@ -15770,12 +15859,12 @@ var Modal = React19.forwardRef(
|
|
|
15770
15859
|
title: "Close dialog",
|
|
15771
15860
|
buttonType: "ghost",
|
|
15772
15861
|
"data-testid": "close-dialog",
|
|
15773
|
-
children: /* @__PURE__ */
|
|
15862
|
+
children: /* @__PURE__ */ jsx88(Icon, { icon: CgClose5, iconColor: "gray", size: 24 })
|
|
15774
15863
|
}
|
|
15775
15864
|
)
|
|
15776
15865
|
] }),
|
|
15777
|
-
/* @__PURE__ */
|
|
15778
|
-
buttonGroup ? /* @__PURE__ */
|
|
15866
|
+
/* @__PURE__ */ jsx88("div", { css: [modalContentStyles, !withoutContentPadding ? null : { padding: 0 }], children }),
|
|
15867
|
+
buttonGroup ? /* @__PURE__ */ jsx88(HorizontalRhythm, { children: buttonGroup }) : null
|
|
15779
15868
|
] })
|
|
15780
15869
|
] });
|
|
15781
15870
|
}
|
|
@@ -15804,8 +15893,8 @@ var useParameterShell = () => {
|
|
|
15804
15893
|
};
|
|
15805
15894
|
|
|
15806
15895
|
// src/components/ParameterInputs/styles/LabelLeadingIcon.styles.ts
|
|
15807
|
-
import { css as
|
|
15808
|
-
var inputIconBtn =
|
|
15896
|
+
import { css as css74 } from "@emotion/react";
|
|
15897
|
+
var inputIconBtn = css74`
|
|
15809
15898
|
align-items: center;
|
|
15810
15899
|
border: none;
|
|
15811
15900
|
border-radius: var(--rounded-base);
|
|
@@ -15831,7 +15920,7 @@ var inputIconBtn = css73`
|
|
|
15831
15920
|
`;
|
|
15832
15921
|
|
|
15833
15922
|
// src/components/ParameterInputs/LabelLeadingIcon.tsx
|
|
15834
|
-
import { jsx as
|
|
15923
|
+
import { jsx as jsx89, jsxs as jsxs60 } from "@emotion/react/jsx-runtime";
|
|
15835
15924
|
var LabelLeadingIcon = ({
|
|
15836
15925
|
icon,
|
|
15837
15926
|
iconColor,
|
|
@@ -15843,7 +15932,7 @@ var LabelLeadingIcon = ({
|
|
|
15843
15932
|
...props
|
|
15844
15933
|
}) => {
|
|
15845
15934
|
const titleFr = title != null ? title : isLocked ? "Read-only pattern parameter" : isBound ? "Connected to external content. Click to edit" : "Click to connect to external content";
|
|
15846
|
-
return /* @__PURE__ */
|
|
15935
|
+
return /* @__PURE__ */ jsx89(Tooltip, { title: titleFr, children: /* @__PURE__ */ jsxs60(
|
|
15847
15936
|
"button",
|
|
15848
15937
|
{
|
|
15849
15938
|
css: inputIconBtn,
|
|
@@ -15852,7 +15941,7 @@ var LabelLeadingIcon = ({
|
|
|
15852
15941
|
"aria-disabled": isLocked,
|
|
15853
15942
|
...props,
|
|
15854
15943
|
children: [
|
|
15855
|
-
/* @__PURE__ */
|
|
15944
|
+
/* @__PURE__ */ jsx89(
|
|
15856
15945
|
Icon,
|
|
15857
15946
|
{
|
|
15858
15947
|
icon: isLocked ? "lock" : icon ? icon : "arrows-expand-down-right",
|
|
@@ -15868,8 +15957,8 @@ var LabelLeadingIcon = ({
|
|
|
15868
15957
|
var ConnectToDataElementButton = LabelLeadingIcon;
|
|
15869
15958
|
|
|
15870
15959
|
// src/components/ParameterInputs/styles/ParameterInput.styles.ts
|
|
15871
|
-
import { css as
|
|
15872
|
-
var inputContainer2 =
|
|
15960
|
+
import { css as css75 } from "@emotion/react";
|
|
15961
|
+
var inputContainer2 = css75`
|
|
15873
15962
|
position: relative;
|
|
15874
15963
|
|
|
15875
15964
|
&:hover,
|
|
@@ -15881,14 +15970,14 @@ var inputContainer2 = css74`
|
|
|
15881
15970
|
}
|
|
15882
15971
|
}
|
|
15883
15972
|
`;
|
|
15884
|
-
var labelText2 =
|
|
15973
|
+
var labelText2 = css75`
|
|
15885
15974
|
align-items: center;
|
|
15886
15975
|
display: flex;
|
|
15887
15976
|
gap: var(--spacing-xs);
|
|
15888
15977
|
font-weight: var(--fw-regular);
|
|
15889
15978
|
margin: 0 0 var(--spacing-xs);
|
|
15890
15979
|
`;
|
|
15891
|
-
var input2 =
|
|
15980
|
+
var input2 = css75`
|
|
15892
15981
|
display: block;
|
|
15893
15982
|
appearance: none;
|
|
15894
15983
|
box-sizing: border-box;
|
|
@@ -15932,18 +16021,18 @@ var input2 = css74`
|
|
|
15932
16021
|
color: var(--gray-400);
|
|
15933
16022
|
}
|
|
15934
16023
|
`;
|
|
15935
|
-
var selectInput =
|
|
16024
|
+
var selectInput = css75`
|
|
15936
16025
|
background-image: url("data:image/svg+xml,%3Csvg width='24' height='24' viewBox='0 0 24 24' fill='none' xmlns='http://www.w3.org/2000/svg'%0A%3E%3Cpath d='M6.34317 7.75732L4.92896 9.17154L12 16.2426L19.0711 9.17157L17.6569 7.75735L12 13.4142L6.34317 7.75732Z' fill='currentColor' /%3E%3C/svg%3E");
|
|
15937
16026
|
background-position: right var(--spacing-sm) center;
|
|
15938
16027
|
background-repeat: no-repeat;
|
|
15939
16028
|
background-size: 1rem;
|
|
15940
16029
|
padding-right: var(--spacing-xl);
|
|
15941
16030
|
`;
|
|
15942
|
-
var inputWrapper =
|
|
16031
|
+
var inputWrapper = css75`
|
|
15943
16032
|
display: flex; // used to correct overflow with chrome textarea
|
|
15944
16033
|
position: relative;
|
|
15945
16034
|
`;
|
|
15946
|
-
var inputIcon2 =
|
|
16035
|
+
var inputIcon2 = css75`
|
|
15947
16036
|
align-items: center;
|
|
15948
16037
|
background: var(--white);
|
|
15949
16038
|
border-radius: var(--rounded-md) 0 0 var(--rounded-md);
|
|
@@ -15959,7 +16048,7 @@ var inputIcon2 = css74`
|
|
|
15959
16048
|
width: var(--spacing-lg);
|
|
15960
16049
|
z-index: var(--z-10);
|
|
15961
16050
|
`;
|
|
15962
|
-
var inputToggleLabel2 =
|
|
16051
|
+
var inputToggleLabel2 = css75`
|
|
15963
16052
|
align-items: center;
|
|
15964
16053
|
background: var(--white);
|
|
15965
16054
|
cursor: pointer;
|
|
@@ -15970,7 +16059,7 @@ var inputToggleLabel2 = css74`
|
|
|
15970
16059
|
min-height: var(--spacing-md);
|
|
15971
16060
|
position: relative;
|
|
15972
16061
|
`;
|
|
15973
|
-
var toggleInput2 =
|
|
16062
|
+
var toggleInput2 = css75`
|
|
15974
16063
|
appearance: none;
|
|
15975
16064
|
border: 1px solid var(--gray-300);
|
|
15976
16065
|
background: var(--white);
|
|
@@ -16009,7 +16098,7 @@ var toggleInput2 = css74`
|
|
|
16009
16098
|
border-color: var(--gray-300);
|
|
16010
16099
|
}
|
|
16011
16100
|
`;
|
|
16012
|
-
var inlineLabel2 =
|
|
16101
|
+
var inlineLabel2 = css75`
|
|
16013
16102
|
padding-left: var(--spacing-lg);
|
|
16014
16103
|
font-size: var(--fs-sm);
|
|
16015
16104
|
font-weight: var(--fw-regular);
|
|
@@ -16025,7 +16114,7 @@ var inlineLabel2 = css74`
|
|
|
16025
16114
|
}
|
|
16026
16115
|
}
|
|
16027
16116
|
`;
|
|
16028
|
-
var inputMenu =
|
|
16117
|
+
var inputMenu = css75`
|
|
16029
16118
|
background: none;
|
|
16030
16119
|
border: none;
|
|
16031
16120
|
padding: var(--spacing-2xs);
|
|
@@ -16041,11 +16130,11 @@ var inputMenu = css74`
|
|
|
16041
16130
|
background-color: var(--gray-200);
|
|
16042
16131
|
}
|
|
16043
16132
|
`;
|
|
16044
|
-
var textarea2 =
|
|
16133
|
+
var textarea2 = css75`
|
|
16045
16134
|
resize: vertical;
|
|
16046
16135
|
min-height: 2rem;
|
|
16047
16136
|
`;
|
|
16048
|
-
var dataConnectButton =
|
|
16137
|
+
var dataConnectButton = css75`
|
|
16049
16138
|
align-items: center;
|
|
16050
16139
|
appearance: none;
|
|
16051
16140
|
box-sizing: border-box;
|
|
@@ -16080,7 +16169,7 @@ var dataConnectButton = css74`
|
|
|
16080
16169
|
pointer-events: none;
|
|
16081
16170
|
}
|
|
16082
16171
|
`;
|
|
16083
|
-
var linkParameterBtn =
|
|
16172
|
+
var linkParameterBtn = css75`
|
|
16084
16173
|
border-radius: var(--rounded-base);
|
|
16085
16174
|
background: var(--white);
|
|
16086
16175
|
border: none;
|
|
@@ -16089,7 +16178,7 @@ var linkParameterBtn = css74`
|
|
|
16089
16178
|
font-size: var(--fs-sm);
|
|
16090
16179
|
line-height: 1;
|
|
16091
16180
|
`;
|
|
16092
|
-
var linkParameterControls =
|
|
16181
|
+
var linkParameterControls = css75`
|
|
16093
16182
|
position: absolute;
|
|
16094
16183
|
inset: 0 0 0 auto;
|
|
16095
16184
|
padding: 0 var(--spacing-base);
|
|
@@ -16098,7 +16187,7 @@ var linkParameterControls = css74`
|
|
|
16098
16187
|
justify-content: center;
|
|
16099
16188
|
gap: var(--spacing-base);
|
|
16100
16189
|
`;
|
|
16101
|
-
var linkParameterInput = (withExternalLinkIcon) =>
|
|
16190
|
+
var linkParameterInput = (withExternalLinkIcon) => css75`
|
|
16102
16191
|
padding-right: calc(
|
|
16103
16192
|
${withExternalLinkIcon ? "calc(var(--spacing-lg) * 2 + var(--spacing-xs))" : "var(--spacing-xl)"} +
|
|
16104
16193
|
var(--spacing-base)
|
|
@@ -16111,7 +16200,7 @@ var linkParameterInput = (withExternalLinkIcon) => css74`
|
|
|
16111
16200
|
}
|
|
16112
16201
|
}
|
|
16113
16202
|
`;
|
|
16114
|
-
var linkParameterIcon =
|
|
16203
|
+
var linkParameterIcon = css75`
|
|
16115
16204
|
align-items: center;
|
|
16116
16205
|
color: var(--brand-secondary-3);
|
|
16117
16206
|
display: flex;
|
|
@@ -16126,7 +16215,7 @@ var linkParameterIcon = css74`
|
|
|
16126
16215
|
`;
|
|
16127
16216
|
|
|
16128
16217
|
// src/components/ParameterInputs/ParameterDataResource.tsx
|
|
16129
|
-
import { jsx as
|
|
16218
|
+
import { jsx as jsx90, jsxs as jsxs61 } from "@emotion/react/jsx-runtime";
|
|
16130
16219
|
function ParameterDataResource({
|
|
16131
16220
|
label,
|
|
16132
16221
|
labelLeadingIcon,
|
|
@@ -16136,12 +16225,12 @@ function ParameterDataResource({
|
|
|
16136
16225
|
disabled,
|
|
16137
16226
|
children
|
|
16138
16227
|
}) {
|
|
16139
|
-
return /* @__PURE__ */
|
|
16140
|
-
/* @__PURE__ */
|
|
16228
|
+
return /* @__PURE__ */ jsxs61("div", { "data-testid": "parameter-data-connect-button", children: [
|
|
16229
|
+
/* @__PURE__ */ jsxs61("span", { css: labelText2, children: [
|
|
16141
16230
|
labelLeadingIcon ? labelLeadingIcon : null,
|
|
16142
16231
|
label
|
|
16143
16232
|
] }),
|
|
16144
|
-
/* @__PURE__ */
|
|
16233
|
+
/* @__PURE__ */ jsxs61(
|
|
16145
16234
|
"button",
|
|
16146
16235
|
{
|
|
16147
16236
|
type: "button",
|
|
@@ -16150,30 +16239,30 @@ function ParameterDataResource({
|
|
|
16150
16239
|
disabled,
|
|
16151
16240
|
onClick: onConnectDatasource,
|
|
16152
16241
|
children: [
|
|
16153
|
-
/* @__PURE__ */
|
|
16242
|
+
/* @__PURE__ */ jsx90("span", { className: "advance-input-icon", css: [inputIcon2], children: /* @__PURE__ */ jsx90(Icon, { icon: "stack", iconColor: "currentColor", size: "1rem" }) }),
|
|
16154
16243
|
children
|
|
16155
16244
|
]
|
|
16156
16245
|
}
|
|
16157
16246
|
),
|
|
16158
|
-
caption ? /* @__PURE__ */
|
|
16247
|
+
caption ? /* @__PURE__ */ jsx90(Caption, { children: caption }) : null
|
|
16159
16248
|
] });
|
|
16160
16249
|
}
|
|
16161
16250
|
|
|
16162
16251
|
// src/components/ParameterInputs/styles/ParameterDrawerHeader.styles.ts
|
|
16163
|
-
import { css as
|
|
16164
|
-
var ParameterDrawerHeaderContainer =
|
|
16252
|
+
import { css as css76 } from "@emotion/react";
|
|
16253
|
+
var ParameterDrawerHeaderContainer = css76`
|
|
16165
16254
|
align-items: center;
|
|
16166
16255
|
display: flex;
|
|
16167
16256
|
gap: var(--spacing-base);
|
|
16168
16257
|
justify-content: space-between;
|
|
16169
16258
|
margin-bottom: var(--spacing-sm);
|
|
16170
16259
|
`;
|
|
16171
|
-
var ParameterDrawerHeaderTitleGroup =
|
|
16260
|
+
var ParameterDrawerHeaderTitleGroup = css76`
|
|
16172
16261
|
align-items: center;
|
|
16173
16262
|
display: flex;
|
|
16174
16263
|
gap: var(--spacing-sm);
|
|
16175
16264
|
`;
|
|
16176
|
-
var ParameterDrawerHeaderTitle =
|
|
16265
|
+
var ParameterDrawerHeaderTitle = css76`
|
|
16177
16266
|
text-overflow: ellipsis;
|
|
16178
16267
|
white-space: nowrap;
|
|
16179
16268
|
overflow: hidden;
|
|
@@ -16181,12 +16270,12 @@ var ParameterDrawerHeaderTitle = css75`
|
|
|
16181
16270
|
`;
|
|
16182
16271
|
|
|
16183
16272
|
// src/components/ParameterInputs/ParameterDrawerHeader.tsx
|
|
16184
|
-
import { jsx as
|
|
16273
|
+
import { jsx as jsx91, jsxs as jsxs62 } from "@emotion/react/jsx-runtime";
|
|
16185
16274
|
var ParameterDrawerHeader = ({ title, iconBeforeTitle, children }) => {
|
|
16186
|
-
return /* @__PURE__ */
|
|
16187
|
-
/* @__PURE__ */
|
|
16275
|
+
return /* @__PURE__ */ jsxs62("div", { css: ParameterDrawerHeaderContainer, children: [
|
|
16276
|
+
/* @__PURE__ */ jsxs62("header", { css: ParameterDrawerHeaderTitleGroup, children: [
|
|
16188
16277
|
iconBeforeTitle,
|
|
16189
|
-
/* @__PURE__ */
|
|
16278
|
+
/* @__PURE__ */ jsx91(Heading, { level: 3, withMarginBottom: false, css: ParameterDrawerHeaderTitle, title, children: title })
|
|
16190
16279
|
] }),
|
|
16191
16280
|
children
|
|
16192
16281
|
] });
|
|
@@ -16196,8 +16285,8 @@ var ParameterDrawerHeader = ({ title, iconBeforeTitle, children }) => {
|
|
|
16196
16285
|
import { forwardRef as forwardRef10 } from "react";
|
|
16197
16286
|
|
|
16198
16287
|
// src/components/ParameterInputs/styles/ParameterGroup.styles.ts
|
|
16199
|
-
import { css as
|
|
16200
|
-
var fieldsetStyles =
|
|
16288
|
+
import { css as css77 } from "@emotion/react";
|
|
16289
|
+
var fieldsetStyles = css77`
|
|
16201
16290
|
&:disabled,
|
|
16202
16291
|
[readonly] {
|
|
16203
16292
|
pointer-events: none;
|
|
@@ -16208,7 +16297,7 @@ var fieldsetStyles = css76`
|
|
|
16208
16297
|
}
|
|
16209
16298
|
}
|
|
16210
16299
|
`;
|
|
16211
|
-
var fieldsetLegend2 =
|
|
16300
|
+
var fieldsetLegend2 = css77`
|
|
16212
16301
|
display: block;
|
|
16213
16302
|
font-weight: var(--fw-medium);
|
|
16214
16303
|
margin-bottom: var(--spacing-sm);
|
|
@@ -16216,11 +16305,11 @@ var fieldsetLegend2 = css76`
|
|
|
16216
16305
|
`;
|
|
16217
16306
|
|
|
16218
16307
|
// src/components/ParameterInputs/ParameterGroup.tsx
|
|
16219
|
-
import { jsx as
|
|
16308
|
+
import { jsx as jsx92, jsxs as jsxs63 } from "@emotion/react/jsx-runtime";
|
|
16220
16309
|
var ParameterGroup = forwardRef10(
|
|
16221
16310
|
({ legend, isDisabled, children, ...props }, ref) => {
|
|
16222
|
-
return /* @__PURE__ */
|
|
16223
|
-
/* @__PURE__ */
|
|
16311
|
+
return /* @__PURE__ */ jsxs63("fieldset", { css: fieldsetStyles, disabled: isDisabled, ref, ...props, children: [
|
|
16312
|
+
/* @__PURE__ */ jsx92("legend", { css: fieldsetLegend2, children: legend }),
|
|
16224
16313
|
children
|
|
16225
16314
|
] });
|
|
16226
16315
|
}
|
|
@@ -16230,57 +16319,19 @@ var ParameterGroup = forwardRef10(
|
|
|
16230
16319
|
import { forwardRef as forwardRef12, useDeferredValue } from "react";
|
|
16231
16320
|
|
|
16232
16321
|
// src/components/ParameterInputs/ParameterImagePreview.tsx
|
|
16233
|
-
import {
|
|
16322
|
+
import { useState as useState10 } from "react";
|
|
16234
16323
|
import { createPortal as createPortal2 } from "react-dom";
|
|
16235
16324
|
|
|
16236
|
-
// src/utils/url.ts
|
|
16237
|
-
var isValidUrl = (url, options = {}) => {
|
|
16238
|
-
try {
|
|
16239
|
-
new URL(url, options.allowRelative ? "https://defaultbaseurl.com" : void 0);
|
|
16240
|
-
return true;
|
|
16241
|
-
} catch (e) {
|
|
16242
|
-
return false;
|
|
16243
|
-
}
|
|
16244
|
-
};
|
|
16245
|
-
|
|
16246
16325
|
// src/components/ParameterInputs/styles/ParameterImage.styles.ts
|
|
16247
|
-
import { css as
|
|
16248
|
-
var
|
|
16249
|
-
position: relative;
|
|
16250
|
-
display: flex;
|
|
16251
|
-
flex-direction: column;
|
|
16252
|
-
background: var(--gray-50);
|
|
16253
|
-
max-width: 100%;
|
|
16254
|
-
max-height: 100%;
|
|
16255
|
-
`;
|
|
16256
|
-
var imageWrapperLoading = css77`
|
|
16257
|
-
animation: ${skeletonLoading} var(--duration-slow) linear infinite alternate;
|
|
16258
|
-
`;
|
|
16259
|
-
var img = css77`
|
|
16260
|
-
object-fit: contain;
|
|
16261
|
-
max-width: 100%;
|
|
16262
|
-
height: auto;
|
|
16263
|
-
opacity: var(--opacity-0);
|
|
16264
|
-
margin: 0 auto;
|
|
16265
|
-
`;
|
|
16266
|
-
var imgLoading = css77`
|
|
16267
|
-
opacity: 0;
|
|
16268
|
-
`;
|
|
16269
|
-
var imgLoaded = css77`
|
|
16270
|
-
animation: ${fadeIn} var(--duration-slow) var(--timing-ease-out) forwards;
|
|
16271
|
-
opacity: 1;
|
|
16272
|
-
`;
|
|
16273
|
-
var brokenImage = css77`
|
|
16274
|
-
height: 160px;
|
|
16275
|
-
`;
|
|
16276
|
-
var previewWrapper = css77`
|
|
16326
|
+
import { css as css78 } from "@emotion/react";
|
|
16327
|
+
var previewWrapper = css78`
|
|
16277
16328
|
margin-top: var(--spacing-xs);
|
|
16278
16329
|
background: var(--gray-50);
|
|
16279
16330
|
padding: var(--spacing-sm);
|
|
16280
16331
|
border: solid 1px var(--gray-300);
|
|
16281
16332
|
border-radius: var(--rounded-sm);
|
|
16282
16333
|
`;
|
|
16283
|
-
var previewLink =
|
|
16334
|
+
var previewLink = css78`
|
|
16284
16335
|
display: block;
|
|
16285
16336
|
width: 100%;
|
|
16286
16337
|
|
|
@@ -16288,7 +16339,7 @@ var previewLink = css77`
|
|
|
16288
16339
|
max-height: 9rem;
|
|
16289
16340
|
}
|
|
16290
16341
|
`;
|
|
16291
|
-
var previewModalWrapper =
|
|
16342
|
+
var previewModalWrapper = css78`
|
|
16292
16343
|
background: var(--gray-50);
|
|
16293
16344
|
display: flex;
|
|
16294
16345
|
height: 100%;
|
|
@@ -16297,7 +16348,7 @@ var previewModalWrapper = css77`
|
|
|
16297
16348
|
border: solid 1px var(--gray-300);
|
|
16298
16349
|
border-radius: var(--rounded-sm);
|
|
16299
16350
|
`;
|
|
16300
|
-
var previewModalImage =
|
|
16351
|
+
var previewModalImage = css78`
|
|
16301
16352
|
display: flex;
|
|
16302
16353
|
height: 100%;
|
|
16303
16354
|
width: 100%;
|
|
@@ -16309,119 +16360,58 @@ var previewModalImage = css77`
|
|
|
16309
16360
|
`;
|
|
16310
16361
|
|
|
16311
16362
|
// src/components/ParameterInputs/ParameterImagePreview.tsx
|
|
16312
|
-
import { Fragment as
|
|
16363
|
+
import { Fragment as Fragment14, jsx as jsx93, jsxs as jsxs64 } from "@emotion/react/jsx-runtime";
|
|
16313
16364
|
function ParameterImagePreview({ imageSrc }) {
|
|
16314
|
-
const [showModal, setShowModal] =
|
|
16315
|
-
return imageSrc ? /* @__PURE__ */
|
|
16316
|
-
/* @__PURE__ */
|
|
16317
|
-
/* @__PURE__ */
|
|
16365
|
+
const [showModal, setShowModal] = useState10(false);
|
|
16366
|
+
return imageSrc ? /* @__PURE__ */ jsxs64("div", { css: previewWrapper, children: [
|
|
16367
|
+
/* @__PURE__ */ jsx93(PreviewImageModal, { open: showModal, imageSrc, onRequestClose: () => setShowModal(false) }),
|
|
16368
|
+
/* @__PURE__ */ jsx93(
|
|
16318
16369
|
"button",
|
|
16319
16370
|
{
|
|
16320
16371
|
css: previewLink,
|
|
16321
16372
|
onClick: () => {
|
|
16322
16373
|
setShowModal(true);
|
|
16323
16374
|
},
|
|
16324
|
-
children: /* @__PURE__ */
|
|
16375
|
+
children: /* @__PURE__ */ jsx93(Image, { src: imageSrc, "data-testid": "parameter-image-preview" })
|
|
16325
16376
|
}
|
|
16326
16377
|
)
|
|
16327
16378
|
] }) : null;
|
|
16328
16379
|
}
|
|
16329
16380
|
var PreviewImageModal = ({ open, onRequestClose, imageSrc }) => {
|
|
16330
|
-
return open ? /* @__PURE__ */
|
|
16331
|
-
/* @__PURE__ */
|
|
16381
|
+
return open ? /* @__PURE__ */ jsx93(Fragment14, { children: createPortal2(
|
|
16382
|
+
/* @__PURE__ */ jsx93(
|
|
16332
16383
|
Modal,
|
|
16333
16384
|
{
|
|
16334
16385
|
header: "Image Preview",
|
|
16335
16386
|
onRequestClose,
|
|
16336
16387
|
withoutContentPadding: true,
|
|
16337
|
-
buttonGroup: /* @__PURE__ */
|
|
16338
|
-
children: /* @__PURE__ */
|
|
16388
|
+
buttonGroup: /* @__PURE__ */ jsx93(Button, { buttonType: "secondary", onClick: onRequestClose, children: "Ok" }),
|
|
16389
|
+
children: /* @__PURE__ */ jsx93("div", { css: previewModalWrapper, children: /* @__PURE__ */ jsx93(Image, { src: imageSrc, css: previewModalImage, "data-testid": "parameter-image-preview" }) })
|
|
16339
16390
|
}
|
|
16340
16391
|
),
|
|
16341
16392
|
document.body
|
|
16342
16393
|
) }) : null;
|
|
16343
16394
|
};
|
|
16344
|
-
var Image = ({ src, className }) => {
|
|
16345
|
-
const [loading, setLoading] = useState9(false);
|
|
16346
|
-
const [loadErrorText, setLoadErrorText] = useState9("");
|
|
16347
|
-
const errorText = "The text you provided is not a valid URL";
|
|
16348
|
-
const updateImageSrc = useCallback3(() => {
|
|
16349
|
-
let message = "";
|
|
16350
|
-
try {
|
|
16351
|
-
if (src !== "") {
|
|
16352
|
-
const url = String(src).startsWith("//") ? `${location.protocol}${src}` : String(src);
|
|
16353
|
-
if (!isValidUrl(url) || !url.startsWith("https")) {
|
|
16354
|
-
throw Error(errorText);
|
|
16355
|
-
}
|
|
16356
|
-
}
|
|
16357
|
-
message = "";
|
|
16358
|
-
} catch (e) {
|
|
16359
|
-
message = errorText;
|
|
16360
|
-
}
|
|
16361
|
-
setLoadErrorText(message);
|
|
16362
|
-
}, [setLoadErrorText, src]);
|
|
16363
|
-
useEffect9(() => {
|
|
16364
|
-
updateImageSrc();
|
|
16365
|
-
}, [src]);
|
|
16366
|
-
const handleLoadEvent = () => {
|
|
16367
|
-
setLoadErrorText("");
|
|
16368
|
-
if (src) {
|
|
16369
|
-
setLoading(true);
|
|
16370
|
-
}
|
|
16371
|
-
const timer = setTimeout(() => {
|
|
16372
|
-
setLoading(false);
|
|
16373
|
-
}, 1e3);
|
|
16374
|
-
return () => clearTimeout(timer);
|
|
16375
|
-
};
|
|
16376
|
-
const handleErrorEvent = () => {
|
|
16377
|
-
setLoadErrorText("The value you provided is not a valid image URL");
|
|
16378
|
-
};
|
|
16379
|
-
return /* @__PURE__ */ jsxs63(
|
|
16380
|
-
"span",
|
|
16381
|
-
{
|
|
16382
|
-
className,
|
|
16383
|
-
css: [imageWrapper, loading ? imageWrapperLoading : null],
|
|
16384
|
-
children: [
|
|
16385
|
-
src && !loadErrorText ? /* @__PURE__ */ jsx92(
|
|
16386
|
-
"img",
|
|
16387
|
-
{
|
|
16388
|
-
src,
|
|
16389
|
-
css: [img, loading ? imgLoading : imgLoaded],
|
|
16390
|
-
alt: "image preview",
|
|
16391
|
-
onLoad: handleLoadEvent,
|
|
16392
|
-
onError: handleErrorEvent,
|
|
16393
|
-
loading: "lazy",
|
|
16394
|
-
"data-testid": "parameter-image-preview"
|
|
16395
|
-
}
|
|
16396
|
-
) : null,
|
|
16397
|
-
src && loadErrorText ? /* @__PURE__ */ jsxs63(Fragment13, { children: [
|
|
16398
|
-
/* @__PURE__ */ jsx92(ImageBroken, { css: [brokenImage, img, imgLoaded] }),
|
|
16399
|
-
/* @__PURE__ */ jsx92(ErrorMessage, { message: loadErrorText })
|
|
16400
|
-
] }) : null
|
|
16401
|
-
]
|
|
16402
|
-
}
|
|
16403
|
-
);
|
|
16404
|
-
};
|
|
16405
16395
|
|
|
16406
16396
|
// src/components/ParameterInputs/ParameterShell.tsx
|
|
16407
|
-
import { useState as
|
|
16397
|
+
import { useState as useState11 } from "react";
|
|
16408
16398
|
|
|
16409
16399
|
// src/components/ParameterInputs/ParameterLabel.tsx
|
|
16410
|
-
import { jsx as
|
|
16400
|
+
import { jsx as jsx94 } from "@emotion/react/jsx-runtime";
|
|
16411
16401
|
var ParameterLabel = ({ id, asSpan, children, ...props }) => {
|
|
16412
|
-
return !asSpan ? /* @__PURE__ */
|
|
16402
|
+
return !asSpan ? /* @__PURE__ */ jsx94("label", { ...props, htmlFor: id, css: labelText2, children }) : /* @__PURE__ */ jsx94("span", { "aria-labelledby": id, css: labelText2, children });
|
|
16413
16403
|
};
|
|
16414
16404
|
|
|
16415
16405
|
// src/components/ParameterInputs/ParameterMenuButton.tsx
|
|
16416
16406
|
import { forwardRef as forwardRef11 } from "react";
|
|
16417
|
-
import { jsx as
|
|
16407
|
+
import { jsx as jsx95 } from "@emotion/react/jsx-runtime";
|
|
16418
16408
|
var ParameterMenuButton = forwardRef11(
|
|
16419
16409
|
({ label, children }, ref) => {
|
|
16420
|
-
return /* @__PURE__ */
|
|
16410
|
+
return /* @__PURE__ */ jsx95(
|
|
16421
16411
|
Menu,
|
|
16422
16412
|
{
|
|
16423
16413
|
menuLabel: `${label} menu`,
|
|
16424
|
-
menuTrigger: /* @__PURE__ */
|
|
16414
|
+
menuTrigger: /* @__PURE__ */ jsx95(
|
|
16425
16415
|
"button",
|
|
16426
16416
|
{
|
|
16427
16417
|
className: "parameter-menu",
|
|
@@ -16429,7 +16419,7 @@ var ParameterMenuButton = forwardRef11(
|
|
|
16429
16419
|
type: "button",
|
|
16430
16420
|
"aria-label": `${label} options`,
|
|
16431
16421
|
ref,
|
|
16432
|
-
children: /* @__PURE__ */
|
|
16422
|
+
children: /* @__PURE__ */ jsx95(Icon, { icon: "more-alt", iconColor: "currentColor", size: "0.9rem" })
|
|
16433
16423
|
}
|
|
16434
16424
|
),
|
|
16435
16425
|
children
|
|
@@ -16439,8 +16429,8 @@ var ParameterMenuButton = forwardRef11(
|
|
|
16439
16429
|
);
|
|
16440
16430
|
|
|
16441
16431
|
// src/components/ParameterInputs/styles/ParameterShell.styles.ts
|
|
16442
|
-
import { css as
|
|
16443
|
-
var emptyParameterShell =
|
|
16432
|
+
import { css as css79 } from "@emotion/react";
|
|
16433
|
+
var emptyParameterShell = css79`
|
|
16444
16434
|
border-radius: var(--rounded-sm);
|
|
16445
16435
|
background: var(--white);
|
|
16446
16436
|
flex-grow: 1;
|
|
@@ -16448,7 +16438,7 @@ var emptyParameterShell = css78`
|
|
|
16448
16438
|
position: relative;
|
|
16449
16439
|
max-width: 100%;
|
|
16450
16440
|
`;
|
|
16451
|
-
var emptyParameterShellText =
|
|
16441
|
+
var emptyParameterShellText = css79`
|
|
16452
16442
|
background: var(--brand-secondary-6);
|
|
16453
16443
|
border-radius: var(--rounded-sm);
|
|
16454
16444
|
padding: var(--spacing-sm);
|
|
@@ -16456,7 +16446,7 @@ var emptyParameterShellText = css78`
|
|
|
16456
16446
|
font-size: var(--fs-sm);
|
|
16457
16447
|
margin: 0;
|
|
16458
16448
|
`;
|
|
16459
|
-
var overrideMarker =
|
|
16449
|
+
var overrideMarker = css79`
|
|
16460
16450
|
border-radius: var(--rounded-sm);
|
|
16461
16451
|
border: 10px solid var(--gray-300);
|
|
16462
16452
|
border-left-color: transparent;
|
|
@@ -16467,7 +16457,7 @@ var overrideMarker = css78`
|
|
|
16467
16457
|
`;
|
|
16468
16458
|
|
|
16469
16459
|
// src/components/ParameterInputs/ParameterShell.tsx
|
|
16470
|
-
import { jsx as
|
|
16460
|
+
import { jsx as jsx96, jsxs as jsxs65 } from "@emotion/react/jsx-runtime";
|
|
16471
16461
|
var extractParameterProps = (props) => {
|
|
16472
16462
|
const {
|
|
16473
16463
|
id,
|
|
@@ -16525,23 +16515,23 @@ var ParameterShell = ({
|
|
|
16525
16515
|
children,
|
|
16526
16516
|
...props
|
|
16527
16517
|
}) => {
|
|
16528
|
-
const [manualErrorMessage, setManualErrorMessage] =
|
|
16518
|
+
const [manualErrorMessage, setManualErrorMessage] = useState11(void 0);
|
|
16529
16519
|
const setErrorMessage = (message) => setManualErrorMessage(message);
|
|
16530
16520
|
const errorMessaging = errorMessage || manualErrorMessage;
|
|
16531
|
-
return /* @__PURE__ */
|
|
16532
|
-
hiddenLabel || title ? null : /* @__PURE__ */
|
|
16521
|
+
return /* @__PURE__ */ jsxs65("div", { css: inputContainer2, ...props, children: [
|
|
16522
|
+
hiddenLabel || title ? null : /* @__PURE__ */ jsxs65(ParameterLabel, { id, css: labelText2, children: [
|
|
16533
16523
|
labelLeadingIcon != null ? labelLeadingIcon : null,
|
|
16534
16524
|
label,
|
|
16535
16525
|
labelTrailingIcon != null ? labelTrailingIcon : null
|
|
16536
16526
|
] }),
|
|
16537
|
-
!title ? null : /* @__PURE__ */
|
|
16527
|
+
!title ? null : /* @__PURE__ */ jsxs65(ParameterLabel, { id, asSpan: true, children: [
|
|
16538
16528
|
labelLeadingIcon != null ? labelLeadingIcon : null,
|
|
16539
16529
|
title,
|
|
16540
16530
|
labelTrailingIcon != null ? labelTrailingIcon : null
|
|
16541
16531
|
] }),
|
|
16542
|
-
/* @__PURE__ */
|
|
16543
|
-
menuItems ? /* @__PURE__ */
|
|
16544
|
-
/* @__PURE__ */
|
|
16532
|
+
/* @__PURE__ */ jsxs65("div", { css: inputWrapper, children: [
|
|
16533
|
+
menuItems ? /* @__PURE__ */ jsx96(ParameterMenuButton, { label: `${label} menu`, children: menuItems }) : null,
|
|
16534
|
+
/* @__PURE__ */ jsx96(
|
|
16545
16535
|
ParameterShellContext.Provider,
|
|
16546
16536
|
{
|
|
16547
16537
|
value: {
|
|
@@ -16551,31 +16541,31 @@ var ParameterShell = ({
|
|
|
16551
16541
|
errorMessage: errorMessaging,
|
|
16552
16542
|
handleManuallySetErrorMessage: (message) => setErrorMessage(message)
|
|
16553
16543
|
},
|
|
16554
|
-
children: /* @__PURE__ */
|
|
16544
|
+
children: /* @__PURE__ */ jsxs65(ParameterShellPlaceholder, { children: [
|
|
16555
16545
|
children,
|
|
16556
|
-
hasOverriddenValue && onResetOverriddenValue ? /* @__PURE__ */
|
|
16546
|
+
hasOverriddenValue && onResetOverriddenValue ? /* @__PURE__ */ jsx96(ParameterOverrideMarker, { onClick: onResetOverriddenValue }) : null
|
|
16557
16547
|
] })
|
|
16558
16548
|
}
|
|
16559
16549
|
)
|
|
16560
16550
|
] }),
|
|
16561
|
-
caption ? /* @__PURE__ */
|
|
16562
|
-
errorMessaging ? /* @__PURE__ */
|
|
16563
|
-
warningMessage ? /* @__PURE__ */
|
|
16564
|
-
infoMessage ? /* @__PURE__ */
|
|
16551
|
+
caption ? /* @__PURE__ */ jsx96(Caption, { testId: captionTestId, children: caption }) : null,
|
|
16552
|
+
errorMessaging ? /* @__PURE__ */ jsx96(ErrorMessage, { message: errorMessaging, testId: errorTestId }) : null,
|
|
16553
|
+
warningMessage ? /* @__PURE__ */ jsx96(WarningMessage, { message: warningMessage }) : null,
|
|
16554
|
+
infoMessage ? /* @__PURE__ */ jsx96(InfoMessage, { message: infoMessage }) : null
|
|
16565
16555
|
] });
|
|
16566
16556
|
};
|
|
16567
16557
|
var ParameterShellPlaceholder = ({ children }) => {
|
|
16568
|
-
return /* @__PURE__ */
|
|
16558
|
+
return /* @__PURE__ */ jsx96("div", { css: emptyParameterShell, children });
|
|
16569
16559
|
};
|
|
16570
|
-
var ParameterOverrideMarker = (props) => /* @__PURE__ */
|
|
16560
|
+
var ParameterOverrideMarker = (props) => /* @__PURE__ */ jsx96(Tooltip, { title: "The default value has been overridden", children: /* @__PURE__ */ jsx96("button", { type: "button", css: overrideMarker, ...props, children: /* @__PURE__ */ jsx96("span", { hidden: true, children: "reset overridden value to default" }) }) });
|
|
16571
16561
|
|
|
16572
16562
|
// src/components/ParameterInputs/ParameterImage.tsx
|
|
16573
|
-
import { Fragment as
|
|
16563
|
+
import { Fragment as Fragment15, jsx as jsx97, jsxs as jsxs66 } from "@emotion/react/jsx-runtime";
|
|
16574
16564
|
var ParameterImage = forwardRef12(
|
|
16575
16565
|
({ children, ...props }, ref) => {
|
|
16576
16566
|
const { shellProps, innerProps } = extractParameterProps(props);
|
|
16577
|
-
return /* @__PURE__ */
|
|
16578
|
-
/* @__PURE__ */
|
|
16567
|
+
return /* @__PURE__ */ jsxs66(ParameterShell, { "data-test-id": "parameter-image", ...shellProps, children: [
|
|
16568
|
+
/* @__PURE__ */ jsx97(ParameterImageInner, { ref, ...innerProps }),
|
|
16579
16569
|
children
|
|
16580
16570
|
] });
|
|
16581
16571
|
}
|
|
@@ -16584,8 +16574,8 @@ var ParameterImageInner = forwardRef12((props, ref) => {
|
|
|
16584
16574
|
const { value } = props;
|
|
16585
16575
|
const { id, label, hiddenLabel, errorMessage } = useParameterShell();
|
|
16586
16576
|
const deferredValue = useDeferredValue(value);
|
|
16587
|
-
return /* @__PURE__ */
|
|
16588
|
-
/* @__PURE__ */
|
|
16577
|
+
return /* @__PURE__ */ jsxs66(Fragment15, { children: [
|
|
16578
|
+
/* @__PURE__ */ jsx97(
|
|
16589
16579
|
"input",
|
|
16590
16580
|
{
|
|
16591
16581
|
css: input2,
|
|
@@ -16597,21 +16587,21 @@ var ParameterImageInner = forwardRef12((props, ref) => {
|
|
|
16597
16587
|
...props
|
|
16598
16588
|
}
|
|
16599
16589
|
),
|
|
16600
|
-
errorMessage || props.disablePreview ? null : /* @__PURE__ */
|
|
16590
|
+
errorMessage || props.disablePreview ? null : /* @__PURE__ */ jsx97(ParameterImagePreview, { imageSrc: deferredValue })
|
|
16601
16591
|
] });
|
|
16602
16592
|
});
|
|
16603
16593
|
|
|
16604
16594
|
// src/components/ParameterInputs/ParameterInput.tsx
|
|
16605
16595
|
import { forwardRef as forwardRef13 } from "react";
|
|
16606
|
-
import { jsx as
|
|
16596
|
+
import { jsx as jsx98 } from "@emotion/react/jsx-runtime";
|
|
16607
16597
|
var ParameterInput = forwardRef13((props, ref) => {
|
|
16608
16598
|
const { shellProps, innerProps } = extractParameterProps(props);
|
|
16609
|
-
return /* @__PURE__ */
|
|
16599
|
+
return /* @__PURE__ */ jsx98(ParameterShell, { "data-testid": "parameter-input", ...shellProps, children: /* @__PURE__ */ jsx98(ParameterInputInner, { ref, ...innerProps }) });
|
|
16610
16600
|
});
|
|
16611
16601
|
var ParameterInputInner = forwardRef13(
|
|
16612
16602
|
({ ...props }, ref) => {
|
|
16613
16603
|
const { id, label, hiddenLabel } = useParameterShell();
|
|
16614
|
-
return /* @__PURE__ */
|
|
16604
|
+
return /* @__PURE__ */ jsx98(
|
|
16615
16605
|
"input",
|
|
16616
16606
|
{
|
|
16617
16607
|
css: input2,
|
|
@@ -16628,18 +16618,18 @@ var ParameterInputInner = forwardRef13(
|
|
|
16628
16618
|
|
|
16629
16619
|
// src/components/ParameterInputs/ParameterLink.tsx
|
|
16630
16620
|
import { forwardRef as forwardRef14 } from "react";
|
|
16631
|
-
import { jsx as
|
|
16621
|
+
import { jsx as jsx99, jsxs as jsxs67 } from "@emotion/react/jsx-runtime";
|
|
16632
16622
|
var ParameterLink = forwardRef14(
|
|
16633
16623
|
({ disabled, onConnectLink, externalLink, ...props }, ref) => {
|
|
16634
16624
|
const { shellProps, innerProps } = extractParameterProps(props);
|
|
16635
|
-
return /* @__PURE__ */
|
|
16625
|
+
return /* @__PURE__ */ jsx99(
|
|
16636
16626
|
ParameterShell,
|
|
16637
16627
|
{
|
|
16638
16628
|
"data-testid": "link-parameter-editor",
|
|
16639
16629
|
...shellProps,
|
|
16640
16630
|
label: innerProps.value ? shellProps.label : "",
|
|
16641
16631
|
title: !innerProps.value ? shellProps.label : void 0,
|
|
16642
|
-
children: /* @__PURE__ */
|
|
16632
|
+
children: /* @__PURE__ */ jsx99(
|
|
16643
16633
|
ParameterLinkInner,
|
|
16644
16634
|
{
|
|
16645
16635
|
onConnectLink,
|
|
@@ -16656,9 +16646,9 @@ var ParameterLinkInner = forwardRef14(
|
|
|
16656
16646
|
({ externalLink, onConnectLink, disabled, buttonText = "Select link", ...props }, ref) => {
|
|
16657
16647
|
const { id, label, hiddenLabel } = useParameterShell();
|
|
16658
16648
|
if (!props.value)
|
|
16659
|
-
return /* @__PURE__ */
|
|
16660
|
-
return /* @__PURE__ */
|
|
16661
|
-
/* @__PURE__ */
|
|
16649
|
+
return /* @__PURE__ */ jsx99("button", { type: "button", css: dataConnectButton, disabled, onClick: onConnectLink, children: buttonText });
|
|
16650
|
+
return /* @__PURE__ */ jsxs67("div", { css: inputWrapper, children: [
|
|
16651
|
+
/* @__PURE__ */ jsx99(
|
|
16662
16652
|
"input",
|
|
16663
16653
|
{
|
|
16664
16654
|
type: "text",
|
|
@@ -16670,8 +16660,8 @@ var ParameterLinkInner = forwardRef14(
|
|
|
16670
16660
|
...props
|
|
16671
16661
|
}
|
|
16672
16662
|
),
|
|
16673
|
-
/* @__PURE__ */
|
|
16674
|
-
/* @__PURE__ */
|
|
16663
|
+
/* @__PURE__ */ jsxs67("div", { css: linkParameterControls, children: [
|
|
16664
|
+
/* @__PURE__ */ jsx99(
|
|
16675
16665
|
"button",
|
|
16676
16666
|
{
|
|
16677
16667
|
type: "button",
|
|
@@ -16682,7 +16672,7 @@ var ParameterLinkInner = forwardRef14(
|
|
|
16682
16672
|
children: "edit"
|
|
16683
16673
|
}
|
|
16684
16674
|
),
|
|
16685
|
-
externalLink ? /* @__PURE__ */
|
|
16675
|
+
externalLink ? /* @__PURE__ */ jsx99(
|
|
16686
16676
|
"a",
|
|
16687
16677
|
{
|
|
16688
16678
|
href: externalLink,
|
|
@@ -16690,7 +16680,7 @@ var ParameterLinkInner = forwardRef14(
|
|
|
16690
16680
|
title: "Open link in new tab",
|
|
16691
16681
|
target: "_blank",
|
|
16692
16682
|
rel: "noopener noreferrer",
|
|
16693
|
-
children: /* @__PURE__ */
|
|
16683
|
+
children: /* @__PURE__ */ jsx99(Icon, { icon: "arrows-expand-up-right", iconColor: "currentColor", size: "1rem" })
|
|
16694
16684
|
}
|
|
16695
16685
|
) : null
|
|
16696
16686
|
] })
|
|
@@ -16699,7 +16689,7 @@ var ParameterLinkInner = forwardRef14(
|
|
|
16699
16689
|
);
|
|
16700
16690
|
|
|
16701
16691
|
// src/components/ParameterInputs/ParameterNameAndPublicIdInput.tsx
|
|
16702
|
-
import { Fragment as
|
|
16692
|
+
import { Fragment as Fragment16, jsx as jsx100, jsxs as jsxs68 } from "@emotion/react/jsx-runtime";
|
|
16703
16693
|
var ParameterNameAndPublicIdInput = ({
|
|
16704
16694
|
id,
|
|
16705
16695
|
onBlur,
|
|
@@ -16725,8 +16715,8 @@ var ParameterNameAndPublicIdInput = ({
|
|
|
16725
16715
|
navigator.clipboard.writeText(values[publicIdFieldName]);
|
|
16726
16716
|
};
|
|
16727
16717
|
autoFocus == null ? void 0 : autoFocus();
|
|
16728
|
-
return /* @__PURE__ */
|
|
16729
|
-
/* @__PURE__ */
|
|
16718
|
+
return /* @__PURE__ */ jsxs68(Fragment16, { children: [
|
|
16719
|
+
/* @__PURE__ */ jsx100(
|
|
16730
16720
|
ParameterInput,
|
|
16731
16721
|
{
|
|
16732
16722
|
id: nameIdField,
|
|
@@ -16745,7 +16735,7 @@ var ParameterNameAndPublicIdInput = ({
|
|
|
16745
16735
|
value: values[nameIdField]
|
|
16746
16736
|
}
|
|
16747
16737
|
),
|
|
16748
|
-
/* @__PURE__ */
|
|
16738
|
+
/* @__PURE__ */ jsx100(
|
|
16749
16739
|
ParameterInput,
|
|
16750
16740
|
{
|
|
16751
16741
|
id: publicIdFieldName,
|
|
@@ -16759,11 +16749,11 @@ var ParameterNameAndPublicIdInput = ({
|
|
|
16759
16749
|
caption: publicIdCaption,
|
|
16760
16750
|
placeholder: publicIdPlaceholderText,
|
|
16761
16751
|
errorMessage: publicIdError,
|
|
16762
|
-
menuItems: /* @__PURE__ */
|
|
16752
|
+
menuItems: /* @__PURE__ */ jsx100(
|
|
16763
16753
|
MenuItem,
|
|
16764
16754
|
{
|
|
16765
16755
|
disabled: !values[publicIdFieldName],
|
|
16766
|
-
icon: /* @__PURE__ */
|
|
16756
|
+
icon: /* @__PURE__ */ jsx100(Icon, { icon: "path-trim", iconColor: "currentColor" }),
|
|
16767
16757
|
onClick: handleCopyPidFieldValue,
|
|
16768
16758
|
children: "Copy"
|
|
16769
16759
|
}
|
|
@@ -16771,12 +16761,12 @@ var ParameterNameAndPublicIdInput = ({
|
|
|
16771
16761
|
value: values[publicIdFieldName]
|
|
16772
16762
|
}
|
|
16773
16763
|
),
|
|
16774
|
-
(warnOverLength == null ? void 0 : warnOverLength.length) && values[publicIdFieldName].length > warnOverLength.length ? /* @__PURE__ */
|
|
16764
|
+
(warnOverLength == null ? void 0 : warnOverLength.length) && values[publicIdFieldName].length > warnOverLength.length ? /* @__PURE__ */ jsx100(Callout, { type: "caution", children: warnOverLength.message }) : null
|
|
16775
16765
|
] });
|
|
16776
16766
|
};
|
|
16777
16767
|
|
|
16778
16768
|
// src/components/ParameterInputs/ParameterRichText.tsx
|
|
16779
|
-
import { css as
|
|
16769
|
+
import { css as css83 } from "@emotion/react";
|
|
16780
16770
|
import { ListItemNode, ListNode as ListNode2 } from "@lexical/list";
|
|
16781
16771
|
import {
|
|
16782
16772
|
CODE,
|
|
@@ -16928,23 +16918,23 @@ function DisableStylesPlugin() {
|
|
|
16928
16918
|
}
|
|
16929
16919
|
|
|
16930
16920
|
// src/components/ParameterInputs/rich-text/editorStyles.ts
|
|
16931
|
-
import { css as
|
|
16932
|
-
var textBold =
|
|
16921
|
+
import { css as css80 } from "@emotion/css";
|
|
16922
|
+
var textBold = css80`
|
|
16933
16923
|
font-weight: 700;
|
|
16934
16924
|
`;
|
|
16935
|
-
var textItalic =
|
|
16925
|
+
var textItalic = css80`
|
|
16936
16926
|
font-style: italic;
|
|
16937
16927
|
`;
|
|
16938
|
-
var textUnderline =
|
|
16928
|
+
var textUnderline = css80`
|
|
16939
16929
|
text-decoration: underline;
|
|
16940
16930
|
`;
|
|
16941
|
-
var textStrikethrough =
|
|
16931
|
+
var textStrikethrough = css80`
|
|
16942
16932
|
text-decoration: line-through;
|
|
16943
16933
|
`;
|
|
16944
|
-
var textUnderlineStrikethrough =
|
|
16934
|
+
var textUnderlineStrikethrough = css80`
|
|
16945
16935
|
text-decoration: underline line-through;
|
|
16946
16936
|
`;
|
|
16947
|
-
var textCode =
|
|
16937
|
+
var textCode = css80`
|
|
16948
16938
|
background-color: var(--gray-100);
|
|
16949
16939
|
border-radius: var(--rounded-sm);
|
|
16950
16940
|
display: inline-block;
|
|
@@ -16955,68 +16945,68 @@ var textCode = css79`
|
|
|
16955
16945
|
padding-left: var(--spacing-xs);
|
|
16956
16946
|
padding-right: var(--spacing-xs);
|
|
16957
16947
|
`;
|
|
16958
|
-
var textSuperscript =
|
|
16948
|
+
var textSuperscript = css80`
|
|
16959
16949
|
vertical-align: super;
|
|
16960
16950
|
font-size: smaller;
|
|
16961
16951
|
`;
|
|
16962
|
-
var textSubscript =
|
|
16952
|
+
var textSubscript = css80`
|
|
16963
16953
|
vertical-align: sub;
|
|
16964
16954
|
font-size: smaller;
|
|
16965
16955
|
`;
|
|
16966
|
-
var linkElement =
|
|
16956
|
+
var linkElement = css80`
|
|
16967
16957
|
${link}
|
|
16968
16958
|
${linkColorDefault}
|
|
16969
16959
|
text-decoration: underline;
|
|
16970
16960
|
`;
|
|
16971
|
-
var h12 =
|
|
16961
|
+
var h12 = css80`
|
|
16972
16962
|
font-size: clamp(1.35rem, var(--fluid-font-base), 1.7rem);
|
|
16973
16963
|
`;
|
|
16974
|
-
var h22 =
|
|
16964
|
+
var h22 = css80`
|
|
16975
16965
|
font-size: clamp(1.35rem, var(--fluid-font-base), 1.6rem);
|
|
16976
16966
|
`;
|
|
16977
|
-
var h32 =
|
|
16967
|
+
var h32 = css80`
|
|
16978
16968
|
font-size: clamp(1.25rem, var(--fluid-font-base), 1.5rem);
|
|
16979
16969
|
`;
|
|
16980
|
-
var h42 =
|
|
16970
|
+
var h42 = css80`
|
|
16981
16971
|
font-size: clamp(1.15rem, var(--fluid-font-base), 1.25rem);
|
|
16982
16972
|
`;
|
|
16983
|
-
var h52 =
|
|
16973
|
+
var h52 = css80`
|
|
16984
16974
|
font-size: clamp(var(--fs-base), var(--fluid-font-base), 1.15rem);
|
|
16985
16975
|
`;
|
|
16986
|
-
var h62 =
|
|
16976
|
+
var h62 = css80`
|
|
16987
16977
|
font-size: var(--fs-base);
|
|
16988
16978
|
`;
|
|
16989
|
-
var heading1Element =
|
|
16979
|
+
var heading1Element = css80`
|
|
16990
16980
|
${h12}
|
|
16991
16981
|
${commonHeadingAttr(true)}
|
|
16992
16982
|
${commonLineHeight}
|
|
16993
16983
|
`;
|
|
16994
|
-
var heading2Element =
|
|
16984
|
+
var heading2Element = css80`
|
|
16995
16985
|
${h22}
|
|
16996
16986
|
${commonHeadingAttr(true)}
|
|
16997
16987
|
${commonLineHeight}
|
|
16998
16988
|
`;
|
|
16999
|
-
var heading3Element =
|
|
16989
|
+
var heading3Element = css80`
|
|
17000
16990
|
${h32}
|
|
17001
16991
|
${commonHeadingAttr(true)}
|
|
17002
16992
|
${commonLineHeight}
|
|
17003
16993
|
`;
|
|
17004
|
-
var heading4Element =
|
|
16994
|
+
var heading4Element = css80`
|
|
17005
16995
|
${h42}
|
|
17006
16996
|
${commonHeadingAttr(true)}
|
|
17007
16997
|
${commonLineHeight}
|
|
17008
16998
|
`;
|
|
17009
|
-
var heading5Element =
|
|
16999
|
+
var heading5Element = css80`
|
|
17010
17000
|
${h52}
|
|
17011
17001
|
${commonHeadingAttr(true)}
|
|
17012
17002
|
${commonLineHeight}
|
|
17013
17003
|
`;
|
|
17014
|
-
var heading6Element =
|
|
17004
|
+
var heading6Element = css80`
|
|
17015
17005
|
${h62}
|
|
17016
17006
|
${commonHeadingAttr(true)}
|
|
17017
17007
|
${commonLineHeight}
|
|
17018
17008
|
`;
|
|
17019
|
-
var paragraphElement =
|
|
17009
|
+
var paragraphElement = css80`
|
|
17020
17010
|
line-height: 1.5;
|
|
17021
17011
|
margin-bottom: var(--spacing-base);
|
|
17022
17012
|
|
|
@@ -17024,7 +17014,7 @@ var paragraphElement = css79`
|
|
|
17024
17014
|
margin-bottom: 0;
|
|
17025
17015
|
}
|
|
17026
17016
|
`;
|
|
17027
|
-
var orderedListElement =
|
|
17017
|
+
var orderedListElement = css80`
|
|
17028
17018
|
${commonLineHeight}
|
|
17029
17019
|
display: block;
|
|
17030
17020
|
list-style: decimal;
|
|
@@ -17053,7 +17043,7 @@ var orderedListElement = css79`
|
|
|
17053
17043
|
}
|
|
17054
17044
|
}
|
|
17055
17045
|
`;
|
|
17056
|
-
var unorderedListElement =
|
|
17046
|
+
var unorderedListElement = css80`
|
|
17057
17047
|
${commonLineHeight}
|
|
17058
17048
|
display: block;
|
|
17059
17049
|
list-style: disc;
|
|
@@ -17074,13 +17064,13 @@ var unorderedListElement = css79`
|
|
|
17074
17064
|
}
|
|
17075
17065
|
}
|
|
17076
17066
|
`;
|
|
17077
|
-
var listItemElement =
|
|
17067
|
+
var listItemElement = css80`
|
|
17078
17068
|
margin-left: var(--spacing-md);
|
|
17079
17069
|
`;
|
|
17080
|
-
var nestedListItemElement =
|
|
17070
|
+
var nestedListItemElement = css80`
|
|
17081
17071
|
list-style-type: none;
|
|
17082
17072
|
`;
|
|
17083
|
-
var blockquoteElement =
|
|
17073
|
+
var blockquoteElement = css80`
|
|
17084
17074
|
border-left: 0.25rem solid var(--gray-300);
|
|
17085
17075
|
color: var(--gray-600);
|
|
17086
17076
|
margin-bottom: var(--spacing-base);
|
|
@@ -17090,7 +17080,7 @@ var blockquoteElement = css79`
|
|
|
17090
17080
|
margin-bottom: 0;
|
|
17091
17081
|
}
|
|
17092
17082
|
`;
|
|
17093
|
-
var codeElement =
|
|
17083
|
+
var codeElement = css80`
|
|
17094
17084
|
background-color: var(--gray-100);
|
|
17095
17085
|
border-radius: var(--rounded-sm);
|
|
17096
17086
|
display: block;
|
|
@@ -17107,7 +17097,7 @@ var codeElement = css79`
|
|
|
17107
17097
|
`;
|
|
17108
17098
|
|
|
17109
17099
|
// src/components/ParameterInputs/rich-text/LinkNodePlugin.tsx
|
|
17110
|
-
import { css as
|
|
17100
|
+
import { css as css81 } from "@emotion/react";
|
|
17111
17101
|
import { useLexicalComposerContext as useLexicalComposerContext2 } from "@lexical/react/LexicalComposerContext";
|
|
17112
17102
|
import { NodeEventPlugin } from "@lexical/react/LexicalNodeEventPlugin";
|
|
17113
17103
|
import { addClassNamesToElement, isHTMLAnchorElement, mergeRegister as mergeRegister2 } from "@lexical/utils";
|
|
@@ -17123,7 +17113,7 @@ import {
|
|
|
17123
17113
|
ElementNode as ElementNode2,
|
|
17124
17114
|
FOCUS_COMMAND
|
|
17125
17115
|
} from "lexical";
|
|
17126
|
-
import { useCallback as useCallback4, useEffect as useEffect11, useRef as useRef6, useState as
|
|
17116
|
+
import { useCallback as useCallback4, useEffect as useEffect11, useRef as useRef6, useState as useState12 } from "react";
|
|
17127
17117
|
|
|
17128
17118
|
// src/components/ParameterInputs/rich-text/utils.ts
|
|
17129
17119
|
import { $isAtNodeEnd } from "@lexical/selection";
|
|
@@ -17161,7 +17151,7 @@ var getSelectedNode = (selection) => {
|
|
|
17161
17151
|
};
|
|
17162
17152
|
|
|
17163
17153
|
// src/components/ParameterInputs/rich-text/LinkNodePlugin.tsx
|
|
17164
|
-
import { Fragment as
|
|
17154
|
+
import { Fragment as Fragment17, jsx as jsx101, jsxs as jsxs69 } from "@emotion/react/jsx-runtime";
|
|
17165
17155
|
var isProjectMapLinkValue = (value) => {
|
|
17166
17156
|
return (value == null ? void 0 : value.type) === "projectMapNode" && Boolean(
|
|
17167
17157
|
value.nodeId && value.path && value.projectMapId
|
|
@@ -17448,16 +17438,16 @@ var OPEN_LINK_NODE_MODAL_COMMAND = createCommand(
|
|
|
17448
17438
|
);
|
|
17449
17439
|
var LINK_POPOVER_OFFSET_X = 0;
|
|
17450
17440
|
var LINK_POPOVER_OFFSET_Y = 8;
|
|
17451
|
-
var linkPopover =
|
|
17441
|
+
var linkPopover = css81`
|
|
17452
17442
|
position: absolute;
|
|
17453
17443
|
z-index: 5;
|
|
17454
17444
|
`;
|
|
17455
|
-
var linkPopoverContainer =
|
|
17445
|
+
var linkPopoverContainer = css81`
|
|
17456
17446
|
${Popover};
|
|
17457
17447
|
align-items: center;
|
|
17458
17448
|
display: flex;
|
|
17459
17449
|
`;
|
|
17460
|
-
var linkPopoverAnchor =
|
|
17450
|
+
var linkPopoverAnchor = css81`
|
|
17461
17451
|
${link}
|
|
17462
17452
|
${linkColorDefault}
|
|
17463
17453
|
`;
|
|
@@ -17466,10 +17456,10 @@ function LinkNodePlugin({ onConnectLink, getBoundPath }) {
|
|
|
17466
17456
|
return path;
|
|
17467
17457
|
};
|
|
17468
17458
|
const [editor] = useLexicalComposerContext2();
|
|
17469
|
-
const [linkPopoverState, setLinkPopoverState] =
|
|
17459
|
+
const [linkPopoverState, setLinkPopoverState] = useState12();
|
|
17470
17460
|
const linkPopoverElRef = useRef6(null);
|
|
17471
|
-
const [isEditorFocused, setIsEditorFocused] =
|
|
17472
|
-
const [isLinkPopoverFocused, setIsLinkPopoverFocused] =
|
|
17461
|
+
const [isEditorFocused, setIsEditorFocused] = useState12(false);
|
|
17462
|
+
const [isLinkPopoverFocused, setIsLinkPopoverFocused] = useState12(false);
|
|
17473
17463
|
useEffect11(() => {
|
|
17474
17464
|
if (!isEditorFocused && !isLinkPopoverFocused) {
|
|
17475
17465
|
setLinkPopoverState(void 0);
|
|
@@ -17604,8 +17594,8 @@ function LinkNodePlugin({ onConnectLink, getBoundPath }) {
|
|
|
17604
17594
|
});
|
|
17605
17595
|
});
|
|
17606
17596
|
};
|
|
17607
|
-
return /* @__PURE__ */
|
|
17608
|
-
/* @__PURE__ */
|
|
17597
|
+
return /* @__PURE__ */ jsxs69(Fragment17, { children: [
|
|
17598
|
+
/* @__PURE__ */ jsx101(
|
|
17609
17599
|
NodeEventPlugin,
|
|
17610
17600
|
{
|
|
17611
17601
|
nodeType: LinkNode,
|
|
@@ -17615,7 +17605,7 @@ function LinkNodePlugin({ onConnectLink, getBoundPath }) {
|
|
|
17615
17605
|
}
|
|
17616
17606
|
}
|
|
17617
17607
|
),
|
|
17618
|
-
linkPopoverState ? /* @__PURE__ */
|
|
17608
|
+
linkPopoverState ? /* @__PURE__ */ jsx101(
|
|
17619
17609
|
"div",
|
|
17620
17610
|
{
|
|
17621
17611
|
css: linkPopover,
|
|
@@ -17624,8 +17614,8 @@ function LinkNodePlugin({ onConnectLink, getBoundPath }) {
|
|
|
17624
17614
|
top: linkPopoverState.position.y
|
|
17625
17615
|
},
|
|
17626
17616
|
ref: linkPopoverElRef,
|
|
17627
|
-
children: /* @__PURE__ */
|
|
17628
|
-
linkPopoverState.node.__link.type === "projectMapNode" ? linkPopoverState.node.__link.path : /* @__PURE__ */
|
|
17617
|
+
children: /* @__PURE__ */ jsxs69("div", { css: linkPopoverContainer, children: [
|
|
17618
|
+
linkPopoverState.node.__link.type === "projectMapNode" ? linkPopoverState.node.__link.path : /* @__PURE__ */ jsx101(
|
|
17629
17619
|
"a",
|
|
17630
17620
|
{
|
|
17631
17621
|
href: parsePath(
|
|
@@ -17637,7 +17627,7 @@ function LinkNodePlugin({ onConnectLink, getBoundPath }) {
|
|
|
17637
17627
|
children: parsePath(linkPopoverState.node.__link.path)
|
|
17638
17628
|
}
|
|
17639
17629
|
),
|
|
17640
|
-
/* @__PURE__ */
|
|
17630
|
+
/* @__PURE__ */ jsx101(
|
|
17641
17631
|
Button,
|
|
17642
17632
|
{
|
|
17643
17633
|
size: "xs",
|
|
@@ -17645,7 +17635,7 @@ function LinkNodePlugin({ onConnectLink, getBoundPath }) {
|
|
|
17645
17635
|
onEditLinkNode(linkPopoverState.node);
|
|
17646
17636
|
},
|
|
17647
17637
|
buttonType: "ghost",
|
|
17648
|
-
children: /* @__PURE__ */
|
|
17638
|
+
children: /* @__PURE__ */ jsx101(Icon, { icon: "pen", size: "1rem", title: "Edit link" })
|
|
17649
17639
|
}
|
|
17650
17640
|
)
|
|
17651
17641
|
] })
|
|
@@ -17670,7 +17660,7 @@ import {
|
|
|
17670
17660
|
INDENT_CONTENT_COMMAND
|
|
17671
17661
|
} from "lexical";
|
|
17672
17662
|
import { useEffect as useEffect12 } from "react";
|
|
17673
|
-
import { jsx as
|
|
17663
|
+
import { jsx as jsx102 } from "@emotion/react/jsx-runtime";
|
|
17674
17664
|
function isIndentPermitted(maxDepth) {
|
|
17675
17665
|
const selection = $getSelection2();
|
|
17676
17666
|
if (!$isRangeSelection2(selection)) {
|
|
@@ -17700,11 +17690,11 @@ function ListIndentPlugin({ maxDepth }) {
|
|
|
17700
17690
|
COMMAND_PRIORITY_CRITICAL
|
|
17701
17691
|
);
|
|
17702
17692
|
}, [editor, maxDepth]);
|
|
17703
|
-
return /* @__PURE__ */
|
|
17693
|
+
return /* @__PURE__ */ jsx102(TabIndentationPlugin, {});
|
|
17704
17694
|
}
|
|
17705
17695
|
|
|
17706
17696
|
// src/components/ParameterInputs/rich-text/RichTextToolbar.tsx
|
|
17707
|
-
import { css as
|
|
17697
|
+
import { css as css82 } from "@emotion/react";
|
|
17708
17698
|
import { $createCodeNode } from "@lexical/code";
|
|
17709
17699
|
import {
|
|
17710
17700
|
$isListNode as $isListNode2,
|
|
@@ -17726,9 +17716,9 @@ import {
|
|
|
17726
17716
|
FORMAT_TEXT_COMMAND,
|
|
17727
17717
|
SELECTION_CHANGE_COMMAND
|
|
17728
17718
|
} from "lexical";
|
|
17729
|
-
import { useCallback as useCallback5, useEffect as useEffect13, useMemo as useMemo3, useState as
|
|
17730
|
-
import { Fragment as
|
|
17731
|
-
var toolbar =
|
|
17719
|
+
import { useCallback as useCallback5, useEffect as useEffect13, useMemo as useMemo3, useState as useState13 } from "react";
|
|
17720
|
+
import { Fragment as Fragment18, jsx as jsx103, jsxs as jsxs70 } from "@emotion/react/jsx-runtime";
|
|
17721
|
+
var toolbar = css82`
|
|
17732
17722
|
background: var(--gray-50);
|
|
17733
17723
|
border-radius: var(--rounded-base);
|
|
17734
17724
|
display: flex;
|
|
@@ -17740,7 +17730,7 @@ var toolbar = css81`
|
|
|
17740
17730
|
top: calc(var(--spacing-sm) * -2);
|
|
17741
17731
|
z-index: 10;
|
|
17742
17732
|
`;
|
|
17743
|
-
var toolbarGroup =
|
|
17733
|
+
var toolbarGroup = css82`
|
|
17744
17734
|
display: flex;
|
|
17745
17735
|
gap: var(--spacing-xs);
|
|
17746
17736
|
position: relative;
|
|
@@ -17756,7 +17746,7 @@ var toolbarGroup = css81`
|
|
|
17756
17746
|
width: 1px;
|
|
17757
17747
|
}
|
|
17758
17748
|
`;
|
|
17759
|
-
var richTextToolbarButton =
|
|
17749
|
+
var richTextToolbarButton = css82`
|
|
17760
17750
|
align-items: center;
|
|
17761
17751
|
appearance: none;
|
|
17762
17752
|
border: 0;
|
|
@@ -17769,17 +17759,17 @@ var richTextToolbarButton = css81`
|
|
|
17769
17759
|
min-width: 32px;
|
|
17770
17760
|
padding: 0 var(--spacing-sm);
|
|
17771
17761
|
`;
|
|
17772
|
-
var richTextToolbarButtonActive =
|
|
17762
|
+
var richTextToolbarButtonActive = css82`
|
|
17773
17763
|
background: var(--gray-200);
|
|
17774
17764
|
`;
|
|
17775
|
-
var toolbarIcon =
|
|
17765
|
+
var toolbarIcon = css82`
|
|
17776
17766
|
color: inherit;
|
|
17777
17767
|
`;
|
|
17778
|
-
var toolbarChevron =
|
|
17768
|
+
var toolbarChevron = css82`
|
|
17779
17769
|
margin-left: var(--spacing-xs);
|
|
17780
17770
|
`;
|
|
17781
17771
|
var RichTextToolbarIcon = ({ icon }) => {
|
|
17782
|
-
return /* @__PURE__ */
|
|
17772
|
+
return /* @__PURE__ */ jsx103(Icon, { icon, css: toolbarIcon, size: "1rem" });
|
|
17783
17773
|
};
|
|
17784
17774
|
var FORMATS_WITH_ICON = /* @__PURE__ */ new Map([
|
|
17785
17775
|
["bold", "format-bold"],
|
|
@@ -17888,15 +17878,15 @@ var RichTextToolbar = ({ config, customControls }) => {
|
|
|
17888
17878
|
});
|
|
17889
17879
|
});
|
|
17890
17880
|
}, [editor, updateToolbar]);
|
|
17891
|
-
return /* @__PURE__ */
|
|
17892
|
-
/* @__PURE__ */
|
|
17881
|
+
return /* @__PURE__ */ jsxs70("div", { css: toolbar, children: [
|
|
17882
|
+
/* @__PURE__ */ jsxs70(
|
|
17893
17883
|
Menu,
|
|
17894
17884
|
{
|
|
17895
17885
|
menuLabel: "Elements",
|
|
17896
|
-
menuTrigger: /* @__PURE__ */
|
|
17886
|
+
menuTrigger: /* @__PURE__ */ jsxs70("button", { css: richTextToolbarButton, title: "Text styles", children: [
|
|
17897
17887
|
visibleTextualElements.some((element) => element.type === activeElement) ? getLabelForElement(activeElement) : getLabelForElement("paragraph"),
|
|
17898
17888
|
" ",
|
|
17899
|
-
/* @__PURE__ */
|
|
17889
|
+
/* @__PURE__ */ jsx103(Icon, { icon: "chevron-down", css: [toolbarIcon, toolbarChevron], size: "1rem" })
|
|
17900
17890
|
] }),
|
|
17901
17891
|
placement: "bottom-start",
|
|
17902
17892
|
children: [
|
|
@@ -17906,7 +17896,7 @@ var RichTextToolbar = ({ config, customControls }) => {
|
|
|
17906
17896
|
type: "paragraph"
|
|
17907
17897
|
},
|
|
17908
17898
|
...visibleTextualElements
|
|
17909
|
-
].map((element) => /* @__PURE__ */
|
|
17899
|
+
].map((element) => /* @__PURE__ */ jsx103(
|
|
17910
17900
|
MenuItem,
|
|
17911
17901
|
{
|
|
17912
17902
|
onClick: () => {
|
|
@@ -17916,12 +17906,12 @@ var RichTextToolbar = ({ config, customControls }) => {
|
|
|
17916
17906
|
},
|
|
17917
17907
|
element.type
|
|
17918
17908
|
)),
|
|
17919
|
-
visibleTextualElements.length === 0 ? /* @__PURE__ */
|
|
17909
|
+
visibleTextualElements.length === 0 ? /* @__PURE__ */ jsx103(MenuItem, { disabled: true, children: "Alternative text styles are not available" }) : null
|
|
17920
17910
|
]
|
|
17921
17911
|
}
|
|
17922
17912
|
),
|
|
17923
|
-
visibleFormatsWithIcon.length > 0 || visibleFormatsWithoutIcon.length > 0 ? /* @__PURE__ */
|
|
17924
|
-
visibleFormatsWithIcon.map((format) => /* @__PURE__ */
|
|
17913
|
+
visibleFormatsWithIcon.length > 0 || visibleFormatsWithoutIcon.length > 0 ? /* @__PURE__ */ jsxs70("div", { css: toolbarGroup, children: [
|
|
17914
|
+
visibleFormatsWithIcon.map((format) => /* @__PURE__ */ jsx103(Tooltip, { title: format.label, placement: "top", children: /* @__PURE__ */ jsx103(
|
|
17925
17915
|
"button",
|
|
17926
17916
|
{
|
|
17927
17917
|
onClick: () => {
|
|
@@ -17931,16 +17921,16 @@ var RichTextToolbar = ({ config, customControls }) => {
|
|
|
17931
17921
|
richTextToolbarButton,
|
|
17932
17922
|
activeFormats.includes(format.type) ? richTextToolbarButtonActive : null
|
|
17933
17923
|
],
|
|
17934
|
-
children: /* @__PURE__ */
|
|
17924
|
+
children: /* @__PURE__ */ jsx103(RichTextToolbarIcon, { icon: FORMATS_WITH_ICON.get(format.type) })
|
|
17935
17925
|
}
|
|
17936
17926
|
) }, format.type)),
|
|
17937
|
-
visibleFormatsWithoutIcon.length > 0 ? /* @__PURE__ */
|
|
17927
|
+
visibleFormatsWithoutIcon.length > 0 ? /* @__PURE__ */ jsx103(
|
|
17938
17928
|
Menu,
|
|
17939
17929
|
{
|
|
17940
17930
|
menuLabel: "Alternative text styles",
|
|
17941
|
-
menuTrigger: /* @__PURE__ */
|
|
17931
|
+
menuTrigger: /* @__PURE__ */ jsx103("button", { css: richTextToolbarButton, title: "Alternative text styles", children: /* @__PURE__ */ jsx103(Icon, { icon: "more-alt", css: toolbarIcon }) }),
|
|
17942
17932
|
placement: "bottom-start",
|
|
17943
|
-
children: visibleFormatsWithoutIcon.map((format) => /* @__PURE__ */
|
|
17933
|
+
children: visibleFormatsWithoutIcon.map((format) => /* @__PURE__ */ jsx103(
|
|
17944
17934
|
MenuItem,
|
|
17945
17935
|
{
|
|
17946
17936
|
onClick: () => {
|
|
@@ -17953,19 +17943,19 @@ var RichTextToolbar = ({ config, customControls }) => {
|
|
|
17953
17943
|
}
|
|
17954
17944
|
) : null
|
|
17955
17945
|
] }) : null,
|
|
17956
|
-
visibleElementsWithIcons.size > 0 ? /* @__PURE__ */
|
|
17957
|
-
linkElementVisible ? /* @__PURE__ */
|
|
17946
|
+
visibleElementsWithIcons.size > 0 ? /* @__PURE__ */ jsxs70("div", { css: toolbarGroup, children: [
|
|
17947
|
+
linkElementVisible ? /* @__PURE__ */ jsx103(Tooltip, { title: "Link", placement: "top", children: /* @__PURE__ */ jsx103(
|
|
17958
17948
|
"button",
|
|
17959
17949
|
{
|
|
17960
17950
|
onClick: () => {
|
|
17961
17951
|
isLink ? editor.dispatchCommand(REMOVE_LINK_NODE_COMMAND, {}) : editor.dispatchCommand(OPEN_LINK_NODE_MODAL_COMMAND, {});
|
|
17962
17952
|
},
|
|
17963
17953
|
css: [richTextToolbarButton, isLink ? richTextToolbarButtonActive : null],
|
|
17964
|
-
children: /* @__PURE__ */
|
|
17954
|
+
children: /* @__PURE__ */ jsx103(RichTextToolbarIcon, { icon: "link" })
|
|
17965
17955
|
}
|
|
17966
17956
|
) }) : null,
|
|
17967
|
-
visibleLists.size > 0 ? /* @__PURE__ */
|
|
17968
|
-
visibleLists.has("unorderedList") ? /* @__PURE__ */
|
|
17957
|
+
visibleLists.size > 0 ? /* @__PURE__ */ jsxs70(Fragment18, { children: [
|
|
17958
|
+
visibleLists.has("unorderedList") ? /* @__PURE__ */ jsx103(Tooltip, { title: "Bullet List", placement: "top", children: /* @__PURE__ */ jsx103(
|
|
17969
17959
|
"button",
|
|
17970
17960
|
{
|
|
17971
17961
|
onClick: () => {
|
|
@@ -17975,10 +17965,10 @@ var RichTextToolbar = ({ config, customControls }) => {
|
|
|
17975
17965
|
richTextToolbarButton,
|
|
17976
17966
|
activeElement === "unorderedList" ? richTextToolbarButtonActive : null
|
|
17977
17967
|
],
|
|
17978
|
-
children: /* @__PURE__ */
|
|
17968
|
+
children: /* @__PURE__ */ jsx103(RichTextToolbarIcon, { icon: "layout-list" })
|
|
17979
17969
|
}
|
|
17980
17970
|
) }) : null,
|
|
17981
|
-
visibleLists.has("orderedList") ? /* @__PURE__ */
|
|
17971
|
+
visibleLists.has("orderedList") ? /* @__PURE__ */ jsx103(Tooltip, { title: "Ordered List", placement: "top", children: /* @__PURE__ */ jsx103(
|
|
17982
17972
|
"button",
|
|
17983
17973
|
{
|
|
17984
17974
|
onClick: () => {
|
|
@@ -17988,32 +17978,32 @@ var RichTextToolbar = ({ config, customControls }) => {
|
|
|
17988
17978
|
richTextToolbarButton,
|
|
17989
17979
|
activeElement === "orderedList" ? richTextToolbarButtonActive : null
|
|
17990
17980
|
],
|
|
17991
|
-
children: /* @__PURE__ */
|
|
17981
|
+
children: /* @__PURE__ */ jsx103(RichTextToolbarIcon, { icon: "layout-list-numbered" })
|
|
17992
17982
|
}
|
|
17993
17983
|
) }) : null
|
|
17994
17984
|
] }) : null,
|
|
17995
|
-
quoteElementVisible ? /* @__PURE__ */
|
|
17985
|
+
quoteElementVisible ? /* @__PURE__ */ jsx103(Tooltip, { title: "Blockquote", placement: "top", children: /* @__PURE__ */ jsx103(
|
|
17996
17986
|
"button",
|
|
17997
17987
|
{
|
|
17998
17988
|
onClick: () => {
|
|
17999
17989
|
activeElement === "quote" ? onSelectElement("paragraph") : onSelectElement("quote");
|
|
18000
17990
|
},
|
|
18001
17991
|
css: [richTextToolbarButton, activeElement === "quote" ? richTextToolbarButtonActive : null],
|
|
18002
|
-
children: /* @__PURE__ */
|
|
17992
|
+
children: /* @__PURE__ */ jsx103(RichTextToolbarIcon, { icon: "quote" })
|
|
18003
17993
|
}
|
|
18004
17994
|
) }) : null,
|
|
18005
|
-
codeElementVisible ? /* @__PURE__ */
|
|
17995
|
+
codeElementVisible ? /* @__PURE__ */ jsx103(Tooltip, { title: "Code Block", placement: "top", children: /* @__PURE__ */ jsx103(
|
|
18006
17996
|
"button",
|
|
18007
17997
|
{
|
|
18008
17998
|
onClick: () => {
|
|
18009
17999
|
activeElement === "code" ? onSelectElement("paragraph") : onSelectElement("code");
|
|
18010
18000
|
},
|
|
18011
18001
|
css: [richTextToolbarButton, activeElement === "code" ? richTextToolbarButtonActive : null],
|
|
18012
|
-
children: /* @__PURE__ */
|
|
18002
|
+
children: /* @__PURE__ */ jsx103(RichTextToolbarIcon, { icon: "code-slash" })
|
|
18013
18003
|
}
|
|
18014
18004
|
) }) : null
|
|
18015
18005
|
] }) : null,
|
|
18016
|
-
customControls ? /* @__PURE__ */
|
|
18006
|
+
customControls ? /* @__PURE__ */ jsx103("div", { css: toolbarGroup, children: customControls }) : null
|
|
18017
18007
|
] });
|
|
18018
18008
|
};
|
|
18019
18009
|
var RichTextToolbar_default = RichTextToolbar;
|
|
@@ -18037,7 +18027,7 @@ var useRichTextToolbarState = ({ config }) => {
|
|
|
18037
18027
|
const enabledBuiltInFormatsWithoutIcon = enabledBuiltInFormats.filter(
|
|
18038
18028
|
(format) => !FORMATS_WITH_ICON.has(format.type)
|
|
18039
18029
|
);
|
|
18040
|
-
const [activeFormats, setActiveFormats] =
|
|
18030
|
+
const [activeFormats, setActiveFormats] = useState13([]);
|
|
18041
18031
|
const visibleFormatsWithIcon = useMemo3(() => {
|
|
18042
18032
|
const visibleFormats = /* @__PURE__ */ new Set();
|
|
18043
18033
|
activeFormats.filter((type) => FORMATS_WITH_ICON.has(type)).forEach((type) => {
|
|
@@ -18058,7 +18048,7 @@ var useRichTextToolbarState = ({ config }) => {
|
|
|
18058
18048
|
});
|
|
18059
18049
|
return richTextBuiltInFormats.filter((format) => visibleFormats.has(format.type));
|
|
18060
18050
|
}, [activeFormats, enabledBuiltInFormatsWithoutIcon]);
|
|
18061
|
-
const [activeElement, setActiveElement] =
|
|
18051
|
+
const [activeElement, setActiveElement] = useState13("paragraph");
|
|
18062
18052
|
const enabledTextualElements = enabledBuiltInElements.filter(
|
|
18063
18053
|
(element) => TEXTUAL_ELEMENTS.includes(element.type)
|
|
18064
18054
|
);
|
|
@@ -18073,7 +18063,7 @@ var useRichTextToolbarState = ({ config }) => {
|
|
|
18073
18063
|
}
|
|
18074
18064
|
);
|
|
18075
18065
|
}, [activeElement, (_a = config == null ? void 0 : config.elements) == null ? void 0 : _a.builtIn, enabledTextualElements]);
|
|
18076
|
-
const [isLink, setIsLink] =
|
|
18066
|
+
const [isLink, setIsLink] = useState13(false);
|
|
18077
18067
|
const linkElementVisible = useMemo3(() => {
|
|
18078
18068
|
return enabledBuiltInElements.some((element) => element.type === "link") || isLink;
|
|
18079
18069
|
}, [isLink, enabledBuiltInElements]);
|
|
@@ -18127,7 +18117,7 @@ var useRichTextToolbarState = ({ config }) => {
|
|
|
18127
18117
|
};
|
|
18128
18118
|
|
|
18129
18119
|
// src/components/ParameterInputs/ParameterRichText.tsx
|
|
18130
|
-
import { Fragment as
|
|
18120
|
+
import { Fragment as Fragment19, jsx as jsx104, jsxs as jsxs71 } from "@emotion/react/jsx-runtime";
|
|
18131
18121
|
var ParameterRichText = ({
|
|
18132
18122
|
label,
|
|
18133
18123
|
labelLeadingIcon,
|
|
@@ -18152,7 +18142,7 @@ var ParameterRichText = ({
|
|
|
18152
18142
|
variables,
|
|
18153
18143
|
customControls
|
|
18154
18144
|
}) => {
|
|
18155
|
-
return /* @__PURE__ */
|
|
18145
|
+
return /* @__PURE__ */ jsxs71(
|
|
18156
18146
|
ParameterShell,
|
|
18157
18147
|
{
|
|
18158
18148
|
"data-testid": "parameter-input",
|
|
@@ -18166,7 +18156,7 @@ var ParameterRichText = ({
|
|
|
18166
18156
|
captionTestId,
|
|
18167
18157
|
menuItems,
|
|
18168
18158
|
children: [
|
|
18169
|
-
/* @__PURE__ */
|
|
18159
|
+
/* @__PURE__ */ jsx104(
|
|
18170
18160
|
ParameterRichTextInner,
|
|
18171
18161
|
{
|
|
18172
18162
|
value,
|
|
@@ -18184,23 +18174,23 @@ var ParameterRichText = ({
|
|
|
18184
18174
|
children
|
|
18185
18175
|
}
|
|
18186
18176
|
),
|
|
18187
|
-
menuItems ? /* @__PURE__ */
|
|
18177
|
+
menuItems ? /* @__PURE__ */ jsx104(ParameterMenuButton, { label: `${label} menu`, children: /* @__PURE__ */ jsx104(Fragment19, { children: menuItems }) }) : null
|
|
18188
18178
|
]
|
|
18189
18179
|
}
|
|
18190
18180
|
);
|
|
18191
18181
|
};
|
|
18192
|
-
var editorWrapper =
|
|
18182
|
+
var editorWrapper = css83`
|
|
18193
18183
|
display: flex;
|
|
18194
18184
|
flex-flow: column;
|
|
18195
18185
|
flex-grow: 1;
|
|
18196
18186
|
`;
|
|
18197
|
-
var editorContainer =
|
|
18187
|
+
var editorContainer = css83`
|
|
18198
18188
|
display: flex;
|
|
18199
18189
|
flex-flow: column;
|
|
18200
18190
|
flex-grow: 1;
|
|
18201
18191
|
position: relative;
|
|
18202
18192
|
`;
|
|
18203
|
-
var editorPlaceholder =
|
|
18193
|
+
var editorPlaceholder = css83`
|
|
18204
18194
|
color: var(--gray-500);
|
|
18205
18195
|
font-style: italic;
|
|
18206
18196
|
/* 1px is added to make sure caret is clearly visible when field is focused
|
|
@@ -18211,7 +18201,7 @@ var editorPlaceholder = css82`
|
|
|
18211
18201
|
top: var(--spacing-xs);
|
|
18212
18202
|
user-select: none;
|
|
18213
18203
|
`;
|
|
18214
|
-
var editorInput =
|
|
18204
|
+
var editorInput = css83`
|
|
18215
18205
|
background: var(--white);
|
|
18216
18206
|
border: 1px solid var(--white);
|
|
18217
18207
|
border-radius: var(--rounded-sm);
|
|
@@ -18295,8 +18285,8 @@ var ParameterRichTextInner = ({
|
|
|
18295
18285
|
},
|
|
18296
18286
|
editable: !readOnly
|
|
18297
18287
|
};
|
|
18298
|
-
return /* @__PURE__ */
|
|
18299
|
-
/* @__PURE__ */
|
|
18288
|
+
return /* @__PURE__ */ jsxs71(Fragment19, { children: [
|
|
18289
|
+
/* @__PURE__ */ jsx104("div", { css: [editorWrapper], className: editorWrapperClassName, children: /* @__PURE__ */ jsx104(LexicalComposer, { initialConfig: lexicalConfig, children: /* @__PURE__ */ jsx104(
|
|
18300
18290
|
RichText,
|
|
18301
18291
|
{
|
|
18302
18292
|
onChange,
|
|
@@ -18352,20 +18342,20 @@ var RichText = ({
|
|
|
18352
18342
|
removeUpdateListener();
|
|
18353
18343
|
};
|
|
18354
18344
|
}, []);
|
|
18355
|
-
return /* @__PURE__ */
|
|
18356
|
-
readOnly ? null : /* @__PURE__ */
|
|
18357
|
-
/* @__PURE__ */
|
|
18358
|
-
/* @__PURE__ */
|
|
18345
|
+
return /* @__PURE__ */ jsxs71(Fragment19, { children: [
|
|
18346
|
+
readOnly ? null : /* @__PURE__ */ jsx104(RichTextToolbar_default, { config, customControls }),
|
|
18347
|
+
/* @__PURE__ */ jsxs71("div", { css: editorContainer, ref: editorContainerRef, "data-testid": "value-container", children: [
|
|
18348
|
+
/* @__PURE__ */ jsx104(
|
|
18359
18349
|
RichTextPlugin,
|
|
18360
18350
|
{
|
|
18361
|
-
contentEditable: /* @__PURE__ */
|
|
18362
|
-
placeholder: /* @__PURE__ */
|
|
18351
|
+
contentEditable: /* @__PURE__ */ jsx104(ContentEditable, { css: editorInput, className: editorInputClassName }),
|
|
18352
|
+
placeholder: /* @__PURE__ */ jsx104("div", { css: editorPlaceholder, children: readOnly ? "empty" : "start editing..." }),
|
|
18363
18353
|
ErrorBoundary: LexicalErrorBoundary
|
|
18364
18354
|
}
|
|
18365
18355
|
),
|
|
18366
|
-
/* @__PURE__ */
|
|
18367
|
-
readOnly ? null : /* @__PURE__ */
|
|
18368
|
-
/* @__PURE__ */
|
|
18356
|
+
/* @__PURE__ */ jsx104(ListPlugin, {}),
|
|
18357
|
+
readOnly ? null : /* @__PURE__ */ jsx104(HistoryPlugin, {}),
|
|
18358
|
+
/* @__PURE__ */ jsx104(
|
|
18369
18359
|
LinkNodePlugin,
|
|
18370
18360
|
{
|
|
18371
18361
|
onConnectLink: onConnectLink ? onConnectLink : () => Promise.resolve(),
|
|
@@ -18375,27 +18365,27 @@ var RichText = ({
|
|
|
18375
18365
|
} : void 0
|
|
18376
18366
|
}
|
|
18377
18367
|
),
|
|
18378
|
-
/* @__PURE__ */
|
|
18379
|
-
/* @__PURE__ */
|
|
18380
|
-
/* @__PURE__ */
|
|
18381
|
-
/* @__PURE__ */
|
|
18368
|
+
/* @__PURE__ */ jsx104(ListIndentPlugin, { maxDepth: 4 }),
|
|
18369
|
+
/* @__PURE__ */ jsx104(DisableStylesPlugin, {}),
|
|
18370
|
+
/* @__PURE__ */ jsx104(MarkdownShortcutPlugin, { transformers: MARKDOWN_TRANSFORMERS }),
|
|
18371
|
+
/* @__PURE__ */ jsx104(Fragment19, { children })
|
|
18382
18372
|
] })
|
|
18383
18373
|
] });
|
|
18384
18374
|
};
|
|
18385
18375
|
|
|
18386
18376
|
// src/components/ParameterInputs/ParameterSelect.tsx
|
|
18387
18377
|
import { forwardRef as forwardRef15 } from "react";
|
|
18388
|
-
import { jsx as
|
|
18378
|
+
import { jsx as jsx105, jsxs as jsxs72 } from "@emotion/react/jsx-runtime";
|
|
18389
18379
|
var ParameterSelect = forwardRef15(
|
|
18390
18380
|
({ defaultOption, options, ...props }, ref) => {
|
|
18391
18381
|
const { shellProps, innerProps } = extractParameterProps(props);
|
|
18392
|
-
return /* @__PURE__ */
|
|
18382
|
+
return /* @__PURE__ */ jsx105(ParameterShell, { ...shellProps, children: /* @__PURE__ */ jsx105(ParameterSelectInner, { options, defaultOption, ...innerProps, ref }) });
|
|
18393
18383
|
}
|
|
18394
18384
|
);
|
|
18395
18385
|
var ParameterSelectInner = forwardRef15(
|
|
18396
18386
|
({ defaultOption, options, ...props }, ref) => {
|
|
18397
18387
|
const { id, label, hiddenLabel } = useParameterShell();
|
|
18398
|
-
return /* @__PURE__ */
|
|
18388
|
+
return /* @__PURE__ */ jsxs72(
|
|
18399
18389
|
"select",
|
|
18400
18390
|
{
|
|
18401
18391
|
css: [input2, selectInput],
|
|
@@ -18404,10 +18394,10 @@ var ParameterSelectInner = forwardRef15(
|
|
|
18404
18394
|
ref,
|
|
18405
18395
|
...props,
|
|
18406
18396
|
children: [
|
|
18407
|
-
defaultOption ? /* @__PURE__ */
|
|
18397
|
+
defaultOption ? /* @__PURE__ */ jsx105("option", { value: "", children: defaultOption }) : null,
|
|
18408
18398
|
options.map((option) => {
|
|
18409
18399
|
var _a;
|
|
18410
|
-
return /* @__PURE__ */
|
|
18400
|
+
return /* @__PURE__ */ jsx105("option", { value: (_a = option.value) != null ? _a : option.label, children: option.label }, option.label);
|
|
18411
18401
|
})
|
|
18412
18402
|
]
|
|
18413
18403
|
}
|
|
@@ -18417,14 +18407,14 @@ var ParameterSelectInner = forwardRef15(
|
|
|
18417
18407
|
|
|
18418
18408
|
// src/components/ParameterInputs/ParameterTextarea.tsx
|
|
18419
18409
|
import { forwardRef as forwardRef16 } from "react";
|
|
18420
|
-
import { jsx as
|
|
18410
|
+
import { jsx as jsx106 } from "@emotion/react/jsx-runtime";
|
|
18421
18411
|
var ParameterTextarea = forwardRef16((props, ref) => {
|
|
18422
18412
|
const { shellProps, innerProps } = extractParameterProps(props);
|
|
18423
|
-
return /* @__PURE__ */
|
|
18413
|
+
return /* @__PURE__ */ jsx106(ParameterShell, { "data-testid": "parameter-textarea", ...shellProps, children: /* @__PURE__ */ jsx106(ParameterTextareaInner, { ref, ...innerProps }) });
|
|
18424
18414
|
});
|
|
18425
18415
|
var ParameterTextareaInner = forwardRef16(({ ...props }, ref) => {
|
|
18426
18416
|
const { id, label, hiddenLabel } = useParameterShell();
|
|
18427
|
-
return /* @__PURE__ */
|
|
18417
|
+
return /* @__PURE__ */ jsx106(
|
|
18428
18418
|
"textarea",
|
|
18429
18419
|
{
|
|
18430
18420
|
css: [input2, textarea2],
|
|
@@ -18438,44 +18428,44 @@ var ParameterTextareaInner = forwardRef16(({ ...props }, ref) => {
|
|
|
18438
18428
|
|
|
18439
18429
|
// src/components/ParameterInputs/ParameterToggle.tsx
|
|
18440
18430
|
import { forwardRef as forwardRef17 } from "react";
|
|
18441
|
-
import { jsx as
|
|
18431
|
+
import { jsx as jsx107, jsxs as jsxs73 } from "@emotion/react/jsx-runtime";
|
|
18442
18432
|
var ParameterToggle = forwardRef17((props, ref) => {
|
|
18443
18433
|
const { shellProps, innerProps } = extractParameterProps(props);
|
|
18444
|
-
return /* @__PURE__ */
|
|
18434
|
+
return /* @__PURE__ */ jsx107(ParameterShell, { ...shellProps, children: /* @__PURE__ */ jsx107(ParameterToggleInner, { ref, ...innerProps }) });
|
|
18445
18435
|
});
|
|
18446
18436
|
var ParameterToggleInner = forwardRef17(
|
|
18447
18437
|
({ ...props }, ref) => {
|
|
18448
18438
|
const { id, label } = useParameterShell();
|
|
18449
|
-
return /* @__PURE__ */
|
|
18450
|
-
/* @__PURE__ */
|
|
18451
|
-
/* @__PURE__ */
|
|
18439
|
+
return /* @__PURE__ */ jsxs73("label", { css: inputToggleLabel2, children: [
|
|
18440
|
+
/* @__PURE__ */ jsx107("input", { css: toggleInput2, type: props.type, id, ref, ...props }),
|
|
18441
|
+
/* @__PURE__ */ jsx107("span", { css: inlineLabel2, children: label })
|
|
18452
18442
|
] });
|
|
18453
18443
|
}
|
|
18454
18444
|
);
|
|
18455
18445
|
|
|
18456
18446
|
// src/components/ProgressList/ProgressList.tsx
|
|
18457
|
-
import { css as
|
|
18447
|
+
import { css as css85 } from "@emotion/react";
|
|
18458
18448
|
import { CgCheckO as CgCheckO2 } from "@react-icons/all-files/cg/CgCheckO";
|
|
18459
18449
|
import { CgRadioCheck } from "@react-icons/all-files/cg/CgRadioCheck";
|
|
18460
18450
|
import { CgRecord } from "@react-icons/all-files/cg/CgRecord";
|
|
18461
18451
|
import { useMemo as useMemo4 } from "react";
|
|
18462
18452
|
|
|
18463
18453
|
// src/components/ProgressList/styles/ProgressList.styles.ts
|
|
18464
|
-
import { css as
|
|
18465
|
-
var progressListStyles =
|
|
18454
|
+
import { css as css84 } from "@emotion/react";
|
|
18455
|
+
var progressListStyles = css84`
|
|
18466
18456
|
display: flex;
|
|
18467
18457
|
flex-direction: column;
|
|
18468
18458
|
gap: var(--spacing-sm);
|
|
18469
18459
|
list-style-type: none;
|
|
18470
18460
|
`;
|
|
18471
|
-
var progressListItemStyles =
|
|
18461
|
+
var progressListItemStyles = css84`
|
|
18472
18462
|
display: flex;
|
|
18473
18463
|
gap: var(--spacing-base);
|
|
18474
18464
|
align-items: center;
|
|
18475
18465
|
`;
|
|
18476
18466
|
|
|
18477
18467
|
// src/components/ProgressList/ProgressList.tsx
|
|
18478
|
-
import { jsx as
|
|
18468
|
+
import { jsx as jsx108, jsxs as jsxs74 } from "@emotion/react/jsx-runtime";
|
|
18479
18469
|
var ProgressList = ({ inProgressId, items, autoEllipsis, ...htmlProps }) => {
|
|
18480
18470
|
const itemsWithStatus = useMemo4(() => {
|
|
18481
18471
|
const indexOfInProgressItem = items.findIndex(({ id }) => id === inProgressId);
|
|
@@ -18489,8 +18479,8 @@ var ProgressList = ({ inProgressId, items, autoEllipsis, ...htmlProps }) => {
|
|
|
18489
18479
|
return { ...item, status };
|
|
18490
18480
|
});
|
|
18491
18481
|
}, [items, inProgressId]);
|
|
18492
|
-
return /* @__PURE__ */
|
|
18493
|
-
return /* @__PURE__ */
|
|
18482
|
+
return /* @__PURE__ */ jsx108("ol", { css: progressListStyles, ...htmlProps, children: itemsWithStatus.map(({ id, label, status, error, errorLevel }) => {
|
|
18483
|
+
return /* @__PURE__ */ jsx108(
|
|
18494
18484
|
ProgressListItem,
|
|
18495
18485
|
{
|
|
18496
18486
|
status,
|
|
@@ -18523,12 +18513,12 @@ var ProgressListItem = ({
|
|
|
18523
18513
|
}, [status, error]);
|
|
18524
18514
|
const statusStyles = useMemo4(() => {
|
|
18525
18515
|
if (error) {
|
|
18526
|
-
return errorLevel === "caution" ?
|
|
18516
|
+
return errorLevel === "caution" ? css85`
|
|
18527
18517
|
color: rgb(161, 98, 7);
|
|
18528
18518
|
& svg {
|
|
18529
18519
|
color: rgb(250, 204, 21);
|
|
18530
18520
|
}
|
|
18531
|
-
` :
|
|
18521
|
+
` : css85`
|
|
18532
18522
|
color: rgb(185, 28, 28);
|
|
18533
18523
|
& svg {
|
|
18534
18524
|
color: var(--brand-primary-2);
|
|
@@ -18536,35 +18526,35 @@ var ProgressListItem = ({
|
|
|
18536
18526
|
`;
|
|
18537
18527
|
}
|
|
18538
18528
|
const colorPerStatus = {
|
|
18539
|
-
completed:
|
|
18529
|
+
completed: css85`
|
|
18540
18530
|
opacity: 0.75;
|
|
18541
18531
|
`,
|
|
18542
|
-
inProgress:
|
|
18532
|
+
inProgress: css85`
|
|
18543
18533
|
-webkit-text-stroke-width: thin;
|
|
18544
18534
|
`,
|
|
18545
|
-
queued:
|
|
18535
|
+
queued: css85`
|
|
18546
18536
|
opacity: 0.5;
|
|
18547
18537
|
`
|
|
18548
18538
|
};
|
|
18549
18539
|
return colorPerStatus[status];
|
|
18550
18540
|
}, [status, error, errorLevel]);
|
|
18551
|
-
return /* @__PURE__ */
|
|
18552
|
-
/* @__PURE__ */
|
|
18553
|
-
/* @__PURE__ */
|
|
18541
|
+
return /* @__PURE__ */ jsxs74("li", { css: [progressListItemStyles, statusStyles], children: [
|
|
18542
|
+
/* @__PURE__ */ jsx108(Tooltip, { title: error != null ? error : "", children: /* @__PURE__ */ jsx108("div", { children: /* @__PURE__ */ jsx108(Icon, { icon, size: 20, iconColor: "currentColor" }) }) }),
|
|
18543
|
+
/* @__PURE__ */ jsxs74("div", { children: [
|
|
18554
18544
|
children,
|
|
18555
|
-
/* @__PURE__ */
|
|
18545
|
+
/* @__PURE__ */ jsx108("span", { css: { visibility: autoEllipsis && status === "inProgress" && !error ? "visible" : "hidden" }, children: "..." })
|
|
18556
18546
|
] })
|
|
18557
18547
|
] });
|
|
18558
18548
|
};
|
|
18559
18549
|
|
|
18560
18550
|
// src/components/SegmentedControl/SegmentedControl.tsx
|
|
18561
|
-
import { css as
|
|
18551
|
+
import { css as css87 } from "@emotion/react";
|
|
18562
18552
|
import { CgCheck as CgCheck4 } from "@react-icons/all-files/cg/CgCheck";
|
|
18563
18553
|
import { useCallback as useCallback6, useMemo as useMemo5 } from "react";
|
|
18564
18554
|
|
|
18565
18555
|
// src/components/SegmentedControl/SegmentedControl.styles.ts
|
|
18566
|
-
import { css as
|
|
18567
|
-
var segmentedControlStyles =
|
|
18556
|
+
import { css as css86 } from "@emotion/react";
|
|
18557
|
+
var segmentedControlStyles = css86`
|
|
18568
18558
|
--segmented-control-rounded-value: var(--rounded-base);
|
|
18569
18559
|
--segmented-control-border-width: 1px;
|
|
18570
18560
|
--segmented-control-selected-color: var(--brand-secondary-3);
|
|
@@ -18583,14 +18573,14 @@ var segmentedControlStyles = css85`
|
|
|
18583
18573
|
border-radius: calc(var(--segmented-control-rounded-value) + var(--segmented-control-border-width));
|
|
18584
18574
|
font-size: var(--fs-xs);
|
|
18585
18575
|
`;
|
|
18586
|
-
var segmentedControlVerticalStyles =
|
|
18576
|
+
var segmentedControlVerticalStyles = css86`
|
|
18587
18577
|
flex-direction: column;
|
|
18588
18578
|
--segmented-control-first-border-radius: var(--segmented-control-rounded-value)
|
|
18589
18579
|
var(--segmented-control-rounded-value) 0 0;
|
|
18590
18580
|
--segmented-control-last-border-radius: 0 0 var(--segmented-control-rounded-value)
|
|
18591
18581
|
var(--segmented-control-rounded-value);
|
|
18592
18582
|
`;
|
|
18593
|
-
var segmentedControlItemStyles =
|
|
18583
|
+
var segmentedControlItemStyles = css86`
|
|
18594
18584
|
&:first-of-type label {
|
|
18595
18585
|
border-radius: var(--segmented-control-first-border-radius);
|
|
18596
18586
|
}
|
|
@@ -18598,10 +18588,10 @@ var segmentedControlItemStyles = css85`
|
|
|
18598
18588
|
border-radius: var(--segmented-control-last-border-radius);
|
|
18599
18589
|
}
|
|
18600
18590
|
`;
|
|
18601
|
-
var segmentedControlInputStyles =
|
|
18591
|
+
var segmentedControlInputStyles = css86`
|
|
18602
18592
|
${accessibleHidden}
|
|
18603
18593
|
`;
|
|
18604
|
-
var segmentedControlLabelStyles = (checked, disabled) =>
|
|
18594
|
+
var segmentedControlLabelStyles = (checked, disabled) => css86`
|
|
18605
18595
|
position: relative;
|
|
18606
18596
|
display: flex;
|
|
18607
18597
|
align-items: center;
|
|
@@ -18668,23 +18658,23 @@ var segmentedControlLabelStyles = (checked, disabled) => css85`
|
|
|
18668
18658
|
`}
|
|
18669
18659
|
}
|
|
18670
18660
|
`;
|
|
18671
|
-
var segmentedControlLabelIconOnlyStyles =
|
|
18661
|
+
var segmentedControlLabelIconOnlyStyles = css86`
|
|
18672
18662
|
padding-inline: 0.5em;
|
|
18673
18663
|
`;
|
|
18674
|
-
var segmentedControlLabelCheckStyles =
|
|
18664
|
+
var segmentedControlLabelCheckStyles = css86`
|
|
18675
18665
|
opacity: 0.5;
|
|
18676
18666
|
`;
|
|
18677
|
-
var segmentedControlLabelContentStyles =
|
|
18667
|
+
var segmentedControlLabelContentStyles = css86`
|
|
18678
18668
|
display: flex;
|
|
18679
18669
|
align-items: center;
|
|
18680
18670
|
justify-content: center;
|
|
18681
18671
|
gap: var(--spacing-sm);
|
|
18682
18672
|
height: 100%;
|
|
18683
18673
|
`;
|
|
18684
|
-
var segmentedControlLabelTextStyles =
|
|
18674
|
+
var segmentedControlLabelTextStyles = css86``;
|
|
18685
18675
|
|
|
18686
18676
|
// src/components/SegmentedControl/SegmentedControl.tsx
|
|
18687
|
-
import { jsx as
|
|
18677
|
+
import { jsx as jsx109, jsxs as jsxs75 } from "@emotion/react/jsx-runtime";
|
|
18688
18678
|
var SegmentedControl = ({
|
|
18689
18679
|
name,
|
|
18690
18680
|
options,
|
|
@@ -18706,16 +18696,16 @@ var SegmentedControl = ({
|
|
|
18706
18696
|
);
|
|
18707
18697
|
const sizeStyles = useMemo5(() => {
|
|
18708
18698
|
const map = {
|
|
18709
|
-
sm:
|
|
18710
|
-
md:
|
|
18711
|
-
lg:
|
|
18699
|
+
sm: css87({ height: "calc(24px - 2px)", fontSize: "var(--fs-xs)" }),
|
|
18700
|
+
md: css87({ height: "calc(32px - 2px)", fontSize: "var(--fs-sm)" }),
|
|
18701
|
+
lg: css87({ height: "calc(40px - 2px)", fontSize: "var(--fs-base)" })
|
|
18712
18702
|
};
|
|
18713
18703
|
return map[size];
|
|
18714
18704
|
}, [size]);
|
|
18715
18705
|
const isIconOnly = useMemo5(() => {
|
|
18716
18706
|
return options.every((option) => option.icon && !option.label);
|
|
18717
18707
|
}, [options]);
|
|
18718
|
-
return /* @__PURE__ */
|
|
18708
|
+
return /* @__PURE__ */ jsx109(
|
|
18719
18709
|
"div",
|
|
18720
18710
|
{
|
|
18721
18711
|
css: [segmentedControlStyles, orientation === "vertical" ? segmentedControlVerticalStyles : void 0],
|
|
@@ -18723,11 +18713,11 @@ var SegmentedControl = ({
|
|
|
18723
18713
|
children: options.map((option, index) => {
|
|
18724
18714
|
const text = option.label ? option.label : option.icon ? null : String(option.value);
|
|
18725
18715
|
const isDisabled = disabled || option.disabled;
|
|
18726
|
-
return /* @__PURE__ */
|
|
18716
|
+
return /* @__PURE__ */ jsx109(
|
|
18727
18717
|
Tooltip,
|
|
18728
18718
|
{
|
|
18729
18719
|
title: isDisabled || !option.tooltip ? "" : option.tooltip,
|
|
18730
|
-
children: /* @__PURE__ */
|
|
18720
|
+
children: /* @__PURE__ */ jsx109("div", { css: segmentedControlItemStyles, "data-testid": "container-segmented-control", children: /* @__PURE__ */ jsxs75(
|
|
18731
18721
|
"label",
|
|
18732
18722
|
{
|
|
18733
18723
|
css: [
|
|
@@ -18736,7 +18726,7 @@ var SegmentedControl = ({
|
|
|
18736
18726
|
isIconOnly ? segmentedControlLabelIconOnlyStyles : void 0
|
|
18737
18727
|
],
|
|
18738
18728
|
children: [
|
|
18739
|
-
/* @__PURE__ */
|
|
18729
|
+
/* @__PURE__ */ jsx109(
|
|
18740
18730
|
"input",
|
|
18741
18731
|
{
|
|
18742
18732
|
css: segmentedControlInputStyles,
|
|
@@ -18748,10 +18738,10 @@ var SegmentedControl = ({
|
|
|
18748
18738
|
disabled: isDisabled
|
|
18749
18739
|
}
|
|
18750
18740
|
),
|
|
18751
|
-
option.value !== value || noCheckmark ? null : /* @__PURE__ */
|
|
18752
|
-
/* @__PURE__ */
|
|
18753
|
-
!option.icon ? null : /* @__PURE__ */
|
|
18754
|
-
!text ? null : /* @__PURE__ */
|
|
18741
|
+
option.value !== value || noCheckmark ? null : /* @__PURE__ */ jsx109(CgCheck4, { css: segmentedControlLabelCheckStyles, "aria-label": "Selected", size: "1.5em" }),
|
|
18742
|
+
/* @__PURE__ */ jsxs75("span", { css: segmentedControlLabelContentStyles, children: [
|
|
18743
|
+
!option.icon ? null : /* @__PURE__ */ jsx109(Icon, { icon: option.icon, size: "1.5em", iconColor: "currentColor" }),
|
|
18744
|
+
!text ? null : /* @__PURE__ */ jsx109("span", { css: segmentedControlLabelTextStyles, children: text })
|
|
18755
18745
|
] })
|
|
18756
18746
|
]
|
|
18757
18747
|
}
|
|
@@ -18765,18 +18755,18 @@ var SegmentedControl = ({
|
|
|
18765
18755
|
};
|
|
18766
18756
|
|
|
18767
18757
|
// src/components/Skeleton/Skeleton.styles.ts
|
|
18768
|
-
import { css as
|
|
18758
|
+
import { css as css88, keyframes as keyframes4 } from "@emotion/react";
|
|
18769
18759
|
var lightFadingOut = keyframes4`
|
|
18770
18760
|
from { opacity: 0.1; }
|
|
18771
18761
|
to { opacity: 0.025; }
|
|
18772
18762
|
`;
|
|
18773
|
-
var skeletonStyles =
|
|
18763
|
+
var skeletonStyles = css88`
|
|
18774
18764
|
animation: ${lightFadingOut} 1s ease-out infinite alternate;
|
|
18775
18765
|
background-color: var(--gray-900);
|
|
18776
18766
|
`;
|
|
18777
18767
|
|
|
18778
18768
|
// src/components/Skeleton/Skeleton.tsx
|
|
18779
|
-
import { jsx as
|
|
18769
|
+
import { jsx as jsx110 } from "@emotion/react/jsx-runtime";
|
|
18780
18770
|
var Skeleton = ({
|
|
18781
18771
|
width = "100%",
|
|
18782
18772
|
height = "1.25rem",
|
|
@@ -18784,7 +18774,7 @@ var Skeleton = ({
|
|
|
18784
18774
|
circle = false,
|
|
18785
18775
|
children,
|
|
18786
18776
|
...otherProps
|
|
18787
|
-
}) => /* @__PURE__ */
|
|
18777
|
+
}) => /* @__PURE__ */ jsx110(
|
|
18788
18778
|
"div",
|
|
18789
18779
|
{
|
|
18790
18780
|
css: [
|
|
@@ -18807,8 +18797,8 @@ var Skeleton = ({
|
|
|
18807
18797
|
import * as React23 from "react";
|
|
18808
18798
|
|
|
18809
18799
|
// src/components/Switch/Switch.styles.ts
|
|
18810
|
-
import { css as
|
|
18811
|
-
var SwitchInputContainer =
|
|
18800
|
+
import { css as css89 } from "@emotion/react";
|
|
18801
|
+
var SwitchInputContainer = css89`
|
|
18812
18802
|
cursor: pointer;
|
|
18813
18803
|
display: inline-block;
|
|
18814
18804
|
position: relative;
|
|
@@ -18817,7 +18807,7 @@ var SwitchInputContainer = css88`
|
|
|
18817
18807
|
vertical-align: middle;
|
|
18818
18808
|
user-select: none;
|
|
18819
18809
|
`;
|
|
18820
|
-
var SwitchInput =
|
|
18810
|
+
var SwitchInput = css89`
|
|
18821
18811
|
appearance: none;
|
|
18822
18812
|
border-radius: var(--rounded-full);
|
|
18823
18813
|
background-color: var(--white);
|
|
@@ -18855,7 +18845,7 @@ var SwitchInput = css88`
|
|
|
18855
18845
|
cursor: not-allowed;
|
|
18856
18846
|
}
|
|
18857
18847
|
`;
|
|
18858
|
-
var SwitchInputDisabled =
|
|
18848
|
+
var SwitchInputDisabled = css89`
|
|
18859
18849
|
opacity: var(--opacity-50);
|
|
18860
18850
|
cursor: not-allowed;
|
|
18861
18851
|
|
|
@@ -18863,7 +18853,7 @@ var SwitchInputDisabled = css88`
|
|
|
18863
18853
|
cursor: not-allowed;
|
|
18864
18854
|
}
|
|
18865
18855
|
`;
|
|
18866
|
-
var SwitchInputLabel =
|
|
18856
|
+
var SwitchInputLabel = css89`
|
|
18867
18857
|
align-items: center;
|
|
18868
18858
|
color: var(--brand-secondary-1);
|
|
18869
18859
|
display: inline-flex;
|
|
@@ -18885,26 +18875,26 @@ var SwitchInputLabel = css88`
|
|
|
18885
18875
|
top: 0;
|
|
18886
18876
|
}
|
|
18887
18877
|
`;
|
|
18888
|
-
var SwitchText =
|
|
18878
|
+
var SwitchText = css89`
|
|
18889
18879
|
color: var(--gray-500);
|
|
18890
18880
|
font-size: var(--fs-sm);
|
|
18891
18881
|
padding-inline: var(--spacing-2xl) 0;
|
|
18892
18882
|
`;
|
|
18893
18883
|
|
|
18894
18884
|
// src/components/Switch/Switch.tsx
|
|
18895
|
-
import { Fragment as
|
|
18885
|
+
import { Fragment as Fragment20, jsx as jsx111, jsxs as jsxs76 } from "@emotion/react/jsx-runtime";
|
|
18896
18886
|
var Switch = React23.forwardRef(
|
|
18897
18887
|
({ label, infoText, toggleText, children, ...inputProps }, ref) => {
|
|
18898
18888
|
let additionalText = infoText;
|
|
18899
18889
|
if (infoText && toggleText) {
|
|
18900
18890
|
additionalText = inputProps.checked ? toggleText : infoText;
|
|
18901
18891
|
}
|
|
18902
|
-
return /* @__PURE__ */
|
|
18903
|
-
/* @__PURE__ */
|
|
18904
|
-
/* @__PURE__ */
|
|
18905
|
-
/* @__PURE__ */
|
|
18892
|
+
return /* @__PURE__ */ jsxs76(Fragment20, { children: [
|
|
18893
|
+
/* @__PURE__ */ jsxs76("label", { css: [SwitchInputContainer, inputProps.disabled ? SwitchInputDisabled : void 0], children: [
|
|
18894
|
+
/* @__PURE__ */ jsx111("input", { type: "checkbox", css: SwitchInput, ...inputProps, ref }),
|
|
18895
|
+
/* @__PURE__ */ jsx111("span", { css: SwitchInputLabel, children: label })
|
|
18906
18896
|
] }),
|
|
18907
|
-
additionalText ? /* @__PURE__ */
|
|
18897
|
+
additionalText ? /* @__PURE__ */ jsx111("p", { css: SwitchText, children: additionalText }) : null,
|
|
18908
18898
|
children
|
|
18909
18899
|
] });
|
|
18910
18900
|
}
|
|
@@ -18914,8 +18904,8 @@ var Switch = React23.forwardRef(
|
|
|
18914
18904
|
import * as React24 from "react";
|
|
18915
18905
|
|
|
18916
18906
|
// src/components/Table/Table.styles.ts
|
|
18917
|
-
import { css as
|
|
18918
|
-
var table = ({ cellPadding = "var(--spacing-base) var(--spacing-md)" }) =>
|
|
18907
|
+
import { css as css90 } from "@emotion/react";
|
|
18908
|
+
var table = ({ cellPadding = "var(--spacing-base) var(--spacing-md)" }) => css90`
|
|
18919
18909
|
border-bottom: 1px solid var(--gray-400);
|
|
18920
18910
|
border-collapse: collapse;
|
|
18921
18911
|
min-width: 100%;
|
|
@@ -18926,55 +18916,55 @@ var table = ({ cellPadding = "var(--spacing-base) var(--spacing-md)" }) => css89
|
|
|
18926
18916
|
padding: ${cellPadding};
|
|
18927
18917
|
}
|
|
18928
18918
|
`;
|
|
18929
|
-
var tableHead =
|
|
18919
|
+
var tableHead = css90`
|
|
18930
18920
|
background: var(--gray-100);
|
|
18931
18921
|
color: var(--brand-secondary-1);
|
|
18932
18922
|
text-align: left;
|
|
18933
18923
|
`;
|
|
18934
|
-
var tableRow =
|
|
18924
|
+
var tableRow = css90`
|
|
18935
18925
|
border-bottom: 1px solid var(--gray-200);
|
|
18936
18926
|
`;
|
|
18937
|
-
var tableCellHead =
|
|
18927
|
+
var tableCellHead = css90`
|
|
18938
18928
|
font-size: var(--fs-sm);
|
|
18939
18929
|
text-transform: uppercase;
|
|
18940
18930
|
font-weight: var(--fw-bold);
|
|
18941
18931
|
`;
|
|
18942
18932
|
|
|
18943
18933
|
// src/components/Table/Table.tsx
|
|
18944
|
-
import { jsx as
|
|
18934
|
+
import { jsx as jsx112 } from "@emotion/react/jsx-runtime";
|
|
18945
18935
|
var Table = React24.forwardRef(
|
|
18946
18936
|
({ children, cellPadding, ...otherProps }, ref) => {
|
|
18947
|
-
return /* @__PURE__ */
|
|
18937
|
+
return /* @__PURE__ */ jsx112("table", { ref, css: table({ cellPadding }), ...otherProps, children });
|
|
18948
18938
|
}
|
|
18949
18939
|
);
|
|
18950
18940
|
var TableHead = React24.forwardRef(
|
|
18951
18941
|
({ children, ...otherProps }, ref) => {
|
|
18952
|
-
return /* @__PURE__ */
|
|
18942
|
+
return /* @__PURE__ */ jsx112("thead", { ref, css: tableHead, ...otherProps, children });
|
|
18953
18943
|
}
|
|
18954
18944
|
);
|
|
18955
18945
|
var TableBody = React24.forwardRef(
|
|
18956
18946
|
({ children, ...otherProps }, ref) => {
|
|
18957
|
-
return /* @__PURE__ */
|
|
18947
|
+
return /* @__PURE__ */ jsx112("tbody", { ref, ...otherProps, children });
|
|
18958
18948
|
}
|
|
18959
18949
|
);
|
|
18960
18950
|
var TableFoot = React24.forwardRef(
|
|
18961
18951
|
({ children, ...otherProps }, ref) => {
|
|
18962
|
-
return /* @__PURE__ */
|
|
18952
|
+
return /* @__PURE__ */ jsx112("tfoot", { ref, ...otherProps, children });
|
|
18963
18953
|
}
|
|
18964
18954
|
);
|
|
18965
18955
|
var TableRow = React24.forwardRef(
|
|
18966
18956
|
({ children, ...otherProps }, ref) => {
|
|
18967
|
-
return /* @__PURE__ */
|
|
18957
|
+
return /* @__PURE__ */ jsx112("tr", { ref, css: tableRow, ...otherProps, children });
|
|
18968
18958
|
}
|
|
18969
18959
|
);
|
|
18970
18960
|
var TableCellHead = React24.forwardRef(
|
|
18971
18961
|
({ children, ...otherProps }, ref) => {
|
|
18972
|
-
return /* @__PURE__ */
|
|
18962
|
+
return /* @__PURE__ */ jsx112("th", { ref, css: tableCellHead, ...otherProps, children });
|
|
18973
18963
|
}
|
|
18974
18964
|
);
|
|
18975
18965
|
var TableCellData = React24.forwardRef(
|
|
18976
18966
|
({ children, ...otherProps }, ref) => {
|
|
18977
|
-
return /* @__PURE__ */
|
|
18967
|
+
return /* @__PURE__ */ jsx112("td", { ref, ...otherProps, children });
|
|
18978
18968
|
}
|
|
18979
18969
|
);
|
|
18980
18970
|
|
|
@@ -18988,8 +18978,8 @@ import {
|
|
|
18988
18978
|
} from "reakit/Tab";
|
|
18989
18979
|
|
|
18990
18980
|
// src/components/Tabs/Tabs.styles.ts
|
|
18991
|
-
import { css as
|
|
18992
|
-
var tabButtonStyles =
|
|
18981
|
+
import { css as css91 } from "@emotion/react";
|
|
18982
|
+
var tabButtonStyles = css91`
|
|
18993
18983
|
align-items: center;
|
|
18994
18984
|
border: 0;
|
|
18995
18985
|
height: 2.5rem;
|
|
@@ -19006,14 +18996,14 @@ var tabButtonStyles = css90`
|
|
|
19006
18996
|
box-shadow: inset 0 -2px 0 var(--brand-secondary-3);
|
|
19007
18997
|
}
|
|
19008
18998
|
`;
|
|
19009
|
-
var tabButtonGroupStyles =
|
|
18999
|
+
var tabButtonGroupStyles = css91`
|
|
19010
19000
|
display: flex;
|
|
19011
19001
|
gap: var(--spacing-base);
|
|
19012
19002
|
border-bottom: 1px solid var(--gray-300);
|
|
19013
19003
|
`;
|
|
19014
19004
|
|
|
19015
19005
|
// src/components/Tabs/Tabs.tsx
|
|
19016
|
-
import { jsx as
|
|
19006
|
+
import { jsx as jsx113 } from "@emotion/react/jsx-runtime";
|
|
19017
19007
|
var CurrentTabContext = createContext6(null);
|
|
19018
19008
|
var useCurrentTab = () => {
|
|
19019
19009
|
const context = useContext7(CurrentTabContext);
|
|
@@ -19042,24 +19032,24 @@ var Tabs = ({ children, onSelectedIdChange, useHashForState, selectedId, ...prop
|
|
|
19042
19032
|
tab.setSelectedId(selected);
|
|
19043
19033
|
}
|
|
19044
19034
|
}, [selected]);
|
|
19045
|
-
return /* @__PURE__ */
|
|
19035
|
+
return /* @__PURE__ */ jsx113(CurrentTabContext.Provider, { value: tab, children });
|
|
19046
19036
|
};
|
|
19047
19037
|
var TabButtonGroup = ({ children, ...props }) => {
|
|
19048
19038
|
const currentTab = useCurrentTab();
|
|
19049
|
-
return /* @__PURE__ */
|
|
19039
|
+
return /* @__PURE__ */ jsx113(ReakitTabList, { ...props, ...currentTab, css: tabButtonGroupStyles, children });
|
|
19050
19040
|
};
|
|
19051
19041
|
var TabButton = ({ children, id, ...props }) => {
|
|
19052
19042
|
const currentTab = useCurrentTab();
|
|
19053
|
-
return /* @__PURE__ */
|
|
19043
|
+
return /* @__PURE__ */ jsx113(ReakitTab, { type: "button", id, ...currentTab, ...props, css: tabButtonStyles, children });
|
|
19054
19044
|
};
|
|
19055
19045
|
var TabContent = ({ children, ...props }) => {
|
|
19056
19046
|
const currentTab = useCurrentTab();
|
|
19057
|
-
return /* @__PURE__ */
|
|
19047
|
+
return /* @__PURE__ */ jsx113(ReakitTabPanel, { ...props, ...currentTab, children });
|
|
19058
19048
|
};
|
|
19059
19049
|
|
|
19060
19050
|
// src/components/Validation/StatusBullet.styles.ts
|
|
19061
|
-
import { css as
|
|
19062
|
-
var StatusBulletContainer =
|
|
19051
|
+
import { css as css92 } from "@emotion/react";
|
|
19052
|
+
var StatusBulletContainer = css92`
|
|
19063
19053
|
align-items: center;
|
|
19064
19054
|
align-self: center;
|
|
19065
19055
|
color: var(--gray-500);
|
|
@@ -19076,33 +19066,33 @@ var StatusBulletContainer = css91`
|
|
|
19076
19066
|
display: block;
|
|
19077
19067
|
}
|
|
19078
19068
|
`;
|
|
19079
|
-
var StatusBulletBase =
|
|
19069
|
+
var StatusBulletBase = css92`
|
|
19080
19070
|
font-size: var(--fs-sm);
|
|
19081
19071
|
&:before {
|
|
19082
19072
|
width: var(--fs-xs);
|
|
19083
19073
|
height: var(--fs-xs);
|
|
19084
19074
|
}
|
|
19085
19075
|
`;
|
|
19086
|
-
var StatusBulletSmall =
|
|
19076
|
+
var StatusBulletSmall = css92`
|
|
19087
19077
|
font-size: var(--fs-xs);
|
|
19088
19078
|
&:before {
|
|
19089
19079
|
width: var(--fs-xxs);
|
|
19090
19080
|
height: var(--fs-xxs);
|
|
19091
19081
|
}
|
|
19092
19082
|
`;
|
|
19093
|
-
var StatusDraft =
|
|
19083
|
+
var StatusDraft = css92`
|
|
19094
19084
|
&:before {
|
|
19095
19085
|
background: var(--white);
|
|
19096
19086
|
box-shadow: inset 0 0 0 0.125rem var(--primary-action-default);
|
|
19097
19087
|
}
|
|
19098
19088
|
`;
|
|
19099
|
-
var StatusModified =
|
|
19089
|
+
var StatusModified = css92`
|
|
19100
19090
|
&:before {
|
|
19101
19091
|
background: linear-gradient(to right, var(--white) 50%, var(--primary-action-default) 50% 100%);
|
|
19102
19092
|
box-shadow: inset 0 0 0 0.125rem var(--primary-action-default);
|
|
19103
19093
|
}
|
|
19104
19094
|
`;
|
|
19105
|
-
var StatusError =
|
|
19095
|
+
var StatusError = css92`
|
|
19106
19096
|
color: var(--error);
|
|
19107
19097
|
&:before {
|
|
19108
19098
|
/* TODO: replace this with an svg icon */
|
|
@@ -19115,19 +19105,19 @@ var StatusError = css91`
|
|
|
19115
19105
|
);
|
|
19116
19106
|
}
|
|
19117
19107
|
`;
|
|
19118
|
-
var StatusPublished =
|
|
19108
|
+
var StatusPublished = css92`
|
|
19119
19109
|
&:before {
|
|
19120
19110
|
background: var(--primary-action-default);
|
|
19121
19111
|
}
|
|
19122
19112
|
`;
|
|
19123
|
-
var StatusOrphan =
|
|
19113
|
+
var StatusOrphan = css92`
|
|
19124
19114
|
&:before {
|
|
19125
19115
|
background: var(--brand-secondary-5);
|
|
19126
19116
|
}
|
|
19127
19117
|
`;
|
|
19128
19118
|
|
|
19129
19119
|
// src/components/Validation/StatusBullet.tsx
|
|
19130
|
-
import { jsx as
|
|
19120
|
+
import { jsx as jsx114 } from "@emotion/react/jsx-runtime";
|
|
19131
19121
|
var StatusBullet = ({
|
|
19132
19122
|
status,
|
|
19133
19123
|
hideText = false,
|
|
@@ -19145,7 +19135,7 @@ var StatusBullet = ({
|
|
|
19145
19135
|
Previous: StatusDraft
|
|
19146
19136
|
};
|
|
19147
19137
|
const statusSize = size === "base" ? StatusBulletBase : StatusBulletSmall;
|
|
19148
|
-
return /* @__PURE__ */
|
|
19138
|
+
return /* @__PURE__ */ jsx114(
|
|
19149
19139
|
"span",
|
|
19150
19140
|
{
|
|
19151
19141
|
role: "status",
|
|
@@ -19195,6 +19185,7 @@ export {
|
|
|
19195
19185
|
Icon,
|
|
19196
19186
|
IconButton,
|
|
19197
19187
|
IconsProvider,
|
|
19188
|
+
Image,
|
|
19198
19189
|
ImageBroken,
|
|
19199
19190
|
InfoMessage,
|
|
19200
19191
|
InlineAlert,
|
|
@@ -19300,8 +19291,6 @@ export {
|
|
|
19300
19291
|
borderTopIcon,
|
|
19301
19292
|
breakpoints,
|
|
19302
19293
|
button,
|
|
19303
|
-
buttonAccentAltDark,
|
|
19304
|
-
buttonAccentAltDarkOutline,
|
|
19305
19294
|
buttonDestructive,
|
|
19306
19295
|
buttonGhost,
|
|
19307
19296
|
buttonGhostDestructive,
|