@uniformdev/design-system 19.176.1-alpha.9 → 19.177.1

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/dist/index.js CHANGED
@@ -1444,11 +1444,12 @@ __export(src_exports, {
1444
1444
  ObjectGridItemCoverButton: () => ObjectGridItemCoverButton,
1445
1445
  ObjectGridItemHeading: () => ObjectGridItemHeading2,
1446
1446
  ObjectGridItemIconWithTooltip: () => ObjectGridItemIconWithTooltip,
1447
+ ObjectGridItemLoadingSkeleton: () => ObjectGridItemLoadingSkeleton2,
1447
1448
  ObjectItemLoadingSkeleton: () => ObjectItemLoadingSkeleton,
1448
1449
  ObjectListItem: () => ObjectListItem2,
1449
1450
  ObjectListItemContainer: () => ObjectListItemContainer2,
1450
1451
  ObjectListItemCover: () => ObjectListItemCover2,
1451
- ObjectListItemHeading: () => ObjectListItemHeading,
1452
+ ObjectListItemHeading: () => ObjectListItemHeading2,
1452
1453
  PageHeaderSection: () => PageHeaderSection,
1453
1454
  Pagination: () => Pagination,
1454
1455
  Paragraph: () => Paragraph,
@@ -17662,7 +17663,6 @@ var DragHandleStyles = import_react79.css`
17662
17663
  background: transparent;
17663
17664
  border: 0;
17664
17665
  position: relative;
17665
- height: 3.125rem;
17666
17666
  width: 1rem;
17667
17667
  cursor: grab;
17668
17668
 
@@ -17688,13 +17688,13 @@ var DragHandleDisabled = import_react79.css`
17688
17688
  // src/components/DragHandle/DragHandle.tsx
17689
17689
  var import_jsx_runtime69 = require("@emotion/react/jsx-runtime");
17690
17690
  var DragHandle = (0, import_react80.forwardRef)(
17691
- ({ disableDnd, ...props }, ref) => {
17691
+ ({ disableDnd, height = "3.125rem", ...props }, ref) => {
17692
17692
  return /* @__PURE__ */ (0, import_jsx_runtime69.jsx)(
17693
17693
  "button",
17694
17694
  {
17695
17695
  type: "button",
17696
17696
  ref,
17697
- css: [DragHandleStyles, disableDnd ? DragHandleDisabled : null],
17697
+ css: [DragHandleStyles, disableDnd ? DragHandleDisabled : null, { height }],
17698
17698
  disabled: disableDnd,
17699
17699
  ...props
17700
17700
  }
@@ -20752,36 +20752,122 @@ var ObjectGridItemIconWithTooltip = ({
20752
20752
  return /* @__PURE__ */ (0, import_jsx_runtime107.jsx)(Tooltip, { title: tooltipTitle, placement, children: /* @__PURE__ */ (0, import_jsx_runtime107.jsx)("span", { children: /* @__PURE__ */ (0, import_jsx_runtime107.jsx)(Icon, { icon, iconColor, size: "1rem" }) }) });
20753
20753
  };
20754
20754
 
20755
- // src/components/Objects/ObjectItemLoadingSkeleton.tsx
20755
+ // src/components/Objects/ObjectGridItemLoadingSkeleton.tsx
20756
20756
  init_emotion_jsx_shim();
20757
20757
 
20758
- // src/components/Objects/styles/ObjectListItem.styles.ts
20758
+ // src/components/Objects/styles/ObjectGridItemLoadingSkeleton.styles.ts
20759
20759
  init_emotion_jsx_shim();
20760
20760
  var import_react126 = require("@emotion/react");
20761
- var ObjectListItem = import_react126.css`
20762
- background: var(--white);
20761
+ var ObjectGridItemLoadingSkeleton = import_react126.css`
20762
+ border-radius: var(--rounded-base);
20763
20763
  display: flex;
20764
+ flex-direction: column;
20764
20765
  gap: var(--spacing-sm);
20766
+ transition: border-color var(--duration-fast) var(--timing-ease-out);
20767
+ `;
20768
+ var ObjectGridItemLoadingText = (textLength) => import_react126.css`
20769
+ animation: ${fadeIn} 1s linear infinite alternate;
20770
+ border-radius: var(--rounded-base);
20771
+ background: var(--gray-300);
20772
+ display: block;
20773
+ width: clamp(24px, 100%, ${textLength});
20774
+ height: var(--fs-base);
20775
+ `;
20776
+ var ObjectGridItemLoadingImageWrapper = import_react126.css`
20777
+ aspect-ratio: 16/9;
20778
+ max-width: 100%;
20779
+ max-height: 100%;
20780
+ height: auto;
20781
+ padding: var(--spacing-sm);
20782
+ overflow: hidden;
20783
+ `;
20784
+ var ObjectGridItemLoadingImage = import_react126.css`
20785
+ animation: ${fadeIn} 1s linear infinite alternate;
20786
+ border-radius: var(--rounded-base);
20787
+ background: var(--gray-300);
20788
+ display: block;
20789
+ width: 100%;
20790
+ height: auto;
20791
+ aspect-ratio: 1;
20792
+ `;
20793
+ var ObjectGridItemLoadingContentWrapper = import_react126.css`
20794
+ padding: 0 var(--spacing-sm) var(--spacing-sm);
20795
+ min-height: 52px;
20796
+ `;
20797
+ var ObjectGridItemLoadingContentContainer = import_react126.css`
20765
20798
  flex-grow: 1;
20799
+ gap: var(--spacing-xs);
20800
+ `;
20801
+
20802
+ // src/components/Objects/ObjectGridItemLoadingSkeleton.tsx
20803
+ var import_jsx_runtime108 = require("@emotion/react/jsx-runtime");
20804
+ var ObjectGridItemLoadingSkeleton2 = () => {
20805
+ return /* @__PURE__ */ (0, import_jsx_runtime108.jsxs)("div", { css: ObjectGridItemLoadingSkeleton, children: [
20806
+ /* @__PURE__ */ (0, import_jsx_runtime108.jsx)("div", { css: ObjectGridItemLoadingImageWrapper, "data-testid": "object-grid-item-cover-skeleton", children: /* @__PURE__ */ (0, import_jsx_runtime108.jsx)("span", { css: ObjectGridItemLoadingImage, role: "presentation" }) }),
20807
+ /* @__PURE__ */ (0, import_jsx_runtime108.jsxs)(
20808
+ HorizontalRhythm,
20809
+ {
20810
+ css: ObjectGridItemLoadingContentWrapper,
20811
+ align: "flex-start",
20812
+ justify: "space-between",
20813
+ gap: "sm",
20814
+ children: [
20815
+ /* @__PURE__ */ (0, import_jsx_runtime108.jsxs)(VerticalRhythm, { css: ObjectGridItemLoadingContentContainer, gap: "0", children: [
20816
+ /* @__PURE__ */ (0, import_jsx_runtime108.jsx)(HorizontalRhythm, { gap: "xs", align: "center", children: /* @__PURE__ */ (0, import_jsx_runtime108.jsx)("span", { role: "presentation", css: ObjectGridItemLoadingText("18ch") }) }),
20817
+ /* @__PURE__ */ (0, import_jsx_runtime108.jsx)("span", { role: "presentation", css: ObjectGridItemLoadingText("12ch") })
20818
+ ] }),
20819
+ /* @__PURE__ */ (0, import_jsx_runtime108.jsxs)(HorizontalRhythm, { css: ObjectGridItemLoadingContentContainer, gap: "xs", justify: "flex-end", children: [
20820
+ /* @__PURE__ */ (0, import_jsx_runtime108.jsx)("span", { role: "presentation", css: ObjectGridItemLoadingText("6ch") }),
20821
+ /* @__PURE__ */ (0, import_jsx_runtime108.jsx)("span", { role: "presentation", css: ObjectGridItemLoadingText("24px") })
20822
+ ] })
20823
+ ]
20824
+ }
20825
+ )
20826
+ ] });
20827
+ };
20828
+
20829
+ // src/components/Objects/ObjectItemLoadingSkeleton.tsx
20830
+ init_emotion_jsx_shim();
20831
+
20832
+ // src/components/Objects/styles/ObjectListItem.styles.ts
20833
+ init_emotion_jsx_shim();
20834
+ var import_react127 = require("@emotion/react");
20835
+ var ObjectListItem = import_react127.css`
20836
+ background: var(--white);
20837
+ display: grid;
20838
+ gap: var(--spacing-sm);
20766
20839
  padding: var(--spacing-sm);
20767
20840
  transition: background-color var(--duration-fast) var(--timing-ease-out);
20841
+ container-type: inline-size;
20842
+ grid-template-columns: auto 1fr auto;
20768
20843
 
20769
20844
  &:hover {
20770
20845
  background: var(--gray-50);
20771
20846
  }
20772
20847
  `;
20773
- var ObjectListItemSingle = import_react126.css`
20848
+ var ObjectListItemSingle = import_react127.css`
20774
20849
  align-items: center;
20775
20850
  `;
20776
- var ObjectListItemContentWrapper = import_react126.css`
20851
+ var ObjectListItemContentWrapper = import_react127.css`
20852
+ display: grid;
20853
+ gap: var(--spacing-sm);
20854
+ justify-content: space-between;
20777
20855
  flex-grow: 1;
20856
+
20857
+ ${cq("34rem")} {
20858
+ grid-template-columns: auto 1fr auto;
20859
+ }
20778
20860
  `;
20779
- var ObjectListItemContainer = import_react126.css`
20861
+ var ObjectListItemRightSlot = import_react127.css`
20862
+ display: flex;
20863
+ gap: var(--spacing-sm);
20864
+ `;
20865
+ var ObjectListItemContainer = import_react127.css`
20780
20866
  > [role='listitem'] {
20781
20867
  border-top: 1px solid var(--gray-200);
20782
20868
  }
20783
20869
  `;
20784
- var ObjectListItemCover = import_react126.css`
20870
+ var ObjectListItemCover = import_react127.css`
20785
20871
  align-items: center;
20786
20872
  background: var(--gray-100);
20787
20873
  color: var(--gray-500);
@@ -20791,12 +20877,12 @@ var ObjectListItemCover = import_react126.css`
20791
20877
  text-align: center;
20792
20878
  font-size: var(--fs-xs);
20793
20879
  `;
20794
- var ObjectListItemImage = import_react126.css`
20880
+ var ObjectListItemImage = import_react127.css`
20795
20881
  object-fit: cover;
20796
20882
  width: 100%;
20797
20883
  height: 100%;
20798
20884
  `;
20799
- var ObjectListItemLoading = import_react126.css`
20885
+ var ObjectListItemLoading = import_react127.css`
20800
20886
  animation: ${skeletonLoading} 1s linear infinite alternate;
20801
20887
  background: var(--white);
20802
20888
  display: flex;
@@ -20804,15 +20890,18 @@ var ObjectListItemLoading = import_react126.css`
20804
20890
  flex-grow: 1;
20805
20891
  padding: var(--spacing-sm);
20806
20892
  `;
20807
- var ObjectListItemLoadingText = (textLength) => import_react126.css`
20893
+ var ObjectListItemLoadingInner = import_react127.css`
20894
+ flex-grow: 1;
20895
+ `;
20896
+ var ObjectListItemLoadingText = (textLength) => import_react127.css`
20808
20897
  animation: ${fadeIn} 1s linear infinite alternate;
20809
20898
  border-radius: var(--rounded-base);
20810
20899
  background: var(--gray-300);
20811
20900
  display: block;
20812
- width: ${textLength};
20901
+ width: clamp(10ch, 100%, ${textLength});
20813
20902
  height: var(--fs-base);
20814
20903
  `;
20815
- var ObjectListItemLoadingImage = import_react126.css`
20904
+ var ObjectListItemLoadingImage = import_react127.css`
20816
20905
  animation: ${fadeIn} 1s linear infinite alternate;
20817
20906
  border-radius: var(--rounded-base);
20818
20907
  background: var(--gray-300);
@@ -20820,31 +20909,43 @@ var ObjectListItemLoadingImage = import_react126.css`
20820
20909
  width: 80px;
20821
20910
  height: 55px;
20822
20911
  `;
20912
+ var ObjectListItemHeadingWrapper = import_react127.css`
20913
+ display: flex;
20914
+ gap: var(--spacing-xs);
20915
+ `;
20823
20916
 
20824
20917
  // src/components/Objects/ObjectItemLoadingSkeleton.tsx
20825
- var import_jsx_runtime108 = require("@emotion/react/jsx-runtime");
20826
- var ObjectItemLoadingSkeleton = ({ showCover }) => {
20827
- return /* @__PURE__ */ (0, import_jsx_runtime108.jsxs)("div", { css: ObjectListItemLoading, children: [
20828
- showCover ? /* @__PURE__ */ (0, import_jsx_runtime108.jsx)("div", { "data-testid": "object-list-item-cover-skeleton", children: /* @__PURE__ */ (0, import_jsx_runtime108.jsx)("span", { role: "presentation", css: ObjectListItemLoadingImage }) }) : null,
20829
- /* @__PURE__ */ (0, import_jsx_runtime108.jsxs)(HorizontalRhythm, { css: ObjectListItemContentWrapper, justify: "space-between", gap: "sm", children: [
20830
- /* @__PURE__ */ (0, import_jsx_runtime108.jsxs)(VerticalRhythm, { gap: "xs", children: [
20831
- /* @__PURE__ */ (0, import_jsx_runtime108.jsx)(HorizontalRhythm, { gap: "xs", align: "center", children: /* @__PURE__ */ (0, import_jsx_runtime108.jsx)("span", { role: "presentation", css: ObjectListItemLoadingText("30ch") }) }),
20832
- /* @__PURE__ */ (0, import_jsx_runtime108.jsx)("span", { role: "presentation", css: ObjectListItemLoadingText("20ch") })
20833
- ] }),
20834
- /* @__PURE__ */ (0, import_jsx_runtime108.jsxs)(HorizontalRhythm, { gap: "xs", align: "flex-start", children: [
20835
- /* @__PURE__ */ (0, import_jsx_runtime108.jsx)("span", { role: "presentation", css: ObjectListItemLoadingText("6ch") }),
20836
- /* @__PURE__ */ (0, import_jsx_runtime108.jsx)("span", { role: "presentation", css: ObjectListItemLoadingText("2ch") })
20837
- ] })
20838
- ] })
20839
- ] });
20918
+ var import_jsx_runtime109 = require("@emotion/react/jsx-runtime");
20919
+ var ObjectItemLoadingSkeleton = ({
20920
+ showCover,
20921
+ renderAs = "single"
20922
+ }) => {
20923
+ return /* @__PURE__ */ (0, import_jsx_runtime109.jsxs)(
20924
+ "div",
20925
+ {
20926
+ css: [
20927
+ ObjectListItemLoading,
20928
+ {
20929
+ alignItems: renderAs === "multi" ? "flex-start" : "center"
20930
+ }
20931
+ ],
20932
+ children: [
20933
+ showCover ? /* @__PURE__ */ (0, import_jsx_runtime109.jsx)("div", { "data-testid": "object-list-item-cover-skeleton", children: /* @__PURE__ */ (0, import_jsx_runtime109.jsx)("span", { role: "presentation", css: ObjectListItemLoadingImage }) }) : null,
20934
+ /* @__PURE__ */ (0, import_jsx_runtime109.jsx)(VerticalRhythm, { css: ObjectListItemLoadingInner, justify: "space-between", gap: "sm", children: /* @__PURE__ */ (0, import_jsx_runtime109.jsxs)(VerticalRhythm, { gap: "xs", children: [
20935
+ /* @__PURE__ */ (0, import_jsx_runtime109.jsx)(HorizontalRhythm, { gap: "xs", align: "center", children: /* @__PURE__ */ (0, import_jsx_runtime109.jsx)("span", { role: "presentation", css: ObjectListItemLoadingText("30ch") }) }),
20936
+ /* @__PURE__ */ (0, import_jsx_runtime109.jsx)("span", { role: "presentation", css: ObjectListItemLoadingText("20ch") })
20937
+ ] }) })
20938
+ ]
20939
+ }
20940
+ );
20840
20941
  };
20841
20942
 
20842
20943
  // src/components/Objects/ObjectListItem.tsx
20843
20944
  init_emotion_jsx_shim();
20844
- var import_jsx_runtime109 = require("@emotion/react/jsx-runtime");
20945
+ var import_jsx_runtime110 = require("@emotion/react/jsx-runtime");
20845
20946
  var ObjectListItem2 = (props) => {
20846
- const { renderAs, isSelected, cover, header: header2, rightSlot, menuItems, ...divProps } = props;
20847
- return /* @__PURE__ */ (0, import_jsx_runtime109.jsxs)(
20947
+ const { renderAs, isSelected, cover, header: header2, rightSlot, menuItems, dragHandle, ...divProps } = props;
20948
+ return /* @__PURE__ */ (0, import_jsx_runtime110.jsxs)(
20848
20949
  "div",
20849
20950
  {
20850
20951
  role: "listitem",
@@ -20853,24 +20954,23 @@ var ObjectListItem2 = (props) => {
20853
20954
  "aria-selected": isSelected,
20854
20955
  ...divProps,
20855
20956
  children: [
20856
- cover ? /* @__PURE__ */ (0, import_jsx_runtime109.jsx)(HorizontalRhythm, { gap: "sm", align: "center", children: cover }) : null,
20857
- /* @__PURE__ */ (0, import_jsx_runtime109.jsxs)(HorizontalRhythm, { css: ObjectListItemContentWrapper, justify: "space-between", gap: "sm", children: [
20858
- /* @__PURE__ */ (0, import_jsx_runtime109.jsxs)(VerticalRhythm, { gap: "0", children: [
20859
- /* @__PURE__ */ (0, import_jsx_runtime109.jsx)(HorizontalRhythm, { gap: "xs", align: renderAs === "multi" ? "flex-start" : "center", children: header2 }),
20957
+ /* @__PURE__ */ (0, import_jsx_runtime110.jsx)(HorizontalRhythm, { gap: "sm", align: "center", children: dragHandle }),
20958
+ /* @__PURE__ */ (0, import_jsx_runtime110.jsxs)("div", { css: ObjectListItemContentWrapper, children: [
20959
+ /* @__PURE__ */ (0, import_jsx_runtime110.jsx)(HorizontalRhythm, { gap: "sm", align: "center", children: cover }),
20960
+ /* @__PURE__ */ (0, import_jsx_runtime110.jsxs)(VerticalRhythm, { gap: "0", children: [
20961
+ /* @__PURE__ */ (0, import_jsx_runtime110.jsx)(HorizontalRhythm, { gap: "xs", align: renderAs === "multi" ? "flex-start" : "center", children: header2 }),
20860
20962
  renderAs === "multi" ? props.children : null
20861
20963
  ] }),
20862
- /* @__PURE__ */ (0, import_jsx_runtime109.jsxs)(HorizontalRhythm, { gap: "xs", align: "flex-start", children: [
20863
- rightSlot,
20864
- menuItems ? /* @__PURE__ */ (0, import_jsx_runtime109.jsx)(
20865
- Menu,
20866
- {
20867
- menuTrigger: /* @__PURE__ */ (0, import_jsx_runtime109.jsx)(MenuThreeDots, { "data-testid": "object-list-item-menu-btn" }),
20868
- placement: "bottom-end",
20869
- children: menuItems
20870
- }
20871
- ) : null
20872
- ] })
20873
- ] })
20964
+ /* @__PURE__ */ (0, import_jsx_runtime110.jsx)(HorizontalRhythm, { gap: "xs", align: "flex-start", children: rightSlot })
20965
+ ] }),
20966
+ menuItems ? /* @__PURE__ */ (0, import_jsx_runtime110.jsx)(HorizontalRhythm, { gap: "0", align: "flex-start", children: /* @__PURE__ */ (0, import_jsx_runtime110.jsx)(
20967
+ Menu,
20968
+ {
20969
+ menuTrigger: /* @__PURE__ */ (0, import_jsx_runtime110.jsx)(MenuThreeDots, { "data-testid": "object-list-item-menu-btn" }),
20970
+ placement: "bottom-end",
20971
+ children: menuItems
20972
+ }
20973
+ ) }) : null
20874
20974
  ]
20875
20975
  }
20876
20976
  );
@@ -20878,23 +20978,23 @@ var ObjectListItem2 = (props) => {
20878
20978
 
20879
20979
  // src/components/Objects/ObjectListItemContainer.tsx
20880
20980
  init_emotion_jsx_shim();
20881
- var import_jsx_runtime110 = require("@emotion/react/jsx-runtime");
20981
+ var import_jsx_runtime111 = require("@emotion/react/jsx-runtime");
20882
20982
  var ObjectListItemContainer2 = ({ children, gap = "0", ...props }) => {
20883
- return /* @__PURE__ */ (0, import_jsx_runtime110.jsx)(VerticalRhythm, { gap, css: ObjectListItemContainer, role: "list", ...props, children });
20983
+ return /* @__PURE__ */ (0, import_jsx_runtime111.jsx)(VerticalRhythm, { gap, css: ObjectListItemContainer, role: "list", ...props, children });
20884
20984
  };
20885
20985
 
20886
20986
  // src/components/Objects/ObjectListItemCover.tsx
20887
20987
  init_emotion_jsx_shim();
20888
- var import_jsx_runtime111 = require("@emotion/react/jsx-runtime");
20988
+ var import_jsx_runtime112 = require("@emotion/react/jsx-runtime");
20889
20989
  var ObjectListItemCover2 = ({
20890
20990
  imageUrl,
20891
20991
  noImageText = "Image not available",
20892
20992
  ...props
20893
20993
  }) => {
20894
20994
  if (!imageUrl) {
20895
- return /* @__PURE__ */ (0, import_jsx_runtime111.jsx)("div", { css: ObjectListItemCover, role: "presentation", "data-testid": "object-list-item-thumbnail", children: noImageText });
20995
+ return /* @__PURE__ */ (0, import_jsx_runtime112.jsx)("div", { css: ObjectListItemCover, role: "presentation", "data-testid": "object-list-item-thumbnail", children: noImageText });
20896
20996
  }
20897
- return /* @__PURE__ */ (0, import_jsx_runtime111.jsx)("div", { css: ObjectListItemCover, children: /* @__PURE__ */ (0, import_jsx_runtime111.jsx)(
20997
+ return /* @__PURE__ */ (0, import_jsx_runtime112.jsx)("div", { css: ObjectListItemCover, children: /* @__PURE__ */ (0, import_jsx_runtime112.jsx)(
20898
20998
  "img",
20899
20999
  {
20900
21000
  src: imageUrl,
@@ -20908,17 +21008,38 @@ var ObjectListItemCover2 = ({
20908
21008
 
20909
21009
  // src/components/Objects/ObjectListItemHeading.tsx
20910
21010
  init_emotion_jsx_shim();
20911
- var import_jsx_runtime112 = require("@emotion/react/jsx-runtime");
20912
- var ObjectListItemHeading = ({
21011
+
21012
+ // src/components/Objects/styles/ObjectListItemHeading.styles.ts
21013
+ init_emotion_jsx_shim();
21014
+ var import_react128 = require("@emotion/react");
21015
+ var ObjectListItemHeading = import_react128.css`
21016
+ display: flex;
21017
+ flex-direction: column;
21018
+ gap: var(--spacing-xs);
21019
+
21020
+ ${cq("34rem")} {
21021
+ align-items: center;
21022
+ flex-direction: row;
21023
+ }
21024
+ `;
21025
+ var ObjectListItemHeadingAfterWrapper = import_react128.css`
21026
+ line-height: 1.25;
21027
+ `;
21028
+
21029
+ // src/components/Objects/ObjectListItemHeading.tsx
21030
+ var import_jsx_runtime113 = require("@emotion/react/jsx-runtime");
21031
+ var ObjectListItemHeading2 = ({
20913
21032
  heading,
20914
21033
  beforeHeadingSlot,
20915
21034
  afterHeadingSlot,
20916
21035
  ...props
20917
21036
  }) => {
20918
- return /* @__PURE__ */ (0, import_jsx_runtime112.jsxs)(HorizontalRhythm, { align: "center", gap: "xs", ...props, children: [
20919
- beforeHeadingSlot,
20920
- /* @__PURE__ */ (0, import_jsx_runtime112.jsx)("div", { role: "heading", children: heading }),
20921
- afterHeadingSlot
21037
+ return /* @__PURE__ */ (0, import_jsx_runtime113.jsxs)("div", { css: ObjectListItemHeading, ...props, children: [
21038
+ beforeHeadingSlot ? /* @__PURE__ */ (0, import_jsx_runtime113.jsx)(HorizontalRhythm, { gap: "xs", align: "center", children: beforeHeadingSlot }) : null,
21039
+ /* @__PURE__ */ (0, import_jsx_runtime113.jsxs)(HorizontalRhythm, { css: ObjectListItemHeadingAfterWrapper, gap: "xs", align: "flex-start", children: [
21040
+ /* @__PURE__ */ (0, import_jsx_runtime113.jsx)("div", { role: "heading", children: heading }),
21041
+ afterHeadingSlot
21042
+ ] })
20922
21043
  ] });
20923
21044
  };
20924
21045
 
@@ -20956,7 +21077,7 @@ var page = import_css.css`
20956
21077
  `;
20957
21078
 
20958
21079
  // src/components/Pagination/Pagination.tsx
20959
- var import_jsx_runtime113 = require("@emotion/react/jsx-runtime");
21080
+ var import_jsx_runtime114 = require("@emotion/react/jsx-runtime");
20960
21081
  function Pagination({
20961
21082
  limit,
20962
21083
  offset,
@@ -20971,12 +21092,12 @@ function Pagination({
20971
21092
  if (pageCount <= 1) {
20972
21093
  return null;
20973
21094
  }
20974
- return /* @__PURE__ */ (0, import_jsx_runtime113.jsx)(
21095
+ return /* @__PURE__ */ (0, import_jsx_runtime114.jsx)(
20975
21096
  import_react_paginate.default,
20976
21097
  {
20977
21098
  forcePage: currentPage,
20978
- previousLabel: /* @__PURE__ */ (0, import_jsx_runtime113.jsx)("div", { className: prevNextControls, children: "<" }),
20979
- nextLabel: /* @__PURE__ */ (0, import_jsx_runtime113.jsx)("div", { className: prevNextControls, children: ">" }),
21099
+ previousLabel: /* @__PURE__ */ (0, import_jsx_runtime114.jsx)("div", { className: prevNextControls, children: "<" }),
21100
+ nextLabel: /* @__PURE__ */ (0, import_jsx_runtime114.jsx)("div", { className: prevNextControls, children: ">" }),
20980
21101
  breakLabel: "...",
20981
21102
  pageCount,
20982
21103
  marginPagesDisplayed: 2,
@@ -20996,8 +21117,8 @@ function Pagination({
20996
21117
 
20997
21118
  // src/components/ParameterInputs/hooks/ParameterShellContext.tsx
20998
21119
  init_emotion_jsx_shim();
20999
- var import_react127 = require("react");
21000
- var ParameterShellContext = (0, import_react127.createContext)({
21120
+ var import_react129 = require("react");
21121
+ var ParameterShellContext = (0, import_react129.createContext)({
21001
21122
  id: "",
21002
21123
  label: "",
21003
21124
  hiddenLabel: void 0,
@@ -21006,7 +21127,7 @@ var ParameterShellContext = (0, import_react127.createContext)({
21006
21127
  }
21007
21128
  });
21008
21129
  var useParameterShell = () => {
21009
- const { id, label, hiddenLabel, errorMessage, handleManuallySetErrorMessage } = (0, import_react127.useContext)(ParameterShellContext);
21130
+ const { id, label, hiddenLabel, errorMessage, handleManuallySetErrorMessage } = (0, import_react129.useContext)(ParameterShellContext);
21010
21131
  return {
21011
21132
  id,
21012
21133
  label,
@@ -21021,8 +21142,8 @@ init_emotion_jsx_shim();
21021
21142
 
21022
21143
  // src/components/ParameterInputs/styles/LabelLeadingIcon.styles.ts
21023
21144
  init_emotion_jsx_shim();
21024
- var import_react128 = require("@emotion/react");
21025
- var inputIconBtn = import_react128.css`
21145
+ var import_react130 = require("@emotion/react");
21146
+ var inputIconBtn = import_react130.css`
21026
21147
  align-items: center;
21027
21148
  border: none;
21028
21149
  border-radius: var(--rounded-base);
@@ -21048,7 +21169,7 @@ var inputIconBtn = import_react128.css`
21048
21169
  `;
21049
21170
 
21050
21171
  // src/components/ParameterInputs/LabelLeadingIcon.tsx
21051
- var import_jsx_runtime114 = require("@emotion/react/jsx-runtime");
21172
+ var import_jsx_runtime115 = require("@emotion/react/jsx-runtime");
21052
21173
  var LabelLeadingIcon = ({
21053
21174
  icon,
21054
21175
  iconColor,
@@ -21060,7 +21181,7 @@ var LabelLeadingIcon = ({
21060
21181
  ...props
21061
21182
  }) => {
21062
21183
  const titleFr = title2 != null ? title2 : isLocked ? "Read-only pattern parameter" : isBound ? "Connected to external content. Click to edit" : "Click to connect to external content";
21063
- return /* @__PURE__ */ (0, import_jsx_runtime114.jsx)(Tooltip, { title: titleFr, children: /* @__PURE__ */ (0, import_jsx_runtime114.jsxs)(
21184
+ return /* @__PURE__ */ (0, import_jsx_runtime115.jsx)(Tooltip, { title: titleFr, children: /* @__PURE__ */ (0, import_jsx_runtime115.jsxs)(
21064
21185
  "button",
21065
21186
  {
21066
21187
  css: inputIconBtn,
@@ -21070,7 +21191,7 @@ var LabelLeadingIcon = ({
21070
21191
  ...props,
21071
21192
  "data-testid": "lock-button",
21072
21193
  children: [
21073
- /* @__PURE__ */ (0, import_jsx_runtime114.jsx)(
21194
+ /* @__PURE__ */ (0, import_jsx_runtime115.jsx)(
21074
21195
  Icon,
21075
21196
  {
21076
21197
  icon: isLocked ? "lock" : icon ? icon : "arrows-expand-down-right",
@@ -21090,8 +21211,8 @@ init_emotion_jsx_shim();
21090
21211
 
21091
21212
  // src/components/ParameterInputs/styles/ParameterInput.styles.ts
21092
21213
  init_emotion_jsx_shim();
21093
- var import_react129 = require("@emotion/react");
21094
- var inputContainer2 = import_react129.css`
21214
+ var import_react131 = require("@emotion/react");
21215
+ var inputContainer2 = import_react131.css`
21095
21216
  position: relative;
21096
21217
  scroll-margin: var(--spacing-2xl);
21097
21218
 
@@ -21104,14 +21225,14 @@ var inputContainer2 = import_react129.css`
21104
21225
  }
21105
21226
  }
21106
21227
  `;
21107
- var labelText2 = import_react129.css`
21228
+ var labelText2 = import_react131.css`
21108
21229
  align-items: center;
21109
21230
  display: flex;
21110
21231
  gap: var(--spacing-xs);
21111
21232
  font-weight: var(--fw-regular);
21112
21233
  margin: 0 0 var(--spacing-xs);
21113
21234
  `;
21114
- var input3 = import_react129.css`
21235
+ var input3 = import_react131.css`
21115
21236
  display: block;
21116
21237
  appearance: none;
21117
21238
  box-sizing: border-box;
@@ -21159,18 +21280,18 @@ var input3 = import_react129.css`
21159
21280
  color: var(--gray-400);
21160
21281
  }
21161
21282
  `;
21162
- var selectInput = import_react129.css`
21283
+ var selectInput = import_react131.css`
21163
21284
  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");
21164
21285
  background-position: right var(--spacing-sm) center;
21165
21286
  background-repeat: no-repeat;
21166
21287
  background-size: 1rem;
21167
21288
  padding-right: var(--spacing-xl);
21168
21289
  `;
21169
- var inputWrapper = import_react129.css`
21290
+ var inputWrapper = import_react131.css`
21170
21291
  display: flex; // used to correct overflow with chrome textarea
21171
21292
  position: relative;
21172
21293
  `;
21173
- var inputIcon2 = import_react129.css`
21294
+ var inputIcon2 = import_react131.css`
21174
21295
  align-items: center;
21175
21296
  background: var(--white);
21176
21297
  border-radius: var(--rounded-md) 0 0 var(--rounded-md);
@@ -21186,7 +21307,7 @@ var inputIcon2 = import_react129.css`
21186
21307
  width: var(--spacing-lg);
21187
21308
  z-index: var(--z-10);
21188
21309
  `;
21189
- var inputToggleLabel2 = import_react129.css`
21310
+ var inputToggleLabel2 = import_react131.css`
21190
21311
  --inline-label-color: var(--typography-base);
21191
21312
  align-items: center;
21192
21313
  cursor: pointer;
@@ -21201,7 +21322,7 @@ var inputToggleLabel2 = import_react129.css`
21201
21322
  --inline-label-color: var(--gray-400);
21202
21323
  }
21203
21324
  `;
21204
- var toggleInput2 = import_react129.css`
21325
+ var toggleInput2 = import_react131.css`
21205
21326
  appearance: none;
21206
21327
  border: 1px solid var(--gray-200);
21207
21328
  background: var(--white);
@@ -21254,7 +21375,7 @@ var toggleInput2 = import_react129.css`
21254
21375
  border-color: var(--gray-300);
21255
21376
  }
21256
21377
  `;
21257
- var inlineLabel2 = import_react129.css`
21378
+ var inlineLabel2 = import_react131.css`
21258
21379
  color: var(--inline-label-color);
21259
21380
  padding-left: var(--spacing-md);
21260
21381
  font-size: var(--fs-sm);
@@ -21271,7 +21392,7 @@ var inlineLabel2 = import_react129.css`
21271
21392
  }
21272
21393
  }
21273
21394
  `;
21274
- var inputMenu = import_react129.css`
21395
+ var inputMenu = import_react131.css`
21275
21396
  background: none;
21276
21397
  border: none;
21277
21398
  padding: var(--spacing-2xs);
@@ -21279,10 +21400,10 @@ var inputMenu = import_react129.css`
21279
21400
  top: calc(var(--spacing-md) * -1.2);
21280
21401
  right: 0;
21281
21402
  `;
21282
- var inputActionItems = import_react129.css`
21403
+ var inputActionItems = import_react131.css`
21283
21404
  display: flex;
21284
21405
  `;
21285
- var inputMenuHover = import_react129.css`
21406
+ var inputMenuHover = import_react131.css`
21286
21407
  opacity: var(--opacity-50);
21287
21408
  transition: background-color var(--duration-fast) var(--timing-ease-out);
21288
21409
 
@@ -21292,11 +21413,11 @@ var inputMenuHover = import_react129.css`
21292
21413
  background-color: var(--gray-200);
21293
21414
  }
21294
21415
  `;
21295
- var textarea2 = import_react129.css`
21416
+ var textarea2 = import_react131.css`
21296
21417
  resize: vertical;
21297
21418
  min-height: 2rem;
21298
21419
  `;
21299
- var dataConnectButton = import_react129.css`
21420
+ var dataConnectButton = import_react131.css`
21300
21421
  align-items: center;
21301
21422
  appearance: none;
21302
21423
  box-sizing: border-box;
@@ -21331,7 +21452,7 @@ var dataConnectButton = import_react129.css`
21331
21452
  pointer-events: none;
21332
21453
  }
21333
21454
  `;
21334
- var linkParameterBtn = import_react129.css`
21455
+ var linkParameterBtn = import_react131.css`
21335
21456
  border-radius: var(--rounded-base);
21336
21457
  background: transparent;
21337
21458
  border: none;
@@ -21340,7 +21461,7 @@ var linkParameterBtn = import_react129.css`
21340
21461
  font-size: var(--fs-sm);
21341
21462
  line-height: 1;
21342
21463
  `;
21343
- var linkParameterControls = import_react129.css`
21464
+ var linkParameterControls = import_react131.css`
21344
21465
  position: absolute;
21345
21466
  inset: 0 0 0 auto;
21346
21467
  padding: 0 var(--spacing-base);
@@ -21349,7 +21470,7 @@ var linkParameterControls = import_react129.css`
21349
21470
  justify-content: center;
21350
21471
  gap: var(--spacing-base);
21351
21472
  `;
21352
- var linkParameterInput = (withExternalLinkIcon) => import_react129.css`
21473
+ var linkParameterInput = (withExternalLinkIcon) => import_react131.css`
21353
21474
  padding-right: calc(
21354
21475
  ${withExternalLinkIcon ? "calc(var(--spacing-lg) * 2 + var(--spacing-xs))" : "var(--spacing-xl)"} +
21355
21476
  var(--spacing-base)
@@ -21362,7 +21483,7 @@ var linkParameterInput = (withExternalLinkIcon) => import_react129.css`
21362
21483
  }
21363
21484
  }
21364
21485
  `;
21365
- var linkParameterIcon = import_react129.css`
21486
+ var linkParameterIcon = import_react131.css`
21366
21487
  align-items: center;
21367
21488
  color: var(--brand-secondary-3);
21368
21489
  display: flex;
@@ -21377,7 +21498,7 @@ var linkParameterIcon = import_react129.css`
21377
21498
  `;
21378
21499
 
21379
21500
  // src/components/ParameterInputs/ParameterDataResource.tsx
21380
- var import_jsx_runtime115 = require("@emotion/react/jsx-runtime");
21501
+ var import_jsx_runtime116 = require("@emotion/react/jsx-runtime");
21381
21502
  function ParameterDataResource({
21382
21503
  label,
21383
21504
  labelLeadingIcon,
@@ -21387,12 +21508,12 @@ function ParameterDataResource({
21387
21508
  disabled: disabled2,
21388
21509
  children
21389
21510
  }) {
21390
- return /* @__PURE__ */ (0, import_jsx_runtime115.jsxs)("div", { "data-testid": "parameter-data-connect-button", children: [
21391
- /* @__PURE__ */ (0, import_jsx_runtime115.jsxs)("span", { css: labelText2, children: [
21511
+ return /* @__PURE__ */ (0, import_jsx_runtime116.jsxs)("div", { "data-testid": "parameter-data-connect-button", children: [
21512
+ /* @__PURE__ */ (0, import_jsx_runtime116.jsxs)("span", { css: labelText2, children: [
21392
21513
  labelLeadingIcon ? labelLeadingIcon : null,
21393
21514
  label
21394
21515
  ] }),
21395
- /* @__PURE__ */ (0, import_jsx_runtime115.jsxs)(
21516
+ /* @__PURE__ */ (0, import_jsx_runtime116.jsxs)(
21396
21517
  "button",
21397
21518
  {
21398
21519
  type: "button",
@@ -21401,12 +21522,12 @@ function ParameterDataResource({
21401
21522
  disabled: disabled2,
21402
21523
  onClick: onConnectDatasource,
21403
21524
  children: [
21404
- /* @__PURE__ */ (0, import_jsx_runtime115.jsx)("span", { className: "advance-input-icon", css: [inputIcon2], children: /* @__PURE__ */ (0, import_jsx_runtime115.jsx)(Icon, { icon: "stack", iconColor: "currentColor", size: "1rem" }) }),
21525
+ /* @__PURE__ */ (0, import_jsx_runtime116.jsx)("span", { className: "advance-input-icon", css: [inputIcon2], children: /* @__PURE__ */ (0, import_jsx_runtime116.jsx)(Icon, { icon: "stack", iconColor: "currentColor", size: "1rem" }) }),
21405
21526
  children
21406
21527
  ]
21407
21528
  }
21408
21529
  ),
21409
- caption ? /* @__PURE__ */ (0, import_jsx_runtime115.jsx)(Caption, { children: caption }) : null
21530
+ caption ? /* @__PURE__ */ (0, import_jsx_runtime116.jsx)(Caption, { children: caption }) : null
21410
21531
  ] });
21411
21532
  }
21412
21533
 
@@ -21415,20 +21536,20 @@ init_emotion_jsx_shim();
21415
21536
 
21416
21537
  // src/components/ParameterInputs/styles/ParameterDrawerHeader.styles.ts
21417
21538
  init_emotion_jsx_shim();
21418
- var import_react130 = require("@emotion/react");
21419
- var ParameterDrawerHeaderContainer = import_react130.css`
21539
+ var import_react132 = require("@emotion/react");
21540
+ var ParameterDrawerHeaderContainer = import_react132.css`
21420
21541
  align-items: center;
21421
21542
  display: flex;
21422
21543
  gap: var(--spacing-base);
21423
21544
  justify-content: space-between;
21424
21545
  margin-bottom: var(--spacing-sm);
21425
21546
  `;
21426
- var ParameterDrawerHeaderTitleGroup = import_react130.css`
21547
+ var ParameterDrawerHeaderTitleGroup = import_react132.css`
21427
21548
  align-items: center;
21428
21549
  display: flex;
21429
21550
  gap: var(--spacing-sm);
21430
21551
  `;
21431
- var ParameterDrawerHeaderTitle = import_react130.css`
21552
+ var ParameterDrawerHeaderTitle = import_react132.css`
21432
21553
  text-overflow: ellipsis;
21433
21554
  white-space: nowrap;
21434
21555
  overflow: hidden;
@@ -21436,12 +21557,12 @@ var ParameterDrawerHeaderTitle = import_react130.css`
21436
21557
  `;
21437
21558
 
21438
21559
  // src/components/ParameterInputs/ParameterDrawerHeader.tsx
21439
- var import_jsx_runtime116 = require("@emotion/react/jsx-runtime");
21560
+ var import_jsx_runtime117 = require("@emotion/react/jsx-runtime");
21440
21561
  var ParameterDrawerHeader = ({ title: title2, iconBeforeTitle, children }) => {
21441
- return /* @__PURE__ */ (0, import_jsx_runtime116.jsxs)("div", { css: ParameterDrawerHeaderContainer, children: [
21442
- /* @__PURE__ */ (0, import_jsx_runtime116.jsxs)("header", { css: ParameterDrawerHeaderTitleGroup, children: [
21562
+ return /* @__PURE__ */ (0, import_jsx_runtime117.jsxs)("div", { css: ParameterDrawerHeaderContainer, children: [
21563
+ /* @__PURE__ */ (0, import_jsx_runtime117.jsxs)("header", { css: ParameterDrawerHeaderTitleGroup, children: [
21443
21564
  iconBeforeTitle,
21444
- /* @__PURE__ */ (0, import_jsx_runtime116.jsx)(Heading2, { level: 3, withMarginBottom: false, css: ParameterDrawerHeaderTitle, title: title2, children: title2 })
21565
+ /* @__PURE__ */ (0, import_jsx_runtime117.jsx)(Heading2, { level: 3, withMarginBottom: false, css: ParameterDrawerHeaderTitle, title: title2, children: title2 })
21445
21566
  ] }),
21446
21567
  children
21447
21568
  ] });
@@ -21449,12 +21570,12 @@ var ParameterDrawerHeader = ({ title: title2, iconBeforeTitle, children }) => {
21449
21570
 
21450
21571
  // src/components/ParameterInputs/ParameterGroup.tsx
21451
21572
  init_emotion_jsx_shim();
21452
- var import_react132 = require("react");
21573
+ var import_react134 = require("react");
21453
21574
 
21454
21575
  // src/components/ParameterInputs/styles/ParameterGroup.styles.ts
21455
21576
  init_emotion_jsx_shim();
21456
- var import_react131 = require("@emotion/react");
21457
- var fieldsetStyles = import_react131.css`
21577
+ var import_react133 = require("@emotion/react");
21578
+ var fieldsetStyles = import_react133.css`
21458
21579
  &:disabled,
21459
21580
  [readonly] {
21460
21581
  pointer-events: none;
@@ -21465,7 +21586,7 @@ var fieldsetStyles = import_react131.css`
21465
21586
  }
21466
21587
  }
21467
21588
  `;
21468
- var fieldsetLegend2 = import_react131.css`
21589
+ var fieldsetLegend2 = import_react133.css`
21469
21590
  display: block;
21470
21591
  font-weight: var(--fw-medium);
21471
21592
  margin-bottom: var(--spacing-sm);
@@ -21473,11 +21594,11 @@ var fieldsetLegend2 = import_react131.css`
21473
21594
  `;
21474
21595
 
21475
21596
  // src/components/ParameterInputs/ParameterGroup.tsx
21476
- var import_jsx_runtime117 = require("@emotion/react/jsx-runtime");
21477
- var ParameterGroup = (0, import_react132.forwardRef)(
21597
+ var import_jsx_runtime118 = require("@emotion/react/jsx-runtime");
21598
+ var ParameterGroup = (0, import_react134.forwardRef)(
21478
21599
  ({ legend, isDisabled, children, ...props }, ref) => {
21479
- return /* @__PURE__ */ (0, import_jsx_runtime117.jsxs)("fieldset", { css: fieldsetStyles, disabled: isDisabled, ref, ...props, children: [
21480
- /* @__PURE__ */ (0, import_jsx_runtime117.jsx)("legend", { css: fieldsetLegend2, children: legend }),
21600
+ return /* @__PURE__ */ (0, import_jsx_runtime118.jsxs)("fieldset", { css: fieldsetStyles, disabled: isDisabled, ref, ...props, children: [
21601
+ /* @__PURE__ */ (0, import_jsx_runtime118.jsx)("legend", { css: fieldsetLegend2, children: legend }),
21481
21602
  children
21482
21603
  ] });
21483
21604
  }
@@ -21485,24 +21606,24 @@ var ParameterGroup = (0, import_react132.forwardRef)(
21485
21606
 
21486
21607
  // src/components/ParameterInputs/ParameterImage.tsx
21487
21608
  init_emotion_jsx_shim();
21488
- var import_react139 = require("react");
21609
+ var import_react141 = require("react");
21489
21610
 
21490
21611
  // src/components/ParameterInputs/ParameterImagePreview.tsx
21491
21612
  init_emotion_jsx_shim();
21492
- var import_react134 = require("react");
21613
+ var import_react136 = require("react");
21493
21614
  var import_react_dom2 = require("react-dom");
21494
21615
 
21495
21616
  // src/components/ParameterInputs/styles/ParameterImage.styles.ts
21496
21617
  init_emotion_jsx_shim();
21497
- var import_react133 = require("@emotion/react");
21498
- var previewWrapper = import_react133.css`
21618
+ var import_react135 = require("@emotion/react");
21619
+ var previewWrapper = import_react135.css`
21499
21620
  margin-top: var(--spacing-xs);
21500
21621
  background: var(--gray-50);
21501
21622
  padding: var(--spacing-sm);
21502
21623
  border: solid 1px var(--gray-300);
21503
21624
  border-radius: var(--rounded-sm);
21504
21625
  `;
21505
- var previewLink = import_react133.css`
21626
+ var previewLink = import_react135.css`
21506
21627
  display: block;
21507
21628
  width: 100%;
21508
21629
 
@@ -21510,7 +21631,7 @@ var previewLink = import_react133.css`
21510
21631
  max-height: 9rem;
21511
21632
  }
21512
21633
  `;
21513
- var previewModalWrapper = import_react133.css`
21634
+ var previewModalWrapper = import_react135.css`
21514
21635
  background: var(--gray-50);
21515
21636
  display: flex;
21516
21637
  height: 100%;
@@ -21519,7 +21640,7 @@ var previewModalWrapper = import_react133.css`
21519
21640
  border: solid 1px var(--gray-300);
21520
21641
  border-radius: var(--rounded-sm);
21521
21642
  `;
21522
- var previewModalImage = import_react133.css`
21643
+ var previewModalImage = import_react135.css`
21523
21644
  display: flex;
21524
21645
  height: 100%;
21525
21646
  width: 100%;
@@ -21531,32 +21652,32 @@ var previewModalImage = import_react133.css`
21531
21652
  `;
21532
21653
 
21533
21654
  // src/components/ParameterInputs/ParameterImagePreview.tsx
21534
- var import_jsx_runtime118 = require("@emotion/react/jsx-runtime");
21655
+ var import_jsx_runtime119 = require("@emotion/react/jsx-runtime");
21535
21656
  function ParameterImagePreview({ imageSrc }) {
21536
- const [showModal, setShowModal] = (0, import_react134.useState)(false);
21537
- return imageSrc ? /* @__PURE__ */ (0, import_jsx_runtime118.jsxs)("div", { css: previewWrapper, children: [
21538
- /* @__PURE__ */ (0, import_jsx_runtime118.jsx)(PreviewImageModal, { open: showModal, imageSrc, onRequestClose: () => setShowModal(false) }),
21539
- /* @__PURE__ */ (0, import_jsx_runtime118.jsx)(
21657
+ const [showModal, setShowModal] = (0, import_react136.useState)(false);
21658
+ return imageSrc ? /* @__PURE__ */ (0, import_jsx_runtime119.jsxs)("div", { css: previewWrapper, children: [
21659
+ /* @__PURE__ */ (0, import_jsx_runtime119.jsx)(PreviewImageModal, { open: showModal, imageSrc, onRequestClose: () => setShowModal(false) }),
21660
+ /* @__PURE__ */ (0, import_jsx_runtime119.jsx)(
21540
21661
  "button",
21541
21662
  {
21542
21663
  css: previewLink,
21543
21664
  onClick: () => {
21544
21665
  setShowModal(true);
21545
21666
  },
21546
- children: /* @__PURE__ */ (0, import_jsx_runtime118.jsx)(Image, { src: imageSrc, "data-testid": "parameter-image-preview" })
21667
+ children: /* @__PURE__ */ (0, import_jsx_runtime119.jsx)(Image, { src: imageSrc, "data-testid": "parameter-image-preview" })
21547
21668
  }
21548
21669
  )
21549
21670
  ] }) : null;
21550
21671
  }
21551
21672
  var PreviewImageModal = ({ open, onRequestClose, imageSrc }) => {
21552
- return open ? /* @__PURE__ */ (0, import_jsx_runtime118.jsx)(import_jsx_runtime118.Fragment, { children: (0, import_react_dom2.createPortal)(
21553
- /* @__PURE__ */ (0, import_jsx_runtime118.jsx)(
21673
+ return open ? /* @__PURE__ */ (0, import_jsx_runtime119.jsx)(import_jsx_runtime119.Fragment, { children: (0, import_react_dom2.createPortal)(
21674
+ /* @__PURE__ */ (0, import_jsx_runtime119.jsx)(
21554
21675
  Modal,
21555
21676
  {
21556
21677
  header: "Image Preview",
21557
21678
  onRequestClose,
21558
- buttonGroup: /* @__PURE__ */ (0, import_jsx_runtime118.jsx)(Button, { buttonType: "secondary", onClick: onRequestClose, children: "Ok" }),
21559
- children: /* @__PURE__ */ (0, import_jsx_runtime118.jsx)("div", { css: previewModalWrapper, children: /* @__PURE__ */ (0, import_jsx_runtime118.jsx)(Image, { src: imageSrc, css: previewModalImage, "data-testid": "parameter-image-preview" }) })
21679
+ buttonGroup: /* @__PURE__ */ (0, import_jsx_runtime119.jsx)(Button, { buttonType: "secondary", onClick: onRequestClose, children: "Ok" }),
21680
+ children: /* @__PURE__ */ (0, import_jsx_runtime119.jsx)("div", { css: previewModalWrapper, children: /* @__PURE__ */ (0, import_jsx_runtime119.jsx)(Image, { src: imageSrc, css: previewModalImage, "data-testid": "parameter-image-preview" }) })
21560
21681
  }
21561
21682
  ),
21562
21683
  document.body
@@ -21565,27 +21686,27 @@ var PreviewImageModal = ({ open, onRequestClose, imageSrc }) => {
21565
21686
 
21566
21687
  // src/components/ParameterInputs/ParameterShell.tsx
21567
21688
  init_emotion_jsx_shim();
21568
- var import_react137 = require("@emotion/react");
21569
- var import_react138 = require("react");
21689
+ var import_react139 = require("@emotion/react");
21690
+ var import_react140 = require("react");
21570
21691
 
21571
21692
  // src/components/ParameterInputs/ParameterLabel.tsx
21572
21693
  init_emotion_jsx_shim();
21573
- var import_jsx_runtime119 = require("@emotion/react/jsx-runtime");
21694
+ var import_jsx_runtime120 = require("@emotion/react/jsx-runtime");
21574
21695
  var ParameterLabel = ({ id, asSpan, children, ...props }) => {
21575
- return !asSpan ? /* @__PURE__ */ (0, import_jsx_runtime119.jsx)("label", { ...props, htmlFor: id, css: labelText2, children }) : /* @__PURE__ */ (0, import_jsx_runtime119.jsx)("span", { "aria-labelledby": id, css: labelText2, children });
21696
+ return !asSpan ? /* @__PURE__ */ (0, import_jsx_runtime120.jsx)("label", { ...props, htmlFor: id, css: labelText2, children }) : /* @__PURE__ */ (0, import_jsx_runtime120.jsx)("span", { "aria-labelledby": id, css: labelText2, children });
21576
21697
  };
21577
21698
 
21578
21699
  // src/components/ParameterInputs/ParameterMenuButton.tsx
21579
21700
  init_emotion_jsx_shim();
21580
- var import_react135 = require("react");
21581
- var import_jsx_runtime120 = require("@emotion/react/jsx-runtime");
21582
- var ParameterMenuButton = (0, import_react135.forwardRef)(
21701
+ var import_react137 = require("react");
21702
+ var import_jsx_runtime121 = require("@emotion/react/jsx-runtime");
21703
+ var ParameterMenuButton = (0, import_react137.forwardRef)(
21583
21704
  ({ label, children }, ref) => {
21584
- return /* @__PURE__ */ (0, import_jsx_runtime120.jsx)(
21705
+ return /* @__PURE__ */ (0, import_jsx_runtime121.jsx)(
21585
21706
  Menu,
21586
21707
  {
21587
21708
  menuLabel: `${label} menu`,
21588
- menuTrigger: /* @__PURE__ */ (0, import_jsx_runtime120.jsx)(
21709
+ menuTrigger: /* @__PURE__ */ (0, import_jsx_runtime121.jsx)(
21589
21710
  "button",
21590
21711
  {
21591
21712
  className: "parameter-menu",
@@ -21593,7 +21714,7 @@ var ParameterMenuButton = (0, import_react135.forwardRef)(
21593
21714
  type: "button",
21594
21715
  "aria-label": `${label} options`,
21595
21716
  ref,
21596
- children: /* @__PURE__ */ (0, import_jsx_runtime120.jsx)(Icon, { icon: "more-alt", iconColor: "currentColor", size: "0.9rem" })
21717
+ children: /* @__PURE__ */ (0, import_jsx_runtime121.jsx)(Icon, { icon: "more-alt", iconColor: "currentColor", size: "0.9rem" })
21597
21718
  }
21598
21719
  ),
21599
21720
  children
@@ -21604,14 +21725,14 @@ var ParameterMenuButton = (0, import_react135.forwardRef)(
21604
21725
 
21605
21726
  // src/components/ParameterInputs/styles/ParameterShell.styles.ts
21606
21727
  init_emotion_jsx_shim();
21607
- var import_react136 = require("@emotion/react");
21608
- var emptyParameterShell = import_react136.css`
21728
+ var import_react138 = require("@emotion/react");
21729
+ var emptyParameterShell = import_react138.css`
21609
21730
  border-radius: var(--rounded-sm);
21610
21731
  flex-grow: 1;
21611
21732
  position: relative;
21612
21733
  max-width: 100%;
21613
21734
  `;
21614
- var emptyParameterShellText = import_react136.css`
21735
+ var emptyParameterShellText = import_react138.css`
21615
21736
  background: var(--brand-secondary-6);
21616
21737
  border-radius: var(--rounded-sm);
21617
21738
  padding: var(--spacing-sm);
@@ -21619,7 +21740,7 @@ var emptyParameterShellText = import_react136.css`
21619
21740
  font-size: var(--fs-sm);
21620
21741
  margin: 0;
21621
21742
  `;
21622
- var overrideMarker = import_react136.css`
21743
+ var overrideMarker = import_react138.css`
21623
21744
  border-radius: var(--rounded-sm);
21624
21745
  border: 10px solid var(--gray-300);
21625
21746
  border-left-color: transparent;
@@ -21630,7 +21751,7 @@ var overrideMarker = import_react136.css`
21630
21751
  `;
21631
21752
 
21632
21753
  // src/components/ParameterInputs/ParameterShell.tsx
21633
- var import_jsx_runtime121 = require("@emotion/react/jsx-runtime");
21754
+ var import_jsx_runtime122 = require("@emotion/react/jsx-runtime");
21634
21755
  var extractParameterProps = (props) => {
21635
21756
  const {
21636
21757
  id,
@@ -21690,36 +21811,36 @@ var ParameterShell = ({
21690
21811
  isParameterGroup = false,
21691
21812
  ...props
21692
21813
  }) => {
21693
- const [manualErrorMessage, setManualErrorMessage] = (0, import_react138.useState)(void 0);
21814
+ const [manualErrorMessage, setManualErrorMessage] = (0, import_react140.useState)(void 0);
21694
21815
  const setErrorMessage = (message) => setManualErrorMessage(message);
21695
21816
  const errorMessaging = errorMessage || manualErrorMessage;
21696
- return /* @__PURE__ */ (0, import_jsx_runtime121.jsxs)("div", { css: inputContainer2, ...props, id, children: [
21697
- hiddenLabel || title2 ? null : /* @__PURE__ */ (0, import_jsx_runtime121.jsxs)(ParameterLabel, { id, css: labelText2, children: [
21817
+ return /* @__PURE__ */ (0, import_jsx_runtime122.jsxs)("div", { css: inputContainer2, ...props, id, children: [
21818
+ hiddenLabel || title2 ? null : /* @__PURE__ */ (0, import_jsx_runtime122.jsxs)(ParameterLabel, { id, css: labelText2, children: [
21698
21819
  labelLeadingIcon != null ? labelLeadingIcon : null,
21699
21820
  label,
21700
21821
  labelTrailingIcon != null ? labelTrailingIcon : null
21701
21822
  ] }),
21702
- !title2 ? null : /* @__PURE__ */ (0, import_jsx_runtime121.jsxs)(ParameterLabel, { id, asSpan: true, children: [
21823
+ !title2 ? null : /* @__PURE__ */ (0, import_jsx_runtime122.jsxs)(ParameterLabel, { id, asSpan: true, children: [
21703
21824
  labelLeadingIcon != null ? labelLeadingIcon : null,
21704
21825
  title2,
21705
21826
  labelTrailingIcon != null ? labelTrailingIcon : null
21706
21827
  ] }),
21707
- /* @__PURE__ */ (0, import_jsx_runtime121.jsxs)("div", { css: inputWrapper, children: [
21708
- actionItems ? /* @__PURE__ */ (0, import_jsx_runtime121.jsx)(
21828
+ /* @__PURE__ */ (0, import_jsx_runtime122.jsxs)("div", { css: inputWrapper, children: [
21829
+ actionItems ? /* @__PURE__ */ (0, import_jsx_runtime122.jsx)(
21709
21830
  "div",
21710
21831
  {
21711
21832
  css: [
21712
21833
  inputMenu,
21713
21834
  inputActionItems,
21714
- menuItems ? import_react137.css`
21835
+ menuItems ? import_react139.css`
21715
21836
  right: var(--spacing-md);
21716
21837
  ` : void 0
21717
21838
  ],
21718
21839
  children: actionItems
21719
21840
  }
21720
21841
  ) : null,
21721
- menuItems ? /* @__PURE__ */ (0, import_jsx_runtime121.jsx)(ParameterMenuButton, { label: `${label} menu`, children: menuItems }) : null,
21722
- /* @__PURE__ */ (0, import_jsx_runtime121.jsx)(
21842
+ menuItems ? /* @__PURE__ */ (0, import_jsx_runtime122.jsx)(ParameterMenuButton, { label: `${label} menu`, children: menuItems }) : null,
21843
+ /* @__PURE__ */ (0, import_jsx_runtime122.jsx)(
21723
21844
  ParameterShellContext.Provider,
21724
21845
  {
21725
21846
  value: {
@@ -21729,14 +21850,14 @@ var ParameterShell = ({
21729
21850
  errorMessage: errorMessaging,
21730
21851
  handleManuallySetErrorMessage: (message) => setErrorMessage(message)
21731
21852
  },
21732
- children: isParameterGroup ? /* @__PURE__ */ (0, import_jsx_runtime121.jsx)("div", { style: { flexGrow: 1 }, children }) : /* @__PURE__ */ (0, import_jsx_runtime121.jsxs)(ParameterShellPlaceholder, { children: [
21853
+ children: isParameterGroup ? /* @__PURE__ */ (0, import_jsx_runtime122.jsx)("div", { style: { flexGrow: 1 }, children }) : /* @__PURE__ */ (0, import_jsx_runtime122.jsxs)(ParameterShellPlaceholder, { children: [
21733
21854
  children,
21734
- hasOverriddenValue && onResetOverriddenValue ? /* @__PURE__ */ (0, import_jsx_runtime121.jsx)(ParameterOverrideMarker, { onClick: onResetOverriddenValue }) : null
21855
+ hasOverriddenValue && onResetOverriddenValue ? /* @__PURE__ */ (0, import_jsx_runtime122.jsx)(ParameterOverrideMarker, { onClick: onResetOverriddenValue }) : null
21735
21856
  ] })
21736
21857
  }
21737
21858
  )
21738
21859
  ] }),
21739
- /* @__PURE__ */ (0, import_jsx_runtime121.jsx)(
21860
+ /* @__PURE__ */ (0, import_jsx_runtime122.jsx)(
21740
21861
  FieldMessage,
21741
21862
  {
21742
21863
  helperMessageTestId: captionTestId,
@@ -21750,27 +21871,27 @@ var ParameterShell = ({
21750
21871
  ] });
21751
21872
  };
21752
21873
  var ParameterShellPlaceholder = ({ children }) => {
21753
- return /* @__PURE__ */ (0, import_jsx_runtime121.jsx)("div", { css: emptyParameterShell, children });
21874
+ return /* @__PURE__ */ (0, import_jsx_runtime122.jsx)("div", { css: emptyParameterShell, children });
21754
21875
  };
21755
- var ParameterOverrideMarker = (props) => /* @__PURE__ */ (0, import_jsx_runtime121.jsx)(Tooltip, { title: "The default value has been overridden", children: /* @__PURE__ */ (0, import_jsx_runtime121.jsx)("button", { type: "button", css: overrideMarker, ...props, children: /* @__PURE__ */ (0, import_jsx_runtime121.jsx)("span", { hidden: true, children: "reset overridden value to default" }) }) });
21876
+ var ParameterOverrideMarker = (props) => /* @__PURE__ */ (0, import_jsx_runtime122.jsx)(Tooltip, { title: "The default value has been overridden", children: /* @__PURE__ */ (0, import_jsx_runtime122.jsx)("button", { type: "button", css: overrideMarker, ...props, children: /* @__PURE__ */ (0, import_jsx_runtime122.jsx)("span", { hidden: true, children: "reset overridden value to default" }) }) });
21756
21877
 
21757
21878
  // src/components/ParameterInputs/ParameterImage.tsx
21758
- var import_jsx_runtime122 = require("@emotion/react/jsx-runtime");
21759
- var ParameterImage = (0, import_react139.forwardRef)(
21879
+ var import_jsx_runtime123 = require("@emotion/react/jsx-runtime");
21880
+ var ParameterImage = (0, import_react141.forwardRef)(
21760
21881
  ({ children, ...props }, ref) => {
21761
21882
  const { shellProps, innerProps } = extractParameterProps(props);
21762
- return /* @__PURE__ */ (0, import_jsx_runtime122.jsxs)(ParameterShell, { "data-test-id": "parameter-image", ...shellProps, children: [
21763
- /* @__PURE__ */ (0, import_jsx_runtime122.jsx)(ParameterImageInner, { ref, ...innerProps }),
21883
+ return /* @__PURE__ */ (0, import_jsx_runtime123.jsxs)(ParameterShell, { "data-test-id": "parameter-image", ...shellProps, children: [
21884
+ /* @__PURE__ */ (0, import_jsx_runtime123.jsx)(ParameterImageInner, { ref, ...innerProps }),
21764
21885
  children
21765
21886
  ] });
21766
21887
  }
21767
21888
  );
21768
- var ParameterImageInner = (0, import_react139.forwardRef)((props, ref) => {
21889
+ var ParameterImageInner = (0, import_react141.forwardRef)((props, ref) => {
21769
21890
  const { value } = props;
21770
21891
  const { id, label, hiddenLabel, errorMessage } = useParameterShell();
21771
- const deferredValue = (0, import_react139.useDeferredValue)(value);
21772
- return /* @__PURE__ */ (0, import_jsx_runtime122.jsxs)(import_jsx_runtime122.Fragment, { children: [
21773
- /* @__PURE__ */ (0, import_jsx_runtime122.jsx)(
21892
+ const deferredValue = (0, import_react141.useDeferredValue)(value);
21893
+ return /* @__PURE__ */ (0, import_jsx_runtime123.jsxs)(import_jsx_runtime123.Fragment, { children: [
21894
+ /* @__PURE__ */ (0, import_jsx_runtime123.jsx)(
21774
21895
  "input",
21775
21896
  {
21776
21897
  css: input3,
@@ -21782,22 +21903,22 @@ var ParameterImageInner = (0, import_react139.forwardRef)((props, ref) => {
21782
21903
  ...props
21783
21904
  }
21784
21905
  ),
21785
- errorMessage || props.disablePreview ? null : /* @__PURE__ */ (0, import_jsx_runtime122.jsx)(ParameterImagePreview, { imageSrc: deferredValue })
21906
+ errorMessage || props.disablePreview ? null : /* @__PURE__ */ (0, import_jsx_runtime123.jsx)(ParameterImagePreview, { imageSrc: deferredValue })
21786
21907
  ] });
21787
21908
  });
21788
21909
 
21789
21910
  // src/components/ParameterInputs/ParameterInput.tsx
21790
21911
  init_emotion_jsx_shim();
21791
- var import_react140 = require("react");
21792
- var import_jsx_runtime123 = require("@emotion/react/jsx-runtime");
21793
- var ParameterInput = (0, import_react140.forwardRef)((props, ref) => {
21912
+ var import_react142 = require("react");
21913
+ var import_jsx_runtime124 = require("@emotion/react/jsx-runtime");
21914
+ var ParameterInput = (0, import_react142.forwardRef)((props, ref) => {
21794
21915
  const { shellProps, innerProps } = extractParameterProps(props);
21795
- return /* @__PURE__ */ (0, import_jsx_runtime123.jsx)(ParameterShell, { "data-testid": "parameter-input", ...shellProps, children: /* @__PURE__ */ (0, import_jsx_runtime123.jsx)(ParameterInputInner, { ref, ...innerProps }) });
21916
+ return /* @__PURE__ */ (0, import_jsx_runtime124.jsx)(ParameterShell, { "data-testid": "parameter-input", ...shellProps, children: /* @__PURE__ */ (0, import_jsx_runtime124.jsx)(ParameterInputInner, { ref, ...innerProps }) });
21796
21917
  });
21797
- var ParameterInputInner = (0, import_react140.forwardRef)(
21918
+ var ParameterInputInner = (0, import_react142.forwardRef)(
21798
21919
  ({ ...props }, ref) => {
21799
21920
  const { id, label, hiddenLabel } = useParameterShell();
21800
- return /* @__PURE__ */ (0, import_jsx_runtime123.jsx)(
21921
+ return /* @__PURE__ */ (0, import_jsx_runtime124.jsx)(
21801
21922
  "input",
21802
21923
  {
21803
21924
  css: input3,
@@ -21814,19 +21935,19 @@ var ParameterInputInner = (0, import_react140.forwardRef)(
21814
21935
 
21815
21936
  // src/components/ParameterInputs/ParameterLink.tsx
21816
21937
  init_emotion_jsx_shim();
21817
- var import_react141 = require("react");
21818
- var import_jsx_runtime124 = require("@emotion/react/jsx-runtime");
21819
- var ParameterLink = (0, import_react141.forwardRef)(
21938
+ var import_react143 = require("react");
21939
+ var import_jsx_runtime125 = require("@emotion/react/jsx-runtime");
21940
+ var ParameterLink = (0, import_react143.forwardRef)(
21820
21941
  ({ disabled: disabled2, onConnectLink, externalLink, ...props }, ref) => {
21821
21942
  const { shellProps, innerProps } = extractParameterProps(props);
21822
- return /* @__PURE__ */ (0, import_jsx_runtime124.jsx)(
21943
+ return /* @__PURE__ */ (0, import_jsx_runtime125.jsx)(
21823
21944
  ParameterShell,
21824
21945
  {
21825
21946
  "data-testid": "link-parameter-editor",
21826
21947
  ...shellProps,
21827
21948
  label: innerProps.value ? shellProps.label : "",
21828
21949
  title: !innerProps.value ? shellProps.label : void 0,
21829
- children: /* @__PURE__ */ (0, import_jsx_runtime124.jsx)(
21950
+ children: /* @__PURE__ */ (0, import_jsx_runtime125.jsx)(
21830
21951
  ParameterLinkInner,
21831
21952
  {
21832
21953
  onConnectLink,
@@ -21839,13 +21960,13 @@ var ParameterLink = (0, import_react141.forwardRef)(
21839
21960
  );
21840
21961
  }
21841
21962
  );
21842
- var ParameterLinkInner = (0, import_react141.forwardRef)(
21963
+ var ParameterLinkInner = (0, import_react143.forwardRef)(
21843
21964
  ({ externalLink, onConnectLink, disabled: disabled2, buttonText = "Select link", ...props }, ref) => {
21844
21965
  const { id, label, hiddenLabel } = useParameterShell();
21845
21966
  if (!props.value)
21846
- return /* @__PURE__ */ (0, import_jsx_runtime124.jsx)("button", { type: "button", css: dataConnectButton, disabled: disabled2, onClick: onConnectLink, children: buttonText });
21847
- return /* @__PURE__ */ (0, import_jsx_runtime124.jsxs)("div", { css: inputWrapper, children: [
21848
- /* @__PURE__ */ (0, import_jsx_runtime124.jsx)(
21967
+ return /* @__PURE__ */ (0, import_jsx_runtime125.jsx)("button", { type: "button", css: dataConnectButton, disabled: disabled2, onClick: onConnectLink, children: buttonText });
21968
+ return /* @__PURE__ */ (0, import_jsx_runtime125.jsxs)("div", { css: inputWrapper, children: [
21969
+ /* @__PURE__ */ (0, import_jsx_runtime125.jsx)(
21849
21970
  "input",
21850
21971
  {
21851
21972
  type: "text",
@@ -21857,8 +21978,8 @@ var ParameterLinkInner = (0, import_react141.forwardRef)(
21857
21978
  ...props
21858
21979
  }
21859
21980
  ),
21860
- /* @__PURE__ */ (0, import_jsx_runtime124.jsxs)("div", { css: linkParameterControls, children: [
21861
- /* @__PURE__ */ (0, import_jsx_runtime124.jsx)(
21981
+ /* @__PURE__ */ (0, import_jsx_runtime125.jsxs)("div", { css: linkParameterControls, children: [
21982
+ /* @__PURE__ */ (0, import_jsx_runtime125.jsx)(
21862
21983
  "button",
21863
21984
  {
21864
21985
  type: "button",
@@ -21869,7 +21990,7 @@ var ParameterLinkInner = (0, import_react141.forwardRef)(
21869
21990
  children: "edit"
21870
21991
  }
21871
21992
  ),
21872
- externalLink ? /* @__PURE__ */ (0, import_jsx_runtime124.jsx)(
21993
+ externalLink ? /* @__PURE__ */ (0, import_jsx_runtime125.jsx)(
21873
21994
  "a",
21874
21995
  {
21875
21996
  href: externalLink,
@@ -21877,7 +21998,7 @@ var ParameterLinkInner = (0, import_react141.forwardRef)(
21877
21998
  title: "Open link in new tab",
21878
21999
  target: "_blank",
21879
22000
  rel: "noopener noreferrer",
21880
- children: /* @__PURE__ */ (0, import_jsx_runtime124.jsx)(Icon, { icon: "arrows-expand-up-right", iconColor: "currentColor", size: "1rem" })
22001
+ children: /* @__PURE__ */ (0, import_jsx_runtime125.jsx)(Icon, { icon: "arrows-expand-up-right", iconColor: "currentColor", size: "1rem" })
21881
22002
  }
21882
22003
  ) : null
21883
22004
  ] })
@@ -21887,15 +22008,15 @@ var ParameterLinkInner = (0, import_react141.forwardRef)(
21887
22008
 
21888
22009
  // src/components/ParameterInputs/ParameterMultiSelect.tsx
21889
22010
  init_emotion_jsx_shim();
21890
- var import_jsx_runtime125 = require("@emotion/react/jsx-runtime");
22011
+ var import_jsx_runtime126 = require("@emotion/react/jsx-runtime");
21891
22012
  var ParameterMultiSelect = ({ disabled: disabled2 = false, ...props }) => {
21892
22013
  const { shellProps, innerProps } = extractParameterProps(props);
21893
- return /* @__PURE__ */ (0, import_jsx_runtime125.jsx)(ParameterShell, { ...shellProps, children: /* @__PURE__ */ (0, import_jsx_runtime125.jsx)(ParameterMultiSelectInner, { isDisabled: disabled2, ...innerProps }) });
22014
+ return /* @__PURE__ */ (0, import_jsx_runtime126.jsx)(ParameterShell, { ...shellProps, children: /* @__PURE__ */ (0, import_jsx_runtime126.jsx)(ParameterMultiSelectInner, { isDisabled: disabled2, ...innerProps }) });
21894
22015
  };
21895
22016
  var ParameterMultiSelectInner = (props) => {
21896
22017
  var _a;
21897
22018
  const { id, label } = useParameterShell();
21898
- return /* @__PURE__ */ (0, import_jsx_runtime125.jsx)(
22019
+ return /* @__PURE__ */ (0, import_jsx_runtime126.jsx)(
21899
22020
  InputComboBox,
21900
22021
  {
21901
22022
  menuPortalTarget: document.body,
@@ -21946,7 +22067,7 @@ var ParameterMultiSelectInner = (props) => {
21946
22067
 
21947
22068
  // src/components/ParameterInputs/ParameterNameAndPublicIdInput.tsx
21948
22069
  init_emotion_jsx_shim();
21949
- var import_jsx_runtime126 = require("@emotion/react/jsx-runtime");
22070
+ var import_jsx_runtime127 = require("@emotion/react/jsx-runtime");
21950
22071
  var ParameterNameAndPublicIdInput = ({
21951
22072
  id,
21952
22073
  onBlur,
@@ -21972,8 +22093,8 @@ var ParameterNameAndPublicIdInput = ({
21972
22093
  navigator.clipboard.writeText(values[publicIdFieldName]);
21973
22094
  };
21974
22095
  autoFocus == null ? void 0 : autoFocus();
21975
- return /* @__PURE__ */ (0, import_jsx_runtime126.jsxs)(import_jsx_runtime126.Fragment, { children: [
21976
- /* @__PURE__ */ (0, import_jsx_runtime126.jsx)(
22096
+ return /* @__PURE__ */ (0, import_jsx_runtime127.jsxs)(import_jsx_runtime127.Fragment, { children: [
22097
+ /* @__PURE__ */ (0, import_jsx_runtime127.jsx)(
21977
22098
  ParameterInput,
21978
22099
  {
21979
22100
  id: nameIdField,
@@ -21992,7 +22113,7 @@ var ParameterNameAndPublicIdInput = ({
21992
22113
  value: values[nameIdField]
21993
22114
  }
21994
22115
  ),
21995
- /* @__PURE__ */ (0, import_jsx_runtime126.jsx)(
22116
+ /* @__PURE__ */ (0, import_jsx_runtime127.jsx)(
21996
22117
  ParameterInput,
21997
22118
  {
21998
22119
  id: publicIdFieldName,
@@ -22006,11 +22127,11 @@ var ParameterNameAndPublicIdInput = ({
22006
22127
  caption: !publicIdError ? publicIdCaption : void 0,
22007
22128
  placeholder: publicIdPlaceholderText,
22008
22129
  errorMessage: publicIdError,
22009
- menuItems: /* @__PURE__ */ (0, import_jsx_runtime126.jsx)(
22130
+ menuItems: /* @__PURE__ */ (0, import_jsx_runtime127.jsx)(
22010
22131
  MenuItem,
22011
22132
  {
22012
22133
  disabled: !values[publicIdFieldName],
22013
- icon: /* @__PURE__ */ (0, import_jsx_runtime126.jsx)(Icon, { icon: "path-trim", iconColor: "currentColor" }),
22134
+ icon: /* @__PURE__ */ (0, import_jsx_runtime127.jsx)(Icon, { icon: "path-trim", iconColor: "currentColor" }),
22014
22135
  onClick: handleCopyPidFieldValue,
22015
22136
  children: "Copy"
22016
22137
  }
@@ -22018,13 +22139,13 @@ var ParameterNameAndPublicIdInput = ({
22018
22139
  value: values[publicIdFieldName]
22019
22140
  }
22020
22141
  ),
22021
- (warnOverLength == null ? void 0 : warnOverLength.length) && values[publicIdFieldName].length > warnOverLength.length ? /* @__PURE__ */ (0, import_jsx_runtime126.jsx)(Callout, { type: "caution", children: warnOverLength.message }) : null
22142
+ (warnOverLength == null ? void 0 : warnOverLength.length) && values[publicIdFieldName].length > warnOverLength.length ? /* @__PURE__ */ (0, import_jsx_runtime127.jsx)(Callout, { type: "caution", children: warnOverLength.message }) : null
22022
22143
  ] });
22023
22144
  };
22024
22145
 
22025
22146
  // src/components/ParameterInputs/ParameterRichText.tsx
22026
22147
  init_emotion_jsx_shim();
22027
- var import_react148 = require("@emotion/react");
22148
+ var import_react150 = require("@emotion/react");
22028
22149
  var import_list3 = require("@lexical/list");
22029
22150
  var import_markdown = require("@lexical/markdown");
22030
22151
  var import_LexicalComposer = require("@lexical/react/LexicalComposer");
@@ -22131,7 +22252,7 @@ var getLabelForElement = (type) => {
22131
22252
  // src/components/ParameterInputs/ParameterRichText.tsx
22132
22253
  var import_fast_equals2 = require("fast-equals");
22133
22254
  var import_lexical6 = require("lexical");
22134
- var import_react149 = require("react");
22255
+ var import_react151 = require("react");
22135
22256
 
22136
22257
  // src/components/ParameterInputs/rich-text/CustomCodeNode.ts
22137
22258
  init_emotion_jsx_shim();
@@ -22152,13 +22273,13 @@ CustomCodeNode.importDOM = function() {
22152
22273
  // src/components/ParameterInputs/rich-text/DisableStylesPlugin.ts
22153
22274
  init_emotion_jsx_shim();
22154
22275
  var import_LexicalComposerContext = require("@lexical/react/LexicalComposerContext");
22155
- var import_utils3 = require("@lexical/utils");
22276
+ var import_utils5 = require("@lexical/utils");
22156
22277
  var import_lexical = require("lexical");
22157
- var import_react142 = require("react");
22278
+ var import_react144 = require("react");
22158
22279
  function DisableStylesPlugin() {
22159
22280
  const [editor] = (0, import_LexicalComposerContext.useLexicalComposerContext)();
22160
- (0, import_react142.useEffect)(() => {
22161
- return (0, import_utils3.mergeRegister)(
22281
+ (0, import_react144.useEffect)(() => {
22282
+ return (0, import_utils5.mergeRegister)(
22162
22283
  // Disable text alignment on paragraph nodes
22163
22284
  editor.registerNodeTransform(import_lexical.ParagraphNode, (node) => {
22164
22285
  if (node.getFormatType() !== "") {
@@ -22352,13 +22473,13 @@ var codeElement = import_css2.css`
22352
22473
 
22353
22474
  // src/components/ParameterInputs/rich-text/LinkNodePlugin.tsx
22354
22475
  init_emotion_jsx_shim();
22355
- var import_react143 = require("@emotion/react");
22476
+ var import_react145 = require("@emotion/react");
22356
22477
  var import_LexicalComposerContext2 = require("@lexical/react/LexicalComposerContext");
22357
22478
  var import_LexicalNodeEventPlugin = require("@lexical/react/LexicalNodeEventPlugin");
22358
- var import_utils4 = require("@lexical/utils");
22479
+ var import_utils6 = require("@lexical/utils");
22359
22480
  var import_fast_equals = require("fast-equals");
22360
22481
  var import_lexical3 = require("lexical");
22361
- var import_react144 = require("react");
22482
+ var import_react146 = require("react");
22362
22483
 
22363
22484
  // src/components/ParameterInputs/rich-text/utils.ts
22364
22485
  init_emotion_jsx_shim();
@@ -22396,7 +22517,7 @@ var getSelectedNode = (selection) => {
22396
22517
  };
22397
22518
 
22398
22519
  // src/components/ParameterInputs/rich-text/LinkNodePlugin.tsx
22399
- var import_jsx_runtime127 = require("@emotion/react/jsx-runtime");
22520
+ var import_jsx_runtime128 = require("@emotion/react/jsx-runtime");
22400
22521
  var isProjectMapLinkValue = (value) => {
22401
22522
  return (value == null ? void 0 : value.type) === "projectMapNode" && Boolean(
22402
22523
  value.nodeId && value.path && value.projectMapId
@@ -22419,7 +22540,7 @@ var guessLinkTypeFromPath = (path) => {
22419
22540
  };
22420
22541
  function convertAnchorElement(domNode) {
22421
22542
  let node = null;
22422
- if (!(0, import_utils4.isHTMLAnchorElement)(domNode)) {
22543
+ if (!(0, import_utils6.isHTMLAnchorElement)(domNode)) {
22423
22544
  return { node };
22424
22545
  }
22425
22546
  const textContent = domNode.textContent;
@@ -22528,7 +22649,7 @@ var LinkNode = class _LinkNode extends import_lexical3.ElementNode {
22528
22649
  element.setAttribute("href", `mailto:${this.__link.path}`);
22529
22650
  }
22530
22651
  }
22531
- (0, import_utils4.addClassNamesToElement)(element, config.theme.link);
22652
+ (0, import_utils6.addClassNamesToElement)(element, config.theme.link);
22532
22653
  return element;
22533
22654
  }
22534
22655
  updateDOM(prevNode, a) {
@@ -22683,16 +22804,16 @@ var OPEN_LINK_NODE_MODAL_COMMAND = (0, import_lexical3.createCommand)(
22683
22804
  );
22684
22805
  var LINK_POPOVER_OFFSET_X = 0;
22685
22806
  var LINK_POPOVER_OFFSET_Y = 8;
22686
- var linkPopover = import_react143.css`
22807
+ var linkPopover = import_react145.css`
22687
22808
  position: absolute;
22688
22809
  z-index: 5;
22689
22810
  `;
22690
- var linkPopoverContainer = import_react143.css`
22811
+ var linkPopoverContainer = import_react145.css`
22691
22812
  ${Popover()};
22692
22813
  align-items: center;
22693
22814
  display: flex;
22694
22815
  `;
22695
- var linkPopoverAnchor = import_react143.css`
22816
+ var linkPopoverAnchor = import_react145.css`
22696
22817
  ${link}
22697
22818
  ${linkColorDefault}
22698
22819
  `;
@@ -22701,21 +22822,21 @@ function LinkNodePlugin({ onConnectLink, getBoundPath }) {
22701
22822
  return path;
22702
22823
  };
22703
22824
  const [editor] = (0, import_LexicalComposerContext2.useLexicalComposerContext)();
22704
- const [linkPopoverState, setLinkPopoverState] = (0, import_react144.useState)();
22705
- const linkPopoverElRef = (0, import_react144.useRef)(null);
22706
- const [isEditorFocused, setIsEditorFocused] = (0, import_react144.useState)(false);
22707
- const [isLinkPopoverFocused, setIsLinkPopoverFocused] = (0, import_react144.useState)(false);
22708
- (0, import_react144.useEffect)(() => {
22825
+ const [linkPopoverState, setLinkPopoverState] = (0, import_react146.useState)();
22826
+ const linkPopoverElRef = (0, import_react146.useRef)(null);
22827
+ const [isEditorFocused, setIsEditorFocused] = (0, import_react146.useState)(false);
22828
+ const [isLinkPopoverFocused, setIsLinkPopoverFocused] = (0, import_react146.useState)(false);
22829
+ (0, import_react146.useEffect)(() => {
22709
22830
  if (!isEditorFocused && !isLinkPopoverFocused) {
22710
22831
  setLinkPopoverState(void 0);
22711
22832
  return;
22712
22833
  }
22713
22834
  }, [isEditorFocused, isLinkPopoverFocused]);
22714
- (0, import_react144.useEffect)(() => {
22835
+ (0, import_react146.useEffect)(() => {
22715
22836
  if (!editor.hasNodes([LinkNode])) {
22716
22837
  throw new Error("LinkNode not registered on editor");
22717
22838
  }
22718
- return (0, import_utils4.mergeRegister)(
22839
+ return (0, import_utils6.mergeRegister)(
22719
22840
  editor.registerCommand(
22720
22841
  UPSERT_LINK_NODE_COMMAND,
22721
22842
  (payload) => {
@@ -22780,7 +22901,7 @@ function LinkNodePlugin({ onConnectLink, getBoundPath }) {
22780
22901
  )
22781
22902
  );
22782
22903
  }, [editor, onConnectLink]);
22783
- const maybeShowLinkToolbar = (0, import_react144.useCallback)(() => {
22904
+ const maybeShowLinkToolbar = (0, import_react146.useCallback)(() => {
22784
22905
  if (!editor.isEditable()) {
22785
22906
  return;
22786
22907
  }
@@ -22812,7 +22933,7 @@ function LinkNodePlugin({ onConnectLink, getBoundPath }) {
22812
22933
  }
22813
22934
  });
22814
22935
  }, [editor]);
22815
- (0, import_react144.useEffect)(() => {
22936
+ (0, import_react146.useEffect)(() => {
22816
22937
  return editor.registerUpdateListener(({ editorState }) => {
22817
22938
  requestAnimationFrame(() => {
22818
22939
  editorState.read(() => {
@@ -22839,8 +22960,8 @@ function LinkNodePlugin({ onConnectLink, getBoundPath }) {
22839
22960
  });
22840
22961
  });
22841
22962
  };
22842
- return /* @__PURE__ */ (0, import_jsx_runtime127.jsxs)(import_jsx_runtime127.Fragment, { children: [
22843
- /* @__PURE__ */ (0, import_jsx_runtime127.jsx)(
22963
+ return /* @__PURE__ */ (0, import_jsx_runtime128.jsxs)(import_jsx_runtime128.Fragment, { children: [
22964
+ /* @__PURE__ */ (0, import_jsx_runtime128.jsx)(
22844
22965
  import_LexicalNodeEventPlugin.NodeEventPlugin,
22845
22966
  {
22846
22967
  nodeType: LinkNode,
@@ -22850,7 +22971,7 @@ function LinkNodePlugin({ onConnectLink, getBoundPath }) {
22850
22971
  }
22851
22972
  }
22852
22973
  ),
22853
- linkPopoverState ? /* @__PURE__ */ (0, import_jsx_runtime127.jsx)(
22974
+ linkPopoverState ? /* @__PURE__ */ (0, import_jsx_runtime128.jsx)(
22854
22975
  "div",
22855
22976
  {
22856
22977
  css: linkPopover,
@@ -22859,8 +22980,8 @@ function LinkNodePlugin({ onConnectLink, getBoundPath }) {
22859
22980
  top: linkPopoverState.position.y
22860
22981
  },
22861
22982
  ref: linkPopoverElRef,
22862
- children: /* @__PURE__ */ (0, import_jsx_runtime127.jsxs)("div", { css: linkPopoverContainer, children: [
22863
- linkPopoverState.node.__link.type === "projectMapNode" ? linkPopoverState.node.__link.path : /* @__PURE__ */ (0, import_jsx_runtime127.jsx)(
22983
+ children: /* @__PURE__ */ (0, import_jsx_runtime128.jsxs)("div", { css: linkPopoverContainer, children: [
22984
+ linkPopoverState.node.__link.type === "projectMapNode" ? linkPopoverState.node.__link.path : /* @__PURE__ */ (0, import_jsx_runtime128.jsx)(
22864
22985
  "a",
22865
22986
  {
22866
22987
  href: parsePath(
@@ -22872,7 +22993,7 @@ function LinkNodePlugin({ onConnectLink, getBoundPath }) {
22872
22993
  children: parsePath(linkPopoverState.node.__link.path)
22873
22994
  }
22874
22995
  ),
22875
- /* @__PURE__ */ (0, import_jsx_runtime127.jsx)(
22996
+ /* @__PURE__ */ (0, import_jsx_runtime128.jsx)(
22876
22997
  Button,
22877
22998
  {
22878
22999
  size: "xs",
@@ -22880,7 +23001,7 @@ function LinkNodePlugin({ onConnectLink, getBoundPath }) {
22880
23001
  onEditLinkNode(linkPopoverState.node);
22881
23002
  },
22882
23003
  buttonType: "ghost",
22883
- children: /* @__PURE__ */ (0, import_jsx_runtime127.jsx)(Icon, { icon: "pen", size: "1rem", title: "Edit link" })
23004
+ children: /* @__PURE__ */ (0, import_jsx_runtime128.jsx)(Icon, { icon: "pen", size: "1rem", title: "Edit link" })
22884
23005
  }
22885
23006
  )
22886
23007
  ] })
@@ -22900,8 +23021,8 @@ var import_list = require("@lexical/list");
22900
23021
  var import_LexicalComposerContext3 = require("@lexical/react/LexicalComposerContext");
22901
23022
  var import_LexicalTabIndentationPlugin = require("@lexical/react/LexicalTabIndentationPlugin");
22902
23023
  var import_lexical4 = require("lexical");
22903
- var import_react145 = require("react");
22904
- var import_jsx_runtime128 = require("@emotion/react/jsx-runtime");
23024
+ var import_react147 = require("react");
23025
+ var import_jsx_runtime129 = require("@emotion/react/jsx-runtime");
22905
23026
  function isIndentPermitted(maxDepth) {
22906
23027
  const selection = (0, import_lexical4.$getSelection)();
22907
23028
  if (!(0, import_lexical4.$isRangeSelection)(selection)) {
@@ -22924,29 +23045,29 @@ function isIndentPermitted(maxDepth) {
22924
23045
  }
22925
23046
  function ListIndentPlugin({ maxDepth }) {
22926
23047
  const [editor] = (0, import_LexicalComposerContext3.useLexicalComposerContext)();
22927
- (0, import_react145.useEffect)(() => {
23048
+ (0, import_react147.useEffect)(() => {
22928
23049
  return editor.registerCommand(
22929
23050
  import_lexical4.INDENT_CONTENT_COMMAND,
22930
23051
  () => !isIndentPermitted(maxDepth),
22931
23052
  import_lexical4.COMMAND_PRIORITY_CRITICAL
22932
23053
  );
22933
23054
  }, [editor, maxDepth]);
22934
- return /* @__PURE__ */ (0, import_jsx_runtime128.jsx)(import_LexicalTabIndentationPlugin.TabIndentationPlugin, {});
23055
+ return /* @__PURE__ */ (0, import_jsx_runtime129.jsx)(import_LexicalTabIndentationPlugin.TabIndentationPlugin, {});
22935
23056
  }
22936
23057
 
22937
23058
  // src/components/ParameterInputs/rich-text/RichTextToolbar.tsx
22938
23059
  init_emotion_jsx_shim();
22939
- var import_react146 = require("@emotion/react");
23060
+ var import_react148 = require("@emotion/react");
22940
23061
  var import_code2 = require("@lexical/code");
22941
23062
  var import_list2 = require("@lexical/list");
22942
23063
  var import_LexicalComposerContext4 = require("@lexical/react/LexicalComposerContext");
22943
23064
  var import_rich_text = require("@lexical/rich-text");
22944
23065
  var import_selection2 = require("@lexical/selection");
22945
- var import_utils7 = require("@lexical/utils");
23066
+ var import_utils9 = require("@lexical/utils");
22946
23067
  var import_lexical5 = require("lexical");
22947
- var import_react147 = require("react");
22948
- var import_jsx_runtime129 = require("@emotion/react/jsx-runtime");
22949
- var toolbar = import_react146.css`
23068
+ var import_react149 = require("react");
23069
+ var import_jsx_runtime130 = require("@emotion/react/jsx-runtime");
23070
+ var toolbar = import_react148.css`
22950
23071
  background: var(--gray-50);
22951
23072
  border-radius: var(--rounded-base);
22952
23073
  display: flex;
@@ -22958,7 +23079,7 @@ var toolbar = import_react146.css`
22958
23079
  top: calc(var(--spacing-sm) * -2);
22959
23080
  z-index: 10;
22960
23081
  `;
22961
- var toolbarGroup = import_react146.css`
23082
+ var toolbarGroup = import_react148.css`
22962
23083
  display: flex;
22963
23084
  gap: var(--spacing-xs);
22964
23085
  position: relative;
@@ -22974,7 +23095,7 @@ var toolbarGroup = import_react146.css`
22974
23095
  width: 1px;
22975
23096
  }
22976
23097
  `;
22977
- var richTextToolbarButton = import_react146.css`
23098
+ var richTextToolbarButton = import_react148.css`
22978
23099
  align-items: center;
22979
23100
  appearance: none;
22980
23101
  border: 0;
@@ -22987,17 +23108,17 @@ var richTextToolbarButton = import_react146.css`
22987
23108
  min-width: 32px;
22988
23109
  padding: 0 var(--spacing-sm);
22989
23110
  `;
22990
- var richTextToolbarButtonActive = import_react146.css`
23111
+ var richTextToolbarButtonActive = import_react148.css`
22991
23112
  background: var(--gray-200);
22992
23113
  `;
22993
- var toolbarIcon = import_react146.css`
23114
+ var toolbarIcon = import_react148.css`
22994
23115
  color: inherit;
22995
23116
  `;
22996
- var toolbarChevron = import_react146.css`
23117
+ var toolbarChevron = import_react148.css`
22997
23118
  margin-left: var(--spacing-xs);
22998
23119
  `;
22999
23120
  var RichTextToolbarIcon = ({ icon }) => {
23000
- return /* @__PURE__ */ (0, import_jsx_runtime129.jsx)(Icon, { icon, css: toolbarIcon, size: "1rem" });
23121
+ return /* @__PURE__ */ (0, import_jsx_runtime130.jsx)(Icon, { icon, css: toolbarIcon, size: "1rem" });
23001
23122
  };
23002
23123
  var FORMATS_WITH_ICON = /* @__PURE__ */ new Map([
23003
23124
  ["bold", "format-bold"],
@@ -23048,7 +23169,7 @@ var RichTextToolbar = ({ config, customControls }) => {
23048
23169
  }
23049
23170
  });
23050
23171
  };
23051
- const updateToolbar = (0, import_react147.useCallback)(() => {
23172
+ const updateToolbar = (0, import_react149.useCallback)(() => {
23052
23173
  const selection = (0, import_lexical5.$getSelection)();
23053
23174
  if (!(0, import_lexical5.$isRangeSelection)(selection)) {
23054
23175
  return;
@@ -23061,7 +23182,7 @@ var RichTextToolbar = ({ config, customControls }) => {
23061
23182
  }
23062
23183
  setActiveFormats(newActiveFormats);
23063
23184
  const anchorNode = selection.anchor.getNode();
23064
- let element = anchorNode.getKey() === "root" ? anchorNode : (0, import_utils7.$findMatchingParent)(anchorNode, (e) => {
23185
+ let element = anchorNode.getKey() === "root" ? anchorNode : (0, import_utils9.$findMatchingParent)(anchorNode, (e) => {
23065
23186
  const parent = e.getParent();
23066
23187
  return parent !== null && (0, import_lexical5.$isRootOrShadowRoot)(parent);
23067
23188
  });
@@ -23072,7 +23193,7 @@ var RichTextToolbar = ({ config, customControls }) => {
23072
23193
  const elementDOM = editor.getElementByKey(elementKey);
23073
23194
  if (elementDOM !== null) {
23074
23195
  if ((0, import_list2.$isListNode)(element)) {
23075
- const parentList = (0, import_utils7.$getNearestNodeOfType)(anchorNode, import_list2.ListNode);
23196
+ const parentList = (0, import_utils9.$getNearestNodeOfType)(anchorNode, import_list2.ListNode);
23076
23197
  const type = parentList ? parentList.getListType() : element.getListType();
23077
23198
  setActiveElement(type === "bullet" ? "unorderedList" : "orderedList");
23078
23199
  } else {
@@ -23087,7 +23208,7 @@ var RichTextToolbar = ({ config, customControls }) => {
23087
23208
  setIsLink(false);
23088
23209
  }
23089
23210
  }, [editor, setActiveElement, setActiveFormats, setIsLink]);
23090
- (0, import_react147.useEffect)(() => {
23211
+ (0, import_react149.useEffect)(() => {
23091
23212
  return editor.registerCommand(
23092
23213
  import_lexical5.SELECTION_CHANGE_COMMAND,
23093
23214
  (_payload) => {
@@ -23097,7 +23218,7 @@ var RichTextToolbar = ({ config, customControls }) => {
23097
23218
  import_lexical5.COMMAND_PRIORITY_CRITICAL
23098
23219
  );
23099
23220
  }, [editor, updateToolbar]);
23100
- (0, import_react147.useEffect)(() => {
23221
+ (0, import_react149.useEffect)(() => {
23101
23222
  return editor.registerUpdateListener(({ editorState }) => {
23102
23223
  requestAnimationFrame(() => {
23103
23224
  editorState.read(() => {
@@ -23106,15 +23227,15 @@ var RichTextToolbar = ({ config, customControls }) => {
23106
23227
  });
23107
23228
  });
23108
23229
  }, [editor, updateToolbar]);
23109
- return /* @__PURE__ */ (0, import_jsx_runtime129.jsxs)("div", { css: toolbar, children: [
23110
- /* @__PURE__ */ (0, import_jsx_runtime129.jsxs)(
23230
+ return /* @__PURE__ */ (0, import_jsx_runtime130.jsxs)("div", { css: toolbar, children: [
23231
+ /* @__PURE__ */ (0, import_jsx_runtime130.jsxs)(
23111
23232
  Menu,
23112
23233
  {
23113
23234
  menuLabel: "Elements",
23114
- menuTrigger: /* @__PURE__ */ (0, import_jsx_runtime129.jsxs)("button", { css: richTextToolbarButton, title: "Text styles", children: [
23235
+ menuTrigger: /* @__PURE__ */ (0, import_jsx_runtime130.jsxs)("button", { css: richTextToolbarButton, title: "Text styles", children: [
23115
23236
  visibleTextualElements.some((element) => element.type === activeElement) ? getLabelForElement(activeElement) : getLabelForElement("paragraph"),
23116
23237
  " ",
23117
- /* @__PURE__ */ (0, import_jsx_runtime129.jsx)(Icon, { icon: "chevron-down", css: [toolbarIcon, toolbarChevron], size: "1rem" })
23238
+ /* @__PURE__ */ (0, import_jsx_runtime130.jsx)(Icon, { icon: "chevron-down", css: [toolbarIcon, toolbarChevron], size: "1rem" })
23118
23239
  ] }),
23119
23240
  placement: "bottom-start",
23120
23241
  children: [
@@ -23124,7 +23245,7 @@ var RichTextToolbar = ({ config, customControls }) => {
23124
23245
  type: "paragraph"
23125
23246
  },
23126
23247
  ...visibleTextualElements
23127
- ].map((element) => /* @__PURE__ */ (0, import_jsx_runtime129.jsx)(
23248
+ ].map((element) => /* @__PURE__ */ (0, import_jsx_runtime130.jsx)(
23128
23249
  MenuItem,
23129
23250
  {
23130
23251
  onClick: () => {
@@ -23134,12 +23255,12 @@ var RichTextToolbar = ({ config, customControls }) => {
23134
23255
  },
23135
23256
  element.type
23136
23257
  )),
23137
- visibleTextualElements.length === 0 ? /* @__PURE__ */ (0, import_jsx_runtime129.jsx)(MenuItem, { disabled: true, children: "Alternative text styles are not available" }) : null
23258
+ visibleTextualElements.length === 0 ? /* @__PURE__ */ (0, import_jsx_runtime130.jsx)(MenuItem, { disabled: true, children: "Alternative text styles are not available" }) : null
23138
23259
  ]
23139
23260
  }
23140
23261
  ),
23141
- visibleFormatsWithIcon.length > 0 || visibleFormatsWithoutIcon.length > 0 ? /* @__PURE__ */ (0, import_jsx_runtime129.jsxs)("div", { css: toolbarGroup, children: [
23142
- visibleFormatsWithIcon.map((format) => /* @__PURE__ */ (0, import_jsx_runtime129.jsx)(Tooltip, { title: format.label, placement: "top", children: /* @__PURE__ */ (0, import_jsx_runtime129.jsx)(
23262
+ visibleFormatsWithIcon.length > 0 || visibleFormatsWithoutIcon.length > 0 ? /* @__PURE__ */ (0, import_jsx_runtime130.jsxs)("div", { css: toolbarGroup, children: [
23263
+ visibleFormatsWithIcon.map((format) => /* @__PURE__ */ (0, import_jsx_runtime130.jsx)(Tooltip, { title: format.label, placement: "top", children: /* @__PURE__ */ (0, import_jsx_runtime130.jsx)(
23143
23264
  "button",
23144
23265
  {
23145
23266
  onClick: () => {
@@ -23149,16 +23270,16 @@ var RichTextToolbar = ({ config, customControls }) => {
23149
23270
  richTextToolbarButton,
23150
23271
  activeFormats.includes(format.type) ? richTextToolbarButtonActive : null
23151
23272
  ],
23152
- children: /* @__PURE__ */ (0, import_jsx_runtime129.jsx)(RichTextToolbarIcon, { icon: FORMATS_WITH_ICON.get(format.type) })
23273
+ children: /* @__PURE__ */ (0, import_jsx_runtime130.jsx)(RichTextToolbarIcon, { icon: FORMATS_WITH_ICON.get(format.type) })
23153
23274
  }
23154
23275
  ) }, format.type)),
23155
- visibleFormatsWithoutIcon.length > 0 ? /* @__PURE__ */ (0, import_jsx_runtime129.jsx)(
23276
+ visibleFormatsWithoutIcon.length > 0 ? /* @__PURE__ */ (0, import_jsx_runtime130.jsx)(
23156
23277
  Menu,
23157
23278
  {
23158
23279
  menuLabel: "Alternative text styles",
23159
- menuTrigger: /* @__PURE__ */ (0, import_jsx_runtime129.jsx)("button", { css: richTextToolbarButton, title: "Alternative text styles", children: /* @__PURE__ */ (0, import_jsx_runtime129.jsx)(Icon, { icon: "more-alt", css: toolbarIcon }) }),
23280
+ menuTrigger: /* @__PURE__ */ (0, import_jsx_runtime130.jsx)("button", { css: richTextToolbarButton, title: "Alternative text styles", children: /* @__PURE__ */ (0, import_jsx_runtime130.jsx)(Icon, { icon: "more-alt", css: toolbarIcon }) }),
23160
23281
  placement: "bottom-start",
23161
- children: visibleFormatsWithoutIcon.map((format) => /* @__PURE__ */ (0, import_jsx_runtime129.jsx)(
23282
+ children: visibleFormatsWithoutIcon.map((format) => /* @__PURE__ */ (0, import_jsx_runtime130.jsx)(
23162
23283
  MenuItem,
23163
23284
  {
23164
23285
  onClick: () => {
@@ -23171,19 +23292,19 @@ var RichTextToolbar = ({ config, customControls }) => {
23171
23292
  }
23172
23293
  ) : null
23173
23294
  ] }) : null,
23174
- visibleElementsWithIcons.size > 0 ? /* @__PURE__ */ (0, import_jsx_runtime129.jsxs)("div", { css: toolbarGroup, children: [
23175
- linkElementVisible ? /* @__PURE__ */ (0, import_jsx_runtime129.jsx)(Tooltip, { title: "Link", placement: "top", children: /* @__PURE__ */ (0, import_jsx_runtime129.jsx)(
23295
+ visibleElementsWithIcons.size > 0 ? /* @__PURE__ */ (0, import_jsx_runtime130.jsxs)("div", { css: toolbarGroup, children: [
23296
+ linkElementVisible ? /* @__PURE__ */ (0, import_jsx_runtime130.jsx)(Tooltip, { title: "Link", placement: "top", children: /* @__PURE__ */ (0, import_jsx_runtime130.jsx)(
23176
23297
  "button",
23177
23298
  {
23178
23299
  onClick: () => {
23179
23300
  isLink ? editor.dispatchCommand(REMOVE_LINK_NODE_COMMAND, {}) : editor.dispatchCommand(OPEN_LINK_NODE_MODAL_COMMAND, {});
23180
23301
  },
23181
23302
  css: [richTextToolbarButton, isLink ? richTextToolbarButtonActive : null],
23182
- children: /* @__PURE__ */ (0, import_jsx_runtime129.jsx)(RichTextToolbarIcon, { icon: "link" })
23303
+ children: /* @__PURE__ */ (0, import_jsx_runtime130.jsx)(RichTextToolbarIcon, { icon: "link" })
23183
23304
  }
23184
23305
  ) }) : null,
23185
- visibleLists.size > 0 ? /* @__PURE__ */ (0, import_jsx_runtime129.jsxs)(import_jsx_runtime129.Fragment, { children: [
23186
- visibleLists.has("unorderedList") ? /* @__PURE__ */ (0, import_jsx_runtime129.jsx)(Tooltip, { title: "Bullet List", placement: "top", children: /* @__PURE__ */ (0, import_jsx_runtime129.jsx)(
23306
+ visibleLists.size > 0 ? /* @__PURE__ */ (0, import_jsx_runtime130.jsxs)(import_jsx_runtime130.Fragment, { children: [
23307
+ visibleLists.has("unorderedList") ? /* @__PURE__ */ (0, import_jsx_runtime130.jsx)(Tooltip, { title: "Bullet List", placement: "top", children: /* @__PURE__ */ (0, import_jsx_runtime130.jsx)(
23187
23308
  "button",
23188
23309
  {
23189
23310
  onClick: () => {
@@ -23193,10 +23314,10 @@ var RichTextToolbar = ({ config, customControls }) => {
23193
23314
  richTextToolbarButton,
23194
23315
  activeElement === "unorderedList" ? richTextToolbarButtonActive : null
23195
23316
  ],
23196
- children: /* @__PURE__ */ (0, import_jsx_runtime129.jsx)(RichTextToolbarIcon, { icon: "layout-list" })
23317
+ children: /* @__PURE__ */ (0, import_jsx_runtime130.jsx)(RichTextToolbarIcon, { icon: "layout-list" })
23197
23318
  }
23198
23319
  ) }) : null,
23199
- visibleLists.has("orderedList") ? /* @__PURE__ */ (0, import_jsx_runtime129.jsx)(Tooltip, { title: "Ordered List", placement: "top", children: /* @__PURE__ */ (0, import_jsx_runtime129.jsx)(
23320
+ visibleLists.has("orderedList") ? /* @__PURE__ */ (0, import_jsx_runtime130.jsx)(Tooltip, { title: "Ordered List", placement: "top", children: /* @__PURE__ */ (0, import_jsx_runtime130.jsx)(
23200
23321
  "button",
23201
23322
  {
23202
23323
  onClick: () => {
@@ -23206,57 +23327,57 @@ var RichTextToolbar = ({ config, customControls }) => {
23206
23327
  richTextToolbarButton,
23207
23328
  activeElement === "orderedList" ? richTextToolbarButtonActive : null
23208
23329
  ],
23209
- children: /* @__PURE__ */ (0, import_jsx_runtime129.jsx)(RichTextToolbarIcon, { icon: "layout-list-numbered" })
23330
+ children: /* @__PURE__ */ (0, import_jsx_runtime130.jsx)(RichTextToolbarIcon, { icon: "layout-list-numbered" })
23210
23331
  }
23211
23332
  ) }) : null
23212
23333
  ] }) : null,
23213
- quoteElementVisible ? /* @__PURE__ */ (0, import_jsx_runtime129.jsx)(Tooltip, { title: "Blockquote", placement: "top", children: /* @__PURE__ */ (0, import_jsx_runtime129.jsx)(
23334
+ quoteElementVisible ? /* @__PURE__ */ (0, import_jsx_runtime130.jsx)(Tooltip, { title: "Blockquote", placement: "top", children: /* @__PURE__ */ (0, import_jsx_runtime130.jsx)(
23214
23335
  "button",
23215
23336
  {
23216
23337
  onClick: () => {
23217
23338
  activeElement === "quote" ? onSelectElement("paragraph") : onSelectElement("quote");
23218
23339
  },
23219
23340
  css: [richTextToolbarButton, activeElement === "quote" ? richTextToolbarButtonActive : null],
23220
- children: /* @__PURE__ */ (0, import_jsx_runtime129.jsx)(RichTextToolbarIcon, { icon: "quote" })
23341
+ children: /* @__PURE__ */ (0, import_jsx_runtime130.jsx)(RichTextToolbarIcon, { icon: "quote" })
23221
23342
  }
23222
23343
  ) }) : null,
23223
- codeElementVisible ? /* @__PURE__ */ (0, import_jsx_runtime129.jsx)(Tooltip, { title: "Code Block", placement: "top", children: /* @__PURE__ */ (0, import_jsx_runtime129.jsx)(
23344
+ codeElementVisible ? /* @__PURE__ */ (0, import_jsx_runtime130.jsx)(Tooltip, { title: "Code Block", placement: "top", children: /* @__PURE__ */ (0, import_jsx_runtime130.jsx)(
23224
23345
  "button",
23225
23346
  {
23226
23347
  onClick: () => {
23227
23348
  activeElement === "code" ? onSelectElement("paragraph") : onSelectElement("code");
23228
23349
  },
23229
23350
  css: [richTextToolbarButton, activeElement === "code" ? richTextToolbarButtonActive : null],
23230
- children: /* @__PURE__ */ (0, import_jsx_runtime129.jsx)(RichTextToolbarIcon, { icon: "code-slash" })
23351
+ children: /* @__PURE__ */ (0, import_jsx_runtime130.jsx)(RichTextToolbarIcon, { icon: "code-slash" })
23231
23352
  }
23232
23353
  ) }) : null
23233
23354
  ] }) : null,
23234
- customControls ? /* @__PURE__ */ (0, import_jsx_runtime129.jsx)("div", { css: toolbarGroup, children: customControls }) : null
23355
+ customControls ? /* @__PURE__ */ (0, import_jsx_runtime130.jsx)("div", { css: toolbarGroup, children: customControls }) : null
23235
23356
  ] });
23236
23357
  };
23237
23358
  var RichTextToolbar_default = RichTextToolbar;
23238
23359
  var useRichTextToolbarState = ({ config }) => {
23239
23360
  var _a;
23240
- const enabledBuiltInFormats = (0, import_react147.useMemo)(() => {
23361
+ const enabledBuiltInFormats = (0, import_react149.useMemo)(() => {
23241
23362
  return richTextBuiltInFormats.filter((format) => {
23242
23363
  var _a2, _b;
23243
23364
  return (_b = (_a2 = config == null ? void 0 : config.formatting) == null ? void 0 : _a2.builtIn) == null ? void 0 : _b.includes(format.type);
23244
23365
  });
23245
23366
  }, [config]);
23246
- const enabledBuiltInElements = (0, import_react147.useMemo)(() => {
23367
+ const enabledBuiltInElements = (0, import_react149.useMemo)(() => {
23247
23368
  return richTextBuiltInElements.filter((element) => {
23248
23369
  var _a2, _b;
23249
23370
  return (_b = (_a2 = config == null ? void 0 : config.elements) == null ? void 0 : _a2.builtIn) == null ? void 0 : _b.includes(element.type);
23250
23371
  });
23251
23372
  }, [config]);
23252
- const enabledBuiltInFormatsWithIcon = (0, import_react147.useMemo)(() => {
23373
+ const enabledBuiltInFormatsWithIcon = (0, import_react149.useMemo)(() => {
23253
23374
  return enabledBuiltInFormats.filter((format) => FORMATS_WITH_ICON.has(format.type));
23254
23375
  }, [enabledBuiltInFormats]);
23255
23376
  const enabledBuiltInFormatsWithoutIcon = enabledBuiltInFormats.filter(
23256
23377
  (format) => !FORMATS_WITH_ICON.has(format.type)
23257
23378
  );
23258
- const [activeFormats, setActiveFormats] = (0, import_react147.useState)([]);
23259
- const visibleFormatsWithIcon = (0, import_react147.useMemo)(() => {
23379
+ const [activeFormats, setActiveFormats] = (0, import_react149.useState)([]);
23380
+ const visibleFormatsWithIcon = (0, import_react149.useMemo)(() => {
23260
23381
  const visibleFormats = /* @__PURE__ */ new Set();
23261
23382
  activeFormats.filter((type) => FORMATS_WITH_ICON.has(type)).forEach((type) => {
23262
23383
  visibleFormats.add(type);
@@ -23266,7 +23387,7 @@ var useRichTextToolbarState = ({ config }) => {
23266
23387
  });
23267
23388
  return richTextBuiltInFormats.filter((format) => visibleFormats.has(format.type));
23268
23389
  }, [activeFormats, enabledBuiltInFormatsWithIcon]);
23269
- const visibleFormatsWithoutIcon = (0, import_react147.useMemo)(() => {
23390
+ const visibleFormatsWithoutIcon = (0, import_react149.useMemo)(() => {
23270
23391
  const visibleFormats = /* @__PURE__ */ new Set();
23271
23392
  activeFormats.filter((type) => !FORMATS_WITH_ICON.has(type)).forEach((type) => {
23272
23393
  visibleFormats.add(type);
@@ -23276,11 +23397,11 @@ var useRichTextToolbarState = ({ config }) => {
23276
23397
  });
23277
23398
  return richTextBuiltInFormats.filter((format) => visibleFormats.has(format.type));
23278
23399
  }, [activeFormats, enabledBuiltInFormatsWithoutIcon]);
23279
- const [activeElement, setActiveElement] = (0, import_react147.useState)("paragraph");
23400
+ const [activeElement, setActiveElement] = (0, import_react149.useState)("paragraph");
23280
23401
  const enabledTextualElements = enabledBuiltInElements.filter(
23281
23402
  (element) => TEXTUAL_ELEMENTS.includes(element.type)
23282
23403
  );
23283
- const visibleTextualElements = (0, import_react147.useMemo)(() => {
23404
+ const visibleTextualElements = (0, import_react149.useMemo)(() => {
23284
23405
  if (!TEXTUAL_ELEMENTS.includes(activeElement)) {
23285
23406
  return enabledTextualElements;
23286
23407
  }
@@ -23291,24 +23412,24 @@ var useRichTextToolbarState = ({ config }) => {
23291
23412
  }
23292
23413
  );
23293
23414
  }, [activeElement, (_a = config == null ? void 0 : config.elements) == null ? void 0 : _a.builtIn, enabledTextualElements]);
23294
- const [isLink, setIsLink] = (0, import_react147.useState)(false);
23295
- const linkElementVisible = (0, import_react147.useMemo)(() => {
23415
+ const [isLink, setIsLink] = (0, import_react149.useState)(false);
23416
+ const linkElementVisible = (0, import_react149.useMemo)(() => {
23296
23417
  return enabledBuiltInElements.some((element) => element.type === "link") || isLink;
23297
23418
  }, [isLink, enabledBuiltInElements]);
23298
- const visibleLists = (0, import_react147.useMemo)(() => {
23419
+ const visibleLists = (0, import_react149.useMemo)(() => {
23299
23420
  return new Set(
23300
23421
  ["orderedList", "unorderedList"].filter(
23301
23422
  (type) => enabledBuiltInElements.some((element) => element.type === type) || activeElement === type
23302
23423
  )
23303
23424
  );
23304
23425
  }, [activeElement, enabledBuiltInElements]);
23305
- const quoteElementVisible = (0, import_react147.useMemo)(() => {
23426
+ const quoteElementVisible = (0, import_react149.useMemo)(() => {
23306
23427
  return enabledBuiltInElements.some((element) => element.type === "quote") || activeElement === "quote";
23307
23428
  }, [activeElement, enabledBuiltInElements]);
23308
- const codeElementVisible = (0, import_react147.useMemo)(() => {
23429
+ const codeElementVisible = (0, import_react149.useMemo)(() => {
23309
23430
  return enabledBuiltInElements.some((element) => element.type === "code") || activeElement === "code";
23310
23431
  }, [activeElement, enabledBuiltInElements]);
23311
- const visibleElementsWithIcons = (0, import_react147.useMemo)(() => {
23432
+ const visibleElementsWithIcons = (0, import_react149.useMemo)(() => {
23312
23433
  const visibleElements = /* @__PURE__ */ new Set();
23313
23434
  if (linkElementVisible) {
23314
23435
  visibleElements.add("link");
@@ -23345,7 +23466,7 @@ var useRichTextToolbarState = ({ config }) => {
23345
23466
  };
23346
23467
 
23347
23468
  // src/components/ParameterInputs/ParameterRichText.tsx
23348
- var import_jsx_runtime130 = require("@emotion/react/jsx-runtime");
23469
+ var import_jsx_runtime131 = require("@emotion/react/jsx-runtime");
23349
23470
  var ParameterRichText = ({
23350
23471
  label,
23351
23472
  labelLeadingIcon,
@@ -23370,7 +23491,7 @@ var ParameterRichText = ({
23370
23491
  variables,
23371
23492
  customControls
23372
23493
  }) => {
23373
- return /* @__PURE__ */ (0, import_jsx_runtime130.jsxs)(
23494
+ return /* @__PURE__ */ (0, import_jsx_runtime131.jsxs)(
23374
23495
  ParameterShell,
23375
23496
  {
23376
23497
  "data-testid": "parameter-richtext",
@@ -23384,7 +23505,7 @@ var ParameterRichText = ({
23384
23505
  captionTestId,
23385
23506
  menuItems,
23386
23507
  children: [
23387
- /* @__PURE__ */ (0, import_jsx_runtime130.jsx)(
23508
+ /* @__PURE__ */ (0, import_jsx_runtime131.jsx)(
23388
23509
  ParameterRichTextInner,
23389
23510
  {
23390
23511
  value,
@@ -23402,23 +23523,23 @@ var ParameterRichText = ({
23402
23523
  children
23403
23524
  }
23404
23525
  ),
23405
- menuItems ? /* @__PURE__ */ (0, import_jsx_runtime130.jsx)(ParameterMenuButton, { label: `${label} menu`, children: /* @__PURE__ */ (0, import_jsx_runtime130.jsx)(import_jsx_runtime130.Fragment, { children: menuItems }) }) : null
23526
+ menuItems ? /* @__PURE__ */ (0, import_jsx_runtime131.jsx)(ParameterMenuButton, { label: `${label} menu`, children: /* @__PURE__ */ (0, import_jsx_runtime131.jsx)(import_jsx_runtime131.Fragment, { children: menuItems }) }) : null
23406
23527
  ]
23407
23528
  }
23408
23529
  );
23409
23530
  };
23410
- var editorWrapper = import_react148.css`
23531
+ var editorWrapper = import_react150.css`
23411
23532
  display: flex;
23412
23533
  flex-flow: column;
23413
23534
  flex-grow: 1;
23414
23535
  `;
23415
- var editorContainer = import_react148.css`
23536
+ var editorContainer = import_react150.css`
23416
23537
  display: flex;
23417
23538
  flex-flow: column;
23418
23539
  flex-grow: 1;
23419
23540
  position: relative;
23420
23541
  `;
23421
- var editorPlaceholder = import_react148.css`
23542
+ var editorPlaceholder = import_react150.css`
23422
23543
  color: var(--gray-500);
23423
23544
  font-style: italic;
23424
23545
  /* 1px is added to make sure caret is clearly visible when field is focused
@@ -23429,7 +23550,7 @@ var editorPlaceholder = import_react148.css`
23429
23550
  top: var(--spacing-sm);
23430
23551
  user-select: none;
23431
23552
  `;
23432
- var editorInput = import_react148.css`
23553
+ var editorInput = import_react150.css`
23433
23554
  background: var(--white);
23434
23555
  border: 1px solid var(--gray-200);
23435
23556
  border-radius: var(--rounded-sm);
@@ -23513,8 +23634,8 @@ var ParameterRichTextInner = ({
23513
23634
  },
23514
23635
  editable: !readOnly
23515
23636
  };
23516
- return /* @__PURE__ */ (0, import_jsx_runtime130.jsxs)(import_jsx_runtime130.Fragment, { children: [
23517
- /* @__PURE__ */ (0, import_jsx_runtime130.jsx)("div", { css: [editorWrapper], className: editorWrapperClassName, children: /* @__PURE__ */ (0, import_jsx_runtime130.jsx)(import_LexicalComposer.LexicalComposer, { initialConfig: lexicalConfig, children: /* @__PURE__ */ (0, import_jsx_runtime130.jsx)(
23637
+ return /* @__PURE__ */ (0, import_jsx_runtime131.jsxs)(import_jsx_runtime131.Fragment, { children: [
23638
+ /* @__PURE__ */ (0, import_jsx_runtime131.jsx)("div", { css: [editorWrapper], className: editorWrapperClassName, children: /* @__PURE__ */ (0, import_jsx_runtime131.jsx)(import_LexicalComposer.LexicalComposer, { initialConfig: lexicalConfig, children: /* @__PURE__ */ (0, import_jsx_runtime131.jsx)(
23518
23639
  RichText,
23519
23640
  {
23520
23641
  onChange,
@@ -23551,14 +23672,14 @@ var RichText = ({
23551
23672
  variables,
23552
23673
  customControls
23553
23674
  }) => {
23554
- const editorContainerRef = (0, import_react149.useRef)(null);
23675
+ const editorContainerRef = (0, import_react151.useRef)(null);
23555
23676
  const [editor] = (0, import_LexicalComposerContext5.useLexicalComposerContext)();
23556
- (0, import_react149.useEffect)(() => {
23677
+ (0, import_react151.useEffect)(() => {
23557
23678
  if (onRichTextInit) {
23558
23679
  onRichTextInit(editor);
23559
23680
  }
23560
23681
  }, [editor, onRichTextInit]);
23561
- (0, import_react149.useEffect)(() => {
23682
+ (0, import_react151.useEffect)(() => {
23562
23683
  const removeUpdateListener = editor.registerUpdateListener(({ editorState, prevEditorState }) => {
23563
23684
  requestAnimationFrame(() => {
23564
23685
  if (!(0, import_fast_equals2.deepEqual)(editorState.toJSON(), prevEditorState.toJSON())) {
@@ -23570,23 +23691,23 @@ var RichText = ({
23570
23691
  removeUpdateListener();
23571
23692
  };
23572
23693
  }, [editor, onChange]);
23573
- (0, import_react149.useEffect)(() => {
23694
+ (0, import_react151.useEffect)(() => {
23574
23695
  editor.setEditable(!readOnly);
23575
23696
  }, [editor, readOnly]);
23576
- return /* @__PURE__ */ (0, import_jsx_runtime130.jsxs)(import_jsx_runtime130.Fragment, { children: [
23577
- readOnly ? null : /* @__PURE__ */ (0, import_jsx_runtime130.jsx)(RichTextToolbar_default, { config, customControls }),
23578
- /* @__PURE__ */ (0, import_jsx_runtime130.jsxs)("div", { css: editorContainer, ref: editorContainerRef, "data-testid": "value-container", children: [
23579
- /* @__PURE__ */ (0, import_jsx_runtime130.jsx)(
23697
+ return /* @__PURE__ */ (0, import_jsx_runtime131.jsxs)(import_jsx_runtime131.Fragment, { children: [
23698
+ readOnly ? null : /* @__PURE__ */ (0, import_jsx_runtime131.jsx)(RichTextToolbar_default, { config, customControls }),
23699
+ /* @__PURE__ */ (0, import_jsx_runtime131.jsxs)("div", { css: editorContainer, ref: editorContainerRef, "data-testid": "value-container", children: [
23700
+ /* @__PURE__ */ (0, import_jsx_runtime131.jsx)(
23580
23701
  import_LexicalRichTextPlugin.RichTextPlugin,
23581
23702
  {
23582
- contentEditable: /* @__PURE__ */ (0, import_jsx_runtime130.jsx)(import_LexicalContentEditable.ContentEditable, { css: editorInput, className: editorInputClassName }),
23583
- placeholder: /* @__PURE__ */ (0, import_jsx_runtime130.jsx)("div", { css: editorPlaceholder, children: readOnly ? "empty" : "start editing..." }),
23703
+ contentEditable: /* @__PURE__ */ (0, import_jsx_runtime131.jsx)(import_LexicalContentEditable.ContentEditable, { css: editorInput, className: editorInputClassName }),
23704
+ placeholder: /* @__PURE__ */ (0, import_jsx_runtime131.jsx)("div", { css: editorPlaceholder, children: readOnly ? "empty" : "start editing..." }),
23584
23705
  ErrorBoundary: import_LexicalErrorBoundary.default
23585
23706
  }
23586
23707
  ),
23587
- /* @__PURE__ */ (0, import_jsx_runtime130.jsx)(import_LexicalListPlugin.ListPlugin, {}),
23588
- readOnly ? null : /* @__PURE__ */ (0, import_jsx_runtime130.jsx)(import_LexicalHistoryPlugin.HistoryPlugin, {}),
23589
- /* @__PURE__ */ (0, import_jsx_runtime130.jsx)(
23708
+ /* @__PURE__ */ (0, import_jsx_runtime131.jsx)(import_LexicalListPlugin.ListPlugin, {}),
23709
+ readOnly ? null : /* @__PURE__ */ (0, import_jsx_runtime131.jsx)(import_LexicalHistoryPlugin.HistoryPlugin, {}),
23710
+ /* @__PURE__ */ (0, import_jsx_runtime131.jsx)(
23590
23711
  LinkNodePlugin,
23591
23712
  {
23592
23713
  onConnectLink: onConnectLink ? onConnectLink : () => Promise.resolve(),
@@ -23596,28 +23717,28 @@ var RichText = ({
23596
23717
  } : void 0
23597
23718
  }
23598
23719
  ),
23599
- /* @__PURE__ */ (0, import_jsx_runtime130.jsx)(ListIndentPlugin, { maxDepth: 4 }),
23600
- /* @__PURE__ */ (0, import_jsx_runtime130.jsx)(DisableStylesPlugin, {}),
23601
- /* @__PURE__ */ (0, import_jsx_runtime130.jsx)(import_LexicalMarkdownShortcutPlugin.MarkdownShortcutPlugin, { transformers: MARKDOWN_TRANSFORMERS }),
23602
- /* @__PURE__ */ (0, import_jsx_runtime130.jsx)(import_jsx_runtime130.Fragment, { children })
23720
+ /* @__PURE__ */ (0, import_jsx_runtime131.jsx)(ListIndentPlugin, { maxDepth: 4 }),
23721
+ /* @__PURE__ */ (0, import_jsx_runtime131.jsx)(DisableStylesPlugin, {}),
23722
+ /* @__PURE__ */ (0, import_jsx_runtime131.jsx)(import_LexicalMarkdownShortcutPlugin.MarkdownShortcutPlugin, { transformers: MARKDOWN_TRANSFORMERS }),
23723
+ /* @__PURE__ */ (0, import_jsx_runtime131.jsx)(import_jsx_runtime131.Fragment, { children })
23603
23724
  ] })
23604
23725
  ] });
23605
23726
  };
23606
23727
 
23607
23728
  // src/components/ParameterInputs/ParameterSelect.tsx
23608
23729
  init_emotion_jsx_shim();
23609
- var import_react150 = require("react");
23610
- var import_jsx_runtime131 = require("@emotion/react/jsx-runtime");
23611
- var ParameterSelect = (0, import_react150.forwardRef)(
23730
+ var import_react152 = require("react");
23731
+ var import_jsx_runtime132 = require("@emotion/react/jsx-runtime");
23732
+ var ParameterSelect = (0, import_react152.forwardRef)(
23612
23733
  ({ defaultOption, options, ...props }, ref) => {
23613
23734
  const { shellProps, innerProps } = extractParameterProps(props);
23614
- return /* @__PURE__ */ (0, import_jsx_runtime131.jsx)(ParameterShell, { ...shellProps, children: /* @__PURE__ */ (0, import_jsx_runtime131.jsx)(ParameterSelectInner, { options, defaultOption, ...innerProps, ref }) });
23735
+ return /* @__PURE__ */ (0, import_jsx_runtime132.jsx)(ParameterShell, { ...shellProps, children: /* @__PURE__ */ (0, import_jsx_runtime132.jsx)(ParameterSelectInner, { options, defaultOption, ...innerProps, ref }) });
23615
23736
  }
23616
23737
  );
23617
- var ParameterSelectInner = (0, import_react150.forwardRef)(
23738
+ var ParameterSelectInner = (0, import_react152.forwardRef)(
23618
23739
  ({ defaultOption, options, ...props }, ref) => {
23619
23740
  const { id, label, hiddenLabel } = useParameterShell();
23620
- return /* @__PURE__ */ (0, import_jsx_runtime131.jsxs)(
23741
+ return /* @__PURE__ */ (0, import_jsx_runtime132.jsxs)(
23621
23742
  "select",
23622
23743
  {
23623
23744
  css: [input3, selectInput],
@@ -23626,10 +23747,10 @@ var ParameterSelectInner = (0, import_react150.forwardRef)(
23626
23747
  ref,
23627
23748
  ...props,
23628
23749
  children: [
23629
- defaultOption ? /* @__PURE__ */ (0, import_jsx_runtime131.jsx)("option", { value: "", children: defaultOption }) : null,
23750
+ defaultOption ? /* @__PURE__ */ (0, import_jsx_runtime132.jsx)("option", { value: "", children: defaultOption }) : null,
23630
23751
  options.map((option) => {
23631
23752
  var _a;
23632
- return /* @__PURE__ */ (0, import_jsx_runtime131.jsx)("option", { value: (_a = option.value) != null ? _a : option.label, children: option.label }, option.label);
23753
+ return /* @__PURE__ */ (0, import_jsx_runtime132.jsx)("option", { value: (_a = option.value) != null ? _a : option.label, children: option.label }, option.label);
23633
23754
  })
23634
23755
  ]
23635
23756
  }
@@ -23639,15 +23760,15 @@ var ParameterSelectInner = (0, import_react150.forwardRef)(
23639
23760
 
23640
23761
  // src/components/ParameterInputs/ParameterTextarea.tsx
23641
23762
  init_emotion_jsx_shim();
23642
- var import_react151 = require("react");
23643
- var import_jsx_runtime132 = require("@emotion/react/jsx-runtime");
23644
- var ParameterTextarea = (0, import_react151.forwardRef)((props, ref) => {
23763
+ var import_react153 = require("react");
23764
+ var import_jsx_runtime133 = require("@emotion/react/jsx-runtime");
23765
+ var ParameterTextarea = (0, import_react153.forwardRef)((props, ref) => {
23645
23766
  const { shellProps, innerProps } = extractParameterProps(props);
23646
- return /* @__PURE__ */ (0, import_jsx_runtime132.jsx)(ParameterShell, { "data-testid": "parameter-textarea", ...shellProps, children: /* @__PURE__ */ (0, import_jsx_runtime132.jsx)(ParameterTextareaInner, { ref, ...innerProps }) });
23767
+ return /* @__PURE__ */ (0, import_jsx_runtime133.jsx)(ParameterShell, { "data-testid": "parameter-textarea", ...shellProps, children: /* @__PURE__ */ (0, import_jsx_runtime133.jsx)(ParameterTextareaInner, { ref, ...innerProps }) });
23647
23768
  });
23648
- var ParameterTextareaInner = (0, import_react151.forwardRef)(({ ...props }, ref) => {
23769
+ var ParameterTextareaInner = (0, import_react153.forwardRef)(({ ...props }, ref) => {
23649
23770
  const { id, label, hiddenLabel } = useParameterShell();
23650
- return /* @__PURE__ */ (0, import_jsx_runtime132.jsx)(
23771
+ return /* @__PURE__ */ (0, import_jsx_runtime133.jsx)(
23651
23772
  "textarea",
23652
23773
  {
23653
23774
  css: [input3, textarea2],
@@ -23661,18 +23782,18 @@ var ParameterTextareaInner = (0, import_react151.forwardRef)(({ ...props }, ref)
23661
23782
 
23662
23783
  // src/components/ParameterInputs/ParameterToggle.tsx
23663
23784
  init_emotion_jsx_shim();
23664
- var import_react152 = require("react");
23665
- var import_jsx_runtime133 = require("@emotion/react/jsx-runtime");
23666
- var ParameterToggle = (0, import_react152.forwardRef)((props, ref) => {
23785
+ var import_react154 = require("react");
23786
+ var import_jsx_runtime134 = require("@emotion/react/jsx-runtime");
23787
+ var ParameterToggle = (0, import_react154.forwardRef)((props, ref) => {
23667
23788
  const { shellProps, innerProps } = extractParameterProps(props);
23668
- return /* @__PURE__ */ (0, import_jsx_runtime133.jsx)(ParameterShell, { ...shellProps, children: /* @__PURE__ */ (0, import_jsx_runtime133.jsx)(ParameterToggleInner, { ref, ...innerProps }) });
23789
+ return /* @__PURE__ */ (0, import_jsx_runtime134.jsx)(ParameterShell, { ...shellProps, children: /* @__PURE__ */ (0, import_jsx_runtime134.jsx)(ParameterToggleInner, { ref, ...innerProps }) });
23669
23790
  });
23670
- var ParameterToggleInner = (0, import_react152.forwardRef)(
23791
+ var ParameterToggleInner = (0, import_react154.forwardRef)(
23671
23792
  ({ children, ...props }, ref) => {
23672
23793
  const { id, label } = useParameterShell();
23673
- return /* @__PURE__ */ (0, import_jsx_runtime133.jsxs)("label", { css: inputToggleLabel2, children: [
23674
- /* @__PURE__ */ (0, import_jsx_runtime133.jsx)("input", { css: toggleInput2, type: props.type, id, ref, ...props }),
23675
- /* @__PURE__ */ (0, import_jsx_runtime133.jsx)("span", { css: inlineLabel2, children: label }),
23794
+ return /* @__PURE__ */ (0, import_jsx_runtime134.jsxs)("label", { css: inputToggleLabel2, children: [
23795
+ /* @__PURE__ */ (0, import_jsx_runtime134.jsx)("input", { css: toggleInput2, type: props.type, id, ref, ...props }),
23796
+ /* @__PURE__ */ (0, import_jsx_runtime134.jsx)("span", { css: inlineLabel2, children: label }),
23676
23797
  children
23677
23798
  ] });
23678
23799
  }
@@ -23683,8 +23804,8 @@ init_emotion_jsx_shim();
23683
23804
 
23684
23805
  // src/components/ProgressBar/ProgressBar.styles.ts
23685
23806
  init_emotion_jsx_shim();
23686
- var import_react153 = require("@emotion/react");
23687
- var container3 = import_react153.css`
23807
+ var import_react155 = require("@emotion/react");
23808
+ var container3 = import_react155.css`
23688
23809
  background: var(--gray-50);
23689
23810
  margin-block: var(--spacing-sm);
23690
23811
  position: relative;
@@ -23694,17 +23815,17 @@ var container3 = import_react153.css`
23694
23815
  border: solid 1px var(--gray-300);
23695
23816
  `;
23696
23817
  var themeMap = {
23697
- primary: import_react153.css`
23818
+ primary: import_react155.css`
23698
23819
  --progress-color: var(--accent-light);
23699
23820
  `,
23700
- secondary: import_react153.css`
23821
+ secondary: import_react155.css`
23701
23822
  --progress-color: var(--accent-alt-light);
23702
23823
  `,
23703
- destructive: import_react153.css`
23824
+ destructive: import_react155.css`
23704
23825
  --progress-color: var(--brand-secondary-5);
23705
23826
  `
23706
23827
  };
23707
- var slidingBackgroundPosition = import_react153.keyframes`
23828
+ var slidingBackgroundPosition = import_react155.keyframes`
23708
23829
  from {
23709
23830
  background-position: 0 0;
23710
23831
  }
@@ -23712,10 +23833,10 @@ var slidingBackgroundPosition = import_react153.keyframes`
23712
23833
  background-position: 64px 0;
23713
23834
  }
23714
23835
  `;
23715
- var determinate = import_react153.css`
23836
+ var determinate = import_react155.css`
23716
23837
  background-color: var(--progress-color);
23717
23838
  `;
23718
- var indeterminate = import_react153.css`
23839
+ var indeterminate = import_react155.css`
23719
23840
  background-image: linear-gradient(
23720
23841
  45deg,
23721
23842
  var(--progress-color) 25%,
@@ -23729,7 +23850,7 @@ var indeterminate = import_react153.css`
23729
23850
  background-size: 64px 64px;
23730
23851
  animation: ${slidingBackgroundPosition} 1s linear infinite;
23731
23852
  `;
23732
- var bar = import_react153.css`
23853
+ var bar = import_react155.css`
23733
23854
  position: absolute;
23734
23855
  inset: 0;
23735
23856
  transition: transform var(--duration-fast) var(--timing-ease-out);
@@ -23737,7 +23858,7 @@ var bar = import_react153.css`
23737
23858
  `;
23738
23859
 
23739
23860
  // src/components/ProgressBar/ProgressBar.tsx
23740
- var import_jsx_runtime134 = require("@emotion/react/jsx-runtime");
23861
+ var import_jsx_runtime135 = require("@emotion/react/jsx-runtime");
23741
23862
  function ProgressBar({
23742
23863
  current,
23743
23864
  max,
@@ -23747,7 +23868,7 @@ function ProgressBar({
23747
23868
  }) {
23748
23869
  const valueNow = Math.min(current, max);
23749
23870
  const valuePercentage = max > 0 ? Math.ceil(100 / max * valueNow) : 0;
23750
- return /* @__PURE__ */ (0, import_jsx_runtime134.jsx)(
23871
+ return /* @__PURE__ */ (0, import_jsx_runtime135.jsx)(
23751
23872
  "div",
23752
23873
  {
23753
23874
  css: container3,
@@ -23758,7 +23879,7 @@ function ProgressBar({
23758
23879
  "aria-valuemax": max,
23759
23880
  "aria-valuenow": valueNow,
23760
23881
  ...props,
23761
- children: /* @__PURE__ */ (0, import_jsx_runtime134.jsx)(
23882
+ children: /* @__PURE__ */ (0, import_jsx_runtime135.jsx)(
23762
23883
  "div",
23763
23884
  {
23764
23885
  css: [
@@ -23778,31 +23899,31 @@ function ProgressBar({
23778
23899
 
23779
23900
  // src/components/ProgressList/ProgressList.tsx
23780
23901
  init_emotion_jsx_shim();
23781
- var import_react155 = require("@emotion/react");
23902
+ var import_react157 = require("@emotion/react");
23782
23903
  var import_CgCheckO3 = require("@react-icons/all-files/cg/CgCheckO");
23783
23904
  var import_CgRadioCheck2 = require("@react-icons/all-files/cg/CgRadioCheck");
23784
23905
  var import_CgRecord2 = require("@react-icons/all-files/cg/CgRecord");
23785
- var import_react156 = require("react");
23906
+ var import_react158 = require("react");
23786
23907
 
23787
23908
  // src/components/ProgressList/styles/ProgressList.styles.ts
23788
23909
  init_emotion_jsx_shim();
23789
- var import_react154 = require("@emotion/react");
23790
- var progressListStyles = import_react154.css`
23910
+ var import_react156 = require("@emotion/react");
23911
+ var progressListStyles = import_react156.css`
23791
23912
  display: flex;
23792
23913
  flex-direction: column;
23793
23914
  gap: var(--spacing-sm);
23794
23915
  list-style-type: none;
23795
23916
  `;
23796
- var progressListItemStyles = import_react154.css`
23917
+ var progressListItemStyles = import_react156.css`
23797
23918
  display: flex;
23798
23919
  gap: var(--spacing-base);
23799
23920
  align-items: center;
23800
23921
  `;
23801
23922
 
23802
23923
  // src/components/ProgressList/ProgressList.tsx
23803
- var import_jsx_runtime135 = require("@emotion/react/jsx-runtime");
23924
+ var import_jsx_runtime136 = require("@emotion/react/jsx-runtime");
23804
23925
  var ProgressList = ({ inProgressId, items, autoEllipsis, ...htmlProps }) => {
23805
- const itemsWithStatus = (0, import_react156.useMemo)(() => {
23926
+ const itemsWithStatus = (0, import_react158.useMemo)(() => {
23806
23927
  const indexOfInProgressItem = items.findIndex(({ id }) => id === inProgressId);
23807
23928
  return items.map((item, index) => {
23808
23929
  let status = "queued";
@@ -23814,8 +23935,8 @@ var ProgressList = ({ inProgressId, items, autoEllipsis, ...htmlProps }) => {
23814
23935
  return { ...item, status };
23815
23936
  });
23816
23937
  }, [items, inProgressId]);
23817
- return /* @__PURE__ */ (0, import_jsx_runtime135.jsx)("ol", { css: progressListStyles, ...htmlProps, children: itemsWithStatus.map(({ id, label, status, error, errorLevel }) => {
23818
- return /* @__PURE__ */ (0, import_jsx_runtime135.jsx)(
23938
+ return /* @__PURE__ */ (0, import_jsx_runtime136.jsx)("ol", { css: progressListStyles, ...htmlProps, children: itemsWithStatus.map(({ id, label, status, error, errorLevel }) => {
23939
+ return /* @__PURE__ */ (0, import_jsx_runtime136.jsx)(
23819
23940
  ProgressListItem,
23820
23941
  {
23821
23942
  status,
@@ -23835,7 +23956,7 @@ var ProgressListItem = ({
23835
23956
  errorLevel = "danger",
23836
23957
  autoEllipsis = false
23837
23958
  }) => {
23838
- const icon = (0, import_react156.useMemo)(() => {
23959
+ const icon = (0, import_react158.useMemo)(() => {
23839
23960
  if (error) {
23840
23961
  return warningIcon;
23841
23962
  }
@@ -23846,14 +23967,14 @@ var ProgressListItem = ({
23846
23967
  };
23847
23968
  return iconPerStatus[status];
23848
23969
  }, [status, error]);
23849
- const statusStyles = (0, import_react156.useMemo)(() => {
23970
+ const statusStyles = (0, import_react158.useMemo)(() => {
23850
23971
  if (error) {
23851
- return errorLevel === "caution" ? import_react155.css`
23972
+ return errorLevel === "caution" ? import_react157.css`
23852
23973
  color: rgb(161, 98, 7);
23853
23974
  & svg {
23854
23975
  color: rgb(250, 204, 21);
23855
23976
  }
23856
- ` : import_react155.css`
23977
+ ` : import_react157.css`
23857
23978
  color: rgb(185, 28, 28);
23858
23979
  & svg {
23859
23980
  color: var(--brand-primary-2);
@@ -23861,40 +23982,40 @@ var ProgressListItem = ({
23861
23982
  `;
23862
23983
  }
23863
23984
  const colorPerStatus = {
23864
- completed: import_react155.css`
23985
+ completed: import_react157.css`
23865
23986
  opacity: 0.75;
23866
23987
  `,
23867
- inProgress: import_react155.css`
23988
+ inProgress: import_react157.css`
23868
23989
  -webkit-text-stroke-width: thin;
23869
23990
  `,
23870
- queued: import_react155.css`
23991
+ queued: import_react157.css`
23871
23992
  opacity: 0.5;
23872
23993
  `
23873
23994
  };
23874
23995
  return colorPerStatus[status];
23875
23996
  }, [status, error, errorLevel]);
23876
- return /* @__PURE__ */ (0, import_jsx_runtime135.jsxs)("li", { css: [progressListItemStyles, statusStyles], children: [
23877
- /* @__PURE__ */ (0, import_jsx_runtime135.jsx)(Tooltip, { title: error != null ? error : "", children: /* @__PURE__ */ (0, import_jsx_runtime135.jsx)("div", { children: /* @__PURE__ */ (0, import_jsx_runtime135.jsx)(Icon, { icon, size: 20, iconColor: "currentColor" }) }) }),
23878
- /* @__PURE__ */ (0, import_jsx_runtime135.jsxs)("div", { children: [
23997
+ return /* @__PURE__ */ (0, import_jsx_runtime136.jsxs)("li", { css: [progressListItemStyles, statusStyles], children: [
23998
+ /* @__PURE__ */ (0, import_jsx_runtime136.jsx)(Tooltip, { title: error != null ? error : "", children: /* @__PURE__ */ (0, import_jsx_runtime136.jsx)("div", { children: /* @__PURE__ */ (0, import_jsx_runtime136.jsx)(Icon, { icon, size: 20, iconColor: "currentColor" }) }) }),
23999
+ /* @__PURE__ */ (0, import_jsx_runtime136.jsxs)("div", { children: [
23879
24000
  children,
23880
- /* @__PURE__ */ (0, import_jsx_runtime135.jsx)("span", { css: { visibility: autoEllipsis && status === "inProgress" && !error ? "visible" : "hidden" }, children: "..." })
24001
+ /* @__PURE__ */ (0, import_jsx_runtime136.jsx)("span", { css: { visibility: autoEllipsis && status === "inProgress" && !error ? "visible" : "hidden" }, children: "..." })
23881
24002
  ] })
23882
24003
  ] });
23883
24004
  };
23884
24005
 
23885
24006
  // src/components/SegmentedControl/SegmentedControl.tsx
23886
24007
  init_emotion_jsx_shim();
23887
- var import_react158 = require("@emotion/react");
24008
+ var import_react160 = require("@emotion/react");
23888
24009
  var import_CgCheck6 = require("@react-icons/all-files/cg/CgCheck");
23889
- var import_react159 = require("react");
24010
+ var import_react161 = require("react");
23890
24011
 
23891
24012
  // src/components/SegmentedControl/SegmentedControl.styles.ts
23892
24013
  init_emotion_jsx_shim();
23893
- var import_react157 = require("@emotion/react");
23894
- var segmentedControlRootStyles = import_react157.css`
24014
+ var import_react159 = require("@emotion/react");
24015
+ var segmentedControlRootStyles = import_react159.css`
23895
24016
  position: relative;
23896
24017
  `;
23897
- var segmentedControlScrollIndicatorsStyles = import_react157.css`
24018
+ var segmentedControlScrollIndicatorsStyles = import_react159.css`
23898
24019
  position: absolute;
23899
24020
  inset: 0;
23900
24021
  z-index: 1;
@@ -23922,17 +24043,17 @@ var segmentedControlScrollIndicatorsStyles = import_react157.css`
23922
24043
  background: linear-gradient(to left, var(--background-color) 10%, transparent);
23923
24044
  }
23924
24045
  `;
23925
- var segmentedControlScrollIndicatorStartVisibleStyles = import_react157.css`
24046
+ var segmentedControlScrollIndicatorStartVisibleStyles = import_react159.css`
23926
24047
  &::before {
23927
24048
  opacity: 1;
23928
24049
  }
23929
24050
  `;
23930
- var segmentedControlScrollIndicatorEndVisibleStyles = import_react157.css`
24051
+ var segmentedControlScrollIndicatorEndVisibleStyles = import_react159.css`
23931
24052
  &::after {
23932
24053
  opacity: 1;
23933
24054
  }
23934
24055
  `;
23935
- var segmentedControlWrapperStyles = import_react157.css`
24056
+ var segmentedControlWrapperStyles = import_react159.css`
23936
24057
  overflow-y: auto;
23937
24058
  scroll-behavior: smooth;
23938
24059
  scrollbar-width: none;
@@ -23941,7 +24062,7 @@ var segmentedControlWrapperStyles = import_react157.css`
23941
24062
  height: 0px;
23942
24063
  }
23943
24064
  `;
23944
- var segmentedControlStyles = import_react157.css`
24065
+ var segmentedControlStyles = import_react159.css`
23945
24066
  --segmented-control-rounded-value: var(--rounded-base);
23946
24067
  --segmented-control-border-width: 1px;
23947
24068
  --segmented-control-selected-color: var(--brand-secondary-3);
@@ -23960,14 +24081,14 @@ var segmentedControlStyles = import_react157.css`
23960
24081
  border-radius: calc(var(--segmented-control-rounded-value) + var(--segmented-control-border-width));
23961
24082
  font-size: var(--fs-xs);
23962
24083
  `;
23963
- var segmentedControlVerticalStyles = import_react157.css`
24084
+ var segmentedControlVerticalStyles = import_react159.css`
23964
24085
  flex-direction: column;
23965
24086
  --segmented-control-first-border-radius: var(--segmented-control-rounded-value)
23966
24087
  var(--segmented-control-rounded-value) 0 0;
23967
24088
  --segmented-control-last-border-radius: 0 0 var(--segmented-control-rounded-value)
23968
24089
  var(--segmented-control-rounded-value);
23969
24090
  `;
23970
- var segmentedControlItemStyles = import_react157.css`
24091
+ var segmentedControlItemStyles = import_react159.css`
23971
24092
  &:first-of-type label {
23972
24093
  border-radius: var(--segmented-control-first-border-radius);
23973
24094
  }
@@ -23975,10 +24096,10 @@ var segmentedControlItemStyles = import_react157.css`
23975
24096
  border-radius: var(--segmented-control-last-border-radius);
23976
24097
  }
23977
24098
  `;
23978
- var segmentedControlInputStyles = import_react157.css`
24099
+ var segmentedControlInputStyles = import_react159.css`
23979
24100
  ${accessibleHidden}
23980
24101
  `;
23981
- var segmentedControlLabelStyles = (checked, disabled2) => import_react157.css`
24102
+ var segmentedControlLabelStyles = (checked, disabled2) => import_react159.css`
23982
24103
  position: relative;
23983
24104
  display: flex;
23984
24105
  align-items: center;
@@ -24045,25 +24166,25 @@ var segmentedControlLabelStyles = (checked, disabled2) => import_react157.css`
24045
24166
  `}
24046
24167
  }
24047
24168
  `;
24048
- var segmentedControlLabelIconOnlyStyles = import_react157.css`
24169
+ var segmentedControlLabelIconOnlyStyles = import_react159.css`
24049
24170
  padding-inline: 0.5em;
24050
24171
  `;
24051
- var segmentedControlLabelCheckStyles = import_react157.css`
24172
+ var segmentedControlLabelCheckStyles = import_react159.css`
24052
24173
  opacity: 0.5;
24053
24174
  `;
24054
- var segmentedControlLabelContentStyles = import_react157.css`
24175
+ var segmentedControlLabelContentStyles = import_react159.css`
24055
24176
  display: flex;
24056
24177
  align-items: center;
24057
24178
  justify-content: center;
24058
24179
  gap: var(--spacing-sm);
24059
24180
  height: 100%;
24060
24181
  `;
24061
- var segmentedControlLabelTextStyles = import_react157.css`
24182
+ var segmentedControlLabelTextStyles = import_react159.css`
24062
24183
  white-space: nowrap;
24063
24184
  `;
24064
24185
 
24065
24186
  // src/components/SegmentedControl/SegmentedControl.tsx
24066
- var import_jsx_runtime136 = require("@emotion/react/jsx-runtime");
24187
+ var import_jsx_runtime137 = require("@emotion/react/jsx-runtime");
24067
24188
  var SegmentedControl = ({
24068
24189
  name,
24069
24190
  options,
@@ -24078,10 +24199,10 @@ var SegmentedControl = ({
24078
24199
  currentBackgroundColor = "white",
24079
24200
  ...props
24080
24201
  }) => {
24081
- const wrapperRef = (0, import_react159.useRef)(null);
24082
- const [isOverflowStartShadowVisible, setIsOverflowStartShadowVisible] = (0, import_react159.useState)(false);
24083
- const [isOverflowEndShadowVisible, setIsOverflowEndShadowVisible] = (0, import_react159.useState)(false);
24084
- const onOptionChange = (0, import_react159.useCallback)(
24202
+ const wrapperRef = (0, import_react161.useRef)(null);
24203
+ const [isOverflowStartShadowVisible, setIsOverflowStartShadowVisible] = (0, import_react161.useState)(false);
24204
+ const [isOverflowEndShadowVisible, setIsOverflowEndShadowVisible] = (0, import_react161.useState)(false);
24205
+ const onOptionChange = (0, import_react161.useCallback)(
24085
24206
  (event) => {
24086
24207
  if (event.target.checked) {
24087
24208
  onChange == null ? void 0 : onChange(options[parseInt(event.target.value)].value);
@@ -24089,19 +24210,19 @@ var SegmentedControl = ({
24089
24210
  },
24090
24211
  [options, onChange]
24091
24212
  );
24092
- const sizeStyles = (0, import_react159.useMemo)(() => {
24213
+ const sizeStyles = (0, import_react161.useMemo)(() => {
24093
24214
  const map = {
24094
- sm: (0, import_react158.css)({ height: "calc(24px - 2px)", fontSize: "var(--fs-xs)" }),
24095
- md: (0, import_react158.css)({ height: "calc(32px - 2px)", fontSize: "var(--fs-sm)" }),
24096
- lg: (0, import_react158.css)({ height: "calc(40px - 2px)", fontSize: "var(--fs-base)" }),
24097
- xl: (0, import_react158.css)({ height: "calc(48px - 2px)", fontSize: "var(--fs-base)" })
24215
+ sm: (0, import_react160.css)({ height: "calc(24px - 2px)", fontSize: "var(--fs-xs)" }),
24216
+ md: (0, import_react160.css)({ height: "calc(32px - 2px)", fontSize: "var(--fs-sm)" }),
24217
+ lg: (0, import_react160.css)({ height: "calc(40px - 2px)", fontSize: "var(--fs-base)" }),
24218
+ xl: (0, import_react160.css)({ height: "calc(48px - 2px)", fontSize: "var(--fs-base)" })
24098
24219
  };
24099
24220
  return map[size];
24100
24221
  }, [size]);
24101
- const isIconOnly = (0, import_react159.useMemo)(() => {
24222
+ const isIconOnly = (0, import_react161.useMemo)(() => {
24102
24223
  return options.every((option) => option && option.icon && !option.label);
24103
24224
  }, [options]);
24104
- (0, import_react159.useEffect)(() => {
24225
+ (0, import_react161.useEffect)(() => {
24105
24226
  const wrapperElement = wrapperRef.current;
24106
24227
  const onScroll = () => {
24107
24228
  if (!wrapperElement) {
@@ -24122,8 +24243,8 @@ var SegmentedControl = ({
24122
24243
  wrapperElement == null ? void 0 : wrapperElement.removeEventListener("scroll", onScroll);
24123
24244
  };
24124
24245
  }, []);
24125
- return /* @__PURE__ */ (0, import_jsx_runtime136.jsxs)("div", { css: [segmentedControlRootStyles, { "--background-color": currentBackgroundColor }], children: [
24126
- /* @__PURE__ */ (0, import_jsx_runtime136.jsx)("div", { ref: wrapperRef, css: segmentedControlWrapperStyles, children: /* @__PURE__ */ (0, import_jsx_runtime136.jsx)(
24246
+ return /* @__PURE__ */ (0, import_jsx_runtime137.jsxs)("div", { css: [segmentedControlRootStyles, { "--background-color": currentBackgroundColor }], children: [
24247
+ /* @__PURE__ */ (0, import_jsx_runtime137.jsx)("div", { ref: wrapperRef, css: segmentedControlWrapperStyles, children: /* @__PURE__ */ (0, import_jsx_runtime137.jsx)(
24127
24248
  "div",
24128
24249
  {
24129
24250
  css: [
@@ -24139,12 +24260,12 @@ var SegmentedControl = ({
24139
24260
  }
24140
24261
  const text = option.label ? option.label : option.icon ? null : String(option.value);
24141
24262
  const isDisabled = disabled2 || option.disabled;
24142
- return /* @__PURE__ */ (0, import_jsx_runtime136.jsx)(Tooltip, { title: (_a = option.tooltip) != null ? _a : "", children: /* @__PURE__ */ (0, import_jsx_runtime136.jsx)(
24263
+ return /* @__PURE__ */ (0, import_jsx_runtime137.jsx)(Tooltip, { title: (_a = option.tooltip) != null ? _a : "", children: /* @__PURE__ */ (0, import_jsx_runtime137.jsx)(
24143
24264
  "div",
24144
24265
  {
24145
24266
  css: segmentedControlItemStyles,
24146
24267
  "data-testid": option["data-testid"] ? option["data-testid"] : "container-segmented-control",
24147
- children: /* @__PURE__ */ (0, import_jsx_runtime136.jsxs)(
24268
+ children: /* @__PURE__ */ (0, import_jsx_runtime137.jsxs)(
24148
24269
  "label",
24149
24270
  {
24150
24271
  css: [
@@ -24153,7 +24274,7 @@ var SegmentedControl = ({
24153
24274
  isIconOnly ? segmentedControlLabelIconOnlyStyles : void 0
24154
24275
  ],
24155
24276
  children: [
24156
- /* @__PURE__ */ (0, import_jsx_runtime136.jsx)(
24277
+ /* @__PURE__ */ (0, import_jsx_runtime137.jsx)(
24157
24278
  "input",
24158
24279
  {
24159
24280
  css: segmentedControlInputStyles,
@@ -24165,10 +24286,10 @@ var SegmentedControl = ({
24165
24286
  disabled: isDisabled
24166
24287
  }
24167
24288
  ),
24168
- option.value !== value || noCheckmark ? null : /* @__PURE__ */ (0, import_jsx_runtime136.jsx)(import_CgCheck6.CgCheck, { css: segmentedControlLabelCheckStyles, "aria-label": "Selected", size: "1.5em" }),
24169
- /* @__PURE__ */ (0, import_jsx_runtime136.jsxs)("span", { css: segmentedControlLabelContentStyles, children: [
24170
- !option.icon ? null : /* @__PURE__ */ (0, import_jsx_runtime136.jsx)(Icon, { icon: option.icon, size: iconSize, iconColor: "currentColor" }),
24171
- !text || hideOptionText ? null : /* @__PURE__ */ (0, import_jsx_runtime136.jsx)("span", { css: segmentedControlLabelTextStyles, children: text })
24289
+ option.value !== value || noCheckmark ? null : /* @__PURE__ */ (0, import_jsx_runtime137.jsx)(import_CgCheck6.CgCheck, { css: segmentedControlLabelCheckStyles, "aria-label": "Selected", size: "1.5em" }),
24290
+ /* @__PURE__ */ (0, import_jsx_runtime137.jsxs)("span", { css: segmentedControlLabelContentStyles, children: [
24291
+ !option.icon ? null : /* @__PURE__ */ (0, import_jsx_runtime137.jsx)(Icon, { icon: option.icon, size: iconSize, iconColor: "currentColor" }),
24292
+ !text || hideOptionText ? null : /* @__PURE__ */ (0, import_jsx_runtime137.jsx)("span", { css: segmentedControlLabelTextStyles, children: text })
24172
24293
  ] })
24173
24294
  ]
24174
24295
  }
@@ -24178,7 +24299,7 @@ var SegmentedControl = ({
24178
24299
  })
24179
24300
  }
24180
24301
  ) }),
24181
- /* @__PURE__ */ (0, import_jsx_runtime136.jsx)(
24302
+ /* @__PURE__ */ (0, import_jsx_runtime137.jsx)(
24182
24303
  "div",
24183
24304
  {
24184
24305
  css: [
@@ -24196,18 +24317,18 @@ init_emotion_jsx_shim();
24196
24317
 
24197
24318
  // src/components/Skeleton/Skeleton.styles.ts
24198
24319
  init_emotion_jsx_shim();
24199
- var import_react160 = require("@emotion/react");
24200
- var lightFadingOut = import_react160.keyframes`
24320
+ var import_react162 = require("@emotion/react");
24321
+ var lightFadingOut = import_react162.keyframes`
24201
24322
  from { opacity: 0.1; }
24202
24323
  to { opacity: 0.025; }
24203
24324
  `;
24204
- var skeletonStyles = import_react160.css`
24325
+ var skeletonStyles = import_react162.css`
24205
24326
  animation: ${lightFadingOut} 1s ease-out infinite alternate;
24206
24327
  background-color: var(--gray-900);
24207
24328
  `;
24208
24329
 
24209
24330
  // src/components/Skeleton/Skeleton.tsx
24210
- var import_jsx_runtime137 = require("@emotion/react/jsx-runtime");
24331
+ var import_jsx_runtime138 = require("@emotion/react/jsx-runtime");
24211
24332
  var Skeleton = ({
24212
24333
  width = "100%",
24213
24334
  height = "1.25rem",
@@ -24215,7 +24336,7 @@ var Skeleton = ({
24215
24336
  circle = false,
24216
24337
  children,
24217
24338
  ...otherProps
24218
- }) => /* @__PURE__ */ (0, import_jsx_runtime137.jsx)(
24339
+ }) => /* @__PURE__ */ (0, import_jsx_runtime138.jsx)(
24219
24340
  "div",
24220
24341
  {
24221
24342
  css: [
@@ -24236,12 +24357,12 @@ var Skeleton = ({
24236
24357
 
24237
24358
  // src/components/Switch/Switch.tsx
24238
24359
  init_emotion_jsx_shim();
24239
- var import_react162 = require("react");
24360
+ var import_react164 = require("react");
24240
24361
 
24241
24362
  // src/components/Switch/Switch.styles.ts
24242
24363
  init_emotion_jsx_shim();
24243
- var import_react161 = require("@emotion/react");
24244
- var SwitchInputContainer = import_react161.css`
24364
+ var import_react163 = require("@emotion/react");
24365
+ var SwitchInputContainer = import_react163.css`
24245
24366
  cursor: pointer;
24246
24367
  display: inline-block;
24247
24368
  position: relative;
@@ -24250,7 +24371,7 @@ var SwitchInputContainer = import_react161.css`
24250
24371
  vertical-align: middle;
24251
24372
  user-select: none;
24252
24373
  `;
24253
- var SwitchInput = (size) => import_react161.css`
24374
+ var SwitchInput = (size) => import_react163.css`
24254
24375
  appearance: none;
24255
24376
  border-radius: var(--rounded-full);
24256
24377
  background-color: var(--white);
@@ -24289,7 +24410,7 @@ var SwitchInput = (size) => import_react161.css`
24289
24410
  cursor: not-allowed;
24290
24411
  }
24291
24412
  `;
24292
- var SwitchInputDisabled = import_react161.css`
24413
+ var SwitchInputDisabled = import_react163.css`
24293
24414
  opacity: var(--opacity-50);
24294
24415
  cursor: not-allowed;
24295
24416
 
@@ -24297,7 +24418,7 @@ var SwitchInputDisabled = import_react161.css`
24297
24418
  cursor: not-allowed;
24298
24419
  }
24299
24420
  `;
24300
- var SwitchInputLabel = (size) => import_react161.css`
24421
+ var SwitchInputLabel = (size) => import_react163.css`
24301
24422
  align-items: center;
24302
24423
  color: var(--typography-base);
24303
24424
  display: inline-flex;
@@ -24319,32 +24440,32 @@ var SwitchInputLabel = (size) => import_react161.css`
24319
24440
  top: 0;
24320
24441
  }
24321
24442
  `;
24322
- var SwitchText = (size) => import_react161.css`
24443
+ var SwitchText = (size) => import_react163.css`
24323
24444
  color: var(--gray-500);
24324
24445
  font-size: var(--fs-sm);
24325
24446
  padding-inline: ${size === "sm" ? "var(--spacing-xl)" : "var(--spacing-2xl)"} 0;
24326
24447
  `;
24327
24448
 
24328
24449
  // src/components/Switch/Switch.tsx
24329
- var import_jsx_runtime138 = require("@emotion/react/jsx-runtime");
24330
- var Switch = (0, import_react162.forwardRef)(
24450
+ var import_jsx_runtime139 = require("@emotion/react/jsx-runtime");
24451
+ var Switch = (0, import_react164.forwardRef)(
24331
24452
  ({ label, infoText, toggleText, children, switchSize = "base", ...inputProps }, ref) => {
24332
24453
  let additionalText = infoText;
24333
24454
  if (infoText && toggleText) {
24334
24455
  additionalText = inputProps.checked ? toggleText : infoText;
24335
24456
  }
24336
- return /* @__PURE__ */ (0, import_jsx_runtime138.jsxs)(import_jsx_runtime138.Fragment, { children: [
24337
- /* @__PURE__ */ (0, import_jsx_runtime138.jsxs)(
24457
+ return /* @__PURE__ */ (0, import_jsx_runtime139.jsxs)(import_jsx_runtime139.Fragment, { children: [
24458
+ /* @__PURE__ */ (0, import_jsx_runtime139.jsxs)(
24338
24459
  "label",
24339
24460
  {
24340
24461
  css: [SwitchInputContainer, inputProps.disabled ? SwitchInputDisabled : void 0],
24341
24462
  children: [
24342
- /* @__PURE__ */ (0, import_jsx_runtime138.jsx)("input", { type: "checkbox", css: SwitchInput(switchSize), ...inputProps, ref }),
24343
- /* @__PURE__ */ (0, import_jsx_runtime138.jsx)("span", { css: SwitchInputLabel(switchSize), children: label })
24463
+ /* @__PURE__ */ (0, import_jsx_runtime139.jsx)("input", { type: "checkbox", css: SwitchInput(switchSize), ...inputProps, ref }),
24464
+ /* @__PURE__ */ (0, import_jsx_runtime139.jsx)("span", { css: SwitchInputLabel(switchSize), children: label })
24344
24465
  ]
24345
24466
  }
24346
24467
  ),
24347
- additionalText ? /* @__PURE__ */ (0, import_jsx_runtime138.jsx)("p", { css: SwitchText(switchSize), children: additionalText }) : null,
24468
+ additionalText ? /* @__PURE__ */ (0, import_jsx_runtime139.jsx)("p", { css: SwitchText(switchSize), children: additionalText }) : null,
24348
24469
  children
24349
24470
  ] });
24350
24471
  }
@@ -24356,8 +24477,8 @@ var React24 = __toESM(require("react"));
24356
24477
 
24357
24478
  // src/components/Table/Table.styles.ts
24358
24479
  init_emotion_jsx_shim();
24359
- var import_react163 = require("@emotion/react");
24360
- var table = ({ cellPadding = "var(--spacing-sm) var(--spacing-md)" }) => import_react163.css`
24480
+ var import_react165 = require("@emotion/react");
24481
+ var table = ({ cellPadding = "var(--spacing-sm) var(--spacing-md)" }) => import_react165.css`
24361
24482
  border-bottom: 1px solid var(--gray-400);
24362
24483
  border-collapse: collapse;
24363
24484
  min-width: 100%;
@@ -24377,66 +24498,66 @@ var table = ({ cellPadding = "var(--spacing-sm) var(--spacing-md)" }) => import_
24377
24498
  background-color: var(--gray-50);
24378
24499
  }
24379
24500
  `;
24380
- var tableHead = import_react163.css`
24501
+ var tableHead = import_react165.css`
24381
24502
  color: var(--typography-base);
24382
24503
  text-align: left;
24383
24504
  `;
24384
- var tableRow = import_react163.css`
24505
+ var tableRow = import_react165.css`
24385
24506
  border-bottom: 1px solid var(--gray-100);
24386
24507
  `;
24387
- var tableCellHead = import_react163.css`
24508
+ var tableCellHead = import_react165.css`
24388
24509
  font-size: var(--fs-sm);
24389
24510
  text-transform: uppercase;
24390
24511
  font-weight: var(--fw-bold);
24391
24512
  `;
24392
24513
 
24393
24514
  // src/components/Table/Table.tsx
24394
- var import_jsx_runtime139 = require("@emotion/react/jsx-runtime");
24515
+ var import_jsx_runtime140 = require("@emotion/react/jsx-runtime");
24395
24516
  var Table = React24.forwardRef(
24396
24517
  ({ children, cellPadding, ...otherProps }, ref) => {
24397
- return /* @__PURE__ */ (0, import_jsx_runtime139.jsx)("table", { ref, css: table({ cellPadding }), ...otherProps, children });
24518
+ return /* @__PURE__ */ (0, import_jsx_runtime140.jsx)("table", { ref, css: table({ cellPadding }), ...otherProps, children });
24398
24519
  }
24399
24520
  );
24400
24521
  var TableHead = React24.forwardRef(
24401
24522
  ({ children, ...otherProps }, ref) => {
24402
- return /* @__PURE__ */ (0, import_jsx_runtime139.jsx)("thead", { ref, css: tableHead, ...otherProps, children });
24523
+ return /* @__PURE__ */ (0, import_jsx_runtime140.jsx)("thead", { ref, css: tableHead, ...otherProps, children });
24403
24524
  }
24404
24525
  );
24405
24526
  var TableBody = React24.forwardRef(
24406
24527
  ({ children, ...otherProps }, ref) => {
24407
- return /* @__PURE__ */ (0, import_jsx_runtime139.jsx)("tbody", { ref, ...otherProps, children });
24528
+ return /* @__PURE__ */ (0, import_jsx_runtime140.jsx)("tbody", { ref, ...otherProps, children });
24408
24529
  }
24409
24530
  );
24410
24531
  var TableFoot = React24.forwardRef(
24411
24532
  ({ children, ...otherProps }, ref) => {
24412
- return /* @__PURE__ */ (0, import_jsx_runtime139.jsx)("tfoot", { ref, ...otherProps, children });
24533
+ return /* @__PURE__ */ (0, import_jsx_runtime140.jsx)("tfoot", { ref, ...otherProps, children });
24413
24534
  }
24414
24535
  );
24415
24536
  var TableRow = React24.forwardRef(
24416
24537
  ({ children, ...otherProps }, ref) => {
24417
- return /* @__PURE__ */ (0, import_jsx_runtime139.jsx)("tr", { ref, css: tableRow, ...otherProps, children });
24538
+ return /* @__PURE__ */ (0, import_jsx_runtime140.jsx)("tr", { ref, css: tableRow, ...otherProps, children });
24418
24539
  }
24419
24540
  );
24420
24541
  var TableCellHead = React24.forwardRef(
24421
24542
  ({ children, ...otherProps }, ref) => {
24422
- return /* @__PURE__ */ (0, import_jsx_runtime139.jsx)("th", { ref, css: tableCellHead, ...otherProps, children });
24543
+ return /* @__PURE__ */ (0, import_jsx_runtime140.jsx)("th", { ref, css: tableCellHead, ...otherProps, children });
24423
24544
  }
24424
24545
  );
24425
24546
  var TableCellData = React24.forwardRef(
24426
24547
  ({ children, ...otherProps }, ref) => {
24427
- return /* @__PURE__ */ (0, import_jsx_runtime139.jsx)("td", { ref, ...otherProps, children });
24548
+ return /* @__PURE__ */ (0, import_jsx_runtime140.jsx)("td", { ref, ...otherProps, children });
24428
24549
  }
24429
24550
  );
24430
24551
 
24431
24552
  // src/components/Tabs/Tabs.tsx
24432
24553
  init_emotion_jsx_shim();
24433
- var import_react165 = require("@ariakit/react");
24434
- var import_react166 = require("react");
24554
+ var import_react167 = require("@ariakit/react");
24555
+ var import_react168 = require("react");
24435
24556
 
24436
24557
  // src/components/Tabs/Tabs.styles.ts
24437
24558
  init_emotion_jsx_shim();
24438
- var import_react164 = require("@emotion/react");
24439
- var tabButtonStyles = import_react164.css`
24559
+ var import_react166 = require("@emotion/react");
24560
+ var tabButtonStyles = import_react166.css`
24440
24561
  align-items: center;
24441
24562
  border: 0;
24442
24563
  height: 2.5rem;
@@ -24453,16 +24574,16 @@ var tabButtonStyles = import_react164.css`
24453
24574
  box-shadow: inset 0 -2px 0 var(--brand-secondary-3);
24454
24575
  }
24455
24576
  `;
24456
- var tabButtonGroupStyles = import_react164.css`
24577
+ var tabButtonGroupStyles = import_react166.css`
24457
24578
  display: flex;
24458
24579
  gap: var(--spacing-base);
24459
24580
  border-bottom: 1px solid var(--gray-300);
24460
24581
  `;
24461
24582
 
24462
24583
  // src/components/Tabs/Tabs.tsx
24463
- var import_jsx_runtime140 = require("@emotion/react/jsx-runtime");
24584
+ var import_jsx_runtime141 = require("@emotion/react/jsx-runtime");
24464
24585
  var useCurrentTab = () => {
24465
- const context = (0, import_react165.useTabStore)();
24586
+ const context = (0, import_react167.useTabStore)();
24466
24587
  if (!context) {
24467
24588
  throw new Error("This component can only be used inside <Tabs>");
24468
24589
  }
@@ -24476,12 +24597,12 @@ var Tabs = ({
24476
24597
  manual,
24477
24598
  ...props
24478
24599
  }) => {
24479
- const selected = (0, import_react166.useMemo)(() => {
24600
+ const selected = (0, import_react168.useMemo)(() => {
24480
24601
  if (selectedId) return selectedId;
24481
24602
  return useHashForState && typeof window !== "undefined" && window.location.hash ? window.location.hash.substring(1) : void 0;
24482
24603
  }, [selectedId, useHashForState]);
24483
- const tab = (0, import_react165.useTabStore)({ ...props, selectOnMove: !manual, selectedId: selected });
24484
- const onTabSelect = (0, import_react166.useCallback)(
24604
+ const tab = (0, import_react167.useTabStore)({ ...props, selectOnMove: !manual, selectedId: selected });
24605
+ const onTabSelect = (0, import_react168.useCallback)(
24485
24606
  (value) => {
24486
24607
  const selectedValueWithoutNull = value != null ? value : void 0;
24487
24608
  onSelectedIdChange == null ? void 0 : onSelectedIdChange(selectedValueWithoutNull);
@@ -24492,28 +24613,28 @@ var Tabs = ({
24492
24613
  },
24493
24614
  [onSelectedIdChange, useHashForState]
24494
24615
  );
24495
- (0, import_react166.useEffect)(() => {
24616
+ (0, import_react168.useEffect)(() => {
24496
24617
  if (selected && selected !== tab.getState().activeId) {
24497
24618
  tab.setSelectedId(selected);
24498
24619
  }
24499
24620
  }, [selected, tab]);
24500
- return /* @__PURE__ */ (0, import_jsx_runtime140.jsx)(import_react165.TabProvider, { store: tab, setSelectedId: onTabSelect, children });
24621
+ return /* @__PURE__ */ (0, import_jsx_runtime141.jsx)(import_react167.TabProvider, { store: tab, setSelectedId: onTabSelect, children });
24501
24622
  };
24502
24623
  var TabButtonGroup = ({ children, ...props }) => {
24503
- return /* @__PURE__ */ (0, import_jsx_runtime140.jsx)(import_react165.TabList, { ...props, css: tabButtonGroupStyles, children });
24624
+ return /* @__PURE__ */ (0, import_jsx_runtime141.jsx)(import_react167.TabList, { ...props, css: tabButtonGroupStyles, children });
24504
24625
  };
24505
24626
  var TabButton = ({
24506
24627
  children,
24507
24628
  id,
24508
24629
  ...props
24509
24630
  }) => {
24510
- return /* @__PURE__ */ (0, import_jsx_runtime140.jsx)(import_react165.Tab, { type: "button", id, ...props, css: tabButtonStyles, children });
24631
+ return /* @__PURE__ */ (0, import_jsx_runtime141.jsx)(import_react167.Tab, { type: "button", id, ...props, css: tabButtonStyles, children });
24511
24632
  };
24512
24633
  var TabContent = ({
24513
24634
  children,
24514
24635
  ...props
24515
24636
  }) => {
24516
- return /* @__PURE__ */ (0, import_jsx_runtime140.jsx)(import_react165.TabPanel, { ...props, children });
24637
+ return /* @__PURE__ */ (0, import_jsx_runtime141.jsx)(import_react167.TabPanel, { ...props, children });
24517
24638
  };
24518
24639
 
24519
24640
  // src/components/Validation/StatusBullet.tsx
@@ -24521,8 +24642,8 @@ init_emotion_jsx_shim();
24521
24642
 
24522
24643
  // src/components/Validation/StatusBullet.styles.ts
24523
24644
  init_emotion_jsx_shim();
24524
- var import_react167 = require("@emotion/react");
24525
- var StatusBulletContainer = import_react167.css`
24645
+ var import_react169 = require("@emotion/react");
24646
+ var StatusBulletContainer = import_react169.css`
24526
24647
  align-items: center;
24527
24648
  align-self: center;
24528
24649
  color: var(--gray-500);
@@ -24539,33 +24660,33 @@ var StatusBulletContainer = import_react167.css`
24539
24660
  display: block;
24540
24661
  }
24541
24662
  `;
24542
- var StatusBulletBase = import_react167.css`
24663
+ var StatusBulletBase = import_react169.css`
24543
24664
  font-size: var(--fs-sm);
24544
24665
  &:before {
24545
24666
  width: var(--fs-xs);
24546
24667
  height: var(--fs-xs);
24547
24668
  }
24548
24669
  `;
24549
- var StatusBulletSmall = import_react167.css`
24670
+ var StatusBulletSmall = import_react169.css`
24550
24671
  font-size: var(--fs-xs);
24551
24672
  &:before {
24552
24673
  width: var(--fs-xxs);
24553
24674
  height: var(--fs-xxs);
24554
24675
  }
24555
24676
  `;
24556
- var StatusDraft = import_react167.css`
24677
+ var StatusDraft = import_react169.css`
24557
24678
  &:before {
24558
24679
  background: var(--white);
24559
24680
  box-shadow: inset 0 0 0 0.125rem var(--accent-dark);
24560
24681
  }
24561
24682
  `;
24562
- var StatusModified = import_react167.css`
24683
+ var StatusModified = import_react169.css`
24563
24684
  &:before {
24564
24685
  background: linear-gradient(to right, var(--white) 50%, var(--accent-dark) 50% 100%);
24565
24686
  box-shadow: inset 0 0 0 0.125rem var(--accent-dark);
24566
24687
  }
24567
24688
  `;
24568
- var StatusError = import_react167.css`
24689
+ var StatusError = import_react169.css`
24569
24690
  color: var(--error);
24570
24691
  &:before {
24571
24692
  /* TODO: replace this with an svg icon */
@@ -24578,29 +24699,29 @@ var StatusError = import_react167.css`
24578
24699
  );
24579
24700
  }
24580
24701
  `;
24581
- var StatusPublished = import_react167.css`
24702
+ var StatusPublished = import_react169.css`
24582
24703
  &:before {
24583
24704
  background: var(--accent-dark);
24584
24705
  }
24585
24706
  `;
24586
- var StatusOrphan = import_react167.css`
24707
+ var StatusOrphan = import_react169.css`
24587
24708
  &:before {
24588
24709
  background: var(--brand-secondary-5);
24589
24710
  }
24590
24711
  `;
24591
- var StatusUnknown = import_react167.css`
24712
+ var StatusUnknown = import_react169.css`
24592
24713
  &:before {
24593
24714
  background: var(--gray-800);
24594
24715
  }
24595
24716
  `;
24596
- var StatusDeleted = import_react167.css`
24717
+ var StatusDeleted = import_react169.css`
24597
24718
  &:before {
24598
24719
  background: var(--error);
24599
24720
  }
24600
24721
  `;
24601
24722
 
24602
24723
  // src/components/Validation/StatusBullet.tsx
24603
- var import_jsx_runtime141 = require("@emotion/react/jsx-runtime");
24724
+ var import_jsx_runtime142 = require("@emotion/react/jsx-runtime");
24604
24725
  var StatusBullet = ({
24605
24726
  status,
24606
24727
  hideText = false,
@@ -24620,7 +24741,7 @@ var StatusBullet = ({
24620
24741
  Deleted: StatusDeleted
24621
24742
  };
24622
24743
  const statusSize = size === "base" ? StatusBulletBase : StatusBulletSmall;
24623
- return /* @__PURE__ */ (0, import_jsx_runtime141.jsx)(
24744
+ return /* @__PURE__ */ (0, import_jsx_runtime142.jsx)(
24624
24745
  "span",
24625
24746
  {
24626
24747
  role: "status",
@@ -24731,6 +24852,7 @@ var StatusBullet = ({
24731
24852
  ObjectGridItemCoverButton,
24732
24853
  ObjectGridItemHeading,
24733
24854
  ObjectGridItemIconWithTooltip,
24855
+ ObjectGridItemLoadingSkeleton,
24734
24856
  ObjectItemLoadingSkeleton,
24735
24857
  ObjectListItem,
24736
24858
  ObjectListItemContainer,