@uniformdev/design-system 19.48.1-alpha.8 → 19.49.1
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 +883 -761
- package/dist/index.d.mts +19 -2
- package/dist/index.d.ts +19 -2
- package/dist/index.js +945 -807
- package/package.json +5 -5
package/dist/esm/index.js
CHANGED
|
@@ -13361,9 +13361,61 @@ var getDrawerAttributes = ({
|
|
|
13361
13361
|
return { "data-drawer-id": `${providerId}-${stackId}-${id}`, "data-testid": "container-drawer" };
|
|
13362
13362
|
};
|
|
13363
13363
|
|
|
13364
|
-
// src/components/
|
|
13364
|
+
// src/components/IconButton/IconButton.tsx
|
|
13365
|
+
import { forwardRef as forwardRef4 } from "react";
|
|
13366
|
+
|
|
13367
|
+
// src/components/IconButton/IconButton.styles.ts
|
|
13365
13368
|
import { css as css44 } from "@emotion/react";
|
|
13366
|
-
var
|
|
13369
|
+
var iconButton = css44`
|
|
13370
|
+
border-radius: 50%;
|
|
13371
|
+
padding: var(--spacing-sm);
|
|
13372
|
+
`;
|
|
13373
|
+
|
|
13374
|
+
// src/components/IconButton/IconButton.tsx
|
|
13375
|
+
import { jsx as jsx47 } from "@emotion/react/jsx-runtime";
|
|
13376
|
+
var IconButton = forwardRef4(({ children, ...props }, ref) => {
|
|
13377
|
+
return /* @__PURE__ */ jsx47(Button, { ref, css: iconButton, ...props, children });
|
|
13378
|
+
});
|
|
13379
|
+
IconButton.displayName = "IconButton";
|
|
13380
|
+
|
|
13381
|
+
// src/components/Image/ImageBroken.tsx
|
|
13382
|
+
import { jsx as jsx48, jsxs as jsxs29 } from "@emotion/react/jsx-runtime";
|
|
13383
|
+
var ImageBroken = ({ width, height, ...props }) => {
|
|
13384
|
+
return /* @__PURE__ */ jsxs29(
|
|
13385
|
+
"svg",
|
|
13386
|
+
{
|
|
13387
|
+
role: "img",
|
|
13388
|
+
width: width != null ? width : "214",
|
|
13389
|
+
height: height != null ? height : "214",
|
|
13390
|
+
viewBox: "0 0 214 214",
|
|
13391
|
+
fill: "none",
|
|
13392
|
+
xmlns: "http://www.w3.org/2000/svg",
|
|
13393
|
+
xmlnsXlink: "http://www.w3.org/1999/xlink",
|
|
13394
|
+
"data-testid": "broken-image",
|
|
13395
|
+
...props,
|
|
13396
|
+
children: [
|
|
13397
|
+
/* @__PURE__ */ jsx48("rect", { width: "214", height: "214", fill: "#F9FAFB" }),
|
|
13398
|
+
/* @__PURE__ */ jsx48("rect", { width: "214", height: "214", fill: "url(#pattern0)" }),
|
|
13399
|
+
/* @__PURE__ */ jsxs29("defs", { children: [
|
|
13400
|
+
/* @__PURE__ */ jsx48("pattern", { id: "pattern0", patternContentUnits: "objectBoundingBox", width: "1", height: "1", children: /* @__PURE__ */ jsx48("use", { xlinkHref: "#image0_761_4353", transform: "scale(0.0025)" }) }),
|
|
13401
|
+
/* @__PURE__ */ jsx48(
|
|
13402
|
+
"image",
|
|
13403
|
+
{
|
|
13404
|
+
id: "image0_761_4353",
|
|
13405
|
+
width: "400",
|
|
13406
|
+
height: "400",
|
|
13407
|
+
xlinkHref: "data:image/png;base64,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UfKBgDEBDMtYXFKDgBsBDMtNUfKBgDEBDMtYXFKDgBsBDMtNUfKBgDEBDMtYXFKDgBsBDMtNUfKBgDEBDMtYXFKDgBsBDMtNUfKBgDEBDMtYXFKDgBsBDMtNUfKBgDEBDMtYXFKDgBsBDMtNUfKBgDEBDMtYXFKDgBsBDMtNUfKBgDEBDMtYXFKDgBsBDMtNUfKBgDEBDMtYXFKDgBsBDMtNUfKBgDEBDMtYXFKDgBsBDMtNUfKBgDEBDMtYXFKDgBsBDMtNUfKBgDEBDMtYXFKDgBsBDMtNUfKBgDEBDMtYXFKDgBsBDMtNUfKBgDEBDMtYXFKDgBsBDMtNUfKBgDEBDMtYXFKDgBsBDMtNUfKBgDEBDMtYXFKDgBsBDMtNUfKBgDEBDMtYXFKDgBsBDMtNUfKBgDEBDMtYXFKDgBsBDMtNUfKBgDEBDMtYXFKDgBsBDMtNUfKBgDEBDMtYXFKDgBsBDMtNUfKBgDEBDMtYXFKDgBsBDMtNUfKBgDEBDMtYXFKDgBsBDMtNUfKBgDEBDMtYXFKDgBsBDMtNUfKBgDEBDMtYXFKDgBsBDMtNUfKBgDEBDMtYXFKDgBsBDMtNUfKBgDEBDMtYXFKDgBsBDMtNUfKBgDEBDMtYXFKDgBsBDMtNUfKBgDEBDMtYXFKDgBsBDMtNUfKBgDEBDMtYXFKDgBsBDMtNUfKBgDEBDMtYXFKDgBsBDMtNUfKBgDEBDMtYXFKDgBsBDMtNUfKBgDEBDMtYXFKDgBsBDMtNUfKBgDEBDMtYXFKDgBsBDMtNUfKBgDEBDMtYXFKDgBsBDMtNUfKBgDEBDMtYXFKDgBsBDMtNUfKBgDEBDMtYXFKDgBsBDMtNUfKBgDEBDMtYXFKDgBsBDMtNUfKBgDEBDMtYXFKDgBsBDMtNUfKBgDEBDMtYXFKDgBsBDMtNUfKBgDEBDMtYXFKDgBsBDMtNUfKBgDEBDMtYXFKDgBsBDMtNUfKBgDEBDMtYXFKDgBsBDMtNUfKBgDEBDMtYXFKDgBsBDMtNUfKBgDEBDMtYXFKDgBsBDMtNUfKBgDEBDMtYXFKDgBsBDMtNUfKBgDEBDMtYXFKDgBsBDMtNUfKBgDEBDMtYXFKDgBsBDMtNUfKBgDEBDMtYXFKDgBsBDMtNUfKBgDEBDMtYXFKDgBsBDMtNUfKBgDEBDMtYXFKDgBsBDMtNUfKBgDEBDMtYXFKDgBsBDMtNUfKBgDEBDMtYXFKDgBsBDMtNUfKBgDEBDMtYXFKDgBsBDMtNUfKBgDEBDMtYXFKDgBsBDMtNUfKBgDEBDMtYXFKDgBsBDMtNUfKBgDEBDMtYXFKDgBsBDMtNUfKBgDEBDMtYXFKDgBsBDMtNUfKBgDEBDMtYXFKDgBsBDMtNUfKBgDEBDMtYXFKDgBsBDMtNUfKBgDEBDMtYXFKDgBsBDMtNUfKBgDEBDMtYXFKDgBsBDMtNUfKBgDEBDMtYXFKDgBsBDMtNUfKBgDEBDMtYXFKDgBsBDMtNUfKBgDEBDMtYXFKDgBsBDMtNUfKBgDEBDMtYXFKDgBsBDMtNUfKBgDEBDMtYXFKDgBsBDMtNUfKBgDEBDMtYXFKDgBsBDMtNUfKBgDEBDMtYXFKDgBuB/we75KcVO2CRagAAAABJRU5ErkJggg=="
|
|
13408
|
+
}
|
|
13409
|
+
)
|
|
13410
|
+
] })
|
|
13411
|
+
]
|
|
13412
|
+
}
|
|
13413
|
+
);
|
|
13414
|
+
};
|
|
13415
|
+
|
|
13416
|
+
// src/components/Input/styles/CaptionText.styles.ts
|
|
13417
|
+
import { css as css45 } from "@emotion/react";
|
|
13418
|
+
var CaptionText = (dynamicSize) => css45`
|
|
13367
13419
|
color: var(--gray-500);
|
|
13368
13420
|
display: block;
|
|
13369
13421
|
font-size: ${dynamicSize ? "clamp(var(--fs-xs), 87.5%,var(--fs-sm))" : "var(--fs-sm)"};
|
|
@@ -13372,29 +13424,29 @@ var CaptionText = (dynamicSize) => css44`
|
|
|
13372
13424
|
`;
|
|
13373
13425
|
|
|
13374
13426
|
// src/components/Input/Caption.tsx
|
|
13375
|
-
import { jsx as
|
|
13427
|
+
import { jsx as jsx49 } from "@emotion/react/jsx-runtime";
|
|
13376
13428
|
var Caption = ({ children, testId, dynamicSize = false, ...props }) => {
|
|
13377
|
-
return /* @__PURE__ */
|
|
13429
|
+
return /* @__PURE__ */ jsx49("small", { css: CaptionText(dynamicSize), "data-testid": testId, ...props, children });
|
|
13378
13430
|
};
|
|
13379
13431
|
|
|
13380
13432
|
// src/components/Input/CheckboxWithInfo.tsx
|
|
13381
|
-
import { forwardRef as
|
|
13433
|
+
import { forwardRef as forwardRef5 } from "react";
|
|
13382
13434
|
|
|
13383
13435
|
// src/components/Input/styles/CheckboxWithInfo.styles.ts
|
|
13384
|
-
import { css as
|
|
13385
|
-
var CheckboxWithInfoContainer =
|
|
13436
|
+
import { css as css46 } from "@emotion/react";
|
|
13437
|
+
var CheckboxWithInfoContainer = css46`
|
|
13386
13438
|
align-items: center;
|
|
13387
13439
|
display: flex;
|
|
13388
13440
|
gap: var(--spacing-sm);
|
|
13389
13441
|
`;
|
|
13390
|
-
var CheckboxWithInfoLabel =
|
|
13442
|
+
var CheckboxWithInfoLabel = css46`
|
|
13391
13443
|
align-items: center;
|
|
13392
13444
|
color: var(--gray-500);
|
|
13393
13445
|
display: flex;
|
|
13394
13446
|
font-size: var(--fs-xs);
|
|
13395
13447
|
gap: var(--spacing-sm);
|
|
13396
13448
|
`;
|
|
13397
|
-
var CheckboxWithInfoInput =
|
|
13449
|
+
var CheckboxWithInfoInput = css46`
|
|
13398
13450
|
appearance: none;
|
|
13399
13451
|
border: 1px solid var(--gray-300);
|
|
13400
13452
|
background: var(--white) no-repeat bottom center;
|
|
@@ -13427,7 +13479,7 @@ var CheckboxWithInfoInput = css45`
|
|
|
13427
13479
|
border-color: var(--gray-200);
|
|
13428
13480
|
}
|
|
13429
13481
|
`;
|
|
13430
|
-
var InfoDialogContainer =
|
|
13482
|
+
var InfoDialogContainer = css46`
|
|
13431
13483
|
position: relative;
|
|
13432
13484
|
|
|
13433
13485
|
&:hover {
|
|
@@ -13436,7 +13488,7 @@ var InfoDialogContainer = css45`
|
|
|
13436
13488
|
}
|
|
13437
13489
|
}
|
|
13438
13490
|
`;
|
|
13439
|
-
var InfoDialogMessage =
|
|
13491
|
+
var InfoDialogMessage = css46`
|
|
13440
13492
|
background: var(--white);
|
|
13441
13493
|
box-shadow: var(--shadow-base);
|
|
13442
13494
|
border-radius: var(--rounded-md);
|
|
@@ -13453,21 +13505,21 @@ var InfoDialogMessage = css45`
|
|
|
13453
13505
|
`;
|
|
13454
13506
|
|
|
13455
13507
|
// src/components/Input/CheckboxWithInfo.tsx
|
|
13456
|
-
import { jsx as
|
|
13508
|
+
import { jsx as jsx50, jsxs as jsxs30 } from "@emotion/react/jsx-runtime";
|
|
13457
13509
|
var InfoDialog = ({ message }) => {
|
|
13458
|
-
return /* @__PURE__ */
|
|
13459
|
-
/* @__PURE__ */
|
|
13460
|
-
/* @__PURE__ */
|
|
13510
|
+
return /* @__PURE__ */ jsxs30("div", { "data-testid": "info-dialog", css: InfoDialogContainer, children: [
|
|
13511
|
+
/* @__PURE__ */ jsx50(Icon, { icon: "info", iconColor: "action", size: "0.9rem" }),
|
|
13512
|
+
/* @__PURE__ */ jsx50("div", { role: "paragraph", css: InfoDialogMessage, className: "info-message", children: message })
|
|
13461
13513
|
] });
|
|
13462
13514
|
};
|
|
13463
|
-
var CheckboxWithInfo =
|
|
13515
|
+
var CheckboxWithInfo = forwardRef5(
|
|
13464
13516
|
({ label, name, info, ...props }, ref) => {
|
|
13465
|
-
return /* @__PURE__ */
|
|
13466
|
-
/* @__PURE__ */
|
|
13467
|
-
/* @__PURE__ */
|
|
13468
|
-
/* @__PURE__ */
|
|
13517
|
+
return /* @__PURE__ */ jsxs30("div", { css: CheckboxWithInfoContainer, children: [
|
|
13518
|
+
/* @__PURE__ */ jsxs30("label", { css: CheckboxWithInfoLabel, children: [
|
|
13519
|
+
/* @__PURE__ */ jsx50("input", { type: "checkbox", name, ref, css: CheckboxWithInfoInput, ...props }),
|
|
13520
|
+
/* @__PURE__ */ jsx50("span", { children: label })
|
|
13469
13521
|
] }),
|
|
13470
|
-
info ? /* @__PURE__ */
|
|
13522
|
+
info ? /* @__PURE__ */ jsx50(InfoDialog, { message: info }) : null
|
|
13471
13523
|
] });
|
|
13472
13524
|
}
|
|
13473
13525
|
);
|
|
@@ -13476,8 +13528,8 @@ var CheckboxWithInfo = forwardRef4(
|
|
|
13476
13528
|
import { MdWarning } from "@react-icons/all-files/md/MdWarning";
|
|
13477
13529
|
|
|
13478
13530
|
// src/components/Input/styles/ErrorMessage.styles.ts
|
|
13479
|
-
import { css as
|
|
13480
|
-
var ErrorText =
|
|
13531
|
+
import { css as css47 } from "@emotion/react";
|
|
13532
|
+
var ErrorText = css47`
|
|
13481
13533
|
align-items: center;
|
|
13482
13534
|
color: var(--brand-secondary-5);
|
|
13483
13535
|
display: flex;
|
|
@@ -13485,10 +13537,10 @@ var ErrorText = css46`
|
|
|
13485
13537
|
`;
|
|
13486
13538
|
|
|
13487
13539
|
// src/components/Input/ErrorMessage.tsx
|
|
13488
|
-
import { jsx as
|
|
13540
|
+
import { jsx as jsx51, jsxs as jsxs31 } from "@emotion/react/jsx-runtime";
|
|
13489
13541
|
var ErrorMessage = ({ message, testId, ...otherProps }) => {
|
|
13490
|
-
return message ? /* @__PURE__ */
|
|
13491
|
-
/* @__PURE__ */
|
|
13542
|
+
return message ? /* @__PURE__ */ jsxs31("span", { role: "alert", css: ErrorText, "data-testid": testId, ...otherProps, children: [
|
|
13543
|
+
/* @__PURE__ */ jsx51("span", { children: /* @__PURE__ */ jsx51(Icon, { icon: MdWarning, size: "1rem", iconColor: "currentColor" }) }),
|
|
13492
13544
|
message
|
|
13493
13545
|
] }) : null;
|
|
13494
13546
|
};
|
|
@@ -13497,9 +13549,9 @@ var ErrorMessage = ({ message, testId, ...otherProps }) => {
|
|
|
13497
13549
|
import * as React15 from "react";
|
|
13498
13550
|
|
|
13499
13551
|
// src/components/Input/styles/Fieldset.styles.ts
|
|
13500
|
-
import { css as
|
|
13552
|
+
import { css as css48 } from "@emotion/react";
|
|
13501
13553
|
function fieldsetContainer(invert) {
|
|
13502
|
-
const base =
|
|
13554
|
+
const base = css48`
|
|
13503
13555
|
border-radius: var(--rounded-base);
|
|
13504
13556
|
border: 1px solid var(--gray-300);
|
|
13505
13557
|
|
|
@@ -13511,18 +13563,18 @@ function fieldsetContainer(invert) {
|
|
|
13511
13563
|
}
|
|
13512
13564
|
`;
|
|
13513
13565
|
return invert ? [
|
|
13514
|
-
|
|
13566
|
+
css48`
|
|
13515
13567
|
background: white;
|
|
13516
13568
|
`,
|
|
13517
13569
|
base
|
|
13518
13570
|
] : [
|
|
13519
|
-
|
|
13571
|
+
css48`
|
|
13520
13572
|
background: var(--gray-50);
|
|
13521
13573
|
`,
|
|
13522
13574
|
base
|
|
13523
13575
|
];
|
|
13524
13576
|
}
|
|
13525
|
-
var fieldsetLegend =
|
|
13577
|
+
var fieldsetLegend = css48`
|
|
13526
13578
|
align-items: center;
|
|
13527
13579
|
color: var(--brand-secondary-1);
|
|
13528
13580
|
display: flex;
|
|
@@ -13532,17 +13584,17 @@ var fieldsetLegend = css47`
|
|
|
13532
13584
|
margin-bottom: var(--spacing-base);
|
|
13533
13585
|
float: left; // allows the legend to be inside the fieldset and not sat on the border line
|
|
13534
13586
|
`;
|
|
13535
|
-
var fieldsetBody =
|
|
13587
|
+
var fieldsetBody = css48`
|
|
13536
13588
|
clear: left;
|
|
13537
13589
|
`;
|
|
13538
13590
|
|
|
13539
13591
|
// src/components/Input/Fieldset.tsx
|
|
13540
|
-
import { jsx as
|
|
13592
|
+
import { jsx as jsx52, jsxs as jsxs32 } from "@emotion/react/jsx-runtime";
|
|
13541
13593
|
var Fieldset = React15.forwardRef(
|
|
13542
13594
|
({ legend, disabled, children, invert, ...props }, ref) => {
|
|
13543
|
-
return /* @__PURE__ */
|
|
13595
|
+
return /* @__PURE__ */ jsxs32("fieldset", { css: fieldsetContainer(Boolean(invert)), ref, disabled, ...props, children: [
|
|
13544
13596
|
legend,
|
|
13545
|
-
/* @__PURE__ */
|
|
13597
|
+
/* @__PURE__ */ jsx52("div", { css: fieldsetBody, children })
|
|
13546
13598
|
] });
|
|
13547
13599
|
}
|
|
13548
13600
|
);
|
|
@@ -13551,8 +13603,8 @@ var Fieldset = React15.forwardRef(
|
|
|
13551
13603
|
import { MdInfoOutline } from "@react-icons/all-files/md/MdInfoOutline";
|
|
13552
13604
|
|
|
13553
13605
|
// src/components/Input/styles/InfoMessage.styles.tsx
|
|
13554
|
-
import { css as
|
|
13555
|
-
var InfoText =
|
|
13606
|
+
import { css as css49 } from "@emotion/react";
|
|
13607
|
+
var InfoText = css49`
|
|
13556
13608
|
--info-desc: rgb(29, 78, 216);
|
|
13557
13609
|
--info-icon: rgb(96, 165, 250);
|
|
13558
13610
|
|
|
@@ -13561,15 +13613,15 @@ var InfoText = css48`
|
|
|
13561
13613
|
display: flex;
|
|
13562
13614
|
gap: var(--spacing-sm);
|
|
13563
13615
|
`;
|
|
13564
|
-
var InfoIcon2 =
|
|
13616
|
+
var InfoIcon2 = css49`
|
|
13565
13617
|
color: var(--info-icon);
|
|
13566
13618
|
`;
|
|
13567
13619
|
|
|
13568
13620
|
// src/components/Input/InfoMessage.tsx
|
|
13569
|
-
import { jsx as
|
|
13621
|
+
import { jsx as jsx53, jsxs as jsxs33 } from "@emotion/react/jsx-runtime";
|
|
13570
13622
|
var InfoMessage = ({ message, testId, ...props }) => {
|
|
13571
|
-
return message ? /* @__PURE__ */
|
|
13572
|
-
/* @__PURE__ */
|
|
13623
|
+
return message ? /* @__PURE__ */ jsxs33("span", { role: "status", css: InfoText, "data-testid": testId, ...props, children: [
|
|
13624
|
+
/* @__PURE__ */ jsx53("span", { children: /* @__PURE__ */ jsx53(Icon, { css: InfoIcon2, icon: MdInfoOutline, size: "1rem", iconColor: "currentColor" }) }),
|
|
13573
13625
|
message
|
|
13574
13626
|
] }) : null;
|
|
13575
13627
|
};
|
|
@@ -13578,9 +13630,9 @@ var InfoMessage = ({ message, testId, ...props }) => {
|
|
|
13578
13630
|
import * as React16 from "react";
|
|
13579
13631
|
|
|
13580
13632
|
// src/components/Input/Label.tsx
|
|
13581
|
-
import { jsx as
|
|
13633
|
+
import { jsx as jsx54 } from "@emotion/react/jsx-runtime";
|
|
13582
13634
|
var Label = ({ children, className, testId, ...props }) => {
|
|
13583
|
-
return /* @__PURE__ */
|
|
13635
|
+
return /* @__PURE__ */ jsx54(
|
|
13584
13636
|
"label",
|
|
13585
13637
|
{
|
|
13586
13638
|
css: [labelText, typeof className === "object" ? className : void 0],
|
|
@@ -13596,28 +13648,28 @@ var Label = ({ children, className, testId, ...props }) => {
|
|
|
13596
13648
|
import { MdWarning as MdWarning2 } from "@react-icons/all-files/md/MdWarning";
|
|
13597
13649
|
|
|
13598
13650
|
// src/components/Input/styles/WarningMessage.styles.tsx
|
|
13599
|
-
import { css as
|
|
13600
|
-
var WarningText =
|
|
13651
|
+
import { css as css50 } from "@emotion/react";
|
|
13652
|
+
var WarningText = css50`
|
|
13601
13653
|
align-items: center;
|
|
13602
13654
|
color: var(--alert-text);
|
|
13603
13655
|
display: flex;
|
|
13604
13656
|
gap: var(--spacing-sm);
|
|
13605
13657
|
`;
|
|
13606
|
-
var WarningIcon =
|
|
13658
|
+
var WarningIcon = css50`
|
|
13607
13659
|
color: var(--alert);
|
|
13608
13660
|
`;
|
|
13609
13661
|
|
|
13610
13662
|
// src/components/Input/WarningMessage.tsx
|
|
13611
|
-
import { jsx as
|
|
13663
|
+
import { jsx as jsx55, jsxs as jsxs34 } from "@emotion/react/jsx-runtime";
|
|
13612
13664
|
var WarningMessage = ({ message, testId, ...props }) => {
|
|
13613
|
-
return message ? /* @__PURE__ */
|
|
13614
|
-
/* @__PURE__ */
|
|
13665
|
+
return message ? /* @__PURE__ */ jsxs34("span", { role: "status", css: WarningText, "data-testid": testId, ...props, children: [
|
|
13666
|
+
/* @__PURE__ */ jsx55("span", { children: /* @__PURE__ */ jsx55(Icon, { css: WarningIcon, icon: MdWarning2, size: "1rem", iconColor: "currentColor" }) }),
|
|
13615
13667
|
message
|
|
13616
13668
|
] }) : null;
|
|
13617
13669
|
};
|
|
13618
13670
|
|
|
13619
13671
|
// src/components/Input/Input.tsx
|
|
13620
|
-
import { jsx as
|
|
13672
|
+
import { jsx as jsx56, jsxs as jsxs35 } from "@emotion/react/jsx-runtime";
|
|
13621
13673
|
var Input = React16.forwardRef(
|
|
13622
13674
|
({
|
|
13623
13675
|
label,
|
|
@@ -13637,13 +13689,13 @@ var Input = React16.forwardRef(
|
|
|
13637
13689
|
classNameLabel,
|
|
13638
13690
|
...props
|
|
13639
13691
|
}, ref) => {
|
|
13640
|
-
return /* @__PURE__ */
|
|
13692
|
+
return /* @__PURE__ */ jsxs35(
|
|
13641
13693
|
"div",
|
|
13642
13694
|
{
|
|
13643
13695
|
css: [inputContainer, typeof classNameRoot === "object" ? classNameRoot : void 0],
|
|
13644
13696
|
"data-testid": containerTestId ? containerTestId : "container-input-field",
|
|
13645
13697
|
children: [
|
|
13646
|
-
showLabel ? /* @__PURE__ */
|
|
13698
|
+
showLabel ? /* @__PURE__ */ jsx56(
|
|
13647
13699
|
Label,
|
|
13648
13700
|
{
|
|
13649
13701
|
htmlFor: id,
|
|
@@ -13653,13 +13705,13 @@ var Input = React16.forwardRef(
|
|
|
13653
13705
|
children: label
|
|
13654
13706
|
}
|
|
13655
13707
|
) : null,
|
|
13656
|
-
/* @__PURE__ */
|
|
13708
|
+
/* @__PURE__ */ jsxs35(
|
|
13657
13709
|
"div",
|
|
13658
13710
|
{
|
|
13659
13711
|
css: [inputContainer, typeof classNameContainer === "object" ? classNameContainer : void 0],
|
|
13660
13712
|
className: typeof classNameContainer === "string" ? classNameContainer : "",
|
|
13661
13713
|
children: [
|
|
13662
|
-
/* @__PURE__ */
|
|
13714
|
+
/* @__PURE__ */ jsx56(
|
|
13663
13715
|
"input",
|
|
13664
13716
|
{
|
|
13665
13717
|
id,
|
|
@@ -13675,13 +13727,13 @@ var Input = React16.forwardRef(
|
|
|
13675
13727
|
ref
|
|
13676
13728
|
}
|
|
13677
13729
|
),
|
|
13678
|
-
icon ? /* @__PURE__ */
|
|
13730
|
+
icon ? /* @__PURE__ */ jsx56("div", { css: inputIcon, children: icon }) : null
|
|
13679
13731
|
]
|
|
13680
13732
|
}
|
|
13681
13733
|
),
|
|
13682
|
-
caption ? /* @__PURE__ */
|
|
13683
|
-
errorMessage ? /* @__PURE__ */
|
|
13684
|
-
warningMessage && !errorMessage ? /* @__PURE__ */
|
|
13734
|
+
caption ? /* @__PURE__ */ jsx56(Caption, { testId: captionTestId, children: caption }) : null,
|
|
13735
|
+
errorMessage ? /* @__PURE__ */ jsx56(ErrorMessage, { message: errorMessage, testId: errorTestId }) : null,
|
|
13736
|
+
warningMessage && !errorMessage ? /* @__PURE__ */ jsx56(WarningMessage, { message: warningMessage }) : null
|
|
13685
13737
|
]
|
|
13686
13738
|
}
|
|
13687
13739
|
);
|
|
@@ -13690,10 +13742,10 @@ var Input = React16.forwardRef(
|
|
|
13690
13742
|
|
|
13691
13743
|
// src/components/Input/InputComboBox.tsx
|
|
13692
13744
|
import Select from "react-select";
|
|
13693
|
-
import { jsx as
|
|
13745
|
+
import { jsx as jsx57 } from "@emotion/react/jsx-runtime";
|
|
13694
13746
|
function InputComboBox(props) {
|
|
13695
13747
|
var _a;
|
|
13696
|
-
return /* @__PURE__ */
|
|
13748
|
+
return /* @__PURE__ */ jsx57(
|
|
13697
13749
|
Select,
|
|
13698
13750
|
{
|
|
13699
13751
|
...props,
|
|
@@ -13822,17 +13874,17 @@ function InputComboBox(props) {
|
|
|
13822
13874
|
}
|
|
13823
13875
|
|
|
13824
13876
|
// src/components/Input/InputInlineSelect.tsx
|
|
13825
|
-
import { css as
|
|
13877
|
+
import { css as css52 } from "@emotion/react";
|
|
13826
13878
|
import { CgChevronDown as CgChevronDown2 } from "@react-icons/all-files/cg/CgChevronDown";
|
|
13827
13879
|
import { useRef as useRef4, useState as useState7 } from "react";
|
|
13828
13880
|
|
|
13829
13881
|
// src/components/Input/styles/InputInlineSelect.styles.ts
|
|
13830
|
-
import { css as
|
|
13831
|
-
var inlineSelectContainer =
|
|
13882
|
+
import { css as css51 } from "@emotion/react";
|
|
13883
|
+
var inlineSelectContainer = css51`
|
|
13832
13884
|
margin-inline: auto;
|
|
13833
13885
|
max-width: fit-content;
|
|
13834
13886
|
`;
|
|
13835
|
-
var inlineSelectBtn =
|
|
13887
|
+
var inlineSelectBtn = css51`
|
|
13836
13888
|
align-items: center;
|
|
13837
13889
|
background: var(--brand-secondary-3);
|
|
13838
13890
|
border: 2px solid var(--brand-secondary-3);
|
|
@@ -13856,7 +13908,7 @@ var inlineSelectBtn = css50`
|
|
|
13856
13908
|
outline: 2px solid var(--brand-secondary-1);
|
|
13857
13909
|
}
|
|
13858
13910
|
`;
|
|
13859
|
-
var inlineSelectMenu =
|
|
13911
|
+
var inlineSelectMenu = css51`
|
|
13860
13912
|
background: var(--white);
|
|
13861
13913
|
border: 1px solid var(--brand-secondary-3);
|
|
13862
13914
|
border-top: none;
|
|
@@ -13867,7 +13919,7 @@ var inlineSelectMenu = css50`
|
|
|
13867
13919
|
inset: auto 0;
|
|
13868
13920
|
transform: translateY(-0.2rem);
|
|
13869
13921
|
`;
|
|
13870
|
-
var inlineSelectBtnOptions =
|
|
13922
|
+
var inlineSelectBtnOptions = css51`
|
|
13871
13923
|
cursor: pointer;
|
|
13872
13924
|
display: block;
|
|
13873
13925
|
font-size: var(--fs-sm);
|
|
@@ -13883,7 +13935,7 @@ var inlineSelectBtnOptions = css50`
|
|
|
13883
13935
|
background: var(--gray-50);
|
|
13884
13936
|
}
|
|
13885
13937
|
`;
|
|
13886
|
-
var inlineSelectMenuClosed =
|
|
13938
|
+
var inlineSelectMenuClosed = css51`
|
|
13887
13939
|
position: absolute;
|
|
13888
13940
|
overflow: hidden;
|
|
13889
13941
|
height: 1px;
|
|
@@ -13893,7 +13945,7 @@ var inlineSelectMenuClosed = css50`
|
|
|
13893
13945
|
`;
|
|
13894
13946
|
|
|
13895
13947
|
// src/components/Input/InputInlineSelect.tsx
|
|
13896
|
-
import { jsx as
|
|
13948
|
+
import { jsx as jsx58, jsxs as jsxs36 } from "@emotion/react/jsx-runtime";
|
|
13897
13949
|
var InputInlineSelect = ({
|
|
13898
13950
|
classNameContainer,
|
|
13899
13951
|
options,
|
|
@@ -13907,17 +13959,17 @@ var InputInlineSelect = ({
|
|
|
13907
13959
|
const divRef = useRef4(null);
|
|
13908
13960
|
useOutsideClick(divRef, () => setMenuVisible(false));
|
|
13909
13961
|
const selected = options.find((option) => option.value === value);
|
|
13910
|
-
return /* @__PURE__ */
|
|
13962
|
+
return /* @__PURE__ */ jsxs36(
|
|
13911
13963
|
"div",
|
|
13912
13964
|
{
|
|
13913
13965
|
ref: divRef,
|
|
13914
|
-
css: !classNameContainer ? inlineSelectContainer :
|
|
13966
|
+
css: !classNameContainer ? inlineSelectContainer : css52`
|
|
13915
13967
|
max-width: fit-content;
|
|
13916
13968
|
${typeof classNameContainer === "object" ? classNameContainer : void 0}
|
|
13917
13969
|
`,
|
|
13918
13970
|
className: typeof classNameContainer === "string" ? classNameContainer : "",
|
|
13919
13971
|
children: [
|
|
13920
|
-
/* @__PURE__ */
|
|
13972
|
+
/* @__PURE__ */ jsxs36(
|
|
13921
13973
|
"button",
|
|
13922
13974
|
{
|
|
13923
13975
|
type: "button",
|
|
@@ -13931,18 +13983,18 @@ var InputInlineSelect = ({
|
|
|
13931
13983
|
disabled,
|
|
13932
13984
|
...props,
|
|
13933
13985
|
children: [
|
|
13934
|
-
/* @__PURE__ */
|
|
13935
|
-
disabled ? null : /* @__PURE__ */
|
|
13986
|
+
/* @__PURE__ */ jsx58("span", { children: (_a = selected == null ? void 0 : selected.label) != null ? _a : value }),
|
|
13987
|
+
disabled ? null : /* @__PURE__ */ jsx58(Icon, { icon: CgChevronDown2, iconColor: "currentColor", size: 24 })
|
|
13936
13988
|
]
|
|
13937
13989
|
}
|
|
13938
13990
|
),
|
|
13939
|
-
/* @__PURE__ */
|
|
13991
|
+
/* @__PURE__ */ jsx58(
|
|
13940
13992
|
"div",
|
|
13941
13993
|
{
|
|
13942
13994
|
id: `and-or-${props.id}`,
|
|
13943
13995
|
css: [inlineSelectMenu, menuVisible ? void 0 : inlineSelectMenuClosed],
|
|
13944
13996
|
"aria-hidden": !menuVisible,
|
|
13945
|
-
children: options.map((opt) => /* @__PURE__ */
|
|
13997
|
+
children: options.map((opt) => /* @__PURE__ */ jsx58(
|
|
13946
13998
|
"button",
|
|
13947
13999
|
{
|
|
13948
14000
|
type: "button",
|
|
@@ -13965,7 +14017,7 @@ var InputInlineSelect = ({
|
|
|
13965
14017
|
// src/components/Input/InputKeywordSearch.tsx
|
|
13966
14018
|
import { CgClose as CgClose4 } from "@react-icons/all-files/cg/CgClose";
|
|
13967
14019
|
import { CgSearch } from "@react-icons/all-files/cg/CgSearch";
|
|
13968
|
-
import { jsx as
|
|
14020
|
+
import { jsx as jsx59 } from "@emotion/react/jsx-runtime";
|
|
13969
14021
|
var InputKeywordSearch = ({
|
|
13970
14022
|
onSearchTextChanged,
|
|
13971
14023
|
disabled = false,
|
|
@@ -13986,7 +14038,7 @@ var InputKeywordSearch = ({
|
|
|
13986
14038
|
e.preventDefault();
|
|
13987
14039
|
}
|
|
13988
14040
|
};
|
|
13989
|
-
return /* @__PURE__ */
|
|
14041
|
+
return /* @__PURE__ */ jsx59(
|
|
13990
14042
|
Input,
|
|
13991
14043
|
{
|
|
13992
14044
|
type: "text",
|
|
@@ -13994,7 +14046,7 @@ var InputKeywordSearch = ({
|
|
|
13994
14046
|
placeholder,
|
|
13995
14047
|
showLabel: false,
|
|
13996
14048
|
value,
|
|
13997
|
-
icon: value ? /* @__PURE__ */
|
|
14049
|
+
icon: value ? /* @__PURE__ */ jsx59("button", { css: inputSearchCloseBtn, onClick: onClear, type: "button", children: /* @__PURE__ */ jsx59(Icon, { icon: CgClose4, iconColor: "red", size: "1rem" }) }) : /* @__PURE__ */ jsx59(Icon, { icon: CgSearch, iconColor: "gray", size: "1rem" }),
|
|
13998
14050
|
onChange: handleSearchTextChanged,
|
|
13999
14051
|
onKeyPress: preventSubmitOnField,
|
|
14000
14052
|
disabled,
|
|
@@ -14012,7 +14064,7 @@ var InputKeywordSearch = ({
|
|
|
14012
14064
|
};
|
|
14013
14065
|
|
|
14014
14066
|
// src/components/Input/InputSelect.tsx
|
|
14015
|
-
import { Fragment as Fragment8, jsx as
|
|
14067
|
+
import { Fragment as Fragment8, jsx as jsx60, jsxs as jsxs37 } from "@emotion/react/jsx-runtime";
|
|
14016
14068
|
var InputSelect = ({
|
|
14017
14069
|
label,
|
|
14018
14070
|
defaultOption,
|
|
@@ -14028,13 +14080,13 @@ var InputSelect = ({
|
|
|
14028
14080
|
classNameLabel,
|
|
14029
14081
|
...props
|
|
14030
14082
|
}) => {
|
|
14031
|
-
return /* @__PURE__ */
|
|
14083
|
+
return /* @__PURE__ */ jsxs37(
|
|
14032
14084
|
"div",
|
|
14033
14085
|
{
|
|
14034
14086
|
css: [inputContainer, typeof classNameContainer === "object" ? classNameContainer : void 0],
|
|
14035
14087
|
className: typeof classNameContainer === "string" ? classNameContainer : "",
|
|
14036
14088
|
children: [
|
|
14037
|
-
showLabel ? /* @__PURE__ */
|
|
14089
|
+
showLabel ? /* @__PURE__ */ jsx60(Fragment8, { children: /* @__PURE__ */ jsxs37(
|
|
14038
14090
|
Label,
|
|
14039
14091
|
{
|
|
14040
14092
|
htmlFor: props.id,
|
|
@@ -14046,7 +14098,7 @@ var InputSelect = ({
|
|
|
14046
14098
|
]
|
|
14047
14099
|
}
|
|
14048
14100
|
) }) : null,
|
|
14049
|
-
/* @__PURE__ */
|
|
14101
|
+
/* @__PURE__ */ jsxs37(
|
|
14050
14102
|
"select",
|
|
14051
14103
|
{
|
|
14052
14104
|
title: label,
|
|
@@ -14061,14 +14113,14 @@ var InputSelect = ({
|
|
|
14061
14113
|
className: typeof classNameControl === "string" ? classNameControl : "",
|
|
14062
14114
|
...props,
|
|
14063
14115
|
children: [
|
|
14064
|
-
defaultOption ? /* @__PURE__ */
|
|
14065
|
-
options.map((opt, index) => /* @__PURE__ */
|
|
14116
|
+
defaultOption ? /* @__PURE__ */ jsx60("option", { value: "", children: defaultOption }) : null,
|
|
14117
|
+
options.map((opt, index) => /* @__PURE__ */ jsx60("option", { value: opt.label, ...opt }, index))
|
|
14066
14118
|
]
|
|
14067
14119
|
}
|
|
14068
14120
|
),
|
|
14069
|
-
caption ? /* @__PURE__ */
|
|
14070
|
-
errorMessage ? /* @__PURE__ */
|
|
14071
|
-
warningMessage && !errorMessage ? /* @__PURE__ */
|
|
14121
|
+
caption ? /* @__PURE__ */ jsx60(Caption, { children: caption }) : null,
|
|
14122
|
+
errorMessage ? /* @__PURE__ */ jsx60(ErrorMessage, { message: errorMessage }) : null,
|
|
14123
|
+
warningMessage && !errorMessage ? /* @__PURE__ */ jsx60(WarningMessage, { message: warningMessage }) : null
|
|
14072
14124
|
]
|
|
14073
14125
|
}
|
|
14074
14126
|
);
|
|
@@ -14076,7 +14128,7 @@ var InputSelect = ({
|
|
|
14076
14128
|
|
|
14077
14129
|
// src/components/Input/InputToggle.tsx
|
|
14078
14130
|
import * as React17 from "react";
|
|
14079
|
-
import { jsx as
|
|
14131
|
+
import { jsx as jsx61, jsxs as jsxs38 } from "@emotion/react/jsx-runtime";
|
|
14080
14132
|
var InputToggle = React17.forwardRef(
|
|
14081
14133
|
({
|
|
14082
14134
|
label,
|
|
@@ -14091,13 +14143,13 @@ var InputToggle = React17.forwardRef(
|
|
|
14091
14143
|
fontWeight = "medium",
|
|
14092
14144
|
...props
|
|
14093
14145
|
}, ref) => {
|
|
14094
|
-
return /* @__PURE__ */
|
|
14146
|
+
return /* @__PURE__ */ jsxs38(
|
|
14095
14147
|
Label,
|
|
14096
14148
|
{
|
|
14097
14149
|
css: [inputToggleLabel, disabled ? inputDisabled : void 0],
|
|
14098
14150
|
"data-testid": testId ? testId : "input-toggle",
|
|
14099
14151
|
children: [
|
|
14100
|
-
/* @__PURE__ */
|
|
14152
|
+
/* @__PURE__ */ jsx61(
|
|
14101
14153
|
"input",
|
|
14102
14154
|
{
|
|
14103
14155
|
ref,
|
|
@@ -14109,11 +14161,11 @@ var InputToggle = React17.forwardRef(
|
|
|
14109
14161
|
...props
|
|
14110
14162
|
}
|
|
14111
14163
|
),
|
|
14112
|
-
/* @__PURE__ */
|
|
14113
|
-
caption || errorMessage ? /* @__PURE__ */
|
|
14114
|
-
caption ? /* @__PURE__ */
|
|
14115
|
-
errorMessage ? /* @__PURE__ */
|
|
14116
|
-
warningMessage && !errorMessage ? /* @__PURE__ */
|
|
14164
|
+
/* @__PURE__ */ jsx61("span", { css: inlineLabel(fontWeight), children: label }),
|
|
14165
|
+
caption || errorMessage ? /* @__PURE__ */ jsxs38("span", { css: inputToggleMessageContainer, children: [
|
|
14166
|
+
caption ? /* @__PURE__ */ jsx61(Caption, { children: caption }) : null,
|
|
14167
|
+
errorMessage ? /* @__PURE__ */ jsx61(ErrorMessage, { message: errorMessage }) : null,
|
|
14168
|
+
warningMessage && !errorMessage ? /* @__PURE__ */ jsx61(WarningMessage, { message: warningMessage }) : null
|
|
14117
14169
|
] }) : null
|
|
14118
14170
|
]
|
|
14119
14171
|
}
|
|
@@ -14122,17 +14174,17 @@ var InputToggle = React17.forwardRef(
|
|
|
14122
14174
|
);
|
|
14123
14175
|
|
|
14124
14176
|
// src/components/Input/Legend.tsx
|
|
14125
|
-
import { jsx as
|
|
14177
|
+
import { jsx as jsx62 } from "@emotion/react/jsx-runtime";
|
|
14126
14178
|
var Legend = ({ children }) => {
|
|
14127
|
-
return /* @__PURE__ */
|
|
14179
|
+
return /* @__PURE__ */ jsx62("legend", { css: fieldsetLegend, children });
|
|
14128
14180
|
};
|
|
14129
14181
|
|
|
14130
14182
|
// src/components/Input/SuccessMessage.tsx
|
|
14131
14183
|
import { CgCheckO } from "@react-icons/all-files/cg/CgCheckO";
|
|
14132
14184
|
|
|
14133
14185
|
// src/components/Input/styles/SuccessMessage.styles.ts
|
|
14134
|
-
import { css as
|
|
14135
|
-
var SuccessText =
|
|
14186
|
+
import { css as css53 } from "@emotion/react";
|
|
14187
|
+
var SuccessText = css53`
|
|
14136
14188
|
--info-desc: var(--brand-secondary-3);
|
|
14137
14189
|
--info-icon: var(--brand-secondary-3);
|
|
14138
14190
|
|
|
@@ -14141,28 +14193,28 @@ var SuccessText = css52`
|
|
|
14141
14193
|
display: flex;
|
|
14142
14194
|
gap: var(--spacing-sm);
|
|
14143
14195
|
`;
|
|
14144
|
-
var SuccessIcon2 =
|
|
14196
|
+
var SuccessIcon2 = css53`
|
|
14145
14197
|
color: var(--info-icon);
|
|
14146
14198
|
`;
|
|
14147
14199
|
|
|
14148
14200
|
// src/components/Input/SuccessMessage.tsx
|
|
14149
|
-
import { jsx as
|
|
14201
|
+
import { jsx as jsx63, jsxs as jsxs39 } from "@emotion/react/jsx-runtime";
|
|
14150
14202
|
var SuccessMessage = ({ message, testId, ...props }) => {
|
|
14151
|
-
return message ? /* @__PURE__ */
|
|
14152
|
-
/* @__PURE__ */
|
|
14203
|
+
return message ? /* @__PURE__ */ jsxs39("span", { role: "status", css: SuccessText, "data-testid": testId, ...props, children: [
|
|
14204
|
+
/* @__PURE__ */ jsx63("span", { children: /* @__PURE__ */ jsx63(Icon, { css: SuccessIcon2, icon: CgCheckO, size: "1rem", iconColor: "currentColor" }) }),
|
|
14153
14205
|
message
|
|
14154
14206
|
] }) : null;
|
|
14155
14207
|
};
|
|
14156
14208
|
|
|
14157
14209
|
// src/components/Input/Textarea.tsx
|
|
14158
|
-
import { forwardRef as
|
|
14159
|
-
import { Fragment as Fragment9, jsx as
|
|
14160
|
-
var Textarea =
|
|
14210
|
+
import { forwardRef as forwardRef9 } from "react";
|
|
14211
|
+
import { Fragment as Fragment9, jsx as jsx64, jsxs as jsxs40 } from "@emotion/react/jsx-runtime";
|
|
14212
|
+
var Textarea = forwardRef9(
|
|
14161
14213
|
({ label, icon, id, caption, showLabel = true, errorMessage, warningMessage, ...props }, ref) => {
|
|
14162
|
-
return /* @__PURE__ */
|
|
14163
|
-
showLabel ? /* @__PURE__ */
|
|
14164
|
-
/* @__PURE__ */
|
|
14165
|
-
/* @__PURE__ */
|
|
14214
|
+
return /* @__PURE__ */ jsxs40(Fragment9, { children: [
|
|
14215
|
+
showLabel ? /* @__PURE__ */ jsx64("label", { htmlFor: id, css: [labelText], children: label }) : null,
|
|
14216
|
+
/* @__PURE__ */ jsxs40("div", { css: [inputContainer], children: [
|
|
14217
|
+
/* @__PURE__ */ jsx64(
|
|
14166
14218
|
"textarea",
|
|
14167
14219
|
{
|
|
14168
14220
|
ref,
|
|
@@ -14177,23 +14229,23 @@ var Textarea = forwardRef8(
|
|
|
14177
14229
|
...props
|
|
14178
14230
|
}
|
|
14179
14231
|
),
|
|
14180
|
-
icon ? /* @__PURE__ */
|
|
14232
|
+
icon ? /* @__PURE__ */ jsx64("div", { css: inputIcon, children: icon }) : null
|
|
14181
14233
|
] }),
|
|
14182
|
-
caption ? /* @__PURE__ */
|
|
14183
|
-
errorMessage ? /* @__PURE__ */
|
|
14184
|
-
warningMessage && !errorMessage ? /* @__PURE__ */
|
|
14234
|
+
caption ? /* @__PURE__ */ jsx64(Caption, { children: caption }) : null,
|
|
14235
|
+
errorMessage ? /* @__PURE__ */ jsx64(ErrorMessage, { message: errorMessage }) : null,
|
|
14236
|
+
warningMessage && !errorMessage ? /* @__PURE__ */ jsx64(WarningMessage, { message: warningMessage }) : null
|
|
14185
14237
|
] });
|
|
14186
14238
|
}
|
|
14187
14239
|
);
|
|
14188
14240
|
|
|
14189
14241
|
// src/components/Tiles/CreateTeamIntegrationTile.tsx
|
|
14190
|
-
import { css as
|
|
14242
|
+
import { css as css55 } from "@emotion/react";
|
|
14191
14243
|
import { CgAdd as CgAdd2 } from "@react-icons/all-files/cg/CgAdd";
|
|
14192
14244
|
import { CgChevronRight as CgChevronRight2 } from "@react-icons/all-files/cg/CgChevronRight";
|
|
14193
14245
|
|
|
14194
14246
|
// src/components/Tiles/styles/IntegrationTile.styles.ts
|
|
14195
|
-
import { css as
|
|
14196
|
-
var IntegrationTileContainer =
|
|
14247
|
+
import { css as css54 } from "@emotion/react";
|
|
14248
|
+
var IntegrationTileContainer = css54`
|
|
14197
14249
|
align-items: center;
|
|
14198
14250
|
box-sizing: border-box;
|
|
14199
14251
|
border-radius: var(--rounded-base);
|
|
@@ -14224,22 +14276,22 @@ var IntegrationTileContainer = css53`
|
|
|
14224
14276
|
}
|
|
14225
14277
|
}
|
|
14226
14278
|
`;
|
|
14227
|
-
var IntegrationTileBtnDashedBorder =
|
|
14279
|
+
var IntegrationTileBtnDashedBorder = css54`
|
|
14228
14280
|
border: 1px dashed var(--brand-secondary-1);
|
|
14229
14281
|
`;
|
|
14230
|
-
var IntegrationTileTitle =
|
|
14282
|
+
var IntegrationTileTitle = css54`
|
|
14231
14283
|
display: block;
|
|
14232
14284
|
font-weight: var(--fw-bold);
|
|
14233
14285
|
margin: 0 0 var(--spacing-base);
|
|
14234
14286
|
max-width: 13rem;
|
|
14235
14287
|
`;
|
|
14236
|
-
var IntegrationTitleLogo =
|
|
14288
|
+
var IntegrationTitleLogo = css54`
|
|
14237
14289
|
display: block;
|
|
14238
14290
|
max-width: 10rem;
|
|
14239
14291
|
max-height: 4rem;
|
|
14240
14292
|
margin: 0 auto;
|
|
14241
14293
|
`;
|
|
14242
|
-
var IntegrationTileName =
|
|
14294
|
+
var IntegrationTileName = css54`
|
|
14243
14295
|
color: var(--gray-500);
|
|
14244
14296
|
display: -webkit-box;
|
|
14245
14297
|
-webkit-line-clamp: 1;
|
|
@@ -14252,7 +14304,7 @@ var IntegrationTileName = css53`
|
|
|
14252
14304
|
position: absolute;
|
|
14253
14305
|
bottom: calc(var(--spacing-base) * 3.8);
|
|
14254
14306
|
`;
|
|
14255
|
-
var IntegrationAddedText =
|
|
14307
|
+
var IntegrationAddedText = css54`
|
|
14256
14308
|
align-items: center;
|
|
14257
14309
|
background: var(--brand-secondary-3);
|
|
14258
14310
|
border-radius: 0 var(--rounded-md) 0 var(--rounded-md);
|
|
@@ -14267,7 +14319,7 @@ var IntegrationAddedText = css53`
|
|
|
14267
14319
|
top: 0;
|
|
14268
14320
|
right: 0;
|
|
14269
14321
|
`;
|
|
14270
|
-
var IntegrationCustomBadgeText = (theme) =>
|
|
14322
|
+
var IntegrationCustomBadgeText = (theme) => css54`
|
|
14271
14323
|
align-items: center;
|
|
14272
14324
|
border-radius: var(--rounded-sm) 0 var(--rounded-sm) 0;
|
|
14273
14325
|
background: ${theme === "gray" ? "var(--brand-secondary-2)" : "var(--brand-secondary-1)"};
|
|
@@ -14281,26 +14333,26 @@ var IntegrationCustomBadgeText = (theme) => css53`
|
|
|
14281
14333
|
top: 0;
|
|
14282
14334
|
left: 0;
|
|
14283
14335
|
`;
|
|
14284
|
-
var IntegrationAuthorBadgeIcon =
|
|
14336
|
+
var IntegrationAuthorBadgeIcon = css54`
|
|
14285
14337
|
position: absolute;
|
|
14286
14338
|
bottom: var(--spacing-sm);
|
|
14287
14339
|
right: var(--spacing-xs);
|
|
14288
14340
|
max-height: 1rem;
|
|
14289
14341
|
`;
|
|
14290
|
-
var IntegrationTitleFakeButton =
|
|
14342
|
+
var IntegrationTitleFakeButton = css54`
|
|
14291
14343
|
font-size: var(--fs-xs);
|
|
14292
14344
|
gap: var(--spacing-sm);
|
|
14293
14345
|
padding: var(--spacing-sm) var(--spacing-base);
|
|
14294
14346
|
text-transform: uppercase;
|
|
14295
14347
|
`;
|
|
14296
|
-
var IntegrationTileFloatingButton =
|
|
14348
|
+
var IntegrationTileFloatingButton = css54`
|
|
14297
14349
|
position: absolute;
|
|
14298
14350
|
bottom: var(--spacing-base);
|
|
14299
14351
|
gap: var(--spacing-sm);
|
|
14300
14352
|
font-size: var(--fs-xs);
|
|
14301
14353
|
overflow: hidden;
|
|
14302
14354
|
`;
|
|
14303
|
-
var IntegrationTileFloatingButtonMessage = (clicked) =>
|
|
14355
|
+
var IntegrationTileFloatingButtonMessage = (clicked) => css54`
|
|
14304
14356
|
strong,
|
|
14305
14357
|
span:first-of-type {
|
|
14306
14358
|
transition: opacity var(--duration-fast) var(--timing-ease-out);
|
|
@@ -14321,7 +14373,7 @@ var IntegrationTileFloatingButtonMessage = (clicked) => css53`
|
|
|
14321
14373
|
`;
|
|
14322
14374
|
|
|
14323
14375
|
// src/components/Tiles/CreateTeamIntegrationTile.tsx
|
|
14324
|
-
import { jsx as
|
|
14376
|
+
import { jsx as jsx65, jsxs as jsxs41 } from "@emotion/react/jsx-runtime";
|
|
14325
14377
|
var CreateTeamIntegrationTile = ({
|
|
14326
14378
|
title = "Create a custom integration for your team",
|
|
14327
14379
|
buttonText = "Add Integration",
|
|
@@ -14329,9 +14381,9 @@ var CreateTeamIntegrationTile = ({
|
|
|
14329
14381
|
asDeepLink = false,
|
|
14330
14382
|
...props
|
|
14331
14383
|
}) => {
|
|
14332
|
-
return /* @__PURE__ */
|
|
14333
|
-
/* @__PURE__ */
|
|
14334
|
-
/* @__PURE__ */
|
|
14384
|
+
return /* @__PURE__ */ jsxs41("div", { css: [IntegrationTileContainer, IntegrationTileBtnDashedBorder], ...props, children: [
|
|
14385
|
+
/* @__PURE__ */ jsx65("span", { css: IntegrationTileTitle, title, children: title }),
|
|
14386
|
+
/* @__PURE__ */ jsxs41(
|
|
14335
14387
|
Button,
|
|
14336
14388
|
{
|
|
14337
14389
|
buttonType: "tertiary",
|
|
@@ -14341,23 +14393,23 @@ var CreateTeamIntegrationTile = ({
|
|
|
14341
14393
|
css: IntegrationTitleFakeButton,
|
|
14342
14394
|
children: [
|
|
14343
14395
|
buttonText,
|
|
14344
|
-
asDeepLink ? /* @__PURE__ */
|
|
14396
|
+
asDeepLink ? /* @__PURE__ */ jsx65(
|
|
14345
14397
|
Icon,
|
|
14346
14398
|
{
|
|
14347
14399
|
icon: CgChevronRight2,
|
|
14348
14400
|
iconColor: "currentColor",
|
|
14349
14401
|
size: 20,
|
|
14350
|
-
css:
|
|
14402
|
+
css: css55`
|
|
14351
14403
|
order: 1;
|
|
14352
14404
|
`
|
|
14353
14405
|
}
|
|
14354
|
-
) : /* @__PURE__ */
|
|
14406
|
+
) : /* @__PURE__ */ jsx65(
|
|
14355
14407
|
Icon,
|
|
14356
14408
|
{
|
|
14357
14409
|
icon: CgAdd2,
|
|
14358
14410
|
iconColor: "currentColor",
|
|
14359
14411
|
size: 16,
|
|
14360
|
-
css:
|
|
14412
|
+
css: css55`
|
|
14361
14413
|
order: -1;
|
|
14362
14414
|
`
|
|
14363
14415
|
}
|
|
@@ -14372,31 +14424,31 @@ var CreateTeamIntegrationTile = ({
|
|
|
14372
14424
|
import { CgCheck } from "@react-icons/all-files/cg/CgCheck";
|
|
14373
14425
|
import { CgLock } from "@react-icons/all-files/cg/CgLock";
|
|
14374
14426
|
import { CgSandClock } from "@react-icons/all-files/cg/CgSandClock";
|
|
14375
|
-
import { jsx as
|
|
14427
|
+
import { jsx as jsx66, jsxs as jsxs42 } from "@emotion/react/jsx-runtime";
|
|
14376
14428
|
var IntegrationedAddedBadge = ({ text = "Added" }) => {
|
|
14377
|
-
return /* @__PURE__ */
|
|
14378
|
-
/* @__PURE__ */
|
|
14429
|
+
return /* @__PURE__ */ jsxs42("span", { "data-testid": "integration-icon-installed", css: IntegrationAddedText, children: [
|
|
14430
|
+
/* @__PURE__ */ jsx66(Icon, { icon: CgCheck, iconColor: "currentColor" }),
|
|
14379
14431
|
text
|
|
14380
14432
|
] });
|
|
14381
14433
|
};
|
|
14382
14434
|
var IntegrationCustomBadge = ({ text = "Custom" }) => {
|
|
14383
|
-
return /* @__PURE__ */
|
|
14435
|
+
return /* @__PURE__ */ jsx66("span", { "data-testid": "integration-is-private", css: IntegrationCustomBadgeText("gray"), children: text });
|
|
14384
14436
|
};
|
|
14385
14437
|
var IntegrationPremiumBadge = ({ text = "Premium" }) => {
|
|
14386
|
-
return /* @__PURE__ */
|
|
14387
|
-
/* @__PURE__ */
|
|
14438
|
+
return /* @__PURE__ */ jsxs42("span", { css: IntegrationCustomBadgeText("blue"), children: [
|
|
14439
|
+
/* @__PURE__ */ jsx66(Icon, { icon: CgLock, iconColor: "currentColor", size: 12 }),
|
|
14388
14440
|
text
|
|
14389
14441
|
] });
|
|
14390
14442
|
};
|
|
14391
14443
|
var IntegrationComingSoonBadge = ({ text = "Coming soon" }) => {
|
|
14392
|
-
return /* @__PURE__ */
|
|
14393
|
-
/* @__PURE__ */
|
|
14444
|
+
return /* @__PURE__ */ jsxs42("span", { css: IntegrationCustomBadgeText("blue"), children: [
|
|
14445
|
+
/* @__PURE__ */ jsx66(Icon, { icon: CgSandClock, iconColor: "currentColor", size: 12 }),
|
|
14394
14446
|
text
|
|
14395
14447
|
] });
|
|
14396
14448
|
};
|
|
14397
14449
|
|
|
14398
14450
|
// src/components/Tiles/ResolveIcon.tsx
|
|
14399
|
-
import { jsx as
|
|
14451
|
+
import { jsx as jsx67 } from "@emotion/react/jsx-runtime";
|
|
14400
14452
|
var ResolveIcon = ({ icon, name, styleType = "logo", ...props }) => {
|
|
14401
14453
|
const CompIcon = icon && typeof icon !== "string" ? icon : null;
|
|
14402
14454
|
const mapClassName = {
|
|
@@ -14404,13 +14456,13 @@ var ResolveIcon = ({ icon, name, styleType = "logo", ...props }) => {
|
|
|
14404
14456
|
logo: IntegrationTitleLogo
|
|
14405
14457
|
};
|
|
14406
14458
|
if (icon) {
|
|
14407
|
-
return CompIcon ? /* @__PURE__ */
|
|
14459
|
+
return CompIcon ? /* @__PURE__ */ jsx67(CompIcon, { css: mapClassName[styleType], ...props }) : /* @__PURE__ */ jsx67("img", { src: icon, alt: name, css: mapClassName[styleType], ...props });
|
|
14408
14460
|
}
|
|
14409
14461
|
return null;
|
|
14410
14462
|
};
|
|
14411
14463
|
|
|
14412
14464
|
// src/components/Tiles/EditTeamIntegrationTile.tsx
|
|
14413
|
-
import { jsx as
|
|
14465
|
+
import { jsx as jsx68, jsxs as jsxs43 } from "@emotion/react/jsx-runtime";
|
|
14414
14466
|
var EditTeamIntegrationTile = ({
|
|
14415
14467
|
id,
|
|
14416
14468
|
icon,
|
|
@@ -14419,17 +14471,17 @@ var EditTeamIntegrationTile = ({
|
|
|
14419
14471
|
isPublic,
|
|
14420
14472
|
canEdit = false
|
|
14421
14473
|
}) => {
|
|
14422
|
-
return /* @__PURE__ */
|
|
14474
|
+
return /* @__PURE__ */ jsxs43(
|
|
14423
14475
|
"div",
|
|
14424
14476
|
{
|
|
14425
14477
|
css: IntegrationTileContainer,
|
|
14426
14478
|
"data-testid": "configure-integration-container",
|
|
14427
14479
|
"integration-id": `${id.toLocaleLowerCase()}`,
|
|
14428
14480
|
children: [
|
|
14429
|
-
/* @__PURE__ */
|
|
14430
|
-
/* @__PURE__ */
|
|
14431
|
-
!isPublic ? /* @__PURE__ */
|
|
14432
|
-
canEdit ? /* @__PURE__ */
|
|
14481
|
+
/* @__PURE__ */ jsx68(ResolveIcon, { icon, name, "data-testid": "integration-logo" }),
|
|
14482
|
+
/* @__PURE__ */ jsx68("span", { css: IntegrationTileName, "data-testid": "integration-card-name", children: name }),
|
|
14483
|
+
!isPublic ? /* @__PURE__ */ jsx68(IntegrationCustomBadge, {}) : null,
|
|
14484
|
+
canEdit ? /* @__PURE__ */ jsx68(
|
|
14433
14485
|
Button,
|
|
14434
14486
|
{
|
|
14435
14487
|
buttonType: "unimportant",
|
|
@@ -14447,10 +14499,10 @@ var EditTeamIntegrationTile = ({
|
|
|
14447
14499
|
};
|
|
14448
14500
|
|
|
14449
14501
|
// src/components/Tiles/IntegrationComingSoon.tsx
|
|
14450
|
-
import { css as
|
|
14502
|
+
import { css as css56 } from "@emotion/react";
|
|
14451
14503
|
import { CgHeart } from "@react-icons/all-files/cg/CgHeart";
|
|
14452
14504
|
import { useEffect as useEffect7, useState as useState8 } from "react";
|
|
14453
|
-
import { jsx as
|
|
14505
|
+
import { jsx as jsx69, jsxs as jsxs44 } from "@emotion/react/jsx-runtime";
|
|
14454
14506
|
var IntegrationComingSoon = ({
|
|
14455
14507
|
name,
|
|
14456
14508
|
icon,
|
|
@@ -14472,17 +14524,17 @@ var IntegrationComingSoon = ({
|
|
|
14472
14524
|
};
|
|
14473
14525
|
}
|
|
14474
14526
|
}, [upVote, setUpVote, timing]);
|
|
14475
|
-
return /* @__PURE__ */
|
|
14527
|
+
return /* @__PURE__ */ jsxs44(
|
|
14476
14528
|
"div",
|
|
14477
14529
|
{
|
|
14478
14530
|
css: IntegrationTileContainer,
|
|
14479
14531
|
"data-testid": `coming-soon-${id.toLowerCase()}-integration`,
|
|
14480
14532
|
...props,
|
|
14481
14533
|
children: [
|
|
14482
|
-
/* @__PURE__ */
|
|
14483
|
-
/* @__PURE__ */
|
|
14484
|
-
/* @__PURE__ */
|
|
14485
|
-
/* @__PURE__ */
|
|
14534
|
+
/* @__PURE__ */ jsx69(IntegrationComingSoonBadge, {}),
|
|
14535
|
+
/* @__PURE__ */ jsx69(ResolveIcon, { icon, name }),
|
|
14536
|
+
/* @__PURE__ */ jsx69("span", { css: IntegrationTileName, title: name, children: name }),
|
|
14537
|
+
/* @__PURE__ */ jsxs44(
|
|
14486
14538
|
Button,
|
|
14487
14539
|
{
|
|
14488
14540
|
buttonType: "unimportant",
|
|
@@ -14492,19 +14544,19 @@ var IntegrationComingSoon = ({
|
|
|
14492
14544
|
role: "link",
|
|
14493
14545
|
css: [IntegrationTileFloatingButton, IntegrationTileFloatingButtonMessage(upVote)],
|
|
14494
14546
|
children: [
|
|
14495
|
-
/* @__PURE__ */
|
|
14496
|
-
/* @__PURE__ */
|
|
14547
|
+
/* @__PURE__ */ jsx69("strong", { children: "+1" }),
|
|
14548
|
+
/* @__PURE__ */ jsx69(
|
|
14497
14549
|
"span",
|
|
14498
14550
|
{
|
|
14499
|
-
css:
|
|
14551
|
+
css: css56`
|
|
14500
14552
|
text-transform: uppercase;
|
|
14501
14553
|
color: var(--gray-500);
|
|
14502
14554
|
`,
|
|
14503
14555
|
children: "(I want this)"
|
|
14504
14556
|
}
|
|
14505
14557
|
),
|
|
14506
|
-
/* @__PURE__ */
|
|
14507
|
-
/* @__PURE__ */
|
|
14558
|
+
/* @__PURE__ */ jsxs44("span", { "aria-hidden": !upVote, children: [
|
|
14559
|
+
/* @__PURE__ */ jsx69(Icon, { icon: CgHeart, iconColor: "currentColor", size: 18 }),
|
|
14508
14560
|
"Thanks!"
|
|
14509
14561
|
] })
|
|
14510
14562
|
]
|
|
@@ -14516,8 +14568,8 @@ var IntegrationComingSoon = ({
|
|
|
14516
14568
|
};
|
|
14517
14569
|
|
|
14518
14570
|
// src/components/Tiles/styles/IntegrationLoadingTile.styles.ts
|
|
14519
|
-
import { css as
|
|
14520
|
-
var IntegrationLoadingTileContainer =
|
|
14571
|
+
import { css as css57 } from "@emotion/react";
|
|
14572
|
+
var IntegrationLoadingTileContainer = css57`
|
|
14521
14573
|
align-items: center;
|
|
14522
14574
|
box-sizing: border-box;
|
|
14523
14575
|
border-radius: var(--rounded-base);
|
|
@@ -14544,39 +14596,39 @@ var IntegrationLoadingTileContainer = css56`
|
|
|
14544
14596
|
}
|
|
14545
14597
|
}
|
|
14546
14598
|
`;
|
|
14547
|
-
var IntegrationLoadingTileImg =
|
|
14599
|
+
var IntegrationLoadingTileImg = css57`
|
|
14548
14600
|
width: 10rem;
|
|
14549
14601
|
height: 4rem;
|
|
14550
14602
|
margin: 0 auto;
|
|
14551
14603
|
`;
|
|
14552
|
-
var IntegrationLoadingTileText =
|
|
14604
|
+
var IntegrationLoadingTileText = css57`
|
|
14553
14605
|
width: 5rem;
|
|
14554
14606
|
height: var(--spacing-sm);
|
|
14555
14607
|
margin: var(--spacing-sm) 0;
|
|
14556
14608
|
`;
|
|
14557
|
-
var IntegrationLoadingFrame =
|
|
14609
|
+
var IntegrationLoadingFrame = css57`
|
|
14558
14610
|
animation: ${skeletonLoading} 1s linear infinite alternate;
|
|
14559
14611
|
border-radius: var(--rounded-base);
|
|
14560
14612
|
`;
|
|
14561
14613
|
|
|
14562
14614
|
// src/components/Tiles/IntegrationLoadingTile.tsx
|
|
14563
|
-
import { Fragment as Fragment10, jsx as
|
|
14615
|
+
import { Fragment as Fragment10, jsx as jsx70, jsxs as jsxs45 } from "@emotion/react/jsx-runtime";
|
|
14564
14616
|
var IntegrationLoadingTile = ({ count = 1 }) => {
|
|
14565
14617
|
const componentCount = Array.from(Array(count).keys());
|
|
14566
|
-
return /* @__PURE__ */
|
|
14567
|
-
/* @__PURE__ */
|
|
14568
|
-
/* @__PURE__ */
|
|
14618
|
+
return /* @__PURE__ */ jsx70(Fragment10, { children: componentCount.map((i) => /* @__PURE__ */ jsxs45("div", { css: IntegrationLoadingTileContainer, children: [
|
|
14619
|
+
/* @__PURE__ */ jsx70("div", { css: [IntegrationLoadingTileImg, IntegrationLoadingFrame], role: "presentation" }),
|
|
14620
|
+
/* @__PURE__ */ jsx70("div", { css: [IntegrationLoadingTileText, IntegrationLoadingFrame] })
|
|
14569
14621
|
] }, i)) });
|
|
14570
14622
|
};
|
|
14571
14623
|
|
|
14572
14624
|
// src/components/Tiles/styles/IntegrationModalIcon.styles.ts
|
|
14573
|
-
import { css as
|
|
14574
|
-
var IntegrationModalIconContainer =
|
|
14625
|
+
import { css as css58 } from "@emotion/react";
|
|
14626
|
+
var IntegrationModalIconContainer = css58`
|
|
14575
14627
|
position: relative;
|
|
14576
14628
|
width: 50px;
|
|
14577
14629
|
margin-bottom: var(--spacing-base);
|
|
14578
14630
|
`;
|
|
14579
|
-
var IntegrationModalImage =
|
|
14631
|
+
var IntegrationModalImage = css58`
|
|
14580
14632
|
position: absolute;
|
|
14581
14633
|
inset: 0;
|
|
14582
14634
|
margin: auto;
|
|
@@ -14585,7 +14637,7 @@ var IntegrationModalImage = css57`
|
|
|
14585
14637
|
`;
|
|
14586
14638
|
|
|
14587
14639
|
// src/components/Tiles/IntegrationModalIcon.tsx
|
|
14588
|
-
import { jsx as
|
|
14640
|
+
import { jsx as jsx71, jsxs as jsxs46 } from "@emotion/react/jsx-runtime";
|
|
14589
14641
|
var IntegrationModalIcon = ({ icon, name, ...imgProps }) => {
|
|
14590
14642
|
const CompIcon = icon && typeof icon !== "string" ? icon : null;
|
|
14591
14643
|
let iconSrc = void 0;
|
|
@@ -14601,9 +14653,9 @@ var IntegrationModalIcon = ({ icon, name, ...imgProps }) => {
|
|
|
14601
14653
|
}
|
|
14602
14654
|
}
|
|
14603
14655
|
}
|
|
14604
|
-
return /* @__PURE__ */
|
|
14605
|
-
/* @__PURE__ */
|
|
14606
|
-
/* @__PURE__ */
|
|
14656
|
+
return /* @__PURE__ */ jsxs46("div", { css: IntegrationModalIconContainer, children: [
|
|
14657
|
+
/* @__PURE__ */ jsxs46("svg", { width: "49", height: "57", fill: "none", xmlns: "http://www.w3.org/2000/svg", role: "img", children: [
|
|
14658
|
+
/* @__PURE__ */ jsx71(
|
|
14607
14659
|
"path",
|
|
14608
14660
|
{
|
|
14609
14661
|
d: "m24.367 1.813 22.786 13.322V41.78L24.367 55.102 1.581 41.78V15.135L24.367 1.814Z",
|
|
@@ -14612,12 +14664,12 @@ var IntegrationModalIcon = ({ icon, name, ...imgProps }) => {
|
|
|
14612
14664
|
strokeWidth: "2"
|
|
14613
14665
|
}
|
|
14614
14666
|
),
|
|
14615
|
-
/* @__PURE__ */
|
|
14616
|
-
/* @__PURE__ */
|
|
14617
|
-
/* @__PURE__ */
|
|
14667
|
+
/* @__PURE__ */ jsx71("defs", { children: /* @__PURE__ */ jsxs46("linearGradient", { id: "a", x1: "41.353", y1: "49.107", x2: "8.048", y2: "4.478", gradientUnits: "userSpaceOnUse", children: [
|
|
14668
|
+
/* @__PURE__ */ jsx71("stop", { stopColor: "#1768B2" }),
|
|
14669
|
+
/* @__PURE__ */ jsx71("stop", { offset: "1", stopColor: "#B3EFE4" })
|
|
14618
14670
|
] }) })
|
|
14619
14671
|
] }),
|
|
14620
|
-
CompIcon ? /* @__PURE__ */
|
|
14672
|
+
CompIcon ? /* @__PURE__ */ jsx71(CompIcon, { role: "img", css: IntegrationModalImage, ...imgProps }) : iconSrc ? /* @__PURE__ */ jsx71(
|
|
14621
14673
|
"img",
|
|
14622
14674
|
{
|
|
14623
14675
|
src: iconSrc,
|
|
@@ -14631,7 +14683,7 @@ var IntegrationModalIcon = ({ icon, name, ...imgProps }) => {
|
|
|
14631
14683
|
};
|
|
14632
14684
|
|
|
14633
14685
|
// src/components/Tiles/IntegrationTile.tsx
|
|
14634
|
-
import { jsx as
|
|
14686
|
+
import { jsx as jsx72, jsxs as jsxs47 } from "@emotion/react/jsx-runtime";
|
|
14635
14687
|
var IntegrationTile = ({
|
|
14636
14688
|
id,
|
|
14637
14689
|
icon,
|
|
@@ -14643,7 +14695,7 @@ var IntegrationTile = ({
|
|
|
14643
14695
|
authorIcon,
|
|
14644
14696
|
...btnProps
|
|
14645
14697
|
}) => {
|
|
14646
|
-
return /* @__PURE__ */
|
|
14698
|
+
return /* @__PURE__ */ jsxs47(
|
|
14647
14699
|
"button",
|
|
14648
14700
|
{
|
|
14649
14701
|
type: "button",
|
|
@@ -14653,21 +14705,21 @@ var IntegrationTile = ({
|
|
|
14653
14705
|
"aria-label": name,
|
|
14654
14706
|
...btnProps,
|
|
14655
14707
|
children: [
|
|
14656
|
-
/* @__PURE__ */
|
|
14657
|
-
/* @__PURE__ */
|
|
14658
|
-
isInstalled ? /* @__PURE__ */
|
|
14659
|
-
requiedEntitlement && isPublic ? /* @__PURE__ */
|
|
14660
|
-
!isPublic ? /* @__PURE__ */
|
|
14661
|
-
authorIcon ? /* @__PURE__ */
|
|
14708
|
+
/* @__PURE__ */ jsx72(ResolveIcon, { icon, name }),
|
|
14709
|
+
/* @__PURE__ */ jsx72("span", { css: IntegrationTileName, title: name, children: name }),
|
|
14710
|
+
isInstalled ? /* @__PURE__ */ jsx72(IntegrationedAddedBadge, {}) : null,
|
|
14711
|
+
requiedEntitlement && isPublic ? /* @__PURE__ */ jsx72(IntegrationPremiumBadge, {}) : null,
|
|
14712
|
+
!isPublic ? /* @__PURE__ */ jsx72(IntegrationCustomBadge, {}) : null,
|
|
14713
|
+
authorIcon ? /* @__PURE__ */ jsx72(ResolveIcon, { icon: authorIcon, name }) : null
|
|
14662
14714
|
]
|
|
14663
14715
|
}
|
|
14664
14716
|
);
|
|
14665
14717
|
};
|
|
14666
14718
|
|
|
14667
14719
|
// src/components/Tiles/styles/Tile.styles.ts
|
|
14668
|
-
import { css as
|
|
14720
|
+
import { css as css59 } from "@emotion/react";
|
|
14669
14721
|
var tileBorderSize = "1px";
|
|
14670
|
-
var Tile =
|
|
14722
|
+
var Tile = css59`
|
|
14671
14723
|
background: var(--white);
|
|
14672
14724
|
cursor: pointer;
|
|
14673
14725
|
border: ${tileBorderSize} solid var(--gray-300);
|
|
@@ -14691,18 +14743,18 @@ var Tile = css58`
|
|
|
14691
14743
|
`;
|
|
14692
14744
|
|
|
14693
14745
|
// src/components/Tiles/Tile.tsx
|
|
14694
|
-
import { jsx as
|
|
14746
|
+
import { jsx as jsx73 } from "@emotion/react/jsx-runtime";
|
|
14695
14747
|
var Tile2 = ({ children, disabled, ...props }) => {
|
|
14696
|
-
return /* @__PURE__ */
|
|
14748
|
+
return /* @__PURE__ */ jsx73("button", { type: "button", css: Tile, disabled, ...props, children });
|
|
14697
14749
|
};
|
|
14698
14750
|
|
|
14699
14751
|
// src/components/Tiles/styles/TileContainer.styles.ts
|
|
14700
|
-
import { css as
|
|
14701
|
-
var TileContainerWrapper = (theme, padding) =>
|
|
14752
|
+
import { css as css60 } from "@emotion/react";
|
|
14753
|
+
var TileContainerWrapper = (theme, padding) => css60`
|
|
14702
14754
|
background: ${theme};
|
|
14703
14755
|
padding: ${padding != "none" ? `var(--spacing-${padding})` : "0"};
|
|
14704
14756
|
`;
|
|
14705
|
-
var TileContainerInner = (gap, templateColumns) =>
|
|
14757
|
+
var TileContainerInner = (gap, templateColumns) => css60`
|
|
14706
14758
|
display: grid;
|
|
14707
14759
|
grid-template-columns: ${templateColumns};
|
|
14708
14760
|
gap: var(--spacing-${gap});
|
|
@@ -14716,7 +14768,7 @@ var TileContainerInner = (gap, templateColumns) => css59`
|
|
|
14716
14768
|
`;
|
|
14717
14769
|
|
|
14718
14770
|
// src/components/Tiles/TileContainer.tsx
|
|
14719
|
-
import { jsx as
|
|
14771
|
+
import { jsx as jsx74 } from "@emotion/react/jsx-runtime";
|
|
14720
14772
|
var TileContainer = ({
|
|
14721
14773
|
bgColor = "var(--brand-secondary-2)",
|
|
14722
14774
|
containerPadding = "base",
|
|
@@ -14725,25 +14777,25 @@ var TileContainer = ({
|
|
|
14725
14777
|
children,
|
|
14726
14778
|
...props
|
|
14727
14779
|
}) => {
|
|
14728
|
-
return /* @__PURE__ */
|
|
14780
|
+
return /* @__PURE__ */ jsx74("div", { css: TileContainerWrapper(bgColor, containerPadding), ...props, children: /* @__PURE__ */ jsx74("div", { css: TileContainerInner(gap, gridTemplateColumns), children }) });
|
|
14729
14781
|
};
|
|
14730
14782
|
|
|
14731
14783
|
// src/components/Tiles/styles/TileText.styles.ts
|
|
14732
|
-
import { css as
|
|
14733
|
-
var TileHeading =
|
|
14784
|
+
import { css as css61 } from "@emotion/react";
|
|
14785
|
+
var TileHeading = css61`
|
|
14734
14786
|
font-size: var(--fs-base);
|
|
14735
14787
|
`;
|
|
14736
|
-
var TileText =
|
|
14788
|
+
var TileText = css61`
|
|
14737
14789
|
color: var(--gray-500);
|
|
14738
14790
|
font-size: var(--fs-sm);
|
|
14739
14791
|
line-height: 1.2;
|
|
14740
14792
|
`;
|
|
14741
14793
|
|
|
14742
14794
|
// src/components/Tiles/TileText.tsx
|
|
14743
|
-
import { jsx as
|
|
14795
|
+
import { jsx as jsx75 } from "@emotion/react/jsx-runtime";
|
|
14744
14796
|
var TileText2 = ({ as = "heading", children, ...props }) => {
|
|
14745
14797
|
const isHeading = as === "heading";
|
|
14746
|
-
return /* @__PURE__ */
|
|
14798
|
+
return /* @__PURE__ */ jsx75(
|
|
14747
14799
|
"span",
|
|
14748
14800
|
{
|
|
14749
14801
|
role: isHeading ? "heading" : void 0,
|
|
@@ -14755,39 +14807,39 @@ var TileText2 = ({ as = "heading", children, ...props }) => {
|
|
|
14755
14807
|
};
|
|
14756
14808
|
|
|
14757
14809
|
// src/components/IntegrationModalHeader/IntegrationModalHeader.styles.ts
|
|
14758
|
-
import { css as
|
|
14759
|
-
var IntegrationModalHeaderSVGBackground =
|
|
14810
|
+
import { css as css62 } from "@emotion/react";
|
|
14811
|
+
var IntegrationModalHeaderSVGBackground = css62`
|
|
14760
14812
|
position: absolute;
|
|
14761
14813
|
top: 0;
|
|
14762
14814
|
left: 0;
|
|
14763
14815
|
`;
|
|
14764
|
-
var IntegrationModalHeaderGroup =
|
|
14816
|
+
var IntegrationModalHeaderGroup = css62`
|
|
14765
14817
|
align-items: center;
|
|
14766
14818
|
display: flex;
|
|
14767
14819
|
gap: var(--spacing-sm);
|
|
14768
14820
|
margin: 0 0 var(--spacing-md);
|
|
14769
14821
|
position: relative;
|
|
14770
14822
|
`;
|
|
14771
|
-
var IntegrationModalHeaderTitleGroup =
|
|
14823
|
+
var IntegrationModalHeaderTitleGroup = css62`
|
|
14772
14824
|
align-items: center;
|
|
14773
14825
|
display: flex;
|
|
14774
14826
|
gap: var(--spacing-base);
|
|
14775
14827
|
`;
|
|
14776
|
-
var IntegrationModalHeaderTitle =
|
|
14828
|
+
var IntegrationModalHeaderTitle = css62`
|
|
14777
14829
|
margin-top: 0;
|
|
14778
14830
|
`;
|
|
14779
|
-
var IntegrationModalHeaderMenuPlacement =
|
|
14831
|
+
var IntegrationModalHeaderMenuPlacement = css62`
|
|
14780
14832
|
margin-bottom: var(--spacing-base);
|
|
14781
14833
|
`;
|
|
14782
|
-
var IntegrationModalHeaderContentWrapper =
|
|
14834
|
+
var IntegrationModalHeaderContentWrapper = css62`
|
|
14783
14835
|
position: relative;
|
|
14784
14836
|
z-index: var(--z-10);
|
|
14785
14837
|
`;
|
|
14786
14838
|
|
|
14787
14839
|
// src/components/IntegrationModalHeader/IntegrationModalHeader.tsx
|
|
14788
|
-
import { Fragment as Fragment11, jsx as
|
|
14840
|
+
import { Fragment as Fragment11, jsx as jsx76, jsxs as jsxs48 } from "@emotion/react/jsx-runtime";
|
|
14789
14841
|
var HexModalBackground = ({ ...props }) => {
|
|
14790
|
-
return /* @__PURE__ */
|
|
14842
|
+
return /* @__PURE__ */ jsxs48(
|
|
14791
14843
|
"svg",
|
|
14792
14844
|
{
|
|
14793
14845
|
width: "236",
|
|
@@ -14797,7 +14849,7 @@ var HexModalBackground = ({ ...props }) => {
|
|
|
14797
14849
|
xmlns: "http://www.w3.org/2000/svg",
|
|
14798
14850
|
...props,
|
|
14799
14851
|
children: [
|
|
14800
|
-
/* @__PURE__ */
|
|
14852
|
+
/* @__PURE__ */ jsx76(
|
|
14801
14853
|
"path",
|
|
14802
14854
|
{
|
|
14803
14855
|
fillRule: "evenodd",
|
|
@@ -14806,7 +14858,7 @@ var HexModalBackground = ({ ...props }) => {
|
|
|
14806
14858
|
fill: "url(#paint0_linear_196_2737)"
|
|
14807
14859
|
}
|
|
14808
14860
|
),
|
|
14809
|
-
/* @__PURE__ */
|
|
14861
|
+
/* @__PURE__ */ jsx76("defs", { children: /* @__PURE__ */ jsxs48(
|
|
14810
14862
|
"linearGradient",
|
|
14811
14863
|
{
|
|
14812
14864
|
id: "paint0_linear_196_2737",
|
|
@@ -14816,8 +14868,8 @@ var HexModalBackground = ({ ...props }) => {
|
|
|
14816
14868
|
y2: "-95.2742",
|
|
14817
14869
|
gradientUnits: "userSpaceOnUse",
|
|
14818
14870
|
children: [
|
|
14819
|
-
/* @__PURE__ */
|
|
14820
|
-
/* @__PURE__ */
|
|
14871
|
+
/* @__PURE__ */ jsx76("stop", { stopColor: "#81DCDE" }),
|
|
14872
|
+
/* @__PURE__ */ jsx76("stop", { offset: "1", stopColor: "#428ED4" })
|
|
14821
14873
|
]
|
|
14822
14874
|
}
|
|
14823
14875
|
) })
|
|
@@ -14826,23 +14878,23 @@ var HexModalBackground = ({ ...props }) => {
|
|
|
14826
14878
|
);
|
|
14827
14879
|
};
|
|
14828
14880
|
var IntegrationModalHeader = ({ icon, name, menu: menu2, children }) => {
|
|
14829
|
-
return /* @__PURE__ */
|
|
14830
|
-
/* @__PURE__ */
|
|
14831
|
-
/* @__PURE__ */
|
|
14832
|
-
icon ? /* @__PURE__ */
|
|
14833
|
-
/* @__PURE__ */
|
|
14834
|
-
menu2 ? /* @__PURE__ */
|
|
14881
|
+
return /* @__PURE__ */ jsxs48(Fragment11, { children: [
|
|
14882
|
+
/* @__PURE__ */ jsx76(HexModalBackground, { css: IntegrationModalHeaderSVGBackground, role: "presentation" }),
|
|
14883
|
+
/* @__PURE__ */ jsx76("div", { css: IntegrationModalHeaderGroup, children: /* @__PURE__ */ jsxs48("div", { css: IntegrationModalHeaderTitleGroup, children: [
|
|
14884
|
+
icon ? /* @__PURE__ */ jsx76(IntegrationModalIcon, { icon, name: name || "" }) : null,
|
|
14885
|
+
/* @__PURE__ */ jsx76(Heading, { level: 3, css: IntegrationModalHeaderTitle, "data-testid": "integration-modal-title", children: name || "Create Team Integration" }),
|
|
14886
|
+
menu2 ? /* @__PURE__ */ jsxs48("div", { css: IntegrationModalHeaderMenuPlacement, children: [
|
|
14835
14887
|
menu2,
|
|
14836
14888
|
" "
|
|
14837
14889
|
] }) : null
|
|
14838
14890
|
] }) }),
|
|
14839
|
-
/* @__PURE__ */
|
|
14891
|
+
/* @__PURE__ */ jsx76("div", { css: IntegrationModalHeaderContentWrapper, children })
|
|
14840
14892
|
] });
|
|
14841
14893
|
};
|
|
14842
14894
|
|
|
14843
14895
|
// src/components/JsonEditor/JsonEditor.tsx
|
|
14844
14896
|
import MonacoEditor from "@monaco-editor/react";
|
|
14845
|
-
import { jsx as
|
|
14897
|
+
import { jsx as jsx77 } from "@emotion/react/jsx-runtime";
|
|
14846
14898
|
var minEditorHeightPx = 150;
|
|
14847
14899
|
var JsonEditor = ({ defaultValue, onChange, jsonSchema, height, readOnly }) => {
|
|
14848
14900
|
let effectiveHeight = height;
|
|
@@ -14852,7 +14904,7 @@ var JsonEditor = ({ defaultValue, onChange, jsonSchema, height, readOnly }) => {
|
|
|
14852
14904
|
if (typeof effectiveHeight === "number" && effectiveHeight < minEditorHeightPx) {
|
|
14853
14905
|
effectiveHeight = minEditorHeightPx;
|
|
14854
14906
|
}
|
|
14855
|
-
return /* @__PURE__ */
|
|
14907
|
+
return /* @__PURE__ */ jsx77(
|
|
14856
14908
|
MonacoEditor,
|
|
14857
14909
|
{
|
|
14858
14910
|
height: effectiveHeight,
|
|
@@ -14889,39 +14941,39 @@ var JsonEditor = ({ defaultValue, onChange, jsonSchema, height, readOnly }) => {
|
|
|
14889
14941
|
};
|
|
14890
14942
|
|
|
14891
14943
|
// src/components/LimitsBar/LimitsBar.styles.ts
|
|
14892
|
-
import { css as
|
|
14893
|
-
var LimitsBarContainer =
|
|
14944
|
+
import { css as css63 } from "@emotion/react";
|
|
14945
|
+
var LimitsBarContainer = css63`
|
|
14894
14946
|
margin-block: var(--spacing-sm);
|
|
14895
14947
|
`;
|
|
14896
|
-
var LimitsBarProgressBar =
|
|
14948
|
+
var LimitsBarProgressBar = css63`
|
|
14897
14949
|
background: var(--gray-100);
|
|
14898
14950
|
margin-top: var(--spacing-sm);
|
|
14899
14951
|
position: relative;
|
|
14900
14952
|
overflow: hidden;
|
|
14901
14953
|
height: 0.25rem;
|
|
14902
14954
|
`;
|
|
14903
|
-
var LimitsBarProgressBarLine =
|
|
14955
|
+
var LimitsBarProgressBarLine = css63`
|
|
14904
14956
|
position: absolute;
|
|
14905
14957
|
inset: 0;
|
|
14906
14958
|
transition: transform var(--duration-fast) var(--timing-ease-out);
|
|
14907
14959
|
`;
|
|
14908
|
-
var LimitsBarLabelContainer =
|
|
14960
|
+
var LimitsBarLabelContainer = css63`
|
|
14909
14961
|
display: flex;
|
|
14910
14962
|
justify-content: space-between;
|
|
14911
14963
|
font-weight: var(--fw-bold);
|
|
14912
14964
|
`;
|
|
14913
|
-
var LimitsBarLabel =
|
|
14965
|
+
var LimitsBarLabel = css63`
|
|
14914
14966
|
font-size: var(--fs-baase);
|
|
14915
14967
|
`;
|
|
14916
|
-
var LimitsBarBgColor = (statusColor) =>
|
|
14968
|
+
var LimitsBarBgColor = (statusColor) => css63`
|
|
14917
14969
|
background: ${statusColor};
|
|
14918
14970
|
`;
|
|
14919
|
-
var LimitsBarTextColor = (statusColor) =>
|
|
14971
|
+
var LimitsBarTextColor = (statusColor) => css63`
|
|
14920
14972
|
color: ${statusColor};
|
|
14921
14973
|
`;
|
|
14922
14974
|
|
|
14923
14975
|
// src/components/LimitsBar/LimitsBar.tsx
|
|
14924
|
-
import { jsx as
|
|
14976
|
+
import { jsx as jsx78, jsxs as jsxs49 } from "@emotion/react/jsx-runtime";
|
|
14925
14977
|
var LimitsBar = ({ current, max, label }) => {
|
|
14926
14978
|
const maxPercentage = 100;
|
|
14927
14979
|
const progressBarValue = Math.ceil(current / max * maxPercentage);
|
|
@@ -14932,16 +14984,16 @@ var LimitsBar = ({ current, max, label }) => {
|
|
|
14932
14984
|
danger: "var(--brand-secondary-5)"
|
|
14933
14985
|
};
|
|
14934
14986
|
const statusColor = progressBarValue === 100 ? colorMap.danger : progressBarValue >= 75 ? colorMap.warn : colorMap.base;
|
|
14935
|
-
return /* @__PURE__ */
|
|
14936
|
-
/* @__PURE__ */
|
|
14937
|
-
/* @__PURE__ */
|
|
14938
|
-
/* @__PURE__ */
|
|
14987
|
+
return /* @__PURE__ */ jsxs49("div", { css: LimitsBarContainer, children: [
|
|
14988
|
+
/* @__PURE__ */ jsxs49("div", { css: LimitsBarLabelContainer, children: [
|
|
14989
|
+
/* @__PURE__ */ jsx78("span", { css: LimitsBarLabel, children: label }),
|
|
14990
|
+
/* @__PURE__ */ jsxs49("span", { css: [LimitsBarLabel, LimitsBarTextColor(statusColor)], children: [
|
|
14939
14991
|
current,
|
|
14940
14992
|
" of ",
|
|
14941
14993
|
max
|
|
14942
14994
|
] })
|
|
14943
14995
|
] }),
|
|
14944
|
-
/* @__PURE__ */
|
|
14996
|
+
/* @__PURE__ */ jsx78(
|
|
14945
14997
|
"div",
|
|
14946
14998
|
{
|
|
14947
14999
|
role: "progressbar",
|
|
@@ -14950,7 +15002,7 @@ var LimitsBar = ({ current, max, label }) => {
|
|
|
14950
15002
|
"aria-valuemax": max,
|
|
14951
15003
|
"aria-valuetext": `${current} of ${max}`,
|
|
14952
15004
|
css: LimitsBarProgressBar,
|
|
14953
|
-
children: /* @__PURE__ */
|
|
15005
|
+
children: /* @__PURE__ */ jsx78(
|
|
14954
15006
|
"span",
|
|
14955
15007
|
{
|
|
14956
15008
|
role: "presentation",
|
|
@@ -14966,8 +15018,8 @@ var LimitsBar = ({ current, max, label }) => {
|
|
|
14966
15018
|
};
|
|
14967
15019
|
|
|
14968
15020
|
// src/components/LinkList/LinkList.styles.ts
|
|
14969
|
-
import { css as
|
|
14970
|
-
var LinkListContainer = (padding) =>
|
|
15021
|
+
import { css as css64 } from "@emotion/react";
|
|
15022
|
+
var LinkListContainer = (padding) => css64`
|
|
14971
15023
|
padding: ${padding};
|
|
14972
15024
|
|
|
14973
15025
|
${mq("sm")} {
|
|
@@ -14975,30 +15027,30 @@ var LinkListContainer = (padding) => css63`
|
|
|
14975
15027
|
grid-row: 1 / last-line;
|
|
14976
15028
|
}
|
|
14977
15029
|
`;
|
|
14978
|
-
var LinkListTitle =
|
|
15030
|
+
var LinkListTitle = css64`
|
|
14979
15031
|
font-weight: var(--fw-bold);
|
|
14980
15032
|
font-size: var(--fs-sm);
|
|
14981
15033
|
text-transform: uppercase;
|
|
14982
15034
|
`;
|
|
14983
15035
|
|
|
14984
15036
|
// src/components/LinkList/LinkList.tsx
|
|
14985
|
-
import { jsx as
|
|
15037
|
+
import { jsx as jsx79, jsxs as jsxs50 } from "@emotion/react/jsx-runtime";
|
|
14986
15038
|
var LinkList = ({ title, padding = "var(--spacing-md)", children, ...props }) => {
|
|
14987
|
-
return /* @__PURE__ */
|
|
14988
|
-
/* @__PURE__ */
|
|
15039
|
+
return /* @__PURE__ */ jsxs50("div", { css: LinkListContainer(padding), ...props, children: [
|
|
15040
|
+
/* @__PURE__ */ jsx79(Heading, { level: 3, css: LinkListTitle, children: title }),
|
|
14989
15041
|
children
|
|
14990
15042
|
] });
|
|
14991
15043
|
};
|
|
14992
15044
|
|
|
14993
15045
|
// src/components/List/ScrollableList.tsx
|
|
14994
|
-
import { css as
|
|
15046
|
+
import { css as css66 } from "@emotion/react";
|
|
14995
15047
|
|
|
14996
15048
|
// src/components/List/styles/ScrollableList.styles.ts
|
|
14997
|
-
import { css as
|
|
14998
|
-
var ScrollableListContainer =
|
|
15049
|
+
import { css as css65 } from "@emotion/react";
|
|
15050
|
+
var ScrollableListContainer = css65`
|
|
14999
15051
|
position: relative;
|
|
15000
15052
|
`;
|
|
15001
|
-
var ScrollableListInner =
|
|
15053
|
+
var ScrollableListInner = css65`
|
|
15002
15054
|
background: var(--gray-50);
|
|
15003
15055
|
border-top: 1px solid var(--gray-200);
|
|
15004
15056
|
border-bottom: 1px solid var(--gray-200);
|
|
@@ -15021,19 +15073,19 @@ var ScrollableListInner = css64`
|
|
|
15021
15073
|
`;
|
|
15022
15074
|
|
|
15023
15075
|
// src/components/List/ScrollableList.tsx
|
|
15024
|
-
import { jsx as
|
|
15076
|
+
import { jsx as jsx80, jsxs as jsxs51 } from "@emotion/react/jsx-runtime";
|
|
15025
15077
|
var ScrollableList = ({ label, children, ...props }) => {
|
|
15026
|
-
return /* @__PURE__ */
|
|
15027
|
-
label ? /* @__PURE__ */
|
|
15078
|
+
return /* @__PURE__ */ jsxs51("div", { css: [ScrollableListContainer, scrollbarStyles], ...props, children: [
|
|
15079
|
+
label ? /* @__PURE__ */ jsx80(
|
|
15028
15080
|
"span",
|
|
15029
15081
|
{
|
|
15030
|
-
css:
|
|
15082
|
+
css: css66`
|
|
15031
15083
|
${labelText}
|
|
15032
15084
|
`,
|
|
15033
15085
|
children: label
|
|
15034
15086
|
}
|
|
15035
15087
|
) : null,
|
|
15036
|
-
/* @__PURE__ */
|
|
15088
|
+
/* @__PURE__ */ jsx80("div", { css: [ScrollableListInner, scrollbarStyles], children })
|
|
15037
15089
|
] });
|
|
15038
15090
|
};
|
|
15039
15091
|
|
|
@@ -15041,8 +15093,8 @@ var ScrollableList = ({ label, children, ...props }) => {
|
|
|
15041
15093
|
import { CgCheck as CgCheck2 } from "@react-icons/all-files/cg/CgCheck";
|
|
15042
15094
|
|
|
15043
15095
|
// src/components/List/styles/ScrollableListItem.styles.ts
|
|
15044
|
-
import { css as
|
|
15045
|
-
var ScrollableListItemContainer =
|
|
15096
|
+
import { css as css67 } from "@emotion/react";
|
|
15097
|
+
var ScrollableListItemContainer = css67`
|
|
15046
15098
|
align-items: center;
|
|
15047
15099
|
background: var(--white);
|
|
15048
15100
|
border-radius: var(--rounded-base);
|
|
@@ -15051,13 +15103,13 @@ var ScrollableListItemContainer = css66`
|
|
|
15051
15103
|
min-height: 52px;
|
|
15052
15104
|
transition: border-color var(--duration-fast) var(--timing-ease-out);
|
|
15053
15105
|
`;
|
|
15054
|
-
var ScrollableListItemShadow =
|
|
15106
|
+
var ScrollableListItemShadow = css67`
|
|
15055
15107
|
box-shadow: var(--shadow-base);
|
|
15056
15108
|
`;
|
|
15057
|
-
var ScrollableListItemActive =
|
|
15109
|
+
var ScrollableListItemActive = css67`
|
|
15058
15110
|
border-color: var(--brand-secondary-3);
|
|
15059
15111
|
`;
|
|
15060
|
-
var ScrollableListItemBtn =
|
|
15112
|
+
var ScrollableListItemBtn = css67`
|
|
15061
15113
|
align-items: center;
|
|
15062
15114
|
border: none;
|
|
15063
15115
|
background: transparent;
|
|
@@ -15072,27 +15124,27 @@ var ScrollableListItemBtn = css66`
|
|
|
15072
15124
|
outline: none;
|
|
15073
15125
|
}
|
|
15074
15126
|
`;
|
|
15075
|
-
var ScrollableListInputLabel =
|
|
15127
|
+
var ScrollableListInputLabel = css67`
|
|
15076
15128
|
align-items: center;
|
|
15077
15129
|
cursor: pointer;
|
|
15078
15130
|
display: flex;
|
|
15079
15131
|
padding: var(--spacing-xs) var(--spacing-base) var(--spacing-xs);
|
|
15080
15132
|
flex-grow: 1;
|
|
15081
15133
|
`;
|
|
15082
|
-
var ScrollableListInputText =
|
|
15134
|
+
var ScrollableListInputText = css67`
|
|
15083
15135
|
align-items: center;
|
|
15084
15136
|
display: flex;
|
|
15085
15137
|
gap: var(--spacing-sm);
|
|
15086
15138
|
flex-grow: 1;
|
|
15087
15139
|
flex-wrap: wrap;
|
|
15088
15140
|
`;
|
|
15089
|
-
var ScrollableListHiddenInput =
|
|
15141
|
+
var ScrollableListHiddenInput = css67`
|
|
15090
15142
|
position: absolute;
|
|
15091
15143
|
height: 0;
|
|
15092
15144
|
width: 0;
|
|
15093
15145
|
opacity: 0;
|
|
15094
15146
|
`;
|
|
15095
|
-
var ScrollableListIcon =
|
|
15147
|
+
var ScrollableListIcon = css67`
|
|
15096
15148
|
border-radius: var(--rounded-full);
|
|
15097
15149
|
background: var(--brand-secondary-3);
|
|
15098
15150
|
color: var(--white);
|
|
@@ -15100,12 +15152,12 @@ var ScrollableListIcon = css66`
|
|
|
15100
15152
|
min-width: 24px;
|
|
15101
15153
|
opacity: 0;
|
|
15102
15154
|
`;
|
|
15103
|
-
var ScrollableListIconVisible =
|
|
15155
|
+
var ScrollableListIconVisible = css67`
|
|
15104
15156
|
animation: ${fadeInBottom} var(--duration-fast) var(--timing-ease-out) forwards;
|
|
15105
15157
|
`;
|
|
15106
15158
|
|
|
15107
15159
|
// src/components/List/ScrollableListInputItem.tsx
|
|
15108
|
-
import { jsx as
|
|
15160
|
+
import { jsx as jsx81, jsxs as jsxs52 } from "@emotion/react/jsx-runtime";
|
|
15109
15161
|
var ScrollableListInputItem = ({
|
|
15110
15162
|
label,
|
|
15111
15163
|
icon,
|
|
@@ -15115,7 +15167,7 @@ var ScrollableListInputItem = ({
|
|
|
15115
15167
|
labelTestId,
|
|
15116
15168
|
...props
|
|
15117
15169
|
}) => {
|
|
15118
|
-
return /* @__PURE__ */
|
|
15170
|
+
return /* @__PURE__ */ jsx81(
|
|
15119
15171
|
"div",
|
|
15120
15172
|
{
|
|
15121
15173
|
css: [
|
|
@@ -15124,13 +15176,13 @@ var ScrollableListInputItem = ({
|
|
|
15124
15176
|
active ? ScrollableListItemActive : void 0
|
|
15125
15177
|
],
|
|
15126
15178
|
...props,
|
|
15127
|
-
children: /* @__PURE__ */
|
|
15128
|
-
/* @__PURE__ */
|
|
15179
|
+
children: /* @__PURE__ */ jsxs52("label", { "data-testid": labelTestId, css: ScrollableListInputLabel, children: [
|
|
15180
|
+
/* @__PURE__ */ jsxs52("span", { css: ScrollableListInputText, children: [
|
|
15129
15181
|
icon,
|
|
15130
15182
|
label
|
|
15131
15183
|
] }),
|
|
15132
|
-
/* @__PURE__ */
|
|
15133
|
-
/* @__PURE__ */
|
|
15184
|
+
/* @__PURE__ */ jsx81("div", { css: ScrollableListHiddenInput, children }),
|
|
15185
|
+
/* @__PURE__ */ jsx81(
|
|
15134
15186
|
Icon,
|
|
15135
15187
|
{
|
|
15136
15188
|
icon: CgCheck2,
|
|
@@ -15148,14 +15200,14 @@ var ScrollableListInputItem = ({
|
|
|
15148
15200
|
|
|
15149
15201
|
// src/components/List/ScrollableListItem.tsx
|
|
15150
15202
|
import { CgCheck as CgCheck3 } from "@react-icons/all-files/cg/CgCheck";
|
|
15151
|
-
import { jsx as
|
|
15203
|
+
import { jsx as jsx82, jsxs as jsxs53 } from "@emotion/react/jsx-runtime";
|
|
15152
15204
|
var ScrollableListItem = ({
|
|
15153
15205
|
buttonText,
|
|
15154
15206
|
active,
|
|
15155
15207
|
disableShadow,
|
|
15156
15208
|
...props
|
|
15157
15209
|
}) => {
|
|
15158
|
-
return /* @__PURE__ */
|
|
15210
|
+
return /* @__PURE__ */ jsx82(
|
|
15159
15211
|
"div",
|
|
15160
15212
|
{
|
|
15161
15213
|
css: [
|
|
@@ -15163,9 +15215,9 @@ var ScrollableListItem = ({
|
|
|
15163
15215
|
disableShadow ? void 0 : ScrollableListItemShadow,
|
|
15164
15216
|
active ? ScrollableListItemActive : void 0
|
|
15165
15217
|
],
|
|
15166
|
-
children: /* @__PURE__ */
|
|
15167
|
-
/* @__PURE__ */
|
|
15168
|
-
/* @__PURE__ */
|
|
15218
|
+
children: /* @__PURE__ */ jsxs53("button", { css: ScrollableListItemBtn, type: "button", ...props, children: [
|
|
15219
|
+
/* @__PURE__ */ jsx82("span", { children: buttonText }),
|
|
15220
|
+
/* @__PURE__ */ jsx82(
|
|
15169
15221
|
Icon,
|
|
15170
15222
|
{
|
|
15171
15223
|
icon: CgCheck3,
|
|
@@ -15180,7 +15232,7 @@ var ScrollableListItem = ({
|
|
|
15180
15232
|
};
|
|
15181
15233
|
|
|
15182
15234
|
// src/components/LoadingIndicator/LoadingIndicator.styles.ts
|
|
15183
|
-
import { css as
|
|
15235
|
+
import { css as css68, keyframes as keyframes3 } from "@emotion/react";
|
|
15184
15236
|
function bounceFade(size) {
|
|
15185
15237
|
const bounceHeight = size === "lg" ? 10 : 5;
|
|
15186
15238
|
return keyframes3`
|
|
@@ -15201,13 +15253,13 @@ function bounceFade(size) {
|
|
|
15201
15253
|
}
|
|
15202
15254
|
`;
|
|
15203
15255
|
}
|
|
15204
|
-
var loader =
|
|
15256
|
+
var loader = css68`
|
|
15205
15257
|
display: inline-flex;
|
|
15206
15258
|
justify-content: center;
|
|
15207
15259
|
`;
|
|
15208
15260
|
function loadingDot(size) {
|
|
15209
15261
|
const dotSize = size === "lg" ? 8 : 4;
|
|
15210
|
-
return
|
|
15262
|
+
return css68`
|
|
15211
15263
|
background-color: var(--gray-700);
|
|
15212
15264
|
display: block;
|
|
15213
15265
|
border-radius: var(--rounded-full);
|
|
@@ -15232,16 +15284,16 @@ function loadingDot(size) {
|
|
|
15232
15284
|
}
|
|
15233
15285
|
|
|
15234
15286
|
// src/components/LoadingIndicator/LoadingIndicator.tsx
|
|
15235
|
-
import { jsx as
|
|
15287
|
+
import { jsx as jsx83, jsxs as jsxs54 } from "@emotion/react/jsx-runtime";
|
|
15236
15288
|
var LoadingIndicator = ({
|
|
15237
15289
|
size = "lg",
|
|
15238
15290
|
...props
|
|
15239
15291
|
}) => {
|
|
15240
15292
|
const dotStyle = loadingDot(size);
|
|
15241
|
-
return /* @__PURE__ */
|
|
15242
|
-
/* @__PURE__ */
|
|
15243
|
-
/* @__PURE__ */
|
|
15244
|
-
/* @__PURE__ */
|
|
15293
|
+
return /* @__PURE__ */ jsxs54("div", { role: "alert", css: loader, "data-testid": "loading-indicator", ...props, children: [
|
|
15294
|
+
/* @__PURE__ */ jsx83("span", { css: dotStyle }),
|
|
15295
|
+
/* @__PURE__ */ jsx83("span", { css: dotStyle }),
|
|
15296
|
+
/* @__PURE__ */ jsx83("span", { css: dotStyle })
|
|
15245
15297
|
] });
|
|
15246
15298
|
};
|
|
15247
15299
|
|
|
@@ -15249,8 +15301,8 @@ var LoadingIndicator = ({
|
|
|
15249
15301
|
import { useCallback as useCallback2, useEffect as useEffect8, useRef as useRef5 } from "react";
|
|
15250
15302
|
|
|
15251
15303
|
// src/components/LoadingOverlay/LoadingOverlay.styles.ts
|
|
15252
|
-
import { css as
|
|
15253
|
-
var loadingOverlayContainer =
|
|
15304
|
+
import { css as css69 } from "@emotion/react";
|
|
15305
|
+
var loadingOverlayContainer = css69`
|
|
15254
15306
|
position: absolute;
|
|
15255
15307
|
inset: 0;
|
|
15256
15308
|
overflow: hidden;
|
|
@@ -15258,30 +15310,30 @@ var loadingOverlayContainer = css68`
|
|
|
15258
15310
|
padding: var(--spacing-xl);
|
|
15259
15311
|
overflow-y: auto;
|
|
15260
15312
|
`;
|
|
15261
|
-
var loadingOverlayVisible =
|
|
15313
|
+
var loadingOverlayVisible = css69`
|
|
15262
15314
|
display: flex;
|
|
15263
15315
|
`;
|
|
15264
|
-
var loadingOverlayHidden =
|
|
15316
|
+
var loadingOverlayHidden = css69`
|
|
15265
15317
|
display: none;
|
|
15266
15318
|
`;
|
|
15267
|
-
var loadingOverlayBackground = (bgColor) =>
|
|
15319
|
+
var loadingOverlayBackground = (bgColor) => css69`
|
|
15268
15320
|
background: ${bgColor};
|
|
15269
15321
|
opacity: 0.92;
|
|
15270
15322
|
position: absolute;
|
|
15271
15323
|
inset: 0 0;
|
|
15272
15324
|
`;
|
|
15273
|
-
var loadingOverlayBody =
|
|
15325
|
+
var loadingOverlayBody = css69`
|
|
15274
15326
|
align-items: center;
|
|
15275
15327
|
display: flex;
|
|
15276
15328
|
flex-direction: column;
|
|
15277
15329
|
`;
|
|
15278
|
-
var loadingOverlayMessage =
|
|
15330
|
+
var loadingOverlayMessage = css69`
|
|
15279
15331
|
color: var(--gray-600);
|
|
15280
15332
|
margin: var(--spacing-base) 0 0;
|
|
15281
15333
|
`;
|
|
15282
15334
|
|
|
15283
15335
|
// src/components/LoadingOverlay/LoadingOverlay.tsx
|
|
15284
|
-
import { jsx as
|
|
15336
|
+
import { jsx as jsx84, jsxs as jsxs55 } from "@emotion/react/jsx-runtime";
|
|
15285
15337
|
var LoadingOverlay = ({
|
|
15286
15338
|
isActive,
|
|
15287
15339
|
statusMessage,
|
|
@@ -15307,7 +15359,7 @@ var LoadingOverlay = ({
|
|
|
15307
15359
|
(_f = lottieRef.current) == null ? void 0 : _f.stop();
|
|
15308
15360
|
}
|
|
15309
15361
|
}, [isPaused]);
|
|
15310
|
-
return /* @__PURE__ */
|
|
15362
|
+
return /* @__PURE__ */ jsxs55(
|
|
15311
15363
|
"div",
|
|
15312
15364
|
{
|
|
15313
15365
|
role: "alert",
|
|
@@ -15315,9 +15367,9 @@ var LoadingOverlay = ({
|
|
|
15315
15367
|
"aria-hidden": !isActive,
|
|
15316
15368
|
"aria-busy": isActive && !isPaused,
|
|
15317
15369
|
children: [
|
|
15318
|
-
/* @__PURE__ */
|
|
15319
|
-
/* @__PURE__ */
|
|
15320
|
-
/* @__PURE__ */
|
|
15370
|
+
/* @__PURE__ */ jsx84("div", { css: loadingOverlayBackground(overlayBackgroundColor) }),
|
|
15371
|
+
/* @__PURE__ */ jsx84("div", { css: { position: "relative", maxWidth: "100%", margin: isTopAligned ? "0" : "auto" }, children: /* @__PURE__ */ jsxs55("div", { css: loadingOverlayBody, children: [
|
|
15372
|
+
/* @__PURE__ */ jsx84(
|
|
15321
15373
|
AnimationFile,
|
|
15322
15374
|
{
|
|
15323
15375
|
lottieRef,
|
|
@@ -15332,15 +15384,15 @@ var LoadingOverlay = ({
|
|
|
15332
15384
|
}
|
|
15333
15385
|
}
|
|
15334
15386
|
),
|
|
15335
|
-
statusMessage ? /* @__PURE__ */
|
|
15336
|
-
/* @__PURE__ */
|
|
15387
|
+
statusMessage ? /* @__PURE__ */ jsx84("div", { css: loadingOverlayMessage, children: statusMessage }) : null,
|
|
15388
|
+
/* @__PURE__ */ jsx84("div", { css: { width: "100%", marginTop: "var(--spacing-md)" }, children })
|
|
15337
15389
|
] }) })
|
|
15338
15390
|
]
|
|
15339
15391
|
}
|
|
15340
15392
|
);
|
|
15341
15393
|
};
|
|
15342
15394
|
var LoadingIcon = ({ height, width, ...props }) => {
|
|
15343
|
-
return /* @__PURE__ */
|
|
15395
|
+
return /* @__PURE__ */ jsx84(
|
|
15344
15396
|
"svg",
|
|
15345
15397
|
{
|
|
15346
15398
|
viewBox: "0 0 38 38",
|
|
@@ -15350,9 +15402,9 @@ var LoadingIcon = ({ height, width, ...props }) => {
|
|
|
15350
15402
|
stroke: "currentColor",
|
|
15351
15403
|
...props,
|
|
15352
15404
|
"data-testid": "loading-icon",
|
|
15353
|
-
children: /* @__PURE__ */
|
|
15354
|
-
/* @__PURE__ */
|
|
15355
|
-
/* @__PURE__ */
|
|
15405
|
+
children: /* @__PURE__ */ jsx84("g", { fill: "none", fillRule: "evenodd", children: /* @__PURE__ */ jsxs55("g", { transform: "translate(1 1)", strokeWidth: "2", children: [
|
|
15406
|
+
/* @__PURE__ */ jsx84("circle", { strokeOpacity: ".25", cx: "18", cy: "18", r: "18" }),
|
|
15407
|
+
/* @__PURE__ */ jsx84("path", { d: "M36 18c0-9.94-8.06-18-18-18", transform: "rotate(166.645 18 18)", children: /* @__PURE__ */ jsx84(
|
|
15356
15408
|
"animateTransform",
|
|
15357
15409
|
{
|
|
15358
15410
|
attributeName: "transform",
|
|
@@ -15368,13 +15420,179 @@ var LoadingIcon = ({ height, width, ...props }) => {
|
|
|
15368
15420
|
);
|
|
15369
15421
|
};
|
|
15370
15422
|
|
|
15423
|
+
// src/components/Popover/Popover.tsx
|
|
15424
|
+
import {
|
|
15425
|
+
Popover as ReakitPopover,
|
|
15426
|
+
PopoverDisclosure,
|
|
15427
|
+
usePopoverState
|
|
15428
|
+
} from "reakit/Popover";
|
|
15429
|
+
|
|
15430
|
+
// src/components/Popover/Popover.styles.ts
|
|
15431
|
+
import { css as css70 } from "@emotion/react";
|
|
15432
|
+
var PopoverBtn = css70`
|
|
15433
|
+
border: none;
|
|
15434
|
+
background: none;
|
|
15435
|
+
`;
|
|
15436
|
+
var PopoverDefaulterTriggerBtn = css70`
|
|
15437
|
+
border: none;
|
|
15438
|
+
background: none;
|
|
15439
|
+
padding: var(--spacing-2xs);
|
|
15440
|
+
border-radius: var(--rounded-full);
|
|
15441
|
+
|
|
15442
|
+
&:hover {
|
|
15443
|
+
background-color: rgba(0, 0, 0, 0.05);
|
|
15444
|
+
}
|
|
15445
|
+
`;
|
|
15446
|
+
var Popover = css70`
|
|
15447
|
+
border-left: var(--spacing-xs) solid var(--brand-secondary-3);
|
|
15448
|
+
border-radius: var(--rounded-base);
|
|
15449
|
+
box-shadow: var(--shadow-base);
|
|
15450
|
+
background: var(--white);
|
|
15451
|
+
display: grid;
|
|
15452
|
+
gap: var(--spacing-sm);
|
|
15453
|
+
padding: var(--spacing-sm);
|
|
15454
|
+
font-size: var(--fs-sm);
|
|
15455
|
+
max-width: 220px;
|
|
15456
|
+
z-index: var(--z-tooltip);
|
|
15457
|
+
`;
|
|
15458
|
+
|
|
15459
|
+
// src/components/Popover/Popover.tsx
|
|
15460
|
+
import { Fragment as Fragment12, jsx as jsx85, jsxs as jsxs56 } from "@emotion/react/jsx-runtime";
|
|
15461
|
+
var Popover2 = ({
|
|
15462
|
+
iconColor = "action",
|
|
15463
|
+
icon = "info",
|
|
15464
|
+
iconSize = "1rem",
|
|
15465
|
+
buttonText,
|
|
15466
|
+
ariaLabel,
|
|
15467
|
+
placement = "bottom",
|
|
15468
|
+
testId,
|
|
15469
|
+
trigger,
|
|
15470
|
+
children,
|
|
15471
|
+
...otherProps
|
|
15472
|
+
}) => {
|
|
15473
|
+
const popover = usePopoverState({ placement });
|
|
15474
|
+
return /* @__PURE__ */ jsxs56(Fragment12, { children: [
|
|
15475
|
+
/* @__PURE__ */ jsx85(
|
|
15476
|
+
PopoverDisclosure,
|
|
15477
|
+
{
|
|
15478
|
+
...popover,
|
|
15479
|
+
css: [PopoverBtn, trigger ? void 0 : PopoverDefaulterTriggerBtn],
|
|
15480
|
+
title: buttonText,
|
|
15481
|
+
"data-testid": testId,
|
|
15482
|
+
children: trigger ? trigger : /* @__PURE__ */ jsxs56(Fragment12, { children: [
|
|
15483
|
+
/* @__PURE__ */ jsx85(Icon, { icon, iconColor, size: iconSize }),
|
|
15484
|
+
/* @__PURE__ */ jsx85("span", { hidden: true, children: buttonText })
|
|
15485
|
+
] })
|
|
15486
|
+
}
|
|
15487
|
+
),
|
|
15488
|
+
/* @__PURE__ */ jsx85(ReakitPopover, { css: Popover, ...otherProps, ...popover, role: "tooltip", "aria-label": ariaLabel, children })
|
|
15489
|
+
] });
|
|
15490
|
+
};
|
|
15491
|
+
|
|
15492
|
+
// src/components/MediaCard/MediaCard.styles.ts
|
|
15493
|
+
import { css as css71 } from "@emotion/react";
|
|
15494
|
+
var cardBaseStyles = css71`
|
|
15495
|
+
display: flex;
|
|
15496
|
+
flex-direction: column;
|
|
15497
|
+
justify-content: flex-start;
|
|
15498
|
+
align-items: stretch;
|
|
15499
|
+
aspect-ratio: 4/3;
|
|
15500
|
+
padding: 0;
|
|
15501
|
+
min-height: unset;
|
|
15502
|
+
outline: none;
|
|
15503
|
+
|
|
15504
|
+
&:focus-visible {
|
|
15505
|
+
outline: 2px solid var(--primary-action-default);
|
|
15506
|
+
}
|
|
15507
|
+
`;
|
|
15508
|
+
var cardBaseCoverIconWrapperStyles = css71`
|
|
15509
|
+
position: relative;
|
|
15510
|
+
display: flex;
|
|
15511
|
+
align-items: center;
|
|
15512
|
+
justify-content: center;
|
|
15513
|
+
flex: 1;
|
|
15514
|
+
background-color: var(--gray-50);
|
|
15515
|
+
overflow: hidden;
|
|
15516
|
+
border-radius: 3px 3px 0 0;
|
|
15517
|
+
padding: var(--spacing-sm);
|
|
15518
|
+
cursor: pointer;
|
|
15519
|
+
`;
|
|
15520
|
+
var cardBaseContentStyles = css71`
|
|
15521
|
+
padding: var(--spacing-sm);
|
|
15522
|
+
`;
|
|
15523
|
+
var cardBaseTitleStyles = css71`
|
|
15524
|
+
font-size: var(--fs-sm);
|
|
15525
|
+
color: var(--gray-500);
|
|
15526
|
+
cursor: pointer;
|
|
15527
|
+
`;
|
|
15528
|
+
var cardBaseSubtitleStyles = css71`
|
|
15529
|
+
font-size: var(--fs-xs);
|
|
15530
|
+
color: var(--gray-500);
|
|
15531
|
+
`;
|
|
15532
|
+
var cardBaseMenuButtonStyles = css71`
|
|
15533
|
+
padding: var(--spacing-2xs);
|
|
15534
|
+
border-radius: var(--rounded-sm);
|
|
15535
|
+
border-width: 0;
|
|
15536
|
+
background-color: transparent;
|
|
15537
|
+
|
|
15538
|
+
&:hover {
|
|
15539
|
+
background-color: rgba(0, 0, 0, 0.05);
|
|
15540
|
+
}
|
|
15541
|
+
`;
|
|
15542
|
+
|
|
15543
|
+
// src/components/MediaCard/MediaCard.tsx
|
|
15544
|
+
import { jsx as jsx86, jsxs as jsxs57 } from "@emotion/react/jsx-runtime";
|
|
15545
|
+
var MediaCard = ({
|
|
15546
|
+
title,
|
|
15547
|
+
subtitle,
|
|
15548
|
+
infoPopover,
|
|
15549
|
+
cover,
|
|
15550
|
+
menuItems,
|
|
15551
|
+
sideSection,
|
|
15552
|
+
onClick,
|
|
15553
|
+
...cardProps
|
|
15554
|
+
}) => {
|
|
15555
|
+
return /* @__PURE__ */ jsxs57(Card, { tag: "button", css: cardBaseStyles, ...cardProps, onClick, children: [
|
|
15556
|
+
/* @__PURE__ */ jsx86("div", { css: cardBaseCoverIconWrapperStyles, children: cover }),
|
|
15557
|
+
/* @__PURE__ */ jsx86("div", { css: cardBaseContentStyles, children: /* @__PURE__ */ jsxs57(HorizontalRhythm, { gap: "sm", justify: "space-between", align: "center", css: { width: "100%" }, children: [
|
|
15558
|
+
/* @__PURE__ */ jsxs57(VerticalRhythm, { gap: "0", align: "flex-start", css: { flex: 1 }, children: [
|
|
15559
|
+
/* @__PURE__ */ jsxs57(HorizontalRhythm, { gap: "xs", align: "center", children: [
|
|
15560
|
+
/* @__PURE__ */ jsx86("div", { css: cardBaseTitleStyles, "data-testid": "card-title", children: title }),
|
|
15561
|
+
!infoPopover ? null : /* @__PURE__ */ jsx86("div", { css: { display: "flex", cursor: "default" }, onClick: (e) => e.stopPropagation(), children: /* @__PURE__ */ jsx86(
|
|
15562
|
+
Popover2,
|
|
15563
|
+
{
|
|
15564
|
+
baseId: `info-of-${title}`,
|
|
15565
|
+
buttonText: "Details",
|
|
15566
|
+
ariaLabel: "Details",
|
|
15567
|
+
iconColor: "default",
|
|
15568
|
+
tabIndex: 0,
|
|
15569
|
+
css: { display: "block" },
|
|
15570
|
+
children: /* @__PURE__ */ jsx86("div", { children: infoPopover })
|
|
15571
|
+
}
|
|
15572
|
+
) })
|
|
15573
|
+
] }),
|
|
15574
|
+
!subtitle ? null : /* @__PURE__ */ jsx86("div", { css: cardBaseSubtitleStyles, children: subtitle })
|
|
15575
|
+
] }),
|
|
15576
|
+
/* @__PURE__ */ jsx86("div", { css: { cursor: "default" }, onClick: (e) => e.stopPropagation(), children: sideSection }),
|
|
15577
|
+
/* @__PURE__ */ jsx86(VerticalRhythm, { align: "center", justify: "center", onClick: (e) => e.stopPropagation(), children: !menuItems || Array.isArray(menuItems) && !menuItems.length ? null : /* @__PURE__ */ jsx86(
|
|
15578
|
+
Menu,
|
|
15579
|
+
{
|
|
15580
|
+
menuTrigger: /* @__PURE__ */ jsx86("button", { type: "button", "aria-label": "More options", css: cardBaseMenuButtonStyles, children: /* @__PURE__ */ jsx86(Icon, { icon: "more-alt", iconColor: "gray", size: 16 }) }),
|
|
15581
|
+
menuLabel: `Menu of ${title}`,
|
|
15582
|
+
children: menuItems
|
|
15583
|
+
}
|
|
15584
|
+
) })
|
|
15585
|
+
] }) })
|
|
15586
|
+
] });
|
|
15587
|
+
};
|
|
15588
|
+
|
|
15371
15589
|
// src/components/Modal/Modal.tsx
|
|
15372
15590
|
import { CgClose as CgClose5 } from "@react-icons/all-files/cg/CgClose";
|
|
15373
15591
|
import React19 from "react";
|
|
15374
15592
|
|
|
15375
15593
|
// src/components/Modal/Modal.styles.ts
|
|
15376
|
-
import { css as
|
|
15377
|
-
var modalWrapperStyles =
|
|
15594
|
+
import { css as css72 } from "@emotion/react";
|
|
15595
|
+
var modalWrapperStyles = css72`
|
|
15378
15596
|
position: fixed;
|
|
15379
15597
|
inset: 0;
|
|
15380
15598
|
display: flex;
|
|
@@ -15382,13 +15600,13 @@ var modalWrapperStyles = css69`
|
|
|
15382
15600
|
justify-content: center;
|
|
15383
15601
|
z-index: var(--z-drawer);
|
|
15384
15602
|
`;
|
|
15385
|
-
var modalBackdropStyles =
|
|
15603
|
+
var modalBackdropStyles = css72`
|
|
15386
15604
|
position: absolute;
|
|
15387
15605
|
inset: 0;
|
|
15388
15606
|
background-color: var(--brand-secondary-1);
|
|
15389
15607
|
opacity: 0.4;
|
|
15390
15608
|
`;
|
|
15391
|
-
var modalStyles =
|
|
15609
|
+
var modalStyles = css72`
|
|
15392
15610
|
position: relative;
|
|
15393
15611
|
display: flex;
|
|
15394
15612
|
flex-direction: column;
|
|
@@ -15403,21 +15621,21 @@ var modalStyles = css69`
|
|
|
15403
15621
|
color: unset;
|
|
15404
15622
|
z-index: 1;
|
|
15405
15623
|
`;
|
|
15406
|
-
var modalHeaderStyles =
|
|
15624
|
+
var modalHeaderStyles = css72`
|
|
15407
15625
|
display: flex;
|
|
15408
15626
|
align-items: flex-start;
|
|
15409
15627
|
gap: var(--spacing-base);
|
|
15410
15628
|
font-size: var(--fs-md);
|
|
15411
15629
|
line-height: 1.2;
|
|
15412
15630
|
`;
|
|
15413
|
-
var modalCloseButtonStyles =
|
|
15631
|
+
var modalCloseButtonStyles = css72`
|
|
15414
15632
|
display: block;
|
|
15415
15633
|
padding: 0;
|
|
15416
15634
|
background: transparent;
|
|
15417
15635
|
border: none;
|
|
15418
15636
|
margin-left: auto;
|
|
15419
15637
|
`;
|
|
15420
|
-
var modalContentStyles =
|
|
15638
|
+
var modalContentStyles = css72`
|
|
15421
15639
|
flex: 1;
|
|
15422
15640
|
background-color: white;
|
|
15423
15641
|
padding: var(--spacing-md);
|
|
@@ -15426,7 +15644,7 @@ var modalContentStyles = css69`
|
|
|
15426
15644
|
`;
|
|
15427
15645
|
|
|
15428
15646
|
// src/components/Modal/Modal.tsx
|
|
15429
|
-
import { jsx as
|
|
15647
|
+
import { jsx as jsx87, jsxs as jsxs58 } from "@emotion/react/jsx-runtime";
|
|
15430
15648
|
var defaultModalWidth = "75rem";
|
|
15431
15649
|
var defaultModalHeight = "51rem";
|
|
15432
15650
|
var Modal = React19.forwardRef(
|
|
@@ -15445,12 +15663,12 @@ var Modal = React19.forwardRef(
|
|
|
15445
15663
|
handler: onRequestClose,
|
|
15446
15664
|
shortcut: "escape"
|
|
15447
15665
|
});
|
|
15448
|
-
return /* @__PURE__ */
|
|
15449
|
-
/* @__PURE__ */
|
|
15450
|
-
/* @__PURE__ */
|
|
15451
|
-
/* @__PURE__ */
|
|
15452
|
-
/* @__PURE__ */
|
|
15453
|
-
/* @__PURE__ */
|
|
15666
|
+
return /* @__PURE__ */ jsxs58("div", { css: [modalWrapperStyles, wrapperClassName], children: [
|
|
15667
|
+
/* @__PURE__ */ jsx87("div", { onClick: onRequestClose, css: modalBackdropStyles }),
|
|
15668
|
+
/* @__PURE__ */ jsxs58("dialog", { ref, css: modalStyles, style: { width, height }, ...modalProps, children: [
|
|
15669
|
+
/* @__PURE__ */ jsxs58("div", { css: modalHeaderStyles, children: [
|
|
15670
|
+
/* @__PURE__ */ jsx87("div", { children: header }),
|
|
15671
|
+
/* @__PURE__ */ jsx87(
|
|
15454
15672
|
Button,
|
|
15455
15673
|
{
|
|
15456
15674
|
type: "button",
|
|
@@ -15459,12 +15677,12 @@ var Modal = React19.forwardRef(
|
|
|
15459
15677
|
title: "Close dialog",
|
|
15460
15678
|
buttonType: "ghost",
|
|
15461
15679
|
"data-testid": "close-dialog",
|
|
15462
|
-
children: /* @__PURE__ */
|
|
15680
|
+
children: /* @__PURE__ */ jsx87(Icon, { icon: CgClose5, iconColor: "gray", size: 24 })
|
|
15463
15681
|
}
|
|
15464
15682
|
)
|
|
15465
15683
|
] }),
|
|
15466
|
-
/* @__PURE__ */
|
|
15467
|
-
buttonGroup ? /* @__PURE__ */
|
|
15684
|
+
/* @__PURE__ */ jsx87("div", { css: [modalContentStyles, !withoutContentPadding ? null : { padding: 0 }], children }),
|
|
15685
|
+
buttonGroup ? /* @__PURE__ */ jsx87(HorizontalRhythm, { children: buttonGroup }) : null
|
|
15468
15686
|
] })
|
|
15469
15687
|
] });
|
|
15470
15688
|
}
|
|
@@ -15493,8 +15711,8 @@ var useParameterShell = () => {
|
|
|
15493
15711
|
};
|
|
15494
15712
|
|
|
15495
15713
|
// src/components/ParameterInputs/styles/LabelLeadingIcon.styles.ts
|
|
15496
|
-
import { css as
|
|
15497
|
-
var inputIconBtn =
|
|
15714
|
+
import { css as css73 } from "@emotion/react";
|
|
15715
|
+
var inputIconBtn = css73`
|
|
15498
15716
|
align-items: center;
|
|
15499
15717
|
border: none;
|
|
15500
15718
|
border-radius: var(--rounded-base);
|
|
@@ -15520,7 +15738,7 @@ var inputIconBtn = css70`
|
|
|
15520
15738
|
`;
|
|
15521
15739
|
|
|
15522
15740
|
// src/components/ParameterInputs/LabelLeadingIcon.tsx
|
|
15523
|
-
import { jsx as
|
|
15741
|
+
import { jsx as jsx88, jsxs as jsxs59 } from "@emotion/react/jsx-runtime";
|
|
15524
15742
|
var LabelLeadingIcon = ({
|
|
15525
15743
|
icon,
|
|
15526
15744
|
iconColor,
|
|
@@ -15532,7 +15750,7 @@ var LabelLeadingIcon = ({
|
|
|
15532
15750
|
...props
|
|
15533
15751
|
}) => {
|
|
15534
15752
|
const titleFr = title != null ? title : isLocked ? "Read-only pattern parameter" : isBound ? "Connected to external content. Click to edit" : "Click to connect to external content";
|
|
15535
|
-
return /* @__PURE__ */
|
|
15753
|
+
return /* @__PURE__ */ jsx88(Tooltip, { title: titleFr, children: /* @__PURE__ */ jsxs59(
|
|
15536
15754
|
"button",
|
|
15537
15755
|
{
|
|
15538
15756
|
css: inputIconBtn,
|
|
@@ -15541,7 +15759,7 @@ var LabelLeadingIcon = ({
|
|
|
15541
15759
|
"aria-disabled": isLocked,
|
|
15542
15760
|
...props,
|
|
15543
15761
|
children: [
|
|
15544
|
-
/* @__PURE__ */
|
|
15762
|
+
/* @__PURE__ */ jsx88(
|
|
15545
15763
|
Icon,
|
|
15546
15764
|
{
|
|
15547
15765
|
icon: isLocked ? "lock" : icon ? icon : "arrows-expand-down-right",
|
|
@@ -15557,8 +15775,8 @@ var LabelLeadingIcon = ({
|
|
|
15557
15775
|
var ConnectToDataElementButton = LabelLeadingIcon;
|
|
15558
15776
|
|
|
15559
15777
|
// src/components/ParameterInputs/styles/ParameterInput.styles.ts
|
|
15560
|
-
import { css as
|
|
15561
|
-
var inputContainer2 =
|
|
15778
|
+
import { css as css74 } from "@emotion/react";
|
|
15779
|
+
var inputContainer2 = css74`
|
|
15562
15780
|
position: relative;
|
|
15563
15781
|
|
|
15564
15782
|
&:hover,
|
|
@@ -15570,14 +15788,14 @@ var inputContainer2 = css71`
|
|
|
15570
15788
|
}
|
|
15571
15789
|
}
|
|
15572
15790
|
`;
|
|
15573
|
-
var labelText2 =
|
|
15791
|
+
var labelText2 = css74`
|
|
15574
15792
|
align-items: center;
|
|
15575
15793
|
display: flex;
|
|
15576
15794
|
gap: var(--spacing-xs);
|
|
15577
15795
|
font-weight: var(--fw-regular);
|
|
15578
15796
|
margin: 0 0 var(--spacing-xs);
|
|
15579
15797
|
`;
|
|
15580
|
-
var input2 =
|
|
15798
|
+
var input2 = css74`
|
|
15581
15799
|
display: block;
|
|
15582
15800
|
appearance: none;
|
|
15583
15801
|
box-sizing: border-box;
|
|
@@ -15621,18 +15839,18 @@ var input2 = css71`
|
|
|
15621
15839
|
color: var(--gray-400);
|
|
15622
15840
|
}
|
|
15623
15841
|
`;
|
|
15624
|
-
var selectInput =
|
|
15842
|
+
var selectInput = css74`
|
|
15625
15843
|
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");
|
|
15626
15844
|
background-position: right var(--spacing-sm) center;
|
|
15627
15845
|
background-repeat: no-repeat;
|
|
15628
15846
|
background-size: 1rem;
|
|
15629
15847
|
padding-right: var(--spacing-xl);
|
|
15630
15848
|
`;
|
|
15631
|
-
var inputWrapper =
|
|
15849
|
+
var inputWrapper = css74`
|
|
15632
15850
|
display: flex; // used to correct overflow with chrome textarea
|
|
15633
15851
|
position: relative;
|
|
15634
15852
|
`;
|
|
15635
|
-
var inputIcon2 =
|
|
15853
|
+
var inputIcon2 = css74`
|
|
15636
15854
|
align-items: center;
|
|
15637
15855
|
background: var(--white);
|
|
15638
15856
|
border-radius: var(--rounded-md) 0 0 var(--rounded-md);
|
|
@@ -15648,7 +15866,7 @@ var inputIcon2 = css71`
|
|
|
15648
15866
|
width: var(--spacing-lg);
|
|
15649
15867
|
z-index: var(--z-10);
|
|
15650
15868
|
`;
|
|
15651
|
-
var inputToggleLabel2 =
|
|
15869
|
+
var inputToggleLabel2 = css74`
|
|
15652
15870
|
align-items: center;
|
|
15653
15871
|
background: var(--white);
|
|
15654
15872
|
cursor: pointer;
|
|
@@ -15659,7 +15877,7 @@ var inputToggleLabel2 = css71`
|
|
|
15659
15877
|
min-height: var(--spacing-md);
|
|
15660
15878
|
position: relative;
|
|
15661
15879
|
`;
|
|
15662
|
-
var toggleInput2 =
|
|
15880
|
+
var toggleInput2 = css74`
|
|
15663
15881
|
appearance: none;
|
|
15664
15882
|
border: 1px solid var(--gray-300);
|
|
15665
15883
|
background: var(--white);
|
|
@@ -15698,7 +15916,7 @@ var toggleInput2 = css71`
|
|
|
15698
15916
|
border-color: var(--gray-300);
|
|
15699
15917
|
}
|
|
15700
15918
|
`;
|
|
15701
|
-
var inlineLabel2 =
|
|
15919
|
+
var inlineLabel2 = css74`
|
|
15702
15920
|
padding-left: var(--spacing-lg);
|
|
15703
15921
|
font-size: var(--fs-sm);
|
|
15704
15922
|
font-weight: var(--fw-regular);
|
|
@@ -15714,7 +15932,7 @@ var inlineLabel2 = css71`
|
|
|
15714
15932
|
}
|
|
15715
15933
|
}
|
|
15716
15934
|
`;
|
|
15717
|
-
var inputMenu =
|
|
15935
|
+
var inputMenu = css74`
|
|
15718
15936
|
background: none;
|
|
15719
15937
|
border: none;
|
|
15720
15938
|
padding: var(--spacing-2xs);
|
|
@@ -15730,11 +15948,11 @@ var inputMenu = css71`
|
|
|
15730
15948
|
background-color: var(--gray-200);
|
|
15731
15949
|
}
|
|
15732
15950
|
`;
|
|
15733
|
-
var textarea2 =
|
|
15951
|
+
var textarea2 = css74`
|
|
15734
15952
|
resize: vertical;
|
|
15735
15953
|
min-height: 2rem;
|
|
15736
15954
|
`;
|
|
15737
|
-
var dataConnectButton =
|
|
15955
|
+
var dataConnectButton = css74`
|
|
15738
15956
|
align-items: center;
|
|
15739
15957
|
appearance: none;
|
|
15740
15958
|
box-sizing: border-box;
|
|
@@ -15769,7 +15987,7 @@ var dataConnectButton = css71`
|
|
|
15769
15987
|
pointer-events: none;
|
|
15770
15988
|
}
|
|
15771
15989
|
`;
|
|
15772
|
-
var linkParameterBtn =
|
|
15990
|
+
var linkParameterBtn = css74`
|
|
15773
15991
|
border-radius: var(--rounded-base);
|
|
15774
15992
|
background: var(--white);
|
|
15775
15993
|
border: none;
|
|
@@ -15778,7 +15996,7 @@ var linkParameterBtn = css71`
|
|
|
15778
15996
|
font-size: var(--fs-sm);
|
|
15779
15997
|
line-height: 1;
|
|
15780
15998
|
`;
|
|
15781
|
-
var linkParameterControls =
|
|
15999
|
+
var linkParameterControls = css74`
|
|
15782
16000
|
position: absolute;
|
|
15783
16001
|
inset: 0 0 0 auto;
|
|
15784
16002
|
padding: 0 var(--spacing-base);
|
|
@@ -15787,7 +16005,7 @@ var linkParameterControls = css71`
|
|
|
15787
16005
|
justify-content: center;
|
|
15788
16006
|
gap: var(--spacing-base);
|
|
15789
16007
|
`;
|
|
15790
|
-
var linkParameterInput = (withExternalLinkIcon) =>
|
|
16008
|
+
var linkParameterInput = (withExternalLinkIcon) => css74`
|
|
15791
16009
|
padding-right: calc(
|
|
15792
16010
|
${withExternalLinkIcon ? "calc(var(--spacing-lg) * 2 + var(--spacing-xs))" : "var(--spacing-xl)"} +
|
|
15793
16011
|
var(--spacing-base)
|
|
@@ -15800,7 +16018,7 @@ var linkParameterInput = (withExternalLinkIcon) => css71`
|
|
|
15800
16018
|
}
|
|
15801
16019
|
}
|
|
15802
16020
|
`;
|
|
15803
|
-
var linkParameterIcon =
|
|
16021
|
+
var linkParameterIcon = css74`
|
|
15804
16022
|
align-items: center;
|
|
15805
16023
|
color: var(--brand-secondary-3);
|
|
15806
16024
|
display: flex;
|
|
@@ -15815,7 +16033,7 @@ var linkParameterIcon = css71`
|
|
|
15815
16033
|
`;
|
|
15816
16034
|
|
|
15817
16035
|
// src/components/ParameterInputs/ParameterDataResource.tsx
|
|
15818
|
-
import { jsx as
|
|
16036
|
+
import { jsx as jsx89, jsxs as jsxs60 } from "@emotion/react/jsx-runtime";
|
|
15819
16037
|
function ParameterDataResource({
|
|
15820
16038
|
label,
|
|
15821
16039
|
labelLeadingIcon,
|
|
@@ -15825,12 +16043,12 @@ function ParameterDataResource({
|
|
|
15825
16043
|
disabled,
|
|
15826
16044
|
children
|
|
15827
16045
|
}) {
|
|
15828
|
-
return /* @__PURE__ */
|
|
15829
|
-
/* @__PURE__ */
|
|
16046
|
+
return /* @__PURE__ */ jsxs60("div", { "data-testid": "parameter-data-connect-button", children: [
|
|
16047
|
+
/* @__PURE__ */ jsxs60("span", { css: labelText2, children: [
|
|
15830
16048
|
labelLeadingIcon ? labelLeadingIcon : null,
|
|
15831
16049
|
label
|
|
15832
16050
|
] }),
|
|
15833
|
-
/* @__PURE__ */
|
|
16051
|
+
/* @__PURE__ */ jsxs60(
|
|
15834
16052
|
"button",
|
|
15835
16053
|
{
|
|
15836
16054
|
type: "button",
|
|
@@ -15839,30 +16057,30 @@ function ParameterDataResource({
|
|
|
15839
16057
|
disabled,
|
|
15840
16058
|
onClick: onConnectDatasource,
|
|
15841
16059
|
children: [
|
|
15842
|
-
/* @__PURE__ */
|
|
16060
|
+
/* @__PURE__ */ jsx89("span", { className: "advance-input-icon", css: [inputIcon2], children: /* @__PURE__ */ jsx89(Icon, { icon: "stack", iconColor: "currentColor", size: "1rem" }) }),
|
|
15843
16061
|
children
|
|
15844
16062
|
]
|
|
15845
16063
|
}
|
|
15846
16064
|
),
|
|
15847
|
-
caption ? /* @__PURE__ */
|
|
16065
|
+
caption ? /* @__PURE__ */ jsx89(Caption, { children: caption }) : null
|
|
15848
16066
|
] });
|
|
15849
16067
|
}
|
|
15850
16068
|
|
|
15851
16069
|
// src/components/ParameterInputs/styles/ParameterDrawerHeader.styles.ts
|
|
15852
|
-
import { css as
|
|
15853
|
-
var ParameterDrawerHeaderContainer =
|
|
16070
|
+
import { css as css75 } from "@emotion/react";
|
|
16071
|
+
var ParameterDrawerHeaderContainer = css75`
|
|
15854
16072
|
align-items: center;
|
|
15855
16073
|
display: flex;
|
|
15856
16074
|
gap: var(--spacing-base);
|
|
15857
16075
|
justify-content: space-between;
|
|
15858
16076
|
margin-bottom: var(--spacing-sm);
|
|
15859
16077
|
`;
|
|
15860
|
-
var ParameterDrawerHeaderTitleGroup =
|
|
16078
|
+
var ParameterDrawerHeaderTitleGroup = css75`
|
|
15861
16079
|
align-items: center;
|
|
15862
16080
|
display: flex;
|
|
15863
16081
|
gap: var(--spacing-sm);
|
|
15864
16082
|
`;
|
|
15865
|
-
var ParameterDrawerHeaderTitle =
|
|
16083
|
+
var ParameterDrawerHeaderTitle = css75`
|
|
15866
16084
|
text-overflow: ellipsis;
|
|
15867
16085
|
white-space: nowrap;
|
|
15868
16086
|
overflow: hidden;
|
|
@@ -15870,23 +16088,23 @@ var ParameterDrawerHeaderTitle = css72`
|
|
|
15870
16088
|
`;
|
|
15871
16089
|
|
|
15872
16090
|
// src/components/ParameterInputs/ParameterDrawerHeader.tsx
|
|
15873
|
-
import { jsx as
|
|
16091
|
+
import { jsx as jsx90, jsxs as jsxs61 } from "@emotion/react/jsx-runtime";
|
|
15874
16092
|
var ParameterDrawerHeader = ({ title, iconBeforeTitle, children }) => {
|
|
15875
|
-
return /* @__PURE__ */
|
|
15876
|
-
/* @__PURE__ */
|
|
16093
|
+
return /* @__PURE__ */ jsxs61("div", { css: ParameterDrawerHeaderContainer, children: [
|
|
16094
|
+
/* @__PURE__ */ jsxs61("header", { css: ParameterDrawerHeaderTitleGroup, children: [
|
|
15877
16095
|
iconBeforeTitle,
|
|
15878
|
-
/* @__PURE__ */
|
|
16096
|
+
/* @__PURE__ */ jsx90(Heading, { level: 3, withMarginBottom: false, css: ParameterDrawerHeaderTitle, title, children: title })
|
|
15879
16097
|
] }),
|
|
15880
16098
|
children
|
|
15881
16099
|
] });
|
|
15882
16100
|
};
|
|
15883
16101
|
|
|
15884
16102
|
// src/components/ParameterInputs/ParameterGroup.tsx
|
|
15885
|
-
import { forwardRef as
|
|
16103
|
+
import { forwardRef as forwardRef10 } from "react";
|
|
15886
16104
|
|
|
15887
16105
|
// src/components/ParameterInputs/styles/ParameterGroup.styles.ts
|
|
15888
|
-
import { css as
|
|
15889
|
-
var fieldsetStyles =
|
|
16106
|
+
import { css as css76 } from "@emotion/react";
|
|
16107
|
+
var fieldsetStyles = css76`
|
|
15890
16108
|
&:disabled,
|
|
15891
16109
|
[readonly] {
|
|
15892
16110
|
pointer-events: none;
|
|
@@ -15897,7 +16115,7 @@ var fieldsetStyles = css73`
|
|
|
15897
16115
|
}
|
|
15898
16116
|
}
|
|
15899
16117
|
`;
|
|
15900
|
-
var fieldsetLegend2 =
|
|
16118
|
+
var fieldsetLegend2 = css76`
|
|
15901
16119
|
display: block;
|
|
15902
16120
|
font-weight: var(--fw-medium);
|
|
15903
16121
|
margin-bottom: var(--spacing-sm);
|
|
@@ -15905,18 +16123,18 @@ var fieldsetLegend2 = css73`
|
|
|
15905
16123
|
`;
|
|
15906
16124
|
|
|
15907
16125
|
// src/components/ParameterInputs/ParameterGroup.tsx
|
|
15908
|
-
import { jsx as
|
|
15909
|
-
var ParameterGroup =
|
|
16126
|
+
import { jsx as jsx91, jsxs as jsxs62 } from "@emotion/react/jsx-runtime";
|
|
16127
|
+
var ParameterGroup = forwardRef10(
|
|
15910
16128
|
({ legend, isDisabled, children, ...props }, ref) => {
|
|
15911
|
-
return /* @__PURE__ */
|
|
15912
|
-
/* @__PURE__ */
|
|
16129
|
+
return /* @__PURE__ */ jsxs62("fieldset", { css: fieldsetStyles, disabled: isDisabled, ref, ...props, children: [
|
|
16130
|
+
/* @__PURE__ */ jsx91("legend", { css: fieldsetLegend2, children: legend }),
|
|
15913
16131
|
children
|
|
15914
16132
|
] });
|
|
15915
16133
|
}
|
|
15916
16134
|
);
|
|
15917
16135
|
|
|
15918
16136
|
// src/components/ParameterInputs/ParameterImage.tsx
|
|
15919
|
-
import { forwardRef as
|
|
16137
|
+
import { forwardRef as forwardRef12, useDeferredValue } from "react";
|
|
15920
16138
|
|
|
15921
16139
|
// src/components/ParameterInputs/ParameterImagePreview.tsx
|
|
15922
16140
|
import { useCallback as useCallback3, useEffect as useEffect9, useState as useState9 } from "react";
|
|
@@ -15933,8 +16151,8 @@ var isValidUrl = (url, options = {}) => {
|
|
|
15933
16151
|
};
|
|
15934
16152
|
|
|
15935
16153
|
// src/components/ParameterInputs/styles/ParameterImage.styles.ts
|
|
15936
|
-
import { css as
|
|
15937
|
-
var imageWrapper =
|
|
16154
|
+
import { css as css77 } from "@emotion/react";
|
|
16155
|
+
var imageWrapper = css77`
|
|
15938
16156
|
position: relative;
|
|
15939
16157
|
display: flex;
|
|
15940
16158
|
flex-direction: column;
|
|
@@ -15942,34 +16160,34 @@ var imageWrapper = css74`
|
|
|
15942
16160
|
max-width: 100%;
|
|
15943
16161
|
max-height: 100%;
|
|
15944
16162
|
`;
|
|
15945
|
-
var imageWrapperLoading =
|
|
16163
|
+
var imageWrapperLoading = css77`
|
|
15946
16164
|
animation: ${skeletonLoading} var(--duration-slow) linear infinite alternate;
|
|
15947
16165
|
`;
|
|
15948
|
-
var img =
|
|
16166
|
+
var img = css77`
|
|
15949
16167
|
object-fit: contain;
|
|
15950
16168
|
max-width: 100%;
|
|
15951
16169
|
height: auto;
|
|
15952
16170
|
opacity: var(--opacity-0);
|
|
15953
16171
|
margin: 0 auto;
|
|
15954
16172
|
`;
|
|
15955
|
-
var imgLoading =
|
|
16173
|
+
var imgLoading = css77`
|
|
15956
16174
|
opacity: 0;
|
|
15957
16175
|
`;
|
|
15958
|
-
var imgLoaded =
|
|
16176
|
+
var imgLoaded = css77`
|
|
15959
16177
|
animation: ${fadeIn} var(--duration-slow) var(--timing-ease-out) forwards;
|
|
15960
16178
|
opacity: 1;
|
|
15961
16179
|
`;
|
|
15962
|
-
var brokenImage =
|
|
16180
|
+
var brokenImage = css77`
|
|
15963
16181
|
height: 160px;
|
|
15964
16182
|
`;
|
|
15965
|
-
var previewWrapper =
|
|
16183
|
+
var previewWrapper = css77`
|
|
15966
16184
|
margin-top: var(--spacing-xs);
|
|
15967
16185
|
background: var(--gray-50);
|
|
15968
16186
|
padding: var(--spacing-sm);
|
|
15969
16187
|
border: solid 1px var(--gray-300);
|
|
15970
16188
|
border-radius: var(--rounded-sm);
|
|
15971
16189
|
`;
|
|
15972
|
-
var previewLink =
|
|
16190
|
+
var previewLink = css77`
|
|
15973
16191
|
display: block;
|
|
15974
16192
|
width: 100%;
|
|
15975
16193
|
|
|
@@ -15977,7 +16195,7 @@ var previewLink = css74`
|
|
|
15977
16195
|
max-height: 9rem;
|
|
15978
16196
|
}
|
|
15979
16197
|
`;
|
|
15980
|
-
var previewModalWrapper =
|
|
16198
|
+
var previewModalWrapper = css77`
|
|
15981
16199
|
background: var(--gray-50);
|
|
15982
16200
|
display: flex;
|
|
15983
16201
|
height: 100%;
|
|
@@ -15986,7 +16204,7 @@ var previewModalWrapper = css74`
|
|
|
15986
16204
|
border: solid 1px var(--gray-300);
|
|
15987
16205
|
border-radius: var(--rounded-sm);
|
|
15988
16206
|
`;
|
|
15989
|
-
var previewModalImage =
|
|
16207
|
+
var previewModalImage = css77`
|
|
15990
16208
|
display: flex;
|
|
15991
16209
|
height: 100%;
|
|
15992
16210
|
width: 100%;
|
|
@@ -15998,33 +16216,33 @@ var previewModalImage = css74`
|
|
|
15998
16216
|
`;
|
|
15999
16217
|
|
|
16000
16218
|
// src/components/ParameterInputs/ParameterImagePreview.tsx
|
|
16001
|
-
import { Fragment as
|
|
16219
|
+
import { Fragment as Fragment13, jsx as jsx92, jsxs as jsxs63 } from "@emotion/react/jsx-runtime";
|
|
16002
16220
|
function ParameterImagePreview({ imageSrc }) {
|
|
16003
16221
|
const [showModal, setShowModal] = useState9(false);
|
|
16004
|
-
return imageSrc ? /* @__PURE__ */
|
|
16005
|
-
/* @__PURE__ */
|
|
16006
|
-
/* @__PURE__ */
|
|
16222
|
+
return imageSrc ? /* @__PURE__ */ jsxs63("div", { css: previewWrapper, children: [
|
|
16223
|
+
/* @__PURE__ */ jsx92(PreviewImageModal, { open: showModal, imageSrc, onRequestClose: () => setShowModal(false) }),
|
|
16224
|
+
/* @__PURE__ */ jsx92(
|
|
16007
16225
|
"button",
|
|
16008
16226
|
{
|
|
16009
16227
|
css: previewLink,
|
|
16010
16228
|
onClick: () => {
|
|
16011
16229
|
setShowModal(true);
|
|
16012
16230
|
},
|
|
16013
|
-
children: /* @__PURE__ */
|
|
16231
|
+
children: /* @__PURE__ */ jsx92(Image, { src: imageSrc })
|
|
16014
16232
|
}
|
|
16015
16233
|
)
|
|
16016
16234
|
] }) : null;
|
|
16017
16235
|
}
|
|
16018
16236
|
var PreviewImageModal = ({ open, onRequestClose, imageSrc }) => {
|
|
16019
|
-
return open ? /* @__PURE__ */
|
|
16020
|
-
/* @__PURE__ */
|
|
16237
|
+
return open ? /* @__PURE__ */ jsx92(Fragment13, { children: createPortal2(
|
|
16238
|
+
/* @__PURE__ */ jsx92(
|
|
16021
16239
|
Modal,
|
|
16022
16240
|
{
|
|
16023
16241
|
header: "Image Preview",
|
|
16024
16242
|
onRequestClose,
|
|
16025
16243
|
withoutContentPadding: true,
|
|
16026
|
-
buttonGroup: /* @__PURE__ */
|
|
16027
|
-
children: /* @__PURE__ */
|
|
16244
|
+
buttonGroup: /* @__PURE__ */ jsx92(Button, { buttonType: "secondary", onClick: onRequestClose, children: "Ok" }),
|
|
16245
|
+
children: /* @__PURE__ */ jsx92("div", { css: previewModalWrapper, children: /* @__PURE__ */ jsx92(Image, { src: imageSrc, css: previewModalImage }) })
|
|
16028
16246
|
}
|
|
16029
16247
|
),
|
|
16030
16248
|
document.body
|
|
@@ -16065,13 +16283,13 @@ var Image = ({ src, className }) => {
|
|
|
16065
16283
|
const handleErrorEvent = () => {
|
|
16066
16284
|
setLoadErrorText("The value you provided is not a valid image URL");
|
|
16067
16285
|
};
|
|
16068
|
-
return /* @__PURE__ */
|
|
16286
|
+
return /* @__PURE__ */ jsxs63(
|
|
16069
16287
|
"span",
|
|
16070
16288
|
{
|
|
16071
16289
|
className,
|
|
16072
16290
|
css: [imageWrapper, loading ? imageWrapperLoading : null],
|
|
16073
16291
|
children: [
|
|
16074
|
-
src && !loadErrorText ? /* @__PURE__ */
|
|
16292
|
+
src && !loadErrorText ? /* @__PURE__ */ jsx92(
|
|
16075
16293
|
"img",
|
|
16076
16294
|
{
|
|
16077
16295
|
src,
|
|
@@ -16083,66 +16301,34 @@ var Image = ({ src, className }) => {
|
|
|
16083
16301
|
"data-testid": "parameter-image-preview"
|
|
16084
16302
|
}
|
|
16085
16303
|
) : null,
|
|
16086
|
-
src && loadErrorText ? /* @__PURE__ */
|
|
16087
|
-
/* @__PURE__ */
|
|
16088
|
-
/* @__PURE__ */
|
|
16304
|
+
src && loadErrorText ? /* @__PURE__ */ jsxs63(Fragment13, { children: [
|
|
16305
|
+
/* @__PURE__ */ jsx92(ImageBroken, { css: [brokenImage, img, imgLoaded] }),
|
|
16306
|
+
/* @__PURE__ */ jsx92(ErrorMessage, { message: loadErrorText })
|
|
16089
16307
|
] }) : null
|
|
16090
16308
|
]
|
|
16091
16309
|
}
|
|
16092
16310
|
);
|
|
16093
16311
|
};
|
|
16094
|
-
var BrokenImage = ({ ...props }) => {
|
|
16095
|
-
return /* @__PURE__ */ jsxs60(
|
|
16096
|
-
"svg",
|
|
16097
|
-
{
|
|
16098
|
-
role: "img",
|
|
16099
|
-
width: "214",
|
|
16100
|
-
height: "214",
|
|
16101
|
-
viewBox: "0 0 214 214",
|
|
16102
|
-
fill: "none",
|
|
16103
|
-
xmlns: "http://www.w3.org/2000/svg",
|
|
16104
|
-
xmlnsXlink: "http://www.w3.org/1999/xlink",
|
|
16105
|
-
"data-testid": "broken-image",
|
|
16106
|
-
...props,
|
|
16107
|
-
children: [
|
|
16108
|
-
/* @__PURE__ */ jsx88("rect", { width: "214", height: "214", fill: "#F9FAFB" }),
|
|
16109
|
-
/* @__PURE__ */ jsx88("rect", { width: "214", height: "214", fill: "url(#pattern0)" }),
|
|
16110
|
-
/* @__PURE__ */ jsxs60("defs", { children: [
|
|
16111
|
-
/* @__PURE__ */ jsx88("pattern", { id: "pattern0", patternContentUnits: "objectBoundingBox", width: "1", height: "1", children: /* @__PURE__ */ jsx88("use", { xlinkHref: "#image0_761_4353", transform: "scale(0.0025)" }) }),
|
|
16112
|
-
/* @__PURE__ */ jsx88(
|
|
16113
|
-
"image",
|
|
16114
|
-
{
|
|
16115
|
-
id: "image0_761_4353",
|
|
16116
|
-
width: "400",
|
|
16117
|
-
height: "400",
|
|
16118
|
-
xlinkHref: "data:image/png;base64,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UfKBgDEBDMtYXFKDgBsBDMtNUfKBgDEBDMtYXFKDgBsBDMtNUfKBgDEBDMtYXFKDgBsBDMtNUfKBgDEBDMtYXFKDgBsBDMtNUfKBgDEBDMtYXFKDgBsBDMtNUfKBgDEBDMtYXFKDgBsBDMtNUfKBgDEBDMtYXFKDgBsBDMtNUfKBgDEBDMtYXFKDgBsBDMtNUfKBgDEBDMtYXFKDgBsBDMtNUfKBgDEBDMtYXFKDgBsBDMtNUfKBgDEBDMtYXFKDgBsBDMtNUfKBgDEBDMtYXFKDgBsBDMtNUfKBgDEBDMtYXFKDgBsBDMtNUfKBgDEBDMtYXFKDgBsBDMtNUfKBgDEBDMtYXFKDgBsBDMtNUfKBgDEBDMtYXFKDgBsBDMtNUfKBgDEBDMtYXFKDgBsBDMtNUfKBgDEBDMtYXFKDgBsBDMtNUfKBgDEBDMtYXFKDgBsBDMtNUfKBgDEBDMtYXFKDgBsBDMtNUfKBgDEBDMtYXFKDgBsBDMtNUfKBgDEBDMtYXFKDgBsBDMtNUfKBgDEBDMtYXFKDgBsBDMtNUfKBgDEBDMtYXFKDgBsBDMtNUfKBgDEBDMtYXFKDgBsBDMtNUfKBgDEBDMtYXFKDgBsBDMtNUfKBgDEBDMtYXFKDgBsBDMtNUfKBgDEBDMtYXFKDgBsBDMtNUfKBgDEBDMtYXFKDgBsBDMtNUfKBgDEBDMtYXFKDgBsBDMtNUfKBgDEBDMtYXFKDgBsBDMtNUfKBgDEBDMtYXFKDgBsBDMtNUfKBgDEBDMtYXFKDgBsBDMtNUfKBgDEBDMtYXFKDgBsBDMtNUfKBgDEBDMtYXFKDgBsBDMtNUfKBgDEBDMtYXFKDgBsBDMtNUfKBgDEBDMtYXFKDgBsBDMtNUfKBgDEBDMtYXFKDgBsBDMtNUfKBgDEBDMtYXFKDgBsBDMtNUfKBgDEBDMtYXFKDgBsBDMtNUfKBgDEBDMtYXFKDgBsBDMtNUfKBgDEBDMtYXFKDgBsBDMtNUfKBgDEBDMtYXFKDgBsBDMtNUfKBgDEBDMtYXFKDgBsBDMtNUfKBgDEBDMtYXFKDgBsBDMtNUfKBgDEBDMtYXFKDgBsBDMtNUfKBgDEBDMtYXFKDgBsBDMtNUfKBgDEBDMtYXFKDgBsBDMtNUfKBgDEBDMtYXFKDgBsBDMtNUfKBgDEBDMtYXFKDgBsBDMtNUfKBgDEBDMtYXFKDgBsBDMtNUfKBgDEBDMtYXFKDgBsBDMtNUfKBgDEBDMtYXFKDgBsBDMtNUfKBgDEBDMtYXFKDgBsBDMtNUfKBgDEBDMtYXFKDgBsBDMtNUfKBgDEBDMtYXFKDgBsBDMtNUfKBgDEBDMtYXFKDgBsBDMtNUfKBgDEBDMtYXFKDgBsBDMtNUfKBgDEBDMtYXFKDgBsBDMtNUfKBgDEBDMtYXFKDgBsBDMtNUfKBgDEBDMtYXFKDgBsBDMtNUfKBgDEBDMtYXFKDgBsBDMtNUfKBgDEBDMtYXFKDgBsBDMtNUfKBgDEBDMtYXFKDgBsBDMtNUfKBgDEBDMtYXFKDgBsBDMtNUfKBgDEBDMtYXFKDgBsBDMtNUfKBgDEBDMtYXFKDgBsBDMtNUfKBgDEBDMtYXFKDgBuB/we75KcVO2CRagAAAABJRU5ErkJggg=="
|
|
16119
|
-
}
|
|
16120
|
-
)
|
|
16121
|
-
] })
|
|
16122
|
-
]
|
|
16123
|
-
}
|
|
16124
|
-
);
|
|
16125
|
-
};
|
|
16126
16312
|
|
|
16127
16313
|
// src/components/ParameterInputs/ParameterShell.tsx
|
|
16128
16314
|
import { useState as useState10 } from "react";
|
|
16129
16315
|
|
|
16130
16316
|
// src/components/ParameterInputs/ParameterLabel.tsx
|
|
16131
|
-
import { jsx as
|
|
16317
|
+
import { jsx as jsx93 } from "@emotion/react/jsx-runtime";
|
|
16132
16318
|
var ParameterLabel = ({ id, asSpan, children, ...props }) => {
|
|
16133
|
-
return !asSpan ? /* @__PURE__ */
|
|
16319
|
+
return !asSpan ? /* @__PURE__ */ jsx93("label", { ...props, htmlFor: id, css: labelText2, children }) : /* @__PURE__ */ jsx93("span", { "aria-labelledby": id, css: labelText2, children });
|
|
16134
16320
|
};
|
|
16135
16321
|
|
|
16136
16322
|
// src/components/ParameterInputs/ParameterMenuButton.tsx
|
|
16137
|
-
import { forwardRef as
|
|
16138
|
-
import { jsx as
|
|
16139
|
-
var ParameterMenuButton =
|
|
16323
|
+
import { forwardRef as forwardRef11 } from "react";
|
|
16324
|
+
import { jsx as jsx94 } from "@emotion/react/jsx-runtime";
|
|
16325
|
+
var ParameterMenuButton = forwardRef11(
|
|
16140
16326
|
({ label, children }, ref) => {
|
|
16141
|
-
return /* @__PURE__ */
|
|
16327
|
+
return /* @__PURE__ */ jsx94(
|
|
16142
16328
|
Menu,
|
|
16143
16329
|
{
|
|
16144
16330
|
menuLabel: `${label} menu`,
|
|
16145
|
-
menuTrigger: /* @__PURE__ */
|
|
16331
|
+
menuTrigger: /* @__PURE__ */ jsx94(
|
|
16146
16332
|
"button",
|
|
16147
16333
|
{
|
|
16148
16334
|
className: "parameter-menu",
|
|
@@ -16150,7 +16336,7 @@ var ParameterMenuButton = forwardRef10(
|
|
|
16150
16336
|
type: "button",
|
|
16151
16337
|
"aria-label": `${label} options`,
|
|
16152
16338
|
ref,
|
|
16153
|
-
children: /* @__PURE__ */
|
|
16339
|
+
children: /* @__PURE__ */ jsx94(Icon, { icon: "more-alt", iconColor: "currentColor", size: "0.9rem" })
|
|
16154
16340
|
}
|
|
16155
16341
|
),
|
|
16156
16342
|
children
|
|
@@ -16160,8 +16346,8 @@ var ParameterMenuButton = forwardRef10(
|
|
|
16160
16346
|
);
|
|
16161
16347
|
|
|
16162
16348
|
// src/components/ParameterInputs/styles/ParameterShell.styles.ts
|
|
16163
|
-
import { css as
|
|
16164
|
-
var emptyParameterShell =
|
|
16349
|
+
import { css as css78 } from "@emotion/react";
|
|
16350
|
+
var emptyParameterShell = css78`
|
|
16165
16351
|
border-radius: var(--rounded-sm);
|
|
16166
16352
|
background: var(--white);
|
|
16167
16353
|
flex-grow: 1;
|
|
@@ -16169,7 +16355,7 @@ var emptyParameterShell = css75`
|
|
|
16169
16355
|
position: relative;
|
|
16170
16356
|
max-width: 100%;
|
|
16171
16357
|
`;
|
|
16172
|
-
var emptyParameterShellText =
|
|
16358
|
+
var emptyParameterShellText = css78`
|
|
16173
16359
|
background: var(--brand-secondary-6);
|
|
16174
16360
|
border-radius: var(--rounded-sm);
|
|
16175
16361
|
padding: var(--spacing-sm);
|
|
@@ -16177,7 +16363,7 @@ var emptyParameterShellText = css75`
|
|
|
16177
16363
|
font-size: var(--fs-sm);
|
|
16178
16364
|
margin: 0;
|
|
16179
16365
|
`;
|
|
16180
|
-
var overrideMarker =
|
|
16366
|
+
var overrideMarker = css78`
|
|
16181
16367
|
border-radius: var(--rounded-sm);
|
|
16182
16368
|
border: 10px solid var(--gray-300);
|
|
16183
16369
|
border-left-color: transparent;
|
|
@@ -16188,7 +16374,7 @@ var overrideMarker = css75`
|
|
|
16188
16374
|
`;
|
|
16189
16375
|
|
|
16190
16376
|
// src/components/ParameterInputs/ParameterShell.tsx
|
|
16191
|
-
import { jsx as
|
|
16377
|
+
import { jsx as jsx95, jsxs as jsxs64 } from "@emotion/react/jsx-runtime";
|
|
16192
16378
|
var extractParameterProps = (props) => {
|
|
16193
16379
|
const {
|
|
16194
16380
|
id,
|
|
@@ -16249,20 +16435,20 @@ var ParameterShell = ({
|
|
|
16249
16435
|
const [manualErrorMessage, setManualErrorMessage] = useState10(void 0);
|
|
16250
16436
|
const setErrorMessage = (message) => setManualErrorMessage(message);
|
|
16251
16437
|
const errorMessaging = errorMessage || manualErrorMessage;
|
|
16252
|
-
return /* @__PURE__ */
|
|
16253
|
-
hiddenLabel || title ? null : /* @__PURE__ */
|
|
16438
|
+
return /* @__PURE__ */ jsxs64("div", { css: inputContainer2, ...props, children: [
|
|
16439
|
+
hiddenLabel || title ? null : /* @__PURE__ */ jsxs64(ParameterLabel, { id, css: labelText2, children: [
|
|
16254
16440
|
labelLeadingIcon != null ? labelLeadingIcon : null,
|
|
16255
16441
|
label,
|
|
16256
16442
|
labelTrailingIcon != null ? labelTrailingIcon : null
|
|
16257
16443
|
] }),
|
|
16258
|
-
!title ? null : /* @__PURE__ */
|
|
16444
|
+
!title ? null : /* @__PURE__ */ jsxs64(ParameterLabel, { id, asSpan: true, children: [
|
|
16259
16445
|
labelLeadingIcon != null ? labelLeadingIcon : null,
|
|
16260
16446
|
title,
|
|
16261
16447
|
labelTrailingIcon != null ? labelTrailingIcon : null
|
|
16262
16448
|
] }),
|
|
16263
|
-
/* @__PURE__ */
|
|
16264
|
-
menuItems ? /* @__PURE__ */
|
|
16265
|
-
/* @__PURE__ */
|
|
16449
|
+
/* @__PURE__ */ jsxs64("div", { css: inputWrapper, children: [
|
|
16450
|
+
menuItems ? /* @__PURE__ */ jsx95(ParameterMenuButton, { label: `${label} menu`, children: menuItems }) : null,
|
|
16451
|
+
/* @__PURE__ */ jsx95(
|
|
16266
16452
|
ParameterShellContext.Provider,
|
|
16267
16453
|
{
|
|
16268
16454
|
value: {
|
|
@@ -16272,41 +16458,41 @@ var ParameterShell = ({
|
|
|
16272
16458
|
errorMessage: errorMessaging,
|
|
16273
16459
|
handleManuallySetErrorMessage: (message) => setErrorMessage(message)
|
|
16274
16460
|
},
|
|
16275
|
-
children: /* @__PURE__ */
|
|
16461
|
+
children: /* @__PURE__ */ jsxs64(ParameterShellPlaceholder, { children: [
|
|
16276
16462
|
children,
|
|
16277
|
-
hasOverriddenValue && onResetOverriddenValue ? /* @__PURE__ */
|
|
16463
|
+
hasOverriddenValue && onResetOverriddenValue ? /* @__PURE__ */ jsx95(ParameterOverrideMarker, { onClick: onResetOverriddenValue }) : null
|
|
16278
16464
|
] })
|
|
16279
16465
|
}
|
|
16280
16466
|
)
|
|
16281
16467
|
] }),
|
|
16282
|
-
caption ? /* @__PURE__ */
|
|
16283
|
-
errorMessaging ? /* @__PURE__ */
|
|
16284
|
-
warningMessage ? /* @__PURE__ */
|
|
16285
|
-
infoMessage ? /* @__PURE__ */
|
|
16468
|
+
caption ? /* @__PURE__ */ jsx95(Caption, { testId: captionTestId, children: caption }) : null,
|
|
16469
|
+
errorMessaging ? /* @__PURE__ */ jsx95(ErrorMessage, { message: errorMessaging, testId: errorTestId }) : null,
|
|
16470
|
+
warningMessage ? /* @__PURE__ */ jsx95(WarningMessage, { message: warningMessage }) : null,
|
|
16471
|
+
infoMessage ? /* @__PURE__ */ jsx95(InfoMessage, { message: infoMessage }) : null
|
|
16286
16472
|
] });
|
|
16287
16473
|
};
|
|
16288
16474
|
var ParameterShellPlaceholder = ({ children }) => {
|
|
16289
|
-
return /* @__PURE__ */
|
|
16475
|
+
return /* @__PURE__ */ jsx95("div", { css: emptyParameterShell, children });
|
|
16290
16476
|
};
|
|
16291
|
-
var ParameterOverrideMarker = (props) => /* @__PURE__ */
|
|
16477
|
+
var ParameterOverrideMarker = (props) => /* @__PURE__ */ jsx95(Tooltip, { title: "The default value has been overridden", children: /* @__PURE__ */ jsx95("button", { type: "button", css: overrideMarker, ...props, children: /* @__PURE__ */ jsx95("span", { hidden: true, children: "reset overridden value to default" }) }) });
|
|
16292
16478
|
|
|
16293
16479
|
// src/components/ParameterInputs/ParameterImage.tsx
|
|
16294
|
-
import { Fragment as
|
|
16295
|
-
var ParameterImage =
|
|
16480
|
+
import { Fragment as Fragment14, jsx as jsx96, jsxs as jsxs65 } from "@emotion/react/jsx-runtime";
|
|
16481
|
+
var ParameterImage = forwardRef12(
|
|
16296
16482
|
({ children, ...props }, ref) => {
|
|
16297
16483
|
const { shellProps, innerProps } = extractParameterProps(props);
|
|
16298
|
-
return /* @__PURE__ */
|
|
16299
|
-
/* @__PURE__ */
|
|
16484
|
+
return /* @__PURE__ */ jsxs65(ParameterShell, { "data-test-id": "parameter-image", ...shellProps, children: [
|
|
16485
|
+
/* @__PURE__ */ jsx96(ParameterImageInner, { ref, ...innerProps }),
|
|
16300
16486
|
children
|
|
16301
16487
|
] });
|
|
16302
16488
|
}
|
|
16303
16489
|
);
|
|
16304
|
-
var ParameterImageInner =
|
|
16490
|
+
var ParameterImageInner = forwardRef12((props, ref) => {
|
|
16305
16491
|
const { value } = props;
|
|
16306
16492
|
const { id, label, hiddenLabel, errorMessage } = useParameterShell();
|
|
16307
16493
|
const deferredValue = useDeferredValue(value);
|
|
16308
|
-
return /* @__PURE__ */
|
|
16309
|
-
/* @__PURE__ */
|
|
16494
|
+
return /* @__PURE__ */ jsxs65(Fragment14, { children: [
|
|
16495
|
+
/* @__PURE__ */ jsx96(
|
|
16310
16496
|
"input",
|
|
16311
16497
|
{
|
|
16312
16498
|
css: input2,
|
|
@@ -16318,21 +16504,21 @@ var ParameterImageInner = forwardRef11((props, ref) => {
|
|
|
16318
16504
|
...props
|
|
16319
16505
|
}
|
|
16320
16506
|
),
|
|
16321
|
-
errorMessage || props.disablePreview ? null : /* @__PURE__ */
|
|
16507
|
+
errorMessage || props.disablePreview ? null : /* @__PURE__ */ jsx96(ParameterImagePreview, { imageSrc: deferredValue })
|
|
16322
16508
|
] });
|
|
16323
16509
|
});
|
|
16324
16510
|
|
|
16325
16511
|
// src/components/ParameterInputs/ParameterInput.tsx
|
|
16326
|
-
import { forwardRef as
|
|
16327
|
-
import { jsx as
|
|
16328
|
-
var ParameterInput =
|
|
16512
|
+
import { forwardRef as forwardRef13 } from "react";
|
|
16513
|
+
import { jsx as jsx97 } from "@emotion/react/jsx-runtime";
|
|
16514
|
+
var ParameterInput = forwardRef13((props, ref) => {
|
|
16329
16515
|
const { shellProps, innerProps } = extractParameterProps(props);
|
|
16330
|
-
return /* @__PURE__ */
|
|
16516
|
+
return /* @__PURE__ */ jsx97(ParameterShell, { "data-testid": "parameter-input", ...shellProps, children: /* @__PURE__ */ jsx97(ParameterInputInner, { ref, ...innerProps }) });
|
|
16331
16517
|
});
|
|
16332
|
-
var ParameterInputInner =
|
|
16518
|
+
var ParameterInputInner = forwardRef13(
|
|
16333
16519
|
({ ...props }, ref) => {
|
|
16334
16520
|
const { id, label, hiddenLabel } = useParameterShell();
|
|
16335
|
-
return /* @__PURE__ */
|
|
16521
|
+
return /* @__PURE__ */ jsx97(
|
|
16336
16522
|
"input",
|
|
16337
16523
|
{
|
|
16338
16524
|
css: input2,
|
|
@@ -16348,19 +16534,19 @@ var ParameterInputInner = forwardRef12(
|
|
|
16348
16534
|
);
|
|
16349
16535
|
|
|
16350
16536
|
// src/components/ParameterInputs/ParameterLink.tsx
|
|
16351
|
-
import { forwardRef as
|
|
16352
|
-
import { jsx as
|
|
16353
|
-
var ParameterLink =
|
|
16537
|
+
import { forwardRef as forwardRef14 } from "react";
|
|
16538
|
+
import { jsx as jsx98, jsxs as jsxs66 } from "@emotion/react/jsx-runtime";
|
|
16539
|
+
var ParameterLink = forwardRef14(
|
|
16354
16540
|
({ disabled, onConnectLink, externalLink, ...props }, ref) => {
|
|
16355
16541
|
const { shellProps, innerProps } = extractParameterProps(props);
|
|
16356
|
-
return /* @__PURE__ */
|
|
16542
|
+
return /* @__PURE__ */ jsx98(
|
|
16357
16543
|
ParameterShell,
|
|
16358
16544
|
{
|
|
16359
16545
|
"data-testid": "link-parameter-editor",
|
|
16360
16546
|
...shellProps,
|
|
16361
16547
|
label: innerProps.value ? shellProps.label : "",
|
|
16362
16548
|
title: !innerProps.value ? shellProps.label : void 0,
|
|
16363
|
-
children: /* @__PURE__ */
|
|
16549
|
+
children: /* @__PURE__ */ jsx98(
|
|
16364
16550
|
ParameterLinkInner,
|
|
16365
16551
|
{
|
|
16366
16552
|
onConnectLink,
|
|
@@ -16373,13 +16559,13 @@ var ParameterLink = forwardRef13(
|
|
|
16373
16559
|
);
|
|
16374
16560
|
}
|
|
16375
16561
|
);
|
|
16376
|
-
var ParameterLinkInner =
|
|
16562
|
+
var ParameterLinkInner = forwardRef14(
|
|
16377
16563
|
({ externalLink, onConnectLink, disabled, buttonText = "Select link", ...props }, ref) => {
|
|
16378
16564
|
const { id, label, hiddenLabel } = useParameterShell();
|
|
16379
16565
|
if (!props.value)
|
|
16380
|
-
return /* @__PURE__ */
|
|
16381
|
-
return /* @__PURE__ */
|
|
16382
|
-
/* @__PURE__ */
|
|
16566
|
+
return /* @__PURE__ */ jsx98("button", { type: "button", css: dataConnectButton, disabled, onClick: onConnectLink, children: buttonText });
|
|
16567
|
+
return /* @__PURE__ */ jsxs66("div", { css: inputWrapper, children: [
|
|
16568
|
+
/* @__PURE__ */ jsx98(
|
|
16383
16569
|
"input",
|
|
16384
16570
|
{
|
|
16385
16571
|
type: "text",
|
|
@@ -16391,8 +16577,8 @@ var ParameterLinkInner = forwardRef13(
|
|
|
16391
16577
|
...props
|
|
16392
16578
|
}
|
|
16393
16579
|
),
|
|
16394
|
-
/* @__PURE__ */
|
|
16395
|
-
/* @__PURE__ */
|
|
16580
|
+
/* @__PURE__ */ jsxs66("div", { css: linkParameterControls, children: [
|
|
16581
|
+
/* @__PURE__ */ jsx98(
|
|
16396
16582
|
"button",
|
|
16397
16583
|
{
|
|
16398
16584
|
type: "button",
|
|
@@ -16403,7 +16589,7 @@ var ParameterLinkInner = forwardRef13(
|
|
|
16403
16589
|
children: "edit"
|
|
16404
16590
|
}
|
|
16405
16591
|
),
|
|
16406
|
-
externalLink ? /* @__PURE__ */
|
|
16592
|
+
externalLink ? /* @__PURE__ */ jsx98(
|
|
16407
16593
|
"a",
|
|
16408
16594
|
{
|
|
16409
16595
|
href: externalLink,
|
|
@@ -16411,7 +16597,7 @@ var ParameterLinkInner = forwardRef13(
|
|
|
16411
16597
|
title: "Open link in new tab",
|
|
16412
16598
|
target: "_blank",
|
|
16413
16599
|
rel: "noopener noreferrer",
|
|
16414
|
-
children: /* @__PURE__ */
|
|
16600
|
+
children: /* @__PURE__ */ jsx98(Icon, { icon: "arrows-expand-up-right", iconColor: "currentColor", size: "1rem" })
|
|
16415
16601
|
}
|
|
16416
16602
|
) : null
|
|
16417
16603
|
] })
|
|
@@ -16420,7 +16606,7 @@ var ParameterLinkInner = forwardRef13(
|
|
|
16420
16606
|
);
|
|
16421
16607
|
|
|
16422
16608
|
// src/components/ParameterInputs/ParameterNameAndPublicIdInput.tsx
|
|
16423
|
-
import { Fragment as
|
|
16609
|
+
import { Fragment as Fragment15, jsx as jsx99, jsxs as jsxs67 } from "@emotion/react/jsx-runtime";
|
|
16424
16610
|
var ParameterNameAndPublicIdInput = ({
|
|
16425
16611
|
id,
|
|
16426
16612
|
onBlur,
|
|
@@ -16446,8 +16632,8 @@ var ParameterNameAndPublicIdInput = ({
|
|
|
16446
16632
|
navigator.clipboard.writeText(values[publicIdFieldName]);
|
|
16447
16633
|
};
|
|
16448
16634
|
autoFocus == null ? void 0 : autoFocus();
|
|
16449
|
-
return /* @__PURE__ */
|
|
16450
|
-
/* @__PURE__ */
|
|
16635
|
+
return /* @__PURE__ */ jsxs67(Fragment15, { children: [
|
|
16636
|
+
/* @__PURE__ */ jsx99(
|
|
16451
16637
|
ParameterInput,
|
|
16452
16638
|
{
|
|
16453
16639
|
id: nameIdField,
|
|
@@ -16466,7 +16652,7 @@ var ParameterNameAndPublicIdInput = ({
|
|
|
16466
16652
|
value: values[nameIdField]
|
|
16467
16653
|
}
|
|
16468
16654
|
),
|
|
16469
|
-
/* @__PURE__ */
|
|
16655
|
+
/* @__PURE__ */ jsx99(
|
|
16470
16656
|
ParameterInput,
|
|
16471
16657
|
{
|
|
16472
16658
|
id: publicIdFieldName,
|
|
@@ -16480,11 +16666,11 @@ var ParameterNameAndPublicIdInput = ({
|
|
|
16480
16666
|
caption: publicIdCaption,
|
|
16481
16667
|
placeholder: publicIdPlaceholderText,
|
|
16482
16668
|
errorMessage: publicIdError,
|
|
16483
|
-
menuItems: /* @__PURE__ */
|
|
16669
|
+
menuItems: /* @__PURE__ */ jsx99(
|
|
16484
16670
|
MenuItem,
|
|
16485
16671
|
{
|
|
16486
16672
|
disabled: !values[publicIdFieldName],
|
|
16487
|
-
icon: /* @__PURE__ */
|
|
16673
|
+
icon: /* @__PURE__ */ jsx99(Icon, { icon: "path-trim", iconColor: "currentColor" }),
|
|
16488
16674
|
onClick: handleCopyPidFieldValue,
|
|
16489
16675
|
children: "Copy"
|
|
16490
16676
|
}
|
|
@@ -16492,12 +16678,12 @@ var ParameterNameAndPublicIdInput = ({
|
|
|
16492
16678
|
value: values[publicIdFieldName]
|
|
16493
16679
|
}
|
|
16494
16680
|
),
|
|
16495
|
-
(warnOverLength == null ? void 0 : warnOverLength.length) && values[publicIdFieldName].length > warnOverLength.length ? /* @__PURE__ */
|
|
16681
|
+
(warnOverLength == null ? void 0 : warnOverLength.length) && values[publicIdFieldName].length > warnOverLength.length ? /* @__PURE__ */ jsx99(Callout, { type: "caution", children: warnOverLength.message }) : null
|
|
16496
16682
|
] });
|
|
16497
16683
|
};
|
|
16498
16684
|
|
|
16499
16685
|
// src/components/ParameterInputs/ParameterRichText.tsx
|
|
16500
|
-
import { css as
|
|
16686
|
+
import { css as css82 } from "@emotion/react";
|
|
16501
16687
|
import { ListItemNode, ListNode as ListNode2 } from "@lexical/list";
|
|
16502
16688
|
import {
|
|
16503
16689
|
CODE,
|
|
@@ -16649,23 +16835,23 @@ function DisableStylesPlugin() {
|
|
|
16649
16835
|
}
|
|
16650
16836
|
|
|
16651
16837
|
// src/components/ParameterInputs/rich-text/editorStyles.ts
|
|
16652
|
-
import { css as
|
|
16653
|
-
var textBold =
|
|
16838
|
+
import { css as css79 } from "@emotion/css";
|
|
16839
|
+
var textBold = css79`
|
|
16654
16840
|
font-weight: 700;
|
|
16655
16841
|
`;
|
|
16656
|
-
var textItalic =
|
|
16842
|
+
var textItalic = css79`
|
|
16657
16843
|
font-style: italic;
|
|
16658
16844
|
`;
|
|
16659
|
-
var textUnderline =
|
|
16845
|
+
var textUnderline = css79`
|
|
16660
16846
|
text-decoration: underline;
|
|
16661
16847
|
`;
|
|
16662
|
-
var textStrikethrough =
|
|
16848
|
+
var textStrikethrough = css79`
|
|
16663
16849
|
text-decoration: line-through;
|
|
16664
16850
|
`;
|
|
16665
|
-
var textUnderlineStrikethrough =
|
|
16851
|
+
var textUnderlineStrikethrough = css79`
|
|
16666
16852
|
text-decoration: underline line-through;
|
|
16667
16853
|
`;
|
|
16668
|
-
var textCode =
|
|
16854
|
+
var textCode = css79`
|
|
16669
16855
|
background-color: var(--gray-100);
|
|
16670
16856
|
border-radius: var(--rounded-sm);
|
|
16671
16857
|
display: inline-block;
|
|
@@ -16676,68 +16862,68 @@ var textCode = css76`
|
|
|
16676
16862
|
padding-left: var(--spacing-xs);
|
|
16677
16863
|
padding-right: var(--spacing-xs);
|
|
16678
16864
|
`;
|
|
16679
|
-
var textSuperscript =
|
|
16865
|
+
var textSuperscript = css79`
|
|
16680
16866
|
vertical-align: super;
|
|
16681
16867
|
font-size: smaller;
|
|
16682
16868
|
`;
|
|
16683
|
-
var textSubscript =
|
|
16869
|
+
var textSubscript = css79`
|
|
16684
16870
|
vertical-align: sub;
|
|
16685
16871
|
font-size: smaller;
|
|
16686
16872
|
`;
|
|
16687
|
-
var linkElement =
|
|
16873
|
+
var linkElement = css79`
|
|
16688
16874
|
${link}
|
|
16689
16875
|
${linkColorDefault}
|
|
16690
16876
|
text-decoration: underline;
|
|
16691
16877
|
`;
|
|
16692
|
-
var h12 =
|
|
16878
|
+
var h12 = css79`
|
|
16693
16879
|
font-size: clamp(1.35rem, var(--fluid-font-base), 1.7rem);
|
|
16694
16880
|
`;
|
|
16695
|
-
var h22 =
|
|
16881
|
+
var h22 = css79`
|
|
16696
16882
|
font-size: clamp(1.35rem, var(--fluid-font-base), 1.6rem);
|
|
16697
16883
|
`;
|
|
16698
|
-
var h32 =
|
|
16884
|
+
var h32 = css79`
|
|
16699
16885
|
font-size: clamp(1.25rem, var(--fluid-font-base), 1.5rem);
|
|
16700
16886
|
`;
|
|
16701
|
-
var h42 =
|
|
16887
|
+
var h42 = css79`
|
|
16702
16888
|
font-size: clamp(1.15rem, var(--fluid-font-base), 1.25rem);
|
|
16703
16889
|
`;
|
|
16704
|
-
var h52 =
|
|
16890
|
+
var h52 = css79`
|
|
16705
16891
|
font-size: clamp(var(--fs-base), var(--fluid-font-base), 1.15rem);
|
|
16706
16892
|
`;
|
|
16707
|
-
var h62 =
|
|
16893
|
+
var h62 = css79`
|
|
16708
16894
|
font-size: var(--fs-base);
|
|
16709
16895
|
`;
|
|
16710
|
-
var heading1Element =
|
|
16896
|
+
var heading1Element = css79`
|
|
16711
16897
|
${h12}
|
|
16712
16898
|
${commonHeadingAttr(true)}
|
|
16713
16899
|
${commonLineHeight}
|
|
16714
16900
|
`;
|
|
16715
|
-
var heading2Element =
|
|
16901
|
+
var heading2Element = css79`
|
|
16716
16902
|
${h22}
|
|
16717
16903
|
${commonHeadingAttr(true)}
|
|
16718
16904
|
${commonLineHeight}
|
|
16719
16905
|
`;
|
|
16720
|
-
var heading3Element =
|
|
16906
|
+
var heading3Element = css79`
|
|
16721
16907
|
${h32}
|
|
16722
16908
|
${commonHeadingAttr(true)}
|
|
16723
16909
|
${commonLineHeight}
|
|
16724
16910
|
`;
|
|
16725
|
-
var heading4Element =
|
|
16911
|
+
var heading4Element = css79`
|
|
16726
16912
|
${h42}
|
|
16727
16913
|
${commonHeadingAttr(true)}
|
|
16728
16914
|
${commonLineHeight}
|
|
16729
16915
|
`;
|
|
16730
|
-
var heading5Element =
|
|
16916
|
+
var heading5Element = css79`
|
|
16731
16917
|
${h52}
|
|
16732
16918
|
${commonHeadingAttr(true)}
|
|
16733
16919
|
${commonLineHeight}
|
|
16734
16920
|
`;
|
|
16735
|
-
var heading6Element =
|
|
16921
|
+
var heading6Element = css79`
|
|
16736
16922
|
${h62}
|
|
16737
16923
|
${commonHeadingAttr(true)}
|
|
16738
16924
|
${commonLineHeight}
|
|
16739
16925
|
`;
|
|
16740
|
-
var paragraphElement =
|
|
16926
|
+
var paragraphElement = css79`
|
|
16741
16927
|
line-height: 1.5;
|
|
16742
16928
|
margin-bottom: var(--spacing-base);
|
|
16743
16929
|
|
|
@@ -16745,7 +16931,7 @@ var paragraphElement = css76`
|
|
|
16745
16931
|
margin-bottom: 0;
|
|
16746
16932
|
}
|
|
16747
16933
|
`;
|
|
16748
|
-
var orderedListElement =
|
|
16934
|
+
var orderedListElement = css79`
|
|
16749
16935
|
${commonLineHeight}
|
|
16750
16936
|
display: block;
|
|
16751
16937
|
list-style: decimal;
|
|
@@ -16774,7 +16960,7 @@ var orderedListElement = css76`
|
|
|
16774
16960
|
}
|
|
16775
16961
|
}
|
|
16776
16962
|
`;
|
|
16777
|
-
var unorderedListElement =
|
|
16963
|
+
var unorderedListElement = css79`
|
|
16778
16964
|
${commonLineHeight}
|
|
16779
16965
|
display: block;
|
|
16780
16966
|
list-style: disc;
|
|
@@ -16795,13 +16981,13 @@ var unorderedListElement = css76`
|
|
|
16795
16981
|
}
|
|
16796
16982
|
}
|
|
16797
16983
|
`;
|
|
16798
|
-
var listItemElement =
|
|
16984
|
+
var listItemElement = css79`
|
|
16799
16985
|
margin-left: var(--spacing-md);
|
|
16800
16986
|
`;
|
|
16801
|
-
var nestedListItemElement =
|
|
16987
|
+
var nestedListItemElement = css79`
|
|
16802
16988
|
list-style-type: none;
|
|
16803
16989
|
`;
|
|
16804
|
-
var blockquoteElement =
|
|
16990
|
+
var blockquoteElement = css79`
|
|
16805
16991
|
border-left: 0.25rem solid var(--gray-300);
|
|
16806
16992
|
color: var(--gray-600);
|
|
16807
16993
|
margin-bottom: var(--spacing-base);
|
|
@@ -16811,7 +16997,7 @@ var blockquoteElement = css76`
|
|
|
16811
16997
|
margin-bottom: 0;
|
|
16812
16998
|
}
|
|
16813
16999
|
`;
|
|
16814
|
-
var codeElement =
|
|
17000
|
+
var codeElement = css79`
|
|
16815
17001
|
background-color: var(--gray-100);
|
|
16816
17002
|
border-radius: var(--rounded-sm);
|
|
16817
17003
|
display: block;
|
|
@@ -16828,7 +17014,7 @@ var codeElement = css76`
|
|
|
16828
17014
|
`;
|
|
16829
17015
|
|
|
16830
17016
|
// src/components/ParameterInputs/rich-text/LinkNodePlugin.tsx
|
|
16831
|
-
import { css as
|
|
17017
|
+
import { css as css80 } from "@emotion/react";
|
|
16832
17018
|
import { useLexicalComposerContext as useLexicalComposerContext2 } from "@lexical/react/LexicalComposerContext";
|
|
16833
17019
|
import { NodeEventPlugin } from "@lexical/react/LexicalNodeEventPlugin";
|
|
16834
17020
|
import { addClassNamesToElement, isHTMLAnchorElement, mergeRegister as mergeRegister2 } from "@lexical/utils";
|
|
@@ -16846,35 +17032,6 @@ import {
|
|
|
16846
17032
|
} from "lexical";
|
|
16847
17033
|
import { useCallback as useCallback4, useEffect as useEffect11, useRef as useRef6, useState as useState11 } from "react";
|
|
16848
17034
|
|
|
16849
|
-
// src/components/Popover/Popover.styles.ts
|
|
16850
|
-
import { css as css77 } from "@emotion/react";
|
|
16851
|
-
var PopoverBtn = css77`
|
|
16852
|
-
border: none;
|
|
16853
|
-
background: none;
|
|
16854
|
-
`;
|
|
16855
|
-
var PopoverDefaulterTriggerBtn = css77`
|
|
16856
|
-
border: none;
|
|
16857
|
-
background: none;
|
|
16858
|
-
padding: var(--spacing-2xs);
|
|
16859
|
-
border-radius: var(--rounded-full);
|
|
16860
|
-
|
|
16861
|
-
&:hover {
|
|
16862
|
-
background-color: rgba(0, 0, 0, 0.05);
|
|
16863
|
-
}
|
|
16864
|
-
`;
|
|
16865
|
-
var Popover = css77`
|
|
16866
|
-
border-left: var(--spacing-xs) solid var(--brand-secondary-3);
|
|
16867
|
-
border-radius: var(--rounded-base);
|
|
16868
|
-
box-shadow: var(--shadow-base);
|
|
16869
|
-
background: var(--white);
|
|
16870
|
-
display: grid;
|
|
16871
|
-
gap: var(--spacing-sm);
|
|
16872
|
-
padding: var(--spacing-sm);
|
|
16873
|
-
font-size: var(--fs-sm);
|
|
16874
|
-
max-width: 220px;
|
|
16875
|
-
z-index: var(--z-tooltip);
|
|
16876
|
-
`;
|
|
16877
|
-
|
|
16878
17035
|
// src/components/ParameterInputs/rich-text/utils.ts
|
|
16879
17036
|
import { $isAtNodeEnd } from "@lexical/selection";
|
|
16880
17037
|
import { $isElementNode } from "lexical";
|
|
@@ -16911,7 +17068,7 @@ var getSelectedNode = (selection) => {
|
|
|
16911
17068
|
};
|
|
16912
17069
|
|
|
16913
17070
|
// src/components/ParameterInputs/rich-text/LinkNodePlugin.tsx
|
|
16914
|
-
import { Fragment as
|
|
17071
|
+
import { Fragment as Fragment16, jsx as jsx100, jsxs as jsxs68 } from "@emotion/react/jsx-runtime";
|
|
16915
17072
|
var isProjectMapLinkValue = (value) => {
|
|
16916
17073
|
return (value == null ? void 0 : value.type) === "projectMapNode" && Boolean(
|
|
16917
17074
|
value.nodeId && value.path && value.projectMapId
|
|
@@ -17198,16 +17355,16 @@ var OPEN_LINK_NODE_MODAL_COMMAND = createCommand(
|
|
|
17198
17355
|
);
|
|
17199
17356
|
var LINK_POPOVER_OFFSET_X = 0;
|
|
17200
17357
|
var LINK_POPOVER_OFFSET_Y = 8;
|
|
17201
|
-
var linkPopover =
|
|
17358
|
+
var linkPopover = css80`
|
|
17202
17359
|
position: absolute;
|
|
17203
17360
|
z-index: 5;
|
|
17204
17361
|
`;
|
|
17205
|
-
var linkPopoverContainer =
|
|
17362
|
+
var linkPopoverContainer = css80`
|
|
17206
17363
|
${Popover};
|
|
17207
17364
|
align-items: center;
|
|
17208
17365
|
display: flex;
|
|
17209
17366
|
`;
|
|
17210
|
-
var linkPopoverAnchor =
|
|
17367
|
+
var linkPopoverAnchor = css80`
|
|
17211
17368
|
${link}
|
|
17212
17369
|
${linkColorDefault}
|
|
17213
17370
|
`;
|
|
@@ -17354,8 +17511,8 @@ function LinkNodePlugin({ onConnectLink, getBoundPath }) {
|
|
|
17354
17511
|
});
|
|
17355
17512
|
});
|
|
17356
17513
|
};
|
|
17357
|
-
return /* @__PURE__ */
|
|
17358
|
-
/* @__PURE__ */
|
|
17514
|
+
return /* @__PURE__ */ jsxs68(Fragment16, { children: [
|
|
17515
|
+
/* @__PURE__ */ jsx100(
|
|
17359
17516
|
NodeEventPlugin,
|
|
17360
17517
|
{
|
|
17361
17518
|
nodeType: LinkNode,
|
|
@@ -17365,7 +17522,7 @@ function LinkNodePlugin({ onConnectLink, getBoundPath }) {
|
|
|
17365
17522
|
}
|
|
17366
17523
|
}
|
|
17367
17524
|
),
|
|
17368
|
-
linkPopoverState ? /* @__PURE__ */
|
|
17525
|
+
linkPopoverState ? /* @__PURE__ */ jsx100(
|
|
17369
17526
|
"div",
|
|
17370
17527
|
{
|
|
17371
17528
|
css: linkPopover,
|
|
@@ -17374,8 +17531,8 @@ function LinkNodePlugin({ onConnectLink, getBoundPath }) {
|
|
|
17374
17531
|
top: linkPopoverState.position.y
|
|
17375
17532
|
},
|
|
17376
17533
|
ref: linkPopoverElRef,
|
|
17377
|
-
children: /* @__PURE__ */
|
|
17378
|
-
linkPopoverState.node.__link.type === "projectMapNode" ? linkPopoverState.node.__link.path : /* @__PURE__ */
|
|
17534
|
+
children: /* @__PURE__ */ jsxs68("div", { css: linkPopoverContainer, children: [
|
|
17535
|
+
linkPopoverState.node.__link.type === "projectMapNode" ? linkPopoverState.node.__link.path : /* @__PURE__ */ jsx100(
|
|
17379
17536
|
"a",
|
|
17380
17537
|
{
|
|
17381
17538
|
href: parsePath(
|
|
@@ -17387,7 +17544,7 @@ function LinkNodePlugin({ onConnectLink, getBoundPath }) {
|
|
|
17387
17544
|
children: parsePath(linkPopoverState.node.__link.path)
|
|
17388
17545
|
}
|
|
17389
17546
|
),
|
|
17390
|
-
/* @__PURE__ */
|
|
17547
|
+
/* @__PURE__ */ jsx100(
|
|
17391
17548
|
Button,
|
|
17392
17549
|
{
|
|
17393
17550
|
size: "xs",
|
|
@@ -17395,7 +17552,7 @@ function LinkNodePlugin({ onConnectLink, getBoundPath }) {
|
|
|
17395
17552
|
onEditLinkNode(linkPopoverState.node);
|
|
17396
17553
|
},
|
|
17397
17554
|
buttonType: "ghost",
|
|
17398
|
-
children: /* @__PURE__ */
|
|
17555
|
+
children: /* @__PURE__ */ jsx100(Icon, { icon: "pen", size: "1rem", title: "Edit link" })
|
|
17399
17556
|
}
|
|
17400
17557
|
)
|
|
17401
17558
|
] })
|
|
@@ -17420,7 +17577,7 @@ import {
|
|
|
17420
17577
|
INDENT_CONTENT_COMMAND
|
|
17421
17578
|
} from "lexical";
|
|
17422
17579
|
import { useEffect as useEffect12 } from "react";
|
|
17423
|
-
import { jsx as
|
|
17580
|
+
import { jsx as jsx101 } from "@emotion/react/jsx-runtime";
|
|
17424
17581
|
function isIndentPermitted(maxDepth) {
|
|
17425
17582
|
const selection = $getSelection2();
|
|
17426
17583
|
if (!$isRangeSelection2(selection)) {
|
|
@@ -17450,11 +17607,11 @@ function ListIndentPlugin({ maxDepth }) {
|
|
|
17450
17607
|
COMMAND_PRIORITY_CRITICAL
|
|
17451
17608
|
);
|
|
17452
17609
|
}, [editor, maxDepth]);
|
|
17453
|
-
return /* @__PURE__ */
|
|
17610
|
+
return /* @__PURE__ */ jsx101(TabIndentationPlugin, {});
|
|
17454
17611
|
}
|
|
17455
17612
|
|
|
17456
17613
|
// src/components/ParameterInputs/rich-text/RichTextToolbar.tsx
|
|
17457
|
-
import { css as
|
|
17614
|
+
import { css as css81 } from "@emotion/react";
|
|
17458
17615
|
import { $createCodeNode } from "@lexical/code";
|
|
17459
17616
|
import {
|
|
17460
17617
|
$isListNode as $isListNode2,
|
|
@@ -17477,8 +17634,8 @@ import {
|
|
|
17477
17634
|
SELECTION_CHANGE_COMMAND
|
|
17478
17635
|
} from "lexical";
|
|
17479
17636
|
import { useCallback as useCallback5, useEffect as useEffect13, useMemo as useMemo3, useState as useState12 } from "react";
|
|
17480
|
-
import { Fragment as
|
|
17481
|
-
var toolbar =
|
|
17637
|
+
import { Fragment as Fragment17, jsx as jsx102, jsxs as jsxs69 } from "@emotion/react/jsx-runtime";
|
|
17638
|
+
var toolbar = css81`
|
|
17482
17639
|
background: var(--gray-50);
|
|
17483
17640
|
border-radius: var(--rounded-base);
|
|
17484
17641
|
display: flex;
|
|
@@ -17490,7 +17647,7 @@ var toolbar = css79`
|
|
|
17490
17647
|
top: calc(var(--spacing-sm) * -2);
|
|
17491
17648
|
z-index: 10;
|
|
17492
17649
|
`;
|
|
17493
|
-
var toolbarGroup =
|
|
17650
|
+
var toolbarGroup = css81`
|
|
17494
17651
|
display: flex;
|
|
17495
17652
|
gap: var(--spacing-xs);
|
|
17496
17653
|
position: relative;
|
|
@@ -17506,7 +17663,7 @@ var toolbarGroup = css79`
|
|
|
17506
17663
|
width: 1px;
|
|
17507
17664
|
}
|
|
17508
17665
|
`;
|
|
17509
|
-
var richTextToolbarButton =
|
|
17666
|
+
var richTextToolbarButton = css81`
|
|
17510
17667
|
align-items: center;
|
|
17511
17668
|
appearance: none;
|
|
17512
17669
|
border: 0;
|
|
@@ -17519,17 +17676,17 @@ var richTextToolbarButton = css79`
|
|
|
17519
17676
|
min-width: 32px;
|
|
17520
17677
|
padding: 0 var(--spacing-sm);
|
|
17521
17678
|
`;
|
|
17522
|
-
var richTextToolbarButtonActive =
|
|
17679
|
+
var richTextToolbarButtonActive = css81`
|
|
17523
17680
|
background: var(--gray-200);
|
|
17524
17681
|
`;
|
|
17525
|
-
var toolbarIcon =
|
|
17682
|
+
var toolbarIcon = css81`
|
|
17526
17683
|
color: inherit;
|
|
17527
17684
|
`;
|
|
17528
|
-
var toolbarChevron =
|
|
17685
|
+
var toolbarChevron = css81`
|
|
17529
17686
|
margin-left: var(--spacing-xs);
|
|
17530
17687
|
`;
|
|
17531
17688
|
var RichTextToolbarIcon = ({ icon }) => {
|
|
17532
|
-
return /* @__PURE__ */
|
|
17689
|
+
return /* @__PURE__ */ jsx102(Icon, { icon, css: toolbarIcon, size: "1rem" });
|
|
17533
17690
|
};
|
|
17534
17691
|
var FORMATS_WITH_ICON = /* @__PURE__ */ new Map([
|
|
17535
17692
|
["bold", "format-bold"],
|
|
@@ -17638,15 +17795,15 @@ var RichTextToolbar = ({ config, customControls }) => {
|
|
|
17638
17795
|
});
|
|
17639
17796
|
});
|
|
17640
17797
|
}, [editor, updateToolbar]);
|
|
17641
|
-
return /* @__PURE__ */
|
|
17642
|
-
/* @__PURE__ */
|
|
17798
|
+
return /* @__PURE__ */ jsxs69("div", { css: toolbar, children: [
|
|
17799
|
+
/* @__PURE__ */ jsxs69(
|
|
17643
17800
|
Menu,
|
|
17644
17801
|
{
|
|
17645
17802
|
menuLabel: "Elements",
|
|
17646
|
-
menuTrigger: /* @__PURE__ */
|
|
17803
|
+
menuTrigger: /* @__PURE__ */ jsxs69("button", { css: richTextToolbarButton, title: "Text styles", children: [
|
|
17647
17804
|
visibleTextualElements.some((element) => element.type === activeElement) ? getLabelForElement(activeElement) : getLabelForElement("paragraph"),
|
|
17648
17805
|
" ",
|
|
17649
|
-
/* @__PURE__ */
|
|
17806
|
+
/* @__PURE__ */ jsx102(Icon, { icon: "chevron-down", css: [toolbarIcon, toolbarChevron], size: "1rem" })
|
|
17650
17807
|
] }),
|
|
17651
17808
|
placement: "bottom-start",
|
|
17652
17809
|
children: [
|
|
@@ -17656,7 +17813,7 @@ var RichTextToolbar = ({ config, customControls }) => {
|
|
|
17656
17813
|
type: "paragraph"
|
|
17657
17814
|
},
|
|
17658
17815
|
...visibleTextualElements
|
|
17659
|
-
].map((element) => /* @__PURE__ */
|
|
17816
|
+
].map((element) => /* @__PURE__ */ jsx102(
|
|
17660
17817
|
MenuItem,
|
|
17661
17818
|
{
|
|
17662
17819
|
onClick: () => {
|
|
@@ -17666,12 +17823,12 @@ var RichTextToolbar = ({ config, customControls }) => {
|
|
|
17666
17823
|
},
|
|
17667
17824
|
element.type
|
|
17668
17825
|
)),
|
|
17669
|
-
visibleTextualElements.length === 0 ? /* @__PURE__ */
|
|
17826
|
+
visibleTextualElements.length === 0 ? /* @__PURE__ */ jsx102(MenuItem, { disabled: true, children: "Alternative text styles are not available" }) : null
|
|
17670
17827
|
]
|
|
17671
17828
|
}
|
|
17672
17829
|
),
|
|
17673
|
-
visibleFormatsWithIcon.length > 0 || visibleFormatsWithoutIcon.length > 0 ? /* @__PURE__ */
|
|
17674
|
-
visibleFormatsWithIcon.map((format) => /* @__PURE__ */
|
|
17830
|
+
visibleFormatsWithIcon.length > 0 || visibleFormatsWithoutIcon.length > 0 ? /* @__PURE__ */ jsxs69("div", { css: toolbarGroup, children: [
|
|
17831
|
+
visibleFormatsWithIcon.map((format) => /* @__PURE__ */ jsx102(Tooltip, { title: format.label, placement: "top", children: /* @__PURE__ */ jsx102(
|
|
17675
17832
|
"button",
|
|
17676
17833
|
{
|
|
17677
17834
|
onClick: () => {
|
|
@@ -17681,16 +17838,16 @@ var RichTextToolbar = ({ config, customControls }) => {
|
|
|
17681
17838
|
richTextToolbarButton,
|
|
17682
17839
|
activeFormats.includes(format.type) ? richTextToolbarButtonActive : null
|
|
17683
17840
|
],
|
|
17684
|
-
children: /* @__PURE__ */
|
|
17841
|
+
children: /* @__PURE__ */ jsx102(RichTextToolbarIcon, { icon: FORMATS_WITH_ICON.get(format.type) })
|
|
17685
17842
|
}
|
|
17686
17843
|
) }, format.type)),
|
|
17687
|
-
visibleFormatsWithoutIcon.length > 0 ? /* @__PURE__ */
|
|
17844
|
+
visibleFormatsWithoutIcon.length > 0 ? /* @__PURE__ */ jsx102(
|
|
17688
17845
|
Menu,
|
|
17689
17846
|
{
|
|
17690
17847
|
menuLabel: "Alternative text styles",
|
|
17691
|
-
menuTrigger: /* @__PURE__ */
|
|
17848
|
+
menuTrigger: /* @__PURE__ */ jsx102("button", { css: richTextToolbarButton, title: "Alternative text styles", children: /* @__PURE__ */ jsx102(Icon, { icon: "more-alt", css: toolbarIcon }) }),
|
|
17692
17849
|
placement: "bottom-start",
|
|
17693
|
-
children: visibleFormatsWithoutIcon.map((format) => /* @__PURE__ */
|
|
17850
|
+
children: visibleFormatsWithoutIcon.map((format) => /* @__PURE__ */ jsx102(
|
|
17694
17851
|
MenuItem,
|
|
17695
17852
|
{
|
|
17696
17853
|
onClick: () => {
|
|
@@ -17703,19 +17860,19 @@ var RichTextToolbar = ({ config, customControls }) => {
|
|
|
17703
17860
|
}
|
|
17704
17861
|
) : null
|
|
17705
17862
|
] }) : null,
|
|
17706
|
-
visibleElementsWithIcons.size > 0 ? /* @__PURE__ */
|
|
17707
|
-
linkElementVisible ? /* @__PURE__ */
|
|
17863
|
+
visibleElementsWithIcons.size > 0 ? /* @__PURE__ */ jsxs69("div", { css: toolbarGroup, children: [
|
|
17864
|
+
linkElementVisible ? /* @__PURE__ */ jsx102(Tooltip, { title: "Link", placement: "top", children: /* @__PURE__ */ jsx102(
|
|
17708
17865
|
"button",
|
|
17709
17866
|
{
|
|
17710
17867
|
onClick: () => {
|
|
17711
17868
|
isLink ? editor.dispatchCommand(REMOVE_LINK_NODE_COMMAND, {}) : editor.dispatchCommand(OPEN_LINK_NODE_MODAL_COMMAND, {});
|
|
17712
17869
|
},
|
|
17713
17870
|
css: [richTextToolbarButton, isLink ? richTextToolbarButtonActive : null],
|
|
17714
|
-
children: /* @__PURE__ */
|
|
17871
|
+
children: /* @__PURE__ */ jsx102(RichTextToolbarIcon, { icon: "link" })
|
|
17715
17872
|
}
|
|
17716
17873
|
) }) : null,
|
|
17717
|
-
visibleLists.size > 0 ? /* @__PURE__ */
|
|
17718
|
-
visibleLists.has("unorderedList") ? /* @__PURE__ */
|
|
17874
|
+
visibleLists.size > 0 ? /* @__PURE__ */ jsxs69(Fragment17, { children: [
|
|
17875
|
+
visibleLists.has("unorderedList") ? /* @__PURE__ */ jsx102(Tooltip, { title: "Bullet List", placement: "top", children: /* @__PURE__ */ jsx102(
|
|
17719
17876
|
"button",
|
|
17720
17877
|
{
|
|
17721
17878
|
onClick: () => {
|
|
@@ -17725,10 +17882,10 @@ var RichTextToolbar = ({ config, customControls }) => {
|
|
|
17725
17882
|
richTextToolbarButton,
|
|
17726
17883
|
activeElement === "unorderedList" ? richTextToolbarButtonActive : null
|
|
17727
17884
|
],
|
|
17728
|
-
children: /* @__PURE__ */
|
|
17885
|
+
children: /* @__PURE__ */ jsx102(RichTextToolbarIcon, { icon: "layout-list" })
|
|
17729
17886
|
}
|
|
17730
17887
|
) }) : null,
|
|
17731
|
-
visibleLists.has("orderedList") ? /* @__PURE__ */
|
|
17888
|
+
visibleLists.has("orderedList") ? /* @__PURE__ */ jsx102(Tooltip, { title: "Ordered List", placement: "top", children: /* @__PURE__ */ jsx102(
|
|
17732
17889
|
"button",
|
|
17733
17890
|
{
|
|
17734
17891
|
onClick: () => {
|
|
@@ -17738,32 +17895,32 @@ var RichTextToolbar = ({ config, customControls }) => {
|
|
|
17738
17895
|
richTextToolbarButton,
|
|
17739
17896
|
activeElement === "orderedList" ? richTextToolbarButtonActive : null
|
|
17740
17897
|
],
|
|
17741
|
-
children: /* @__PURE__ */
|
|
17898
|
+
children: /* @__PURE__ */ jsx102(RichTextToolbarIcon, { icon: "layout-list-numbered" })
|
|
17742
17899
|
}
|
|
17743
17900
|
) }) : null
|
|
17744
17901
|
] }) : null,
|
|
17745
|
-
quoteElementVisible ? /* @__PURE__ */
|
|
17902
|
+
quoteElementVisible ? /* @__PURE__ */ jsx102(Tooltip, { title: "Blockquote", placement: "top", children: /* @__PURE__ */ jsx102(
|
|
17746
17903
|
"button",
|
|
17747
17904
|
{
|
|
17748
17905
|
onClick: () => {
|
|
17749
17906
|
activeElement === "quote" ? onSelectElement("paragraph") : onSelectElement("quote");
|
|
17750
17907
|
},
|
|
17751
17908
|
css: [richTextToolbarButton, activeElement === "quote" ? richTextToolbarButtonActive : null],
|
|
17752
|
-
children: /* @__PURE__ */
|
|
17909
|
+
children: /* @__PURE__ */ jsx102(RichTextToolbarIcon, { icon: "quote" })
|
|
17753
17910
|
}
|
|
17754
17911
|
) }) : null,
|
|
17755
|
-
codeElementVisible ? /* @__PURE__ */
|
|
17912
|
+
codeElementVisible ? /* @__PURE__ */ jsx102(Tooltip, { title: "Code Block", placement: "top", children: /* @__PURE__ */ jsx102(
|
|
17756
17913
|
"button",
|
|
17757
17914
|
{
|
|
17758
17915
|
onClick: () => {
|
|
17759
17916
|
activeElement === "code" ? onSelectElement("paragraph") : onSelectElement("code");
|
|
17760
17917
|
},
|
|
17761
17918
|
css: [richTextToolbarButton, activeElement === "code" ? richTextToolbarButtonActive : null],
|
|
17762
|
-
children: /* @__PURE__ */
|
|
17919
|
+
children: /* @__PURE__ */ jsx102(RichTextToolbarIcon, { icon: "code-slash" })
|
|
17763
17920
|
}
|
|
17764
17921
|
) }) : null
|
|
17765
17922
|
] }) : null,
|
|
17766
|
-
customControls ? /* @__PURE__ */
|
|
17923
|
+
customControls ? /* @__PURE__ */ jsx102("div", { css: toolbarGroup, children: customControls }) : null
|
|
17767
17924
|
] });
|
|
17768
17925
|
};
|
|
17769
17926
|
var RichTextToolbar_default = RichTextToolbar;
|
|
@@ -17877,7 +18034,7 @@ var useRichTextToolbarState = ({ config }) => {
|
|
|
17877
18034
|
};
|
|
17878
18035
|
|
|
17879
18036
|
// src/components/ParameterInputs/ParameterRichText.tsx
|
|
17880
|
-
import { Fragment as
|
|
18037
|
+
import { Fragment as Fragment18, jsx as jsx103, jsxs as jsxs70 } from "@emotion/react/jsx-runtime";
|
|
17881
18038
|
var ParameterRichText = ({
|
|
17882
18039
|
label,
|
|
17883
18040
|
labelLeadingIcon,
|
|
@@ -17902,7 +18059,7 @@ var ParameterRichText = ({
|
|
|
17902
18059
|
variables,
|
|
17903
18060
|
customControls
|
|
17904
18061
|
}) => {
|
|
17905
|
-
return /* @__PURE__ */
|
|
18062
|
+
return /* @__PURE__ */ jsxs70(
|
|
17906
18063
|
ParameterShell,
|
|
17907
18064
|
{
|
|
17908
18065
|
"data-testid": "parameter-input",
|
|
@@ -17916,7 +18073,7 @@ var ParameterRichText = ({
|
|
|
17916
18073
|
captionTestId,
|
|
17917
18074
|
menuItems,
|
|
17918
18075
|
children: [
|
|
17919
|
-
/* @__PURE__ */
|
|
18076
|
+
/* @__PURE__ */ jsx103(
|
|
17920
18077
|
ParameterRichTextInner,
|
|
17921
18078
|
{
|
|
17922
18079
|
value,
|
|
@@ -17934,23 +18091,23 @@ var ParameterRichText = ({
|
|
|
17934
18091
|
children
|
|
17935
18092
|
}
|
|
17936
18093
|
),
|
|
17937
|
-
menuItems ? /* @__PURE__ */
|
|
18094
|
+
menuItems ? /* @__PURE__ */ jsx103(ParameterMenuButton, { label: `${label} menu`, children: /* @__PURE__ */ jsx103(Fragment18, { children: menuItems }) }) : null
|
|
17938
18095
|
]
|
|
17939
18096
|
}
|
|
17940
18097
|
);
|
|
17941
18098
|
};
|
|
17942
|
-
var editorWrapper =
|
|
18099
|
+
var editorWrapper = css82`
|
|
17943
18100
|
display: flex;
|
|
17944
18101
|
flex-flow: column;
|
|
17945
18102
|
flex-grow: 1;
|
|
17946
18103
|
`;
|
|
17947
|
-
var editorContainer =
|
|
18104
|
+
var editorContainer = css82`
|
|
17948
18105
|
display: flex;
|
|
17949
18106
|
flex-flow: column;
|
|
17950
18107
|
flex-grow: 1;
|
|
17951
18108
|
position: relative;
|
|
17952
18109
|
`;
|
|
17953
|
-
var editorPlaceholder =
|
|
18110
|
+
var editorPlaceholder = css82`
|
|
17954
18111
|
color: var(--gray-500);
|
|
17955
18112
|
font-style: italic;
|
|
17956
18113
|
/* 1px is added to make sure caret is clearly visible when field is focused
|
|
@@ -17961,7 +18118,7 @@ var editorPlaceholder = css80`
|
|
|
17961
18118
|
top: var(--spacing-xs);
|
|
17962
18119
|
user-select: none;
|
|
17963
18120
|
`;
|
|
17964
|
-
var editorInput =
|
|
18121
|
+
var editorInput = css82`
|
|
17965
18122
|
background: var(--white);
|
|
17966
18123
|
border: 1px solid var(--white);
|
|
17967
18124
|
border-radius: var(--rounded-sm);
|
|
@@ -18045,8 +18202,8 @@ var ParameterRichTextInner = ({
|
|
|
18045
18202
|
},
|
|
18046
18203
|
editable: !readOnly
|
|
18047
18204
|
};
|
|
18048
|
-
return /* @__PURE__ */
|
|
18049
|
-
/* @__PURE__ */
|
|
18205
|
+
return /* @__PURE__ */ jsxs70(Fragment18, { children: [
|
|
18206
|
+
/* @__PURE__ */ jsx103("div", { css: [editorWrapper], className: editorWrapperClassName, children: /* @__PURE__ */ jsx103(LexicalComposer, { initialConfig: lexicalConfig, children: /* @__PURE__ */ jsx103(
|
|
18050
18207
|
RichText,
|
|
18051
18208
|
{
|
|
18052
18209
|
onChange,
|
|
@@ -18102,20 +18259,20 @@ var RichText = ({
|
|
|
18102
18259
|
removeUpdateListener();
|
|
18103
18260
|
};
|
|
18104
18261
|
}, []);
|
|
18105
|
-
return /* @__PURE__ */
|
|
18106
|
-
readOnly ? null : /* @__PURE__ */
|
|
18107
|
-
/* @__PURE__ */
|
|
18108
|
-
/* @__PURE__ */
|
|
18262
|
+
return /* @__PURE__ */ jsxs70(Fragment18, { children: [
|
|
18263
|
+
readOnly ? null : /* @__PURE__ */ jsx103(RichTextToolbar_default, { config, customControls }),
|
|
18264
|
+
/* @__PURE__ */ jsxs70("div", { css: editorContainer, ref: editorContainerRef, "data-testid": "value-container", children: [
|
|
18265
|
+
/* @__PURE__ */ jsx103(
|
|
18109
18266
|
RichTextPlugin,
|
|
18110
18267
|
{
|
|
18111
|
-
contentEditable: /* @__PURE__ */
|
|
18112
|
-
placeholder: /* @__PURE__ */
|
|
18268
|
+
contentEditable: /* @__PURE__ */ jsx103(ContentEditable, { css: editorInput, className: editorInputClassName }),
|
|
18269
|
+
placeholder: /* @__PURE__ */ jsx103("div", { css: editorPlaceholder, children: readOnly ? "empty" : "start editing..." }),
|
|
18113
18270
|
ErrorBoundary: LexicalErrorBoundary
|
|
18114
18271
|
}
|
|
18115
18272
|
),
|
|
18116
|
-
/* @__PURE__ */
|
|
18117
|
-
readOnly ? null : /* @__PURE__ */
|
|
18118
|
-
/* @__PURE__ */
|
|
18273
|
+
/* @__PURE__ */ jsx103(ListPlugin, {}),
|
|
18274
|
+
readOnly ? null : /* @__PURE__ */ jsx103(HistoryPlugin, {}),
|
|
18275
|
+
/* @__PURE__ */ jsx103(
|
|
18119
18276
|
LinkNodePlugin,
|
|
18120
18277
|
{
|
|
18121
18278
|
onConnectLink: onConnectLink ? onConnectLink : () => Promise.resolve(),
|
|
@@ -18125,27 +18282,27 @@ var RichText = ({
|
|
|
18125
18282
|
} : void 0
|
|
18126
18283
|
}
|
|
18127
18284
|
),
|
|
18128
|
-
/* @__PURE__ */
|
|
18129
|
-
/* @__PURE__ */
|
|
18130
|
-
/* @__PURE__ */
|
|
18131
|
-
/* @__PURE__ */
|
|
18285
|
+
/* @__PURE__ */ jsx103(ListIndentPlugin, { maxDepth: 4 }),
|
|
18286
|
+
/* @__PURE__ */ jsx103(DisableStylesPlugin, {}),
|
|
18287
|
+
/* @__PURE__ */ jsx103(MarkdownShortcutPlugin, { transformers: MARKDOWN_TRANSFORMERS }),
|
|
18288
|
+
/* @__PURE__ */ jsx103(Fragment18, { children })
|
|
18132
18289
|
] })
|
|
18133
18290
|
] });
|
|
18134
18291
|
};
|
|
18135
18292
|
|
|
18136
18293
|
// src/components/ParameterInputs/ParameterSelect.tsx
|
|
18137
|
-
import { forwardRef as
|
|
18138
|
-
import { jsx as
|
|
18139
|
-
var ParameterSelect =
|
|
18294
|
+
import { forwardRef as forwardRef15 } from "react";
|
|
18295
|
+
import { jsx as jsx104, jsxs as jsxs71 } from "@emotion/react/jsx-runtime";
|
|
18296
|
+
var ParameterSelect = forwardRef15(
|
|
18140
18297
|
({ defaultOption, options, ...props }, ref) => {
|
|
18141
18298
|
const { shellProps, innerProps } = extractParameterProps(props);
|
|
18142
|
-
return /* @__PURE__ */
|
|
18299
|
+
return /* @__PURE__ */ jsx104(ParameterShell, { ...shellProps, children: /* @__PURE__ */ jsx104(ParameterSelectInner, { options, defaultOption, ...innerProps, ref }) });
|
|
18143
18300
|
}
|
|
18144
18301
|
);
|
|
18145
|
-
var ParameterSelectInner =
|
|
18302
|
+
var ParameterSelectInner = forwardRef15(
|
|
18146
18303
|
({ defaultOption, options, ...props }, ref) => {
|
|
18147
18304
|
const { id, label, hiddenLabel } = useParameterShell();
|
|
18148
|
-
return /* @__PURE__ */
|
|
18305
|
+
return /* @__PURE__ */ jsxs71(
|
|
18149
18306
|
"select",
|
|
18150
18307
|
{
|
|
18151
18308
|
css: [input2, selectInput],
|
|
@@ -18154,10 +18311,10 @@ var ParameterSelectInner = forwardRef14(
|
|
|
18154
18311
|
ref,
|
|
18155
18312
|
...props,
|
|
18156
18313
|
children: [
|
|
18157
|
-
defaultOption ? /* @__PURE__ */
|
|
18314
|
+
defaultOption ? /* @__PURE__ */ jsx104("option", { value: "", children: defaultOption }) : null,
|
|
18158
18315
|
options.map((option) => {
|
|
18159
18316
|
var _a;
|
|
18160
|
-
return /* @__PURE__ */
|
|
18317
|
+
return /* @__PURE__ */ jsx104("option", { value: (_a = option.value) != null ? _a : option.label, children: option.label }, option.label);
|
|
18161
18318
|
})
|
|
18162
18319
|
]
|
|
18163
18320
|
}
|
|
@@ -18166,15 +18323,15 @@ var ParameterSelectInner = forwardRef14(
|
|
|
18166
18323
|
);
|
|
18167
18324
|
|
|
18168
18325
|
// src/components/ParameterInputs/ParameterTextarea.tsx
|
|
18169
|
-
import { forwardRef as
|
|
18170
|
-
import { jsx as
|
|
18171
|
-
var ParameterTextarea =
|
|
18326
|
+
import { forwardRef as forwardRef16 } from "react";
|
|
18327
|
+
import { jsx as jsx105 } from "@emotion/react/jsx-runtime";
|
|
18328
|
+
var ParameterTextarea = forwardRef16((props, ref) => {
|
|
18172
18329
|
const { shellProps, innerProps } = extractParameterProps(props);
|
|
18173
|
-
return /* @__PURE__ */
|
|
18330
|
+
return /* @__PURE__ */ jsx105(ParameterShell, { "data-testid": "parameter-textarea", ...shellProps, children: /* @__PURE__ */ jsx105(ParameterTextareaInner, { ref, ...innerProps }) });
|
|
18174
18331
|
});
|
|
18175
|
-
var ParameterTextareaInner =
|
|
18332
|
+
var ParameterTextareaInner = forwardRef16(({ ...props }, ref) => {
|
|
18176
18333
|
const { id, label, hiddenLabel } = useParameterShell();
|
|
18177
|
-
return /* @__PURE__ */
|
|
18334
|
+
return /* @__PURE__ */ jsx105(
|
|
18178
18335
|
"textarea",
|
|
18179
18336
|
{
|
|
18180
18337
|
css: [input2, textarea2],
|
|
@@ -18187,83 +18344,45 @@ var ParameterTextareaInner = forwardRef15(({ ...props }, ref) => {
|
|
|
18187
18344
|
});
|
|
18188
18345
|
|
|
18189
18346
|
// src/components/ParameterInputs/ParameterToggle.tsx
|
|
18190
|
-
import { forwardRef as
|
|
18191
|
-
import { jsx as
|
|
18192
|
-
var ParameterToggle =
|
|
18347
|
+
import { forwardRef as forwardRef17 } from "react";
|
|
18348
|
+
import { jsx as jsx106, jsxs as jsxs72 } from "@emotion/react/jsx-runtime";
|
|
18349
|
+
var ParameterToggle = forwardRef17((props, ref) => {
|
|
18193
18350
|
const { shellProps, innerProps } = extractParameterProps(props);
|
|
18194
|
-
return /* @__PURE__ */
|
|
18351
|
+
return /* @__PURE__ */ jsx106(ParameterShell, { ...shellProps, children: /* @__PURE__ */ jsx106(ParameterToggleInner, { ref, ...innerProps }) });
|
|
18195
18352
|
});
|
|
18196
|
-
var ParameterToggleInner =
|
|
18353
|
+
var ParameterToggleInner = forwardRef17(
|
|
18197
18354
|
({ ...props }, ref) => {
|
|
18198
18355
|
const { id, label } = useParameterShell();
|
|
18199
|
-
return /* @__PURE__ */
|
|
18200
|
-
/* @__PURE__ */
|
|
18201
|
-
/* @__PURE__ */
|
|
18356
|
+
return /* @__PURE__ */ jsxs72("label", { css: inputToggleLabel2, children: [
|
|
18357
|
+
/* @__PURE__ */ jsx106("input", { css: toggleInput2, type: props.type, id, ref, ...props }),
|
|
18358
|
+
/* @__PURE__ */ jsx106("span", { css: inlineLabel2, children: label })
|
|
18202
18359
|
] });
|
|
18203
18360
|
}
|
|
18204
18361
|
);
|
|
18205
18362
|
|
|
18206
|
-
// src/components/Popover/Popover.tsx
|
|
18207
|
-
import {
|
|
18208
|
-
Popover as ReakitPopover,
|
|
18209
|
-
PopoverDisclosure,
|
|
18210
|
-
usePopoverState
|
|
18211
|
-
} from "reakit/Popover";
|
|
18212
|
-
import { Fragment as Fragment18, jsx as jsx103, jsxs as jsxs70 } from "@emotion/react/jsx-runtime";
|
|
18213
|
-
var Popover2 = ({
|
|
18214
|
-
iconColor = "action",
|
|
18215
|
-
icon = "info",
|
|
18216
|
-
iconSize = "1rem",
|
|
18217
|
-
buttonText,
|
|
18218
|
-
ariaLabel,
|
|
18219
|
-
placement = "bottom",
|
|
18220
|
-
testId,
|
|
18221
|
-
trigger,
|
|
18222
|
-
children,
|
|
18223
|
-
...otherProps
|
|
18224
|
-
}) => {
|
|
18225
|
-
const popover = usePopoverState({ placement });
|
|
18226
|
-
return /* @__PURE__ */ jsxs70(Fragment18, { children: [
|
|
18227
|
-
/* @__PURE__ */ jsx103(
|
|
18228
|
-
PopoverDisclosure,
|
|
18229
|
-
{
|
|
18230
|
-
...popover,
|
|
18231
|
-
css: [PopoverBtn, trigger ? void 0 : PopoverDefaulterTriggerBtn],
|
|
18232
|
-
title: buttonText,
|
|
18233
|
-
"data-testid": testId,
|
|
18234
|
-
children: trigger ? trigger : /* @__PURE__ */ jsxs70(Fragment18, { children: [
|
|
18235
|
-
/* @__PURE__ */ jsx103(Icon, { icon, iconColor, size: iconSize }),
|
|
18236
|
-
/* @__PURE__ */ jsx103("span", { hidden: true, children: buttonText })
|
|
18237
|
-
] })
|
|
18238
|
-
}
|
|
18239
|
-
),
|
|
18240
|
-
/* @__PURE__ */ jsx103(ReakitPopover, { css: Popover, ...otherProps, ...popover, role: "tooltip", "aria-label": ariaLabel, children })
|
|
18241
|
-
] });
|
|
18242
|
-
};
|
|
18243
|
-
|
|
18244
18363
|
// src/components/ProgressList/ProgressList.tsx
|
|
18245
|
-
import { css as
|
|
18364
|
+
import { css as css84 } from "@emotion/react";
|
|
18246
18365
|
import { CgCheckO as CgCheckO2 } from "@react-icons/all-files/cg/CgCheckO";
|
|
18247
18366
|
import { CgRadioCheck } from "@react-icons/all-files/cg/CgRadioCheck";
|
|
18248
18367
|
import { CgRecord } from "@react-icons/all-files/cg/CgRecord";
|
|
18249
18368
|
import { useMemo as useMemo4 } from "react";
|
|
18250
18369
|
|
|
18251
18370
|
// src/components/ProgressList/styles/ProgressList.styles.ts
|
|
18252
|
-
import { css as
|
|
18253
|
-
var progressListStyles =
|
|
18371
|
+
import { css as css83 } from "@emotion/react";
|
|
18372
|
+
var progressListStyles = css83`
|
|
18254
18373
|
display: flex;
|
|
18255
18374
|
flex-direction: column;
|
|
18256
18375
|
gap: var(--spacing-sm);
|
|
18257
18376
|
list-style-type: none;
|
|
18258
18377
|
`;
|
|
18259
|
-
var progressListItemStyles =
|
|
18378
|
+
var progressListItemStyles = css83`
|
|
18260
18379
|
display: flex;
|
|
18261
18380
|
gap: var(--spacing-base);
|
|
18262
18381
|
align-items: center;
|
|
18263
18382
|
`;
|
|
18264
18383
|
|
|
18265
18384
|
// src/components/ProgressList/ProgressList.tsx
|
|
18266
|
-
import { jsx as
|
|
18385
|
+
import { jsx as jsx107, jsxs as jsxs73 } from "@emotion/react/jsx-runtime";
|
|
18267
18386
|
var ProgressList = ({ inProgressId, items, autoEllipsis, ...htmlProps }) => {
|
|
18268
18387
|
const itemsWithStatus = useMemo4(() => {
|
|
18269
18388
|
const indexOfInProgressItem = items.findIndex(({ id }) => id === inProgressId);
|
|
@@ -18277,8 +18396,8 @@ var ProgressList = ({ inProgressId, items, autoEllipsis, ...htmlProps }) => {
|
|
|
18277
18396
|
return { ...item, status };
|
|
18278
18397
|
});
|
|
18279
18398
|
}, [items, inProgressId]);
|
|
18280
|
-
return /* @__PURE__ */
|
|
18281
|
-
return /* @__PURE__ */
|
|
18399
|
+
return /* @__PURE__ */ jsx107("ol", { css: progressListStyles, ...htmlProps, children: itemsWithStatus.map(({ id, label, status, error, errorLevel }) => {
|
|
18400
|
+
return /* @__PURE__ */ jsx107(
|
|
18282
18401
|
ProgressListItem,
|
|
18283
18402
|
{
|
|
18284
18403
|
status,
|
|
@@ -18311,12 +18430,12 @@ var ProgressListItem = ({
|
|
|
18311
18430
|
}, [status, error]);
|
|
18312
18431
|
const statusStyles = useMemo4(() => {
|
|
18313
18432
|
if (error) {
|
|
18314
|
-
return errorLevel === "caution" ?
|
|
18433
|
+
return errorLevel === "caution" ? css84`
|
|
18315
18434
|
color: rgb(161, 98, 7);
|
|
18316
18435
|
& svg {
|
|
18317
18436
|
color: rgb(250, 204, 21);
|
|
18318
18437
|
}
|
|
18319
|
-
` :
|
|
18438
|
+
` : css84`
|
|
18320
18439
|
color: rgb(185, 28, 28);
|
|
18321
18440
|
& svg {
|
|
18322
18441
|
color: var(--brand-primary-2);
|
|
@@ -18324,35 +18443,35 @@ var ProgressListItem = ({
|
|
|
18324
18443
|
`;
|
|
18325
18444
|
}
|
|
18326
18445
|
const colorPerStatus = {
|
|
18327
|
-
completed:
|
|
18446
|
+
completed: css84`
|
|
18328
18447
|
opacity: 0.75;
|
|
18329
18448
|
`,
|
|
18330
|
-
inProgress:
|
|
18449
|
+
inProgress: css84`
|
|
18331
18450
|
-webkit-text-stroke-width: thin;
|
|
18332
18451
|
`,
|
|
18333
|
-
queued:
|
|
18452
|
+
queued: css84`
|
|
18334
18453
|
opacity: 0.5;
|
|
18335
18454
|
`
|
|
18336
18455
|
};
|
|
18337
18456
|
return colorPerStatus[status];
|
|
18338
18457
|
}, [status, error, errorLevel]);
|
|
18339
|
-
return /* @__PURE__ */
|
|
18340
|
-
/* @__PURE__ */
|
|
18341
|
-
/* @__PURE__ */
|
|
18458
|
+
return /* @__PURE__ */ jsxs73("li", { css: [progressListItemStyles, statusStyles], children: [
|
|
18459
|
+
/* @__PURE__ */ jsx107(Tooltip, { title: error != null ? error : "", children: /* @__PURE__ */ jsx107("div", { children: /* @__PURE__ */ jsx107(Icon, { icon, size: 20, iconColor: "currentColor" }) }) }),
|
|
18460
|
+
/* @__PURE__ */ jsxs73("div", { children: [
|
|
18342
18461
|
children,
|
|
18343
|
-
/* @__PURE__ */
|
|
18462
|
+
/* @__PURE__ */ jsx107("span", { css: { visibility: autoEllipsis && status === "inProgress" && !error ? "visible" : "hidden" }, children: "..." })
|
|
18344
18463
|
] })
|
|
18345
18464
|
] });
|
|
18346
18465
|
};
|
|
18347
18466
|
|
|
18348
18467
|
// src/components/SegmentedControl/SegmentedControl.tsx
|
|
18349
|
-
import { css as
|
|
18468
|
+
import { css as css86 } from "@emotion/react";
|
|
18350
18469
|
import { CgCheck as CgCheck4 } from "@react-icons/all-files/cg/CgCheck";
|
|
18351
18470
|
import { useCallback as useCallback6, useMemo as useMemo5 } from "react";
|
|
18352
18471
|
|
|
18353
18472
|
// src/components/SegmentedControl/SegmentedControl.styles.ts
|
|
18354
|
-
import { css as
|
|
18355
|
-
var segmentedControlStyles =
|
|
18473
|
+
import { css as css85 } from "@emotion/react";
|
|
18474
|
+
var segmentedControlStyles = css85`
|
|
18356
18475
|
--segmented-control-rounded-value: var(--rounded-base);
|
|
18357
18476
|
--segmented-control-border-width: 1px;
|
|
18358
18477
|
--segmented-control-selected-color: var(--brand-secondary-3);
|
|
@@ -18371,14 +18490,14 @@ var segmentedControlStyles = css83`
|
|
|
18371
18490
|
border-radius: calc(var(--segmented-control-rounded-value) + var(--segmented-control-border-width));
|
|
18372
18491
|
font-size: var(--fs-xs);
|
|
18373
18492
|
`;
|
|
18374
|
-
var segmentedControlVerticalStyles =
|
|
18493
|
+
var segmentedControlVerticalStyles = css85`
|
|
18375
18494
|
flex-direction: column;
|
|
18376
18495
|
--segmented-control-first-border-radius: var(--segmented-control-rounded-value)
|
|
18377
18496
|
var(--segmented-control-rounded-value) 0 0;
|
|
18378
18497
|
--segmented-control-last-border-radius: 0 0 var(--segmented-control-rounded-value)
|
|
18379
18498
|
var(--segmented-control-rounded-value);
|
|
18380
18499
|
`;
|
|
18381
|
-
var segmentedControlItemStyles =
|
|
18500
|
+
var segmentedControlItemStyles = css85`
|
|
18382
18501
|
&:first-of-type label {
|
|
18383
18502
|
border-radius: var(--segmented-control-first-border-radius);
|
|
18384
18503
|
}
|
|
@@ -18386,10 +18505,10 @@ var segmentedControlItemStyles = css83`
|
|
|
18386
18505
|
border-radius: var(--segmented-control-last-border-radius);
|
|
18387
18506
|
}
|
|
18388
18507
|
`;
|
|
18389
|
-
var segmentedControlInputStyles =
|
|
18508
|
+
var segmentedControlInputStyles = css85`
|
|
18390
18509
|
${accessibleHidden}
|
|
18391
18510
|
`;
|
|
18392
|
-
var segmentedControlLabelStyles = (checked, disabled) =>
|
|
18511
|
+
var segmentedControlLabelStyles = (checked, disabled) => css85`
|
|
18393
18512
|
position: relative;
|
|
18394
18513
|
display: flex;
|
|
18395
18514
|
align-items: center;
|
|
@@ -18456,23 +18575,23 @@ var segmentedControlLabelStyles = (checked, disabled) => css83`
|
|
|
18456
18575
|
`}
|
|
18457
18576
|
}
|
|
18458
18577
|
`;
|
|
18459
|
-
var segmentedControlLabelIconOnlyStyles =
|
|
18578
|
+
var segmentedControlLabelIconOnlyStyles = css85`
|
|
18460
18579
|
padding-inline: 0.5em;
|
|
18461
18580
|
`;
|
|
18462
|
-
var segmentedControlLabelCheckStyles =
|
|
18581
|
+
var segmentedControlLabelCheckStyles = css85`
|
|
18463
18582
|
opacity: 0.5;
|
|
18464
18583
|
`;
|
|
18465
|
-
var segmentedControlLabelContentStyles =
|
|
18584
|
+
var segmentedControlLabelContentStyles = css85`
|
|
18466
18585
|
display: flex;
|
|
18467
18586
|
align-items: center;
|
|
18468
18587
|
justify-content: center;
|
|
18469
18588
|
gap: var(--spacing-sm);
|
|
18470
18589
|
height: 100%;
|
|
18471
18590
|
`;
|
|
18472
|
-
var segmentedControlLabelTextStyles =
|
|
18591
|
+
var segmentedControlLabelTextStyles = css85``;
|
|
18473
18592
|
|
|
18474
18593
|
// src/components/SegmentedControl/SegmentedControl.tsx
|
|
18475
|
-
import { jsx as
|
|
18594
|
+
import { jsx as jsx108, jsxs as jsxs74 } from "@emotion/react/jsx-runtime";
|
|
18476
18595
|
var SegmentedControl = ({
|
|
18477
18596
|
name,
|
|
18478
18597
|
options,
|
|
@@ -18494,16 +18613,16 @@ var SegmentedControl = ({
|
|
|
18494
18613
|
);
|
|
18495
18614
|
const sizeStyles = useMemo5(() => {
|
|
18496
18615
|
const map = {
|
|
18497
|
-
sm:
|
|
18498
|
-
md:
|
|
18499
|
-
lg:
|
|
18616
|
+
sm: css86({ height: "calc(24px - 2px)", fontSize: "var(--fs-xs)" }),
|
|
18617
|
+
md: css86({ height: "calc(32px - 2px)", fontSize: "var(--fs-sm)" }),
|
|
18618
|
+
lg: css86({ height: "calc(40px - 2px)", fontSize: "var(--fs-base)" })
|
|
18500
18619
|
};
|
|
18501
18620
|
return map[size];
|
|
18502
18621
|
}, [size]);
|
|
18503
18622
|
const isIconOnly = useMemo5(() => {
|
|
18504
18623
|
return options.every((option) => option.icon && !option.label);
|
|
18505
18624
|
}, [options]);
|
|
18506
|
-
return /* @__PURE__ */
|
|
18625
|
+
return /* @__PURE__ */ jsx108(
|
|
18507
18626
|
"div",
|
|
18508
18627
|
{
|
|
18509
18628
|
css: [segmentedControlStyles, orientation === "vertical" ? segmentedControlVerticalStyles : void 0],
|
|
@@ -18511,11 +18630,11 @@ var SegmentedControl = ({
|
|
|
18511
18630
|
children: options.map((option, index) => {
|
|
18512
18631
|
const text = option.label ? option.label : option.icon ? null : String(option.value);
|
|
18513
18632
|
const isDisabled = disabled || option.disabled;
|
|
18514
|
-
return /* @__PURE__ */
|
|
18633
|
+
return /* @__PURE__ */ jsx108(
|
|
18515
18634
|
Tooltip,
|
|
18516
18635
|
{
|
|
18517
18636
|
title: isDisabled || !option.tooltip ? "" : option.tooltip,
|
|
18518
|
-
children: /* @__PURE__ */
|
|
18637
|
+
children: /* @__PURE__ */ jsx108("div", { css: segmentedControlItemStyles, "data-testid": "container-segmented-control", children: /* @__PURE__ */ jsxs74(
|
|
18519
18638
|
"label",
|
|
18520
18639
|
{
|
|
18521
18640
|
css: [
|
|
@@ -18524,7 +18643,7 @@ var SegmentedControl = ({
|
|
|
18524
18643
|
isIconOnly ? segmentedControlLabelIconOnlyStyles : void 0
|
|
18525
18644
|
],
|
|
18526
18645
|
children: [
|
|
18527
|
-
/* @__PURE__ */
|
|
18646
|
+
/* @__PURE__ */ jsx108(
|
|
18528
18647
|
"input",
|
|
18529
18648
|
{
|
|
18530
18649
|
css: segmentedControlInputStyles,
|
|
@@ -18536,10 +18655,10 @@ var SegmentedControl = ({
|
|
|
18536
18655
|
disabled: isDisabled
|
|
18537
18656
|
}
|
|
18538
18657
|
),
|
|
18539
|
-
option.value !== value || noCheckmark ? null : /* @__PURE__ */
|
|
18540
|
-
/* @__PURE__ */
|
|
18541
|
-
!option.icon ? null : /* @__PURE__ */
|
|
18542
|
-
!text ? null : /* @__PURE__ */
|
|
18658
|
+
option.value !== value || noCheckmark ? null : /* @__PURE__ */ jsx108(CgCheck4, { css: segmentedControlLabelCheckStyles, "aria-label": "Selected", size: "1.5em" }),
|
|
18659
|
+
/* @__PURE__ */ jsxs74("span", { css: segmentedControlLabelContentStyles, children: [
|
|
18660
|
+
!option.icon ? null : /* @__PURE__ */ jsx108(Icon, { icon: option.icon, size: "1.5em", iconColor: "currentColor" }),
|
|
18661
|
+
!text ? null : /* @__PURE__ */ jsx108("span", { css: segmentedControlLabelTextStyles, children: text })
|
|
18543
18662
|
] })
|
|
18544
18663
|
]
|
|
18545
18664
|
}
|
|
@@ -18553,18 +18672,18 @@ var SegmentedControl = ({
|
|
|
18553
18672
|
};
|
|
18554
18673
|
|
|
18555
18674
|
// src/components/Skeleton/Skeleton.styles.ts
|
|
18556
|
-
import { css as
|
|
18675
|
+
import { css as css87, keyframes as keyframes4 } from "@emotion/react";
|
|
18557
18676
|
var lightFadingOut = keyframes4`
|
|
18558
18677
|
from { opacity: 0.1; }
|
|
18559
18678
|
to { opacity: 0.025; }
|
|
18560
18679
|
`;
|
|
18561
|
-
var skeletonStyles =
|
|
18680
|
+
var skeletonStyles = css87`
|
|
18562
18681
|
animation: ${lightFadingOut} 1s ease-out infinite alternate;
|
|
18563
18682
|
background-color: var(--gray-900);
|
|
18564
18683
|
`;
|
|
18565
18684
|
|
|
18566
18685
|
// src/components/Skeleton/Skeleton.tsx
|
|
18567
|
-
import { jsx as
|
|
18686
|
+
import { jsx as jsx109 } from "@emotion/react/jsx-runtime";
|
|
18568
18687
|
var Skeleton = ({
|
|
18569
18688
|
width = "100%",
|
|
18570
18689
|
height = "1.25rem",
|
|
@@ -18572,7 +18691,7 @@ var Skeleton = ({
|
|
|
18572
18691
|
circle = false,
|
|
18573
18692
|
children,
|
|
18574
18693
|
...otherProps
|
|
18575
|
-
}) => /* @__PURE__ */
|
|
18694
|
+
}) => /* @__PURE__ */ jsx109(
|
|
18576
18695
|
"div",
|
|
18577
18696
|
{
|
|
18578
18697
|
css: [
|
|
@@ -18595,8 +18714,8 @@ var Skeleton = ({
|
|
|
18595
18714
|
import * as React23 from "react";
|
|
18596
18715
|
|
|
18597
18716
|
// src/components/Switch/Switch.styles.ts
|
|
18598
|
-
import { css as
|
|
18599
|
-
var SwitchInputContainer =
|
|
18717
|
+
import { css as css88 } from "@emotion/react";
|
|
18718
|
+
var SwitchInputContainer = css88`
|
|
18600
18719
|
cursor: pointer;
|
|
18601
18720
|
display: inline-block;
|
|
18602
18721
|
position: relative;
|
|
@@ -18605,7 +18724,7 @@ var SwitchInputContainer = css86`
|
|
|
18605
18724
|
vertical-align: middle;
|
|
18606
18725
|
user-select: none;
|
|
18607
18726
|
`;
|
|
18608
|
-
var SwitchInput =
|
|
18727
|
+
var SwitchInput = css88`
|
|
18609
18728
|
appearance: none;
|
|
18610
18729
|
border-radius: var(--rounded-full);
|
|
18611
18730
|
background-color: var(--white);
|
|
@@ -18643,7 +18762,7 @@ var SwitchInput = css86`
|
|
|
18643
18762
|
cursor: not-allowed;
|
|
18644
18763
|
}
|
|
18645
18764
|
`;
|
|
18646
|
-
var SwitchInputDisabled =
|
|
18765
|
+
var SwitchInputDisabled = css88`
|
|
18647
18766
|
opacity: var(--opacity-50);
|
|
18648
18767
|
cursor: not-allowed;
|
|
18649
18768
|
|
|
@@ -18651,7 +18770,7 @@ var SwitchInputDisabled = css86`
|
|
|
18651
18770
|
cursor: not-allowed;
|
|
18652
18771
|
}
|
|
18653
18772
|
`;
|
|
18654
|
-
var SwitchInputLabel =
|
|
18773
|
+
var SwitchInputLabel = css88`
|
|
18655
18774
|
align-items: center;
|
|
18656
18775
|
color: var(--brand-secondary-1);
|
|
18657
18776
|
display: inline-flex;
|
|
@@ -18673,26 +18792,26 @@ var SwitchInputLabel = css86`
|
|
|
18673
18792
|
top: 0;
|
|
18674
18793
|
}
|
|
18675
18794
|
`;
|
|
18676
|
-
var SwitchText =
|
|
18795
|
+
var SwitchText = css88`
|
|
18677
18796
|
color: var(--gray-500);
|
|
18678
18797
|
font-size: var(--fs-sm);
|
|
18679
18798
|
padding-inline: var(--spacing-2xl) 0;
|
|
18680
18799
|
`;
|
|
18681
18800
|
|
|
18682
18801
|
// src/components/Switch/Switch.tsx
|
|
18683
|
-
import { Fragment as Fragment19, jsx as
|
|
18802
|
+
import { Fragment as Fragment19, jsx as jsx110, jsxs as jsxs75 } from "@emotion/react/jsx-runtime";
|
|
18684
18803
|
var Switch = React23.forwardRef(
|
|
18685
18804
|
({ label, infoText, toggleText, children, ...inputProps }, ref) => {
|
|
18686
18805
|
let additionalText = infoText;
|
|
18687
18806
|
if (infoText && toggleText) {
|
|
18688
18807
|
additionalText = inputProps.checked ? toggleText : infoText;
|
|
18689
18808
|
}
|
|
18690
|
-
return /* @__PURE__ */
|
|
18691
|
-
/* @__PURE__ */
|
|
18692
|
-
/* @__PURE__ */
|
|
18693
|
-
/* @__PURE__ */
|
|
18809
|
+
return /* @__PURE__ */ jsxs75(Fragment19, { children: [
|
|
18810
|
+
/* @__PURE__ */ jsxs75("label", { css: [SwitchInputContainer, inputProps.disabled ? SwitchInputDisabled : void 0], children: [
|
|
18811
|
+
/* @__PURE__ */ jsx110("input", { type: "checkbox", css: SwitchInput, ...inputProps, ref }),
|
|
18812
|
+
/* @__PURE__ */ jsx110("span", { css: SwitchInputLabel, children: label })
|
|
18694
18813
|
] }),
|
|
18695
|
-
additionalText ? /* @__PURE__ */
|
|
18814
|
+
additionalText ? /* @__PURE__ */ jsx110("p", { css: SwitchText, children: additionalText }) : null,
|
|
18696
18815
|
children
|
|
18697
18816
|
] });
|
|
18698
18817
|
}
|
|
@@ -18702,8 +18821,8 @@ var Switch = React23.forwardRef(
|
|
|
18702
18821
|
import * as React24 from "react";
|
|
18703
18822
|
|
|
18704
18823
|
// src/components/Table/Table.styles.ts
|
|
18705
|
-
import { css as
|
|
18706
|
-
var table = ({ cellPadding = "var(--spacing-base) var(--spacing-md)" }) =>
|
|
18824
|
+
import { css as css89 } from "@emotion/react";
|
|
18825
|
+
var table = ({ cellPadding = "var(--spacing-base) var(--spacing-md)" }) => css89`
|
|
18707
18826
|
border-bottom: 1px solid var(--gray-400);
|
|
18708
18827
|
border-collapse: collapse;
|
|
18709
18828
|
min-width: 100%;
|
|
@@ -18714,55 +18833,55 @@ var table = ({ cellPadding = "var(--spacing-base) var(--spacing-md)" }) => css87
|
|
|
18714
18833
|
padding: ${cellPadding};
|
|
18715
18834
|
}
|
|
18716
18835
|
`;
|
|
18717
|
-
var tableHead =
|
|
18836
|
+
var tableHead = css89`
|
|
18718
18837
|
background: var(--gray-100);
|
|
18719
18838
|
color: var(--brand-secondary-1);
|
|
18720
18839
|
text-align: left;
|
|
18721
18840
|
`;
|
|
18722
|
-
var tableRow =
|
|
18841
|
+
var tableRow = css89`
|
|
18723
18842
|
border-bottom: 1px solid var(--gray-200);
|
|
18724
18843
|
`;
|
|
18725
|
-
var tableCellHead =
|
|
18844
|
+
var tableCellHead = css89`
|
|
18726
18845
|
font-size: var(--fs-sm);
|
|
18727
18846
|
text-transform: uppercase;
|
|
18728
18847
|
font-weight: var(--fw-bold);
|
|
18729
18848
|
`;
|
|
18730
18849
|
|
|
18731
18850
|
// src/components/Table/Table.tsx
|
|
18732
|
-
import { jsx as
|
|
18851
|
+
import { jsx as jsx111 } from "@emotion/react/jsx-runtime";
|
|
18733
18852
|
var Table = React24.forwardRef(
|
|
18734
18853
|
({ children, cellPadding, ...otherProps }, ref) => {
|
|
18735
|
-
return /* @__PURE__ */
|
|
18854
|
+
return /* @__PURE__ */ jsx111("table", { ref, css: table({ cellPadding }), ...otherProps, children });
|
|
18736
18855
|
}
|
|
18737
18856
|
);
|
|
18738
18857
|
var TableHead = React24.forwardRef(
|
|
18739
18858
|
({ children, ...otherProps }, ref) => {
|
|
18740
|
-
return /* @__PURE__ */
|
|
18859
|
+
return /* @__PURE__ */ jsx111("thead", { ref, css: tableHead, ...otherProps, children });
|
|
18741
18860
|
}
|
|
18742
18861
|
);
|
|
18743
18862
|
var TableBody = React24.forwardRef(
|
|
18744
18863
|
({ children, ...otherProps }, ref) => {
|
|
18745
|
-
return /* @__PURE__ */
|
|
18864
|
+
return /* @__PURE__ */ jsx111("tbody", { ref, ...otherProps, children });
|
|
18746
18865
|
}
|
|
18747
18866
|
);
|
|
18748
18867
|
var TableFoot = React24.forwardRef(
|
|
18749
18868
|
({ children, ...otherProps }, ref) => {
|
|
18750
|
-
return /* @__PURE__ */
|
|
18869
|
+
return /* @__PURE__ */ jsx111("tfoot", { ref, ...otherProps, children });
|
|
18751
18870
|
}
|
|
18752
18871
|
);
|
|
18753
18872
|
var TableRow = React24.forwardRef(
|
|
18754
18873
|
({ children, ...otherProps }, ref) => {
|
|
18755
|
-
return /* @__PURE__ */
|
|
18874
|
+
return /* @__PURE__ */ jsx111("tr", { ref, css: tableRow, ...otherProps, children });
|
|
18756
18875
|
}
|
|
18757
18876
|
);
|
|
18758
18877
|
var TableCellHead = React24.forwardRef(
|
|
18759
18878
|
({ children, ...otherProps }, ref) => {
|
|
18760
|
-
return /* @__PURE__ */
|
|
18879
|
+
return /* @__PURE__ */ jsx111("th", { ref, css: tableCellHead, ...otherProps, children });
|
|
18761
18880
|
}
|
|
18762
18881
|
);
|
|
18763
18882
|
var TableCellData = React24.forwardRef(
|
|
18764
18883
|
({ children, ...otherProps }, ref) => {
|
|
18765
|
-
return /* @__PURE__ */
|
|
18884
|
+
return /* @__PURE__ */ jsx111("td", { ref, ...otherProps, children });
|
|
18766
18885
|
}
|
|
18767
18886
|
);
|
|
18768
18887
|
|
|
@@ -18776,8 +18895,8 @@ import {
|
|
|
18776
18895
|
} from "reakit/Tab";
|
|
18777
18896
|
|
|
18778
18897
|
// src/components/Tabs/Tabs.styles.ts
|
|
18779
|
-
import { css as
|
|
18780
|
-
var tabButtonStyles =
|
|
18898
|
+
import { css as css90 } from "@emotion/react";
|
|
18899
|
+
var tabButtonStyles = css90`
|
|
18781
18900
|
align-items: center;
|
|
18782
18901
|
border: 0;
|
|
18783
18902
|
height: 2.5rem;
|
|
@@ -18794,14 +18913,14 @@ var tabButtonStyles = css88`
|
|
|
18794
18913
|
box-shadow: inset 0 -2px 0 var(--brand-secondary-3);
|
|
18795
18914
|
}
|
|
18796
18915
|
`;
|
|
18797
|
-
var tabButtonGroupStyles =
|
|
18916
|
+
var tabButtonGroupStyles = css90`
|
|
18798
18917
|
display: flex;
|
|
18799
18918
|
gap: var(--spacing-base);
|
|
18800
18919
|
border-bottom: 1px solid var(--gray-300);
|
|
18801
18920
|
`;
|
|
18802
18921
|
|
|
18803
18922
|
// src/components/Tabs/Tabs.tsx
|
|
18804
|
-
import { jsx as
|
|
18923
|
+
import { jsx as jsx112 } from "@emotion/react/jsx-runtime";
|
|
18805
18924
|
var CurrentTabContext = createContext6(null);
|
|
18806
18925
|
var useCurrentTab = () => {
|
|
18807
18926
|
const context = useContext7(CurrentTabContext);
|
|
@@ -18830,24 +18949,24 @@ var Tabs = ({ children, onSelectedIdChange, useHashForState, selectedId, ...prop
|
|
|
18830
18949
|
tab.setSelectedId(selected);
|
|
18831
18950
|
}
|
|
18832
18951
|
}, [selected]);
|
|
18833
|
-
return /* @__PURE__ */
|
|
18952
|
+
return /* @__PURE__ */ jsx112(CurrentTabContext.Provider, { value: tab, children });
|
|
18834
18953
|
};
|
|
18835
18954
|
var TabButtonGroup = ({ children, ...props }) => {
|
|
18836
18955
|
const currentTab = useCurrentTab();
|
|
18837
|
-
return /* @__PURE__ */
|
|
18956
|
+
return /* @__PURE__ */ jsx112(ReakitTabList, { ...props, ...currentTab, css: tabButtonGroupStyles, children });
|
|
18838
18957
|
};
|
|
18839
18958
|
var TabButton = ({ children, id, ...props }) => {
|
|
18840
18959
|
const currentTab = useCurrentTab();
|
|
18841
|
-
return /* @__PURE__ */
|
|
18960
|
+
return /* @__PURE__ */ jsx112(ReakitTab, { type: "button", id, ...currentTab, ...props, css: tabButtonStyles, children });
|
|
18842
18961
|
};
|
|
18843
18962
|
var TabContent = ({ children, ...props }) => {
|
|
18844
18963
|
const currentTab = useCurrentTab();
|
|
18845
|
-
return /* @__PURE__ */
|
|
18964
|
+
return /* @__PURE__ */ jsx112(ReakitTabPanel, { ...props, ...currentTab, children });
|
|
18846
18965
|
};
|
|
18847
18966
|
|
|
18848
18967
|
// src/components/Validation/StatusBullet.styles.ts
|
|
18849
|
-
import { css as
|
|
18850
|
-
var StatusBulletContainer =
|
|
18968
|
+
import { css as css91 } from "@emotion/react";
|
|
18969
|
+
var StatusBulletContainer = css91`
|
|
18851
18970
|
align-items: center;
|
|
18852
18971
|
align-self: center;
|
|
18853
18972
|
color: var(--gray-500);
|
|
@@ -18864,33 +18983,33 @@ var StatusBulletContainer = css89`
|
|
|
18864
18983
|
display: block;
|
|
18865
18984
|
}
|
|
18866
18985
|
`;
|
|
18867
|
-
var StatusBulletBase =
|
|
18986
|
+
var StatusBulletBase = css91`
|
|
18868
18987
|
font-size: var(--fs-sm);
|
|
18869
18988
|
&:before {
|
|
18870
18989
|
width: var(--fs-xs);
|
|
18871
18990
|
height: var(--fs-xs);
|
|
18872
18991
|
}
|
|
18873
18992
|
`;
|
|
18874
|
-
var StatusBulletSmall =
|
|
18993
|
+
var StatusBulletSmall = css91`
|
|
18875
18994
|
font-size: var(--fs-xs);
|
|
18876
18995
|
&:before {
|
|
18877
18996
|
width: var(--fs-xxs);
|
|
18878
18997
|
height: var(--fs-xxs);
|
|
18879
18998
|
}
|
|
18880
18999
|
`;
|
|
18881
|
-
var StatusDraft =
|
|
19000
|
+
var StatusDraft = css91`
|
|
18882
19001
|
&:before {
|
|
18883
19002
|
background: var(--white);
|
|
18884
19003
|
box-shadow: inset 0 0 0 0.125rem var(--primary-action-default);
|
|
18885
19004
|
}
|
|
18886
19005
|
`;
|
|
18887
|
-
var StatusModified =
|
|
19006
|
+
var StatusModified = css91`
|
|
18888
19007
|
&:before {
|
|
18889
19008
|
background: linear-gradient(to right, var(--white) 50%, var(--primary-action-default) 50% 100%);
|
|
18890
19009
|
box-shadow: inset 0 0 0 0.125rem var(--primary-action-default);
|
|
18891
19010
|
}
|
|
18892
19011
|
`;
|
|
18893
|
-
var StatusError =
|
|
19012
|
+
var StatusError = css91`
|
|
18894
19013
|
color: var(--error);
|
|
18895
19014
|
&:before {
|
|
18896
19015
|
/* TODO: replace this with an svg icon */
|
|
@@ -18903,19 +19022,19 @@ var StatusError = css89`
|
|
|
18903
19022
|
);
|
|
18904
19023
|
}
|
|
18905
19024
|
`;
|
|
18906
|
-
var StatusPublished =
|
|
19025
|
+
var StatusPublished = css91`
|
|
18907
19026
|
&:before {
|
|
18908
19027
|
background: var(--primary-action-default);
|
|
18909
19028
|
}
|
|
18910
19029
|
`;
|
|
18911
|
-
var StatusOrphan =
|
|
19030
|
+
var StatusOrphan = css91`
|
|
18912
19031
|
&:before {
|
|
18913
19032
|
background: var(--brand-secondary-5);
|
|
18914
19033
|
}
|
|
18915
19034
|
`;
|
|
18916
19035
|
|
|
18917
19036
|
// src/components/Validation/StatusBullet.tsx
|
|
18918
|
-
import { jsx as
|
|
19037
|
+
import { jsx as jsx113 } from "@emotion/react/jsx-runtime";
|
|
18919
19038
|
var StatusBullet = ({
|
|
18920
19039
|
status,
|
|
18921
19040
|
hideText = false,
|
|
@@ -18933,7 +19052,7 @@ var StatusBullet = ({
|
|
|
18933
19052
|
Previous: StatusDraft
|
|
18934
19053
|
};
|
|
18935
19054
|
const statusSize = size === "base" ? StatusBulletBase : StatusBulletSmall;
|
|
18936
|
-
return /* @__PURE__ */
|
|
19055
|
+
return /* @__PURE__ */ jsx113(
|
|
18937
19056
|
"span",
|
|
18938
19057
|
{
|
|
18939
19058
|
role: "status",
|
|
@@ -18981,7 +19100,9 @@ export {
|
|
|
18981
19100
|
HexModalBackground,
|
|
18982
19101
|
HorizontalRhythm,
|
|
18983
19102
|
Icon,
|
|
19103
|
+
IconButton,
|
|
18984
19104
|
IconsProvider,
|
|
19105
|
+
ImageBroken,
|
|
18985
19106
|
InfoMessage,
|
|
18986
19107
|
InlineAlert,
|
|
18987
19108
|
Input,
|
|
@@ -19009,6 +19130,7 @@ export {
|
|
|
19009
19130
|
LoadingIcon,
|
|
19010
19131
|
LoadingIndicator,
|
|
19011
19132
|
LoadingOverlay,
|
|
19133
|
+
MediaCard,
|
|
19012
19134
|
Menu,
|
|
19013
19135
|
MenuContext,
|
|
19014
19136
|
MenuGroup,
|