@uniformdev/design-system 20.35.0 → 20.36.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 (5) hide show
  1. package/dist/esm/index.js +561 -414
  2. package/dist/index.d.mts +38 -1
  3. package/dist/index.d.ts +38 -1
  4. package/dist/index.js +725 -574
  5. package/package.json +4 -4
package/dist/esm/index.js CHANGED
@@ -3994,7 +3994,7 @@ var menuItem = (textTheme, forceActive) => css24`
3994
3994
  align-items: center;
3995
3995
  border-radius: var(--rounded-base);
3996
3996
  background: none;
3997
- color: ${textTheme === "base" ? "var(--typography-base)" : textTheme === "accent-alt" ? "var(--accent-alt-dark)" : "var(--brand-secondary-5)"};
3997
+ color: ${textTheme === "base" || textTheme === "accent-alt" ? "var(--typography-base)" : "var(--brand-secondary-5)"};
3998
3998
  display: flex;
3999
3999
  font-weight: var(--fw-regular);
4000
4000
  font-size: var(--menu-item-font-size);
@@ -4013,7 +4013,7 @@ var menuItem = (textTheme, forceActive) => css24`
4013
4013
  }
4014
4014
 
4015
4015
  svg {
4016
- ${textTheme === "red" ? "" : `color: var(--gray-400)`};
4016
+ ${textTheme === "red" ? "" : textTheme === "accent-alt" ? "color: var(--accent-alt-dark);" : `color: var(--gray-400)`};
4017
4017
  width: var(--menu-item-icon-size);
4018
4018
  height: var(--menu-item-icon-size);
4019
4019
  }
@@ -4022,7 +4022,7 @@ var menuItem = (textTheme, forceActive) => css24`
4022
4022
  [aria-selected='true'] {
4023
4023
  background: var(--gray-200);
4024
4024
  svg {
4025
- color: ${textTheme === "red" ? `var(--action-destructive-active)` : `var(--accent-dark-active)`};
4025
+ ${textTheme === "red" ? `color: var(--action-destructive-active);` : textTheme === "accent-alt" ? "color: var(--accent-alt-dark-active);" : `color: var(--accent-dark-active);`}
4026
4026
  }
4027
4027
  }
4028
4028
 
@@ -4032,7 +4032,7 @@ var menuItem = (textTheme, forceActive) => css24`
4032
4032
  ${typeof forceActive === "undefined" ? activeMenuItem : ""}
4033
4033
 
4034
4034
  svg {
4035
- color: ${textTheme === "red" ? `var(--action-destructive-hover)` : `var(--accent-dark-hover)`};
4035
+ ${textTheme === "red" ? `color: var(--action-destructive-hover);` : textTheme === "accent-alt" ? "color: var(--accent-alt-dark-hover);" : `color: var(--accent-dark-hover);`}
4036
4036
  }
4037
4037
  }
4038
4038
 
@@ -4753,15 +4753,15 @@ function InputCreatableComboBox(props) {
4753
4753
  }
4754
4754
  );
4755
4755
  }
