@uniformdev/design-system 19.11.0 → 19.12.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (4) hide show
  1. package/dist/esm/index.js +570 -509
  2. package/dist/index.d.ts +32 -24
  3. package/dist/index.js +664 -602
  4. package/package.json +2 -2
package/dist/index.js CHANGED
@@ -130,6 +130,7 @@ __export(src_exports, {
130
130
  ShortcutRevealer: () => ShortcutRevealer,
131
131
  Skeleton: () => Skeleton,
132
132
  StatusBullet: () => StatusBullet,
133
+ SuccessMessage: () => SuccessMessage,
133
134
  Switch: () => Switch,
134
135
  TabButton: () => TabButton,
135
136
  TabButtonGroup: () => TabButtonGroup,
@@ -10739,6 +10740,7 @@ var AnimationFile = ({
10739
10740
  import_lottie_react.default,
10740
10741
  {
10741
10742
  role: "graphics-symbol",
10743
+ "data-test-id": "graphic-loader",
10742
10744
  "aria-label": label,
10743
10745
  autoPlay: autoplay,
10744
10746
  loop,
@@ -11659,7 +11661,14 @@ var calloutTypeDataMap = {
11659
11661
  `
11660
11662
  }
11661
11663
  };
11662
- var Callout = ({ type = "info", compact = false, title, children, className }) => {
11664
+ var Callout = ({
11665
+ type = "info",
11666
+ compact = false,
11667
+ title,
11668
+ children,
11669
+ className,
11670
+ testId
11671
+ }) => {
11663
11672
  const calloutTypeData = calloutTypeDataMap[type];
11664
11673
  if (!calloutTypeData) {
11665
11674
  return null;
@@ -11668,7 +11677,7 @@ var Callout = ({ type = "info", compact = false, title, children, className }) =
11668
11677
  return /* @__PURE__ */ (0, import_jsx_runtime26.jsx)(
11669
11678
  "div",
11670
11679
  {
11671
- "data-testid": "sdk-ui-callout",
11680
+ "data-testid": testId ? testId : "sdk-ui-callout",
11672
11681
  css: [
11673
11682
  calloutContainer,
11674
11683
  calloutTypeData.containerStyles,
@@ -11848,6 +11857,9 @@ var Container2 = ({
11848
11857
  );
11849
11858
  };
11850
11859
 
11860
+ // src/components/Layout/HorizontalRhythm.tsx
11861
+ var import_react37 = require("@emotion/react");
11862
+
11851
11863
  // src/components/Layout/styles/HorizontalRhythm.styles.ts
11852
11864
  var import_react36 = require("@emotion/react");
11853
11865
  var HorizontalRhythmContainer = (size) => import_react36.css`
@@ -11857,22 +11869,29 @@ var HorizontalRhythmContainer = (size) => import_react36.css`
11857
11869
 
11858
11870
  // src/components/Layout/HorizontalRhythm.tsx
11859
11871
  var import_jsx_runtime30 = require("@emotion/react/jsx-runtime");
11860
- var HorizontalRhythm = ({
11861
- tag = "div",
11862
- gap = "base",
11863
- children,
11864
- ...props
11865
- }) => {
11872
+ var HorizontalRhythm = ({ align, tag = "div", gap = "base", children, ...props }) => {
11866
11873
  const Tag = tag;
11867
- return /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(Tag, { css: HorizontalRhythmContainer(gap), ...props, children });
11874
+ return /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(
11875
+ Tag,
11876
+ {
11877
+ css: [
11878
+ HorizontalRhythmContainer(gap),
11879
+ align ? import_react37.css`
11880
+ align-items: ${align};
11881
+ ` : void 0
11882
+ ],
11883
+ ...props,
11884
+ children
11885
+ }
11886
+ );
11868
11887
  };
11869
11888
 
11870
11889
  // src/components/Layout/styles/TwoColumnLayout.styles.ts
11871
- var import_react37 = require("@emotion/react");
11872
- var TwoColumnLayoutContainer = (bgColor) => import_react37.css`
11890
+ var import_react38 = require("@emotion/react");
11891
+ var TwoColumnLayoutContainer = (bgColor) => import_react38.css`
11873
11892
  background: ${bgColor};
11874
11893
  `;
11875
- var TwoColumnLayoutInner = (invertLayout) => import_react37.css`
11894
+ var TwoColumnLayoutInner = (invertLayout) => import_react38.css`
11876
11895
  display: grid;
11877
11896
  max-width: var(--site-width);
11878
11897
  margin-inline: auto;
@@ -11888,8 +11907,8 @@ var TwoColumnLayoutInner = (invertLayout) => import_react37.css`
11888
11907
  }`}
11889
11908
  }
11890
11909
  `;
11891
- var TwoColumnLayoutMain = import_react37.css``;
11892
- var TwoColumnLayoutSupporting = import_react37.css`
11910
+ var TwoColumnLayoutMain = import_react38.css``;
11911
+ var TwoColumnLayoutSupporting = import_react38.css`
11893
11912
  display: flex;
11894
11913
  flex-direction: column;
11895
11914
  gap: var(--spacing-lg);
@@ -11909,9 +11928,12 @@ var TwoColumnLayout = ({
11909
11928
  ] }) });
11910
11929
  };
11911
11930
 
11931
+ // src/components/Layout/VerticalRhythm.tsx
11932
+ var import_react40 = require("@emotion/react");
11933
+
11912
11934
  // src/components/Layout/styles/VerticalRhythm.styles.ts
11913
- var import_react38 = require("@emotion/react");
11914
- var VerticalRhythmContainer = (size) => import_react38.css`
11935
+ var import_react39 = require("@emotion/react");
11936
+ var VerticalRhythmContainer = (size) => import_react39.css`
11915
11937
  display: flex;
11916
11938
  flex-direction: column;
11917
11939
  gap: var(--spacing-${size});
@@ -11919,14 +11941,26 @@ var VerticalRhythmContainer = (size) => import_react38.css`
11919
11941
 
11920
11942
  // src/components/Layout/VerticalRhythm.tsx
11921
11943
  var import_jsx_runtime32 = require("@emotion/react/jsx-runtime");
11922
- var VerticalRhythm = ({ tag = "div", gap = "base", children, ...props }) => {
11944
+ var VerticalRhythm = ({ align, tag = "div", gap = "base", children, ...props }) => {
11923
11945
  const Tag = tag;
11924
- return /* @__PURE__ */ (0, import_jsx_runtime32.jsx)(Tag, { css: VerticalRhythmContainer(gap), ...props, children });
11946
+ return /* @__PURE__ */ (0, import_jsx_runtime32.jsx)(
11947
+ Tag,
11948
+ {
11949
+ css: [
11950
+ VerticalRhythmContainer(gap),
11951
+ align ? import_react40.css`
11952
+ align-items: ${align};
11953
+ ` : void 0
11954
+ ],
11955
+ ...props,
11956
+ children
11957
+ }
11958
+ );
11925
11959
  };
11926
11960
 
11927
11961
  // src/components/Card/LoadingCardSkeleton.styles.ts
11928
- var import_react39 = require("@emotion/react");
11929
- var LoadingCardSkeleton = import_react39.css`
11962
+ var import_react41 = require("@emotion/react");
11963
+ var LoadingCardSkeleton = import_react41.css`
11930
11964
  animation: ${skeletonLoading} 1s linear infinite alternate;
11931
11965
  color: var(--gray-400);
11932
11966
  border-radius: var(--rounded-base);
@@ -11934,21 +11968,21 @@ var LoadingCardSkeleton = import_react39.css`
11934
11968
  min-height: 160px;
11935
11969
  position: relative;
11936
11970
  `;
11937
- var LoadingText = import_react39.css`
11971
+ var LoadingText = import_react41.css`
11938
11972
  animation: ${fadeIn} 1s linear infinite alternate;
11939
11973
  border-radius: var(--rounded-base);
11940
11974
  background: var(--gray-300);
11941
11975
  display: block;
11942
11976
  `;
11943
- var LoadingTitle = import_react39.css`
11977
+ var LoadingTitle = import_react41.css`
11944
11978
  width: clamp(200px, 100vw, 60%);
11945
11979
  height: var(--spacing-md);
11946
11980
  `;
11947
- var LoadingTimeStamp = import_react39.css`
11981
+ var LoadingTimeStamp = import_react41.css`
11948
11982
  width: clamp(200px, 100vw, 30%);
11949
11983
  height: var(--spacing-sm);
11950
11984
  `;
11951
- var LoadingMenuIcon = import_react39.css`
11985
+ var LoadingMenuIcon = import_react41.css`
11952
11986
  animation: ${fadeIn} 1s linear infinite alternate;
11953
11987
  position: absolute;
11954
11988
  top: var(--spacing-md);
@@ -11969,8 +12003,8 @@ var LoadingCardSkeleton2 = () => {
11969
12003
  var import_cg9 = require("react-icons/cg");
11970
12004
 
11971
12005
  // src/components/Chip/Chip.styles.ts
11972
- var import_react40 = require("@emotion/react");
11973
- var ChipContainer = import_react40.css`
12006
+ var import_react42 = require("@emotion/react");
12007
+ var ChipContainer = import_react42.css`
11974
12008
  border-radius: var(--rounded-full);
11975
12009
  background: lime;
11976
12010
  cursor: pointer;
@@ -11988,20 +12022,20 @@ var ChipContainer = import_react40.css`
11988
12022
  }
11989
12023
  }
11990
12024
  `;
11991
- var ChipText = import_react40.css`
12025
+ var ChipText = import_react42.css`
11992
12026
  line-height: 1;
11993
12027
  `;
11994
- var ChipIcon = import_react40.css`
12028
+ var ChipIcon = import_react42.css`
11995
12029
  align-items: center;
11996
12030
  display: flex;
11997
12031
  opacity: var(--opacity-50);
11998
12032
  `;
11999
- var ChipSeparator = import_react40.css`
12033
+ var ChipSeparator = import_react42.css`
12000
12034
  display: flex;
12001
12035
  border-right: 1px solid var(--white);
12002
12036
  opacity: var(--opacity-50);
12003
12037
  `;
12004
- var ChipTiny = import_react40.css`
12038
+ var ChipTiny = import_react42.css`
12005
12039
  font-size: var(--fs-xs);
12006
12040
  padding-inline: var(--spacing-sm);
12007
12041
 
@@ -12009,7 +12043,7 @@ var ChipTiny = import_react40.css`
12009
12043
  padding-block: var(--spacing-xs);
12010
12044
  }
12011
12045
  `;
12012
- var ChipSmall = import_react40.css`
12046
+ var ChipSmall = import_react42.css`
12013
12047
  font-size: var(--fs-sm);
12014
12048
  padding-inline: var(--spacing-base);
12015
12049
 
@@ -12017,7 +12051,7 @@ var ChipSmall = import_react40.css`
12017
12051
  padding-block: var(--spacing-sm);
12018
12052
  }
12019
12053
  `;
12020
- var ChipMedium = import_react40.css`
12054
+ var ChipMedium = import_react42.css`
12021
12055
  font-size: var(--fs-base);
12022
12056
  padding-inline: var(--spacing-base);
12023
12057
 
@@ -12025,7 +12059,7 @@ var ChipMedium = import_react40.css`
12025
12059
  padding-block: var(--spacing-sm);
12026
12060
  }
12027
12061
  `;
12028
- var ChipThemeAccentLight = import_react40.css`
12062
+ var ChipThemeAccentLight = import_react42.css`
12029
12063
  background: var(--accent-light);
12030
12064
  color: var(--brand-secondary-1);
12031
12065
 
@@ -12048,7 +12082,7 @@ var ChipThemeAccentLight = import_react40.css`
12048
12082
  color: var(--accent-light);
12049
12083
  }
12050
12084
  `;
12051
- var ChipThemeAccentDark = import_react40.css`
12085
+ var ChipThemeAccentDark = import_react42.css`
12052
12086
  background: var(--accent-dark);
12053
12087
  color: var(--white);
12054
12088
 
@@ -12067,7 +12101,7 @@ var ChipThemeAccentDark = import_react40.css`
12067
12101
  color: var(--white);
12068
12102
  }
12069
12103
  `;
12070
- var ChipAltThemeAccentLight = import_react40.css`
12104
+ var ChipAltThemeAccentLight = import_react42.css`
12071
12105
  background: var(--accent-alt-light);
12072
12106
  color: var(--brand-secondary-1);
12073
12107
 
@@ -12090,7 +12124,7 @@ var ChipAltThemeAccentLight = import_react40.css`
12090
12124
  color: var(--accent-alt-light);
12091
12125
  }
12092
12126
  `;
12093
- var ChipAltThemeAccentDark = import_react40.css`
12127
+ var ChipAltThemeAccentDark = import_react42.css`
12094
12128
  background: var(--accent-alt-dark);
12095
12129
  color: var(--white);
12096
12130
 
@@ -12109,7 +12143,7 @@ var ChipAltThemeAccentDark = import_react40.css`
12109
12143
  color: var(--white);
12110
12144
  }
12111
12145
  `;
12112
- var ChipThemeNeutralLight = import_react40.css`
12146
+ var ChipThemeNeutralLight = import_react42.css`
12113
12147
  background: var(--gray-100);
12114
12148
  color: var(--brand-secondary-1);
12115
12149
 
@@ -12118,7 +12152,7 @@ var ChipThemeNeutralLight = import_react40.css`
12118
12152
  background: var(--gray-400);
12119
12153
  }
12120
12154
  `;
12121
- var ChipThemeNeutralDark = import_react40.css`
12155
+ var ChipThemeNeutralDark = import_react42.css`
12122
12156
  background: var(--gray-700);
12123
12157
  color: var(--white);
12124
12158
 
@@ -12131,7 +12165,7 @@ var ChipThemeNeutralDark = import_react40.css`
12131
12165
  background: var(--gray-900);
12132
12166
  }
12133
12167
  `;
12134
- var ChipActionButton = import_react40.css`
12168
+ var ChipActionButton = import_react42.css`
12135
12169
  background: transparent;
12136
12170
  border: none;
12137
12171
  border-radius: 0 var(--rounded-full) var(--rounded-full) 0;
@@ -12185,8 +12219,8 @@ var DismissibleChipAction = ({ onDismiss, ...props }) => {
12185
12219
  };
12186
12220
 
12187
12221
  // src/components/Counter/Counter.styles.ts
12188
- var import_react41 = require("@emotion/react");
12189
- var counterContainer = (bgColor) => import_react41.css`
12222
+ var import_react43 = require("@emotion/react");
12223
+ var counterContainer = (bgColor) => import_react43.css`
12190
12224
  align-items: center;
12191
12225
  border-radius: var(--rounded-full);
12192
12226
  border: 1px solid var(--gray-300);
@@ -12199,16 +12233,16 @@ var counterContainer = (bgColor) => import_react41.css`
12199
12233
  width: var(--spacing-base);
12200
12234
  height: var(--spacing-base);
12201
12235
  `;
12202
- var counterZeroValue = import_react41.css`
12236
+ var counterZeroValue = import_react43.css`
12203
12237
  background: var(--brand-secondary-1);
12204
12238
  border-radius: var(--rounded-full);
12205
12239
  width: 2px;
12206
12240
  height: 2px;
12207
12241
  `;
12208
- var counterTripleValue = import_react41.css`
12242
+ var counterTripleValue = import_react43.css`
12209
12243
  position: relative;
12210
12244
  `;
12211
- var counterIcon = import_react41.css`
12245
+ var counterIcon = import_react43.css`
12212
12246
  border-radius: var(--rounded-full);
12213
12247
  background: var(--white);
12214
12248
  color: var(--brand-secondary-3);
@@ -12233,7 +12267,7 @@ var Counter = ({ count, bgColor = "transparent", ...props }) => {
12233
12267
  };
12234
12268
 
12235
12269
  // src/components/DashedBox/DashedBox.styles.ts
12236
- var import_react42 = require("@emotion/react");
12270
+ var import_react44 = require("@emotion/react");
12237
12271
  var minHeight = (prop) => {
12238
12272
  const values = {
12239
12273
  auto: "auto",
@@ -12252,7 +12286,7 @@ var alignItemsConvert = (props) => {
12252
12286
  };
12253
12287
  return alignment[props];
12254
12288
  };
12255
- var DashedBoxContainer = ({ textAlign, boxHeight, bgColor }) => import_react42.css`
12289
+ var DashedBoxContainer = ({ textAlign, boxHeight, bgColor }) => import_react44.css`
12256
12290
  align-items: ${alignItemsConvert(textAlign)};
12257
12291
  border: 2px dashed var(--gray-300);
12258
12292
  border-radius: var(--rounded-base);
@@ -12282,8 +12316,8 @@ var DashedBox = ({
12282
12316
  var React8 = __toESM(require("react"));
12283
12317
 
12284
12318
  // src/components/Details/Details.styles.ts
12285
- var import_react43 = require("@emotion/react");
12286
- var details = import_react43.css`
12319
+ var import_react45 = require("@emotion/react");
12320
+ var details = import_react45.css`
12287
12321
  cursor: pointer;
12288
12322
  &[open] {
12289
12323
  & > summary svg {
@@ -12291,11 +12325,11 @@ var details = import_react43.css`
12291
12325
  }
12292
12326
  }
12293
12327
  `;
12294
- var detailsContent = import_react43.css`
12328
+ var detailsContent = import_react45.css`
12295
12329
  animation: ${fadeInRtl} var(--duration-fast) var(--timing-ease-out) forwards;
12296
12330
  will-change: height;
12297
12331
  `;
12298
- var summary = import_react43.css`
12332
+ var summary = import_react45.css`
12299
12333
  align-items: center;
12300
12334
  display: grid;
12301
12335
  grid-template-columns: 1.25rem 1fr;
@@ -12308,11 +12342,11 @@ var summary = import_react43.css`
12308
12342
  display: none;
12309
12343
  }
12310
12344
  `;
12311
- var summaryIcon = import_react43.css`
12345
+ var summaryIcon = import_react45.css`
12312
12346
  transition: rotate var(--duration-fast) var(--timing-ease-out);
12313
12347
  rotate: -90deg;
12314
12348
  `;
12315
- var summaryIconVisiblyHidden = import_react43.css`
12349
+ var summaryIconVisiblyHidden = import_react45.css`
12316
12350
  visibility: hidden;
12317
12351
  `;
12318
12352
 
@@ -12355,12 +12389,12 @@ var Details = ({ summary: summary2, children, isOpenByDefault = false, ...props
12355
12389
  };
12356
12390
 
12357
12391
  // src/components/Drawer/Drawer.tsx
12358
- var import_react47 = __toESM(require("react"));
12392
+ var import_react49 = __toESM(require("react"));
12359
12393
  var import_cg10 = require("react-icons/cg");
12360
12394
 
12361
12395
  // src/components/Drawer/Drawer.styles.ts
12362
- var import_react44 = require("@emotion/react");
12363
- var drawerStyles = (bgColor = "var(--white)") => import_react44.css`
12396
+ var import_react46 = require("@emotion/react");
12397
+ var drawerStyles = (bgColor = "var(--white)") => import_react46.css`
12364
12398
  background-color: ${bgColor};
12365
12399
  display: flex;
12366
12400
  gap: var(--spacing-sm);
@@ -12370,7 +12404,7 @@ var drawerStyles = (bgColor = "var(--white)") => import_react44.css`
12370
12404
  padding-top: var(--spacing-sm);
12371
12405
  height: 100%;
12372
12406
  `;
12373
- var drawerCloseButtonStyles = import_react44.css`
12407
+ var drawerCloseButtonStyles = import_react46.css`
12374
12408
  align-self: flex-end;
12375
12409
  background: transparent;
12376
12410
  border: none;
@@ -12378,23 +12412,23 @@ var drawerCloseButtonStyles = import_react44.css`
12378
12412
  padding: var(--spacing-xs);
12379
12413
  margin-right: var(--spacing-sm);
12380
12414
  `;
12381
- var drawerHeaderStyles = import_react44.css`
12415
+ var drawerHeaderStyles = import_react46.css`
12382
12416
  font-size: var(--fs-lg);
12383
12417
  font-weight: var(--fw-bold);
12384
12418
  padding-inline: var(--spacing-base);
12385
12419
  `;
12386
- var drawerRendererStyles = import_react44.css`
12420
+ var drawerRendererStyles = import_react46.css`
12387
12421
  inset: 0;
12388
12422
  overflow: hidden;
12389
12423
  z-index: 40;
12390
12424
  `;
12391
- var drawerInnerStyles = import_react44.css`
12425
+ var drawerInnerStyles = import_react46.css`
12392
12426
  height: 100%;
12393
12427
  padding: 0 var(--spacing-base) var(--spacing-base);
12394
12428
  overflow: auto;
12395
12429
  ${scrollbarStyles}
12396
12430
  `;
12397
- var slideDrawerIn = import_react44.keyframes`
12431
+ var slideDrawerIn = import_react46.keyframes`
12398
12432
  0% {
12399
12433
  transform: translate(0);
12400
12434
  opacity: 0;
@@ -12409,7 +12443,7 @@ var slideDrawerIn = import_react44.keyframes`
12409
12443
  transform: translate(0);
12410
12444
  }
12411
12445
  `;
12412
- var drawerWrapperStyles = import_react44.css`
12446
+ var drawerWrapperStyles = import_react46.css`
12413
12447
  position: absolute;
12414
12448
  inset-block: 0;
12415
12449
  right: 0;
@@ -12420,7 +12454,7 @@ var drawerWrapperStyles = import_react44.css`
12420
12454
  transition: width var(--duration-fast) ease-out;
12421
12455
  box-shadow: 0 0 10px 5px rgba(0, 0, 0, 0.1);
12422
12456
  `;
12423
- var drawerWrapperOverlayStyles = import_react44.css`
12457
+ var drawerWrapperOverlayStyles = import_react46.css`
12424
12458
  position: absolute;
12425
12459
  inset: 0;
12426
12460
  background: rgba(31, 43, 52, 0.4);
@@ -12428,9 +12462,9 @@ var drawerWrapperOverlayStyles = import_react44.css`
12428
12462
  `;
12429
12463
 
12430
12464
  // src/components/Drawer/DrawerProvider.tsx
12431
- var import_react45 = require("react");
12465
+ var import_react47 = require("react");
12432
12466
  var import_jsx_runtime38 = require("@emotion/react/jsx-runtime");
12433
- var DrawerContext = (0, import_react45.createContext)({
12467
+ var DrawerContext = (0, import_react47.createContext)({
12434
12468
  drawersRegistry: [],
12435
12469
  registerDrawer: () => {
12436
12470
  },
@@ -12438,7 +12472,7 @@ var DrawerContext = (0, import_react45.createContext)({
12438
12472
  }
12439
12473
  });
12440
12474
  var DrawerProvider = ({ children }) => {
12441
- const [drawersRegistry, setDrawersRegistry] = (0, import_react45.useState)([]);
12475
+ const [drawersRegistry, setDrawersRegistry] = (0, import_react47.useState)([]);
12442
12476
  useShortcut({
12443
12477
  handler: () => {
12444
12478
  var _a, _b;
@@ -12446,7 +12480,7 @@ var DrawerProvider = ({ children }) => {
12446
12480
  },
12447
12481
  shortcut: "escape"
12448
12482
  });
12449
- const registerDrawer = (0, import_react45.useCallback)(
12483
+ const registerDrawer = (0, import_react47.useCallback)(
12450
12484
  ({ drawer, onFirstRender }) => {
12451
12485
  setDrawersRegistry((currentValue) => {
12452
12486
  var _a;
@@ -12468,7 +12502,7 @@ var DrawerProvider = ({ children }) => {
12468
12502
  },
12469
12503
  [setDrawersRegistry]
12470
12504
  );
12471
- const unregisterDrawer = (0, import_react45.useCallback)(
12505
+ const unregisterDrawer = (0, import_react47.useCallback)(
12472
12506
  (drawer) => {
12473
12507
  setDrawersRegistry((currentValue) => {
12474
12508
  return currentValue.filter((d) => {
@@ -12481,7 +12515,7 @@ var DrawerProvider = ({ children }) => {
12481
12515
  return /* @__PURE__ */ (0, import_jsx_runtime38.jsx)(DrawerContext.Provider, { value: { drawersRegistry, registerDrawer, unregisterDrawer }, children });
12482
12516
  };
12483
12517
  var useDrawer = () => {
12484
- return (0, import_react45.useContext)(DrawerContext);
12518
+ return (0, import_react47.useContext)(DrawerContext);
12485
12519
  };
12486
12520
  var useCloseCurrentDrawer = () => {
12487
12521
  const context = useDrawer();
@@ -12498,13 +12532,13 @@ function isEqualDrawerInstance(a, b) {
12498
12532
  }
12499
12533
 
12500
12534
  // src/components/Drawer/DrawerRenderer.tsx
12501
- var import_react46 = require("react");
12535
+ var import_react48 = require("react");
12502
12536
  var import_jsx_runtime39 = require("@emotion/react/jsx-runtime");
12503
12537
  var maxLayeringInPx = 64;
12504
12538
  var idealDistanceBetweenLayersInPx = 16;
12505
- var CurrentDrawerRendererContext = (0, import_react46.createContext)({});
12539
+ var CurrentDrawerRendererContext = (0, import_react48.createContext)({});
12506
12540
  var useCurrentDrawerRenderer = () => {
12507
- return (0, import_react46.useContext)(CurrentDrawerRendererContext);
12541
+ return (0, import_react48.useContext)(CurrentDrawerRendererContext);
12508
12542
  };
12509
12543
  var DrawerRenderer = ({
12510
12544
  stackId,
@@ -12568,7 +12602,7 @@ var DrawerWrapper = ({
12568
12602
  // src/components/Drawer/Drawer.tsx
12569
12603
  var import_jsx_runtime40 = require("@emotion/react/jsx-runtime");
12570
12604
  var defaultSackId = "_default";
12571
- var Drawer = import_react47.default.forwardRef(
12605
+ var Drawer = import_react49.default.forwardRef(
12572
12606
  ({ width, minWidth, maxWidth, position, ...drawerProps }, ref) => {
12573
12607
  const drawerRendererProps = { width, minWidth, maxWidth, position };
12574
12608
  const { stackId: inheritedStackId } = useCurrentDrawerRenderer();
@@ -12590,8 +12624,8 @@ var DrawerInner = ({
12590
12624
  testId = "side-dialog"
12591
12625
  }) => {
12592
12626
  const { registerDrawer, unregisterDrawer } = useDrawer();
12593
- const closeButtonRef = (0, import_react47.useRef)(null);
12594
- const component = (0, import_react47.useMemo)(() => {
12627
+ const closeButtonRef = (0, import_react49.useRef)(null);
12628
+ const component = (0, import_react49.useMemo)(() => {
12595
12629
  const headerId = `dialog-header-${stackId}-${id}`;
12596
12630
  return /* @__PURE__ */ (0, import_jsx_runtime40.jsxs)(
12597
12631
  "div",
@@ -12622,7 +12656,7 @@ var DrawerInner = ({
12622
12656
  }
12623
12657
  );
12624
12658
  }, [children, header, id, stackId, bgColor, onRequestClose, ref, testId]);
12625
- (0, import_react47.useEffect)(() => {
12659
+ (0, import_react49.useEffect)(() => {
12626
12660
  registerDrawer({
12627
12661
  drawer: {
12628
12662
  id,
@@ -12639,15 +12673,15 @@ var DrawerInner = ({
12639
12673
  }
12640
12674
  });
12641
12675
  }, [component, instanceKey, registerDrawer]);
12642
- (0, import_react47.useEffect)(() => {
12676
+ (0, import_react49.useEffect)(() => {
12643
12677
  return () => unregisterDrawer({ id, stackId, instanceKey });
12644
12678
  }, [id, stackId, instanceKey, unregisterDrawer]);
12645
12679
  return null;
12646
12680
  };
12647
12681
 
12648
12682
  // src/components/Input/styles/CaptionText.styles.ts
12649
- var import_react48 = require("@emotion/react");
12650
- var CaptionText = (dynamicSize) => import_react48.css`
12683
+ var import_react50 = require("@emotion/react");
12684
+ var CaptionText = (dynamicSize) => import_react50.css`
12651
12685
  color: var(--gray-500);
12652
12686
  display: block;
12653
12687
  font-size: ${dynamicSize ? "clamp(var(--fs-xs), 87.5%,var(--fs-sm))" : "var(--fs-sm)"};
@@ -12662,23 +12696,23 @@ var Caption = ({ children, testId, dynamicSize = false, ...props }) => {
12662
12696
  };
12663
12697
 
12664
12698
  // src/components/Input/CheckboxWithInfo.tsx
12665
- var import_react50 = require("react");
12699
+ var import_react52 = require("react");
12666
12700
 
12667
12701
  // src/components/Input/styles/CheckboxWithInfo.styles.ts
12668
- var import_react49 = require("@emotion/react");
12669
- var CheckboxWithInfoContainer = import_react49.css`
12702
+ var import_react51 = require("@emotion/react");
12703
+ var CheckboxWithInfoContainer = import_react51.css`
12670
12704
  align-items: center;
12671
12705
  display: flex;
12672
12706
  gap: var(--spacing-sm);
12673
12707
  `;
12674
- var CheckboxWithInfoLabel = import_react49.css`
12708
+ var CheckboxWithInfoLabel = import_react51.css`
12675
12709
  align-items: center;
12676
12710
  color: var(--gray-500);
12677
12711
  display: flex;
12678
12712
  font-size: var(--fs-xs);
12679
12713
  gap: var(--spacing-sm);
12680
12714
  `;
12681
- var CheckboxWithInfoInput = import_react49.css`
12715
+ var CheckboxWithInfoInput = import_react51.css`
12682
12716
  appearance: none;
12683
12717
  border: 1px solid var(--gray-300);
12684
12718
  background: var(--white) no-repeat bottom center;
@@ -12711,7 +12745,7 @@ var CheckboxWithInfoInput = import_react49.css`
12711
12745
  border-color: var(--gray-200);
12712
12746
  }
12713
12747
  `;
12714
- var InfoDialogContainer = import_react49.css`
12748
+ var InfoDialogContainer = import_react51.css`
12715
12749
  position: relative;
12716
12750
 
12717
12751
  &:hover {
@@ -12720,7 +12754,7 @@ var InfoDialogContainer = import_react49.css`
12720
12754
  }
12721
12755
  }
12722
12756
  `;
12723
- var InfoDialogMessage = import_react49.css`
12757
+ var InfoDialogMessage = import_react51.css`
12724
12758
  background: var(--white);
12725
12759
  box-shadow: var(--shadow-base);
12726
12760
  border-radius: var(--rounded-md);
@@ -12744,7 +12778,7 @@ var InfoDialog = ({ message }) => {
12744
12778
  /* @__PURE__ */ (0, import_jsx_runtime42.jsx)("div", { role: "paragraph", css: InfoDialogMessage, className: "info-message", children: message })
12745
12779
  ] });
12746
12780
  };
12747
- var CheckboxWithInfo = (0, import_react50.forwardRef)(
12781
+ var CheckboxWithInfo = (0, import_react52.forwardRef)(
12748
12782
  ({ label, name, info, ...props }, ref) => {
12749
12783
  return /* @__PURE__ */ (0, import_jsx_runtime42.jsxs)("div", { css: CheckboxWithInfoContainer, children: [
12750
12784
  /* @__PURE__ */ (0, import_jsx_runtime42.jsxs)("label", { css: CheckboxWithInfoLabel, children: [
@@ -12760,8 +12794,8 @@ var CheckboxWithInfo = (0, import_react50.forwardRef)(
12760
12794
  var import_md2 = require("react-icons/md");
12761
12795
 
12762
12796
  // src/components/Input/styles/ErrorMessage.styles.ts
12763
- var import_react51 = require("@emotion/react");
12764
- var ErrorText = import_react51.css`
12797
+ var import_react53 = require("@emotion/react");
12798
+ var ErrorText = import_react53.css`
12765
12799
  align-items: center;
12766
12800
  color: var(--brand-secondary-5);
12767
12801
  display: flex;
@@ -12772,7 +12806,7 @@ var ErrorText = import_react51.css`
12772
12806
  var import_jsx_runtime43 = require("@emotion/react/jsx-runtime");
12773
12807
  var ErrorMessage = ({ message, testId, ...otherProps }) => {
12774
12808
  return message ? /* @__PURE__ */ (0, import_jsx_runtime43.jsxs)("span", { role: "alert", css: ErrorText, "data-test-id": testId, ...otherProps, children: [
12775
- /* @__PURE__ */ (0, import_jsx_runtime43.jsx)(Icon, { icon: import_md2.MdWarning, size: 16, iconColor: "currentColor" }),
12809
+ /* @__PURE__ */ (0, import_jsx_runtime43.jsx)("span", { children: /* @__PURE__ */ (0, import_jsx_runtime43.jsx)(Icon, { icon: import_md2.MdWarning, size: "1rem", iconColor: "currentColor" }) }),
12776
12810
  message
12777
12811
  ] }) : null;
12778
12812
  };
@@ -12781,9 +12815,9 @@ var ErrorMessage = ({ message, testId, ...otherProps }) => {
12781
12815
  var React12 = __toESM(require("react"));
12782
12816
 
12783
12817
  // src/components/Input/styles/Fieldset.styles.ts
12784
- var import_react52 = require("@emotion/react");
12818
+ var import_react54 = require("@emotion/react");
12785
12819
  function fieldsetContainer(invert) {
12786
- const base = import_react52.css`
12820
+ const base = import_react54.css`
12787
12821
  border-radius: var(--rounded-base);
12788
12822
  border: 1px solid var(--gray-300);
12789
12823
 
@@ -12795,18 +12829,18 @@ function fieldsetContainer(invert) {
12795
12829
  }
12796
12830
  `;
12797
12831
  return invert ? [
12798
- import_react52.css`
12832
+ import_react54.css`
12799
12833
  background: white;
12800
12834
  `,
12801
12835
  base
12802
12836
  ] : [
12803
- import_react52.css`
12837
+ import_react54.css`
12804
12838
  background: var(--gray-50);
12805
12839
  `,
12806
12840
  base
12807
12841
  ];
12808
12842
  }
12809
- var fieldsetLegend = import_react52.css`
12843
+ var fieldsetLegend = import_react54.css`
12810
12844
  align-items: center;
12811
12845
  color: var(--brand-secondary-1);
12812
12846
  display: flex;
@@ -12816,7 +12850,7 @@ var fieldsetLegend = import_react52.css`
12816
12850
  margin-bottom: var(--spacing-base);
12817
12851
  float: left; // allows the legend to be inside the fieldset and not sat on the border line
12818
12852
  `;
12819
- var fieldsetBody = import_react52.css`
12853
+ var fieldsetBody = import_react54.css`
12820
12854
  clear: left;
12821
12855
  `;
12822
12856
 
@@ -12835,8 +12869,8 @@ var Fieldset = React12.forwardRef(
12835
12869
  var import_md3 = require("react-icons/md");
12836
12870
 
12837
12871
  // src/components/Input/styles/InfoMessage.styles.tsx
12838
- var import_react53 = require("@emotion/react");
12839
- var InfoText = import_react53.css`
12872
+ var import_react55 = require("@emotion/react");
12873
+ var InfoText = import_react55.css`
12840
12874
  --info-desc: rgb(29, 78, 216);
12841
12875
  --info-icon: rgb(96, 165, 250);
12842
12876
 
@@ -12845,7 +12879,7 @@ var InfoText = import_react53.css`
12845
12879
  display: flex;
12846
12880
  gap: var(--spacing-sm);
12847
12881
  `;
12848
- var InfoIcon2 = import_react53.css`
12882
+ var InfoIcon2 = import_react55.css`
12849
12883
  color: var(--info-icon);
12850
12884
  `;
12851
12885
 
@@ -12853,7 +12887,7 @@ var InfoIcon2 = import_react53.css`
12853
12887
  var import_jsx_runtime45 = require("@emotion/react/jsx-runtime");
12854
12888
  var InfoMessage = ({ message, testId, ...props }) => {
12855
12889
  return message ? /* @__PURE__ */ (0, import_jsx_runtime45.jsxs)("span", { role: "status", css: InfoText, "data-test-id": testId, ...props, children: [
12856
- /* @__PURE__ */ (0, import_jsx_runtime45.jsx)(Icon, { css: InfoIcon2, icon: import_md3.MdInfoOutline, size: "1rem", iconColor: "currentColor" }),
12890
+ /* @__PURE__ */ (0, import_jsx_runtime45.jsx)("span", { children: /* @__PURE__ */ (0, import_jsx_runtime45.jsx)(Icon, { css: InfoIcon2, icon: import_md3.MdInfoOutline, size: "1rem", iconColor: "currentColor" }) }),
12857
12891
  message
12858
12892
  ] }) : null;
12859
12893
  };
@@ -12880,14 +12914,14 @@ var Label = ({ children, className, testId, ...props }) => {
12880
12914
  var import_md4 = require("react-icons/md");
12881
12915
 
12882
12916
  // src/components/Input/styles/WarningMessage.styles.tsx
12883
- var import_react54 = require("@emotion/react");
12884
- var WarningText = import_react54.css`
12917
+ var import_react56 = require("@emotion/react");
12918
+ var WarningText = import_react56.css`
12885
12919
  align-items: center;
12886
12920
  color: var(--alert-text);
12887
12921
  display: flex;
12888
12922
  gap: var(--spacing-sm);
12889
12923
  `;
12890
- var WarningIcon = import_react54.css`
12924
+ var WarningIcon = import_react56.css`
12891
12925
  color: var(--alert);
12892
12926
  `;
12893
12927
 
@@ -12895,7 +12929,7 @@ var WarningIcon = import_react54.css`
12895
12929
  var import_jsx_runtime47 = require("@emotion/react/jsx-runtime");
12896
12930
  var WarningMessage = ({ message, testId, ...props }) => {
12897
12931
  return message ? /* @__PURE__ */ (0, import_jsx_runtime47.jsxs)("span", { role: "status", css: WarningText, "data-test-id": testId, ...props, children: [
12898
- /* @__PURE__ */ (0, import_jsx_runtime47.jsx)(Icon, { css: WarningIcon, icon: import_md4.MdWarning, size: "1rem", iconColor: "currentColor" }),
12932
+ /* @__PURE__ */ (0, import_jsx_runtime47.jsx)("span", { children: /* @__PURE__ */ (0, import_jsx_runtime47.jsx)(Icon, { css: WarningIcon, icon: import_md4.MdWarning, size: "1rem", iconColor: "currentColor" }) }),
12899
12933
  message
12900
12934
  ] }) : null;
12901
12935
  };
@@ -13098,17 +13132,17 @@ function InputComboBox(props) {
13098
13132
  }
13099
13133
 
13100
13134
  // src/components/Input/InputInlineSelect.tsx
13101
- var import_react56 = require("@emotion/react");
13102
- var import_react57 = require("react");
13135
+ var import_react58 = require("@emotion/react");
13136
+ var import_react59 = require("react");
13103
13137
  var import_cg11 = require("react-icons/cg");
13104
13138
 
13105
13139
  // src/components/Input/styles/InputInlineSelect.styles.ts
13106
- var import_react55 = require("@emotion/react");
13107
- var inlineSelectContainer = import_react55.css`
13140
+ var import_react57 = require("@emotion/react");
13141
+ var inlineSelectContainer = import_react57.css`
13108
13142
  margin-inline: auto;
13109
13143
  max-width: fit-content;
13110
13144
  `;
13111
- var inlineSelectBtn = import_react55.css`
13145
+ var inlineSelectBtn = import_react57.css`
13112
13146
  align-items: center;
13113
13147
  background: var(--brand-secondary-3);
13114
13148
  border: 2px solid var(--brand-secondary-3);
@@ -13132,7 +13166,7 @@ var inlineSelectBtn = import_react55.css`
13132
13166
  outline: 2px solid var(--brand-secondary-1);
13133
13167
  }
13134
13168
  `;
13135
- var inlineSelectMenu = import_react55.css`
13169
+ var inlineSelectMenu = import_react57.css`
13136
13170
  background: var(--white);
13137
13171
  border: 1px solid var(--brand-secondary-3);
13138
13172
  border-top: none;
@@ -13143,7 +13177,7 @@ var inlineSelectMenu = import_react55.css`
13143
13177
  inset: auto 0;
13144
13178
  transform: translateY(-0.2rem);
13145
13179
  `;
13146
- var inlineSelectBtnOptions = import_react55.css`
13180
+ var inlineSelectBtnOptions = import_react57.css`
13147
13181
  cursor: pointer;
13148
13182
  display: block;
13149
13183
  font-size: var(--fs-sm);
@@ -13159,7 +13193,7 @@ var inlineSelectBtnOptions = import_react55.css`
13159
13193
  background: var(--gray-50);
13160
13194
  }
13161
13195
  `;
13162
- var inlineSelectMenuClosed = import_react55.css`
13196
+ var inlineSelectMenuClosed = import_react57.css`
13163
13197
  position: absolute;
13164
13198
  overflow: hidden;
13165
13199
  height: 1px;
@@ -13179,15 +13213,15 @@ var InputInlineSelect = ({
13179
13213
  ...props
13180
13214
  }) => {
13181
13215
  var _a;
13182
- const [menuVisible, setMenuVisible] = (0, import_react57.useState)(false);
13183
- const divRef = (0, import_react57.useRef)(null);
13216
+ const [menuVisible, setMenuVisible] = (0, import_react59.useState)(false);
13217
+ const divRef = (0, import_react59.useRef)(null);
13184
13218
  useOutsideClick(divRef, () => setMenuVisible(false));
13185
13219
  const selected = options.find((option) => option.value === value);
13186
13220
  return /* @__PURE__ */ (0, import_jsx_runtime50.jsxs)(
13187
13221
  "div",
13188
13222
  {
13189
13223
  ref: divRef,
13190
- css: !classNameContainer ? inlineSelectContainer : import_react56.css`
13224
+ css: !classNameContainer ? inlineSelectContainer : import_react58.css`
13191
13225
  max-width: fit-content;
13192
13226
  ${typeof classNameContainer === "object" ? classNameContainer : void 0}
13193
13227
  `,
@@ -13385,8 +13419,35 @@ var Legend = ({ children }) => {
13385
13419
  return /* @__PURE__ */ (0, import_jsx_runtime54.jsx)("legend", { css: fieldsetLegend, children });
13386
13420
  };
13387
13421
 
13388
- // src/components/Input/Textarea.tsx
13422
+ // src/components/Input/SuccessMessage.tsx
13423
+ var import_cg12 = require("react-icons/cg");
13424
+
13425
+ // src/components/Input/styles/SuccessMessage.styles.ts
13426
+ var import_react60 = require("@emotion/react");
13427
+ var SuccessText = import_react60.css`
13428
+ --info-desc: var(--brand-secondary-3);
13429
+ --info-icon: var(--brand-secondary-3);
13430
+
13431
+ align-items: center;
13432
+ color: var(--info-desc);
13433
+ display: flex;
13434
+ gap: var(--spacing-sm);
13435
+ `;
13436
+ var SuccessIcon2 = import_react60.css`
13437
+ color: var(--info-icon);
13438
+ `;
13439
+
13440
+ // src/components/Input/SuccessMessage.tsx
13389
13441
  var import_jsx_runtime55 = require("@emotion/react/jsx-runtime");
13442
+ var SuccessMessage = ({ message, testId, ...props }) => {
13443
+ return message ? /* @__PURE__ */ (0, import_jsx_runtime55.jsxs)("span", { role: "status", css: SuccessText, "data-test-id": testId, ...props, children: [
13444
+ /* @__PURE__ */ (0, import_jsx_runtime55.jsx)("span", { children: /* @__PURE__ */ (0, import_jsx_runtime55.jsx)(Icon, { css: SuccessIcon2, icon: import_cg12.CgCheckO, size: "1rem", iconColor: "currentColor" }) }),
13445
+ message
13446
+ ] }) : null;
13447
+ };
13448
+
13449
+ // src/components/Input/Textarea.tsx
13450
+ var import_jsx_runtime56 = require("@emotion/react/jsx-runtime");
13390
13451
  var Textarea = ({
13391
13452
  label,
13392
13453
  icon,
@@ -13397,10 +13458,10 @@ var Textarea = ({
13397
13458
  warningMessage,
13398
13459
  ...props
13399
13460
  }) => {
13400
- return /* @__PURE__ */ (0, import_jsx_runtime55.jsxs)(import_jsx_runtime55.Fragment, { children: [
13401
- showLabel ? /* @__PURE__ */ (0, import_jsx_runtime55.jsx)("label", { htmlFor: id, css: [labelText], children: label }) : null,
13402
- /* @__PURE__ */ (0, import_jsx_runtime55.jsxs)("div", { css: [inputContainer], children: [
13403
- /* @__PURE__ */ (0, import_jsx_runtime55.jsx)(
13461
+ return /* @__PURE__ */ (0, import_jsx_runtime56.jsxs)(import_jsx_runtime56.Fragment, { children: [
13462
+ showLabel ? /* @__PURE__ */ (0, import_jsx_runtime56.jsx)("label", { htmlFor: id, css: [labelText], children: label }) : null,
13463
+ /* @__PURE__ */ (0, import_jsx_runtime56.jsxs)("div", { css: [inputContainer], children: [
13464
+ /* @__PURE__ */ (0, import_jsx_runtime56.jsx)(
13404
13465
  "textarea",
13405
13466
  {
13406
13467
  id,
@@ -13409,17 +13470,17 @@ var Textarea = ({
13409
13470
  ...props
13410
13471
  }
13411
13472
  ),
13412
- icon ? /* @__PURE__ */ (0, import_jsx_runtime55.jsx)("div", { css: inputIcon, children: icon }) : null
13473
+ icon ? /* @__PURE__ */ (0, import_jsx_runtime56.jsx)("div", { css: inputIcon, children: icon }) : null
13413
13474
  ] }),
13414
- caption ? /* @__PURE__ */ (0, import_jsx_runtime55.jsx)(Caption, { children: caption }) : null,
13415
- errorMessage ? /* @__PURE__ */ (0, import_jsx_runtime55.jsx)(ErrorMessage, { message: errorMessage }) : null,
13416
- warningMessage && !errorMessage ? /* @__PURE__ */ (0, import_jsx_runtime55.jsx)(WarningMessage, { message: warningMessage }) : null
13475
+ caption ? /* @__PURE__ */ (0, import_jsx_runtime56.jsx)(Caption, { children: caption }) : null,
13476
+ errorMessage ? /* @__PURE__ */ (0, import_jsx_runtime56.jsx)(ErrorMessage, { message: errorMessage }) : null,
13477
+ warningMessage && !errorMessage ? /* @__PURE__ */ (0, import_jsx_runtime56.jsx)(WarningMessage, { message: warningMessage }) : null
13417
13478
  ] });
13418
13479
  };
13419
13480
 
13420
13481
  // src/components/JsonEditor/JsonEditor.tsx
13421
- var import_react58 = __toESM(require("@monaco-editor/react"));
13422
- var import_jsx_runtime56 = require("@emotion/react/jsx-runtime");
13482
+ var import_react61 = __toESM(require("@monaco-editor/react"));
13483
+ var import_jsx_runtime57 = require("@emotion/react/jsx-runtime");
13423
13484
  var minEditorHeightPx = 150;
13424
13485
  var JsonEditor = ({ defaultValue, onChange, jsonSchema, height, readOnly }) => {
13425
13486
  let effectiveHeight = height;
@@ -13429,8 +13490,8 @@ var JsonEditor = ({ defaultValue, onChange, jsonSchema, height, readOnly }) => {
13429
13490
  if (typeof effectiveHeight === "number" && effectiveHeight < minEditorHeightPx) {
13430
13491
  effectiveHeight = minEditorHeightPx;
13431
13492
  }
13432
- return /* @__PURE__ */ (0, import_jsx_runtime56.jsx)(
13433
- import_react58.default,
13493
+ return /* @__PURE__ */ (0, import_jsx_runtime57.jsx)(
13494
+ import_react61.default,
13434
13495
  {
13435
13496
  height: effectiveHeight,
13436
13497
  className: "uniform-json-editor",
@@ -13466,39 +13527,39 @@ var JsonEditor = ({ defaultValue, onChange, jsonSchema, height, readOnly }) => {
13466
13527
  };
13467
13528
 
13468
13529
  // src/components/LimitsBar/LimitsBar.styles.ts
13469
- var import_react59 = require("@emotion/react");
13470
- var LimitsBarContainer = import_react59.css`
13530
+ var import_react62 = require("@emotion/react");
13531
+ var LimitsBarContainer = import_react62.css`
13471
13532
  margin-block: var(--spacing-sm);
13472
13533
  `;
13473
- var LimitsBarProgressBar = import_react59.css`
13534
+ var LimitsBarProgressBar = import_react62.css`
13474
13535
  background: var(--gray-100);
13475
13536
  margin-top: var(--spacing-sm);
13476
13537
  position: relative;
13477
13538
  overflow: hidden;
13478
13539
  height: 0.25rem;
13479
13540
  `;
13480
- var LimitsBarProgressBarLine = import_react59.css`
13541
+ var LimitsBarProgressBarLine = import_react62.css`
13481
13542
  position: absolute;
13482
13543
  inset: 0;
13483
13544
  transition: transform var(--duration-fast) var(--timing-ease-out);
13484
13545
  `;
13485
- var LimitsBarLabelContainer = import_react59.css`
13546
+ var LimitsBarLabelContainer = import_react62.css`
13486
13547
  display: flex;
13487
13548
  justify-content: space-between;
13488
13549
  font-weight: var(--fw-bold);
13489
13550
  `;
13490
- var LimitsBarLabel = import_react59.css`
13551
+ var LimitsBarLabel = import_react62.css`
13491
13552
  font-size: var(--fs-baase);
13492
13553
  `;
13493
- var LimitsBarBgColor = (statusColor) => import_react59.css`
13554
+ var LimitsBarBgColor = (statusColor) => import_react62.css`
13494
13555
  background: ${statusColor};
13495
13556
  `;
13496
- var LimitsBarTextColor = (statusColor) => import_react59.css`
13557
+ var LimitsBarTextColor = (statusColor) => import_react62.css`
13497
13558
  color: ${statusColor};
13498
13559
  `;
13499
13560
 
13500
13561
  // src/components/LimitsBar/LimitsBar.tsx
13501
- var import_jsx_runtime57 = require("@emotion/react/jsx-runtime");
13562
+ var import_jsx_runtime58 = require("@emotion/react/jsx-runtime");
13502
13563
  var LimitsBar = ({ current, max, label }) => {
13503
13564
  const maxPercentage = 100;
13504
13565
  const progressBarValue = Math.ceil(current / max * maxPercentage);
@@ -13509,16 +13570,16 @@ var LimitsBar = ({ current, max, label }) => {
13509
13570
  danger: "var(--brand-secondary-5)"
13510
13571
  };
13511
13572
  const statusColor = progressBarValue === 100 ? colorMap.danger : progressBarValue >= 75 ? colorMap.warn : colorMap.base;
13512
- return /* @__PURE__ */ (0, import_jsx_runtime57.jsxs)("div", { css: LimitsBarContainer, children: [
13513
- /* @__PURE__ */ (0, import_jsx_runtime57.jsxs)("div", { css: LimitsBarLabelContainer, children: [
13514
- /* @__PURE__ */ (0, import_jsx_runtime57.jsx)("span", { css: LimitsBarLabel, children: label }),
13515
- /* @__PURE__ */ (0, import_jsx_runtime57.jsxs)("span", { css: [LimitsBarLabel, LimitsBarTextColor(statusColor)], children: [
13573
+ return /* @__PURE__ */ (0, import_jsx_runtime58.jsxs)("div", { css: LimitsBarContainer, children: [
13574
+ /* @__PURE__ */ (0, import_jsx_runtime58.jsxs)("div", { css: LimitsBarLabelContainer, children: [
13575
+ /* @__PURE__ */ (0, import_jsx_runtime58.jsx)("span", { css: LimitsBarLabel, children: label }),
13576
+ /* @__PURE__ */ (0, import_jsx_runtime58.jsxs)("span", { css: [LimitsBarLabel, LimitsBarTextColor(statusColor)], children: [
13516
13577
  current,
13517
13578
  " of ",
13518
13579
  max
13519
13580
  ] })
13520
13581
  ] }),
13521
- /* @__PURE__ */ (0, import_jsx_runtime57.jsx)(
13582
+ /* @__PURE__ */ (0, import_jsx_runtime58.jsx)(
13522
13583
  "div",
13523
13584
  {
13524
13585
  role: "progressbar",
@@ -13527,7 +13588,7 @@ var LimitsBar = ({ current, max, label }) => {
13527
13588
  "aria-valuemax": max,
13528
13589
  "aria-valuetext": `${current} of ${max}`,
13529
13590
  css: LimitsBarProgressBar,
13530
- children: /* @__PURE__ */ (0, import_jsx_runtime57.jsx)(
13591
+ children: /* @__PURE__ */ (0, import_jsx_runtime58.jsx)(
13531
13592
  "span",
13532
13593
  {
13533
13594
  role: "presentation",
@@ -13543,8 +13604,8 @@ var LimitsBar = ({ current, max, label }) => {
13543
13604
  };
13544
13605
 
13545
13606
  // src/components/LinkList/LinkList.styles.ts
13546
- var import_react60 = require("@emotion/react");
13547
- var LinkListContainer = (padding) => import_react60.css`
13607
+ var import_react63 = require("@emotion/react");
13608
+ var LinkListContainer = (padding) => import_react63.css`
13548
13609
  padding: ${padding};
13549
13610
 
13550
13611
  ${mq("sm")} {
@@ -13554,23 +13615,23 @@ var LinkListContainer = (padding) => import_react60.css`
13554
13615
  `;
13555
13616
 
13556
13617
  // src/components/LinkList/LinkList.tsx
13557
- var import_jsx_runtime58 = require("@emotion/react/jsx-runtime");
13618
+ var import_jsx_runtime59 = require("@emotion/react/jsx-runtime");
13558
13619
  var LinkList = ({ title, padding = "var(--spacing-md)", children, ...props }) => {
13559
- return /* @__PURE__ */ (0, import_jsx_runtime58.jsxs)("div", { css: LinkListContainer(padding), ...props, children: [
13560
- /* @__PURE__ */ (0, import_jsx_runtime58.jsx)(Heading, { level: 3, children: title }),
13620
+ return /* @__PURE__ */ (0, import_jsx_runtime59.jsxs)("div", { css: LinkListContainer(padding), ...props, children: [
13621
+ /* @__PURE__ */ (0, import_jsx_runtime59.jsx)(Heading, { level: 3, children: title }),
13561
13622
  children
13562
13623
  ] });
13563
13624
  };
13564
13625
 
13565
13626
  // src/components/List/ScrollableList.tsx
13566
- var import_react62 = require("@emotion/react");
13627
+ var import_react65 = require("@emotion/react");
13567
13628
 
13568
13629
  // src/components/List/styles/ScrollableList.styles.ts
13569
- var import_react61 = require("@emotion/react");
13570
- var ScrollableListContainer = import_react61.css`
13630
+ var import_react64 = require("@emotion/react");
13631
+ var ScrollableListContainer = import_react64.css`
13571
13632
  position: relative;
13572
13633
  `;
13573
- var ScrollableListInner = import_react61.css`
13634
+ var ScrollableListInner = import_react64.css`
13574
13635
  background: var(--gray-50);
13575
13636
  border-top: 1px solid var(--gray-200);
13576
13637
  border-bottom: 1px solid var(--gray-200);
@@ -13593,28 +13654,28 @@ var ScrollableListInner = import_react61.css`
13593
13654
  `;
13594
13655
 
13595
13656
  // src/components/List/ScrollableList.tsx
13596
- var import_jsx_runtime59 = require("@emotion/react/jsx-runtime");
13657
+ var import_jsx_runtime60 = require("@emotion/react/jsx-runtime");
13597
13658
  var ScrollableList = ({ label, children, ...props }) => {
13598
- return /* @__PURE__ */ (0, import_jsx_runtime59.jsxs)("div", { css: [ScrollableListContainer, scrollbarStyles], ...props, children: [
13599
- label ? /* @__PURE__ */ (0, import_jsx_runtime59.jsx)(
13659
+ return /* @__PURE__ */ (0, import_jsx_runtime60.jsxs)("div", { css: [ScrollableListContainer, scrollbarStyles], ...props, children: [
13660
+ label ? /* @__PURE__ */ (0, import_jsx_runtime60.jsx)(
13600
13661
  "span",
13601
13662
  {
13602
- css: import_react62.css`
13663
+ css: import_react65.css`
13603
13664
  ${labelText}
13604
13665
  `,
13605
13666
  children: label
13606
13667
  }
13607
13668
  ) : null,
13608
- /* @__PURE__ */ (0, import_jsx_runtime59.jsx)("div", { css: [ScrollableListInner, scrollbarStyles], children })
13669
+ /* @__PURE__ */ (0, import_jsx_runtime60.jsx)("div", { css: [ScrollableListInner, scrollbarStyles], children })
13609
13670
  ] });
13610
13671
  };
13611
13672
 
13612
13673
  // src/components/List/ScrollableListInputItem.tsx
13613
- var import_cg12 = require("react-icons/cg");
13674
+ var import_cg13 = require("react-icons/cg");
13614
13675
 
13615
13676
  // src/components/List/styles/ScrollableListItem.styles.ts
13616
- var import_react63 = require("@emotion/react");
13617
- var ScrollableListItemContainer = import_react63.css`
13677
+ var import_react66 = require("@emotion/react");
13678
+ var ScrollableListItemContainer = import_react66.css`
13618
13679
  align-items: center;
13619
13680
  background: var(--white);
13620
13681
  border-radius: var(--rounded-base);
@@ -13623,13 +13684,13 @@ var ScrollableListItemContainer = import_react63.css`
13623
13684
  min-height: 52px;
13624
13685
  transition: border-color var(--duration-fast) var(--timing-ease-out);
13625
13686
  `;
13626
- var ScrollableListItemShadow = import_react63.css`
13687
+ var ScrollableListItemShadow = import_react66.css`
13627
13688
  box-shadow: var(--shadow-base);
13628
13689
  `;
13629
- var ScrollableListItemActive = import_react63.css`
13690
+ var ScrollableListItemActive = import_react66.css`
13630
13691
  border-color: var(--brand-secondary-3);
13631
13692
  `;
13632
- var ScrollableListItemBtn = import_react63.css`
13693
+ var ScrollableListItemBtn = import_react66.css`
13633
13694
  align-items: center;
13634
13695
  border: none;
13635
13696
  background: transparent;
@@ -13644,27 +13705,27 @@ var ScrollableListItemBtn = import_react63.css`
13644
13705
  outline: none;
13645
13706
  }
13646
13707
  `;
13647
- var ScrollableListInputLabel = import_react63.css`
13708
+ var ScrollableListInputLabel = import_react66.css`
13648
13709
  align-items: center;
13649
13710
  cursor: pointer;
13650
13711
  display: flex;
13651
13712
  padding: var(--spacing-xs) var(--spacing-base) var(--spacing-xs);
13652
13713
  flex-grow: 1;
13653
13714
  `;
13654
- var ScrollableListInputText = import_react63.css`
13715
+ var ScrollableListInputText = import_react66.css`
13655
13716
  align-items: center;
13656
13717
  display: flex;
13657
13718
  gap: var(--spacing-sm);
13658
13719
  flex-grow: 1;
13659
13720
  flex-wrap: wrap;
13660
13721
  `;
13661
- var ScrollableListHiddenInput = import_react63.css`
13722
+ var ScrollableListHiddenInput = import_react66.css`
13662
13723
  position: absolute;
13663
13724
  height: 0;
13664
13725
  width: 0;
13665
13726
  opacity: 0;
13666
13727
  `;
13667
- var ScrollableListIcon = import_react63.css`
13728
+ var ScrollableListIcon = import_react66.css`
13668
13729
  border-radius: var(--rounded-full);
13669
13730
  background: var(--brand-secondary-3);
13670
13731
  color: var(--white);
@@ -13672,12 +13733,12 @@ var ScrollableListIcon = import_react63.css`
13672
13733
  min-width: 24px;
13673
13734
  opacity: 0;
13674
13735
  `;
13675
- var ScrollableListIconVisible = import_react63.css`
13736
+ var ScrollableListIconVisible = import_react66.css`
13676
13737
  animation: ${fadeInBottom} var(--duration-fast) var(--timing-ease-out) forwards;
13677
13738
  `;
13678
13739
 
13679
13740
  // src/components/List/ScrollableListInputItem.tsx
13680
- var import_jsx_runtime60 = require("@emotion/react/jsx-runtime");
13741
+ var import_jsx_runtime61 = require("@emotion/react/jsx-runtime");
13681
13742
  var ScrollableListInputItem = ({
13682
13743
  label,
13683
13744
  icon,
@@ -13687,7 +13748,7 @@ var ScrollableListInputItem = ({
13687
13748
  labelTestId,
13688
13749
  ...props
13689
13750
  }) => {
13690
- return /* @__PURE__ */ (0, import_jsx_runtime60.jsx)(
13751
+ return /* @__PURE__ */ (0, import_jsx_runtime61.jsx)(
13691
13752
  "div",
13692
13753
  {
13693
13754
  css: [
@@ -13696,16 +13757,16 @@ var ScrollableListInputItem = ({
13696
13757
  active ? ScrollableListItemActive : void 0
13697
13758
  ],
13698
13759
  ...props,
13699
- children: /* @__PURE__ */ (0, import_jsx_runtime60.jsxs)("label", { "data-test-id": labelTestId, css: ScrollableListInputLabel, children: [
13700
- /* @__PURE__ */ (0, import_jsx_runtime60.jsxs)("span", { css: ScrollableListInputText, children: [
13760
+ children: /* @__PURE__ */ (0, import_jsx_runtime61.jsxs)("label", { "data-test-id": labelTestId, css: ScrollableListInputLabel, children: [
13761
+ /* @__PURE__ */ (0, import_jsx_runtime61.jsxs)("span", { css: ScrollableListInputText, children: [
13701
13762
  icon,
13702
13763
  label
13703
13764
  ] }),
13704
- /* @__PURE__ */ (0, import_jsx_runtime60.jsx)("div", { css: ScrollableListHiddenInput, children }),
13705
- /* @__PURE__ */ (0, import_jsx_runtime60.jsx)(
13765
+ /* @__PURE__ */ (0, import_jsx_runtime61.jsx)("div", { css: ScrollableListHiddenInput, children }),
13766
+ /* @__PURE__ */ (0, import_jsx_runtime61.jsx)(
13706
13767
  Icon,
13707
13768
  {
13708
- icon: import_cg12.CgCheck,
13769
+ icon: import_cg13.CgCheck,
13709
13770
  iconColor: "currentColor",
13710
13771
  css: [ScrollableListIcon, active ? ScrollableListIconVisible : void 0],
13711
13772
  size: 24,
@@ -13719,15 +13780,15 @@ var ScrollableListInputItem = ({
13719
13780
  };
13720
13781
 
13721
13782
  // src/components/List/ScrollableListItem.tsx
13722
- var import_cg13 = require("react-icons/cg");
13723
- var import_jsx_runtime61 = require("@emotion/react/jsx-runtime");
13783
+ var import_cg14 = require("react-icons/cg");
13784
+ var import_jsx_runtime62 = require("@emotion/react/jsx-runtime");
13724
13785
  var ScrollableListItem = ({
13725
13786
  buttonText,
13726
13787
  active,
13727
13788
  disableShadow,
13728
13789
  ...props
13729
13790
  }) => {
13730
- return /* @__PURE__ */ (0, import_jsx_runtime61.jsx)(
13791
+ return /* @__PURE__ */ (0, import_jsx_runtime62.jsx)(
13731
13792
  "div",
13732
13793
  {
13733
13794
  css: [
@@ -13735,12 +13796,12 @@ var ScrollableListItem = ({
13735
13796
  disableShadow ? void 0 : ScrollableListItemShadow,
13736
13797
  active ? ScrollableListItemActive : void 0
13737
13798
  ],
13738
- children: /* @__PURE__ */ (0, import_jsx_runtime61.jsxs)("button", { css: ScrollableListItemBtn, type: "button", ...props, children: [
13739
- /* @__PURE__ */ (0, import_jsx_runtime61.jsx)("span", { children: buttonText }),
13740
- /* @__PURE__ */ (0, import_jsx_runtime61.jsx)(
13799
+ children: /* @__PURE__ */ (0, import_jsx_runtime62.jsxs)("button", { css: ScrollableListItemBtn, type: "button", ...props, children: [
13800
+ /* @__PURE__ */ (0, import_jsx_runtime62.jsx)("span", { children: buttonText }),
13801
+ /* @__PURE__ */ (0, import_jsx_runtime62.jsx)(
13741
13802
  Icon,
13742
13803
  {
13743
- icon: import_cg13.CgCheck,
13804
+ icon: import_cg14.CgCheck,
13744
13805
  iconColor: "currentColor",
13745
13806
  css: [ScrollableListIcon, active ? ScrollableListIconVisible : void 0],
13746
13807
  size: 24
@@ -13752,8 +13813,8 @@ var ScrollableListItem = ({
13752
13813
  };
13753
13814
 
13754
13815
  // src/components/LoadingIndicator/LoadingIndicator.styles.ts
13755
- var import_react64 = require("@emotion/react");
13756
- var bounceFade = import_react64.keyframes`
13816
+ var import_react67 = require("@emotion/react");
13817
+ var bounceFade = import_react67.keyframes`
13757
13818
  0%, 100% {
13758
13819
  opacity: 1.0;
13759
13820
  transform: translateY(0);
@@ -13770,11 +13831,11 @@ var bounceFade = import_react64.keyframes`
13770
13831
  transform: translateY(-5px);
13771
13832
  }
13772
13833
  `;
13773
- var loader = import_react64.css`
13834
+ var loader = import_react67.css`
13774
13835
  display: inline-flex;
13775
13836
  justify-content: center;
13776
13837
  `;
13777
- var loadingDot = import_react64.css`
13838
+ var loadingDot = import_react67.css`
13778
13839
  background-color: var(--gray-700);
13779
13840
  display: block;
13780
13841
  border-radius: var(--rounded-full);
@@ -13798,21 +13859,21 @@ var loadingDot = import_react64.css`
13798
13859
  `;
13799
13860
 
13800
13861
  // src/components/LoadingIndicator/LoadingIndicator.tsx
13801
- var import_jsx_runtime62 = require("@emotion/react/jsx-runtime");
13862
+ var import_jsx_runtime63 = require("@emotion/react/jsx-runtime");
13802
13863
  var LoadingIndicator = ({ ...props }) => {
13803
- return /* @__PURE__ */ (0, import_jsx_runtime62.jsxs)("div", { role: "alert", css: loader, "data-test-id": "loading-indicator", ...props, children: [
13804
- /* @__PURE__ */ (0, import_jsx_runtime62.jsx)("span", { css: loadingDot }),
13805
- /* @__PURE__ */ (0, import_jsx_runtime62.jsx)("span", { css: loadingDot }),
13806
- /* @__PURE__ */ (0, import_jsx_runtime62.jsx)("span", { css: loadingDot })
13864
+ return /* @__PURE__ */ (0, import_jsx_runtime63.jsxs)("div", { role: "alert", css: loader, "data-test-id": "loading-indicator", ...props, children: [
13865
+ /* @__PURE__ */ (0, import_jsx_runtime63.jsx)("span", { css: loadingDot }),
13866
+ /* @__PURE__ */ (0, import_jsx_runtime63.jsx)("span", { css: loadingDot }),
13867
+ /* @__PURE__ */ (0, import_jsx_runtime63.jsx)("span", { css: loadingDot })
13807
13868
  ] });
13808
13869
  };
13809
13870
 
13810
13871
  // src/components/LoadingOverlay/LoadingOverlay.tsx
13811
- var import_react66 = require("react");
13872
+ var import_react69 = require("react");
13812
13873
 
13813
13874
  // src/components/LoadingOverlay/LoadingOverlay.styles.ts
13814
- var import_react65 = require("@emotion/react");
13815
- var loadingOverlayContainer = import_react65.css`
13875
+ var import_react68 = require("@emotion/react");
13876
+ var loadingOverlayContainer = import_react68.css`
13816
13877
  position: absolute;
13817
13878
  inset: 0;
13818
13879
  overflow: hidden;
@@ -13820,30 +13881,30 @@ var loadingOverlayContainer = import_react65.css`
13820
13881
  padding: var(--spacing-xl);
13821
13882
  overflow-y: auto;
13822
13883
  `;
13823
- var loadingOverlayVisible = import_react65.css`
13884
+ var loadingOverlayVisible = import_react68.css`
13824
13885
  display: flex;
13825
13886
  `;
13826
- var loadingOverlayHidden = import_react65.css`
13887
+ var loadingOverlayHidden = import_react68.css`
13827
13888
  display: none;
13828
13889
  `;
13829
- var loadingOverlayBackground = (bgColor) => import_react65.css`
13890
+ var loadingOverlayBackground = (bgColor) => import_react68.css`
13830
13891
  background: ${bgColor};
13831
13892
  opacity: 0.92;
13832
13893
  position: absolute;
13833
13894
  inset: 0 0;
13834
13895
  `;
13835
- var loadingOverlayBody = import_react65.css`
13896
+ var loadingOverlayBody = import_react68.css`
13836
13897
  align-items: center;
13837
13898
  display: flex;
13838
13899
  flex-direction: column;
13839
13900
  `;
13840
- var loadingOverlayMessage = import_react65.css`
13901
+ var loadingOverlayMessage = import_react68.css`
13841
13902
  color: var(--gray-600);
13842
13903
  margin: var(--spacing-base) 0 0;
13843
13904
  `;
13844
13905
 
13845
13906
  // src/components/LoadingOverlay/LoadingOverlay.tsx
13846
- var import_jsx_runtime63 = require("@emotion/react/jsx-runtime");
13907
+ var import_jsx_runtime64 = require("@emotion/react/jsx-runtime");
13847
13908
  var LoadingOverlay = ({
13848
13909
  isActive,
13849
13910
  statusMessage,
@@ -13854,14 +13915,14 @@ var LoadingOverlay = ({
13854
13915
  isPaused = false,
13855
13916
  children
13856
13917
  }) => {
13857
- const lottieRef = (0, import_react66.useRef)(null);
13858
- const onLoopComplete = (0, import_react66.useCallback)(() => {
13918
+ const lottieRef = (0, import_react69.useRef)(null);
13919
+ const onLoopComplete = (0, import_react69.useCallback)(() => {
13859
13920
  var _a, _b, _c;
13860
13921
  if (isPaused && !((_b = (_a = lottieRef.current) == null ? void 0 : _a.animationItem) == null ? void 0 : _b.isPaused)) {
13861
13922
  (_c = lottieRef.current) == null ? void 0 : _c.stop();
13862
13923
  }
13863
13924
  }, [isPaused]);
13864
- (0, import_react66.useEffect)(() => {
13925
+ (0, import_react69.useEffect)(() => {
13865
13926
  var _a, _b, _c, _d, _e, _f;
13866
13927
  if (!isPaused && ((_b = (_a = lottieRef.current) == null ? void 0 : _a.animationItem) == null ? void 0 : _b.isPaused)) {
13867
13928
  (_c = lottieRef.current) == null ? void 0 : _c.play();
@@ -13869,7 +13930,7 @@ var LoadingOverlay = ({
13869
13930
  (_f = lottieRef.current) == null ? void 0 : _f.stop();
13870
13931
  }
13871
13932
  }, [isPaused]);
13872
- return /* @__PURE__ */ (0, import_jsx_runtime63.jsxs)(
13933
+ return /* @__PURE__ */ (0, import_jsx_runtime64.jsxs)(
13873
13934
  "div",
13874
13935
  {
13875
13936
  role: "alert",
@@ -13877,9 +13938,9 @@ var LoadingOverlay = ({
13877
13938
  "aria-hidden": !isActive,
13878
13939
  "aria-busy": isActive && !isPaused,
13879
13940
  children: [
13880
- /* @__PURE__ */ (0, import_jsx_runtime63.jsx)("div", { css: loadingOverlayBackground(overlayBackgroundColor) }),
13881
- /* @__PURE__ */ (0, import_jsx_runtime63.jsx)("div", { css: { position: "relative", maxWidth: "100%", margin: isTopAligned ? "0" : "auto" }, children: /* @__PURE__ */ (0, import_jsx_runtime63.jsxs)("div", { css: loadingOverlayBody, children: [
13882
- /* @__PURE__ */ (0, import_jsx_runtime63.jsx)(
13941
+ /* @__PURE__ */ (0, import_jsx_runtime64.jsx)("div", { css: loadingOverlayBackground(overlayBackgroundColor) }),
13942
+ /* @__PURE__ */ (0, import_jsx_runtime64.jsx)("div", { css: { position: "relative", maxWidth: "100%", margin: isTopAligned ? "0" : "auto" }, children: /* @__PURE__ */ (0, import_jsx_runtime64.jsxs)("div", { css: loadingOverlayBody, children: [
13943
+ /* @__PURE__ */ (0, import_jsx_runtime64.jsx)(
13883
13944
  AnimationFile,
13884
13945
  {
13885
13946
  lottieRef,
@@ -13894,15 +13955,15 @@ var LoadingOverlay = ({
13894
13955
  }
13895
13956
  }
13896
13957
  ),
13897
- statusMessage ? /* @__PURE__ */ (0, import_jsx_runtime63.jsx)("div", { css: loadingOverlayMessage, children: statusMessage }) : null,
13898
- /* @__PURE__ */ (0, import_jsx_runtime63.jsx)("div", { css: { width: "100%", marginTop: "var(--spacing-md)" }, children })
13958
+ statusMessage ? /* @__PURE__ */ (0, import_jsx_runtime64.jsx)("div", { css: loadingOverlayMessage, children: statusMessage }) : null,
13959
+ /* @__PURE__ */ (0, import_jsx_runtime64.jsx)("div", { css: { width: "100%", marginTop: "var(--spacing-md)" }, children })
13899
13960
  ] }) })
13900
13961
  ]
13901
13962
  }
13902
13963
  );
13903
13964
  };
13904
13965
  var LoadingIcon = ({ height, width, ...props }) => {
13905
- return /* @__PURE__ */ (0, import_jsx_runtime63.jsx)(
13966
+ return /* @__PURE__ */ (0, import_jsx_runtime64.jsx)(
13906
13967
  "svg",
13907
13968
  {
13908
13969
  "data-testid": "svg",
@@ -13913,9 +13974,9 @@ var LoadingIcon = ({ height, width, ...props }) => {
13913
13974
  stroke: "currentColor",
13914
13975
  ...props,
13915
13976
  "data-test-id": "loading-icon",
13916
- children: /* @__PURE__ */ (0, import_jsx_runtime63.jsx)("g", { fill: "none", fillRule: "evenodd", children: /* @__PURE__ */ (0, import_jsx_runtime63.jsxs)("g", { transform: "translate(1 1)", strokeWidth: "2", children: [
13917
- /* @__PURE__ */ (0, import_jsx_runtime63.jsx)("circle", { strokeOpacity: ".25", cx: "18", cy: "18", r: "18" }),
13918
- /* @__PURE__ */ (0, import_jsx_runtime63.jsx)("path", { d: "M36 18c0-9.94-8.06-18-18-18", transform: "rotate(166.645 18 18)", children: /* @__PURE__ */ (0, import_jsx_runtime63.jsx)(
13977
+ children: /* @__PURE__ */ (0, import_jsx_runtime64.jsx)("g", { fill: "none", fillRule: "evenodd", children: /* @__PURE__ */ (0, import_jsx_runtime64.jsxs)("g", { transform: "translate(1 1)", strokeWidth: "2", children: [
13978
+ /* @__PURE__ */ (0, import_jsx_runtime64.jsx)("circle", { strokeOpacity: ".25", cx: "18", cy: "18", r: "18" }),
13979
+ /* @__PURE__ */ (0, import_jsx_runtime64.jsx)("path", { d: "M36 18c0-9.94-8.06-18-18-18", transform: "rotate(166.645 18 18)", children: /* @__PURE__ */ (0, import_jsx_runtime64.jsx)(
13919
13980
  "animateTransform",
13920
13981
  {
13921
13982
  attributeName: "transform",
@@ -13932,12 +13993,12 @@ var LoadingIcon = ({ height, width, ...props }) => {
13932
13993
  };
13933
13994
 
13934
13995
  // src/components/Tiles/CreateTeamIntegrationTile.tsx
13935
- var import_react68 = require("@emotion/react");
13936
- var import_cg14 = require("react-icons/cg");
13996
+ var import_react71 = require("@emotion/react");
13997
+ var import_cg15 = require("react-icons/cg");
13937
13998
 
13938
13999
  // src/components/Tiles/styles/IntegrationTile.styles.ts
13939
- var import_react67 = require("@emotion/react");
13940
- var IntegrationTileContainer = import_react67.css`
14000
+ var import_react70 = require("@emotion/react");
14001
+ var IntegrationTileContainer = import_react70.css`
13941
14002
  align-items: center;
13942
14003
  box-sizing: border-box;
13943
14004
  border-radius: var(--rounded-base);
@@ -13968,22 +14029,22 @@ var IntegrationTileContainer = import_react67.css`
13968
14029
  }
13969
14030
  }
13970
14031
  `;
13971
- var IntegrationTileBtnDashedBorder = import_react67.css`
14032
+ var IntegrationTileBtnDashedBorder = import_react70.css`
13972
14033
  border: 1px dashed var(--brand-secondary-1);
13973
14034
  `;
13974
- var IntegrationTileTitle = import_react67.css`
14035
+ var IntegrationTileTitle = import_react70.css`
13975
14036
  display: block;
13976
14037
  font-weight: var(--fw-bold);
13977
14038
  margin: 0 0 var(--spacing-base);
13978
14039
  max-width: 13rem;
13979
14040
  `;
13980
- var IntegrationTitleLogo = import_react67.css`
14041
+ var IntegrationTitleLogo = import_react70.css`
13981
14042
  display: block;
13982
14043
  max-width: 10rem;
13983
14044
  max-height: 4rem;
13984
14045
  margin: 0 auto;
13985
14046
  `;
13986
- var IntegrationTileName = import_react67.css`
14047
+ var IntegrationTileName = import_react70.css`
13987
14048
  color: var(--gray-500);
13988
14049
  display: -webkit-box;
13989
14050
  -webkit-line-clamp: 1;
@@ -13996,7 +14057,7 @@ var IntegrationTileName = import_react67.css`
13996
14057
  position: absolute;
13997
14058
  bottom: calc(var(--spacing-base) * 3.8);
13998
14059
  `;
13999
- var IntegrationAddedText = import_react67.css`
14060
+ var IntegrationAddedText = import_react70.css`
14000
14061
  align-items: center;
14001
14062
  background: var(--brand-secondary-3);
14002
14063
  border-radius: 0 var(--rounded-md) 0 var(--rounded-md);
@@ -14011,7 +14072,7 @@ var IntegrationAddedText = import_react67.css`
14011
14072
  top: 0;
14012
14073
  right: 0;
14013
14074
  `;
14014
- var IntegrationCustomBadgeText = (theme) => import_react67.css`
14075
+ var IntegrationCustomBadgeText = (theme) => import_react70.css`
14015
14076
  align-items: center;
14016
14077
  border-radius: var(--rounded-sm) 0 var(--rounded-sm) 0;
14017
14078
  background: ${theme === "gray" ? "var(--brand-secondary-2)" : "var(--brand-secondary-1)"};
@@ -14025,26 +14086,26 @@ var IntegrationCustomBadgeText = (theme) => import_react67.css`
14025
14086
  top: 0;
14026
14087
  left: 0;
14027
14088
  `;
14028
- var IntegrationAuthorBadgeIcon = import_react67.css`
14089
+ var IntegrationAuthorBadgeIcon = import_react70.css`
14029
14090
  position: absolute;
14030
14091
  bottom: var(--spacing-sm);
14031
14092
  right: var(--spacing-xs);
14032
14093
  max-height: 1rem;
14033
14094
  `;
14034
- var IntegrationTitleFakeButton = import_react67.css`
14095
+ var IntegrationTitleFakeButton = import_react70.css`
14035
14096
  font-size: var(--fs-xs);
14036
14097
  gap: var(--spacing-sm);
14037
14098
  padding: var(--spacing-sm) var(--spacing-base);
14038
14099
  text-transform: uppercase;
14039
14100
  `;
14040
- var IntegrationTileFloatingButton = import_react67.css`
14101
+ var IntegrationTileFloatingButton = import_react70.css`
14041
14102
  position: absolute;
14042
14103
  bottom: var(--spacing-base);
14043
14104
  gap: var(--spacing-sm);
14044
14105
  font-size: var(--fs-xs);
14045
14106
  overflow: hidden;
14046
14107
  `;
14047
- var IntegrationTileFloatingButtonMessage = (clicked) => import_react67.css`
14108
+ var IntegrationTileFloatingButtonMessage = (clicked) => import_react70.css`
14048
14109
  strong,
14049
14110
  span:first-of-type {
14050
14111
  transition: opacity var(--duration-fast) var(--timing-ease-out);
@@ -14065,7 +14126,7 @@ var IntegrationTileFloatingButtonMessage = (clicked) => import_react67.css`
14065
14126
  `;
14066
14127
 
14067
14128
  // src/components/Tiles/CreateTeamIntegrationTile.tsx
14068
- var import_jsx_runtime64 = require("@emotion/react/jsx-runtime");
14129
+ var import_jsx_runtime65 = require("@emotion/react/jsx-runtime");
14069
14130
  var CreateTeamIntegrationTile = ({
14070
14131
  title = "Create a custom integration for your team",
14071
14132
  buttonText = "Add Integration",
@@ -14073,9 +14134,9 @@ var CreateTeamIntegrationTile = ({
14073
14134
  asDeepLink = false,
14074
14135
  ...props
14075
14136
  }) => {
14076
- return /* @__PURE__ */ (0, import_jsx_runtime64.jsxs)("div", { css: [IntegrationTileContainer, IntegrationTileBtnDashedBorder], ...props, children: [
14077
- /* @__PURE__ */ (0, import_jsx_runtime64.jsx)("span", { css: IntegrationTileTitle, title, children: title }),
14078
- /* @__PURE__ */ (0, import_jsx_runtime64.jsxs)(
14137
+ return /* @__PURE__ */ (0, import_jsx_runtime65.jsxs)("div", { css: [IntegrationTileContainer, IntegrationTileBtnDashedBorder], ...props, children: [
14138
+ /* @__PURE__ */ (0, import_jsx_runtime65.jsx)("span", { css: IntegrationTileTitle, title, children: title }),
14139
+ /* @__PURE__ */ (0, import_jsx_runtime65.jsxs)(
14079
14140
  Button,
14080
14141
  {
14081
14142
  buttonType: "tertiary",
@@ -14085,23 +14146,23 @@ var CreateTeamIntegrationTile = ({
14085
14146
  css: IntegrationTitleFakeButton,
14086
14147
  children: [
14087
14148
  buttonText,
14088
- asDeepLink ? /* @__PURE__ */ (0, import_jsx_runtime64.jsx)(
14149
+ asDeepLink ? /* @__PURE__ */ (0, import_jsx_runtime65.jsx)(
14089
14150
  Icon,
14090
14151
  {
14091
- icon: import_cg14.CgChevronRight,
14152
+ icon: import_cg15.CgChevronRight,
14092
14153
  iconColor: "currentColor",
14093
14154
  size: 20,
14094
- css: import_react68.css`
14155
+ css: import_react71.css`
14095
14156
  order: 1;
14096
14157
  `
14097
14158
  }
14098
- ) : /* @__PURE__ */ (0, import_jsx_runtime64.jsx)(
14159
+ ) : /* @__PURE__ */ (0, import_jsx_runtime65.jsx)(
14099
14160
  Icon,
14100
14161
  {
14101
- icon: import_cg14.CgAdd,
14162
+ icon: import_cg15.CgAdd,
14102
14163
  iconColor: "currentColor",
14103
14164
  size: 16,
14104
- css: import_react68.css`
14165
+ css: import_react71.css`
14105
14166
  order: -1;
14106
14167
  `
14107
14168
  }
@@ -14113,32 +14174,32 @@ var CreateTeamIntegrationTile = ({
14113
14174
  };
14114
14175
 
14115
14176
  // src/components/Tiles/IntegrationBadges.tsx
14116
- var import_cg15 = require("react-icons/cg");
14117
- var import_jsx_runtime65 = require("@emotion/react/jsx-runtime");
14177
+ var import_cg16 = require("react-icons/cg");
14178
+ var import_jsx_runtime66 = require("@emotion/react/jsx-runtime");
14118
14179
  var IntegrationedAddedBadge = ({ text = "Added" }) => {
14119
- return /* @__PURE__ */ (0, import_jsx_runtime65.jsxs)("span", { "data-testid": "integration-icon-installed", css: IntegrationAddedText, children: [
14120
- /* @__PURE__ */ (0, import_jsx_runtime65.jsx)(Icon, { icon: import_cg15.CgCheck, iconColor: "currentColor" }),
14180
+ return /* @__PURE__ */ (0, import_jsx_runtime66.jsxs)("span", { "data-testid": "integration-icon-installed", css: IntegrationAddedText, children: [
14181
+ /* @__PURE__ */ (0, import_jsx_runtime66.jsx)(Icon, { icon: import_cg16.CgCheck, iconColor: "currentColor" }),
14121
14182
  text
14122
14183
  ] });
14123
14184
  };
14124
14185
  var IntegrationCustomBadge = ({ text = "Custom" }) => {
14125
- return /* @__PURE__ */ (0, import_jsx_runtime65.jsx)("span", { "data-testid": "integration-is-private", css: IntegrationCustomBadgeText("gray"), children: text });
14186
+ return /* @__PURE__ */ (0, import_jsx_runtime66.jsx)("span", { "data-testid": "integration-is-private", css: IntegrationCustomBadgeText("gray"), children: text });
14126
14187
  };
14127
14188
  var IntegrationPremiumBadge = ({ text = "Premium" }) => {
14128
- return /* @__PURE__ */ (0, import_jsx_runtime65.jsxs)("span", { css: IntegrationCustomBadgeText("blue"), children: [
14129
- /* @__PURE__ */ (0, import_jsx_runtime65.jsx)(Icon, { icon: import_cg15.CgLock, iconColor: "currentColor", size: 12 }),
14189
+ return /* @__PURE__ */ (0, import_jsx_runtime66.jsxs)("span", { css: IntegrationCustomBadgeText("blue"), children: [
14190
+ /* @__PURE__ */ (0, import_jsx_runtime66.jsx)(Icon, { icon: import_cg16.CgLock, iconColor: "currentColor", size: 12 }),
14130
14191
  text
14131
14192
  ] });
14132
14193
  };
14133
14194
  var IntegrationComingSoonBadge = ({ text = "Coming soon" }) => {
14134
- return /* @__PURE__ */ (0, import_jsx_runtime65.jsxs)("span", { css: IntegrationCustomBadgeText("blue"), children: [
14135
- /* @__PURE__ */ (0, import_jsx_runtime65.jsx)(Icon, { icon: import_cg15.CgSandClock, iconColor: "currentColor", size: 12 }),
14195
+ return /* @__PURE__ */ (0, import_jsx_runtime66.jsxs)("span", { css: IntegrationCustomBadgeText("blue"), children: [
14196
+ /* @__PURE__ */ (0, import_jsx_runtime66.jsx)(Icon, { icon: import_cg16.CgSandClock, iconColor: "currentColor", size: 12 }),
14136
14197
  text
14137
14198
  ] });
14138
14199
  };
14139
14200
 
14140
14201
  // src/components/Tiles/ResolveIcon.tsx
14141
- var import_jsx_runtime66 = require("@emotion/react/jsx-runtime");
14202
+ var import_jsx_runtime67 = require("@emotion/react/jsx-runtime");
14142
14203
  var ResolveIcon = ({ icon, name, styleType = "logo", ...props }) => {
14143
14204
  const CompIcon = icon && typeof icon !== "string" ? icon : null;
14144
14205
  const mapClassName = {
@@ -14146,13 +14207,13 @@ var ResolveIcon = ({ icon, name, styleType = "logo", ...props }) => {
14146
14207
  logo: IntegrationTitleLogo
14147
14208
  };
14148
14209
  if (icon) {
14149
- return CompIcon ? /* @__PURE__ */ (0, import_jsx_runtime66.jsx)(CompIcon, { css: mapClassName[styleType], ...props }) : /* @__PURE__ */ (0, import_jsx_runtime66.jsx)("img", { src: icon, alt: name, css: mapClassName[styleType], ...props });
14210
+ return CompIcon ? /* @__PURE__ */ (0, import_jsx_runtime67.jsx)(CompIcon, { css: mapClassName[styleType], ...props }) : /* @__PURE__ */ (0, import_jsx_runtime67.jsx)("img", { src: icon, alt: name, css: mapClassName[styleType], ...props });
14150
14211
  }
14151
14212
  return null;
14152
14213
  };
14153
14214
 
14154
14215
  // src/components/Tiles/EditTeamIntegrationTile.tsx
14155
- var import_jsx_runtime67 = require("@emotion/react/jsx-runtime");
14216
+ var import_jsx_runtime68 = require("@emotion/react/jsx-runtime");
14156
14217
  var EditTeamIntegrationTile = ({
14157
14218
  id,
14158
14219
  icon,
@@ -14161,17 +14222,17 @@ var EditTeamIntegrationTile = ({
14161
14222
  isPublic,
14162
14223
  canEdit = false
14163
14224
  }) => {
14164
- return /* @__PURE__ */ (0, import_jsx_runtime67.jsxs)(
14225
+ return /* @__PURE__ */ (0, import_jsx_runtime68.jsxs)(
14165
14226
  "div",
14166
14227
  {
14167
14228
  css: IntegrationTileContainer,
14168
14229
  "data-testid": "configure-integration-container",
14169
14230
  "integration-id": `${id.toLocaleLowerCase()}`,
14170
14231
  children: [
14171
- /* @__PURE__ */ (0, import_jsx_runtime67.jsx)(ResolveIcon, { icon, name, "data-test-id": "integration-logo" }),
14172
- /* @__PURE__ */ (0, import_jsx_runtime67.jsx)("span", { css: IntegrationTileName, "data-test-id": "integration-card-name", children: name }),
14173
- !isPublic ? /* @__PURE__ */ (0, import_jsx_runtime67.jsx)(IntegrationCustomBadge, {}) : null,
14174
- canEdit ? /* @__PURE__ */ (0, import_jsx_runtime67.jsx)(
14232
+ /* @__PURE__ */ (0, import_jsx_runtime68.jsx)(ResolveIcon, { icon, name, "data-test-id": "integration-logo" }),
14233
+ /* @__PURE__ */ (0, import_jsx_runtime68.jsx)("span", { css: IntegrationTileName, "data-test-id": "integration-card-name", children: name }),
14234
+ !isPublic ? /* @__PURE__ */ (0, import_jsx_runtime68.jsx)(IntegrationCustomBadge, {}) : null,
14235
+ canEdit ? /* @__PURE__ */ (0, import_jsx_runtime68.jsx)(
14175
14236
  Button,
14176
14237
  {
14177
14238
  buttonType: "unimportant",
@@ -14189,10 +14250,10 @@ var EditTeamIntegrationTile = ({
14189
14250
  };
14190
14251
 
14191
14252
  // src/components/Tiles/IntegrationComingSoon.tsx
14192
- var import_react69 = require("@emotion/react");
14193
- var import_react70 = require("react");
14194
- var import_cg16 = require("react-icons/cg");
14195
- var import_jsx_runtime68 = require("@emotion/react/jsx-runtime");
14253
+ var import_react72 = require("@emotion/react");
14254
+ var import_react73 = require("react");
14255
+ var import_cg17 = require("react-icons/cg");
14256
+ var import_jsx_runtime69 = require("@emotion/react/jsx-runtime");
14196
14257
  var IntegrationComingSoon = ({
14197
14258
  name,
14198
14259
  icon,
@@ -14201,12 +14262,12 @@ var IntegrationComingSoon = ({
14201
14262
  timing = 1e3,
14202
14263
  ...props
14203
14264
  }) => {
14204
- const [upVote, setUpVote] = (0, import_react70.useState)(false);
14265
+ const [upVote, setUpVote] = (0, import_react73.useState)(false);
14205
14266
  const handleUpVoteInteraction = () => {
14206
14267
  setUpVote((prev) => !prev);
14207
14268
  onUpVoteClick();
14208
14269
  };
14209
- (0, import_react70.useEffect)(() => {
14270
+ (0, import_react73.useEffect)(() => {
14210
14271
  if (upVote) {
14211
14272
  const timer = setTimeout(() => setUpVote(false), timing);
14212
14273
  return () => {
@@ -14214,17 +14275,17 @@ var IntegrationComingSoon = ({
14214
14275
  };
14215
14276
  }
14216
14277
  }, [upVote, setUpVote, timing]);
14217
- return /* @__PURE__ */ (0, import_jsx_runtime68.jsxs)(
14278
+ return /* @__PURE__ */ (0, import_jsx_runtime69.jsxs)(
14218
14279
  "div",
14219
14280
  {
14220
14281
  css: IntegrationTileContainer,
14221
14282
  "data-testid": `coming-soon-${id.toLowerCase()}-integration`,
14222
14283
  ...props,
14223
14284
  children: [
14224
- /* @__PURE__ */ (0, import_jsx_runtime68.jsx)(IntegrationComingSoonBadge, {}),
14225
- /* @__PURE__ */ (0, import_jsx_runtime68.jsx)(ResolveIcon, { icon, name }),
14226
- /* @__PURE__ */ (0, import_jsx_runtime68.jsx)("span", { css: IntegrationTileName, title: name, children: name }),
14227
- /* @__PURE__ */ (0, import_jsx_runtime68.jsxs)(
14285
+ /* @__PURE__ */ (0, import_jsx_runtime69.jsx)(IntegrationComingSoonBadge, {}),
14286
+ /* @__PURE__ */ (0, import_jsx_runtime69.jsx)(ResolveIcon, { icon, name }),
14287
+ /* @__PURE__ */ (0, import_jsx_runtime69.jsx)("span", { css: IntegrationTileName, title: name, children: name }),
14288
+ /* @__PURE__ */ (0, import_jsx_runtime69.jsxs)(
14228
14289
  Button,
14229
14290
  {
14230
14291
  buttonType: "unimportant",
@@ -14234,19 +14295,19 @@ var IntegrationComingSoon = ({
14234
14295
  role: "link",
14235
14296
  css: [IntegrationTileFloatingButton, IntegrationTileFloatingButtonMessage(upVote)],
14236
14297
  children: [
14237
- /* @__PURE__ */ (0, import_jsx_runtime68.jsx)("strong", { children: "+1" }),
14238
- /* @__PURE__ */ (0, import_jsx_runtime68.jsx)(
14298
+ /* @__PURE__ */ (0, import_jsx_runtime69.jsx)("strong", { children: "+1" }),
14299
+ /* @__PURE__ */ (0, import_jsx_runtime69.jsx)(
14239
14300
  "span",
14240
14301
  {
14241
- css: import_react69.css`
14302
+ css: import_react72.css`
14242
14303
  text-transform: uppercase;
14243
14304
  color: var(--gray-500);
14244
14305
  `,
14245
14306
  children: "(I want this)"
14246
14307
  }
14247
14308
  ),
14248
- /* @__PURE__ */ (0, import_jsx_runtime68.jsxs)("span", { "aria-hidden": !upVote, children: [
14249
- /* @__PURE__ */ (0, import_jsx_runtime68.jsx)(Icon, { icon: import_cg16.CgHeart, iconColor: "currentColor", size: 18 }),
14309
+ /* @__PURE__ */ (0, import_jsx_runtime69.jsxs)("span", { "aria-hidden": !upVote, children: [
14310
+ /* @__PURE__ */ (0, import_jsx_runtime69.jsx)(Icon, { icon: import_cg17.CgHeart, iconColor: "currentColor", size: 18 }),
14250
14311
  "Thanks!"
14251
14312
  ] })
14252
14313
  ]
@@ -14258,8 +14319,8 @@ var IntegrationComingSoon = ({
14258
14319
  };
14259
14320
 
14260
14321
  // src/components/Tiles/styles/IntegrationLoadingTile.styles.ts
14261
- var import_react71 = require("@emotion/react");
14262
- var IntegrationLoadingTileContainer = import_react71.css`
14322
+ var import_react74 = require("@emotion/react");
14323
+ var IntegrationLoadingTileContainer = import_react74.css`
14263
14324
  align-items: center;
14264
14325
  box-sizing: border-box;
14265
14326
  border-radius: var(--rounded-base);
@@ -14286,39 +14347,39 @@ var IntegrationLoadingTileContainer = import_react71.css`
14286
14347
  }
14287
14348
  }
14288
14349
  `;
14289
- var IntegrationLoadingTileImg = import_react71.css`
14350
+ var IntegrationLoadingTileImg = import_react74.css`
14290
14351
  width: 10rem;
14291
14352
  height: 4rem;
14292
14353
  margin: 0 auto;
14293
14354
  `;
14294
- var IntegrationLoadingTileText = import_react71.css`
14355
+ var IntegrationLoadingTileText = import_react74.css`
14295
14356
  width: 5rem;
14296
14357
  height: var(--spacing-sm);
14297
14358
  margin: var(--spacing-sm) 0;
14298
14359
  `;
14299
- var IntegrationLoadingFrame = import_react71.css`
14360
+ var IntegrationLoadingFrame = import_react74.css`
14300
14361
  animation: ${skeletonLoading} 1s linear infinite alternate;
14301
14362
  border-radius: var(--rounded-base);
14302
14363
  `;
14303
14364
 
14304
14365
  // src/components/Tiles/IntegrationLoadingTile.tsx
14305
- var import_jsx_runtime69 = require("@emotion/react/jsx-runtime");
14366
+ var import_jsx_runtime70 = require("@emotion/react/jsx-runtime");
14306
14367
  var IntegrationLoadingTile = ({ count = 1 }) => {
14307
14368
  const componentCount = Array.from(Array(count).keys());
14308
- return /* @__PURE__ */ (0, import_jsx_runtime69.jsx)(import_jsx_runtime69.Fragment, { children: componentCount.map((i) => /* @__PURE__ */ (0, import_jsx_runtime69.jsxs)("div", { css: IntegrationLoadingTileContainer, children: [
14309
- /* @__PURE__ */ (0, import_jsx_runtime69.jsx)("div", { css: [IntegrationLoadingTileImg, IntegrationLoadingFrame], role: "presentation" }),
14310
- /* @__PURE__ */ (0, import_jsx_runtime69.jsx)("div", { css: [IntegrationLoadingTileText, IntegrationLoadingFrame] })
14369
+ return /* @__PURE__ */ (0, import_jsx_runtime70.jsx)(import_jsx_runtime70.Fragment, { children: componentCount.map((i) => /* @__PURE__ */ (0, import_jsx_runtime70.jsxs)("div", { css: IntegrationLoadingTileContainer, children: [
14370
+ /* @__PURE__ */ (0, import_jsx_runtime70.jsx)("div", { css: [IntegrationLoadingTileImg, IntegrationLoadingFrame], role: "presentation" }),
14371
+ /* @__PURE__ */ (0, import_jsx_runtime70.jsx)("div", { css: [IntegrationLoadingTileText, IntegrationLoadingFrame] })
14311
14372
  ] }, i)) });
14312
14373
  };
14313
14374
 
14314
14375
  // src/components/Tiles/styles/IntegrationModalIcon.styles.ts
14315
- var import_react72 = require("@emotion/react");
14316
- var IntegrationModalIconContainer = import_react72.css`
14376
+ var import_react75 = require("@emotion/react");
14377
+ var IntegrationModalIconContainer = import_react75.css`
14317
14378
  position: relative;
14318
14379
  width: 50px;
14319
14380
  margin-bottom: var(--spacing-base);
14320
14381
  `;
14321
- var IntegrationModalImage = import_react72.css`
14382
+ var IntegrationModalImage = import_react75.css`
14322
14383
  position: absolute;
14323
14384
  inset: 0;
14324
14385
  margin: auto;
@@ -14327,7 +14388,7 @@ var IntegrationModalImage = import_react72.css`
14327
14388
  `;
14328
14389
 
14329
14390
  // src/components/Tiles/IntegrationModalIcon.tsx
14330
- var import_jsx_runtime70 = require("@emotion/react/jsx-runtime");
14391
+ var import_jsx_runtime71 = require("@emotion/react/jsx-runtime");
14331
14392
  var IntegrationModalIcon = ({ icon, name, ...imgProps }) => {
14332
14393
  const CompIcon = icon && typeof icon !== "string" ? icon : null;
14333
14394
  let iconSrc = void 0;
@@ -14343,9 +14404,9 @@ var IntegrationModalIcon = ({ icon, name, ...imgProps }) => {
14343
14404
  }
14344
14405
  }
14345
14406
  }
14346
- return /* @__PURE__ */ (0, import_jsx_runtime70.jsxs)("div", { css: IntegrationModalIconContainer, children: [
14347
- /* @__PURE__ */ (0, import_jsx_runtime70.jsxs)("svg", { width: "49", height: "57", fill: "none", xmlns: "http://www.w3.org/2000/svg", role: "img", children: [
14348
- /* @__PURE__ */ (0, import_jsx_runtime70.jsx)(
14407
+ return /* @__PURE__ */ (0, import_jsx_runtime71.jsxs)("div", { css: IntegrationModalIconContainer, children: [
14408
+ /* @__PURE__ */ (0, import_jsx_runtime71.jsxs)("svg", { width: "49", height: "57", fill: "none", xmlns: "http://www.w3.org/2000/svg", role: "img", children: [
14409
+ /* @__PURE__ */ (0, import_jsx_runtime71.jsx)(
14349
14410
  "path",
14350
14411
  {
14351
14412
  d: "m24.367 1.813 22.786 13.322V41.78L24.367 55.102 1.581 41.78V15.135L24.367 1.814Z",
@@ -14354,12 +14415,12 @@ var IntegrationModalIcon = ({ icon, name, ...imgProps }) => {
14354
14415
  strokeWidth: "2"
14355
14416
  }
14356
14417
  ),
14357
- /* @__PURE__ */ (0, import_jsx_runtime70.jsx)("defs", { children: /* @__PURE__ */ (0, import_jsx_runtime70.jsxs)("linearGradient", { id: "a", x1: "41.353", y1: "49.107", x2: "8.048", y2: "4.478", gradientUnits: "userSpaceOnUse", children: [
14358
- /* @__PURE__ */ (0, import_jsx_runtime70.jsx)("stop", { stopColor: "#1768B2" }),
14359
- /* @__PURE__ */ (0, import_jsx_runtime70.jsx)("stop", { offset: "1", stopColor: "#B3EFE4" })
14418
+ /* @__PURE__ */ (0, import_jsx_runtime71.jsx)("defs", { children: /* @__PURE__ */ (0, import_jsx_runtime71.jsxs)("linearGradient", { id: "a", x1: "41.353", y1: "49.107", x2: "8.048", y2: "4.478", gradientUnits: "userSpaceOnUse", children: [
14419
+ /* @__PURE__ */ (0, import_jsx_runtime71.jsx)("stop", { stopColor: "#1768B2" }),
14420
+ /* @__PURE__ */ (0, import_jsx_runtime71.jsx)("stop", { offset: "1", stopColor: "#B3EFE4" })
14360
14421
  ] }) })
14361
14422
  ] }),
14362
- CompIcon ? /* @__PURE__ */ (0, import_jsx_runtime70.jsx)(CompIcon, { role: "img", css: IntegrationModalImage, ...imgProps }) : iconSrc ? /* @__PURE__ */ (0, import_jsx_runtime70.jsx)(
14423
+ CompIcon ? /* @__PURE__ */ (0, import_jsx_runtime71.jsx)(CompIcon, { role: "img", css: IntegrationModalImage, ...imgProps }) : iconSrc ? /* @__PURE__ */ (0, import_jsx_runtime71.jsx)(
14363
14424
  "img",
14364
14425
  {
14365
14426
  src: iconSrc,
@@ -14373,7 +14434,7 @@ var IntegrationModalIcon = ({ icon, name, ...imgProps }) => {
14373
14434
  };
14374
14435
 
14375
14436
  // src/components/Tiles/IntegrationTile.tsx
14376
- var import_jsx_runtime71 = require("@emotion/react/jsx-runtime");
14437
+ var import_jsx_runtime72 = require("@emotion/react/jsx-runtime");
14377
14438
  var IntegrationTile = ({
14378
14439
  id,
14379
14440
  icon,
@@ -14385,7 +14446,7 @@ var IntegrationTile = ({
14385
14446
  authorIcon,
14386
14447
  ...btnProps
14387
14448
  }) => {
14388
- return /* @__PURE__ */ (0, import_jsx_runtime71.jsxs)(
14449
+ return /* @__PURE__ */ (0, import_jsx_runtime72.jsxs)(
14389
14450
  "button",
14390
14451
  {
14391
14452
  type: "button",
@@ -14395,70 +14456,70 @@ var IntegrationTile = ({
14395
14456
  "aria-label": name,
14396
14457
  ...btnProps,
14397
14458
  children: [
14398
- /* @__PURE__ */ (0, import_jsx_runtime71.jsx)(ResolveIcon, { icon, name }),
14399
- /* @__PURE__ */ (0, import_jsx_runtime71.jsx)("span", { css: IntegrationTileName, title: name, children: name }),
14400
- isInstalled ? /* @__PURE__ */ (0, import_jsx_runtime71.jsx)(IntegrationedAddedBadge, {}) : null,
14401
- requiedEntitlement && isPublic ? /* @__PURE__ */ (0, import_jsx_runtime71.jsx)(IntegrationPremiumBadge, {}) : null,
14402
- !isPublic ? /* @__PURE__ */ (0, import_jsx_runtime71.jsx)(IntegrationCustomBadge, {}) : null,
14403
- authorIcon ? /* @__PURE__ */ (0, import_jsx_runtime71.jsx)(ResolveIcon, { icon: authorIcon, name }) : null
14459
+ /* @__PURE__ */ (0, import_jsx_runtime72.jsx)(ResolveIcon, { icon, name }),
14460
+ /* @__PURE__ */ (0, import_jsx_runtime72.jsx)("span", { css: IntegrationTileName, title: name, children: name }),
14461
+ isInstalled ? /* @__PURE__ */ (0, import_jsx_runtime72.jsx)(IntegrationedAddedBadge, {}) : null,
14462
+ requiedEntitlement && isPublic ? /* @__PURE__ */ (0, import_jsx_runtime72.jsx)(IntegrationPremiumBadge, {}) : null,
14463
+ !isPublic ? /* @__PURE__ */ (0, import_jsx_runtime72.jsx)(IntegrationCustomBadge, {}) : null,
14464
+ authorIcon ? /* @__PURE__ */ (0, import_jsx_runtime72.jsx)(ResolveIcon, { icon: authorIcon, name }) : null
14404
14465
  ]
14405
14466
  }
14406
14467
  );
14407
14468
  };
14408
14469
 
14409
14470
  // src/components/Tiles/styles/TileContainer.styles.ts
14410
- var import_react73 = require("@emotion/react");
14411
- var TileContainerWrapper = import_react73.css`
14471
+ var import_react76 = require("@emotion/react");
14472
+ var TileContainerWrapper = import_react76.css`
14412
14473
  background: var(--brand-secondary-2);
14413
14474
  padding: var(--spacing-base);
14414
14475
  margin-bottom: var(--spacing-lg);
14415
14476
  `;
14416
- var TileContainerInner = import_react73.css`
14477
+ var TileContainerInner = import_react76.css`
14417
14478
  display: grid;
14418
14479
  grid-template-columns: repeat(auto-fill, minmax(13rem, 1fr));
14419
14480
  gap: var(--spacing-base);
14420
14481
  `;
14421
14482
 
14422
14483
  // src/components/Tiles/TileContainer.tsx
14423
- var import_jsx_runtime72 = require("@emotion/react/jsx-runtime");
14484
+ var import_jsx_runtime73 = require("@emotion/react/jsx-runtime");
14424
14485
  var TileContainer = ({ children, ...props }) => {
14425
- return /* @__PURE__ */ (0, import_jsx_runtime72.jsx)("div", { css: TileContainerWrapper, ...props, children: /* @__PURE__ */ (0, import_jsx_runtime72.jsx)("div", { css: TileContainerInner, children }) });
14486
+ return /* @__PURE__ */ (0, import_jsx_runtime73.jsx)("div", { css: TileContainerWrapper, ...props, children: /* @__PURE__ */ (0, import_jsx_runtime73.jsx)("div", { css: TileContainerInner, children }) });
14426
14487
  };
14427
14488
 
14428
14489
  // src/components/Modal/IntegrationModalHeader.styles.ts
14429
- var import_react74 = require("@emotion/react");
14430
- var IntegrationModalHeaderSVGBackground = import_react74.css`
14490
+ var import_react77 = require("@emotion/react");
14491
+ var IntegrationModalHeaderSVGBackground = import_react77.css`
14431
14492
  position: absolute;
14432
14493
  top: 0;
14433
14494
  left: 0;
14434
14495
  `;
14435
- var IntegrationModalHeaderGroup = import_react74.css`
14496
+ var IntegrationModalHeaderGroup = import_react77.css`
14436
14497
  align-items: center;
14437
14498
  display: flex;
14438
14499
  gap: var(--spacing-sm);
14439
14500
  margin: 0 0 var(--spacing-md);
14440
14501
  position: relative;
14441
14502
  `;
14442
- var IntegrationModalHeaderTitleGroup = import_react74.css`
14503
+ var IntegrationModalHeaderTitleGroup = import_react77.css`
14443
14504
  align-items: center;
14444
14505
  display: flex;
14445
14506
  gap: var(--spacing-base);
14446
14507
  `;
14447
- var IntegrationModalHeaderTitle = import_react74.css`
14508
+ var IntegrationModalHeaderTitle = import_react77.css`
14448
14509
  margin-top: 0;
14449
14510
  `;
14450
- var IntegrationModalHeaderMenuPlacement = import_react74.css`
14511
+ var IntegrationModalHeaderMenuPlacement = import_react77.css`
14451
14512
  margin-bottom: var(--spacing-base);
14452
14513
  `;
14453
- var IntegrationModalHeaderContentWrapper = import_react74.css`
14514
+ var IntegrationModalHeaderContentWrapper = import_react77.css`
14454
14515
  position: relative;
14455
14516
  z-index: var(--z-10);
14456
14517
  `;
14457
14518
 
14458
14519
  // src/components/Modal/IntegrationModalHeader.tsx
14459
- var import_jsx_runtime73 = require("@emotion/react/jsx-runtime");
14520
+ var import_jsx_runtime74 = require("@emotion/react/jsx-runtime");
14460
14521
  var HexModalBackground = ({ ...props }) => {
14461
- return /* @__PURE__ */ (0, import_jsx_runtime73.jsxs)(
14522
+ return /* @__PURE__ */ (0, import_jsx_runtime74.jsxs)(
14462
14523
  "svg",
14463
14524
  {
14464
14525
  width: "236",
@@ -14468,7 +14529,7 @@ var HexModalBackground = ({ ...props }) => {
14468
14529
  xmlns: "http://www.w3.org/2000/svg",
14469
14530
  ...props,
14470
14531
  children: [
14471
- /* @__PURE__ */ (0, import_jsx_runtime73.jsx)(
14532
+ /* @__PURE__ */ (0, import_jsx_runtime74.jsx)(
14472
14533
  "path",
14473
14534
  {
14474
14535
  fillRule: "evenodd",
@@ -14477,7 +14538,7 @@ var HexModalBackground = ({ ...props }) => {
14477
14538
  fill: "url(#paint0_linear_196_2737)"
14478
14539
  }
14479
14540
  ),
14480
- /* @__PURE__ */ (0, import_jsx_runtime73.jsx)("defs", { children: /* @__PURE__ */ (0, import_jsx_runtime73.jsxs)(
14541
+ /* @__PURE__ */ (0, import_jsx_runtime74.jsx)("defs", { children: /* @__PURE__ */ (0, import_jsx_runtime74.jsxs)(
14481
14542
  "linearGradient",
14482
14543
  {
14483
14544
  id: "paint0_linear_196_2737",
@@ -14487,8 +14548,8 @@ var HexModalBackground = ({ ...props }) => {
14487
14548
  y2: "-95.2742",
14488
14549
  gradientUnits: "userSpaceOnUse",
14489
14550
  children: [
14490
- /* @__PURE__ */ (0, import_jsx_runtime73.jsx)("stop", { stopColor: "#81DCDE" }),
14491
- /* @__PURE__ */ (0, import_jsx_runtime73.jsx)("stop", { offset: "1", stopColor: "#428ED4" })
14551
+ /* @__PURE__ */ (0, import_jsx_runtime74.jsx)("stop", { stopColor: "#81DCDE" }),
14552
+ /* @__PURE__ */ (0, import_jsx_runtime74.jsx)("stop", { offset: "1", stopColor: "#428ED4" })
14492
14553
  ]
14493
14554
  }
14494
14555
  ) })
@@ -14497,27 +14558,27 @@ var HexModalBackground = ({ ...props }) => {
14497
14558
  );
14498
14559
  };
14499
14560
  var IntegrationModalHeader = ({ icon, name, menu: menu2, children }) => {
14500
- return /* @__PURE__ */ (0, import_jsx_runtime73.jsxs)(import_jsx_runtime73.Fragment, { children: [
14501
- /* @__PURE__ */ (0, import_jsx_runtime73.jsx)(HexModalBackground, { css: IntegrationModalHeaderSVGBackground, role: "presentation" }),
14502
- /* @__PURE__ */ (0, import_jsx_runtime73.jsx)("div", { css: IntegrationModalHeaderGroup, children: /* @__PURE__ */ (0, import_jsx_runtime73.jsxs)("div", { css: IntegrationModalHeaderTitleGroup, children: [
14503
- icon ? /* @__PURE__ */ (0, import_jsx_runtime73.jsx)(IntegrationModalIcon, { icon, name: name || "" }) : null,
14504
- /* @__PURE__ */ (0, import_jsx_runtime73.jsx)(Heading, { level: 3, css: IntegrationModalHeaderTitle, "data-test-id": "integration-modal-title", children: name || "Create Team Integration" }),
14505
- menu2 ? /* @__PURE__ */ (0, import_jsx_runtime73.jsxs)("div", { css: IntegrationModalHeaderMenuPlacement, children: [
14561
+ return /* @__PURE__ */ (0, import_jsx_runtime74.jsxs)(import_jsx_runtime74.Fragment, { children: [
14562
+ /* @__PURE__ */ (0, import_jsx_runtime74.jsx)(HexModalBackground, { css: IntegrationModalHeaderSVGBackground, role: "presentation" }),
14563
+ /* @__PURE__ */ (0, import_jsx_runtime74.jsx)("div", { css: IntegrationModalHeaderGroup, children: /* @__PURE__ */ (0, import_jsx_runtime74.jsxs)("div", { css: IntegrationModalHeaderTitleGroup, children: [
14564
+ icon ? /* @__PURE__ */ (0, import_jsx_runtime74.jsx)(IntegrationModalIcon, { icon, name: name || "" }) : null,
14565
+ /* @__PURE__ */ (0, import_jsx_runtime74.jsx)(Heading, { level: 3, css: IntegrationModalHeaderTitle, "data-test-id": "integration-modal-title", children: name || "Create Team Integration" }),
14566
+ menu2 ? /* @__PURE__ */ (0, import_jsx_runtime74.jsxs)("div", { css: IntegrationModalHeaderMenuPlacement, children: [
14506
14567
  menu2,
14507
14568
  " "
14508
14569
  ] }) : null
14509
14570
  ] }) }),
14510
- /* @__PURE__ */ (0, import_jsx_runtime73.jsx)("div", { css: IntegrationModalHeaderContentWrapper, children })
14571
+ /* @__PURE__ */ (0, import_jsx_runtime74.jsx)("div", { css: IntegrationModalHeaderContentWrapper, children })
14511
14572
  ] });
14512
14573
  };
14513
14574
 
14514
14575
  // src/components/Tooltip/Tooltip.tsx
14515
- var import_react76 = __toESM(require("react"));
14576
+ var import_react79 = __toESM(require("react"));
14516
14577
  var import_Tooltip = require("reakit/Tooltip");
14517
14578
 
14518
14579
  // src/components/Tooltip/Tooltip.styles.ts
14519
- var import_react75 = require("@emotion/react");
14520
- var TooltipContainer = import_react75.css`
14580
+ var import_react78 = require("@emotion/react");
14581
+ var TooltipContainer = import_react78.css`
14521
14582
  border: 2px solid var(--gray-300);
14522
14583
  border-radius: var(--rounded-base);
14523
14584
  padding: var(--spacing-xs) var(--spacing-sm);
@@ -14525,28 +14586,28 @@ var TooltipContainer = import_react75.css`
14525
14586
  font-size: var(--fs-xs);
14526
14587
  background: var(--white);
14527
14588
  `;
14528
- var TooltipArrowStyles = import_react75.css`
14589
+ var TooltipArrowStyles = import_react78.css`
14529
14590
  svg {
14530
14591
  fill: var(--gray-300);
14531
14592
  }
14532
14593
  `;
14533
14594
 
14534
14595
  // src/components/Tooltip/Tooltip.tsx
14535
- var import_jsx_runtime74 = require("@emotion/react/jsx-runtime");
14596
+ var import_jsx_runtime75 = require("@emotion/react/jsx-runtime");
14536
14597
  function Tooltip({ children, title, placement = "bottom", visible, ...props }) {
14537
14598
  const tooltip = (0, import_Tooltip.useTooltipState)({ placement });
14538
- return !title ? children : /* @__PURE__ */ (0, import_jsx_runtime74.jsxs)(import_jsx_runtime74.Fragment, { children: [
14539
- /* @__PURE__ */ (0, import_jsx_runtime74.jsx)(import_Tooltip.TooltipReference, { ...tooltip, ...children.props, children: (referenceProps) => import_react76.default.cloneElement(children, referenceProps) }),
14540
- /* @__PURE__ */ (0, import_jsx_runtime74.jsxs)(import_Tooltip.Tooltip, { ...tooltip, ...props, css: TooltipContainer, visible: visible != null ? visible : tooltip.visible, children: [
14541
- /* @__PURE__ */ (0, import_jsx_runtime74.jsx)(import_Tooltip.TooltipArrow, { ...tooltip, css: TooltipArrowStyles }),
14599
+ return !title ? children : /* @__PURE__ */ (0, import_jsx_runtime75.jsxs)(import_jsx_runtime75.Fragment, { children: [
14600
+ /* @__PURE__ */ (0, import_jsx_runtime75.jsx)(import_Tooltip.TooltipReference, { ...tooltip, ...children.props, children: (referenceProps) => import_react79.default.cloneElement(children, referenceProps) }),
14601
+ /* @__PURE__ */ (0, import_jsx_runtime75.jsxs)(import_Tooltip.Tooltip, { ...tooltip, ...props, css: TooltipContainer, visible: visible != null ? visible : tooltip.visible, children: [
14602
+ /* @__PURE__ */ (0, import_jsx_runtime75.jsx)(import_Tooltip.TooltipArrow, { ...tooltip, css: TooltipArrowStyles }),
14542
14603
  title
14543
14604
  ] })
14544
14605
  ] });
14545
14606
  }
14546
14607
 
14547
14608
  // src/components/ParameterInputs/styles/ParameterBindingButton.styles.ts
14548
- var import_react77 = require("@emotion/react");
14549
- var inputIconBtn = import_react77.css`
14609
+ var import_react80 = require("@emotion/react");
14610
+ var inputIconBtn = import_react80.css`
14550
14611
  align-items: center;
14551
14612
  border: none;
14552
14613
  border-radius: var(--rounded-base);
@@ -14570,7 +14631,7 @@ var inputIconBtn = import_react77.css`
14570
14631
  `;
14571
14632
 
14572
14633
  // src/components/ParameterInputs/ConnectToDataElementButton.tsx
14573
- var import_jsx_runtime75 = require("@emotion/react/jsx-runtime");
14634
+ var import_jsx_runtime76 = require("@emotion/react/jsx-runtime");
14574
14635
  var ConnectToDataElementButton = ({
14575
14636
  icon,
14576
14637
  iconColor,
@@ -14580,7 +14641,7 @@ var ConnectToDataElementButton = ({
14580
14641
  ...props
14581
14642
  }) => {
14582
14643
  const title = isLocked ? "Read-only pattern parameter" : isBound ? "Connected to external content. Click to edit" : "Click to connect to external content";
14583
- return /* @__PURE__ */ (0, import_jsx_runtime75.jsx)(Tooltip, { title, children: /* @__PURE__ */ (0, import_jsx_runtime75.jsxs)(
14644
+ return /* @__PURE__ */ (0, import_jsx_runtime76.jsx)(Tooltip, { title, children: /* @__PURE__ */ (0, import_jsx_runtime76.jsxs)(
14584
14645
  "button",
14585
14646
  {
14586
14647
  css: inputIconBtn,
@@ -14589,7 +14650,7 @@ var ConnectToDataElementButton = ({
14589
14650
  "aria-disabled": isLocked,
14590
14651
  ...props,
14591
14652
  children: [
14592
- /* @__PURE__ */ (0, import_jsx_runtime75.jsx)(
14653
+ /* @__PURE__ */ (0, import_jsx_runtime76.jsx)(
14593
14654
  Icon,
14594
14655
  {
14595
14656
  icon: isLocked ? "lock" : icon ? icon : "arrows-expand-down-right",
@@ -14604,8 +14665,8 @@ var ConnectToDataElementButton = ({
14604
14665
  };
14605
14666
 
14606
14667
  // src/components/ParameterInputs/hooks/ParameterShellContext.tsx
14607
- var import_react78 = require("react");
14608
- var ParameterShellContext = (0, import_react78.createContext)({
14668
+ var import_react81 = require("react");
14669
+ var ParameterShellContext = (0, import_react81.createContext)({
14609
14670
  id: "",
14610
14671
  label: "",
14611
14672
  hiddenLabel: void 0,
@@ -14614,7 +14675,7 @@ var ParameterShellContext = (0, import_react78.createContext)({
14614
14675
  }
14615
14676
  });
14616
14677
  var useParameterShell = () => {
14617
- const { id, label, hiddenLabel, errorMessage, handleManuallySetErrorMessage } = (0, import_react78.useContext)(ParameterShellContext);
14678
+ const { id, label, hiddenLabel, errorMessage, handleManuallySetErrorMessage } = (0, import_react81.useContext)(ParameterShellContext);
14618
14679
  return {
14619
14680
  id,
14620
14681
  label,
@@ -14625,8 +14686,8 @@ var useParameterShell = () => {
14625
14686
  };
14626
14687
 
14627
14688
  // src/components/ParameterInputs/styles/ParameterInput.styles.ts
14628
- var import_react79 = require("@emotion/react");
14629
- var inputContainer2 = import_react79.css`
14689
+ var import_react82 = require("@emotion/react");
14690
+ var inputContainer2 = import_react82.css`
14630
14691
  position: relative;
14631
14692
 
14632
14693
  &:hover,
@@ -14638,14 +14699,14 @@ var inputContainer2 = import_react79.css`
14638
14699
  }
14639
14700
  }
14640
14701
  `;
14641
- var labelText2 = import_react79.css`
14702
+ var labelText2 = import_react82.css`
14642
14703
  align-items: center;
14643
14704
  display: flex;
14644
14705
  gap: var(--spacing-xs);
14645
14706
  font-weight: var(--fw-regular);
14646
14707
  margin: 0 0 var(--spacing-xs);
14647
14708
  `;
14648
- var input2 = import_react79.css`
14709
+ var input2 = import_react82.css`
14649
14710
  display: block;
14650
14711
  appearance: none;
14651
14712
  box-sizing: border-box;
@@ -14689,18 +14750,18 @@ var input2 = import_react79.css`
14689
14750
  color: var(--gray-400);
14690
14751
  }
14691
14752
  `;
14692
- var selectInput = import_react79.css`
14753
+ var selectInput = import_react82.css`
14693
14754
  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");
14694
14755
  background-position: right var(--spacing-sm) center;
14695
14756
  background-repeat: no-repeat;
14696
14757
  background-size: 1rem;
14697
14758
  padding-right: var(--spacing-xl);
14698
14759
  `;
14699
- var inputWrapper = import_react79.css`
14760
+ var inputWrapper = import_react82.css`
14700
14761
  display: flex; // used to correct overflow with chrome textarea
14701
14762
  position: relative;
14702
14763
  `;
14703
- var inputIcon2 = import_react79.css`
14764
+ var inputIcon2 = import_react82.css`
14704
14765
  align-items: center;
14705
14766
  background: var(--white);
14706
14767
  border-radius: var(--rounded-md) 0 0 var(--rounded-md);
@@ -14716,7 +14777,7 @@ var inputIcon2 = import_react79.css`
14716
14777
  width: var(--spacing-lg);
14717
14778
  z-index: var(--z-10);
14718
14779
  `;
14719
- var inputToggleLabel2 = import_react79.css`
14780
+ var inputToggleLabel2 = import_react82.css`
14720
14781
  align-items: center;
14721
14782
  background: var(--white);
14722
14783
  cursor: pointer;
@@ -14727,7 +14788,7 @@ var inputToggleLabel2 = import_react79.css`
14727
14788
  min-height: var(--spacing-md);
14728
14789
  position: relative;
14729
14790
  `;
14730
- var toggleInput2 = import_react79.css`
14791
+ var toggleInput2 = import_react82.css`
14731
14792
  appearance: none;
14732
14793
  border: 1px solid var(--gray-300);
14733
14794
  background: var(--white);
@@ -14766,7 +14827,7 @@ var toggleInput2 = import_react79.css`
14766
14827
  border-color: var(--gray-300);
14767
14828
  }
14768
14829
  `;
14769
- var inlineLabel2 = import_react79.css`
14830
+ var inlineLabel2 = import_react82.css`
14770
14831
  padding-left: var(--spacing-lg);
14771
14832
  font-size: var(--fs-sm);
14772
14833
  font-weight: var(--fw-regular);
@@ -14782,7 +14843,7 @@ var inlineLabel2 = import_react79.css`
14782
14843
  }
14783
14844
  }
14784
14845
  `;
14785
- var inputMenu = import_react79.css`
14846
+ var inputMenu = import_react82.css`
14786
14847
  background: none;
14787
14848
  border: none;
14788
14849
  padding: var(--spacing-2xs);
@@ -14798,14 +14859,14 @@ var inputMenu = import_react79.css`
14798
14859
  background-color: var(--gray-200);
14799
14860
  }
14800
14861
  `;
14801
- var textarea2 = import_react79.css`
14862
+ var textarea2 = import_react82.css`
14802
14863
  resize: vertical;
14803
14864
  min-height: 2rem;
14804
14865
  `;
14805
- var imageWrapper = import_react79.css`
14866
+ var imageWrapper = import_react82.css`
14806
14867
  background: var(--white);
14807
14868
  `;
14808
- var img = import_react79.css`
14869
+ var img = import_react82.css`
14809
14870
  animation: ${fadeIn} var(--duration-fast) var(--timing-ease-out) forwards;
14810
14871
  object-fit: contain;
14811
14872
  max-width: 100%;
@@ -14813,7 +14874,7 @@ var img = import_react79.css`
14813
14874
  opacity: var(--opacity-0);
14814
14875
  margin: var(--spacing-sm) auto 0;
14815
14876
  `;
14816
- var dataConnectButton = import_react79.css`
14877
+ var dataConnectButton = import_react82.css`
14817
14878
  align-items: center;
14818
14879
  appearance: none;
14819
14880
  box-sizing: border-box;
@@ -14848,7 +14909,7 @@ var dataConnectButton = import_react79.css`
14848
14909
  pointer-events: none;
14849
14910
  }
14850
14911
  `;
14851
- var linkParameterBtn = import_react79.css`
14912
+ var linkParameterBtn = import_react82.css`
14852
14913
  border-radius: var(--rounded-base);
14853
14914
  background: var(--white);
14854
14915
  border: none;
@@ -14857,7 +14918,7 @@ var linkParameterBtn = import_react79.css`
14857
14918
  font-size: var(--fs-sm);
14858
14919
  line-height: 1;
14859
14920
  `;
14860
- var linkParameterControls = import_react79.css`
14921
+ var linkParameterControls = import_react82.css`
14861
14922
  position: absolute;
14862
14923
  inset: 0 0 0 auto;
14863
14924
  padding: 0 var(--spacing-base);
@@ -14866,13 +14927,13 @@ var linkParameterControls = import_react79.css`
14866
14927
  justify-content: center;
14867
14928
  gap: var(--spacing-base);
14868
14929
  `;
14869
- var linkParameterInput = (withExternalLinkIcon) => import_react79.css`
14930
+ var linkParameterInput = (withExternalLinkIcon) => import_react82.css`
14870
14931
  padding-right: calc(
14871
14932
  ${withExternalLinkIcon ? "calc(var(--spacing-lg) * 2 + var(--spacing-xs))" : "var(--spacing-xl)"} +
14872
14933
  var(--spacing-base)
14873
14934
  );
14874
14935
  `;
14875
- var linkParameterIcon = import_react79.css`
14936
+ var linkParameterIcon = import_react82.css`
14876
14937
  align-items: center;
14877
14938
  color: var(--brand-secondary-3);
14878
14939
  display: flex;
@@ -14887,7 +14948,7 @@ var linkParameterIcon = import_react79.css`
14887
14948
  `;
14888
14949
 
14889
14950
  // src/components/ParameterInputs/ParameterDataResource.tsx
14890
- var import_jsx_runtime76 = require("@emotion/react/jsx-runtime");
14951
+ var import_jsx_runtime77 = require("@emotion/react/jsx-runtime");
14891
14952
  function ParameterDataResource({
14892
14953
  label,
14893
14954
  labelLeadingIcon,
@@ -14897,12 +14958,12 @@ function ParameterDataResource({
14897
14958
  disabled,
14898
14959
  children
14899
14960
  }) {
14900
- return /* @__PURE__ */ (0, import_jsx_runtime76.jsxs)("div", { "data-testid": "parameter-data-connect-button", children: [
14901
- /* @__PURE__ */ (0, import_jsx_runtime76.jsxs)("span", { css: labelText2, children: [
14961
+ return /* @__PURE__ */ (0, import_jsx_runtime77.jsxs)("div", { "data-testid": "parameter-data-connect-button", children: [
14962
+ /* @__PURE__ */ (0, import_jsx_runtime77.jsxs)("span", { css: labelText2, children: [
14902
14963
  labelLeadingIcon ? labelLeadingIcon : null,
14903
14964
  label
14904
14965
  ] }),
14905
- /* @__PURE__ */ (0, import_jsx_runtime76.jsxs)(
14966
+ /* @__PURE__ */ (0, import_jsx_runtime77.jsxs)(
14906
14967
  "button",
14907
14968
  {
14908
14969
  type: "button",
@@ -14911,30 +14972,30 @@ function ParameterDataResource({
14911
14972
  disabled,
14912
14973
  onClick: onConnectDatasource,
14913
14974
  children: [
14914
- /* @__PURE__ */ (0, import_jsx_runtime76.jsx)("span", { className: "advance-input-icon", css: [inputIcon2], children: /* @__PURE__ */ (0, import_jsx_runtime76.jsx)(Icon, { icon: "stack", iconColor: "currentColor", size: "1rem" }) }),
14975
+ /* @__PURE__ */ (0, import_jsx_runtime77.jsx)("span", { className: "advance-input-icon", css: [inputIcon2], children: /* @__PURE__ */ (0, import_jsx_runtime77.jsx)(Icon, { icon: "stack", iconColor: "currentColor", size: "1rem" }) }),
14915
14976
  children
14916
14977
  ]
14917
14978
  }
14918
14979
  ),
14919
- caption ? /* @__PURE__ */ (0, import_jsx_runtime76.jsx)(Caption, { children: caption }) : null
14980
+ caption ? /* @__PURE__ */ (0, import_jsx_runtime77.jsx)(Caption, { children: caption }) : null
14920
14981
  ] });
14921
14982
  }
14922
14983
 
14923
14984
  // src/components/ParameterInputs/styles/ParameterDrawerHeader.styles.ts
14924
- var import_react80 = require("@emotion/react");
14925
- var ParameterDrawerHeaderContainer = import_react80.css`
14985
+ var import_react83 = require("@emotion/react");
14986
+ var ParameterDrawerHeaderContainer = import_react83.css`
14926
14987
  align-items: center;
14927
14988
  display: flex;
14928
14989
  gap: var(--spacing-base);
14929
14990
  justify-content: space-between;
14930
14991
  margin-bottom: var(--spacing-sm);
14931
14992
  `;
14932
- var ParameterDrawerHeaderTitleGroup = import_react80.css`
14993
+ var ParameterDrawerHeaderTitleGroup = import_react83.css`
14933
14994
  align-items: center;
14934
14995
  display: flex;
14935
14996
  gap: var(--spacing-sm);
14936
14997
  `;
14937
- var ParameterDrawerHeaderTitle = import_react80.css`
14998
+ var ParameterDrawerHeaderTitle = import_react83.css`
14938
14999
  text-overflow: ellipsis;
14939
15000
  white-space: nowrap;
14940
15001
  overflow: hidden;
@@ -14942,23 +15003,23 @@ var ParameterDrawerHeaderTitle = import_react80.css`
14942
15003
  `;
14943
15004
 
14944
15005
  // src/components/ParameterInputs/ParameterDrawerHeader.tsx
14945
- var import_jsx_runtime77 = require("@emotion/react/jsx-runtime");
15006
+ var import_jsx_runtime78 = require("@emotion/react/jsx-runtime");
14946
15007
  var ParameterDrawerHeader = ({ title, iconBeforeTitle, children }) => {
14947
- return /* @__PURE__ */ (0, import_jsx_runtime77.jsxs)("div", { css: ParameterDrawerHeaderContainer, children: [
14948
- /* @__PURE__ */ (0, import_jsx_runtime77.jsxs)("header", { css: ParameterDrawerHeaderTitleGroup, children: [
15008
+ return /* @__PURE__ */ (0, import_jsx_runtime78.jsxs)("div", { css: ParameterDrawerHeaderContainer, children: [
15009
+ /* @__PURE__ */ (0, import_jsx_runtime78.jsxs)("header", { css: ParameterDrawerHeaderTitleGroup, children: [
14949
15010
  iconBeforeTitle,
14950
- /* @__PURE__ */ (0, import_jsx_runtime77.jsx)(Heading, { level: 3, withMarginBottom: false, css: ParameterDrawerHeaderTitle, title, children: title })
15011
+ /* @__PURE__ */ (0, import_jsx_runtime78.jsx)(Heading, { level: 3, withMarginBottom: false, css: ParameterDrawerHeaderTitle, title, children: title })
14951
15012
  ] }),
14952
15013
  children
14953
15014
  ] });
14954
15015
  };
14955
15016
 
14956
15017
  // src/components/ParameterInputs/ParameterGroup.tsx
14957
- var import_react82 = require("react");
15018
+ var import_react85 = require("react");
14958
15019
 
14959
15020
  // src/components/ParameterInputs/styles/ParameterGroup.styles.ts
14960
- var import_react81 = require("@emotion/react");
14961
- var fieldsetStyles = import_react81.css`
15021
+ var import_react84 = require("@emotion/react");
15022
+ var fieldsetStyles = import_react84.css`
14962
15023
  &:disabled,
14963
15024
  [readonly] {
14964
15025
  pointer-events: none;
@@ -14969,7 +15030,7 @@ var fieldsetStyles = import_react81.css`
14969
15030
  }
14970
15031
  }
14971
15032
  `;
14972
- var fieldsetLegend2 = import_react81.css`
15033
+ var fieldsetLegend2 = import_react84.css`
14973
15034
  display: block;
14974
15035
  font-weight: var(--fw-medium);
14975
15036
  margin-bottom: var(--spacing-sm);
@@ -14977,38 +15038,38 @@ var fieldsetLegend2 = import_react81.css`
14977
15038
  `;
14978
15039
 
14979
15040
  // src/components/ParameterInputs/ParameterGroup.tsx
14980
- var import_jsx_runtime78 = require("@emotion/react/jsx-runtime");
14981
- var ParameterGroup = (0, import_react82.forwardRef)(
15041
+ var import_jsx_runtime79 = require("@emotion/react/jsx-runtime");
15042
+ var ParameterGroup = (0, import_react85.forwardRef)(
14982
15043
  ({ legend, isDisabled, children, ...props }, ref) => {
14983
- return /* @__PURE__ */ (0, import_jsx_runtime78.jsxs)("fieldset", { css: fieldsetStyles, disabled: isDisabled, ref, ...props, children: [
14984
- /* @__PURE__ */ (0, import_jsx_runtime78.jsx)("legend", { css: fieldsetLegend2, children: legend }),
15044
+ return /* @__PURE__ */ (0, import_jsx_runtime79.jsxs)("fieldset", { css: fieldsetStyles, disabled: isDisabled, ref, ...props, children: [
15045
+ /* @__PURE__ */ (0, import_jsx_runtime79.jsx)("legend", { css: fieldsetLegend2, children: legend }),
14985
15046
  children
14986
15047
  ] });
14987
15048
  }
14988
15049
  );
14989
15050
 
14990
15051
  // src/components/ParameterInputs/ParameterImage.tsx
14991
- var import_react86 = require("react");
15052
+ var import_react89 = require("react");
14992
15053
 
14993
15054
  // src/components/ParameterInputs/ParameterShell.tsx
14994
- var import_react85 = require("react");
15055
+ var import_react88 = require("react");
14995
15056
 
14996
15057
  // src/components/ParameterInputs/ParameterLabel.tsx
14997
- var import_jsx_runtime79 = require("@emotion/react/jsx-runtime");
15058
+ var import_jsx_runtime80 = require("@emotion/react/jsx-runtime");
14998
15059
  var ParameterLabel = ({ id, asSpan, children, ...props }) => {
14999
- return !asSpan ? /* @__PURE__ */ (0, import_jsx_runtime79.jsx)("label", { ...props, htmlFor: id, css: labelText2, children }) : /* @__PURE__ */ (0, import_jsx_runtime79.jsx)("span", { "aria-labelledby": id, css: labelText2, children });
15060
+ return !asSpan ? /* @__PURE__ */ (0, import_jsx_runtime80.jsx)("label", { ...props, htmlFor: id, css: labelText2, children }) : /* @__PURE__ */ (0, import_jsx_runtime80.jsx)("span", { "aria-labelledby": id, css: labelText2, children });
15000
15061
  };
15001
15062
 
15002
15063
  // src/components/ParameterInputs/ParameterMenuButton.tsx
15003
- var import_react83 = require("react");
15004
- var import_jsx_runtime80 = require("@emotion/react/jsx-runtime");
15005
- var ParameterMenuButton = (0, import_react83.forwardRef)(
15064
+ var import_react86 = require("react");
15065
+ var import_jsx_runtime81 = require("@emotion/react/jsx-runtime");
15066
+ var ParameterMenuButton = (0, import_react86.forwardRef)(
15006
15067
  ({ label, children }, ref) => {
15007
- return /* @__PURE__ */ (0, import_jsx_runtime80.jsx)(
15068
+ return /* @__PURE__ */ (0, import_jsx_runtime81.jsx)(
15008
15069
  Menu,
15009
15070
  {
15010
15071
  menuLabel: `${label} menu`,
15011
- menuTrigger: /* @__PURE__ */ (0, import_jsx_runtime80.jsx)(
15072
+ menuTrigger: /* @__PURE__ */ (0, import_jsx_runtime81.jsx)(
15012
15073
  "button",
15013
15074
  {
15014
15075
  className: "parameter-menu",
@@ -15016,7 +15077,7 @@ var ParameterMenuButton = (0, import_react83.forwardRef)(
15016
15077
  type: "button",
15017
15078
  "aria-label": `${label} options`,
15018
15079
  ref,
15019
- children: /* @__PURE__ */ (0, import_jsx_runtime80.jsx)(Icon, { icon: "more-alt", iconColor: "currentColor", size: "0.9rem" })
15080
+ children: /* @__PURE__ */ (0, import_jsx_runtime81.jsx)(Icon, { icon: "more-alt", iconColor: "currentColor", size: "0.9rem" })
15020
15081
  }
15021
15082
  ),
15022
15083
  children
@@ -15026,15 +15087,15 @@ var ParameterMenuButton = (0, import_react83.forwardRef)(
15026
15087
  );
15027
15088
 
15028
15089
  // src/components/ParameterInputs/styles/ParameterShell.styles.ts
15029
- var import_react84 = require("@emotion/react");
15030
- var emptyParameterShell = import_react84.css`
15090
+ var import_react87 = require("@emotion/react");
15091
+ var emptyParameterShell = import_react87.css`
15031
15092
  border-radius: var(--rounded-sm);
15032
15093
  background: var(--white);
15033
15094
  flex-grow: 1;
15034
15095
  padding: var(--spacing-xs);
15035
15096
  position: relative;
15036
15097
  `;
15037
- var emptyParameterShellText = import_react84.css`
15098
+ var emptyParameterShellText = import_react87.css`
15038
15099
  background: var(--brand-secondary-6);
15039
15100
  border-radius: var(--rounded-sm);
15040
15101
  padding: var(--spacing-sm);
@@ -15042,7 +15103,7 @@ var emptyParameterShellText = import_react84.css`
15042
15103
  font-size: var(--fs-sm);
15043
15104
  margin: 0;
15044
15105
  `;
15045
- var overrideMarker = import_react84.css`
15106
+ var overrideMarker = import_react87.css`
15046
15107
  border-radius: var(--rounded-sm);
15047
15108
  border: 10px solid var(--gray-300);
15048
15109
  border-left-color: transparent;
@@ -15053,7 +15114,7 @@ var overrideMarker = import_react84.css`
15053
15114
  `;
15054
15115
 
15055
15116
  // src/components/ParameterInputs/ParameterShell.tsx
15056
- var import_jsx_runtime81 = require("@emotion/react/jsx-runtime");
15117
+ var import_jsx_runtime82 = require("@emotion/react/jsx-runtime");
15057
15118
  var extractParameterProps = (props) => {
15058
15119
  const {
15059
15120
  id,
@@ -15112,21 +15173,21 @@ var ParameterShell = ({
15112
15173
  children,
15113
15174
  ...props
15114
15175
  }) => {
15115
- const [manualErrorMessage, setManualErrorMessage] = (0, import_react85.useState)(void 0);
15176
+ const [manualErrorMessage, setManualErrorMessage] = (0, import_react88.useState)(void 0);
15116
15177
  const setErrorMessage = (message) => setManualErrorMessage(message);
15117
15178
  const errorMessaging = errorMessage || manualErrorMessage;
15118
- return /* @__PURE__ */ (0, import_jsx_runtime81.jsxs)("div", { css: inputContainer2, ...props, children: [
15119
- hiddenLabel || title ? null : /* @__PURE__ */ (0, import_jsx_runtime81.jsxs)(ParameterLabel, { id, css: labelText2, children: [
15179
+ return /* @__PURE__ */ (0, import_jsx_runtime82.jsxs)("div", { css: inputContainer2, ...props, children: [
15180
+ hiddenLabel || title ? null : /* @__PURE__ */ (0, import_jsx_runtime82.jsxs)(ParameterLabel, { id, css: labelText2, children: [
15120
15181
  labelLeadingIcon ? labelLeadingIcon : null,
15121
15182
  label
15122
15183
  ] }),
15123
- !title ? null : /* @__PURE__ */ (0, import_jsx_runtime81.jsxs)(ParameterLabel, { id, asSpan: true, children: [
15184
+ !title ? null : /* @__PURE__ */ (0, import_jsx_runtime82.jsxs)(ParameterLabel, { id, asSpan: true, children: [
15124
15185
  labelLeadingIcon ? labelLeadingIcon : null,
15125
15186
  title
15126
15187
  ] }),
15127
- /* @__PURE__ */ (0, import_jsx_runtime81.jsxs)("div", { css: inputWrapper, children: [
15128
- menuItems ? /* @__PURE__ */ (0, import_jsx_runtime81.jsx)(ParameterMenuButton, { label: `${label} menu`, children: menuItems }) : null,
15129
- /* @__PURE__ */ (0, import_jsx_runtime81.jsx)(
15188
+ /* @__PURE__ */ (0, import_jsx_runtime82.jsxs)("div", { css: inputWrapper, children: [
15189
+ menuItems ? /* @__PURE__ */ (0, import_jsx_runtime82.jsx)(ParameterMenuButton, { label: `${label} menu`, children: menuItems }) : null,
15190
+ /* @__PURE__ */ (0, import_jsx_runtime82.jsx)(
15130
15191
  ParameterShellContext.Provider,
15131
15192
  {
15132
15193
  value: {
@@ -15136,32 +15197,32 @@ var ParameterShell = ({
15136
15197
  errorMessage: errorMessaging,
15137
15198
  handleManuallySetErrorMessage: (message) => setErrorMessage(message)
15138
15199
  },
15139
- children: /* @__PURE__ */ (0, import_jsx_runtime81.jsxs)(ParameterShellPlaceholder, { children: [
15200
+ children: /* @__PURE__ */ (0, import_jsx_runtime82.jsxs)(ParameterShellPlaceholder, { children: [
15140
15201
  children,
15141
- hasOverriddenValue && onResetOverriddenValue ? /* @__PURE__ */ (0, import_jsx_runtime81.jsx)(ParameterOverrideMarker, { onClick: onResetOverriddenValue }) : null
15202
+ hasOverriddenValue && onResetOverriddenValue ? /* @__PURE__ */ (0, import_jsx_runtime82.jsx)(ParameterOverrideMarker, { onClick: onResetOverriddenValue }) : null
15142
15203
  ] })
15143
15204
  }
15144
15205
  )
15145
15206
  ] }),
15146
- caption ? /* @__PURE__ */ (0, import_jsx_runtime81.jsx)(Caption, { testId: captionTestId, children: caption }) : null,
15147
- errorMessaging ? /* @__PURE__ */ (0, import_jsx_runtime81.jsx)(ErrorMessage, { message: errorMessaging, testId: errorTestId }) : null,
15148
- warningMessage ? /* @__PURE__ */ (0, import_jsx_runtime81.jsx)(WarningMessage, { message: warningMessage }) : null,
15149
- infoMessage ? /* @__PURE__ */ (0, import_jsx_runtime81.jsx)(InfoMessage, { message: infoMessage }) : null
15207
+ caption ? /* @__PURE__ */ (0, import_jsx_runtime82.jsx)(Caption, { testId: captionTestId, children: caption }) : null,
15208
+ errorMessaging ? /* @__PURE__ */ (0, import_jsx_runtime82.jsx)(ErrorMessage, { message: errorMessaging, testId: errorTestId }) : null,
15209
+ warningMessage ? /* @__PURE__ */ (0, import_jsx_runtime82.jsx)(WarningMessage, { message: warningMessage }) : null,
15210
+ infoMessage ? /* @__PURE__ */ (0, import_jsx_runtime82.jsx)(InfoMessage, { message: infoMessage }) : null
15150
15211
  ] });
15151
15212
  };
15152
15213
  var ParameterShellPlaceholder = ({ children }) => {
15153
- return /* @__PURE__ */ (0, import_jsx_runtime81.jsx)("div", { css: emptyParameterShell, children });
15214
+ return /* @__PURE__ */ (0, import_jsx_runtime82.jsx)("div", { css: emptyParameterShell, children });
15154
15215
  };
15155
- var ParameterOverrideMarker = (props) => /* @__PURE__ */ (0, import_jsx_runtime81.jsx)(Tooltip, { title: "The default value has been overridden", children: /* @__PURE__ */ (0, import_jsx_runtime81.jsx)("button", { type: "button", css: overrideMarker, ...props, children: /* @__PURE__ */ (0, import_jsx_runtime81.jsx)("span", { hidden: true, children: "reset overridden value to default" }) }) });
15216
+ var ParameterOverrideMarker = (props) => /* @__PURE__ */ (0, import_jsx_runtime82.jsx)(Tooltip, { title: "The default value has been overridden", children: /* @__PURE__ */ (0, import_jsx_runtime82.jsx)("button", { type: "button", css: overrideMarker, ...props, children: /* @__PURE__ */ (0, import_jsx_runtime82.jsx)("span", { hidden: true, children: "reset overridden value to default" }) }) });
15156
15217
 
15157
15218
  // src/components/ParameterInputs/ParameterImage.tsx
15158
- var import_jsx_runtime82 = require("@emotion/react/jsx-runtime");
15159
- var ParameterImage = (0, import_react86.forwardRef)((props, ref) => {
15219
+ var import_jsx_runtime83 = require("@emotion/react/jsx-runtime");
15220
+ var ParameterImage = (0, import_react89.forwardRef)((props, ref) => {
15160
15221
  const { shellProps, innerProps } = extractParameterProps(props);
15161
- return /* @__PURE__ */ (0, import_jsx_runtime82.jsx)(ParameterShell, { "data-test-id": "parameter-image", ...shellProps, children: /* @__PURE__ */ (0, import_jsx_runtime82.jsx)(ParameterImageInner, { ref, ...innerProps }) });
15222
+ return /* @__PURE__ */ (0, import_jsx_runtime83.jsx)(ParameterShell, { "data-test-id": "parameter-image", ...shellProps, children: /* @__PURE__ */ (0, import_jsx_runtime83.jsx)(ParameterImageInner, { ref, ...innerProps }) });
15162
15223
  });
15163
15224
  var BrokenImage = ({ ...props }) => {
15164
- return /* @__PURE__ */ (0, import_jsx_runtime82.jsxs)(
15225
+ return /* @__PURE__ */ (0, import_jsx_runtime83.jsxs)(
15165
15226
  "svg",
15166
15227
  {
15167
15228
  role: "img",
@@ -15173,11 +15234,11 @@ var BrokenImage = ({ ...props }) => {
15173
15234
  xmlnsXlink: "http://www.w3.org/1999/xlink",
15174
15235
  ...props,
15175
15236
  children: [
15176
- /* @__PURE__ */ (0, import_jsx_runtime82.jsx)("rect", { width: "214", height: "214", fill: "#F9FAFB" }),
15177
- /* @__PURE__ */ (0, import_jsx_runtime82.jsx)("rect", { width: "214", height: "214", fill: "url(#pattern0)" }),
15178
- /* @__PURE__ */ (0, import_jsx_runtime82.jsxs)("defs", { children: [
15179
- /* @__PURE__ */ (0, import_jsx_runtime82.jsx)("pattern", { id: "pattern0", patternContentUnits: "objectBoundingBox", width: "1", height: "1", children: /* @__PURE__ */ (0, import_jsx_runtime82.jsx)("use", { xlinkHref: "#image0_761_4353", transform: "scale(0.0025)" }) }),
15180
- /* @__PURE__ */ (0, import_jsx_runtime82.jsx)(
15237
+ /* @__PURE__ */ (0, import_jsx_runtime83.jsx)("rect", { width: "214", height: "214", fill: "#F9FAFB" }),
15238
+ /* @__PURE__ */ (0, import_jsx_runtime83.jsx)("rect", { width: "214", height: "214", fill: "url(#pattern0)" }),
15239
+ /* @__PURE__ */ (0, import_jsx_runtime83.jsxs)("defs", { children: [
15240
+ /* @__PURE__ */ (0, import_jsx_runtime83.jsx)("pattern", { id: "pattern0", patternContentUnits: "objectBoundingBox", width: "1", height: "1", children: /* @__PURE__ */ (0, import_jsx_runtime83.jsx)("use", { xlinkHref: "#image0_761_4353", transform: "scale(0.0025)" }) }),
15241
+ /* @__PURE__ */ (0, import_jsx_runtime83.jsx)(
15181
15242
  "image",
15182
15243
  {
15183
15244
  id: "image0_761_4353",
@@ -15191,14 +15252,14 @@ var BrokenImage = ({ ...props }) => {
15191
15252
  }
15192
15253
  );
15193
15254
  };
15194
- var ParameterImageInner = (0, import_react86.forwardRef)(
15255
+ var ParameterImageInner = (0, import_react89.forwardRef)(
15195
15256
  ({ ...props }, ref) => {
15196
15257
  const { value } = props;
15197
15258
  const { id, label, hiddenLabel, errorMessage, handleManuallySetErrorMessage } = useParameterShell();
15198
- const [loading, setLoading] = (0, import_react86.useState)(false);
15199
- const deferredValue = (0, import_react86.useDeferredValue)(value);
15259
+ const [loading, setLoading] = (0, import_react89.useState)(false);
15260
+ const deferredValue = (0, import_react89.useDeferredValue)(value);
15200
15261
  const errorText = "The text you provided is not a valid URL";
15201
- const updateImageSrc = (0, import_react86.useCallback)(() => {
15262
+ const updateImageSrc = (0, import_react89.useCallback)(() => {
15202
15263
  const validUrl = new RegExp(
15203
15264
  "^(https?:\\/\\/)?((([a-z\\d]([a-z\\d-]*[a-z\\d])*)\\.)+[a-z]{2,}|((\\d{1,3}\\.){3}\\d{1,3}))(\\:\\d+)?(\\/[-a-z\\d%_.~+]*)*(\\?[;&a-z\\d%_.~+=-]*)?(\\#[-a-z\\d_]*)?$",
15204
15265
  "i"
@@ -15233,11 +15294,11 @@ var ParameterImageInner = (0, import_react86.forwardRef)(
15233
15294
  handleManuallySetErrorMessage(errorText);
15234
15295
  }
15235
15296
  };
15236
- (0, import_react86.useEffect)(() => {
15297
+ (0, import_react89.useEffect)(() => {
15237
15298
  updateImageSrc();
15238
15299
  }, [deferredValue]);
15239
- return /* @__PURE__ */ (0, import_jsx_runtime82.jsxs)(import_jsx_runtime82.Fragment, { children: [
15240
- /* @__PURE__ */ (0, import_jsx_runtime82.jsx)(
15300
+ return /* @__PURE__ */ (0, import_jsx_runtime83.jsxs)(import_jsx_runtime83.Fragment, { children: [
15301
+ /* @__PURE__ */ (0, import_jsx_runtime83.jsx)(
15241
15302
  "input",
15242
15303
  {
15243
15304
  css: input2,
@@ -15249,8 +15310,8 @@ var ParameterImageInner = (0, import_react86.forwardRef)(
15249
15310
  ...props
15250
15311
  }
15251
15312
  ),
15252
- /* @__PURE__ */ (0, import_jsx_runtime82.jsxs)("div", { css: imageWrapper, children: [
15253
- deferredValue && !errorMessage ? /* @__PURE__ */ (0, import_jsx_runtime82.jsx)(
15313
+ /* @__PURE__ */ (0, import_jsx_runtime83.jsxs)("div", { css: imageWrapper, children: [
15314
+ deferredValue && !errorMessage ? /* @__PURE__ */ (0, import_jsx_runtime83.jsx)(
15254
15315
  "img",
15255
15316
  {
15256
15317
  src: deferredValue,
@@ -15261,24 +15322,24 @@ var ParameterImageInner = (0, import_react86.forwardRef)(
15261
15322
  loading: "lazy"
15262
15323
  }
15263
15324
  ) : null,
15264
- deferredValue && errorMessage ? /* @__PURE__ */ (0, import_jsx_runtime82.jsx)(BrokenImage, { css: img }) : null
15325
+ deferredValue && errorMessage ? /* @__PURE__ */ (0, import_jsx_runtime83.jsx)(BrokenImage, { css: img }) : null
15265
15326
  ] }),
15266
- loading ? /* @__PURE__ */ (0, import_jsx_runtime82.jsx)(LoadingIcon, {}) : null
15327
+ loading ? /* @__PURE__ */ (0, import_jsx_runtime83.jsx)(LoadingIcon, {}) : null
15267
15328
  ] });
15268
15329
  }
15269
15330
  );
15270
15331
 
15271
15332
  // src/components/ParameterInputs/ParameterInput.tsx
15272
- var import_react87 = require("react");
15273
- var import_jsx_runtime83 = require("@emotion/react/jsx-runtime");
15274
- var ParameterInput = (0, import_react87.forwardRef)((props, ref) => {
15333
+ var import_react90 = require("react");
15334
+ var import_jsx_runtime84 = require("@emotion/react/jsx-runtime");
15335
+ var ParameterInput = (0, import_react90.forwardRef)((props, ref) => {
15275
15336
  const { shellProps, innerProps } = extractParameterProps(props);
15276
- return /* @__PURE__ */ (0, import_jsx_runtime83.jsx)(ParameterShell, { "data-test-id": "parameter-input", ...shellProps, children: /* @__PURE__ */ (0, import_jsx_runtime83.jsx)(ParameterInputInner, { ref, ...innerProps }) });
15337
+ return /* @__PURE__ */ (0, import_jsx_runtime84.jsx)(ParameterShell, { "data-test-id": "parameter-input", ...shellProps, children: /* @__PURE__ */ (0, import_jsx_runtime84.jsx)(ParameterInputInner, { ref, ...innerProps }) });
15277
15338
  });
15278
- var ParameterInputInner = (0, import_react87.forwardRef)(
15339
+ var ParameterInputInner = (0, import_react90.forwardRef)(
15279
15340
  ({ ...props }, ref) => {
15280
15341
  const { id, label, hiddenLabel } = useParameterShell();
15281
- return /* @__PURE__ */ (0, import_jsx_runtime83.jsx)(
15342
+ return /* @__PURE__ */ (0, import_jsx_runtime84.jsx)(
15282
15343
  "input",
15283
15344
  {
15284
15345
  css: input2,
@@ -15294,19 +15355,19 @@ var ParameterInputInner = (0, import_react87.forwardRef)(
15294
15355
  );
15295
15356
 
15296
15357
  // src/components/ParameterInputs/ParameterLink.tsx
15297
- var import_react88 = require("react");
15298
- var import_jsx_runtime84 = require("@emotion/react/jsx-runtime");
15299
- var ParameterLink = (0, import_react88.forwardRef)(
15358
+ var import_react91 = require("react");
15359
+ var import_jsx_runtime85 = require("@emotion/react/jsx-runtime");
15360
+ var ParameterLink = (0, import_react91.forwardRef)(
15300
15361
  ({ buttonText = "Select link", disabled, onConnectLink, externalLink, ...props }, ref) => {
15301
15362
  const { shellProps, innerProps } = extractParameterProps(props);
15302
- return /* @__PURE__ */ (0, import_jsx_runtime84.jsx)(
15363
+ return /* @__PURE__ */ (0, import_jsx_runtime85.jsx)(
15303
15364
  ParameterShell,
15304
15365
  {
15305
15366
  "data-test-id": "link-parameter-editor",
15306
15367
  ...shellProps,
15307
15368
  label: innerProps.value ? shellProps.label : "",
15308
15369
  title: !innerProps.value ? shellProps.label : void 0,
15309
- children: !innerProps.value ? /* @__PURE__ */ (0, import_jsx_runtime84.jsx)("button", { type: "button", css: dataConnectButton, disabled, onClick: onConnectLink, children: buttonText }) : /* @__PURE__ */ (0, import_jsx_runtime84.jsx)(
15370
+ children: !innerProps.value ? /* @__PURE__ */ (0, import_jsx_runtime85.jsx)("button", { type: "button", css: dataConnectButton, disabled, onClick: onConnectLink, children: buttonText }) : /* @__PURE__ */ (0, import_jsx_runtime85.jsx)(
15310
15371
  ParameterLinkInner,
15311
15372
  {
15312
15373
  onConnectLink,
@@ -15319,11 +15380,11 @@ var ParameterLink = (0, import_react88.forwardRef)(
15319
15380
  );
15320
15381
  }
15321
15382
  );
15322
- var ParameterLinkInner = (0, import_react88.forwardRef)(
15383
+ var ParameterLinkInner = (0, import_react91.forwardRef)(
15323
15384
  ({ externalLink, onConnectLink, disabled, ...props }, ref) => {
15324
15385
  const { id, label, hiddenLabel } = useParameterShell();
15325
- return /* @__PURE__ */ (0, import_jsx_runtime84.jsxs)("div", { css: inputWrapper, children: [
15326
- /* @__PURE__ */ (0, import_jsx_runtime84.jsx)(
15386
+ return /* @__PURE__ */ (0, import_jsx_runtime85.jsxs)("div", { css: inputWrapper, children: [
15387
+ /* @__PURE__ */ (0, import_jsx_runtime85.jsx)(
15327
15388
  "input",
15328
15389
  {
15329
15390
  type: "text",
@@ -15335,8 +15396,8 @@ var ParameterLinkInner = (0, import_react88.forwardRef)(
15335
15396
  ...props
15336
15397
  }
15337
15398
  ),
15338
- /* @__PURE__ */ (0, import_jsx_runtime84.jsxs)("div", { css: linkParameterControls, children: [
15339
- /* @__PURE__ */ (0, import_jsx_runtime84.jsx)(
15399
+ /* @__PURE__ */ (0, import_jsx_runtime85.jsxs)("div", { css: linkParameterControls, children: [
15400
+ /* @__PURE__ */ (0, import_jsx_runtime85.jsx)(
15340
15401
  "button",
15341
15402
  {
15342
15403
  type: "button",
@@ -15347,7 +15408,7 @@ var ParameterLinkInner = (0, import_react88.forwardRef)(
15347
15408
  children: "edit"
15348
15409
  }
15349
15410
  ),
15350
- externalLink ? /* @__PURE__ */ (0, import_jsx_runtime84.jsx)(
15411
+ externalLink ? /* @__PURE__ */ (0, import_jsx_runtime85.jsx)(
15351
15412
  "a",
15352
15413
  {
15353
15414
  href: externalLink,
@@ -15355,7 +15416,7 @@ var ParameterLinkInner = (0, import_react88.forwardRef)(
15355
15416
  title: "Open link in new tab",
15356
15417
  target: "_blank",
15357
15418
  rel: "noopener noreferrer",
15358
- children: /* @__PURE__ */ (0, import_jsx_runtime84.jsx)(Icon, { icon: "arrows-expand-up-right", iconColor: "currentColor", size: "1rem" })
15419
+ children: /* @__PURE__ */ (0, import_jsx_runtime85.jsx)(Icon, { icon: "arrows-expand-up-right", iconColor: "currentColor", size: "1rem" })
15359
15420
  }
15360
15421
  ) : null
15361
15422
  ] })
@@ -15364,7 +15425,7 @@ var ParameterLinkInner = (0, import_react88.forwardRef)(
15364
15425
  );
15365
15426
 
15366
15427
  // src/components/ParameterInputs/ParameterNameAndPublicIdInput.tsx
15367
- var import_jsx_runtime85 = require("@emotion/react/jsx-runtime");
15428
+ var import_jsx_runtime86 = require("@emotion/react/jsx-runtime");
15368
15429
  var ParameterNameAndPublicIdInput = ({
15369
15430
  id,
15370
15431
  onBlur,
@@ -15390,8 +15451,8 @@ var ParameterNameAndPublicIdInput = ({
15390
15451
  navigator.clipboard.writeText(values[publicIdFieldName]);
15391
15452
  };
15392
15453
  autoFocus == null ? void 0 : autoFocus();
15393
- return /* @__PURE__ */ (0, import_jsx_runtime85.jsxs)(import_jsx_runtime85.Fragment, { children: [
15394
- /* @__PURE__ */ (0, import_jsx_runtime85.jsx)(
15454
+ return /* @__PURE__ */ (0, import_jsx_runtime86.jsxs)(import_jsx_runtime86.Fragment, { children: [
15455
+ /* @__PURE__ */ (0, import_jsx_runtime86.jsx)(
15395
15456
  ParameterInput,
15396
15457
  {
15397
15458
  id: nameIdField,
@@ -15410,7 +15471,7 @@ var ParameterNameAndPublicIdInput = ({
15410
15471
  value: values[nameIdField]
15411
15472
  }
15412
15473
  ),
15413
- /* @__PURE__ */ (0, import_jsx_runtime85.jsx)(
15474
+ /* @__PURE__ */ (0, import_jsx_runtime86.jsx)(
15414
15475
  ParameterInput,
15415
15476
  {
15416
15477
  id: publicIdFieldName,
@@ -15424,11 +15485,11 @@ var ParameterNameAndPublicIdInput = ({
15424
15485
  caption: publicIdCaption,
15425
15486
  placeholder: publicIdPlaceholderText,
15426
15487
  errorMessage: publicIdError,
15427
- menuItems: /* @__PURE__ */ (0, import_jsx_runtime85.jsx)(
15488
+ menuItems: /* @__PURE__ */ (0, import_jsx_runtime86.jsx)(
15428
15489
  MenuItem,
15429
15490
  {
15430
15491
  disabled: !values[publicIdFieldName],
15431
- icon: /* @__PURE__ */ (0, import_jsx_runtime85.jsx)(Icon, { icon: "path-trim", iconColor: "currentColor" }),
15492
+ icon: /* @__PURE__ */ (0, import_jsx_runtime86.jsx)(Icon, { icon: "path-trim", iconColor: "currentColor" }),
15432
15493
  onClick: handleCopyPidFieldValue,
15433
15494
  children: "Copy"
15434
15495
  }
@@ -15436,14 +15497,14 @@ var ParameterNameAndPublicIdInput = ({
15436
15497
  value: values[publicIdFieldName]
15437
15498
  }
15438
15499
  ),
15439
- (warnOverLength == null ? void 0 : warnOverLength.length) && values[publicIdFieldName].length > warnOverLength.length ? /* @__PURE__ */ (0, import_jsx_runtime85.jsx)(Callout, { type: "caution", children: warnOverLength.message }) : null
15500
+ (warnOverLength == null ? void 0 : warnOverLength.length) && values[publicIdFieldName].length > warnOverLength.length ? /* @__PURE__ */ (0, import_jsx_runtime86.jsx)(Callout, { type: "caution", children: warnOverLength.message }) : null
15440
15501
  ] });
15441
15502
  };
15442
15503
 
15443
15504
  // src/components/ParameterInputs/ParameterRichText.tsx
15444
- var import_react89 = require("react");
15445
- var import_jsx_runtime86 = require("@emotion/react/jsx-runtime");
15446
- var ParameterRichText = (0, import_react89.forwardRef)(
15505
+ var import_react92 = require("react");
15506
+ var import_jsx_runtime87 = require("@emotion/react/jsx-runtime");
15507
+ var ParameterRichText = (0, import_react92.forwardRef)(
15447
15508
  ({
15448
15509
  label,
15449
15510
  labelLeadingIcon,
@@ -15456,7 +15517,7 @@ var ParameterRichText = (0, import_react89.forwardRef)(
15456
15517
  menuItems,
15457
15518
  ...props
15458
15519
  }, ref) => {
15459
- return /* @__PURE__ */ (0, import_jsx_runtime86.jsxs)(
15520
+ return /* @__PURE__ */ (0, import_jsx_runtime87.jsxs)(
15460
15521
  ParameterShell,
15461
15522
  {
15462
15523
  "data-test-id": "parameter-input",
@@ -15469,16 +15530,16 @@ var ParameterRichText = (0, import_react89.forwardRef)(
15469
15530
  captionTestId,
15470
15531
  menuItems,
15471
15532
  children: [
15472
- /* @__PURE__ */ (0, import_jsx_runtime86.jsx)(ParameterRichTextInner, { ref, ...props }),
15473
- menuItems ? /* @__PURE__ */ (0, import_jsx_runtime86.jsx)(ParameterMenuButton, { label: `${label} menu`, children: /* @__PURE__ */ (0, import_jsx_runtime86.jsx)(import_jsx_runtime86.Fragment, { children: menuItems }) }) : null
15533
+ /* @__PURE__ */ (0, import_jsx_runtime87.jsx)(ParameterRichTextInner, { ref, ...props }),
15534
+ menuItems ? /* @__PURE__ */ (0, import_jsx_runtime87.jsx)(ParameterMenuButton, { label: `${label} menu`, children: /* @__PURE__ */ (0, import_jsx_runtime87.jsx)(import_jsx_runtime87.Fragment, { children: menuItems }) }) : null
15474
15535
  ]
15475
15536
  }
15476
15537
  );
15477
15538
  }
15478
15539
  );
15479
- var ParameterRichTextInner = (0, import_react89.forwardRef)(({ ...props }, ref) => {
15540
+ var ParameterRichTextInner = (0, import_react92.forwardRef)(({ ...props }, ref) => {
15480
15541
  const { id, label, hiddenLabel } = useParameterShell();
15481
- return /* @__PURE__ */ (0, import_jsx_runtime86.jsx)(
15542
+ return /* @__PURE__ */ (0, import_jsx_runtime87.jsx)(
15482
15543
  "textarea",
15483
15544
  {
15484
15545
  css: [input2, textarea2],
@@ -15491,18 +15552,18 @@ var ParameterRichTextInner = (0, import_react89.forwardRef)(({ ...props }, ref)
15491
15552
  });
15492
15553
 
15493
15554
  // src/components/ParameterInputs/ParameterSelect.tsx
15494
- var import_react90 = require("react");
15495
- var import_jsx_runtime87 = require("@emotion/react/jsx-runtime");
15496
- var ParameterSelect = (0, import_react90.forwardRef)(
15555
+ var import_react93 = require("react");
15556
+ var import_jsx_runtime88 = require("@emotion/react/jsx-runtime");
15557
+ var ParameterSelect = (0, import_react93.forwardRef)(
15497
15558
  ({ defaultOption, options, ...props }, ref) => {
15498
15559
  const { shellProps, innerProps } = extractParameterProps(props);
15499
- return /* @__PURE__ */ (0, import_jsx_runtime87.jsx)(ParameterShell, { ...shellProps, children: /* @__PURE__ */ (0, import_jsx_runtime87.jsx)(ParameterSelectInner, { options, defaultOption, ...innerProps, ref }) });
15560
+ return /* @__PURE__ */ (0, import_jsx_runtime88.jsx)(ParameterShell, { ...shellProps, children: /* @__PURE__ */ (0, import_jsx_runtime88.jsx)(ParameterSelectInner, { options, defaultOption, ...innerProps, ref }) });
15500
15561
  }
15501
15562
  );
15502
- var ParameterSelectInner = (0, import_react90.forwardRef)(
15563
+ var ParameterSelectInner = (0, import_react93.forwardRef)(
15503
15564
  ({ defaultOption, options, ...props }, ref) => {
15504
15565
  const { id, label, hiddenLabel } = useParameterShell();
15505
- return /* @__PURE__ */ (0, import_jsx_runtime87.jsxs)(
15566
+ return /* @__PURE__ */ (0, import_jsx_runtime88.jsxs)(
15506
15567
  "select",
15507
15568
  {
15508
15569
  css: [input2, selectInput],
@@ -15511,10 +15572,10 @@ var ParameterSelectInner = (0, import_react90.forwardRef)(
15511
15572
  ref,
15512
15573
  ...props,
15513
15574
  children: [
15514
- defaultOption ? /* @__PURE__ */ (0, import_jsx_runtime87.jsx)("option", { value: "", children: defaultOption }) : null,
15575
+ defaultOption ? /* @__PURE__ */ (0, import_jsx_runtime88.jsx)("option", { value: "", children: defaultOption }) : null,
15515
15576
  options.map((option) => {
15516
15577
  var _a;
15517
- return /* @__PURE__ */ (0, import_jsx_runtime87.jsx)("option", { value: (_a = option.value) != null ? _a : option.label, children: option.label }, option.label);
15578
+ return /* @__PURE__ */ (0, import_jsx_runtime88.jsx)("option", { value: (_a = option.value) != null ? _a : option.label, children: option.label }, option.label);
15518
15579
  })
15519
15580
  ]
15520
15581
  }
@@ -15523,15 +15584,15 @@ var ParameterSelectInner = (0, import_react90.forwardRef)(
15523
15584
  );
15524
15585
 
15525
15586
  // src/components/ParameterInputs/ParameterTextarea.tsx
15526
- var import_react91 = require("react");
15527
- var import_jsx_runtime88 = require("@emotion/react/jsx-runtime");
15528
- var ParameterTextarea = (0, import_react91.forwardRef)((props, ref) => {
15587
+ var import_react94 = require("react");
15588
+ var import_jsx_runtime89 = require("@emotion/react/jsx-runtime");
15589
+ var ParameterTextarea = (0, import_react94.forwardRef)((props, ref) => {
15529
15590
  const { shellProps, innerProps } = extractParameterProps(props);
15530
- return /* @__PURE__ */ (0, import_jsx_runtime88.jsx)(ParameterShell, { "data-test-id": "parameter-textarea", ...shellProps, children: /* @__PURE__ */ (0, import_jsx_runtime88.jsx)(ParameterTextareaInner, { ref, ...innerProps }) });
15591
+ return /* @__PURE__ */ (0, import_jsx_runtime89.jsx)(ParameterShell, { "data-test-id": "parameter-textarea", ...shellProps, children: /* @__PURE__ */ (0, import_jsx_runtime89.jsx)(ParameterTextareaInner, { ref, ...innerProps }) });
15531
15592
  });
15532
- var ParameterTextareaInner = (0, import_react91.forwardRef)(({ ...props }, ref) => {
15593
+ var ParameterTextareaInner = (0, import_react94.forwardRef)(({ ...props }, ref) => {
15533
15594
  const { id, label, hiddenLabel } = useParameterShell();
15534
- return /* @__PURE__ */ (0, import_jsx_runtime88.jsx)(
15595
+ return /* @__PURE__ */ (0, import_jsx_runtime89.jsx)(
15535
15596
  "textarea",
15536
15597
  {
15537
15598
  css: [input2, textarea2],
@@ -15544,18 +15605,18 @@ var ParameterTextareaInner = (0, import_react91.forwardRef)(({ ...props }, ref)
15544
15605
  });
15545
15606
 
15546
15607
  // src/components/ParameterInputs/ParameterToggle.tsx
15547
- var import_react92 = require("react");
15548
- var import_jsx_runtime89 = require("@emotion/react/jsx-runtime");
15549
- var ParameterToggle = (0, import_react92.forwardRef)((props, ref) => {
15608
+ var import_react95 = require("react");
15609
+ var import_jsx_runtime90 = require("@emotion/react/jsx-runtime");
15610
+ var ParameterToggle = (0, import_react95.forwardRef)((props, ref) => {
15550
15611
  const { shellProps, innerProps } = extractParameterProps(props);
15551
- return /* @__PURE__ */ (0, import_jsx_runtime89.jsx)(ParameterShell, { ...shellProps, children: /* @__PURE__ */ (0, import_jsx_runtime89.jsx)(ParameterToggleInner, { ref, ...innerProps }) });
15612
+ return /* @__PURE__ */ (0, import_jsx_runtime90.jsx)(ParameterShell, { ...shellProps, children: /* @__PURE__ */ (0, import_jsx_runtime90.jsx)(ParameterToggleInner, { ref, ...innerProps }) });
15552
15613
  });
15553
- var ParameterToggleInner = (0, import_react92.forwardRef)(
15614
+ var ParameterToggleInner = (0, import_react95.forwardRef)(
15554
15615
  ({ ...props }, ref) => {
15555
15616
  const { id, label } = useParameterShell();
15556
- return /* @__PURE__ */ (0, import_jsx_runtime89.jsxs)("label", { css: inputToggleLabel2, children: [
15557
- /* @__PURE__ */ (0, import_jsx_runtime89.jsx)("input", { css: toggleInput2, type: props.type, id, ref, ...props }),
15558
- /* @__PURE__ */ (0, import_jsx_runtime89.jsx)("span", { css: inlineLabel2, children: label })
15617
+ return /* @__PURE__ */ (0, import_jsx_runtime90.jsxs)("label", { css: inputToggleLabel2, children: [
15618
+ /* @__PURE__ */ (0, import_jsx_runtime90.jsx)("input", { css: toggleInput2, type: props.type, id, ref, ...props }),
15619
+ /* @__PURE__ */ (0, import_jsx_runtime90.jsx)("span", { css: inlineLabel2, children: label })
15559
15620
  ] });
15560
15621
  }
15561
15622
  );
@@ -15565,13 +15626,13 @@ var import_Popover = require("reakit/Popover");
15565
15626
  var import_Portal2 = require("reakit/Portal");
15566
15627
 
15567
15628
  // src/components/Popover/Popover.styles.ts
15568
- var import_react93 = require("@emotion/react");
15569
- var PopoverBtn = import_react93.css`
15629
+ var import_react96 = require("@emotion/react");
15630
+ var PopoverBtn = import_react96.css`
15570
15631
  border: none;
15571
15632
  background: none;
15572
15633
  padding: 0;
15573
15634
  `;
15574
- var Popover = import_react93.css`
15635
+ var Popover = import_react96.css`
15575
15636
  border-left: var(--spacing-xs) solid var(--brand-secondary-3);
15576
15637
  border-radius: var(--rounded-base);
15577
15638
  box-shadow: var(--shadow-base);
@@ -15584,7 +15645,7 @@ var Popover = import_react93.css`
15584
15645
  `;
15585
15646
 
15586
15647
  // src/components/Popover/Popover.tsx
15587
- var import_jsx_runtime90 = require("@emotion/react/jsx-runtime");
15648
+ var import_jsx_runtime91 = require("@emotion/react/jsx-runtime");
15588
15649
  var Popover2 = ({
15589
15650
  iconColor = "action",
15590
15651
  icon = "info",
@@ -15596,38 +15657,38 @@ var Popover2 = ({
15596
15657
  children
15597
15658
  }) => {
15598
15659
  const popover = (0, import_Popover.usePopoverState)({ placement });
15599
- return /* @__PURE__ */ (0, import_jsx_runtime90.jsxs)(import_jsx_runtime90.Fragment, { children: [
15600
- /* @__PURE__ */ (0, import_jsx_runtime90.jsxs)(import_Popover.PopoverDisclosure, { ...popover, css: PopoverBtn, title: buttonText, "data-test-id": testId, children: [
15601
- /* @__PURE__ */ (0, import_jsx_runtime90.jsx)(Icon, { icon, iconColor, size: iconSize }),
15602
- /* @__PURE__ */ (0, import_jsx_runtime90.jsx)("span", { hidden: true, children: buttonText })
15660
+ return /* @__PURE__ */ (0, import_jsx_runtime91.jsxs)(import_jsx_runtime91.Fragment, { children: [
15661
+ /* @__PURE__ */ (0, import_jsx_runtime91.jsxs)(import_Popover.PopoverDisclosure, { ...popover, css: PopoverBtn, title: buttonText, "data-test-id": testId, children: [
15662
+ /* @__PURE__ */ (0, import_jsx_runtime91.jsx)(Icon, { icon, iconColor, size: iconSize }),
15663
+ /* @__PURE__ */ (0, import_jsx_runtime91.jsx)("span", { hidden: true, children: buttonText })
15603
15664
  ] }),
15604
- /* @__PURE__ */ (0, import_jsx_runtime90.jsx)(import_Portal2.Portal, { children: /* @__PURE__ */ (0, import_jsx_runtime90.jsx)(import_Popover.Popover, { css: Popover, ...popover, "aria-label": ariaLabel, children }) })
15665
+ /* @__PURE__ */ (0, import_jsx_runtime91.jsx)(import_Portal2.Portal, { children: /* @__PURE__ */ (0, import_jsx_runtime91.jsx)(import_Popover.Popover, { css: Popover, ...popover, "aria-label": ariaLabel, children }) })
15605
15666
  ] });
15606
15667
  };
15607
15668
 
15608
15669
  // src/components/ProgressList/ProgressList.tsx
15609
- var import_react95 = require("@emotion/react");
15610
- var import_react96 = require("react");
15611
- var import_cg17 = require("react-icons/cg");
15670
+ var import_react98 = require("@emotion/react");
15671
+ var import_react99 = require("react");
15672
+ var import_cg18 = require("react-icons/cg");
15612
15673
 
15613
15674
  // src/components/ProgressList/styles/ProgressList.styles.ts
15614
- var import_react94 = require("@emotion/react");
15615
- var progressListStyles = import_react94.css`
15675
+ var import_react97 = require("@emotion/react");
15676
+ var progressListStyles = import_react97.css`
15616
15677
  display: flex;
15617
15678
  flex-direction: column;
15618
15679
  gap: var(--spacing-sm);
15619
15680
  list-style-type: none;
15620
15681
  `;
15621
- var progressListItemStyles = import_react94.css`
15682
+ var progressListItemStyles = import_react97.css`
15622
15683
  display: flex;
15623
15684
  gap: var(--spacing-base);
15624
15685
  align-items: center;
15625
15686
  `;
15626
15687
 
15627
15688
  // src/components/ProgressList/ProgressList.tsx
15628
- var import_jsx_runtime91 = require("@emotion/react/jsx-runtime");
15689
+ var import_jsx_runtime92 = require("@emotion/react/jsx-runtime");
15629
15690
  var ProgressList = ({ inProgressId, items, autoEllipsis, ...htmlProps }) => {
15630
- const itemsWithStatus = (0, import_react96.useMemo)(() => {
15691
+ const itemsWithStatus = (0, import_react99.useMemo)(() => {
15631
15692
  const indexOfInProgressItem = items.findIndex(({ id }) => id === inProgressId);
15632
15693
  return items.map((item, index) => {
15633
15694
  let status = "queued";
@@ -15639,8 +15700,8 @@ var ProgressList = ({ inProgressId, items, autoEllipsis, ...htmlProps }) => {
15639
15700
  return { ...item, status };
15640
15701
  });
15641
15702
  }, [items, inProgressId]);
15642
- return /* @__PURE__ */ (0, import_jsx_runtime91.jsx)("ol", { css: progressListStyles, ...htmlProps, children: itemsWithStatus.map(({ id, label, status, error, errorLevel }) => {
15643
- return /* @__PURE__ */ (0, import_jsx_runtime91.jsx)(
15703
+ return /* @__PURE__ */ (0, import_jsx_runtime92.jsx)("ol", { css: progressListStyles, ...htmlProps, children: itemsWithStatus.map(({ id, label, status, error, errorLevel }) => {
15704
+ return /* @__PURE__ */ (0, import_jsx_runtime92.jsx)(
15644
15705
  ProgressListItem,
15645
15706
  {
15646
15707
  status,
@@ -15660,25 +15721,25 @@ var ProgressListItem = ({
15660
15721
  errorLevel = "danger",
15661
15722
  autoEllipsis = false
15662
15723
  }) => {
15663
- const Icon2 = (0, import_react96.useMemo)(() => {
15724
+ const Icon2 = (0, import_react99.useMemo)(() => {
15664
15725
  if (error) {
15665
15726
  return warningIcon;
15666
15727
  }
15667
15728
  const iconPerStatus = {
15668
- completed: import_cg17.CgCheckO,
15669
- inProgress: import_cg17.CgRecord,
15670
- queued: import_cg17.CgRadioCheck
15729
+ completed: import_cg18.CgCheckO,
15730
+ inProgress: import_cg18.CgRecord,
15731
+ queued: import_cg18.CgRadioCheck
15671
15732
  };
15672
15733
  return iconPerStatus[status];
15673
15734
  }, [status, error]);
15674
- const statusStyles = (0, import_react96.useMemo)(() => {
15735
+ const statusStyles = (0, import_react99.useMemo)(() => {
15675
15736
  if (error) {
15676
- return errorLevel === "caution" ? import_react95.css`
15737
+ return errorLevel === "caution" ? import_react98.css`
15677
15738
  color: rgb(161, 98, 7);
15678
15739
  & svg {
15679
15740
  color: rgb(250, 204, 21);
15680
15741
  }
15681
- ` : import_react95.css`
15742
+ ` : import_react98.css`
15682
15743
  color: rgb(185, 28, 28);
15683
15744
  & svg {
15684
15745
  color: var(--brand-primary-2);
@@ -15686,35 +15747,35 @@ var ProgressListItem = ({
15686
15747
  `;
15687
15748
  }
15688
15749
  const colorPerStatus = {
15689
- completed: import_react95.css`
15750
+ completed: import_react98.css`
15690
15751
  opacity: 0.75;
15691
15752
  `,
15692
- inProgress: import_react95.css`
15753
+ inProgress: import_react98.css`
15693
15754
  -webkit-text-stroke-width: thin;
15694
15755
  `,
15695
- queued: import_react95.css`
15756
+ queued: import_react98.css`
15696
15757
  opacity: 0.5;
15697
15758
  `
15698
15759
  };
15699
15760
  return colorPerStatus[status];
15700
15761
  }, [status, error, errorLevel]);
15701
- return /* @__PURE__ */ (0, import_jsx_runtime91.jsxs)("li", { css: [progressListItemStyles, statusStyles], children: [
15702
- /* @__PURE__ */ (0, import_jsx_runtime91.jsx)(Tooltip, { title: error != null ? error : "", children: /* @__PURE__ */ (0, import_jsx_runtime91.jsx)("div", { children: /* @__PURE__ */ (0, import_jsx_runtime91.jsx)(Icon2, { size: 20 }) }) }),
15703
- /* @__PURE__ */ (0, import_jsx_runtime91.jsxs)("div", { children: [
15762
+ return /* @__PURE__ */ (0, import_jsx_runtime92.jsxs)("li", { css: [progressListItemStyles, statusStyles], children: [
15763
+ /* @__PURE__ */ (0, import_jsx_runtime92.jsx)(Tooltip, { title: error != null ? error : "", children: /* @__PURE__ */ (0, import_jsx_runtime92.jsx)("div", { children: /* @__PURE__ */ (0, import_jsx_runtime92.jsx)(Icon2, { size: 20 }) }) }),
15764
+ /* @__PURE__ */ (0, import_jsx_runtime92.jsxs)("div", { children: [
15704
15765
  children,
15705
- /* @__PURE__ */ (0, import_jsx_runtime91.jsx)("span", { css: { visibility: autoEllipsis && status === "inProgress" && !error ? "visible" : "hidden" }, children: "..." })
15766
+ /* @__PURE__ */ (0, import_jsx_runtime92.jsx)("span", { css: { visibility: autoEllipsis && status === "inProgress" && !error ? "visible" : "hidden" }, children: "..." })
15706
15767
  ] })
15707
15768
  ] });
15708
15769
  };
15709
15770
 
15710
15771
  // src/components/SegmentedControl/SegmentedControl.tsx
15711
- var import_react98 = require("@emotion/react");
15712
- var import_react99 = require("react");
15713
- var import_cg18 = require("react-icons/cg");
15772
+ var import_react101 = require("@emotion/react");
15773
+ var import_react102 = require("react");
15774
+ var import_cg19 = require("react-icons/cg");
15714
15775
 
15715
15776
  // src/components/SegmentedControl/SegmentedControl.styles.ts
15716
- var import_react97 = require("@emotion/react");
15717
- var segmentedControlStyles = import_react97.css`
15777
+ var import_react100 = require("@emotion/react");
15778
+ var segmentedControlStyles = import_react100.css`
15718
15779
  --segmented-control-rounded-value: var(--rounded-base);
15719
15780
  --segmented-control-border-width: 1px;
15720
15781
  --segmented-control-selected-color: var(--brand-secondary-3);
@@ -15733,14 +15794,14 @@ var segmentedControlStyles = import_react97.css`
15733
15794
  border-radius: calc(var(--segmented-control-rounded-value) + var(--segmented-control-border-width));
15734
15795
  font-size: var(--fs-xs);
15735
15796
  `;
15736
- var segmentedControlVerticalStyles = import_react97.css`
15797
+ var segmentedControlVerticalStyles = import_react100.css`
15737
15798
  flex-direction: column;
15738
15799
  --segmented-control-first-border-radius: var(--segmented-control-rounded-value)
15739
15800
  var(--segmented-control-rounded-value) 0 0;
15740
15801
  --segmented-control-last-border-radius: 0 0 var(--segmented-control-rounded-value)
15741
15802
  var(--segmented-control-rounded-value);
15742
15803
  `;
15743
- var segmentedControlItemStyles = import_react97.css`
15804
+ var segmentedControlItemStyles = import_react100.css`
15744
15805
  &:first-of-type label {
15745
15806
  border-radius: var(--segmented-control-first-border-radius);
15746
15807
  }
@@ -15748,10 +15809,10 @@ var segmentedControlItemStyles = import_react97.css`
15748
15809
  border-radius: var(--segmented-control-last-border-radius);
15749
15810
  }
15750
15811
  `;
15751
- var segmentedControlInputStyles = import_react97.css`
15812
+ var segmentedControlInputStyles = import_react100.css`
15752
15813
  ${accessibleHidden}
15753
15814
  `;
15754
- var segmentedControlLabelStyles = import_react97.css`
15815
+ var segmentedControlLabelStyles = import_react100.css`
15755
15816
  position: relative;
15756
15817
  display: flex;
15757
15818
  align-items: center;
@@ -15788,23 +15849,23 @@ var segmentedControlLabelStyles = import_react97.css`
15788
15849
  background-color: var(--gray-400);
15789
15850
  }
15790
15851
  `;
15791
- var segmentedControlLabelIconOnlyStyles = import_react97.css`
15852
+ var segmentedControlLabelIconOnlyStyles = import_react100.css`
15792
15853
  padding-inline: 0.5em;
15793
15854
  `;
15794
- var segmentedControlLabelCheckStyles = import_react97.css`
15855
+ var segmentedControlLabelCheckStyles = import_react100.css`
15795
15856
  opacity: 0.5;
15796
15857
  `;
15797
- var segmentedControlLabelContentStyles = import_react97.css`
15858
+ var segmentedControlLabelContentStyles = import_react100.css`
15798
15859
  display: flex;
15799
15860
  align-items: center;
15800
15861
  justify-content: center;
15801
15862
  gap: var(--spacing-sm);
15802
15863
  height: 100%;
15803
15864
  `;
15804
- var segmentedControlLabelTextStyles = import_react97.css``;
15865
+ var segmentedControlLabelTextStyles = import_react100.css``;
15805
15866
 
15806
15867
  // src/components/SegmentedControl/SegmentedControl.tsx
15807
- var import_jsx_runtime92 = require("@emotion/react/jsx-runtime");
15868
+ var import_jsx_runtime93 = require("@emotion/react/jsx-runtime");
15808
15869
  var SegmentedControl = ({
15809
15870
  name,
15810
15871
  options,
@@ -15816,7 +15877,7 @@ var SegmentedControl = ({
15816
15877
  size = "md",
15817
15878
  ...props
15818
15879
  }) => {
15819
- const onOptionChange = (0, import_react99.useCallback)(
15880
+ const onOptionChange = (0, import_react102.useCallback)(
15820
15881
  (event) => {
15821
15882
  if (event.target.checked) {
15822
15883
  onChange == null ? void 0 : onChange(options[parseInt(event.target.value)].value);
@@ -15824,18 +15885,18 @@ var SegmentedControl = ({
15824
15885
  },
15825
15886
  [options, onChange]
15826
15887
  );
15827
- const sizeStyles = (0, import_react99.useMemo)(() => {
15888
+ const sizeStyles = (0, import_react102.useMemo)(() => {
15828
15889
  const map = {
15829
- sm: (0, import_react98.css)({ height: "calc(24px - 2px)", fontSize: "var(--fs-xs)" }),
15830
- md: (0, import_react98.css)({ height: "calc(32px - 2px)", fontSize: "var(--fs-sm)" }),
15831
- lg: (0, import_react98.css)({ height: "calc(40px - 2px)", fontSize: "var(--fs-base)" })
15890
+ sm: (0, import_react101.css)({ height: "calc(24px - 2px)", fontSize: "var(--fs-xs)" }),
15891
+ md: (0, import_react101.css)({ height: "calc(32px - 2px)", fontSize: "var(--fs-sm)" }),
15892
+ lg: (0, import_react101.css)({ height: "calc(40px - 2px)", fontSize: "var(--fs-base)" })
15832
15893
  };
15833
15894
  return map[size];
15834
15895
  }, [size]);
15835
- const isIconOnly = (0, import_react99.useMemo)(() => {
15896
+ const isIconOnly = (0, import_react102.useMemo)(() => {
15836
15897
  return options.every((option) => option.icon && !option.label);
15837
15898
  }, [options]);
15838
- return /* @__PURE__ */ (0, import_jsx_runtime92.jsx)(
15899
+ return /* @__PURE__ */ (0, import_jsx_runtime93.jsx)(
15839
15900
  "div",
15840
15901
  {
15841
15902
  css: [segmentedControlStyles, orientation === "vertical" ? segmentedControlVerticalStyles : void 0],
@@ -15843,11 +15904,11 @@ var SegmentedControl = ({
15843
15904
  children: options.map((option, index) => {
15844
15905
  const text = option.label ? option.label : option.icon ? null : String(option.value);
15845
15906
  const isDisabled = disabled || option.disabled;
15846
- return /* @__PURE__ */ (0, import_jsx_runtime92.jsx)(
15907
+ return /* @__PURE__ */ (0, import_jsx_runtime93.jsx)(
15847
15908
  Tooltip,
15848
15909
  {
15849
15910
  title: isDisabled || !option.tooltip ? "" : option.tooltip,
15850
- children: /* @__PURE__ */ (0, import_jsx_runtime92.jsx)("div", { css: segmentedControlItemStyles, "data-test-id": "container-segmented-control", children: /* @__PURE__ */ (0, import_jsx_runtime92.jsxs)(
15911
+ children: /* @__PURE__ */ (0, import_jsx_runtime93.jsx)("div", { css: segmentedControlItemStyles, "data-test-id": "container-segmented-control", children: /* @__PURE__ */ (0, import_jsx_runtime93.jsxs)(
15851
15912
  "label",
15852
15913
  {
15853
15914
  css: [
@@ -15856,7 +15917,7 @@ var SegmentedControl = ({
15856
15917
  isIconOnly ? segmentedControlLabelIconOnlyStyles : void 0
15857
15918
  ],
15858
15919
  children: [
15859
- /* @__PURE__ */ (0, import_jsx_runtime92.jsx)(
15920
+ /* @__PURE__ */ (0, import_jsx_runtime93.jsx)(
15860
15921
  "input",
15861
15922
  {
15862
15923
  css: segmentedControlInputStyles,
@@ -15868,10 +15929,10 @@ var SegmentedControl = ({
15868
15929
  disabled: isDisabled
15869
15930
  }
15870
15931
  ),
15871
- option.value !== value || noCheckmark ? null : /* @__PURE__ */ (0, import_jsx_runtime92.jsx)(import_cg18.CgCheck, { css: segmentedControlLabelCheckStyles, "aria-label": "Selected", size: "1.5em" }),
15872
- /* @__PURE__ */ (0, import_jsx_runtime92.jsxs)("span", { css: segmentedControlLabelContentStyles, children: [
15873
- !option.icon ? null : /* @__PURE__ */ (0, import_jsx_runtime92.jsx)(option.icon, { size: "1.5em" }),
15874
- !text ? null : /* @__PURE__ */ (0, import_jsx_runtime92.jsx)("span", { css: segmentedControlLabelTextStyles, children: text })
15932
+ option.value !== value || noCheckmark ? null : /* @__PURE__ */ (0, import_jsx_runtime93.jsx)(import_cg19.CgCheck, { css: segmentedControlLabelCheckStyles, "aria-label": "Selected", size: "1.5em" }),
15933
+ /* @__PURE__ */ (0, import_jsx_runtime93.jsxs)("span", { css: segmentedControlLabelContentStyles, children: [
15934
+ !option.icon ? null : /* @__PURE__ */ (0, import_jsx_runtime93.jsx)(option.icon, { size: "1.5em" }),
15935
+ !text ? null : /* @__PURE__ */ (0, import_jsx_runtime93.jsx)("span", { css: segmentedControlLabelTextStyles, children: text })
15875
15936
  ] })
15876
15937
  ]
15877
15938
  }
@@ -15885,18 +15946,18 @@ var SegmentedControl = ({
15885
15946
  };
15886
15947
 
15887
15948
  // src/components/Skeleton/Skeleton.styles.ts
15888
- var import_react100 = require("@emotion/react");
15889
- var lightFadingOut = import_react100.keyframes`
15949
+ var import_react103 = require("@emotion/react");
15950
+ var lightFadingOut = import_react103.keyframes`
15890
15951
  from { opacity: 0.1; }
15891
15952
  to { opacity: 0.025; }
15892
15953
  `;
15893
- var skeletonStyles = import_react100.css`
15954
+ var skeletonStyles = import_react103.css`
15894
15955
  animation: ${lightFadingOut} 1s ease-out infinite alternate;
15895
15956
  background-color: var(--gray-900);
15896
15957
  `;
15897
15958
 
15898
15959
  // src/components/Skeleton/Skeleton.tsx
15899
- var import_jsx_runtime93 = require("@emotion/react/jsx-runtime");
15960
+ var import_jsx_runtime94 = require("@emotion/react/jsx-runtime");
15900
15961
  var Skeleton = ({
15901
15962
  width = "100%",
15902
15963
  height = "1.25rem",
@@ -15904,7 +15965,7 @@ var Skeleton = ({
15904
15965
  circle = false,
15905
15966
  children,
15906
15967
  ...otherProps
15907
- }) => /* @__PURE__ */ (0, import_jsx_runtime93.jsx)(
15968
+ }) => /* @__PURE__ */ (0, import_jsx_runtime94.jsx)(
15908
15969
  "div",
15909
15970
  {
15910
15971
  css: [
@@ -15927,8 +15988,8 @@ var Skeleton = ({
15927
15988
  var React19 = __toESM(require("react"));
15928
15989
 
15929
15990
  // src/components/Switch/Switch.styles.ts
15930
- var import_react101 = require("@emotion/react");
15931
- var SwitchInputContainer = import_react101.css`
15991
+ var import_react104 = require("@emotion/react");
15992
+ var SwitchInputContainer = import_react104.css`
15932
15993
  cursor: pointer;
15933
15994
  display: inline-block;
15934
15995
  position: relative;
@@ -15937,7 +15998,7 @@ var SwitchInputContainer = import_react101.css`
15937
15998
  vertical-align: middle;
15938
15999
  user-select: none;
15939
16000
  `;
15940
- var SwitchInput = import_react101.css`
16001
+ var SwitchInput = import_react104.css`
15941
16002
  appearance: none;
15942
16003
  border-radius: var(--rounded-full);
15943
16004
  background-color: var(--white);
@@ -15975,7 +16036,7 @@ var SwitchInput = import_react101.css`
15975
16036
  cursor: not-allowed;
15976
16037
  }
15977
16038
  `;
15978
- var SwitchInputDisabled = import_react101.css`
16039
+ var SwitchInputDisabled = import_react104.css`
15979
16040
  opacity: var(--opacity-50);
15980
16041
  cursor: not-allowed;
15981
16042
 
@@ -15983,7 +16044,7 @@ var SwitchInputDisabled = import_react101.css`
15983
16044
  cursor: not-allowed;
15984
16045
  }
15985
16046
  `;
15986
- var SwitchInputLabel = import_react101.css`
16047
+ var SwitchInputLabel = import_react104.css`
15987
16048
  align-items: center;
15988
16049
  color: var(--brand-secondary-1);
15989
16050
  display: inline-flex;
@@ -16005,26 +16066,26 @@ var SwitchInputLabel = import_react101.css`
16005
16066
  top: 0;
16006
16067
  }
16007
16068
  `;
16008
- var SwitchText = import_react101.css`
16069
+ var SwitchText = import_react104.css`
16009
16070
  color: var(--gray-500);
16010
16071
  font-size: var(--fs-sm);
16011
16072
  padding-inline: var(--spacing-2xl) 0;
16012
16073
  `;
16013
16074
 
16014
16075
  // src/components/Switch/Switch.tsx
16015
- var import_jsx_runtime94 = require("@emotion/react/jsx-runtime");
16076
+ var import_jsx_runtime95 = require("@emotion/react/jsx-runtime");
16016
16077
  var Switch = React19.forwardRef(
16017
16078
  ({ label, infoText, toggleText, children, ...inputProps }, ref) => {
16018
16079
  let additionalText = infoText;
16019
16080
  if (infoText && toggleText) {
16020
16081
  additionalText = inputProps.checked ? toggleText : infoText;
16021
16082
  }
16022
- return /* @__PURE__ */ (0, import_jsx_runtime94.jsxs)(import_jsx_runtime94.Fragment, { children: [
16023
- /* @__PURE__ */ (0, import_jsx_runtime94.jsxs)("label", { css: [SwitchInputContainer, inputProps.disabled ? SwitchInputDisabled : void 0], children: [
16024
- /* @__PURE__ */ (0, import_jsx_runtime94.jsx)("input", { type: "checkbox", css: SwitchInput, ...inputProps, ref }),
16025
- /* @__PURE__ */ (0, import_jsx_runtime94.jsx)("span", { css: SwitchInputLabel, children: label })
16083
+ return /* @__PURE__ */ (0, import_jsx_runtime95.jsxs)(import_jsx_runtime95.Fragment, { children: [
16084
+ /* @__PURE__ */ (0, import_jsx_runtime95.jsxs)("label", { css: [SwitchInputContainer, inputProps.disabled ? SwitchInputDisabled : void 0], children: [
16085
+ /* @__PURE__ */ (0, import_jsx_runtime95.jsx)("input", { type: "checkbox", css: SwitchInput, ...inputProps, ref }),
16086
+ /* @__PURE__ */ (0, import_jsx_runtime95.jsx)("span", { css: SwitchInputLabel, children: label })
16026
16087
  ] }),
16027
- additionalText ? /* @__PURE__ */ (0, import_jsx_runtime94.jsx)("p", { css: SwitchText, children: additionalText }) : null,
16088
+ additionalText ? /* @__PURE__ */ (0, import_jsx_runtime95.jsx)("p", { css: SwitchText, children: additionalText }) : null,
16028
16089
  children
16029
16090
  ] });
16030
16091
  }
@@ -16034,74 +16095,74 @@ var Switch = React19.forwardRef(
16034
16095
  var React20 = __toESM(require("react"));
16035
16096
 
16036
16097
  // src/components/Table/Table.styles.ts
16037
- var import_react102 = require("@emotion/react");
16038
- var table = import_react102.css`
16098
+ var import_react105 = require("@emotion/react");
16099
+ var table = import_react105.css`
16039
16100
  border-bottom: 1px solid var(--gray-400);
16040
16101
  border-collapse: collapse;
16041
16102
  min-width: 100%;
16042
16103
  table-layout: auto;
16043
16104
  `;
16044
- var tableHead = import_react102.css`
16105
+ var tableHead = import_react105.css`
16045
16106
  background: var(--gray-100);
16046
16107
  color: var(--brand-secondary-1);
16047
16108
  text-align: left;
16048
16109
  `;
16049
- var tableRow = import_react102.css`
16110
+ var tableRow = import_react105.css`
16050
16111
  border-bottom: 1px solid var(--gray-200);
16051
16112
  `;
16052
- var tableCellHead = import_react102.css`
16113
+ var tableCellHead = import_react105.css`
16053
16114
  font-size: var(--fs-sm);
16054
16115
  padding: var(--spacing-base) var(--spacing-md);
16055
16116
  text-transform: uppercase;
16056
16117
  font-weight: var(--fw-bold);
16057
16118
  `;
16058
- var tableCellData = import_react102.css`
16119
+ var tableCellData = import_react105.css`
16059
16120
  padding: var(--spacing-base) var(--spacing-md);
16060
16121
  `;
16061
16122
 
16062
16123
  // src/components/Table/Table.tsx
16063
- var import_jsx_runtime95 = require("@emotion/react/jsx-runtime");
16124
+ var import_jsx_runtime96 = require("@emotion/react/jsx-runtime");
16064
16125
  var Table = React20.forwardRef(({ children, ...otherProps }, ref) => {
16065
- return /* @__PURE__ */ (0, import_jsx_runtime95.jsx)("table", { ref, css: table, ...otherProps, children });
16126
+ return /* @__PURE__ */ (0, import_jsx_runtime96.jsx)("table", { ref, css: table, ...otherProps, children });
16066
16127
  });
16067
16128
  var TableHead = React20.forwardRef(
16068
16129
  ({ children, ...otherProps }, ref) => {
16069
- return /* @__PURE__ */ (0, import_jsx_runtime95.jsx)("thead", { ref, css: tableHead, ...otherProps, children });
16130
+ return /* @__PURE__ */ (0, import_jsx_runtime96.jsx)("thead", { ref, css: tableHead, ...otherProps, children });
16070
16131
  }
16071
16132
  );
16072
16133
  var TableBody = React20.forwardRef(
16073
16134
  ({ children, ...otherProps }, ref) => {
16074
- return /* @__PURE__ */ (0, import_jsx_runtime95.jsx)("tbody", { ref, ...otherProps, children });
16135
+ return /* @__PURE__ */ (0, import_jsx_runtime96.jsx)("tbody", { ref, ...otherProps, children });
16075
16136
  }
16076
16137
  );
16077
16138
  var TableFoot = React20.forwardRef(
16078
16139
  ({ children, ...otherProps }, ref) => {
16079
- return /* @__PURE__ */ (0, import_jsx_runtime95.jsx)("tfoot", { ref, ...otherProps, children });
16140
+ return /* @__PURE__ */ (0, import_jsx_runtime96.jsx)("tfoot", { ref, ...otherProps, children });
16080
16141
  }
16081
16142
  );
16082
16143
  var TableRow = React20.forwardRef(
16083
16144
  ({ children, ...otherProps }, ref) => {
16084
- return /* @__PURE__ */ (0, import_jsx_runtime95.jsx)("tr", { ref, css: tableRow, ...otherProps, children });
16145
+ return /* @__PURE__ */ (0, import_jsx_runtime96.jsx)("tr", { ref, css: tableRow, ...otherProps, children });
16085
16146
  }
16086
16147
  );
16087
16148
  var TableCellHead = React20.forwardRef(
16088
16149
  ({ children, ...otherProps }, ref) => {
16089
- return /* @__PURE__ */ (0, import_jsx_runtime95.jsx)("th", { ref, css: tableCellHead, ...otherProps, children });
16150
+ return /* @__PURE__ */ (0, import_jsx_runtime96.jsx)("th", { ref, css: tableCellHead, ...otherProps, children });
16090
16151
  }
16091
16152
  );
16092
16153
  var TableCellData = React20.forwardRef(
16093
16154
  ({ children, ...otherProps }, ref) => {
16094
- return /* @__PURE__ */ (0, import_jsx_runtime95.jsx)("td", { ref, css: tableCellData, ...otherProps, children });
16155
+ return /* @__PURE__ */ (0, import_jsx_runtime96.jsx)("td", { ref, css: tableCellData, ...otherProps, children });
16095
16156
  }
16096
16157
  );
16097
16158
 
16098
16159
  // src/components/Tabs/Tabs.tsx
16099
- var import_react104 = require("react");
16160
+ var import_react107 = require("react");
16100
16161
  var import_Tab = require("reakit/Tab");
16101
16162
 
16102
16163
  // src/components/Tabs/Tabs.styles.ts
16103
- var import_react103 = require("@emotion/react");
16104
- var tabButtonStyles = import_react103.css`
16164
+ var import_react106 = require("@emotion/react");
16165
+ var tabButtonStyles = import_react106.css`
16105
16166
  align-items: center;
16106
16167
  border: 0;
16107
16168
  height: 2.5rem;
@@ -16118,30 +16179,30 @@ var tabButtonStyles = import_react103.css`
16118
16179
  box-shadow: inset 0 -2px 0 var(--brand-secondary-3);
16119
16180
  }
16120
16181
  `;
16121
- var tabButtonGroupStyles = import_react103.css`
16182
+ var tabButtonGroupStyles = import_react106.css`
16122
16183
  display: flex;
16123
16184
  gap: var(--spacing-base);
16124
16185
  border-bottom: 1px solid var(--gray-300);
16125
16186
  `;
16126
16187
 
16127
16188
  // src/components/Tabs/Tabs.tsx
16128
- var import_jsx_runtime96 = require("@emotion/react/jsx-runtime");
16129
- var CurrentTabContext = (0, import_react104.createContext)(null);
16189
+ var import_jsx_runtime97 = require("@emotion/react/jsx-runtime");
16190
+ var CurrentTabContext = (0, import_react107.createContext)(null);
16130
16191
  var useCurrentTab = () => {
16131
- const context = (0, import_react104.useContext)(CurrentTabContext);
16192
+ const context = (0, import_react107.useContext)(CurrentTabContext);
16132
16193
  if (!context) {
16133
16194
  throw new Error("This component can only be used inside <Tabs>");
16134
16195
  }
16135
16196
  return context;
16136
16197
  };
16137
16198
  var Tabs = ({ children, onSelectedIdChange, useHashForState, selectedId, ...props }) => {
16138
- const selected = (0, import_react104.useMemo)(() => {
16199
+ const selected = (0, import_react107.useMemo)(() => {
16139
16200
  if (selectedId)
16140
16201
  return selectedId;
16141
16202
  return useHashForState && typeof window !== "undefined" && window.location.hash ? window.location.hash.substring(1) : void 0;
16142
16203
  }, [selectedId, useHashForState]);
16143
16204
  const tab = (0, import_Tab.useTabState)({ ...props, selectedId: selected });
16144
- (0, import_react104.useEffect)(() => {
16205
+ (0, import_react107.useEffect)(() => {
16145
16206
  var _a;
16146
16207
  const selectedValueWithoutNull = (_a = tab.selectedId) != null ? _a : void 0;
16147
16208
  onSelectedIdChange == null ? void 0 : onSelectedIdChange(selectedValueWithoutNull);
@@ -16149,29 +16210,29 @@ var Tabs = ({ children, onSelectedIdChange, useHashForState, selectedId, ...prop
16149
16210
  window.location.hash = selectedValueWithoutNull != null ? selectedValueWithoutNull : "";
16150
16211
  }
16151
16212
  }, [tab.selectedId, onSelectedIdChange, useHashForState]);
16152
- (0, import_react104.useEffect)(() => {
16213
+ (0, import_react107.useEffect)(() => {
16153
16214
  if (selected && selected !== tab.selectedId) {
16154
16215
  tab.setSelectedId(selected);
16155
16216
  }
16156
16217
  }, [selected]);
16157
- return /* @__PURE__ */ (0, import_jsx_runtime96.jsx)(CurrentTabContext.Provider, { value: tab, children });
16218
+ return /* @__PURE__ */ (0, import_jsx_runtime97.jsx)(CurrentTabContext.Provider, { value: tab, children });
16158
16219
  };
16159
16220
  var TabButtonGroup = ({ children, ...props }) => {
16160
16221
  const currentTab = useCurrentTab();
16161
- return /* @__PURE__ */ (0, import_jsx_runtime96.jsx)(import_Tab.TabList, { ...props, ...currentTab, css: tabButtonGroupStyles, children });
16222
+ return /* @__PURE__ */ (0, import_jsx_runtime97.jsx)(import_Tab.TabList, { ...props, ...currentTab, css: tabButtonGroupStyles, children });
16162
16223
  };
16163
16224
  var TabButton = ({ children, id, ...props }) => {
16164
16225
  const currentTab = useCurrentTab();
16165
- return /* @__PURE__ */ (0, import_jsx_runtime96.jsx)(import_Tab.Tab, { type: "button", id, ...currentTab, ...props, css: tabButtonStyles, children });
16226
+ return /* @__PURE__ */ (0, import_jsx_runtime97.jsx)(import_Tab.Tab, { type: "button", id, ...currentTab, ...props, css: tabButtonStyles, children });
16166
16227
  };
16167
16228
  var TabContent = ({ children, ...props }) => {
16168
16229
  const currentTab = useCurrentTab();
16169
- return /* @__PURE__ */ (0, import_jsx_runtime96.jsx)(import_Tab.TabPanel, { ...props, ...currentTab, children });
16230
+ return /* @__PURE__ */ (0, import_jsx_runtime97.jsx)(import_Tab.TabPanel, { ...props, ...currentTab, children });
16170
16231
  };
16171
16232
 
16172
16233
  // src/components/Validation/StatusBullet.styles.ts
16173
- var import_react105 = require("@emotion/react");
16174
- var StatusBulletContainer = import_react105.css`
16234
+ var import_react108 = require("@emotion/react");
16235
+ var StatusBulletContainer = import_react108.css`
16175
16236
  align-items: center;
16176
16237
  align-self: center;
16177
16238
  color: var(--gray-500);
@@ -16188,51 +16249,51 @@ var StatusBulletContainer = import_react105.css`
16188
16249
  display: block;
16189
16250
  }
16190
16251
  `;
16191
- var StatusBulletBase = import_react105.css`
16252
+ var StatusBulletBase = import_react108.css`
16192
16253
  font-size: var(--fs-sm);
16193
16254
  &:before {
16194
16255
  width: var(--fs-xs);
16195
16256
  height: var(--fs-xs);
16196
16257
  }
16197
16258
  `;
16198
- var StatusBulletSmall = import_react105.css`
16259
+ var StatusBulletSmall = import_react108.css`
16199
16260
  font-size: var(--fs-xs);
16200
16261
  &:before {
16201
16262
  width: var(--fs-xxs);
16202
16263
  height: var(--fs-xxs);
16203
16264
  }
16204
16265
  `;
16205
- var StatusDraft = import_react105.css`
16266
+ var StatusDraft = import_react108.css`
16206
16267
  &:before {
16207
16268
  background: var(--white);
16208
16269
  box-shadow: inset 0 0 0 0.125rem var(--primary-action-default);
16209
16270
  }
16210
16271
  `;
16211
- var StatusModified = import_react105.css`
16272
+ var StatusModified = import_react108.css`
16212
16273
  &:before {
16213
16274
  background: linear-gradient(to right, var(--white) 50%, var(--primary-action-default) 50% 100%);
16214
16275
  box-shadow: inset 0 0 0 0.125rem var(--primary-action-default);
16215
16276
  }
16216
16277
  `;
16217
- var StatusError = import_react105.css`
16278
+ var StatusError = import_react108.css`
16218
16279
  color: var(--error);
16219
16280
  &:before {
16220
16281
  background: linear-gradient(120deg, var(--error) 40%, var(--white) 50%, var(--error) 60%);
16221
16282
  }
16222
16283
  `;
16223
- var StatusPublished = import_react105.css`
16284
+ var StatusPublished = import_react108.css`
16224
16285
  &:before {
16225
16286
  background: var(--primary-action-default);
16226
16287
  }
16227
16288
  `;
16228
- var StatusOrphan = import_react105.css`
16289
+ var StatusOrphan = import_react108.css`
16229
16290
  &:before {
16230
16291
  background: var(--brand-secondary-5);
16231
16292
  }
16232
16293
  `;
16233
16294
 
16234
16295
  // src/components/Validation/StatusBullet.tsx
16235
- var import_jsx_runtime97 = require("@emotion/react/jsx-runtime");
16296
+ var import_jsx_runtime98 = require("@emotion/react/jsx-runtime");
16236
16297
  var StatusBullet = ({
16237
16298
  status,
16238
16299
  hideText = false,
@@ -16249,7 +16310,7 @@ var StatusBullet = ({
16249
16310
  Draft: StatusDraft
16250
16311
  };
16251
16312
  const statusSize = size === "base" ? StatusBulletBase : StatusBulletSmall;
16252
- return /* @__PURE__ */ (0, import_jsx_runtime97.jsx)(
16313
+ return /* @__PURE__ */ (0, import_jsx_runtime98.jsx)(
16253
16314
  "span",
16254
16315
  {
16255
16316
  role: "status",
@@ -16362,6 +16423,7 @@ var StatusBullet = ({
16362
16423
  ShortcutRevealer,
16363
16424
  Skeleton,
16364
16425
  StatusBullet,
16426
+ SuccessMessage,
16365
16427
  Switch,
16366
16428
  TabButton,
16367
16429
  TabButtonGroup,