4756
- function inputComboBoxStyles(baseStyles) {
4756
+ function inputComboBoxStyles(baseStyles2) {
4757
4757
  return {
4758
- ...baseStyles,
4758
+ ...baseStyles2,
4759
4759
  singleValue: (base, sProps) => {
4760
4760
  var _a;
4761
4761
  return {
4762
4762
  ...base,
4763
4763
  color: "var(--typography-base)",
4764
- ...(_a = baseStyles == null ? void 0 : baseStyles.singleValue) == null ? void 0 : _a.call(baseStyles, base, sProps)
4764
+ ...(_a = baseStyles2 == null ? void 0 : baseStyles2.singleValue) == null ? void 0 : _a.call(baseStyles2, base, sProps)
4765
4765
  };
4766
4766
  },
4767
4767
  valueContainer: (base, sProps) => {
@@ -4770,7 +4770,7 @@ function inputComboBoxStyles(baseStyles) {
4770
4770
  ...base,
4771
4771
  padding: "12px var(--spacing-base) 12px var(--spacing-sm)",
4772
4772
  gap: "2px",
4773
- ...(_a = baseStyles == null ? void 0 : baseStyles.valueContainer) == null ? void 0 : _a.call(baseStyles, base, sProps)
4773
+ ...(_a = baseStyles2 == null ? void 0 : baseStyles2.valueContainer) == null ? void 0 : _a.call(baseStyles2, base, sProps)
4774
4774
  };
4775
4775
  },
4776
4776
  input: (base, sProps) => {
@@ -4783,7 +4783,7 @@ function inputComboBoxStyles(baseStyles) {
4783
4783
  "& > input": {
4784
4784
  boxShadow: "none !important"
4785
4785
  },
4786
- ...(_a = baseStyles == null ? void 0 : baseStyles.input) == null ? void 0 : _a.call(baseStyles, base, sProps)
4786
+ ...(_a = baseStyles2 == null ? void 0 : baseStyles2.input) == null ? void 0 : _a.call(baseStyles2, base, sProps)
4787
4787
  };
4788
4788
  },
4789
4789
  menu: (base, state) => {
@@ -4791,7 +4791,7 @@ function inputComboBoxStyles(baseStyles) {
4791
4791
  return {
4792
4792
  ...base,
4793
4793
  zIndex: "var(--z-20)",
4794
- ...(_a = baseStyles == null ? void 0 : baseStyles.menu) == null ? void 0 : _a.call(baseStyles, base, state)
4794
+ ...(_a = baseStyles2 == null ? void 0 : baseStyles2.menu) == null ? void 0 : _a.call(baseStyles2, base, state)
4795
4795
  };
4796
4796
  },
4797
4797
  control: (base, state) => {
@@ -4823,7 +4823,7 @@ function inputComboBoxStyles(baseStyles) {
4823
4823
  },
4824
4824
  ...state.isFocused ? { borderColor: "var(--gray-300)" } : {}
4825
4825
  },
4826
- ...(_a = baseStyles == null ? void 0 : baseStyles.control) == null ? void 0 : _a.call(baseStyles, base, state)
4826
+ ...(_a = baseStyles2 == null ? void 0 : baseStyles2.control) == null ? void 0 : _a.call(baseStyles2, base, state)
4827
4827
  };
4828
4828
  },
4829
4829
  indicatorsContainer: (base, state) => {
@@ -4843,14 +4843,14 @@ function inputComboBoxStyles(baseStyles) {
4843
4843
  "& svg": {
4844
4844
  display: "none"
4845
4845
  },
4846
- ...(_a = baseStyles == null ? void 0 : baseStyles.indicatorsContainer) == null ? void 0 : _a.call(baseStyles, base, state)
4846
+ ...(_a = baseStyles2 == null ? void 0 : baseStyles2.indicatorsContainer) == null ? void 0 : _a.call(baseStyles2, base, state)
4847
4847
  };
4848
4848
  },
4849
4849
  indicatorSeparator: (base, state) => {
4850
4850
  var _a;
4851
4851
  return {
4852
4852
  display: "none",
4853
- ...(_a = baseStyles == null ? void 0 : baseStyles.indicatorSeparator) == null ? void 0 : _a.call(baseStyles, base, state)
4853
+ ...(_a = baseStyles2 == null ? void 0 : baseStyles2.indicatorSeparator) == null ? void 0 : _a.call(baseStyles2, base, state)
4854
4854
  };
4855
4855
  },
4856
4856
  option: (base, state) => {
@@ -4861,7 +4861,7 @@ function inputComboBoxStyles(baseStyles) {
4861
4861
  color: state.isDisabled ? "var(--gray-300)" : "var(--gray-700)",
4862
4862
  paddingLeft: isIndented ? "var(--spacing-md)" : "",
4863
4863
  backgroundColor: state.isDisabled ? "transparent" : state.isSelected ? "var(--gray-200)" : state.isFocused ? "var(--gray-100)" : "transparent",
4864
- ...(_a = baseStyles == null ? void 0 : baseStyles.option) == null ? void 0 : _a.call(baseStyles, base, state)
4864
+ ...(_a = baseStyles2 == null ? void 0 : baseStyles2.option) == null ? void 0 : _a.call(baseStyles2, base, state)
4865
4865
  };
4866
4866
  },
4867
4867
  multiValue: (styles) => {
@@ -10331,7 +10331,7 @@ var LoadingOverlay = ({
10331
10331
  var LoadingAnimation = ({
10332
10332
  label,
10333
10333
  width,
10334
- css: css110,
10334
+ css: css111,
10335
10335
  isPaused
10336
10336
  }) => {
10337
10337
  return /* @__PURE__ */ jsxs66(
@@ -10342,7 +10342,7 @@ var LoadingAnimation = ({
10342
10342
  width: typeof width === "number" ? `${width}px` : width,
10343
10343
  height: typeof width === "number" ? `${width}px` : width
10344
10344
  },
10345
- css: [loaderAnimationContainer, css110],
10345
+ css: [loaderAnimationContainer, css111],
10346
10346
  className: `loader-container${isPaused ? " paused" : ""}`,
10347
10347
  children: [
10348
10348
  /* @__PURE__ */ jsxs66("div", { className: "bottom-cubes", children: [
@@ -11497,21 +11497,130 @@ var LabelLeadingIcon = ({
11497
11497
  ) });
11498
11498
  };
11499
11499
 
11500
- // src/components/ParameterInputs/styles/ParameterDrawerHeader.styles.ts
11500
+ // src/components/ParameterInputs/ParameterActionButton.tsx
11501
+ import React18 from "react";
11502
+
11503
+ // src/components/ParameterInputs/styles/ParameterActionButton.styles.ts
11501
11504
  import { css as css87 } from "@emotion/react";
11502
- var ParameterDrawerHeaderContainer = css87`
11505
+ var baseStyles = css87`
11506
+ --hover-color: var(--accent-dark-hover);
11507
+ --active-color: var(--accent-dark-active);
11508
+ border: 1px solid transparent;
11509
+ border-radius: var(--rounded-base);
11510
+ display: flex;
11511
+ align-items: center;
11512
+ justify-content: center;
11513
+ max-width: fit-content;
11514
+ padding: 0.125rem;
11515
+ transition:
11516
+ border-color var(--duration-fast) var(--timing-ease-out),
11517
+ background var(--duration-fast) var(--timing-ease-out),
11518
+ color var(--duration-fast) var(--timing-ease-out),
11519
+ box-shadow var(--duration-fast) var(--timing-ease-out);
11520
+ min-height: 1.125rem;
11521
+ min-width: 1.125rem;
11522
+ font-size: 0.75rem;
11523
+
11524
+ &:disabled,
11525
+ &[aria-disabled='true'] {
11526
+ opacity: 0.5;
11527
+ cursor: default;
11528
+ }
11529
+ `;
11530
+ var solidHoverStyles = css87`
11531
+ --text-color: var(--typography-inverted);
11532
+ &:hover,
11533
+ &:focus,
11534
+ &:focus-within {
11535
+ border-color: var(--hover-color);
11536
+ background: var(--hover-color);
11537
+ color: var(--text-color);
11538
+ }
11539
+
11540
+ &:active,
11541
+ &[aria-pressed='true'] {
11542
+ border-color: var(--active-color);
11543
+ background: var(--active-color);
11544
+ color: var(--text-color);
11545
+ }
11546
+ `;
11547
+ var outlineHoverStyles = css87`
11548
+ --text-color: var(--typography-light);
11549
+ &:hover:not([aria-disabled='true']),
11550
+ &:focus:not([aria-disabled='true']),
11551
+ &:focus-within:not([aria-disabled='true']) {
11552
+ background: var(--gray-50);
11553
+ border-color: var(--hover-color);
11554
+ }
11555
+ &:active:not([aria-disabled='true']),
11556
+ &[aria-pressed='true']:not([aria-disabled='true']) {
11557
+ border-color: var(--active-color);
11558
+ }
11559
+ `;
11560
+ var invertedStyles = css87`
11561
+ --text-color: var(--typography-inverted);
11562
+ box-shadow: inset 0 0 0 1px transparent;
11563
+ &:hover,
11564
+ &:focus,
11565
+ &:focus-within {
11566
+ box-shadow: inset 0 0 0 1px var(--text-color);
11567
+ color: var(--text-color);
11568
+ }
11569
+ &:active,
11570
+ &[aria-pressed='true'] {
11571
+ background: var(--active-color);
11572
+ border-color: var(--active-color);
11573
+ }
11574
+ `;
11575
+
11576
+ // src/components/ParameterInputs/ParameterActionButton.tsx
11577
+ import { jsx as jsx115 } from "@emotion/react/jsx-runtime";
11578
+ var ParameterActionButton = ({
11579
+ children,
11580
+ themeType,
11581
+ tooltip,
11582
+ renderAs = "button",
11583
+ disabled: disabled2,
11584
+ ...props
11585
+ }) => {
11586
+ const shouldApplyInverted = themeType === "filled" && "inverted" in props && props.inverted;
11587
+ const ComponentWrapper = renderAs === "div" ? "div" : "button";
11588
+ const buttonElement = /* @__PURE__ */ jsx115(
11589
+ ComponentWrapper,
11590
+ {
11591
+ css: [
11592
+ baseStyles,
11593
+ themeType === "filled" ? solidHoverStyles : outlineHoverStyles,
11594
+ shouldApplyInverted ? invertedStyles : null
11595
+ ],
11596
+ ...renderAs === "button" && { type: "button" },
11597
+ ...shouldApplyInverted && { "data-inverted": true },
11598
+ ...disabled2 && { "aria-disabled": true },
11599
+ ...props,
11600
+ children
11601
+ }
11602
+ );
11603
+ if (tooltip && (typeof tooltip === "string" || React18.isValidElement(tooltip))) {
11604
+ return /* @__PURE__ */ jsx115(Tooltip, { title: tooltip, children: buttonElement });
11605
+ }
11606
+ return buttonElement;
11607
+ };
11608
+
11609
+ // src/components/ParameterInputs/styles/ParameterDrawerHeader.styles.ts
11610
+ import { css as css88 } from "@emotion/react";
11611
+ var ParameterDrawerHeaderContainer = css88`
11503
11612
  align-items: center;
11504
11613
  display: flex;
11505
11614
  gap: var(--spacing-base);
11506
11615
  justify-content: space-between;
11507
11616
  margin-bottom: var(--spacing-sm);
11508
11617
  `;
11509
- var ParameterDrawerHeaderTitleGroup = css87`
11618
+ var ParameterDrawerHeaderTitleGroup = css88`
11510
11619
  align-items: center;
11511
11620
  display: flex;
11512
11621
  gap: var(--spacing-sm);
11513
11622
  `;
11514
- var ParameterDrawerHeaderTitle = css87`
11623
+ var ParameterDrawerHeaderTitle = css88`
11515
11624
  text-overflow: ellipsis;
11516
11625
  white-space: nowrap;
11517
11626
  overflow: hidden;
@@ -11519,12 +11628,12 @@ var ParameterDrawerHeaderTitle = css87`
11519
11628
  `;
11520
11629
 
11521
11630
  // src/components/ParameterInputs/ParameterDrawerHeader.tsx
11522
- import { jsx as jsx115, jsxs as jsxs77 } from "@emotion/react/jsx-runtime";
11631
+ import { jsx as jsx116, jsxs as jsxs77 } from "@emotion/react/jsx-runtime";
11523
11632
  var ParameterDrawerHeader = ({ title, iconBeforeTitle, children }) => {
11524
11633
  return /* @__PURE__ */ jsxs77("div", { css: ParameterDrawerHeaderContainer, children: [
11525
11634
  /* @__PURE__ */ jsxs77("header", { css: ParameterDrawerHeaderTitleGroup, children: [
11526
11635
  iconBeforeTitle,
11527
- /* @__PURE__ */ jsx115(Heading2, { level: 3, withMarginBottom: false, css: ParameterDrawerHeaderTitle, title, children: title })
11636
+ /* @__PURE__ */ jsx116(Heading2, { level: 3, withMarginBottom: false, css: ParameterDrawerHeaderTitle, title, children: title })
11528
11637
  ] }),
11529
11638
  children
11530
11639
  ] });
@@ -11534,11 +11643,15 @@ var ParameterDrawerHeader = ({ title, iconBeforeTitle, children }) => {
11534
11643
  import { forwardRef as forwardRef20 } from "react";
11535
11644
 
11536
11645
  // src/components/ParameterInputs/styles/ParameterGroup.styles.ts
11537
- import { css as css88 } from "@emotion/react";
11538
- var fieldsetStyles = css88`
11646
+ import { css as css89 } from "@emotion/react";
11647
+ var fieldsetStyles = css89`
11539
11648
  &:disabled,
11540
11649
  [readonly] {
11541
- pointer-events: none;
11650
+ input,
11651
+ select,
11652
+ textarea {
11653
+ pointer-events: none;
11654
+ }
11542
11655
 
11543
11656
  label,
11544
11657
  legend {
@@ -11546,19 +11659,19 @@ var fieldsetStyles = css88`
11546
11659
  }
11547
11660
  }
11548
11661
  `;
11549
- var fieldsetLegend2 = css88`
11662
+ var fieldsetLegend2 = css89`
11550
11663
  display: block;
11551
11664
  font-weight: var(--fw-medium);
11552
- margin-bottom: var(--spacing-sm);
11665
+ margin-bottom: var(--spacing-base);
11553
11666
  width: 100%;
11554
11667
  `;
11555
11668
 
11556
11669
  // src/components/ParameterInputs/ParameterGroup.tsx
11557
- import { jsx as jsx116, jsxs as jsxs78 } from "@emotion/react/jsx-runtime";
11670
+ import { jsx as jsx117, jsxs as jsxs78 } from "@emotion/react/jsx-runtime";
11558
11671
  var ParameterGroup = forwardRef20(
11559
11672
  ({ legend, isDisabled, children, ...props }, ref) => {
11560
11673
  return /* @__PURE__ */ jsxs78("fieldset", { css: fieldsetStyles, disabled: isDisabled, ref, ...props, children: [
11561
- /* @__PURE__ */ jsx116("legend", { css: fieldsetLegend2, children: legend }),
11674
+ /* @__PURE__ */ jsx117("legend", { css: fieldsetLegend2, children: legend }),
11562
11675
  children
11563
11676
  ] });
11564
11677
  }
@@ -11572,15 +11685,15 @@ import { useState as useState13 } from "react";
11572
11685
  import { createPortal as createPortal2 } from "react-dom";
11573
11686
 
11574
11687
  // src/components/ParameterInputs/styles/ParameterImage.styles.ts
11575
- import { css as css89 } from "@emotion/react";
11576
- var previewWrapper = css89`
11688
+ import { css as css90 } from "@emotion/react";
11689
+ var previewWrapper = css90`
11577
11690
  margin-top: var(--spacing-xs);
11578
11691
  background: var(--gray-50);
11579
11692
  padding: var(--spacing-sm);
11580
11693
  border: solid 1px var(--gray-300);
11581
11694
  border-radius: var(--rounded-sm);
11582
11695
  `;
11583
- var previewLink = css89`
11696
+ var previewLink = css90`
11584
11697
  display: block;
11585
11698
  width: 100%;
11586
11699
 
@@ -11588,7 +11701,7 @@ var previewLink = css89`
11588
11701
  max-height: 9rem;
11589
11702
  }
11590
11703
  `;
11591
- var previewModalWrapper = css89`
11704
+ var previewModalWrapper = css90`
11592
11705
  background: var(--gray-50);
11593
11706
  display: flex;
11594
11707
  height: 100%;
@@ -11597,7 +11710,7 @@ var previewModalWrapper = css89`
11597
11710
  border: solid 1px var(--gray-300);
11598
11711
  border-radius: var(--rounded-sm);
11599
11712
  `;
11600
- var previewModalImage = css89`
11713
+ var previewModalImage = css90`
11601
11714
  display: flex;
11602
11715
  height: 100%;
11603
11716
  width: 100%;
@@ -11609,32 +11722,32 @@ var previewModalImage = css89`
11609
11722
  `;
11610
11723
 
11611
11724
  // src/components/ParameterInputs/ParameterImagePreview.tsx
11612
- import { Fragment as Fragment12, jsx as jsx117, jsxs as jsxs79 } from "@emotion/react/jsx-runtime";
11725
+ import { Fragment as Fragment12, jsx as jsx118, jsxs as jsxs79 } from "@emotion/react/jsx-runtime";
11613
11726
  function ParameterImagePreview({ imageSrc }) {
11614
11727
  const [showModal, setShowModal] = useState13(false);
11615
11728
  return imageSrc ? /* @__PURE__ */ jsxs79("div", { css: previewWrapper, children: [
11616
- /* @__PURE__ */ jsx117(PreviewImageModal, { open: showModal, imageSrc, onRequestClose: () => setShowModal(false) }),
11617
- /* @__PURE__ */ jsx117(
11729
+ /* @__PURE__ */ jsx118(PreviewImageModal, { open: showModal, imageSrc, onRequestClose: () => setShowModal(false) }),
11730
+ /* @__PURE__ */ jsx118(
11618
11731
  "button",
11619
11732
  {
11620
11733
  css: previewLink,
11621
11734
  onClick: () => {
11622
11735
  setShowModal(true);
11623
11736
  },
11624
- children: /* @__PURE__ */ jsx117(Image, { src: imageSrc, "data-testid": "parameter-image-preview" })
11737
+ children: /* @__PURE__ */ jsx118(Image, { src: imageSrc, "data-testid": "parameter-image-preview" })
11625
11738
  }
11626
11739
  )
11627
11740
  ] }) : null;
11628
11741
  }
11629
11742
  var PreviewImageModal = ({ open, onRequestClose, imageSrc }) => {
11630
- return open ? /* @__PURE__ */ jsx117(Fragment12, { children: createPortal2(
11631
- /* @__PURE__ */ jsx117(
11743
+ return open ? /* @__PURE__ */ jsx118(Fragment12, { children: createPortal2(
11744
+ /* @__PURE__ */ jsx118(
11632
11745
  Modal,
11633
11746
  {
11634
11747
  header: "Image Preview",
11635
11748
  onRequestClose,
11636
- buttonGroup: /* @__PURE__ */ jsx117(Button, { buttonType: "secondary", onClick: onRequestClose, children: "Ok" }),
11637
- children: /* @__PURE__ */ jsx117("div", { css: previewModalWrapper, children: /* @__PURE__ */ jsx117(Image, { src: imageSrc, css: previewModalImage, "data-testid": "parameter-image-preview" }) })
11749
+ buttonGroup: /* @__PURE__ */ jsx118(Button, { buttonType: "secondary", onClick: onRequestClose, children: "Ok" }),
11750
+ children: /* @__PURE__ */ jsx118("div", { css: previewModalWrapper, children: /* @__PURE__ */ jsx118(Image, { src: imageSrc, css: previewModalImage, "data-testid": "parameter-image-preview" }) })
11638
11751
  }
11639
11752
  ),
11640
11753
  document.body
@@ -11642,12 +11755,28 @@ var PreviewImageModal = ({ open, onRequestClose, imageSrc }) => {
11642
11755
  };
11643
11756
 
11644
11757
  // src/components/ParameterInputs/ParameterShell.tsx
11645
- import { css as css92 } from "@emotion/react";
11758
+ import { css as css93 } from "@emotion/react";
11646
11759
  import { useState as useState14 } from "react";
11647
11760
 
11648
11761
  // src/components/ParameterInputs/styles/ParameterInput.styles.ts
11649
- import { css as css90 } from "@emotion/react";
11650
- var inputContainer2 = css90`
11762
+ import { css as css91 } from "@emotion/react";
11763
+ var actionBarVisibilityStyles = css91`
11764
+ [data-action-bar] {
11765
+ opacity: 1;
11766
+ transform: translateX(0);
11767
+ transition:
11768
+ opacity var(--duration-fast) var(--timing-ease-out),
11769
+ transform var(--duration-fast) var(--timing-ease-out);
11770
+ }
11771
+ `;
11772
+ var actionBarVisibilityHiddenStyles = css91`
11773
+ opacity: 0;
11774
+ transform: translateX(1rem);
11775
+ transition:
11776
+ opacity var(--duration-fast) var(--timing-ease-out),
11777
+ transform var(--duration-fast) var(--timing-ease-out);
11778
+ `;
11779
+ var inputContainer2 = css91`
11651
11780
  position: relative;
11652
11781
  scroll-margin: var(--spacing-2xl);
11653
11782
 
@@ -11658,16 +11787,17 @@ var inputContainer2 = css90`
11658
11787
  opacity: var(--opacity-100);
11659
11788
  translate: 0 0;
11660
11789
  }
11790
+ ${actionBarVisibilityStyles}
11661
11791
  }
11662
11792
  `;
11663
- var labelText2 = css90`
11793
+ var labelText2 = css91`
11664
11794
  align-items: center;
11665
11795
  display: flex;
11666
11796
  gap: var(--spacing-xs);
11667
11797
  font-weight: var(--fw-regular);
11668
11798
  margin: 0 0 var(--spacing-xs);
11669
11799
  `;
11670
- var input3 = css90`
11800
+ var input3 = css91`
11671
11801
  display: block;
11672
11802
  appearance: none;
11673
11803
  box-sizing: border-box;
@@ -11715,18 +11845,18 @@ var input3 = css90`
11715
11845
  color: var(--gray-400);
11716
11846
  }
11717
11847
  `;
11718
- var selectInput = css90`
11848
+ var selectInput = css91`
11719
11849
  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");
11720
11850
  background-position: right var(--spacing-sm) center;
11721
11851
  background-repeat: no-repeat;
11722
11852
  background-size: 1rem;
11723
11853
  padding-right: var(--spacing-xl);
11724
11854
  `;
11725
- var inputWrapper = css90`
11855
+ var inputWrapper = css91`
11726
11856
  display: flex; // used to correct overflow with chrome textarea
11727
11857
  position: relative;
11728
11858
  `;
11729
- var inputIcon2 = css90`
11859
+ var inputIcon2 = css91`
11730
11860
  align-items: center;
11731
11861
  background: var(--white);
11732
11862
  border-radius: var(--rounded-md) 0 0 var(--rounded-md);
@@ -11742,7 +11872,7 @@ var inputIcon2 = css90`
11742
11872
  width: var(--spacing-lg);
11743
11873
  z-index: var(--z-10);
11744
11874
  `;
11745
- var inputToggleLabel2 = css90`
11875
+ var inputToggleLabel2 = css91`
11746
11876
  --inline-label-color: var(--typography-base);
11747
11877
  align-items: center;
11748
11878
  cursor: pointer;
@@ -11757,7 +11887,7 @@ var inputToggleLabel2 = css90`
11757
11887
  --inline-label-color: var(--gray-400);
11758
11888
  }
11759
11889
  `;
11760
- var toggleInput2 = css90`
11890
+ var toggleInput2 = css91`
11761
11891
  appearance: none;
11762
11892
  border: 1px solid var(--gray-200);
11763
11893
  background: var(--white);
@@ -11811,7 +11941,7 @@ var toggleInput2 = css90`
11811
11941
  border-color: var(--gray-300);
11812
11942
  }
11813
11943
  `;
11814
- var inlineLabel2 = css90`
11944
+ var inlineLabel2 = css91`
11815
11945
  color: var(--inline-label-color);
11816
11946
  padding-left: var(--spacing-md);
11817
11947
  font-size: var(--fs-sm);
@@ -11828,20 +11958,29 @@ var inlineLabel2 = css90`
11828
11958
  }
11829
11959
  }
11830
11960
  `;
11831
- var inputMenu = css90`
11961
+ var inputMenu = css91`
11832
11962
  background: none;
11833
11963
  border: none;
11834
11964
  padding: var(--spacing-2xs);
11835
11965
  position: absolute;
11836
11966
  top: calc(var(--spacing-md) * -1.2);
11837
11967
  right: 0;
11968
+
11969
+ &:disabled,
11970
+ &[aria-disabled='true'] {
11971
+ color: var(--gray-400);
11972
+ cursor: default;
11973
+ }
11838
11974
  `;
11839
- var inputActionItems = css90`
11975
+ var inputActionItems = css91`
11840
11976
  display: flex;
11977
+ ${actionBarVisibilityHiddenStyles}
11841
11978
  `;
11842
- var inputMenuHover = css90`
11979
+ var inputMenuHover = css91`
11843
11980
  opacity: var(--opacity-50);
11844
11981
  transition: background-color var(--duration-fast) var(--timing-ease-out);
11982
+ margin-top: 0.25rem;
11983
+ ${actionBarVisibilityHiddenStyles}
11845
11984
 
11846
11985
  // css trick to style the input like a hover or active state when the menu button is active or hovered
11847
11986
  &:hover,
@@ -11849,11 +11988,11 @@ var inputMenuHover = css90`
11849
11988
  background-color: var(--gray-200);
11850
11989
  }
11851
11990
  `;
11852
- var textarea2 = css90`
11991
+ var textarea2 = css91`
11853
11992
  resize: vertical;
11854
11993
  min-height: 2rem;
11855
11994
  `;
11856
- var dataConnectButton = css90`
11995
+ var dataConnectButton = css91`
11857
11996
  align-items: center;
11858
11997
  appearance: none;
11859
11998
  box-sizing: border-box;
@@ -11889,7 +12028,7 @@ var dataConnectButton = css90`
11889
12028
  pointer-events: none;
11890
12029
  }
11891
12030
  `;
11892
- var linkParameterBtn = css90`
12031
+ var linkParameterBtn = css91`
11893
12032
  border-radius: var(--rounded-base);
11894
12033
  background: transparent;
11895
12034
  border: none;
@@ -11898,7 +12037,7 @@ var linkParameterBtn = css90`
11898
12037
  font-size: var(--fs-sm);
11899
12038
  line-height: 1;
11900
12039
  `;
11901
- var linkParameterControls = css90`
12040
+ var linkParameterControls = css91`
11902
12041
  position: absolute;
11903
12042
  inset: 0 0 0 auto;
11904
12043
  padding: 0 var(--spacing-base);
@@ -11907,7 +12046,7 @@ var linkParameterControls = css90`
11907
12046
  justify-content: center;
11908
12047
  gap: var(--spacing-base);
11909
12048
  `;
11910
- var linkParameterInput = (withExternalLinkIcon) => css90`
12049
+ var linkParameterInput = (withExternalLinkIcon) => css91`
11911
12050
  padding-right: calc(
11912
12051
  ${withExternalLinkIcon ? "calc(var(--spacing-lg) * 2 + var(--spacing-xs))" : "var(--spacing-xl)"} +
11913
12052
  var(--spacing-base)
@@ -11920,7 +12059,7 @@ var linkParameterInput = (withExternalLinkIcon) => css90`
11920
12059
  }
11921
12060
  }
11922
12061
  `;
11923
- var linkParameterIcon = css90`
12062
+ var linkParameterIcon = css91`
11924
12063
  align-items: center;
11925
12064
  color: var(--brand-secondary-3);
11926
12065
  display: flex;
@@ -11935,28 +12074,30 @@ var linkParameterIcon = css90`
11935
12074
  `;
11936
12075
 
11937
12076
  // src/components/ParameterInputs/ParameterLabel.tsx
11938
- import { jsx as jsx118 } from "@emotion/react/jsx-runtime";
12077
+ import { jsx as jsx119 } from "@emotion/react/jsx-runtime";
11939
12078
  var ParameterLabel = ({ id, asSpan, children, testId, ...props }) => {
11940
- return !asSpan ? /* @__PURE__ */ jsx118("label", { ...props, htmlFor: id, css: labelText2, "data-testid": testId, children }) : /* @__PURE__ */ jsx118("span", { "aria-labelledby": id, css: labelText2, children });
12079
+ return !asSpan ? /* @__PURE__ */ jsx119("label", { ...props, htmlFor: id, css: labelText2, "data-testid": testId, children }) : /* @__PURE__ */ jsx119("span", { "aria-labelledby": id, css: labelText2, children });
11941
12080
  };
11942
12081
 
11943
12082
  // src/components/ParameterInputs/ParameterMenuButton.tsx
11944
12083
  import { forwardRef as forwardRef21 } from "react";
11945
- import { jsx as jsx119 } from "@emotion/react/jsx-runtime";
12084
+ import { jsx as jsx120 } from "@emotion/react/jsx-runtime";
11946
12085
  var ParameterMenuButton = forwardRef21(
11947
- ({ label, children }, ref) => {
11948
- return /* @__PURE__ */ jsx119(
12086
+ ({ label, children, disabled: disabled2 }, ref) => {
12087
+ return /* @__PURE__ */ jsx120(
11949
12088
  Menu,
11950
12089
  {
11951
- menuTrigger: /* @__PURE__ */ jsx119(
12090
+ menuTrigger: /* @__PURE__ */ jsx120(
11952
12091
  "button",
11953
12092
  {
12093
+ "data-action-bar": true,
11954
12094
  className: "parameter-menu",
11955
12095
  css: [inputMenu, inputMenuHover],
11956
12096
  type: "button",
11957
12097
  "aria-label": `${label} options`,
11958
12098
  ref,
11959
- children: /* @__PURE__ */ jsx119(Icon, { icon: "more-alt", iconColor: "currentColor", size: "0.9rem" })
12099
+ disabled: disabled2,
12100
+ children: /* @__PURE__ */ jsx120(Icon, { icon: "more-alt", iconColor: "currentColor", size: "0.9rem" })
11960
12101
  }
11961
12102
  ),
11962
12103
  children
@@ -11966,14 +12107,14 @@ var ParameterMenuButton = forwardRef21(
11966
12107
  );
11967
12108
 
11968
12109
  // src/components/ParameterInputs/styles/ParameterShell.styles.ts
11969
- import { css as css91 } from "@emotion/react";
11970
- var emptyParameterShell = css91`
12110
+ import { css as css92 } from "@emotion/react";
12111
+ var emptyParameterShell = css92`
11971
12112
  border-radius: var(--rounded-sm);
11972
12113
  flex-grow: 1;
11973
12114
  position: relative;
11974
12115
  max-width: 100%;
11975
12116
  `;
11976
- var emptyParameterShellText = css91`
12117
+ var emptyParameterShellText = css92`
11977
12118
  background: var(--brand-secondary-6);
11978
12119
  border-radius: var(--rounded-sm);
11979
12120
  padding: var(--spacing-sm);
@@ -11981,7 +12122,7 @@ var emptyParameterShellText = css91`
11981
12122
  font-size: var(--fs-sm);
11982
12123
  margin: 0;
11983
12124
  `;
11984
- var overrideMarker = css91`
12125
+ var overrideMarker = css92`
11985
12126
  border-radius: var(--rounded-sm);
11986
12127
  border: 10px solid var(--gray-300);
11987
12128
  border-left-color: transparent;
@@ -11992,7 +12133,7 @@ var overrideMarker = css91`
11992
12133
  `;
11993
12134
 
11994
12135
  // src/components/ParameterInputs/ParameterShell.tsx
11995
- import { jsx as jsx120, jsxs as jsxs80 } from "@emotion/react/jsx-runtime";
12136
+ import { jsx as jsx121, jsxs as jsxs80 } from "@emotion/react/jsx-runtime";
11996
12137
  var extractParameterProps = (props) => {
11997
12138
  const {
11998
12139
  id,
@@ -12067,21 +12208,22 @@ var ParameterShell = ({
12067
12208
  labelTrailingIcon != null ? labelTrailingIcon : null
12068
12209
  ] }),
12069
12210
  /* @__PURE__ */ jsxs80("div", { css: inputWrapper, children: [
12070
- actionItems ? /* @__PURE__ */ jsx120(
12211
+ actionItems ? /* @__PURE__ */ jsx121(
12071
12212
  "div",
12072
12213
  {
12214
+ "data-action-bar": true,
12073
12215
  css: [
12074
12216
  inputMenu,
12075
12217
  inputActionItems,
12076
- menuItems ? css92`
12218
+ menuItems ? css93`
12077
12219
  right: var(--spacing-md);
12078
12220
  ` : void 0
12079
12221
  ],
12080
12222
  children: actionItems
12081
12223
  }
12082
12224
  ) : null,
12083
- menuItems ? /* @__PURE__ */ jsx120(ParameterMenuButton, { label: `${label} menu`, children: menuItems }) : null,
12084
- /* @__PURE__ */ jsx120(
12225
+ menuItems ? /* @__PURE__ */ jsx121(ParameterMenuButton, { label: `${label} menu`, disabled: props.disabled, children: menuItems }) : null,
12226
+ /* @__PURE__ */ jsx121(
12085
12227
  ParameterShellContext.Provider,
12086
12228
  {
12087
12229
  value: {
@@ -12091,14 +12233,14 @@ var ParameterShell = ({
12091
12233
  errorMessage: errorMessaging,
12092
12234
  handleManuallySetErrorMessage: (message) => setErrorMessage(message)
12093
12235
  },
12094
- children: isParameterGroup ? /* @__PURE__ */ jsx120("div", { style: { flexGrow: 1 }, children }) : /* @__PURE__ */ jsxs80(ParameterShellPlaceholder, { children: [
12236
+ children: isParameterGroup ? /* @__PURE__ */ jsx121("div", { style: { flexGrow: 1 }, children }) : /* @__PURE__ */ jsxs80(ParameterShellPlaceholder, { children: [
12095
12237
  children,
12096
- hasOverriddenValue && onResetOverriddenValue ? /* @__PURE__ */ jsx120(ParameterOverrideMarker, { onClick: onResetOverriddenValue }) : null
12238
+ hasOverriddenValue && onResetOverriddenValue ? /* @__PURE__ */ jsx121(ParameterOverrideMarker, { onClick: onResetOverriddenValue }) : null
12097
12239
  ] })
12098
12240
  }
12099
12241
  )
12100
12242
  ] }),
12101
- /* @__PURE__ */ jsx120(
12243
+ /* @__PURE__ */ jsx121(
12102
12244
  FieldMessage,
12103
12245
  {
12104
12246
  helperMessageTestId: captionTestId,
@@ -12112,17 +12254,17 @@ var ParameterShell = ({
12112
12254
  ] });
12113
12255
  };
12114
12256
  var ParameterShellPlaceholder = ({ children }) => {
12115
- return /* @__PURE__ */ jsx120("div", { css: emptyParameterShell, children });
12257
+ return /* @__PURE__ */ jsx121("div", { css: emptyParameterShell, children });
12116
12258
  };
12117
- var ParameterOverrideMarker = (props) => /* @__PURE__ */ jsx120(Tooltip, { title: "The default value has been overridden", children: /* @__PURE__ */ jsx120("button", { type: "button", css: overrideMarker, ...props, children: /* @__PURE__ */ jsx120("span", { hidden: true, children: "reset overridden value to default" }) }) });
12259
+ var ParameterOverrideMarker = (props) => /* @__PURE__ */ jsx121(Tooltip, { title: "The default value has been overridden", children: /* @__PURE__ */ jsx121("button", { type: "button", css: overrideMarker, ...props, children: /* @__PURE__ */ jsx121("span", { hidden: true, children: "reset overridden value to default" }) }) });
12118
12260
 
12119
12261
  // src/components/ParameterInputs/ParameterImage.tsx
12120
- import { Fragment as Fragment13, jsx as jsx121, jsxs as jsxs81 } from "@emotion/react/jsx-runtime";
12262
+ import { Fragment as Fragment13, jsx as jsx122, jsxs as jsxs81 } from "@emotion/react/jsx-runtime";
12121
12263
  var ParameterImage = forwardRef22(
12122
12264
  ({ children, ...props }, ref) => {
12123
12265
  const { shellProps, innerProps } = extractParameterProps(props);
12124
12266
  return /* @__PURE__ */ jsxs81(ParameterShell, { "data-test-id": "parameter-image", ...shellProps, children: [
12125
- /* @__PURE__ */ jsx121(ParameterImageInner, { ref, ...innerProps }),
12267
+ /* @__PURE__ */ jsx122(ParameterImageInner, { ref, ...innerProps }),
12126
12268
  children
12127
12269
  ] });
12128
12270
  }
@@ -12132,7 +12274,7 @@ var ParameterImageInner = forwardRef22((props, ref) => {
12132
12274
  const { id, label, hiddenLabel, errorMessage } = useParameterShell();
12133
12275
  const deferredValue = useDeferredValue(value);
12134
12276
  return /* @__PURE__ */ jsxs81(Fragment13, { children: [
12135
- /* @__PURE__ */ jsx121(
12277
+ /* @__PURE__ */ jsx122(
12136
12278
  "input",
12137
12279
  {
12138
12280
  css: input3,
@@ -12144,21 +12286,21 @@ var ParameterImageInner = forwardRef22((props, ref) => {
12144
12286
  ...props
12145
12287
  }
12146
12288
  ),
12147
- errorMessage || props.disablePreview ? null : /* @__PURE__ */ jsx121(ParameterImagePreview, { imageSrc: deferredValue })
12289
+ errorMessage || props.disablePreview ? null : /* @__PURE__ */ jsx122(ParameterImagePreview, { imageSrc: deferredValue })
12148
12290
  ] });
12149
12291
  });
12150
12292
 
12151
12293
  // src/components/ParameterInputs/ParameterInput.tsx
12152
12294
  import { forwardRef as forwardRef23 } from "react";
12153
- import { jsx as jsx122 } from "@emotion/react/jsx-runtime";
12295
+ import { jsx as jsx123 } from "@emotion/react/jsx-runtime";
12154
12296
  var ParameterInput = forwardRef23((props, ref) => {
12155
12297
  const { shellProps, innerProps } = extractParameterProps(props);
12156
- return /* @__PURE__ */ jsx122(ParameterShell, { "data-testid": "parameter-input", ...shellProps, children: /* @__PURE__ */ jsx122(ParameterInputInner, { ref, ...innerProps }) });
12298
+ return /* @__PURE__ */ jsx123(ParameterShell, { "data-testid": "parameter-input", ...shellProps, children: /* @__PURE__ */ jsx123(ParameterInputInner, { ref, ...innerProps }) });
12157
12299
  });
12158
12300
  var ParameterInputInner = forwardRef23(({ enableMouseWheel = false, ...props }, ref) => {
12159
12301
  const { id, label, hiddenLabel } = useParameterShell();
12160
12302
  const isNumberInputAndMouseWheelDisabled = enableMouseWheel !== true && props.type === "number";
12161
- return /* @__PURE__ */ jsx122(
12303
+ return /* @__PURE__ */ jsx123(
12162
12304
  "input",
12163
12305
  {
12164
12306
  css: input3,
@@ -12175,18 +12317,18 @@ var ParameterInputInner = forwardRef23(({ enableMouseWheel = false, ...props },
12175
12317
 
12176
12318
  // src/components/ParameterInputs/ParameterLink.tsx
12177
12319
  import { forwardRef as forwardRef24 } from "react";
12178
- import { jsx as jsx123, jsxs as jsxs82 } from "@emotion/react/jsx-runtime";
12320
+ import { jsx as jsx124, jsxs as jsxs82 } from "@emotion/react/jsx-runtime";
12179
12321
  var ParameterLink = forwardRef24(
12180
12322
  ({ disabled: disabled2, onConnectLink, externalLink, ...props }, ref) => {
12181
12323
  const { shellProps, innerProps } = extractParameterProps(props);
12182
- return /* @__PURE__ */ jsx123(
12324
+ return /* @__PURE__ */ jsx124(
12183
12325
  ParameterShell,
12184
12326
  {
12185
12327
  "data-testid": "link-parameter-editor",
12186
12328
  ...shellProps,
12187
12329
  label: innerProps.value ? shellProps.label : "",
12188
12330
  title: !innerProps.value && typeof shellProps.label === "string" ? shellProps.label : void 0,
12189
- children: /* @__PURE__ */ jsx123(
12331
+ children: /* @__PURE__ */ jsx124(
12190
12332
  ParameterLinkInner,
12191
12333
  {
12192
12334
  onConnectLink,
@@ -12203,9 +12345,9 @@ var ParameterLinkInner = forwardRef24(
12203
12345
  ({ externalLink, onConnectLink, disabled: disabled2, buttonText = "Select link", ...props }, ref) => {
12204
12346
  const { id, label, hiddenLabel } = useParameterShell();
12205
12347
  if (!props.value)
12206
- return /* @__PURE__ */ jsx123("button", { type: "button", css: dataConnectButton, disabled: disabled2, onClick: onConnectLink, children: buttonText });
12348
+ return /* @__PURE__ */ jsx124("button", { type: "button", css: dataConnectButton, disabled: disabled2, onClick: onConnectLink, children: buttonText });
12207
12349
  return /* @__PURE__ */ jsxs82("div", { css: inputWrapper, children: [
12208
- /* @__PURE__ */ jsx123(
12350
+ /* @__PURE__ */ jsx124(
12209
12351
  "input",
12210
12352
  {
12211
12353
  type: "text",
@@ -12218,7 +12360,7 @@ var ParameterLinkInner = forwardRef24(
12218
12360
  }
12219
12361
  ),
12220
12362
  /* @__PURE__ */ jsxs82("div", { css: linkParameterControls, children: [
12221
- /* @__PURE__ */ jsx123(
12363
+ /* @__PURE__ */ jsx124(
12222
12364
  "button",
12223
12365
  {
12224
12366
  type: "button",
@@ -12230,7 +12372,7 @@ var ParameterLinkInner = forwardRef24(
12230
12372
  children: "edit"
12231
12373
  }
12232
12374
  ),
12233
- externalLink ? /* @__PURE__ */ jsx123(
12375
+ externalLink ? /* @__PURE__ */ jsx124(
12234
12376
  "a",
12235
12377
  {
12236
12378
  href: externalLink,
@@ -12238,7 +12380,7 @@ var ParameterLinkInner = forwardRef24(
12238
12380
  title: "Open link in new tab",
12239
12381
  target: "_blank",
12240
12382
  rel: "noopener noreferrer",
12241
- children: /* @__PURE__ */ jsx123(Icon, { icon: "arrows-expand-up-right", iconColor: "currentColor", size: "1rem" })
12383
+ children: /* @__PURE__ */ jsx124(Icon, { icon: "arrows-expand-up-right", iconColor: "currentColor", size: "1rem" })
12242
12384
  }
12243
12385
  ) : null
12244
12386
  ] })
@@ -12247,15 +12389,15 @@ var ParameterLinkInner = forwardRef24(
12247
12389
  );
12248
12390
 
12249
12391
  // src/components/ParameterInputs/ParameterMultiSelect.tsx
12250
- import { jsx as jsx124 } from "@emotion/react/jsx-runtime";
12392
+ import { jsx as jsx125 } from "@emotion/react/jsx-runtime";
12251
12393
  var ParameterMultiSelect = ({ disabled: disabled2 = false, ...props }) => {
12252
12394
  const { shellProps, innerProps } = extractParameterProps(props);
12253
- return /* @__PURE__ */ jsx124(ParameterShell, { ...shellProps, children: /* @__PURE__ */ jsx124(ParameterMultiSelectInner, { isDisabled: disabled2, ...innerProps }) });
12395
+ return /* @__PURE__ */ jsx125(ParameterShell, { ...shellProps, children: /* @__PURE__ */ jsx125(ParameterMultiSelectInner, { isDisabled: disabled2, ...innerProps }) });
12254
12396
  };
12255
12397
  var ParameterMultiSelectInner = (props) => {
12256
12398
  var _a;
12257
12399
  const { id, label } = useParameterShell();
12258
- return /* @__PURE__ */ jsx124(
12400
+ return /* @__PURE__ */ jsx125(
12259
12401
  InputComboBox,
12260
12402
  {
12261
12403
  menuPortalTarget: document.body,
@@ -12305,7 +12447,7 @@ var ParameterMultiSelectInner = (props) => {
12305
12447
  };
12306
12448
 
12307
12449
  // src/components/ParameterInputs/ParameterNameAndPublicIdInput.tsx
12308
- import { Fragment as Fragment14, jsx as jsx125, jsxs as jsxs83 } from "@emotion/react/jsx-runtime";
12450
+ import { Fragment as Fragment14, jsx as jsx126, jsxs as jsxs83 } from "@emotion/react/jsx-runtime";
12309
12451
  var ParameterNameAndPublicIdInput = ({
12310
12452
  id,
12311
12453
  onBlur,
@@ -12332,7 +12474,7 @@ var ParameterNameAndPublicIdInput = ({
12332
12474
  };
12333
12475
  autoFocus == null ? void 0 : autoFocus();
12334
12476
  return /* @__PURE__ */ jsxs83(Fragment14, { children: [
12335
- /* @__PURE__ */ jsx125(
12477
+ /* @__PURE__ */ jsx126(
12336
12478
  ParameterInput,
12337
12479
  {
12338
12480
  id: nameIdField,
@@ -12351,7 +12493,7 @@ var ParameterNameAndPublicIdInput = ({
12351
12493
  value: values[nameIdField]
12352
12494
  }
12353
12495
  ),
12354
- /* @__PURE__ */ jsx125(
12496
+ /* @__PURE__ */ jsx126(
12355
12497
  ParameterInput,
12356
12498
  {
12357
12499
  id: publicIdFieldName,
@@ -12365,11 +12507,11 @@ var ParameterNameAndPublicIdInput = ({
12365
12507
  caption: !publicIdError ? publicIdCaption : void 0,
12366
12508
  placeholder: publicIdPlaceholderText,
12367
12509
  errorMessage: publicIdError,
12368
- menuItems: /* @__PURE__ */ jsx125(
12510
+ menuItems: /* @__PURE__ */ jsx126(
12369
12511
  MenuItem,
12370
12512
  {
12371
12513
  disabled: !values[publicIdFieldName],
12372
- icon: /* @__PURE__ */ jsx125(Icon, { icon: "path-trim", iconColor: "currentColor" }),
12514
+ icon: /* @__PURE__ */ jsx126(Icon, { icon: "path-trim", iconColor: "currentColor" }),
12373
12515
  onClick: handleCopyPidFieldValue,
12374
12516
  children: "Copy"
12375
12517
  }
@@ -12377,12 +12519,12 @@ var ParameterNameAndPublicIdInput = ({
12377
12519
  value: values[publicIdFieldName]
12378
12520
  }
12379
12521
  ),
12380
- (warnOverLength == null ? void 0 : warnOverLength.length) && values[publicIdFieldName].length > warnOverLength.length ? /* @__PURE__ */ jsx125(Callout, { type: "caution", children: warnOverLength.message }) : null
12522
+ (warnOverLength == null ? void 0 : warnOverLength.length) && values[publicIdFieldName].length > warnOverLength.length ? /* @__PURE__ */ jsx126(Callout, { type: "caution", children: warnOverLength.message }) : null
12381
12523
  ] });
12382
12524
  };
12383
12525
 
12384
12526
  // src/components/ParameterInputs/ParameterRichText.tsx
12385
- import { css as css98 } from "@emotion/react";
12527
+ import { css as css99 } from "@emotion/react";
12386
12528
  import { ListItemNode, ListNode as ListNode3 } from "@lexical/list";
12387
12529
  import {
12388
12530
  CODE,
@@ -12564,23 +12706,23 @@ function DisableStylesPlugin() {
12564
12706
  }
12565
12707
 
12566
12708
  // src/components/ParameterInputs/rich-text/editorStyles.ts
12567
- import { css as css93 } from "@emotion/css";
12568
- var textBold = css93`
12709
+ import { css as css94 } from "@emotion/css";
12710
+ var textBold = css94`
12569
12711
  font-weight: 700;
12570
12712
  `;
12571
- var textItalic = css93`
12713
+ var textItalic = css94`
12572
12714
  font-style: italic;
12573
12715
  `;
12574
- var textUnderline = css93`
12716
+ var textUnderline = css94`
12575
12717
  text-decoration: underline;
12576
12718
  `;
12577
- var textStrikethrough = css93`
12719
+ var textStrikethrough = css94`
12578
12720
  text-decoration: line-through;
12579
12721
  `;
12580
- var textUnderlineStrikethrough = css93`
12722
+ var textUnderlineStrikethrough = css94`
12581
12723
  text-decoration: underline line-through;
12582
12724
  `;
12583
- var textCode = css93`
12725
+ var textCode = css94`
12584
12726
  background-color: var(--gray-100);
12585
12727
  border-radius: var(--rounded-sm);
12586
12728
  display: inline-block;
@@ -12591,68 +12733,68 @@ var textCode = css93`
12591
12733
  padding-left: var(--spacing-xs);
12592
12734
  padding-right: var(--spacing-xs);
12593
12735
  `;
12594
- var textSuperscript = css93`
12736
+ var textSuperscript = css94`
12595
12737
  vertical-align: super;
12596
12738
  font-size: smaller;
12597
12739
  `;
12598
- var textSubscript = css93`
12740
+ var textSubscript = css94`
12599
12741
  vertical-align: sub;
12600
12742
  font-size: smaller;
12601
12743
  `;
12602
- var linkElement = css93`
12744
+ var linkElement = css94`
12603
12745
  ${link}
12604
12746
  ${linkColorDefault}
12605
12747
  text-decoration: underline;
12606
12748
  `;
12607
- var h12 = css93`
12749
+ var h12 = css94`
12608
12750
  font-size: clamp(1.35rem, var(--fluid-font-base), 1.7rem);
12609
12751
  `;
12610
- var h22 = css93`
12752
+ var h22 = css94`
12611
12753
  font-size: clamp(1.35rem, var(--fluid-font-base), 1.6rem);
12612
12754
  `;
12613
- var h32 = css93`
12755
+ var h32 = css94`
12614
12756
  font-size: clamp(1.25rem, var(--fluid-font-base), 1.5rem);
12615
12757
  `;
12616
- var h42 = css93`
12758
+ var h42 = css94`
12617
12759
  font-size: clamp(1.15rem, var(--fluid-font-base), 1.25rem);
12618
12760
  `;
12619
- var h52 = css93`
12761
+ var h52 = css94`
12620
12762
  font-size: clamp(var(--fs-base), var(--fluid-font-base), 1.15rem);
12621
12763
  `;
12622
- var h62 = css93`
12764
+ var h62 = css94`
12623
12765
  font-size: var(--fs-base);
12624
12766
  `;
12625
- var heading1Element = css93`
12767
+ var heading1Element = css94`
12626
12768
  ${h12}
12627
12769
  ${commonHeadingAttr(true)}
12628
12770
  ${commonLineHeight}
12629
12771
  `;
12630
- var heading2Element = css93`
12772
+ var heading2Element = css94`
12631
12773
  ${h22}
12632
12774
  ${commonHeadingAttr(true)}
12633
12775
  ${commonLineHeight}
12634
12776
  `;
12635
- var heading3Element = css93`
12777
+ var heading3Element = css94`
12636
12778
  ${h32}
12637
12779
  ${commonHeadingAttr(true)}
12638
12780
  ${commonLineHeight}
12639
12781
  `;
12640
- var heading4Element = css93`
12782
+ var heading4Element = css94`
12641
12783
  ${h42}
12642
12784
  ${commonHeadingAttr(true)}
12643
12785
  ${commonLineHeight}
12644
12786
  `;
12645
- var heading5Element = css93`
12787
+ var heading5Element = css94`
12646
12788
  ${h52}
12647
12789
  ${commonHeadingAttr(true)}
12648
12790
  ${commonLineHeight}
12649
12791
  `;
12650
- var heading6Element = css93`
12792
+ var heading6Element = css94`
12651
12793
  ${h62}
12652
12794
  ${commonHeadingAttr(true)}
12653
12795
  ${commonLineHeight}
12654
12796
  `;
12655
- var paragraphElement = css93`
12797
+ var paragraphElement = css94`
12656
12798
  line-height: 1.5;
12657
12799
  margin-bottom: var(--spacing-base);
12658
12800
 
@@ -12660,7 +12802,7 @@ var paragraphElement = css93`
12660
12802
  margin-bottom: 0;
12661
12803
  }
12662
12804
  `;
12663
- var orderedListElement = css93`
12805
+ var orderedListElement = css94`
12664
12806
  ${commonLineHeight}
12665
12807
  display: block;
12666
12808
  list-style: decimal;
@@ -12689,7 +12831,7 @@ var orderedListElement = css93`
12689
12831
  }
12690
12832
  }
12691
12833
  `;
12692
- var unorderedListElement = css93`
12834
+ var unorderedListElement = css94`
12693
12835
  ${commonLineHeight}
12694
12836
  display: block;
12695
12837
  list-style: disc;
@@ -12710,13 +12852,13 @@ var unorderedListElement = css93`
12710
12852
  }
12711
12853
  }
12712
12854
  `;
12713
- var listItemElement = css93`
12855
+ var listItemElement = css94`
12714
12856
  margin-left: var(--spacing-md);
12715
12857
  `;
12716
- var nestedListItemElement = css93`
12858
+ var nestedListItemElement = css94`
12717
12859
  list-style-type: none;
12718
12860
  `;
12719
- var blockquoteElement = css93`
12861
+ var blockquoteElement = css94`
12720
12862
  border-left: 0.25rem solid var(--gray-300);
12721
12863
  color: var(--gray-600);
12722
12864
  margin-bottom: var(--spacing-base);
@@ -12726,7 +12868,7 @@ var blockquoteElement = css93`
12726
12868
  margin-bottom: 0;
12727
12869
  }
12728
12870
  `;
12729
- var codeElement = css93`
12871
+ var codeElement = css94`
12730
12872
  background-color: var(--gray-100);
12731
12873
  border-radius: var(--rounded-sm);
12732
12874
  display: block;
@@ -12741,7 +12883,7 @@ var codeElement = css93`
12741
12883
  margin-bottom: 0;
12742
12884
  }
12743
12885
  `;
12744
- var tableElement = css93`
12886
+ var tableElement = css94`
12745
12887
  border-collapse: collapse;
12746
12888
  border-spacing: 0;
12747
12889
  border-color: var(--gray-300);
@@ -12754,7 +12896,7 @@ var tableElement = css93`
12754
12896
  margin-bottom: 0;
12755
12897
  }
12756
12898
  `;
12757
- var tableCellElement = css93`
12899
+ var tableCellElement = css94`
12758
12900
  background-color: var(--white);
12759
12901
  border-color: var(--gray-300);
12760
12902
  border-style: solid;
@@ -12790,7 +12932,7 @@ var tableCellElement = css93`
12790
12932
  z-index: 1;
12791
12933
  }
12792
12934
  `;
12793
- var tableHeaderElement = css93`
12935
+ var tableHeaderElement = css94`
12794
12936
  background-color: var(--gray-100);
12795
12937
  border-color: var(--gray-300);
12796
12938
  border-style: solid;
@@ -12860,7 +13002,7 @@ var ImprovedAssetSelectionPlugin = () => {
12860
13002
  var ImprovedAssetSelectionPlugin_default = ImprovedAssetSelectionPlugin;
12861
13003
 
12862
13004
  // src/components/ParameterInputs/rich-text/LinkNodePlugin.tsx
12863
- import { css as css94 } from "@emotion/react";
13005
+ import { css as css95 } from "@emotion/react";
12864
13006
  import { useLexicalComposerContext as useLexicalComposerContext3 } from "@lexical/react/LexicalComposerContext";
12865
13007
  import { NodeEventPlugin } from "@lexical/react/LexicalNodeEventPlugin";
12866
13008
  import {
@@ -12943,7 +13085,7 @@ var normalizeStateForDeepEqualComparison = (editorState) => {
12943
13085
  };
12944
13086
 
12945
13087
  // src/components/ParameterInputs/rich-text/LinkNodePlugin.tsx
12946
- import { Fragment as Fragment15, jsx as jsx126, jsxs as jsxs84 } from "@emotion/react/jsx-runtime";
13088
+ import { Fragment as Fragment15, jsx as jsx127, jsxs as jsxs84 } from "@emotion/react/jsx-runtime";
12947
13089
  var isProjectMapLinkValue = (value) => {
12948
13090
  return (value == null ? void 0 : value.type) === "projectMapNode" && Boolean(
12949
13091
  value.nodeId && value.path && value.projectMapId
@@ -13232,17 +13374,17 @@ var OPEN_LINK_NODE_MODAL_COMMAND = createCommand(
13232
13374
  );
13233
13375
  var LINK_POPOVER_OFFSET_X = 0;
13234
13376
  var LINK_POPOVER_OFFSET_Y = 8;
13235
- var linkPopover = css94`
13377
+ var linkPopover = css95`
13236
13378
  position: absolute;
13237
13379
  z-index: 11;
13238
13380
  `;
13239
- var linkPopoverContainer = css94`
13381
+ var linkPopoverContainer = css95`
13240
13382
  ${Popover};
13241
13383
  ${PopoverVariantSmall};
13242
13384
  align-items: center;
13243
13385
  display: flex;
13244
13386
  `;
13245
- var linkPopoverAnchor = css94`
13387
+ var linkPopoverAnchor = css95`
13246
13388
  ${link}
13247
13389
  ${linkColorDefault}
13248
13390
  `;
@@ -13431,7 +13573,7 @@ function LinkNodePlugin({
13431
13573
  });
13432
13574
  };
13433
13575
  return /* @__PURE__ */ jsxs84(Fragment15, { children: [
13434
- /* @__PURE__ */ jsx126(
13576
+ /* @__PURE__ */ jsx127(
13435
13577
  NodeEventPlugin,
13436
13578
  {
13437
13579
  nodeType: LinkNode,
@@ -13441,7 +13583,7 @@ function LinkNodePlugin({
13441
13583
  }
13442
13584
  }
13443
13585
  ),
13444
- linkPopoverState ? /* @__PURE__ */ jsx126(
13586
+ linkPopoverState ? /* @__PURE__ */ jsx127(
13445
13587
  "div",
13446
13588
  {
13447
13589
  css: linkPopover,
@@ -13451,7 +13593,7 @@ function LinkNodePlugin({
13451
13593
  },
13452
13594
  ref: linkPopoverElRef,
13453
13595
  children: /* @__PURE__ */ jsxs84("div", { css: linkPopoverContainer, children: [
13454
- linkPopoverState.node.__link.type === "projectMapNode" ? linkPopoverState.node.__link.path : /* @__PURE__ */ jsx126(
13596
+ linkPopoverState.node.__link.type === "projectMapNode" ? linkPopoverState.node.__link.path : /* @__PURE__ */ jsx127(
13455
13597
  "a",
13456
13598
  {
13457
13599
  href: parsePath(
@@ -13463,7 +13605,7 @@ function LinkNodePlugin({
13463
13605
  children: parsePath(linkPopoverState.node.__link.path)
13464
13606
  }
13465
13607
  ),
13466
- /* @__PURE__ */ jsx126(
13608
+ /* @__PURE__ */ jsx127(
13467
13609
  Button,
13468
13610
  {
13469
13611
  size: "xs",
@@ -13471,7 +13613,7 @@ function LinkNodePlugin({
13471
13613
  onEditLinkNode(linkPopoverState.node);
13472
13614
  },
13473
13615
  buttonType: "ghost",
13474
- children: /* @__PURE__ */ jsx126(Icon, { icon: "pen", size: "1rem", title: "Edit link" })
13616
+ children: /* @__PURE__ */ jsx127(Icon, { icon: "pen", size: "1rem", title: "Edit link" })
13475
13617
  }
13476
13618
  )
13477
13619
  ] })
@@ -13609,7 +13751,7 @@ function ListIndentPlugin({ maxDepth }) {
13609
13751
  }
13610
13752
 
13611
13753
  // src/components/ParameterInputs/rich-text/TableActionMenuPlugin.tsx
13612
- import { css as css95 } from "@emotion/react";
13754
+ import { css as css96 } from "@emotion/react";
13613
13755
  import { useLexicalComposerContext as useLexicalComposerContext5 } from "@lexical/react/LexicalComposerContext";
13614
13756
  import { useLexicalEditable } from "@lexical/react/useLexicalEditable";
13615
13757
  import {
@@ -13630,7 +13772,7 @@ import {
13630
13772
  } from "@lexical/table";
13631
13773
  import { $getRoot as $getRoot2, $getSelection as $getSelection3, $isRangeSelection as $isRangeSelection3 } from "lexical";
13632
13774
  import { forwardRef as forwardRef25, useCallback as useCallback9, useEffect as useEffect19, useLayoutEffect, useState as useState16 } from "react";
13633
- import { jsx as jsx127, jsxs as jsxs85 } from "@emotion/react/jsx-runtime";
13775
+ import { jsx as jsx128, jsxs as jsxs85 } from "@emotion/react/jsx-runtime";
13634
13776
  function computeSelectionCount(selection) {
13635
13777
  const selectionShape = selection.getShape();
13636
13778
  return {
@@ -13638,7 +13780,7 @@ function computeSelectionCount(selection) {
13638
13780
  rows: selectionShape.toY - selectionShape.fromY + 1
13639
13781
  };
13640
13782
  }
13641
- var tableActionMenuTrigger = css95`
13783
+ var tableActionMenuTrigger = css96`
13642
13784
  position: absolute;
13643
13785
  transform: translate(calc(-100% - 1px), 1px);
13644
13786
  `;
@@ -13652,7 +13794,7 @@ var TableActionMenuTrigger = forwardRef25((props, ref) => {
13652
13794
  const relativeY = rect.top - parentRect.top + positioningAnchorEl.scrollTop;
13653
13795
  setCoordinates({ x: relativeX, y: relativeY });
13654
13796
  }, [tableCellEl, positioningAnchorEl]);
13655
- return /* @__PURE__ */ jsx127(
13797
+ return /* @__PURE__ */ jsx128(
13656
13798
  IconButton,
13657
13799
  {
13658
13800
  ref,
@@ -13666,7 +13808,7 @@ var TableActionMenuTrigger = forwardRef25((props, ref) => {
13666
13808
  size: "xs",
13667
13809
  buttonType: "unimportant",
13668
13810
  ...rest,
13669
- children: /* @__PURE__ */ jsx127(Icon, { icon: "chevron-down", size: "1rem", iconColor: "currentColor" })
13811
+ children: /* @__PURE__ */ jsx128(Icon, { icon: "chevron-down", size: "1rem", iconColor: "currentColor" })
13670
13812
  }
13671
13813
  );
13672
13814
  });
@@ -13817,13 +13959,13 @@ function TableActionMenu({
13817
13959
  clearTableSelection();
13818
13960
  });
13819
13961
  }, [editor, tableCellNode, clearTableSelection]);
13820
- const menuItemCss = css95({
13962
+ const menuItemCss = css96({
13821
13963
  fontSize: "var(--fs-sm)"
13822
13964
  });
13823
13965
  return /* @__PURE__ */ jsxs85(
13824
13966
  Menu,
13825
13967
  {
13826
- menuTrigger: /* @__PURE__ */ jsx127(
13968
+ menuTrigger: /* @__PURE__ */ jsx128(
13827
13969
  TableActionMenuTrigger,
13828
13970
  {
13829
13971
  tableCellEl,
@@ -13853,7 +13995,7 @@ function TableActionMenu({
13853
13995
  selectionCounts.rows === 1 ? "row" : `${selectionCounts.rows} rows`,
13854
13996
  " below"
13855
13997
  ] }),
13856
- /* @__PURE__ */ jsx127(MenuItemSeparator, {}),
13998
+ /* @__PURE__ */ jsx128(MenuItemSeparator, {}),
13857
13999
  /* @__PURE__ */ jsxs85(MenuItem, { onClick: () => insertTableColumnAtSelection(false), css: menuItemCss, children: [
13858
14000
  "Insert ",
13859
14001
  selectionCounts.columns === 1 ? "column" : `${selectionCounts.columns} columns`,
@@ -13864,11 +14006,11 @@ function TableActionMenu({
13864
14006
  selectionCounts.columns === 1 ? "column" : `${selectionCounts.columns} columns`,
13865
14007
  " right"
13866
14008
  ] }),
13867
- /* @__PURE__ */ jsx127(MenuItemSeparator, {}),
13868
- /* @__PURE__ */ jsx127(MenuItem, { onClick: () => deleteTableColumnAtSelection(), css: menuItemCss, children: "Delete column" }),
13869
- /* @__PURE__ */ jsx127(MenuItem, { onClick: () => deleteTableRowAtSelection(), css: menuItemCss, children: "Delete row" }),
13870
- /* @__PURE__ */ jsx127(MenuItem, { onClick: () => deleteTableAtSelection(), css: menuItemCss, children: "Delete table" }),
13871
- /* @__PURE__ */ jsx127(MenuItemSeparator, {}),
14009
+ /* @__PURE__ */ jsx128(MenuItemSeparator, {}),
14010
+ /* @__PURE__ */ jsx128(MenuItem, { onClick: () => deleteTableColumnAtSelection(), css: menuItemCss, children: "Delete column" }),
14011
+ /* @__PURE__ */ jsx128(MenuItem, { onClick: () => deleteTableRowAtSelection(), css: menuItemCss, children: "Delete row" }),
14012
+ /* @__PURE__ */ jsx128(MenuItem, { onClick: () => deleteTableAtSelection(), css: menuItemCss, children: "Delete table" }),
14013
+ /* @__PURE__ */ jsx128(MenuItemSeparator, {}),
13872
14014
  /* @__PURE__ */ jsxs85(MenuItem, { onClick: () => toggleTableRowIsHeader(), css: menuItemCss, children: [
13873
14015
  (tableCellNode.__headerState & TableCellHeaderStates.ROW) === TableCellHeaderStates.ROW ? "Remove" : "Add",
13874
14016
  " ",
@@ -13942,7 +14084,7 @@ function TableCellActionMenuContainer({
13942
14084
  });
13943
14085
  });
13944
14086
  });
13945
- return tableCellNode != null && tableCellNodeEl != null && tableCellMenuPortalEl != null && /* @__PURE__ */ jsx127(
14087
+ return tableCellNode != null && tableCellNodeEl != null && tableCellMenuPortalEl != null && /* @__PURE__ */ jsx128(
13946
14088
  TableActionMenu,
13947
14089
  {
13948
14090
  tableCellNode,
@@ -13958,11 +14100,11 @@ function TableActionMenuPlugin({
13958
14100
  menuPortalEl
13959
14101
  }) {
13960
14102
  const isEditable = useLexicalEditable();
13961
- return isEditable ? /* @__PURE__ */ jsx127(TableCellActionMenuContainer, { menuPortalEl, positioningAnchorEl }) : null;
14103
+ return isEditable ? /* @__PURE__ */ jsx128(TableCellActionMenuContainer, { menuPortalEl, positioningAnchorEl }) : null;
13962
14104
  }
13963
14105
 
13964
14106
  // src/components/ParameterInputs/rich-text/TableCellResizerPlugin.tsx
13965
- import { css as css96 } from "@emotion/react";
14107
+ import { css as css97 } from "@emotion/react";
13966
14108
  import { useLexicalComposerContext as useLexicalComposerContext6 } from "@lexical/react/LexicalComposerContext";
13967
14109
  import { useLexicalEditable as useLexicalEditable2 } from "@lexical/react/useLexicalEditable";
13968
14110
  import {
@@ -13976,10 +14118,10 @@ import { calculateZoomLevel } from "@lexical/utils";
13976
14118
  import { $getNearestNodeFromDOMNode } from "lexical";
13977
14119
  import { useCallback as useCallback10, useEffect as useEffect20, useMemo as useMemo6, useRef as useRef11, useState as useState17 } from "react";
13978
14120
  import { createPortal as createPortal3 } from "react-dom";
13979
- import { Fragment as Fragment16, jsx as jsx128, jsxs as jsxs86 } from "@emotion/react/jsx-runtime";
14121
+ import { Fragment as Fragment16, jsx as jsx129, jsxs as jsxs86 } from "@emotion/react/jsx-runtime";
13980
14122
  var MIN_ROW_HEIGHT = 33;
13981
14123
  var MIN_COLUMN_WIDTH = 50;
13982
- var tableResizer = css96`
14124
+ var tableResizer = css97`
13983
14125
  position: absolute;
13984
14126
  z-index: var(--z-10);
13985
14127
  `;
@@ -14277,8 +14419,8 @@ function TableCellResizer({ editor, positioningAnchorEl }) {
14277
14419
  };
14278
14420
  }, [activeCell, draggingDirection, mouseCurrentPos, positioningAnchorEl]);
14279
14421
  const resizerStyles = getResizers();
14280
- return /* @__PURE__ */ jsx128("div", { ref: resizerRef, children: activeCell != null && !isMouseDown && /* @__PURE__ */ jsxs86(Fragment16, { children: [
14281
- /* @__PURE__ */ jsx128(
14422
+ return /* @__PURE__ */ jsx129("div", { ref: resizerRef, children: activeCell != null && !isMouseDown && /* @__PURE__ */ jsxs86(Fragment16, { children: [
14423
+ /* @__PURE__ */ jsx129(
14282
14424
  "div",
14283
14425
  {
14284
14426
  css: tableResizer,
@@ -14286,7 +14428,7 @@ function TableCellResizer({ editor, positioningAnchorEl }) {
14286
14428
  onMouseDown: toggleResize("right")
14287
14429
  }
14288
14430
  ),
14289
- /* @__PURE__ */ jsx128(
14431
+ /* @__PURE__ */ jsx129(
14290
14432
  "div",
14291
14433
  {
14292
14434
  css: tableResizer,
@@ -14301,7 +14443,7 @@ function TableCellResizerPlugin({ positioningAnchorEl }) {
14301
14443
  const isEditable = useLexicalEditable2();
14302
14444
  return useMemo6(
14303
14445
  () => isEditable ? createPortal3(
14304
- /* @__PURE__ */ jsx128(TableCellResizer, { editor, positioningAnchorEl }),
14446
+ /* @__PURE__ */ jsx129(TableCellResizer, { editor, positioningAnchorEl }),
14305
14447
  positioningAnchorEl
14306
14448
  ) : null,
14307
14449
  [editor, isEditable, positioningAnchorEl]
@@ -14367,7 +14509,7 @@ var TableSelectionPlugin = () => {
14367
14509
  var TableSelectionPlugin_default = TableSelectionPlugin;
14368
14510
 
14369
14511
  // src/components/ParameterInputs/rich-text/toolbar/RichTextToolbar.tsx
14370
- import { css as css97 } from "@emotion/react";
14512
+ import { css as css98 } from "@emotion/react";
14371
14513
  import { $createCodeNode } from "@lexical/code";
14372
14514
  import {
14373
14515
  $isListNode as $isListNode2,
@@ -14537,8 +14679,8 @@ var useRichTextToolbarState = ({ config }) => {
14537
14679
  };
14538
14680
 
14539
14681
  // src/components/ParameterInputs/rich-text/toolbar/RichTextToolbar.tsx
14540
- import { Fragment as Fragment17, jsx as jsx129, jsxs as jsxs87 } from "@emotion/react/jsx-runtime";
14541
- var toolbar = css97`
14682
+ import { Fragment as Fragment17, jsx as jsx130, jsxs as jsxs87 } from "@emotion/react/jsx-runtime";
14683
+ var toolbar = css98`
14542
14684
  ${scrollbarStyles}
14543
14685
  background: var(--gray-50);
14544
14686
  border-radius: var(--rounded-base);
@@ -14552,7 +14694,7 @@ var toolbar = css97`
14552
14694
  top: calc(var(--spacing-sm) * -2);
14553
14695
  z-index: 10;
14554
14696
  `;
14555
- var toolbarGroup = css97`
14697
+ var toolbarGroup = css98`
14556
14698
  display: flex;
14557
14699
  flex-shrink: 0;
14558
14700
  gap: var(--spacing-xs);
@@ -14569,7 +14711,7 @@ var toolbarGroup = css97`
14569
14711
  width: 1px;
14570
14712
  }
14571
14713
  `;
14572
- var richTextToolbarButton = css97`
14714
+ var richTextToolbarButton = css98`
14573
14715
  align-items: center;
14574
14716
  appearance: none;
14575
14717
  border: 0;
@@ -14583,21 +14725,21 @@ var richTextToolbarButton = css97`
14583
14725
  min-width: 32px;
14584
14726
  padding: 0 var(--spacing-sm);
14585
14727
  `;
14586
- var richTextToolbarButtonActive = css97`
14728
+ var richTextToolbarButtonActive = css98`
14587
14729
  background: var(--gray-200);
14588
14730
  `;
14589
- var textStyleButton = css97`
14731
+ var textStyleButton = css98`
14590
14732
  justify-content: space-between;
14591
14733
  min-width: 7rem;
14592
14734
  `;
14593
- var toolbarIcon = css97`
14735
+ var toolbarIcon = css98`
14594
14736
  color: inherit;
14595
14737
  `;
14596
- var toolbarChevron = css97`
14738
+ var toolbarChevron = css98`
14597
14739
  margin-left: var(--spacing-xs);
14598
14740
  `;
14599
14741
  var RichTextToolbarIcon = ({ icon }) => {
14600
- return /* @__PURE__ */ jsx129(Icon, { icon, css: toolbarIcon, size: "1rem" });
14742
+ return /* @__PURE__ */ jsx130(Icon, { icon, css: toolbarIcon, size: "1rem" });
14601
14743
  };
14602
14744
  var RichTextToolbar = ({ config, customControls, onInsertTable, onInsertAsset }) => {
14603
14745
  const [editor] = useLexicalComposerContext8();
@@ -14718,7 +14860,7 @@ var RichTextToolbar = ({ config, customControls, onInsertTable, onInsertAsset })
14718
14860
  menuTrigger: /* @__PURE__ */ jsxs87("button", { css: [richTextToolbarButton, textStyleButton], title: "Text styles", type: "button", children: [
14719
14861
  visibleTextualElements.some((element) => element.type === activeElement) ? getLabelForElement(activeElement) : getLabelForElement("paragraph"),
14720
14862
  " ",
14721
- /* @__PURE__ */ jsx129(Icon, { icon: "chevron-down", css: [toolbarIcon, toolbarChevron], size: "1rem" })
14863
+ /* @__PURE__ */ jsx130(Icon, { icon: "chevron-down", css: [toolbarIcon, toolbarChevron], size: "1rem" })
14722
14864
  ] }),
14723
14865
  placement: "bottom-start",
14724
14866
  children: [
@@ -14728,7 +14870,7 @@ var RichTextToolbar = ({ config, customControls, onInsertTable, onInsertAsset })
14728
14870
  type: "paragraph"
14729
14871
  },
14730
14872
  ...visibleTextualElements
14731
- ].map((element) => /* @__PURE__ */ jsx129(
14873
+ ].map((element) => /* @__PURE__ */ jsx130(
14732
14874
  MenuItem,
14733
14875
  {
14734
14876
  "data-testid": "menu-item",
@@ -14739,12 +14881,12 @@ var RichTextToolbar = ({ config, customControls, onInsertTable, onInsertAsset })
14739
14881
  },
14740
14882
  element.type
14741
14883
  )),
14742
- visibleTextualElements.length === 0 ? /* @__PURE__ */ jsx129(MenuItem, { disabled: true, children: "Alternative text styles are not available" }) : null
14884
+ visibleTextualElements.length === 0 ? /* @__PURE__ */ jsx130(MenuItem, { disabled: true, children: "Alternative text styles are not available" }) : null
14743
14885
  ]
14744
14886
  }
14745
14887
  ),
14746
14888
  visibleFormatsWithIcon.length > 0 || visibleFormatsWithoutIcon.length > 0 ? /* @__PURE__ */ jsxs87("div", { css: toolbarGroup, "data-testid": "rich-text-toolbar-formatting", children: [
14747
- visibleFormatsWithIcon.map((format) => /* @__PURE__ */ jsx129(Tooltip, { title: format.label, placement: "top", children: /* @__PURE__ */ jsx129(
14889
+ visibleFormatsWithIcon.map((format) => /* @__PURE__ */ jsx130(Tooltip, { title: format.label, placement: "top", children: /* @__PURE__ */ jsx130(
14748
14890
  "button",
14749
14891
  {
14750
14892
  "data-testid": `formatting-button-${format.type}`,
@@ -14756,15 +14898,15 @@ var RichTextToolbar = ({ config, customControls, onInsertTable, onInsertAsset })
14756
14898
  richTextToolbarButton,
14757
14899
  activeFormats.includes(format.type) ? richTextToolbarButtonActive : null
14758
14900
  ],
14759
- children: /* @__PURE__ */ jsx129(RichTextToolbarIcon, { icon: FORMATS_WITH_ICON.get(format.type) })
14901
+ children: /* @__PURE__ */ jsx130(RichTextToolbarIcon, { icon: FORMATS_WITH_ICON.get(format.type) })
14760
14902
  }
14761
14903
  ) }, format.type)),
14762
- visibleFormatsWithoutIcon.length > 0 ? /* @__PURE__ */ jsx129(
14904
+ visibleFormatsWithoutIcon.length > 0 ? /* @__PURE__ */ jsx130(
14763
14905
  Menu,
14764
14906
  {
14765
- menuTrigger: /* @__PURE__ */ jsx129("button", { css: richTextToolbarButton, title: "Alternative text styles", type: "button", children: /* @__PURE__ */ jsx129(Icon, { icon: "more-alt", css: toolbarIcon }) }),
14907
+ menuTrigger: /* @__PURE__ */ jsx130("button", { css: richTextToolbarButton, title: "Alternative text styles", type: "button", children: /* @__PURE__ */ jsx130(Icon, { icon: "more-alt", css: toolbarIcon }) }),
14766
14908
  placement: "bottom-start",
14767
- children: visibleFormatsWithoutIcon.map((format) => /* @__PURE__ */ jsx129(
14909
+ children: visibleFormatsWithoutIcon.map((format) => /* @__PURE__ */ jsx130(
14768
14910
  MenuItem,
14769
14911
  {
14770
14912
  onClick: () => {
@@ -14778,7 +14920,7 @@ var RichTextToolbar = ({ config, customControls, onInsertTable, onInsertAsset })
14778
14920
  ) : null
14779
14921
  ] }) : null,
14780
14922
  visibleElementsWithIcons.size > 0 || customControls ? /* @__PURE__ */ jsxs87("div", { css: toolbarGroup, "data-testid": "rich-text-toolbar-elements", children: [
14781
- linkElementVisible ? /* @__PURE__ */ jsx129(Tooltip, { title: "Link", placement: "top", children: /* @__PURE__ */ jsx129(
14923
+ linkElementVisible ? /* @__PURE__ */ jsx130(Tooltip, { title: "Link", placement: "top", children: /* @__PURE__ */ jsx130(
14782
14924
  "button",
14783
14925
  {
14784
14926
  "data-testid": "element-link",
@@ -14791,11 +14933,11 @@ var RichTextToolbar = ({ config, customControls, onInsertTable, onInsertAsset })
14791
14933
  }
14792
14934
  },
14793
14935
  css: [richTextToolbarButton, isLink ? richTextToolbarButtonActive : null],
14794
- children: /* @__PURE__ */ jsx129(RichTextToolbarIcon, { icon: "link" })
14936
+ children: /* @__PURE__ */ jsx130(RichTextToolbarIcon, { icon: "link" })
14795
14937
  }
14796
14938
  ) }) : null,
14797
14939
  visibleLists.size > 0 ? /* @__PURE__ */ jsxs87(Fragment17, { children: [
14798
- visibleLists.has("unorderedList") ? /* @__PURE__ */ jsx129(Tooltip, { title: "Bullet List", placement: "top", children: /* @__PURE__ */ jsx129(
14940
+ visibleLists.has("unorderedList") ? /* @__PURE__ */ jsx130(Tooltip, { title: "Bullet List", placement: "top", children: /* @__PURE__ */ jsx130(
14799
14941
  "button",
14800
14942
  {
14801
14943
  "data-testid": "element-unordered-list",
@@ -14811,10 +14953,10 @@ var RichTextToolbar = ({ config, customControls, onInsertTable, onInsertAsset })
14811
14953
  richTextToolbarButton,
14812
14954
  activeElement === "unorderedList" ? richTextToolbarButtonActive : null
14813
14955
  ],
14814
- children: /* @__PURE__ */ jsx129(RichTextToolbarIcon, { icon: "layout-list" })
14956
+ children: /* @__PURE__ */ jsx130(RichTextToolbarIcon, { icon: "layout-list" })
14815
14957
  }
14816
14958
  ) }) : null,
14817
- visibleLists.has("orderedList") ? /* @__PURE__ */ jsx129(Tooltip, { title: "Ordered List", placement: "top", children: /* @__PURE__ */ jsx129(
14959
+ visibleLists.has("orderedList") ? /* @__PURE__ */ jsx130(Tooltip, { title: "Ordered List", placement: "top", children: /* @__PURE__ */ jsx130(
14818
14960
  "button",
14819
14961
  {
14820
14962
  "data-testid": "element-ordered-list",
@@ -14830,58 +14972,58 @@ var RichTextToolbar = ({ config, customControls, onInsertTable, onInsertAsset })
14830
14972
  richTextToolbarButton,
14831
14973
  activeElement === "orderedList" ? richTextToolbarButtonActive : null
14832
14974
  ],
14833
- children: /* @__PURE__ */ jsx129(RichTextToolbarIcon, { icon: "layout-list-numbered" })
14975
+ children: /* @__PURE__ */ jsx130(RichTextToolbarIcon, { icon: "layout-list-numbered" })
14834
14976
  }
14835
14977
  ) }) : null
14836
14978
  ] }) : null,
14837
14979
  customControls ? customControls : null
14838
14980
  ] }) : null,
14839
- visibleInsertElementsWithIcons.size > 0 ? /* @__PURE__ */ jsx129("div", { css: toolbarGroup, "data-testid": "rich-text-toolbar-insert", children: /* @__PURE__ */ jsxs87(
14981
+ visibleInsertElementsWithIcons.size > 0 ? /* @__PURE__ */ jsx130("div", { css: toolbarGroup, "data-testid": "rich-text-toolbar-insert", children: /* @__PURE__ */ jsxs87(
14840
14982
  Menu,
14841
14983
  {
14842
14984
  menuTrigger: /* @__PURE__ */ jsxs87("button", { css: richTextToolbarButton, title: "Insert block element", type: "button", children: [
14843
14985
  "Insert",
14844
- /* @__PURE__ */ jsx129(Icon, { icon: "chevron-down", css: [toolbarIcon, toolbarChevron], size: "1rem" })
14986
+ /* @__PURE__ */ jsx130(Icon, { icon: "chevron-down", css: [toolbarIcon, toolbarChevron], size: "1rem" })
14845
14987
  ] }),
14846
14988
  placement: "bottom-start",
14847
14989
  children: [
14848
- quoteElementVisible ? /* @__PURE__ */ jsx129(
14990
+ quoteElementVisible ? /* @__PURE__ */ jsx130(
14849
14991
  MenuItem,
14850
14992
  {
14851
14993
  onClick: () => {
14852
14994
  onSelectElement("quote");
14853
14995
  },
14854
- icon: /* @__PURE__ */ jsx129(Icon, { icon: "quote", iconColor: "currentColor" }),
14996
+ icon: /* @__PURE__ */ jsx130(Icon, { icon: "quote", iconColor: "currentColor" }),
14855
14997
  children: "Quote"
14856
14998
  }
14857
14999
  ) : null,
14858
- codeElementVisible ? /* @__PURE__ */ jsx129(
15000
+ codeElementVisible ? /* @__PURE__ */ jsx130(
14859
15001
  MenuItem,
14860
15002
  {
14861
15003
  onClick: () => {
14862
15004
  onSelectElement("code");
14863
15005
  },
14864
- icon: /* @__PURE__ */ jsx129(Icon, { icon: "code-slash", iconColor: "currentColor" }),
15006
+ icon: /* @__PURE__ */ jsx130(Icon, { icon: "code-slash", iconColor: "currentColor" }),
14865
15007
  children: "Code"
14866
15008
  }
14867
15009
  ) : null,
14868
- tableElementVisible && onInsertTable !== void 0 ? /* @__PURE__ */ jsx129(
15010
+ tableElementVisible && onInsertTable !== void 0 ? /* @__PURE__ */ jsx130(
14869
15011
  MenuItem,
14870
15012
  {
14871
15013
  onClick: () => {
14872
15014
  onSelectElement("table");
14873
15015
  },
14874
- icon: /* @__PURE__ */ jsx129(Icon, { icon: "view-grid", iconColor: "currentColor" }),
15016
+ icon: /* @__PURE__ */ jsx130(Icon, { icon: "view-grid", iconColor: "currentColor" }),
14875
15017
  children: "Table"
14876
15018
  }
14877
15019
  ) : null,
14878
- assetElementVisible && onInsertAsset !== void 0 ? /* @__PURE__ */ jsx129(
15020
+ assetElementVisible && onInsertAsset !== void 0 ? /* @__PURE__ */ jsx130(
14879
15021
  MenuItem,
14880
15022
  {
14881
15023
  onClick: () => {
14882
15024
  onSelectElement("asset");
14883
15025
  },
14884
- icon: /* @__PURE__ */ jsx129(Icon, { icon: "image", iconColor: "currentColor" }),
15026
+ icon: /* @__PURE__ */ jsx130(Icon, { icon: "image", iconColor: "currentColor" }),
14885
15027
  children: "Asset"
14886
15028
  }
14887
15029
  ) : null
@@ -14893,7 +15035,7 @@ var RichTextToolbar = ({ config, customControls, onInsertTable, onInsertAsset })
14893
15035
  var RichTextToolbar_default = RichTextToolbar;
14894
15036
 
14895
15037
  // src/components/ParameterInputs/ParameterRichText.tsx
14896
- import { Fragment as Fragment18, jsx as jsx130, jsxs as jsxs88 } from "@emotion/react/jsx-runtime";
15038
+ import { Fragment as Fragment18, jsx as jsx131, jsxs as jsxs88 } from "@emotion/react/jsx-runtime";
14897
15039
  var ParameterRichText = ({
14898
15040
  label,
14899
15041
  labelLeadingIcon,
@@ -14921,13 +15063,13 @@ var ParameterRichText = ({
14921
15063
  captionTestId,
14922
15064
  menuItems,
14923
15065
  children: [
14924
- /* @__PURE__ */ jsx130(ParameterRichTextInner, { ...innerProps, children }),
14925
- menuItems ? /* @__PURE__ */ jsx130(ParameterMenuButton, { label: `${label} menu`, children: /* @__PURE__ */ jsx130(Fragment18, { children: menuItems }) }) : null
15066
+ /* @__PURE__ */ jsx131(ParameterRichTextInner, { ...innerProps, children }),
15067
+ menuItems ? /* @__PURE__ */ jsx131(ParameterMenuButton, { label: `${label} menu`, children: /* @__PURE__ */ jsx131(Fragment18, { children: menuItems }) }) : null
14926
15068
  ]
14927
15069
  }
14928
15070
  );
14929
15071
  };
14930
- var editorContainerWrapper = css98`
15072
+ var editorContainerWrapper = css99`
14931
15073
  position: relative;
14932
15074
 
14933
15075
  &::before {
@@ -14943,12 +15085,12 @@ var editorContainerWrapper = css98`
14943
15085
  z-index: 2;
14944
15086
  }
14945
15087
  `;
14946
- var editorWrapper = css98`
15088
+ var editorWrapper = css99`
14947
15089
  display: flex;
14948
15090
  flex-flow: column;
14949
15091
  flex-grow: 1;
14950
15092
  `;
14951
- var editorContainer = css98`
15093
+ var editorContainer = css99`
14952
15094
  ${scrollbarStyles}
14953
15095
  background: var(--white);
14954
15096
  border-radius: var(--rounded-sm);
@@ -14980,7 +15122,7 @@ var editorContainer = css98`
14980
15122
  max-height: unset;
14981
15123
  }
14982
15124
  `;
14983
- var editorContainerOverflowWrapper = css98`
15125
+ var editorContainerOverflowWrapper = css99`
14984
15126
  overflow: hidden;
14985
15127
  pointer-events: none;
14986
15128
 
@@ -14988,7 +15130,7 @@ var editorContainerOverflowWrapper = css98`
14988
15130
  pointer-events: auto;
14989
15131
  }
14990
15132
  `;
14991
- var editorPlaceholder = css98`
15133
+ var editorPlaceholder = css99`
14992
15134
  color: var(--gray-500);
14993
15135
  font-style: italic;
14994
15136
  /* 1px is added to make sure caret is clearly visible when field is focused
@@ -14999,7 +15141,7 @@ var editorPlaceholder = css98`
14999
15141
  top: calc(1rem + var(--spacing-sm));
15000
15142
  user-select: none;
15001
15143
  `;
15002
- var editorInput = css98`
15144
+ var editorInput = css99`
15003
15145
  min-height: 100%;
15004
15146
  flex-grow: 1;
15005
15147
 
@@ -15073,7 +15215,7 @@ var ParameterRichTextInner = ({
15073
15215
  editable: !richTextProps.readOnly
15074
15216
  };
15075
15217
  return /* @__PURE__ */ jsxs88(Fragment18, { children: [
15076
- /* @__PURE__ */ jsx130("div", { css: [editorWrapper], className: editorWrapperClassName, children: /* @__PURE__ */ jsx130(LexicalComposer, { initialConfig: lexicalConfig, children: /* @__PURE__ */ jsx130(RichText, { ...richTextProps, children }) }) }),
15218
+ /* @__PURE__ */ jsx131("div", { css: [editorWrapper], className: editorWrapperClassName, children: /* @__PURE__ */ jsx131(LexicalComposer, { initialConfig: lexicalConfig, children: /* @__PURE__ */ jsx131(RichText, { ...richTextProps, children }) }) }),
15077
15219
  editorFooter ? editorFooter : null
15078
15220
  ] });
15079
15221
  };
@@ -15141,7 +15283,7 @@ var RichText = ({
15141
15283
  }
15142
15284
  };
15143
15285
  return /* @__PURE__ */ jsxs88(Fragment18, { children: [
15144
- readOnly || minimalInteractivity ? null : /* @__PURE__ */ jsx130(
15286
+ readOnly || minimalInteractivity ? null : /* @__PURE__ */ jsx131(
15145
15287
  RichTextToolbar_default,
15146
15288
  {
15147
15289
  config,
@@ -15159,33 +15301,33 @@ var RichText = ({
15159
15301
  ref: onEditorContainerRef,
15160
15302
  "data-testid": "value-container",
15161
15303
  children: [
15162
- /* @__PURE__ */ jsx130(
15304
+ /* @__PURE__ */ jsx131(
15163
15305
  RichTextPlugin,
15164
15306
  {
15165
- contentEditable: /* @__PURE__ */ jsx130(ContentEditable, { css: editorInput, className: editorInputClassName }),
15166
- placeholder: /* @__PURE__ */ jsx130("div", { css: editorPlaceholder, "data-placeholder": true, children: placeholder != null ? placeholder : readOnly ? "empty" : "start editing..." }),
15307
+ contentEditable: /* @__PURE__ */ jsx131(ContentEditable, { css: editorInput, className: editorInputClassName }),
15308
+ placeholder: /* @__PURE__ */ jsx131("div", { css: editorPlaceholder, "data-placeholder": true, children: placeholder != null ? placeholder : readOnly ? "empty" : "start editing..." }),
15167
15309
  ErrorBoundary: LexicalErrorBoundary
15168
15310
  }
15169
15311
  ),
15170
- /* @__PURE__ */ jsx130(ListPlugin, {}),
15171
- /* @__PURE__ */ jsx130(ListIndentPlugin, { maxDepth: 4 }),
15172
- /* @__PURE__ */ jsx130(TablePlugin, { hasCellMerge: false, hasCellBackgroundColor: false }),
15173
- /* @__PURE__ */ jsx130("div", { css: editorContainerOverflowWrapper, "data-testid": "table-action-menu-plugin", children: editorContainerRef && portalContainerRef && !minimalInteractivity ? /* @__PURE__ */ jsx130(
15312
+ /* @__PURE__ */ jsx131(ListPlugin, {}),
15313
+ /* @__PURE__ */ jsx131(ListIndentPlugin, { maxDepth: 4 }),
15314
+ /* @__PURE__ */ jsx131(TablePlugin, { hasCellMerge: false, hasCellBackgroundColor: false }),
15315
+ /* @__PURE__ */ jsx131("div", { css: editorContainerOverflowWrapper, "data-testid": "table-action-menu-plugin", children: editorContainerRef && portalContainerRef && !minimalInteractivity ? /* @__PURE__ */ jsx131(
15174
15316
  TableActionMenuPlugin,
15175
15317
  {
15176
15318
  positioningAnchorEl: editorContainerRef,
15177
15319
  menuPortalEl: portalContainerRef
15178
15320
  }
15179
15321
  ) : null }),
15180
- editorContainerRef && !minimalInteractivity ? /* @__PURE__ */ jsx130(TableCellResizerPlugin, { positioningAnchorEl: editorContainerRef }) : null,
15181
- readOnly ? null : /* @__PURE__ */ jsx130(HistoryPlugin, {}),
15182
- /* @__PURE__ */ jsx130(DisableStylesPlugin, {}),
15183
- /* @__PURE__ */ jsx130(MarkdownShortcutPlugin, { transformers: MARKDOWN_TRANSFORMERS })
15322
+ editorContainerRef && !minimalInteractivity ? /* @__PURE__ */ jsx131(TableCellResizerPlugin, { positioningAnchorEl: editorContainerRef }) : null,
15323
+ readOnly ? null : /* @__PURE__ */ jsx131(HistoryPlugin, {}),
15324
+ /* @__PURE__ */ jsx131(DisableStylesPlugin, {}),
15325
+ /* @__PURE__ */ jsx131(MarkdownShortcutPlugin, { transformers: MARKDOWN_TRANSFORMERS })
15184
15326
  ]
15185
15327
  }
15186
15328
  ),
15187
- /* @__PURE__ */ jsx130(Fragment18, { children }),
15188
- editorContainerRef ? /* @__PURE__ */ jsx130(
15329
+ /* @__PURE__ */ jsx131(Fragment18, { children }),
15330
+ editorContainerRef ? /* @__PURE__ */ jsx131(
15189
15331
  LinkNodePlugin,
15190
15332
  {
15191
15333
  onConnectLink: onConnectLink ? onConnectLink : () => Promise.resolve(),
@@ -15196,19 +15338,19 @@ var RichText = ({
15196
15338
  positioningAnchorEl: editorContainerRef
15197
15339
  }
15198
15340
  ) : null,
15199
- /* @__PURE__ */ jsx130(TableSelectionPlugin_default, {}),
15200
- /* @__PURE__ */ jsx130(ImprovedAssetSelectionPlugin_default, {})
15341
+ /* @__PURE__ */ jsx131(TableSelectionPlugin_default, {}),
15342
+ /* @__PURE__ */ jsx131(ImprovedAssetSelectionPlugin_default, {})
15201
15343
  ] })
15202
15344
  ] });
15203
15345
  };
15204
15346
 
15205
15347
  // src/components/ParameterInputs/ParameterSelect.tsx
15206
15348
  import { forwardRef as forwardRef26 } from "react";
15207
- import { jsx as jsx131, jsxs as jsxs89 } from "@emotion/react/jsx-runtime";
15349
+ import { jsx as jsx132, jsxs as jsxs89 } from "@emotion/react/jsx-runtime";
15208
15350
  var ParameterSelect = forwardRef26(
15209
15351
  ({ defaultOption, options, ...props }, ref) => {
15210
15352
  const { shellProps, innerProps } = extractParameterProps(props);
15211
- return /* @__PURE__ */ jsx131(ParameterShell, { ...shellProps, children: /* @__PURE__ */ jsx131(ParameterSelectInner, { options, defaultOption, ...innerProps, ref }) });
15353
+ return /* @__PURE__ */ jsx132(ParameterShell, { ...shellProps, children: /* @__PURE__ */ jsx132(ParameterSelectInner, { options, defaultOption, ...innerProps, ref }) });
15212
15354
  }
15213
15355
  );
15214
15356
  var ParameterSelectInner = forwardRef26(
@@ -15223,10 +15365,10 @@ var ParameterSelectInner = forwardRef26(
15223
15365
  ref,
15224
15366
  ...props,
15225
15367
  children: [
15226
- defaultOption ? /* @__PURE__ */ jsx131("option", { value: "", children: defaultOption }) : null,
15368
+ defaultOption ? /* @__PURE__ */ jsx132("option", { value: "", children: defaultOption }) : null,
15227
15369
  options.map((option) => {
15228
15370
  var _a;
15229
- return /* @__PURE__ */ jsx131("option", { value: (_a = option.value) != null ? _a : option.label, children: option.label }, option.label);
15371
+ return /* @__PURE__ */ jsx132("option", { value: (_a = option.value) != null ? _a : option.label, children: option.label }, option.label);
15230
15372
  })
15231
15373
  ]
15232
15374
  }
@@ -15236,14 +15378,14 @@ var ParameterSelectInner = forwardRef26(
15236
15378
 
15237
15379
  // src/components/ParameterInputs/ParameterTextarea.tsx
15238
15380
  import { forwardRef as forwardRef27 } from "react";
15239
- import { jsx as jsx132 } from "@emotion/react/jsx-runtime";
15381
+ import { jsx as jsx133 } from "@emotion/react/jsx-runtime";
15240
15382
  var ParameterTextarea = forwardRef27((props, ref) => {
15241
15383
  const { shellProps, innerProps } = extractParameterProps(props);
15242
- return /* @__PURE__ */ jsx132(ParameterShell, { "data-testid": "parameter-textarea", ...shellProps, children: /* @__PURE__ */ jsx132(ParameterTextareaInner, { ref, ...innerProps }) });
15384
+ return /* @__PURE__ */ jsx133(ParameterShell, { "data-testid": "parameter-textarea", ...shellProps, children: /* @__PURE__ */ jsx133(ParameterTextareaInner, { ref, ...innerProps }) });
15243
15385
  });
15244
15386
  var ParameterTextareaInner = forwardRef27(({ ...props }, ref) => {
15245
15387
  const { id, label, hiddenLabel } = useParameterShell();
15246
- return /* @__PURE__ */ jsx132(
15388
+ return /* @__PURE__ */ jsx133(
15247
15389
  "textarea",
15248
15390
  {
15249
15391
  css: [input3, textarea2],
@@ -15257,25 +15399,25 @@ var ParameterTextareaInner = forwardRef27(({ ...props }, ref) => {
15257
15399
 
15258
15400
  // src/components/ParameterInputs/ParameterToggle.tsx
15259
15401
  import { forwardRef as forwardRef28 } from "react";
15260
- import { jsx as jsx133, jsxs as jsxs90 } from "@emotion/react/jsx-runtime";
15402
+ import { jsx as jsx134, jsxs as jsxs90 } from "@emotion/react/jsx-runtime";
15261
15403
  var ParameterToggle = forwardRef28((props, ref) => {
15262
15404
  const { shellProps, innerProps } = extractParameterProps(props);
15263
- return /* @__PURE__ */ jsx133(ParameterShell, { ...shellProps, children: /* @__PURE__ */ jsx133(ParameterToggleInner, { ref, ...innerProps }) });
15405
+ return /* @__PURE__ */ jsx134(ParameterShell, { ...shellProps, children: /* @__PURE__ */ jsx134(ParameterToggleInner, { ref, ...innerProps }) });
15264
15406
  });
15265
15407
  var ParameterToggleInner = forwardRef28(
15266
15408
  ({ children, ...props }, ref) => {
15267
15409
  const { id, label } = useParameterShell();
15268
15410
  return /* @__PURE__ */ jsxs90("label", { css: inputToggleLabel2, children: [
15269
- /* @__PURE__ */ jsx133("input", { css: toggleInput2, type: props.type, id, ref, ...props }),
15270
- /* @__PURE__ */ jsx133("span", { css: inlineLabel2, children: label }),
15411
+ /* @__PURE__ */ jsx134("input", { css: toggleInput2, type: props.type, id, ref, ...props }),
15412
+ /* @__PURE__ */ jsx134("span", { css: inlineLabel2, children: label }),
15271
15413
  children
15272
15414
  ] });
15273
15415
  }
15274
15416
  );
15275
15417
 
15276
15418
  // src/components/ProgressBar/ProgressBar.styles.ts
15277
- import { css as css99, keyframes as keyframes4 } from "@emotion/react";
15278
- var container3 = css99`
15419
+ import { css as css100, keyframes as keyframes4 } from "@emotion/react";
15420
+ var container3 = css100`
15279
15421
  background: var(--gray-50);
15280
15422
  margin-block: var(--spacing-sm);
15281
15423
  position: relative;
@@ -15285,13 +15427,13 @@ var container3 = css99`
15285
15427
  border: solid 1px var(--gray-300);
15286
15428
  `;
15287
15429
  var themeMap = {
15288
- primary: css99`
15430
+ primary: css100`
15289
15431
  --progress-color: var(--accent-light);
15290
15432
  `,
15291
- secondary: css99`
15433
+ secondary: css100`
15292
15434
  --progress-color: var(--accent-alt-light);
15293
15435
  `,
15294
- destructive: css99`
15436
+ destructive: css100`
15295
15437
  --progress-color: var(--brand-secondary-5);
15296
15438
  `
15297
15439
  };
@@ -15303,10 +15445,10 @@ var slidingBackgroundPosition = keyframes4`
15303
15445
  background-position: 64px 0;
15304
15446
  }
15305
15447
  `;
15306
- var determinate = css99`
15448
+ var determinate = css100`
15307
15449
  background-color: var(--progress-color);
15308
15450
  `;
15309
- var indeterminate = css99`
15451
+ var indeterminate = css100`
15310
15452
  background-image: linear-gradient(
15311
15453
  45deg,
15312
15454
  var(--progress-color) 25%,
@@ -15320,7 +15462,7 @@ var indeterminate = css99`
15320
15462
  background-size: 64px 64px;
15321
15463
  animation: ${slidingBackgroundPosition} 1s linear infinite;
15322
15464
  `;
15323
- var bar = css99`
15465
+ var bar = css100`
15324
15466
  position: absolute;
15325
15467
  inset: 0;
15326
15468
  transition: transform var(--duration-fast) var(--timing-ease-out);
@@ -15328,7 +15470,7 @@ var bar = css99`
15328
15470
  `;
15329
15471
 
15330
15472
  // src/components/ProgressBar/ProgressBar.tsx
15331
- import { jsx as jsx134 } from "@emotion/react/jsx-runtime";
15473
+ import { jsx as jsx135 } from "@emotion/react/jsx-runtime";
15332
15474
  function ProgressBar({
15333
15475
  current,
15334
15476
  max,
@@ -15338,7 +15480,7 @@ function ProgressBar({
15338
15480
  }) {
15339
15481
  const valueNow = Math.min(current, max);
15340
15482
  const valuePercentage = max > 0 ? Math.ceil(100 / max * valueNow) : 0;
15341
- return /* @__PURE__ */ jsx134(
15483
+ return /* @__PURE__ */ jsx135(
15342
15484
  "div",
15343
15485
  {
15344
15486
  css: container3,
@@ -15349,7 +15491,7 @@ function ProgressBar({
15349
15491
  "aria-valuemax": max,
15350
15492
  "aria-valuenow": valueNow,
15351
15493
  ...props,
15352
- children: /* @__PURE__ */ jsx134(
15494
+ children: /* @__PURE__ */ jsx135(
15353
15495
  "div",
15354
15496
  {
15355
15497
  css: [
@@ -15368,28 +15510,28 @@ function ProgressBar({
15368
15510
  }
15369
15511
 
15370
15512
  // src/components/ProgressList/ProgressList.tsx
15371
- import { css as css101 } from "@emotion/react";
15513
+ import { css as css102 } from "@emotion/react";
15372
15514
  import { CgCheckO as CgCheckO2 } from "@react-icons/all-files/cg/CgCheckO";
15373
15515
  import { CgRadioCheck } from "@react-icons/all-files/cg/CgRadioCheck";
15374
15516
  import { CgRecord } from "@react-icons/all-files/cg/CgRecord";
15375
15517
  import { useMemo as useMemo8 } from "react";
15376
15518
 
15377
15519
  // src/components/ProgressList/styles/ProgressList.styles.ts
15378
- import { css as css100 } from "@emotion/react";
15379
- var progressListStyles = css100`
15520
+ import { css as css101 } from "@emotion/react";
15521
+ var progressListStyles = css101`
15380
15522
  display: flex;
15381
15523
  flex-direction: column;
15382
15524
  gap: var(--spacing-sm);
15383
15525
  list-style-type: none;
15384
15526
  `;
15385
- var progressListItemStyles = css100`
15527
+ var progressListItemStyles = css101`
15386
15528
  display: flex;
15387
15529
  gap: var(--spacing-base);
15388
15530
  align-items: center;
15389
15531
  `;
15390
15532
 
15391
15533
  // src/components/ProgressList/ProgressList.tsx
15392
- import { jsx as jsx135, jsxs as jsxs91 } from "@emotion/react/jsx-runtime";
15534
+ import { jsx as jsx136, jsxs as jsxs91 } from "@emotion/react/jsx-runtime";
15393
15535
  var ProgressList = ({ inProgressId, items, autoEllipsis, ...htmlProps }) => {
15394
15536
  const itemsWithStatus = useMemo8(() => {
15395
15537
  const indexOfInProgressItem = items.findIndex(({ id }) => id === inProgressId);
@@ -15403,8 +15545,8 @@ var ProgressList = ({ inProgressId, items, autoEllipsis, ...htmlProps }) => {
15403
15545
  return { ...item, status };
15404
15546
  });
15405
15547
  }, [items, inProgressId]);
15406
- return /* @__PURE__ */ jsx135("ol", { css: progressListStyles, ...htmlProps, children: itemsWithStatus.map(({ id, label, status, error, errorLevel }) => {
15407
- return /* @__PURE__ */ jsx135(
15548
+ return /* @__PURE__ */ jsx136("ol", { css: progressListStyles, ...htmlProps, children: itemsWithStatus.map(({ id, label, status, error, errorLevel }) => {
15549
+ return /* @__PURE__ */ jsx136(
15408
15550
  ProgressListItem,
15409
15551
  {
15410
15552
  status,
@@ -15437,12 +15579,12 @@ var ProgressListItem = ({
15437
15579
  }, [status, error]);
15438
15580
  const statusStyles = useMemo8(() => {
15439
15581
  if (error) {
15440
- return errorLevel === "caution" ? css101`
15582
+ return errorLevel === "caution" ? css102`
15441
15583
  color: rgb(161, 98, 7);
15442
15584
  & svg {
15443
15585
  color: rgb(250, 204, 21);
15444
15586
  }
15445
- ` : css101`
15587
+ ` : css102`
15446
15588
  color: rgb(185, 28, 28);
15447
15589
  & svg {
15448
15590
  color: var(--brand-primary-2);
@@ -15450,38 +15592,38 @@ var ProgressListItem = ({
15450
15592
  `;
15451
15593
  }
15452
15594
  const colorPerStatus = {
15453
- completed: css101`
15595
+ completed: css102`
15454
15596
  opacity: 0.75;
15455
15597
  `,
15456
- inProgress: css101`
15598
+ inProgress: css102`
15457
15599
  -webkit-text-stroke-width: thin;
15458
15600
  `,
15459
- queued: css101`
15601
+ queued: css102`
15460
15602
  opacity: 0.5;
15461
15603
  `
15462
15604
  };
15463
15605
  return colorPerStatus[status];
15464
15606
  }, [status, error, errorLevel]);
15465
15607
  return /* @__PURE__ */ jsxs91("li", { css: [progressListItemStyles, statusStyles], children: [
15466
- /* @__PURE__ */ jsx135(Tooltip, { title: error != null ? error : "", children: /* @__PURE__ */ jsx135("div", { children: /* @__PURE__ */ jsx135(Icon, { icon, size: 20, iconColor: "currentColor" }) }) }),
15608
+ /* @__PURE__ */ jsx136(Tooltip, { title: error != null ? error : "", children: /* @__PURE__ */ jsx136("div", { children: /* @__PURE__ */ jsx136(Icon, { icon, size: 20, iconColor: "currentColor" }) }) }),
15467
15609
  /* @__PURE__ */ jsxs91("div", { children: [
15468
15610
  children,
15469
- /* @__PURE__ */ jsx135("span", { css: { visibility: autoEllipsis && status === "inProgress" && !error ? "visible" : "hidden" }, children: "..." })
15611
+ /* @__PURE__ */ jsx136("span", { css: { visibility: autoEllipsis && status === "inProgress" && !error ? "visible" : "hidden" }, children: "..." })
15470
15612
  ] })
15471
15613
  ] });
15472
15614
  };
15473
15615
 
15474
15616
  // src/components/SegmentedControl/SegmentedControl.tsx
15475
- import { css as css103 } from "@emotion/react";
15617
+ import { css as css104 } from "@emotion/react";
15476
15618
  import { CgCheck as CgCheck5 } from "@react-icons/all-files/cg/CgCheck";
15477
15619
  import { useCallback as useCallback12, useEffect as useEffect24, useMemo as useMemo9, useRef as useRef12, useState as useState21 } from "react";
15478
15620
 
15479
15621
  // src/components/SegmentedControl/SegmentedControl.styles.ts
15480
- import { css as css102 } from "@emotion/react";
15481
- var segmentedControlRootStyles = css102`
15622
+ import { css as css103 } from "@emotion/react";
15623
+ var segmentedControlRootStyles = css103`
15482
15624
  position: relative;
15483
15625
  `;
15484
- var segmentedControlScrollIndicatorsStyles = css102`
15626
+ var segmentedControlScrollIndicatorsStyles = css103`
15485
15627
  position: absolute;
15486
15628
  inset: 0;
15487
15629
  z-index: 1;
@@ -15509,17 +15651,17 @@ var segmentedControlScrollIndicatorsStyles = css102`
15509
15651
  background: linear-gradient(to left, var(--background-color) 10%, transparent);
15510
15652
  }
15511
15653
  `;
15512
- var segmentedControlScrollIndicatorStartVisibleStyles = css102`
15654
+ var segmentedControlScrollIndicatorStartVisibleStyles = css103`
15513
15655
  &::before {
15514
15656
  opacity: 1;
15515
15657
  }
15516
15658
  `;
15517
- var segmentedControlScrollIndicatorEndVisibleStyles = css102`
15659
+ var segmentedControlScrollIndicatorEndVisibleStyles = css103`
15518
15660
  &::after {
15519
15661
  opacity: 1;
15520
15662
  }
15521
15663
  `;
15522
- var segmentedControlWrapperStyles = css102`
15664
+ var segmentedControlWrapperStyles = css103`
15523
15665
  overflow-y: auto;
15524
15666
  scroll-behavior: smooth;
15525
15667
  scrollbar-width: none;
@@ -15528,7 +15670,7 @@ var segmentedControlWrapperStyles = css102`
15528
15670
  height: 0px;
15529
15671
  }
15530
15672
  `;
15531
- var segmentedControlStyles = css102`
15673
+ var segmentedControlStyles = css103`
15532
15674
  --segmented-control-rounded-value: var(--rounded-base);
15533
15675
  --segmented-control-border-width: 1px;
15534
15676
  --segmented-control-selected-color: var(--brand-secondary-3);
@@ -15547,14 +15689,14 @@ var segmentedControlStyles = css102`
15547
15689
  border-radius: calc(var(--segmented-control-rounded-value) + var(--segmented-control-border-width));
15548
15690
  font-size: var(--fs-xs);
15549
15691
  `;
15550
- var segmentedControlVerticalStyles = css102`
15692
+ var segmentedControlVerticalStyles = css103`
15551
15693
  flex-direction: column;
15552
15694
  --segmented-control-first-border-radius: var(--segmented-control-rounded-value)
15553
15695
  var(--segmented-control-rounded-value) 0 0;
15554
15696
  --segmented-control-last-border-radius: 0 0 var(--segmented-control-rounded-value)
15555
15697
  var(--segmented-control-rounded-value);
15556
15698
  `;
15557
- var segmentedControlItemStyles = css102`
15699
+ var segmentedControlItemStyles = css103`
15558
15700
  &:first-of-type label {
15559
15701
  border-radius: var(--segmented-control-first-border-radius);
15560
15702
  }
@@ -15562,10 +15704,10 @@ var segmentedControlItemStyles = css102`
15562
15704
  border-radius: var(--segmented-control-last-border-radius);
15563
15705
  }
15564
15706
  `;
15565
- var segmentedControlInputStyles = css102`
15707
+ var segmentedControlInputStyles = css103`
15566
15708
  ${accessibleHidden}
15567
15709
  `;
15568
- var segmentedControlLabelStyles = (checked, disabled2) => css102`
15710
+ var segmentedControlLabelStyles = (checked, disabled2) => css103`
15569
15711
  position: relative;
15570
15712
  display: flex;
15571
15713
  align-items: center;
@@ -15629,25 +15771,25 @@ var segmentedControlLabelStyles = (checked, disabled2) => css102`
15629
15771
  `}
15630
15772
  }
15631
15773
  `;
15632
- var segmentedControlLabelIconOnlyStyles = css102`
15774
+ var segmentedControlLabelIconOnlyStyles = css103`
15633
15775
  padding-inline: 0.5em;
15634
15776
  `;
15635
- var segmentedControlLabelCheckStyles = css102`
15777
+ var segmentedControlLabelCheckStyles = css103`
15636
15778
  opacity: 0.5;
15637
15779
  `;
15638
- var segmentedControlLabelContentStyles = css102`
15780
+ var segmentedControlLabelContentStyles = css103`
15639
15781
  display: flex;
15640
15782
  align-items: center;
15641
15783
  justify-content: center;
15642
15784
  gap: var(--spacing-sm);
15643
15785
  height: 100%;
15644
15786
  `;
15645
- var segmentedControlLabelTextStyles = css102`
15787
+ var segmentedControlLabelTextStyles = css103`
15646
15788
  white-space: nowrap;
15647
15789
  `;
15648
15790
 
15649
15791
  // src/components/SegmentedControl/SegmentedControl.tsx
15650
- import { jsx as jsx136, jsxs as jsxs92 } from "@emotion/react/jsx-runtime";
15792
+ import { jsx as jsx137, jsxs as jsxs92 } from "@emotion/react/jsx-runtime";
15651
15793
  var SegmentedControl = ({
15652
15794
  name,
15653
15795
  options,
@@ -15675,10 +15817,10 @@ var SegmentedControl = ({
15675
15817
  );
15676
15818
  const sizeStyles = useMemo9(() => {
15677
15819
  const map = {
15678
- sm: css103({ height: "calc(24px - 2px)", fontSize: "var(--fs-xs)" }),
15679
- md: css103({ height: "calc(32px - 2px)", fontSize: "var(--fs-sm)" }),
15680
- lg: css103({ height: "calc(40px - 2px)", fontSize: "var(--fs-base)" }),
15681
- xl: css103({ height: "calc(48px - 2px)", fontSize: "var(--fs-base)" })
15820
+ sm: css104({ height: "calc(24px - 2px)", fontSize: "var(--fs-xs)" }),
15821
+ md: css104({ height: "calc(32px - 2px)", fontSize: "var(--fs-sm)" }),
15822
+ lg: css104({ height: "calc(40px - 2px)", fontSize: "var(--fs-base)" }),
15823
+ xl: css104({ height: "calc(48px - 2px)", fontSize: "var(--fs-base)" })
15682
15824
  };
15683
15825
  return map[size];
15684
15826
  }, [size]);
@@ -15707,7 +15849,7 @@ var SegmentedControl = ({
15707
15849
  };
15708
15850
  }, []);
15709
15851
  return /* @__PURE__ */ jsxs92("div", { css: [segmentedControlRootStyles, { "--background-color": currentBackgroundColor }], children: [
15710
- /* @__PURE__ */ jsx136("div", { ref: wrapperRef, css: segmentedControlWrapperStyles, children: /* @__PURE__ */ jsx136(
15852
+ /* @__PURE__ */ jsx137("div", { ref: wrapperRef, css: segmentedControlWrapperStyles, children: /* @__PURE__ */ jsx137(
15711
15853
  "div",
15712
15854
  {
15713
15855
  css: [
@@ -15724,7 +15866,7 @@ var SegmentedControl = ({
15724
15866
  const text = option.label ? option.label : option.icon ? null : String(option.value);
15725
15867
  const isDisabled = disabled2 || option.disabled;
15726
15868
  const isChecked = option.value === value;
15727
- return /* @__PURE__ */ jsx136(Tooltip, { title: (_a = option.tooltip) != null ? _a : "", children: /* @__PURE__ */ jsx136(
15869
+ return /* @__PURE__ */ jsx137(Tooltip, { title: (_a = option.tooltip) != null ? _a : "", children: /* @__PURE__ */ jsx137(
15728
15870
  "div",
15729
15871
  {
15730
15872
  css: segmentedControlItemStyles,
@@ -15738,7 +15880,7 @@ var SegmentedControl = ({
15738
15880
  isIconOnly ? segmentedControlLabelIconOnlyStyles : void 0
15739
15881
  ],
15740
15882
  children: [
15741
- /* @__PURE__ */ jsx136(
15883
+ /* @__PURE__ */ jsx137(
15742
15884
  "input",
15743
15885
  {
15744
15886
  css: segmentedControlInputStyles,
@@ -15750,10 +15892,10 @@ var SegmentedControl = ({
15750
15892
  disabled: isDisabled
15751
15893
  }
15752
15894
  ),
15753
- option.value !== value || noCheckmark ? null : /* @__PURE__ */ jsx136(CgCheck5, { css: segmentedControlLabelCheckStyles, "aria-label": "Selected", size: "1.5em" }),
15895
+ option.value !== value || noCheckmark ? null : /* @__PURE__ */ jsx137(CgCheck5, { css: segmentedControlLabelCheckStyles, "aria-label": "Selected", size: "1.5em" }),
15754
15896
  /* @__PURE__ */ jsxs92("span", { css: segmentedControlLabelContentStyles, children: [
15755
- !option.icon ? null : /* @__PURE__ */ jsx136(Icon, { icon: option.icon, size: iconSize, iconColor: "currentColor" }),
15756
- !text || hideOptionText ? null : /* @__PURE__ */ jsx136("span", { css: segmentedControlLabelTextStyles, children: text })
15897
+ !option.icon ? null : /* @__PURE__ */ jsx137(Icon, { icon: option.icon, size: iconSize, iconColor: "currentColor" }),
15898
+ !text || hideOptionText ? null : /* @__PURE__ */ jsx137("span", { css: segmentedControlLabelTextStyles, children: text })
15757
15899
  ] })
15758
15900
  ]
15759
15901
  }
@@ -15763,7 +15905,7 @@ var SegmentedControl = ({
15763
15905
  })
15764
15906
  }
15765
15907
  ) }),
15766
- /* @__PURE__ */ jsx136(
15908
+ /* @__PURE__ */ jsx137(
15767
15909
  "div",
15768
15910
  {
15769
15911
  css: [
@@ -15777,18 +15919,18 @@ var SegmentedControl = ({
15777
15919
  };
15778
15920
 
15779
15921
  // src/components/Skeleton/Skeleton.styles.ts
15780
- import { css as css104, keyframes as keyframes5 } from "@emotion/react";
15922
+ import { css as css105, keyframes as keyframes5 } from "@emotion/react";
15781
15923
  var lightFadingOut = keyframes5`
15782
15924
  from { opacity: 0.1; }
15783
15925
  to { opacity: 0.025; }
15784
15926
  `;
15785
- var skeletonStyles = css104`
15927
+ var skeletonStyles = css105`
15786
15928
  animation: ${lightFadingOut} 1s ease-out infinite alternate;
15787
15929
  background-color: var(--gray-900);
15788
15930
  `;
15789
15931
 
15790
15932
  // src/components/Skeleton/Skeleton.tsx
15791
- import { jsx as jsx137 } from "@emotion/react/jsx-runtime";
15933
+ import { jsx as jsx138 } from "@emotion/react/jsx-runtime";
15792
15934
  var Skeleton = ({
15793
15935
  width = "100%",
15794
15936
  height = "1.25rem",
@@ -15796,7 +15938,7 @@ var Skeleton = ({
15796
15938
  circle = false,
15797
15939
  children,
15798
15940
  ...otherProps
15799
- }) => /* @__PURE__ */ jsx137(
15941
+ }) => /* @__PURE__ */ jsx138(
15800
15942
  "div",
15801
15943
  {
15802
15944
  css: [
@@ -15819,8 +15961,8 @@ var Skeleton = ({
15819
15961
  import { useEffect as useEffect25, useRef as useRef13 } from "react";
15820
15962
 
15821
15963
  // src/components/Spinner/Spinner.styles.ts
15822
- import { css as css105 } from "@emotion/react";
15823
- var SpinnerStyles = css105`
15964
+ import { css as css106 } from "@emotion/react";
15965
+ var SpinnerStyles = css106`
15824
15966
  --color: #00b4ff;
15825
15967
  --speed: 5s;
15826
15968
  --red: rgb(218, 63, 50);
@@ -16250,7 +16392,7 @@ var SpinnerStyles = css105`
16250
16392
  `;
16251
16393
 
16252
16394
  // src/components/Spinner/Spinner.tsx
16253
- import { jsx as jsx138, jsxs as jsxs93 } from "@emotion/react/jsx-runtime";
16395
+ import { jsx as jsx139, jsxs as jsxs93 } from "@emotion/react/jsx-runtime";
16254
16396
  var Spinner = ({
16255
16397
  width,
16256
16398
  label,
@@ -16273,51 +16415,51 @@ var Spinner = ({
16273
16415
  css: SpinnerStyles,
16274
16416
  className: `container${isPaused ? " paused" : ""}`,
16275
16417
  children: [
16276
- /* @__PURE__ */ jsx138("div", { className: "pyramid-container", children: /* @__PURE__ */ jsxs93("div", { className: "pyramid top", children: [
16277
- /* @__PURE__ */ jsx138("div", { className: "side one" }),
16278
- /* @__PURE__ */ jsx138("div", { className: "side two" }),
16279
- /* @__PURE__ */ jsx138("div", { className: "side three" }),
16280
- /* @__PURE__ */ jsx138("div", { className: "side four" }),
16418
+ /* @__PURE__ */ jsx139("div", { className: "pyramid-container", children: /* @__PURE__ */ jsxs93("div", { className: "pyramid top", children: [
16419
+ /* @__PURE__ */ jsx139("div", { className: "side one" }),
16420
+ /* @__PURE__ */ jsx139("div", { className: "side two" }),
16421
+ /* @__PURE__ */ jsx139("div", { className: "side three" }),
16422
+ /* @__PURE__ */ jsx139("div", { className: "side four" }),
16281
16423
  /* @__PURE__ */ jsxs93("div", { className: "bottom-pyramid", children: [
16282
- /* @__PURE__ */ jsx138("div", { className: "side five" }),
16283
- /* @__PURE__ */ jsx138("div", { className: "side six" }),
16284
- /* @__PURE__ */ jsx138("div", { className: "side seven" }),
16285
- /* @__PURE__ */ jsx138("div", { className: "side eight" })
16424
+ /* @__PURE__ */ jsx139("div", { className: "side five" }),
16425
+ /* @__PURE__ */ jsx139("div", { className: "side six" }),
16426
+ /* @__PURE__ */ jsx139("div", { className: "side seven" }),
16427
+ /* @__PURE__ */ jsx139("div", { className: "side eight" })
16286
16428
  ] })
16287
16429
  ] }) }),
16288
- /* @__PURE__ */ jsx138("div", { className: "turning-circle" }),
16430
+ /* @__PURE__ */ jsx139("div", { className: "turning-circle" }),
16289
16431
  /* @__PURE__ */ jsxs93("div", { className: "pulsating-star delay-top-right", children: [
16290
- /* @__PURE__ */ jsx138("div", { className: "star-inner star-center" }),
16291
- /* @__PURE__ */ jsx138("div", { className: "star-inner star-top" }),
16292
- /* @__PURE__ */ jsx138("div", { className: "star-inner star-bottom" }),
16293
- /* @__PURE__ */ jsx138("div", { className: "star-inner star-left" }),
16294
- /* @__PURE__ */ jsx138("div", { className: "star-inner star-right" })
16432
+ /* @__PURE__ */ jsx139("div", { className: "star-inner star-center" }),
16433
+ /* @__PURE__ */ jsx139("div", { className: "star-inner star-top" }),
16434
+ /* @__PURE__ */ jsx139("div", { className: "star-inner star-bottom" }),
16435
+ /* @__PURE__ */ jsx139("div", { className: "star-inner star-left" }),
16436
+ /* @__PURE__ */ jsx139("div", { className: "star-inner star-right" })
16295
16437
  ] }),
16296
16438
  /* @__PURE__ */ jsxs93("div", { className: "pulsating-star delay-top-left-2", children: [
16297
- /* @__PURE__ */ jsx138("div", { className: "star-inner star-center" }),
16298
- /* @__PURE__ */ jsx138("div", { className: "star-inner star-top" }),
16299
- /* @__PURE__ */ jsx138("div", { className: "star-inner star-bottom" }),
16300
- /* @__PURE__ */ jsx138("div", { className: "star-inner star-left" }),
16301
- /* @__PURE__ */ jsx138("div", { className: "star-inner star-right" })
16439
+ /* @__PURE__ */ jsx139("div", { className: "star-inner star-center" }),
16440
+ /* @__PURE__ */ jsx139("div", { className: "star-inner star-top" }),
16441
+ /* @__PURE__ */ jsx139("div", { className: "star-inner star-bottom" }),
16442
+ /* @__PURE__ */ jsx139("div", { className: "star-inner star-left" }),
16443
+ /* @__PURE__ */ jsx139("div", { className: "star-inner star-right" })
16302
16444
  ] }),
16303
16445
  /* @__PURE__ */ jsxs93("div", { className: "pulsating-star delay-top-left", children: [
16304
- /* @__PURE__ */ jsx138("div", { className: "star-inner star-top" }),
16305
- /* @__PURE__ */ jsx138("div", { className: "star-inner star-bottom" }),
16306
- /* @__PURE__ */ jsx138("div", { className: "star-inner star-left" }),
16307
- /* @__PURE__ */ jsx138("div", { className: "star-inner star-right" })
16446
+ /* @__PURE__ */ jsx139("div", { className: "star-inner star-top" }),
16447
+ /* @__PURE__ */ jsx139("div", { className: "star-inner star-bottom" }),
16448
+ /* @__PURE__ */ jsx139("div", { className: "star-inner star-left" }),
16449
+ /* @__PURE__ */ jsx139("div", { className: "star-inner star-right" })
16308
16450
  ] }),
16309
16451
  /* @__PURE__ */ jsxs93("div", { className: "pulsating-star delay-bottom-right", children: [
16310
- /* @__PURE__ */ jsx138("div", { className: "star-inner star-top" }),
16311
- /* @__PURE__ */ jsx138("div", { className: "star-inner star-bottom" }),
16312
- /* @__PURE__ */ jsx138("div", { className: "star-inner star-left" }),
16313
- /* @__PURE__ */ jsx138("div", { className: "star-inner star-right" })
16452
+ /* @__PURE__ */ jsx139("div", { className: "star-inner star-top" }),
16453
+ /* @__PURE__ */ jsx139("div", { className: "star-inner star-bottom" }),
16454
+ /* @__PURE__ */ jsx139("div", { className: "star-inner star-left" }),
16455
+ /* @__PURE__ */ jsx139("div", { className: "star-inner star-right" })
16314
16456
  ] }),
16315
16457
  /* @__PURE__ */ jsxs93("div", { className: "pulsating-star delay-bottom-left", children: [
16316
- /* @__PURE__ */ jsx138("div", { className: "star-inner star-center" }),
16317
- /* @__PURE__ */ jsx138("div", { className: "star-inner star-top" }),
16318
- /* @__PURE__ */ jsx138("div", { className: "star-inner star-bottom" }),
16319
- /* @__PURE__ */ jsx138("div", { className: "star-inner star-left" }),
16320
- /* @__PURE__ */ jsx138("div", { className: "star-inner star-right" })
16458
+ /* @__PURE__ */ jsx139("div", { className: "star-inner star-center" }),
16459
+ /* @__PURE__ */ jsx139("div", { className: "star-inner star-top" }),
16460
+ /* @__PURE__ */ jsx139("div", { className: "star-inner star-bottom" }),
16461
+ /* @__PURE__ */ jsx139("div", { className: "star-inner star-left" }),
16462
+ /* @__PURE__ */ jsx139("div", { className: "star-inner star-right" })
16321
16463
  ] })
16322
16464
  ]
16323
16465
  }
@@ -16328,8 +16470,8 @@ var Spinner = ({
16328
16470
  import { forwardRef as forwardRef29, useMemo as useMemo10 } from "react";
16329
16471
 
16330
16472
  // src/components/Switch/Switch.styles.ts
16331
- import { css as css106 } from "@emotion/react";
16332
- var SwitchInputContainer = css106`
16473
+ import { css as css107 } from "@emotion/react";
16474
+ var SwitchInputContainer = css107`
16333
16475
  cursor: pointer;
16334
16476
  display: inline-flex;
16335
16477
  position: relative;
@@ -16339,7 +16481,7 @@ var SwitchInputContainer = css106`
16339
16481
  user-select: none;
16340
16482
  z-index: 0;
16341
16483
  `;
16342
- var SwitchInput = (size) => css106`
16484
+ var SwitchInput = (size) => css107`
16343
16485
  appearance: none;
16344
16486
  border-radius: var(--rounded-full);
16345
16487
  background-color: var(--white);
@@ -16378,18 +16520,18 @@ var SwitchInput = (size) => css106`
16378
16520
  cursor: not-allowed;
16379
16521
  }
16380
16522
  `;
16381
- var SwitchInputCheckedDirectionLeft = css106`
16523
+ var SwitchInputCheckedDirectionLeft = css107`
16382
16524
  &:checked {
16383
16525
  transform: translateX(var(--spacing-base));
16384
16526
  }
16385
16527
  `;
16386
- var SwitchInputCheckedDirectionRight = css106`
16528
+ var SwitchInputCheckedDirectionRight = css107`
16387
16529
  transform: translateX(-var(--spacing-base));
16388
16530
  &:checked {
16389
16531
  transform: translateX(0);
16390
16532
  }
16391
16533
  `;
16392
- var SwitchInputDisabled = css106`
16534
+ var SwitchInputDisabled = css107`
16393
16535
  opacity: var(--opacity-50);
16394
16536
  cursor: not-allowed;
16395
16537
 
@@ -16397,19 +16539,19 @@ var SwitchInputDisabled = css106`
16397
16539
  cursor: not-allowed;
16398
16540
  }
16399
16541
  `;
16400
- var SwitchInputLabelAlignmentLeft = (size) => css106`
16542
+ var SwitchInputLabelAlignmentLeft = (size) => css107`
16401
16543
  padding-inline-start: ${size === "sm" ? "var(--spacing-xl)" : "var(--spacing-2xl)"};
16402
16544
  &:before {
16403
16545
  left: 0;
16404
16546
  }
16405
16547
  `;
16406
- var SwitchInputLabelAlignmentRight = (size) => css106`
16548
+ var SwitchInputLabelAlignmentRight = (size) => css107`
16407
16549
  padding-inline-end: ${size === "sm" ? "var(--spacing-xl)" : "var(--spacing-2xl)"};
16408
16550
  &:before {
16409
16551
  right: 0;
16410
16552
  }
16411
16553
  `;
16412
- var SwitchInputLabel = (size) => css106`
16554
+ var SwitchInputLabel = (size) => css107`
16413
16555
  align-items: center;
16414
16556
  color: var(--typography-base);
16415
16557
  display: inline-flex;
@@ -16429,25 +16571,25 @@ var SwitchInputLabel = (size) => css106`
16429
16571
  top: 0;
16430
16572
  }
16431
16573
  `;
16432
- var SwitchTextAlignmentLeft = (size) => css106`
16574
+ var SwitchTextAlignmentLeft = (size) => css107`
16433
16575
  padding-inline-start: ${size === "sm" ? "var(--spacing-xl)" : "var(--spacing-2xl)"};
16434
16576
  `;
16435
- var SwitchTextAlignmentRight = (size) => css106`
16577
+ var SwitchTextAlignmentRight = (size) => css107`
16436
16578
  padding-inline-end: ${size === "sm" ? "var(--spacing-xl)" : "var(--spacing-2xl)"};
16437
16579
  `;
16438
- var SwitchText = css106`
16580
+ var SwitchText = css107`
16439
16581
  color: var(--gray-500);
16440
16582
  font-size: var(--fs-sm);
16441
16583
  `;
16442
- var SwitchInputContainerAlignmentLeft = css106`
16584
+ var SwitchInputContainerAlignmentLeft = css107`
16443
16585
  flex-direction: row;
16444
16586
  `;
16445
- var SwitchInputContainerAlignmentRight = css106`
16587
+ var SwitchInputContainerAlignmentRight = css107`
16446
16588
  flex-direction: row-reverse;
16447
16589
  `;
16448
16590
 
16449
16591
  // src/components/Switch/Switch.tsx
16450
- import { Fragment as Fragment19, jsx as jsx139, jsxs as jsxs94 } from "@emotion/react/jsx-runtime";
16592
+ import { Fragment as Fragment19, jsx as jsx140, jsxs as jsxs94 } from "@emotion/react/jsx-runtime";
16451
16593
  var Switch = forwardRef29(
16452
16594
  ({
16453
16595
  label,
@@ -16487,7 +16629,7 @@ var Switch = forwardRef29(
16487
16629
  inputProps.disabled ? SwitchInputDisabled : void 0
16488
16630
  ],
16489
16631
  children: [
16490
- /* @__PURE__ */ jsx139(
16632
+ /* @__PURE__ */ jsx140(
16491
16633
  "input",
16492
16634
  {
16493
16635
  type: "checkbox",
@@ -16496,11 +16638,11 @@ var Switch = forwardRef29(
16496
16638
  ref
16497
16639
  }
16498
16640
  ),
16499
- /* @__PURE__ */ jsx139("span", { css: [SwitchInputLabel(switchSize), SwitchInputLabelAlignment], children: label })
16641
+ /* @__PURE__ */ jsx140("span", { css: [SwitchInputLabel(switchSize), SwitchInputLabelAlignment], children: label })
16500
16642
  ]
16501
16643
  }
16502
16644
  ),
16503
- additionalText ? /* @__PURE__ */ jsx139(
16645
+ additionalText ? /* @__PURE__ */ jsx140(
16504
16646
  "p",
16505
16647
  {
16506
16648
  css: [
@@ -16516,8 +16658,8 @@ var Switch = forwardRef29(
16516
16658
  );
16517
16659
 
16518
16660
  // src/components/Table/Table.styles.ts
16519
- import { css as css107 } from "@emotion/react";
16520
- var table = ({ cellPadding = "var(--spacing-sm)" }) => css107`
16661
+ import { css as css108 } from "@emotion/react";
16662
+ var table = ({ cellPadding = "var(--spacing-sm)" }) => css108`
16521
16663
  border-bottom: 1px solid var(--gray-400);
16522
16664
  border-collapse: collapse;
16523
16665
  min-width: 100%;
@@ -16537,21 +16679,21 @@ var table = ({ cellPadding = "var(--spacing-sm)" }) => css107`
16537
16679
  background-color: var(--gray-50);
16538
16680
  }
16539
16681
  `;
16540
- var tableHead = css107`
16682
+ var tableHead = css108`
16541
16683
  color: var(--typography-base);
16542
16684
  text-align: left;
16543
16685
  `;
16544
- var tableRow = css107`
16686
+ var tableRow = css108`
16545
16687
  border-bottom: 1px solid var(--gray-200);
16546
16688
  font-size: var(--fs-sm);
16547
16689
  `;
16548
- var tableCellHead = css107`
16690
+ var tableCellHead = css108`
16549
16691
  font-size: var(--fs-sm);
16550
16692
  font-weight: var(--fw-regular);
16551
16693
  line-height: 1.2;
16552
16694
  }
16553
16695
  `;
16554
- var responsiveTableContainer = css107`
16696
+ var responsiveTableContainer = css108`
16555
16697
  max-width: calc(100vw - var(--spacing-md) * 2);
16556
16698
  overflow-x: auto;
16557
16699
  ${scrollbarStyles}
@@ -16570,47 +16712,47 @@ var responsiveTableContainer = css107`
16570
16712
  `;
16571
16713
 
16572
16714
  // src/components/Table/ResponsiveTableContainer.tsx
16573
- import { jsx as jsx140 } from "@emotion/react/jsx-runtime";
16715
+ import { jsx as jsx141 } from "@emotion/react/jsx-runtime";
16574
16716
  var ResponsiveTableContainer = ({ children }) => {
16575
- return /* @__PURE__ */ jsx140("div", { css: responsiveTableContainer, children });
16717
+ return /* @__PURE__ */ jsx141("div", { css: responsiveTableContainer, children });
16576
16718
  };
16577
16719
 
16578
16720
  // src/components/Table/Table.tsx
16579
- import * as React21 from "react";
16580
- import { jsx as jsx141 } from "@emotion/react/jsx-runtime";
16581
- var Table = React21.forwardRef(
16721
+ import * as React22 from "react";
16722
+ import { jsx as jsx142 } from "@emotion/react/jsx-runtime";
16723
+ var Table = React22.forwardRef(
16582
16724
  ({ children, cellPadding, ...otherProps }, ref) => {
16583
- return /* @__PURE__ */ jsx141("table", { ref, css: table({ cellPadding }), ...otherProps, children });
16725
+ return /* @__PURE__ */ jsx142("table", { ref, css: table({ cellPadding }), ...otherProps, children });
16584
16726
  }
16585
16727
  );
16586
- var TableHead = React21.forwardRef(
16728
+ var TableHead = React22.forwardRef(
16587
16729
  ({ children, ...otherProps }, ref) => {
16588
- return /* @__PURE__ */ jsx141("thead", { ref, css: tableHead, ...otherProps, children });
16730
+ return /* @__PURE__ */ jsx142("thead", { ref, css: tableHead, ...otherProps, children });
16589
16731
  }
16590
16732
  );
16591
- var TableBody = React21.forwardRef(
16733
+ var TableBody = React22.forwardRef(
16592
16734
  ({ children, ...otherProps }, ref) => {
16593
- return /* @__PURE__ */ jsx141("tbody", { ref, ...otherProps, children });
16735
+ return /* @__PURE__ */ jsx142("tbody", { ref, ...otherProps, children });
16594
16736
  }
16595
16737
  );
16596
- var TableFoot = React21.forwardRef(
16738
+ var TableFoot = React22.forwardRef(
16597
16739
  ({ children, ...otherProps }, ref) => {
16598
- return /* @__PURE__ */ jsx141("tfoot", { ref, ...otherProps, children });
16740
+ return /* @__PURE__ */ jsx142("tfoot", { ref, ...otherProps, children });
16599
16741
  }
16600
16742
  );
16601
- var TableRow = React21.forwardRef(
16743
+ var TableRow = React22.forwardRef(
16602
16744
  ({ children, ...otherProps }, ref) => {
16603
- return /* @__PURE__ */ jsx141("tr", { ref, css: tableRow, ...otherProps, children });
16745
+ return /* @__PURE__ */ jsx142("tr", { ref, css: tableRow, ...otherProps, children });
16604
16746
  }
16605
16747
  );
16606
- var TableCellHead = React21.forwardRef(
16748
+ var TableCellHead = React22.forwardRef(
16607
16749
  ({ children, ...otherProps }, ref) => {
16608
- return /* @__PURE__ */ jsx141("th", { ref, css: tableCellHead, ...otherProps, children });
16750
+ return /* @__PURE__ */ jsx142("th", { ref, css: tableCellHead, ...otherProps, children });
16609
16751
  }
16610
16752
  );
16611
- var TableCellData = React21.forwardRef(
16753
+ var TableCellData = React22.forwardRef(
16612
16754
  ({ children, ...otherProps }, ref) => {
16613
- return /* @__PURE__ */ jsx141("td", { ref, ...otherProps, children });
16755
+ return /* @__PURE__ */ jsx142("td", { ref, ...otherProps, children });
16614
16756
  }
16615
16757
  );
16616
16758
 
@@ -16625,8 +16767,8 @@ import {
16625
16767
  import { useCallback as useCallback13, useMemo as useMemo11 } from "react";
16626
16768
 
16627
16769
  // src/components/Tabs/Tabs.styles.ts
16628
- import { css as css108 } from "@emotion/react";
16629
- var tabButtonStyles = css108`
16770
+ import { css as css109 } from "@emotion/react";
16771
+ var tabButtonStyles = css109`
16630
16772
  align-items: center;
16631
16773
  border: 0;
16632
16774
  height: 2.5rem;
@@ -16643,14 +16785,14 @@ var tabButtonStyles = css108`
16643
16785
  box-shadow: inset 0 -2px 0 var(--brand-secondary-3);
16644
16786
  }
16645
16787
  `;
16646
- var tabButtonGroupStyles = css108`
16788
+ var tabButtonGroupStyles = css109`
16647
16789
  display: flex;
16648
16790
  gap: var(--spacing-base);
16649
16791
  border-bottom: 1px solid var(--gray-300);
16650
16792
  `;
16651
16793
 
16652
16794
  // src/components/Tabs/Tabs.tsx
16653
- import { jsx as jsx142 } from "@emotion/react/jsx-runtime";
16795
+ import { jsx as jsx143 } from "@emotion/react/jsx-runtime";
16654
16796
  var useCurrentTab = () => {
16655
16797
  const context = useAriakitTabStore();
16656
16798
  if (!context) {
@@ -16681,28 +16823,28 @@ var Tabs = ({
16681
16823
  },
16682
16824
  [onSelectedIdChange, useHashForState]
16683
16825
  );
16684
- return /* @__PURE__ */ jsx142(AriakitTabProvider, { selectedId: selected, selectOnMove: !manual, setSelectedId: onTabSelect, ...props, children });
16826
+ return /* @__PURE__ */ jsx143(AriakitTabProvider, { selectedId: selected, selectOnMove: !manual, setSelectedId: onTabSelect, ...props, children });
16685
16827
  };
16686
16828
  var TabButtonGroup = ({ children, ...props }) => {
16687
- return /* @__PURE__ */ jsx142(AriakitTabList, { ...props, css: tabButtonGroupStyles, children });
16829
+ return /* @__PURE__ */ jsx143(AriakitTabList, { ...props, css: tabButtonGroupStyles, children });
16688
16830
  };
16689
16831
  var TabButton = ({
16690
16832
  children,
16691
16833
  id,
16692
16834
  ...props
16693
16835
  }) => {
16694
- return /* @__PURE__ */ jsx142(AriakitTab, { type: "button", id, ...props, css: tabButtonStyles, children });
16836
+ return /* @__PURE__ */ jsx143(AriakitTab, { type: "button", id, ...props, css: tabButtonStyles, children });
16695
16837
  };
16696
16838
  var TabContent = ({
16697
16839
  children,
16698
16840
  ...props
16699
16841
  }) => {
16700
- return /* @__PURE__ */ jsx142(AriakitTabPanel, { ...props, children });
16842
+ return /* @__PURE__ */ jsx143(AriakitTabPanel, { ...props, children });
16701
16843
  };
16702
16844
 
16703
16845
  // src/components/Validation/StatusBullet.styles.ts
16704
- import { css as css109 } from "@emotion/react";
16705
- var StatusBulletContainer = css109`
16846
+ import { css as css110 } from "@emotion/react";
16847
+ var StatusBulletContainer = css110`
16706
16848
  align-items: center;
16707
16849
  align-self: center;
16708
16850
  color: var(--gray-500);
@@ -16718,33 +16860,33 @@ var StatusBulletContainer = css109`
16718
16860
  display: block;
16719
16861
  }
16720
16862
  `;
16721
- var StatusBulletBase = css109`
16863
+ var StatusBulletBase = css110`
16722
16864
  font-size: var(--fs-sm);
16723
16865
  &:before {
16724
16866
  width: var(--fs-xs);
16725
16867
  height: var(--fs-xs);
16726
16868
  }
16727
16869
  `;
16728
- var StatusBulletSmall = css109`
16870
+ var StatusBulletSmall = css110`
16729
16871
  font-size: var(--fs-xs);
16730
16872
  &:before {
16731
16873
  width: var(--fs-xxs);
16732
16874
  height: var(--fs-xxs);
16733
16875
  }
16734
16876
  `;
16735
- var StatusDraft = css109`
16877
+ var StatusDraft = css110`
16736
16878
  &:before {
16737
16879
  background: var(--white);
16738
16880
  box-shadow: inset 0 0 0 0.125rem var(--accent-dark);
16739
16881
  }
16740
16882
  `;
16741
- var StatusModified = css109`
16883
+ var StatusModified = css110`
16742
16884
  &:before {
16743
16885
  background: linear-gradient(to right, var(--white) 50%, var(--accent-dark) 50% 100%);
16744
16886
  box-shadow: inset 0 0 0 0.125rem var(--accent-dark);
16745
16887
  }
16746
16888
  `;
16747
- var StatusError = css109`
16889
+ var StatusError = css110`
16748
16890
  color: var(--error);
16749
16891
  &:before {
16750
16892
  /* TODO: replace this with an svg icon */
@@ -16757,29 +16899,44 @@ var StatusError = css109`
16757
16899
  );
16758
16900
  }
16759
16901
  `;
16760
- var StatusPublished = css109`
16902
+ var StatusPublished = css110`
16761
16903
  &:before {
16762
16904
  background: var(--accent-dark);
16763
16905
  }
16764
16906
  `;
16765
- var StatusOrphan = css109`
16907
+ var StatusOrphan = css110`
16766
16908
  &:before {
16767
16909
  background: var(--brand-secondary-5);
16768
16910
  }
16769
16911
  `;
16770
- var StatusUnknown = css109`
16912
+ var StatusUnknown = css110`
16771
16913
  &:before {
16772
16914
  background: var(--gray-800);
16773
16915
  }
16774
16916
  `;
16775
- var StatusDeleted = css109`
16917
+ var StatusDeleted = css110`
16776
16918
  &:before {
16777
16919
  background: var(--error);
16778
16920
  }
16779
16921
  `;
16780
16922
 
16781
16923
  // src/components/Validation/StatusBullet.tsx
16782
- import { jsx as jsx143 } from "@emotion/react/jsx-runtime";
16924
+ import { jsx as jsx144 } from "@emotion/react/jsx-runtime";
16925
+ var currentStateStyles = {
16926
+ Error: StatusError,
16927
+ Modified: StatusModified,
16928
+ Unsaved: StatusDraft,
16929
+ Orphan: StatusOrphan,
16930
+ Published: StatusPublished,
16931
+ Draft: StatusDraft,
16932
+ Previous: StatusDraft,
16933
+ Unknown: StatusUnknown,
16934
+ Deleted: StatusDeleted
16935
+ };
16936
+ var statusSize = {
16937
+ sm: StatusBulletSmall,
16938
+ base: StatusBulletBase
16939
+ };
16783
16940
  var StatusBullet = ({
16784
16941
  status,
16785
16942
  hideText = false,
@@ -16788,31 +16945,19 @@ var StatusBullet = ({
16788
16945
  compact = false,
16789
16946
  ...props
16790
16947
  }) => {
16791
- const currentStateStyles = {
16792
- Error: StatusError,
16793
- Modified: StatusModified,
16794
- Unsaved: StatusDraft,
16795
- Orphan: StatusOrphan,
16796
- Published: StatusPublished,
16797
- Draft: StatusDraft,
16798
- Previous: StatusDraft,
16799
- Unknown: StatusUnknown,
16800
- Deleted: StatusDeleted
16801
- };
16802
- const statusSize = size === "base" ? StatusBulletBase : StatusBulletSmall;
16803
- const StatusComponent = () => /* @__PURE__ */ jsx143(
16948
+ const StatusComponent = () => /* @__PURE__ */ jsx144(
16804
16949
  "span",
16805
16950
  {
16806
16951
  role: "status",
16807
- css: [StatusBulletContainer, currentStateStyles[status], statusSize],
16952
+ css: [StatusBulletContainer, currentStateStyles[status], statusSize[size]],
16808
16953
  ...props,
16809
16954
  children: hideText ? null : message ? message : status
16810
16955
  }
16811
16956
  );
16812
16957
  if (compact) {
16813
- return /* @__PURE__ */ jsx143(StatusComponent, {});
16958
+ return /* @__PURE__ */ jsx144(StatusComponent, {});
16814
16959
  }
16815
- return /* @__PURE__ */ jsx143(Tooltip, { title: message != null ? message : status, children: /* @__PURE__ */ jsx143("div", { children: /* @__PURE__ */ jsx143(StatusComponent, {}) }) });
16960
+ return /* @__PURE__ */ jsx144(Tooltip, { title: message != null ? message : status, children: /* @__PURE__ */ jsx144("div", { children: /* @__PURE__ */ jsx144(StatusComponent, {}) }) });
16816
16961
  };
16817
16962
  export {
16818
16963
  AddButton,
@@ -16921,6 +17066,7 @@ export {
16921
17066
  PageHeaderSection,
16922
17067
  Pagination,
16923
17068
  Paragraph,
17069
+ ParameterActionButton,
16924
17070
  ParameterDrawerHeader,
16925
17071
  ParameterGroup,
16926
17072
  ParameterImage,
@@ -16992,6 +17138,7 @@ export {
16992
17138
  VerticalRhythm,
16993
17139
  WarningMessage,
16994
17140
  accessibleHidden,
17141
+ actionBarVisibilityStyles,
16995
17142
  addPathSegmentToPathname,
16996
17143
  borderTopIcon,
16997
17144
  breakpoints,