@uniformdev/design-system 19.178.2-alpha.25 → 19.179.2-alpha.22

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/dist/esm/index.js CHANGED
@@ -863,7 +863,8 @@ var button = css8`
863
863
  cursor: pointer;
864
864
  display: inline-flex;
865
865
  font-weight: var(--fw-medium);
866
- transition: color var(--duration-fast) var(--timing-ease-out),
866
+ transition:
867
+ color var(--duration-fast) var(--timing-ease-out),
867
868
  border-color var(--duration-fast) var(--timing-ease-out);
868
869
  max-width: max-content;
869
870
  gap: var(--spacing-sm);
@@ -1641,9 +1642,11 @@ var input = (whiteSpaceWrap) => css12`
1641
1642
  width: 100%;
1642
1643
  position: relative;
1643
1644
  white-space: ${whiteSpaceWrap};
1644
- transition: background var(--duration-fast) var(--timing-ease-out),
1645
+ transition:
1646
+ background var(--duration-fast) var(--timing-ease-out),
1645
1647
  border-color var(--duration-fast) var(--timing-ease-out),
1646
- color var(--duration-fast) var(--timing-ease-out), box-shadow var(--duration-fast) var(--timing-ease-out);
1648
+ color var(--duration-fast) var(--timing-ease-out),
1649
+ box-shadow var(--duration-fast) var(--timing-ease-out);
1647
1650
 
1648
1651
  &::placeholder {
1649
1652
  color: var(--gray-400);
@@ -1763,7 +1766,8 @@ var toggleInput = css12`
1763
1766
  background: var(--white);
1764
1767
  width: var(--spacing-md);
1765
1768
  height: var(--spacing-md);
1766
- transition: background var(--duration-fast) var(--timing-ease-out),
1769
+ transition:
1770
+ background var(--duration-fast) var(--timing-ease-out),
1767
1771
  border-color var(--duration-fast) var(--timing-ease-out),
1768
1772
  color var(--duration-fast) var(--timing-ease-out);
1769
1773
 
@@ -2002,7 +2006,9 @@ var addButton = css15`
2002
2006
  cursor: pointer;
2003
2007
  display: inline-flex;
2004
2008
  padding: 0;
2005
- transition: transform var(--duration-fast) var(--timing-ease-out), background var(--duration-slow);
2009
+ transition:
2010
+ transform var(--duration-fast) var(--timing-ease-out),
2011
+ background var(--duration-slow);
2006
2012
  transform: scale(0.95);
2007
2013
  width: var(--max-size);
2008
2014
  height: var(--max-size);
@@ -3119,10 +3125,37 @@ var customIcons = {
3119
3125
 
3120
3126
  // src/components/Icons/systemIcons.tsx
3121
3127
  import { GenIcon as GenIcon2 } from "@react-icons/all-files";
3128
+ import { CgGlobeAlt } from "@react-icons/all-files/cg/CgGlobeAlt";
3122
3129
  import { CgList } from "@react-icons/all-files/cg/CgList";
3123
3130
  import { CgPen } from "@react-icons/all-files/cg/CgPen";
3131
+ import { TbBinaryTree2 } from "@react-icons/all-files/tb/TbBinaryTree2";
3124
3132
  import { TbBox } from "@react-icons/all-files/tb/TbBox";
3125
3133
  var uniformComponentIcon = TbBox;
3134
+ var uniformConditionalValuesIcon = TbBinaryTree2;
3135
+ var uniformAiIcon = customIcons["magic-wand"];
3136
+ var uniformLocaleIcon = CgGlobeAlt;
3137
+ var uniformLocaleDisabledIcon = GenIcon2({
3138
+ tag: "svg",
3139
+ attr: { fill: "currentColor", viewBox: "0 0 24 24", role: "img" },
3140
+ child: [
3141
+ {
3142
+ tag: "path",
3143
+ attr: {
3144
+ fillRule: "evenodd",
3145
+ d: "M20.123 15.88A9 9 0 0 0 8.12 3.877l2.787 2.787c.03-.073.06-.145.092-.216.294-.661.592-1.073.823-1.292a.988.988 0 0 1 .178-.14.991.991 0 0 1 .178.14c.23.22.528.63.823 1.292.366.825.665 1.901.838 3.148l3.593 3.594a9.739 9.739 0 0 0 1.548-.665 6.968 6.968 0 0 1-.385 1.827l1.528 1.528ZM14.805 5.585c.691 1.53 1.136 3.62 1.19 5.945a9.939 9.939 0 0 0 1.557-.53c.6-.266.994-.536 1.226-.756a7.016 7.016 0 0 0-3.973-4.66ZM3.877 8.12A9 9 0 0 0 15.88 20.123l-2.787-2.787a7.89 7.89 0 0 1-.092.216c-.294.661-.593 1.073-.823 1.292a.996.996 0 0 1-.178.14.99.99 0 0 1-.178-.14c-.23-.22-.529-.63-.823-1.292-.367-.825-.666-1.901-.838-3.148L6.967 11.21a8.334 8.334 0 0 1-.519-.21c-.6-.266-.995-.536-1.226-.756a6.95 6.95 0 0 1 .183-.596L3.877 8.12Zm5.317 10.295c-.577-1.278-.982-2.947-1.131-4.817-1.183-.256-2.22-.624-3.044-1.073a7.004 7.004 0 0 0 4.175 5.89Z",
3146
+ clipRule: "evenodd"
3147
+ },
3148
+ child: []
3149
+ },
3150
+ {
3151
+ tag: "path",
3152
+ attr: {
3153
+ d: "M20.031 20.031a1.5 1.5 0 0 1-2.121 0L3.06 5.182a1.5 1.5 0 0 1 2.122-2.121L20.03 17.91a1.5 1.5 0 0 1 0 2.121Z"
3154
+ },
3155
+ child: []
3156
+ }
3157
+ ]
3158
+ });
3126
3159
  var uniformComponentPatternIcon = GenIcon2({
3127
3160
  tag: "svg",
3128
3161
  attr: {
@@ -12212,7 +12245,8 @@ var buttonStyle = (bgColor) => css24`
12212
12245
  display: block;
12213
12246
  font-size: var(--fs-sm);
12214
12247
  line-height: 1.5;
12215
- transition: background-color var(--duration-fast) var(--timing-ease-out),
12248
+ transition:
12249
+ background-color var(--duration-fast) var(--timing-ease-out),
12216
12250
  outline var(--duration-fast) var(--timing-ease-out);
12217
12251
  outline: 1px solid transparent;
12218
12252
 
@@ -12449,7 +12483,6 @@ var Menu = React7.forwardRef(function Menu2({
12449
12483
  menuItemsContainerCssClasses,
12450
12484
  testId,
12451
12485
  maxMenuHeight,
12452
- portalElement,
12453
12486
  ...props
12454
12487
  }, ref) {
12455
12488
  const placementOverride = legacyPlacements.includes(placement) ? void 0 : placement;
@@ -12460,7 +12493,6 @@ var Menu = React7.forwardRef(function Menu2({
12460
12493
  BaseMenu,
12461
12494
  {
12462
12495
  portal: !withoutPortal,
12463
- portalElement,
12464
12496
  unmountOnHide: true,
12465
12497
  gutter: 0,
12466
12498
  shift: menu.parent ? -4 : 0,
@@ -12626,7 +12658,8 @@ var CheckboxWithInfoInput = css29`
12626
12658
  border-radius: var(--rounded-sm);
12627
12659
  width: calc(var(--spacing-base) - 2px);
12628
12660
  height: calc(var(--spacing-base) - 2px);
12629
- transition: background var(--duration-fast) var(--timing-ease-out),
12661
+ transition:
12662
+ background var(--duration-fast) var(--timing-ease-out),
12630
12663
  border-color var(--duration-fast) var(--timing-ease-out),
12631
12664
  color var(--duration-fast) var(--timing-ease-out);
12632
12665
 
@@ -13861,7 +13894,8 @@ var ButtonWithMenuContainer = css38`
13861
13894
  display: inline-flex;
13862
13895
  position: relative;
13863
13896
  min-height: 24px;
13864
- transition: color var(--duration-fast) var(--timing-ease-out),
13897
+ transition:
13898
+ color var(--duration-fast) var(--timing-ease-out),
13865
13899
  border-color var(--duration-fast) var(--timing-ease-out),
13866
13900
  background-color var(--duration-fast) var(--timing-ease-out);
13867
13901
 
@@ -14842,7 +14876,8 @@ import { css as css48 } from "@emotion/react";
14842
14876
  var ChipContainer = css48`
14843
14877
  border-radius: var(--rounded-full);
14844
14878
  display: inline-flex;
14845
- transition: background var(--duration-fast) var(--timing-ease-out),
14879
+ transition:
14880
+ background var(--duration-fast) var(--timing-ease-out),
14846
14881
  color var(--duration-fast) var(--timing-ease-out);
14847
14882
  position: relative;
14848
14883
 
@@ -15118,7 +15153,8 @@ var MultilineChipContainer = css49`
15118
15153
  --gradient-rgb: var(--accent-primary-dark-rgb);
15119
15154
  --gradient-rgb-hover: var(--accent-primary-dark-hover-rgb);
15120
15155
  border-radius: var(--rounded-full);
15121
- background: radial-gradient(
15156
+ background:
15157
+ radial-gradient(
15122
15158
  farthest-side at 100%,
15123
15159
  rgba(var(--gradient-rgb), 0) 0%,
15124
15160
  rgba(var(--gradient-rgb), 0.2) 80%,
@@ -15151,7 +15187,8 @@ var MultilineChipContainer = css49`
15151
15187
  border: none;
15152
15188
  &:hover,
15153
15189
  &:focus {
15154
- background: radial-gradient(
15190
+ background:
15191
+ radial-gradient(
15155
15192
  farthest-side at 100%,
15156
15193
  rgba(var(--gradient-rgb-hover), 0) 0%,
15157
15194
  rgba(var(--gradient-rgb-hover), 0.2) 80%,
@@ -15204,17 +15241,19 @@ var MultilineChip = ({ children, onClick, ...props }) => {
15204
15241
 
15205
15242
  // src/components/Counter/Counter.styles.ts
15206
15243
  import { css as css50 } from "@emotion/react";
15207
- var counterContainer = (bgColor) => css50`
15244
+ var counterContainer = (bgColor, hasIcon) => css50`
15208
15245
  align-items: center;
15209
15246
  border-radius: var(--rounded-full);
15210
15247
  border: 1px solid var(--gray-300);
15211
15248
  background: ${bgColor};
15212
- color: var(--typography-base);
15249
+ color: ${bgColor === "var(--accent-dark)" ? "white" : "var(--typography-base)"};
15213
15250
  display: inline-flex;
15214
- font-size: var(--fs-xxs);
15251
+ gap: var(--spacing-xs);
15252
+ font-size: var(--fs-xs);
15215
15253
  font-weight: var(--fw-regular);
15216
15254
  justify-content: center;
15217
- width: var(--spacing-base);
15255
+ padding: 4px;
15256
+ width: ${hasIcon ? "auto" : "var(--spacing-base)"};
15218
15257
  height: var(--spacing-base);
15219
15258
  `;
15220
15259
  var counterZeroValue = css50`
@@ -15238,7 +15277,13 @@ var counterIcon = css50`
15238
15277
 
15239
15278
  // src/components/Counter/Counter.tsx
15240
15279
  import { jsx as jsx63, jsxs as jsxs39 } from "@emotion/react/jsx-runtime";
15241
- var Counter = ({ count, bgColor = "transparent", ...props }) => {
15280
+ var Counter = ({
15281
+ count,
15282
+ bgColor = "transparent",
15283
+ icon,
15284
+ iconColor = "auto",
15285
+ ...props
15286
+ }) => {
15242
15287
  if (typeof count === "undefined") {
15243
15288
  return null;
15244
15289
  }
@@ -15247,7 +15292,19 @@ var Counter = ({ count, bgColor = "transparent", ...props }) => {
15247
15292
  /* @__PURE__ */ jsx63(Icon, { icon: "math-plus", iconColor: "currentColor", size: "0.5rem", css: counterIcon })
15248
15293
  ] }) : count;
15249
15294
  const formatCount = count === 0 ? /* @__PURE__ */ jsx63("span", { css: counterZeroValue, title: `${count}` }) : isTripleDigits;
15250
- return /* @__PURE__ */ jsx63("div", { css: counterContainer(bgColor), ...props, children: formatCount });
15295
+ return /* @__PURE__ */ jsxs39("div", { css: counterContainer(bgColor, Boolean(icon)), ...props, children: [
15296
+ icon ? /* @__PURE__ */ jsx63(
15297
+ "span",
15298
+ {
15299
+ css: [
15300
+ iconColor ? functionalColors : void 0,
15301
+ { color: iconColor ? iconColor === "red" ? "var(--brand-secondary-5)" : iconColor : "inherit" }
15302
+ ],
15303
+ children: /* @__PURE__ */ jsx63(Icon, { icon, iconColor: "currentColor", size: "0.6rem" })
15304
+ }
15305
+ ) : null,
15306
+ /* @__PURE__ */ jsx63("span", { children: formatCount })
15307
+ ] });
15251
15308
  };
15252
15309
 
15253
15310
  // src/components/DashedBox/DashedBox.styles.ts
@@ -19274,7 +19331,8 @@ var inputIconBtn = css88`
19274
19331
  color: var(--gray-500);
19275
19332
  background: none;
19276
19333
  display: flex;
19277
- transition: background var(--duration-fast) var(--timing-ease-out),
19334
+ transition:
19335
+ background var(--duration-fast) var(--timing-ease-out),
19278
19336
  color var(--duration-fast) var(--timing-ease-out);
19279
19337
 
19280
19338
  &:hover,
@@ -19448,7 +19506,8 @@ var toggleInput2 = css89`
19448
19506
  background: var(--white);
19449
19507
  width: var(--spacing-base);
19450
19508
  height: var(--spacing-base);
19451
- transition: background var(--duration-fast) var(--timing-ease-out),
19509
+ transition:
19510
+ background var(--duration-fast) var(--timing-ease-out),
19452
19511
  border-color var(--duration-fast) var(--timing-ease-out),
19453
19512
  color var(--duration-fast) var(--timing-ease-out);
19454
19513
  font-size: var(--fs-sm);
@@ -19548,7 +19607,8 @@ var dataConnectButton = css89`
19548
19607
  display: flex;
19549
19608
  padding: var(--spacing-sm);
19550
19609
  position: relative;
19551
- transition: background var(--duration-fast) var(--timing-ease-out),
19610
+ transition:
19611
+ background var(--duration-fast) var(--timing-ease-out),
19552
19612
  outline-color var(--duration-fast) var(--timing-ease-out),
19553
19613
  color var(--duration-fast) var(--timing-ease-out);
19554
19614
  width: 100%;
@@ -20247,7 +20307,7 @@ var ParameterNameAndPublicIdInput = ({
20247
20307
  };
20248
20308
 
20249
20309
  // src/components/ParameterInputs/ParameterRichText.tsx
20250
- import { css as css100 } from "@emotion/react";
20310
+ import { css as css98 } from "@emotion/react";
20251
20311
  import { ListItemNode, ListNode as ListNode2 } from "@lexical/list";
20252
20312
  import {
20253
20313
  CODE,
@@ -20259,16 +20319,14 @@ import {
20259
20319
  UNORDERED_LIST
20260
20320
  } from "@lexical/markdown";
20261
20321
  import { LexicalComposer } from "@lexical/react/LexicalComposer";
20262
- import { useLexicalComposerContext as useLexicalComposerContext7 } from "@lexical/react/LexicalComposerContext";
20322
+ import { useLexicalComposerContext as useLexicalComposerContext5 } from "@lexical/react/LexicalComposerContext";
20263
20323
  import { ContentEditable } from "@lexical/react/LexicalContentEditable";
20264
20324
  import LexicalErrorBoundary from "@lexical/react/LexicalErrorBoundary";
20265
20325
  import { HistoryPlugin } from "@lexical/react/LexicalHistoryPlugin";
20266
20326
  import { ListPlugin } from "@lexical/react/LexicalListPlugin";
20267
20327
  import { MarkdownShortcutPlugin } from "@lexical/react/LexicalMarkdownShortcutPlugin";
20268
20328
  import { RichTextPlugin } from "@lexical/react/LexicalRichTextPlugin";
20269
- import { TablePlugin } from "@lexical/react/LexicalTablePlugin";
20270
20329
  import { HeadingNode, QuoteNode } from "@lexical/rich-text";
20271
- import { TableCellNode as TableCellNode2, TableNode, TableRowNode as TableRowNode2 } from "@lexical/table";
20272
20330
 
20273
20331
  // ../richtext/dist/index.mjs
20274
20332
  var richTextBuiltInElements = [
@@ -20316,10 +20374,6 @@ var richTextBuiltInElements = [
20316
20374
  label: "Code Block",
20317
20375
  type: "code"
20318
20376
  },
20319
- {
20320
- label: "Table",
20321
- type: "table"
20322
- },
20323
20377
  {
20324
20378
  label: "Dynamic Token",
20325
20379
  type: "variable"
@@ -20367,7 +20421,7 @@ var getLabelForElement = (type) => {
20367
20421
  // src/components/ParameterInputs/ParameterRichText.tsx
20368
20422
  import { deepEqual as deepEqual2 } from "fast-equals";
20369
20423
  import { ParagraphNode as ParagraphNode2 } from "lexical";
20370
- import { useEffect as useEffect23, useState as useState20 } from "react";
20424
+ import { useEffect as useEffect21, useRef as useRef12 } from "react";
20371
20425
 
20372
20426
  // src/components/ParameterInputs/rich-text/CustomCodeNode.ts
20373
20427
  import { CodeNode } from "@lexical/code";
@@ -20582,46 +20636,6 @@ var codeElement = css95`
20582
20636
  margin-bottom: 0;
20583
20637
  }
20584
20638
  `;
20585
- var tableElement = css95`
20586
- border-collapse: collapse;
20587
- border-spacing: 0;
20588
- border-color: var(--gray-300);
20589
- border-width: 1px;
20590
- border-style: solid;
20591
- margin-bottom: var(--spacing-base);
20592
- margin-top: 0;
20593
-
20594
- &:last-child {
20595
- margin-bottom: 0;
20596
- }
20597
- `;
20598
- var tableCellElement = css95`
20599
- background-color: var(--white);
20600
- border-color: var(--gray-300);
20601
- border-style: solid;
20602
- border-width: 1px;
20603
- box-sizing: unset;
20604
- min-width: 2rem;
20605
- outline: none;
20606
- padding: var(--spacing-sm);
20607
- text-align: start;
20608
- vertical-align: top;
20609
- width: 7rem;
20610
- `;
20611
- var tableHeaderElement = css95`
20612
- background-color: var(--gray-100);
20613
- border-color: var(--gray-300);
20614
- border-style: solid;
20615
- border-width: 1px;
20616
- box-sizing: unset;
20617
- font-weight: normal;
20618
- min-width: 2rem;
20619
- outline: none;
20620
- padding: var(--spacing-sm);
20621
- text-align: start;
20622
- vertical-align: top;
20623
- width: 7rem;
20624
- `;
20625
20639
 
20626
20640
  // src/components/ParameterInputs/rich-text/LinkNodePlugin.tsx
20627
20641
  import { css as css96 } from "@emotion/react";
@@ -20977,11 +20991,7 @@ var linkPopoverAnchor = css96`
20977
20991
  ${link}
20978
20992
  ${linkColorDefault}
20979
20993
  `;
20980
- function LinkNodePlugin({
20981
- onConnectLink,
20982
- getBoundPath,
20983
- positioningAnchorEl
20984
- }) {
20994
+ function LinkNodePlugin({ onConnectLink, getBoundPath }) {
20985
20995
  const parsePath = getBoundPath != null ? getBoundPath : function(path) {
20986
20996
  return path;
20987
20997
  };
@@ -21085,11 +21095,9 @@ function LinkNodePlugin({
21085
21095
  setLinkPopoverState(void 0);
21086
21096
  return;
21087
21097
  }
21088
- const elementRect = element.getBoundingClientRect();
21089
- const positioningAnchorRect = positioningAnchorEl.getBoundingClientRect();
21090
21098
  const { x, y } = {
21091
- x: elementRect.left - positioningAnchorRect.left + LINK_POPOVER_OFFSET_X,
21092
- y: elementRect.top + elementRect.height - positioningAnchorRect.top + LINK_POPOVER_OFFSET_Y
21099
+ x: element.offsetLeft + LINK_POPOVER_OFFSET_X,
21100
+ y: element.offsetTop + element.clientHeight + LINK_POPOVER_OFFSET_Y
21093
21101
  };
21094
21102
  setLinkPopoverState({
21095
21103
  node: linkNode,
@@ -21098,7 +21106,7 @@ function LinkNodePlugin({
21098
21106
  y
21099
21107
  }
21100
21108
  });
21101
- }, [editor, positioningAnchorEl]);
21109
+ }, [editor]);
21102
21110
  useEffect18(() => {
21103
21111
  return editor.registerUpdateListener(({ editorState }) => {
21104
21112
  requestAnimationFrame(() => {
@@ -21238,12 +21246,10 @@ import {
21238
21246
  import { useLexicalComposerContext as useLexicalComposerContext4 } from "@lexical/react/LexicalComposerContext";
21239
21247
  import { $createHeadingNode, $createQuoteNode, $isHeadingNode } from "@lexical/rich-text";
21240
21248
  import { $setBlocksType } from "@lexical/selection";
21241
- import { $createTableNodeWithDimensions } from "@lexical/table";
21242
21249
  import { $findMatchingParent, $getNearestNodeOfType } from "@lexical/utils";
21243
21250
  import {
21244
21251
  $createParagraphNode,
21245
21252
  $getSelection as $getSelection3,
21246
- $insertNodes,
21247
21253
  $isRangeSelection as $isRangeSelection3,
21248
21254
  $isRootOrShadowRoot,
21249
21255
  COMMAND_PRIORITY_CRITICAL as COMMAND_PRIORITY_CRITICAL2,
@@ -21253,14 +21259,12 @@ import {
21253
21259
  import { useCallback as useCallback11, useEffect as useEffect20, useMemo as useMemo6, useState as useState17 } from "react";
21254
21260
  import { Fragment as Fragment19, jsx as jsx130, jsxs as jsxs86 } from "@emotion/react/jsx-runtime";
21255
21261
  var toolbar = css97`
21256
- ${scrollbarStyles}
21257
21262
  background: var(--gray-50);
21258
21263
  border-radius: var(--rounded-base);
21259
21264
  display: flex;
21260
21265
  /* We add 1px because we use a 1px wide separator */
21261
21266
  gap: calc(var(--spacing-sm) + 1px);
21262
21267
  margin: calc(var(--spacing-sm) + var(--spacing-xs)) 0;
21263
- overflow: auto;
21264
21268
  padding: var(--spacing-sm);
21265
21269
  position: sticky;
21266
21270
  top: calc(var(--spacing-sm) * -2);
@@ -21268,7 +21272,6 @@ var toolbar = css97`
21268
21272
  `;
21269
21273
  var toolbarGroup = css97`
21270
21274
  display: flex;
21271
- flex-shrink: 0;
21272
21275
  gap: var(--spacing-xs);
21273
21276
  position: relative;
21274
21277
 
@@ -21291,7 +21294,6 @@ var richTextToolbarButton = css97`
21291
21294
  box-shadow: none;
21292
21295
  color: var(--gray-900);
21293
21296
  display: flex;
21294
- flex-shrink: 0;
21295
21297
  height: 32px;
21296
21298
  justify-content: center;
21297
21299
  min-width: 32px;
@@ -21300,10 +21302,6 @@ var richTextToolbarButton = css97`
21300
21302
  var richTextToolbarButtonActive = css97`
21301
21303
  background: var(--gray-200);
21302
21304
  `;
21303
- var textStyleButton = css97`
21304
- justify-content: space-between;
21305
- min-width: 7rem;
21306
- `;
21307
21305
  var toolbarIcon = css97`
21308
21306
  color: inherit;
21309
21307
  `;
@@ -21324,7 +21322,7 @@ var FORMATS_WITH_ICON = /* @__PURE__ */ new Map([
21324
21322
  ]);
21325
21323
  var HEADING_ELEMENTS = ["h1", "h2", "h3", "h4", "h5", "h6"];
21326
21324
  var TEXTUAL_ELEMENTS = HEADING_ELEMENTS;
21327
- var RichTextToolbar = ({ config, customControls, onInsertTable }) => {
21325
+ var RichTextToolbar = ({ config, customControls }) => {
21328
21326
  const [editor] = useLexicalComposerContext4();
21329
21327
  const {
21330
21328
  activeElement,
@@ -21340,39 +21338,26 @@ var RichTextToolbar = ({ config, customControls, onInsertTable }) => {
21340
21338
  visibleLists,
21341
21339
  codeElementVisible,
21342
21340
  quoteElementVisible,
21343
- visibleElementsWithIcons,
21344
- visibleInsertElementsWithIcons,
21345
- tableElementVisible
21341
+ visibleElementsWithIcons
21346
21342
  } = useRichTextToolbarState({ config });
21347
21343
  const onSelectElement = (type) => {
21348
21344
  if (activeElement === type) {
21349
21345
  return;
21350
21346
  }
21351
- editor.focus(() => {
21352
- editor.update(() => {
21353
- const selection = $getSelection3();
21354
- if (HEADING_ELEMENTS.includes(type)) {
21355
- $setBlocksType(selection, () => $createHeadingNode(type));
21356
- } else if (type === "paragraph") {
21357
- $setBlocksType(selection, () => $createParagraphNode());
21358
- } else if (type === "quote") {
21359
- $setBlocksType(selection, () => $createQuoteNode());
21360
- } else if (type === "code") {
21361
- $setBlocksType(selection, () => $createCodeNode());
21362
- } else if (type === "table" && onInsertTable) {
21363
- onInsertTable().then((dimensions) => {
21364
- if (!dimensions) {
21365
- return;
21366
- }
21367
- const { rows, columns } = dimensions;
21368
- editor.focus(() => {
21369
- editor.update(() => {
21370
- $insertNodes([$createTableNodeWithDimensions(rows, columns, false)]);
21371
- });
21372
- });
21373
- });
21374
- }
21375
- });
21347
+ editor.update(() => {
21348
+ const selection = $getSelection3();
21349
+ if (!$isRangeSelection3(selection)) {
21350
+ return;
21351
+ }
21352
+ if (HEADING_ELEMENTS.includes(type)) {
21353
+ $setBlocksType(selection, () => $createHeadingNode(type));
21354
+ } else if (type === "paragraph") {
21355
+ $setBlocksType(selection, () => $createParagraphNode());
21356
+ } else if (type === "quote") {
21357
+ $setBlocksType(selection, () => $createQuoteNode());
21358
+ } else if (type === "code") {
21359
+ $setBlocksType(selection, () => $createCodeNode());
21360
+ }
21376
21361
  });
21377
21362
  };
21378
21363
  const updateToolbar = useCallback11(() => {
@@ -21437,7 +21422,8 @@ var RichTextToolbar = ({ config, customControls, onInsertTable }) => {
21437
21422
  /* @__PURE__ */ jsxs86(
21438
21423
  Menu,
21439
21424
  {
21440
- menuTrigger: /* @__PURE__ */ jsxs86("button", { css: [richTextToolbarButton, textStyleButton], title: "Text styles", children: [
21425
+ menuLabel: "Elements",
21426
+ menuTrigger: /* @__PURE__ */ jsxs86("button", { css: richTextToolbarButton, title: "Text styles", children: [
21441
21427
  visibleTextualElements.some((element) => element.type === activeElement) ? getLabelForElement(activeElement) : getLabelForElement("paragraph"),
21442
21428
  " ",
21443
21429
  /* @__PURE__ */ jsx130(Icon, { icon: "chevron-down", css: [toolbarIcon, toolbarChevron], size: "1rem" })
@@ -21497,7 +21483,7 @@ var RichTextToolbar = ({ config, customControls, onInsertTable }) => {
21497
21483
  }
21498
21484
  ) : null
21499
21485
  ] }) : null,
21500
- visibleElementsWithIcons.size > 0 || customControls ? /* @__PURE__ */ jsxs86("div", { css: toolbarGroup, children: [
21486
+ visibleElementsWithIcons.size > 0 ? /* @__PURE__ */ jsxs86("div", { css: toolbarGroup, children: [
21501
21487
  linkElementVisible ? /* @__PURE__ */ jsx130(Tooltip, { title: "Link", placement: "top", children: /* @__PURE__ */ jsx130(
21502
21488
  "button",
21503
21489
  {
@@ -21536,50 +21522,28 @@ var RichTextToolbar = ({ config, customControls, onInsertTable }) => {
21536
21522
  }
21537
21523
  ) }) : null
21538
21524
  ] }) : null,
21539
- customControls ? customControls : null
21525
+ quoteElementVisible ? /* @__PURE__ */ jsx130(Tooltip, { title: "Blockquote", placement: "top", children: /* @__PURE__ */ jsx130(
21526
+ "button",
21527
+ {
21528
+ onClick: () => {
21529
+ activeElement === "quote" ? onSelectElement("paragraph") : onSelectElement("quote");
21530
+ },
21531
+ css: [richTextToolbarButton, activeElement === "quote" ? richTextToolbarButtonActive : null],
21532
+ children: /* @__PURE__ */ jsx130(RichTextToolbarIcon, { icon: "quote" })
21533
+ }
21534
+ ) }) : null,
21535
+ codeElementVisible ? /* @__PURE__ */ jsx130(Tooltip, { title: "Code Block", placement: "top", children: /* @__PURE__ */ jsx130(
21536
+ "button",
21537
+ {
21538
+ onClick: () => {
21539
+ activeElement === "code" ? onSelectElement("paragraph") : onSelectElement("code");
21540
+ },
21541
+ css: [richTextToolbarButton, activeElement === "code" ? richTextToolbarButtonActive : null],
21542
+ children: /* @__PURE__ */ jsx130(RichTextToolbarIcon, { icon: "code-slash" })
21543
+ }
21544
+ ) }) : null
21540
21545
  ] }) : null,
21541
- visibleInsertElementsWithIcons.size > 0 ? /* @__PURE__ */ jsx130("div", { css: toolbarGroup, children: /* @__PURE__ */ jsxs86(
21542
- Menu,
21543
- {
21544
- menuTrigger: /* @__PURE__ */ jsxs86("button", { css: richTextToolbarButton, title: "Insert block element", children: [
21545
- "Insert",
21546
- /* @__PURE__ */ jsx130(Icon, { icon: "chevron-down", css: [toolbarIcon, toolbarChevron], size: "1rem" })
21547
- ] }),
21548
- placement: "bottom-start",
21549
- children: [
21550
- quoteElementVisible ? /* @__PURE__ */ jsx130(
21551
- MenuItem,
21552
- {
21553
- onClick: () => {
21554
- onSelectElement("quote");
21555
- },
21556
- icon: /* @__PURE__ */ jsx130(Icon, { icon: "quote", iconColor: "currentColor" }),
21557
- children: "Quote"
21558
- }
21559
- ) : null,
21560
- codeElementVisible ? /* @__PURE__ */ jsx130(
21561
- MenuItem,
21562
- {
21563
- onClick: () => {
21564
- onSelectElement("code");
21565
- },
21566
- icon: /* @__PURE__ */ jsx130(Icon, { icon: "code-slash", iconColor: "currentColor" }),
21567
- children: "Code"
21568
- }
21569
- ) : null,
21570
- tableElementVisible && onInsertTable !== void 0 ? /* @__PURE__ */ jsx130(
21571
- MenuItem,
21572
- {
21573
- onClick: () => {
21574
- onSelectElement("table");
21575
- },
21576
- icon: /* @__PURE__ */ jsx130(Icon, { icon: "view-grid", iconColor: "currentColor" }),
21577
- children: "Table"
21578
- }
21579
- ) : null
21580
- ]
21581
- }
21582
- ) }) : null
21546
+ customControls ? /* @__PURE__ */ jsx130("div", { css: toolbarGroup, children: customControls }) : null
21583
21547
  ] });
21584
21548
  };
21585
21549
  var RichTextToolbar_default = RichTextToolbar;
@@ -21656,9 +21620,6 @@ var useRichTextToolbarState = ({ config }) => {
21656
21620
  const codeElementVisible = useMemo6(() => {
21657
21621
  return enabledBuiltInElements.some((element) => element.type === "code") || activeElement === "code";
21658
21622
  }, [activeElement, enabledBuiltInElements]);
21659
- const tableElementVisible = useMemo6(() => {
21660
- return enabledBuiltInElements.some((element) => element.type === "table") || activeElement === "table";
21661
- }, [activeElement, enabledBuiltInElements]);
21662
21623
  const visibleElementsWithIcons = useMemo6(() => {
21663
21624
  const visibleElements = /* @__PURE__ */ new Set();
21664
21625
  if (linkElementVisible) {
@@ -21669,21 +21630,14 @@ var useRichTextToolbarState = ({ config }) => {
21669
21630
  visibleElements.add(type);
21670
21631
  });
21671
21632
  }
21672
- return visibleElements;
21673
- }, [linkElementVisible, visibleLists]);
21674
- const visibleInsertElementsWithIcons = useMemo6(() => {
21675
- const visibleElements = /* @__PURE__ */ new Set();
21676
21633
  if (quoteElementVisible) {
21677
21634
  visibleElements.add("quote");
21678
21635
  }
21679
21636
  if (codeElementVisible) {
21680
21637
  visibleElements.add("code");
21681
21638
  }
21682
- if (tableElementVisible) {
21683
- visibleElements.add("table");
21684
- }
21685
21639
  return visibleElements;
21686
- }, [codeElementVisible, quoteElementVisible, tableElementVisible]);
21640
+ }, [codeElementVisible, linkElementVisible, quoteElementVisible, visibleLists]);
21687
21641
  return {
21688
21642
  activeFormats,
21689
21643
  setActiveFormats,
@@ -21698,718 +21652,12 @@ var useRichTextToolbarState = ({ config }) => {
21698
21652
  visibleLists,
21699
21653
  quoteElementVisible,
21700
21654
  codeElementVisible,
21701
- tableElementVisible,
21702
- visibleElementsWithIcons,
21703
- visibleInsertElementsWithIcons
21655
+ visibleElementsWithIcons
21704
21656
  };
21705
21657
  };
21706
21658
 
21707
- // src/components/ParameterInputs/rich-text/TableActionMenuPlugin.tsx
21708
- import { css as css98 } from "@emotion/react";
21709
- import { useLexicalComposerContext as useLexicalComposerContext5 } from "@lexical/react/LexicalComposerContext";
21710
- import { useLexicalEditable } from "@lexical/react/useLexicalEditable";
21711
- import {
21712
- $deleteTableColumn__EXPERIMENTAL,
21713
- $deleteTableRow__EXPERIMENTAL,
21714
- $getTableCellNodeFromLexicalNode,
21715
- $getTableColumnIndexFromTableCellNode,
21716
- $getTableNodeFromLexicalNodeOrThrow,
21717
- $getTableRowIndexFromTableCellNode,
21718
- $insertTableColumn__EXPERIMENTAL,
21719
- $insertTableRow__EXPERIMENTAL,
21720
- $isTableCellNode,
21721
- $isTableRowNode,
21722
- $isTableSelection,
21723
- getTableObserverFromTableElement,
21724
- TableCellHeaderStates,
21725
- TableCellNode
21726
- } from "@lexical/table";
21727
- import { $getRoot, $getSelection as $getSelection4, $isRangeSelection as $isRangeSelection4 } from "lexical";
21728
- import { forwardRef as forwardRef22, useCallback as useCallback12, useEffect as useEffect21, useLayoutEffect, useState as useState18 } from "react";
21729
- import { jsx as jsx131, jsxs as jsxs87 } from "@emotion/react/jsx-runtime";
21730
- function computeSelectionCount(selection) {
21731
- const selectionShape = selection.getShape();
21732
- return {
21733
- columns: selectionShape.toX - selectionShape.fromX + 1,
21734
- rows: selectionShape.toY - selectionShape.fromY + 1
21735
- };
21736
- }
21737
- var tableActionMenuTrigger = css98`
21738
- position: absolute;
21739
- transform: translate(calc(-100% - 1px), 1px);
21740
- `;
21741
- var TableActionMenuTrigger = forwardRef22((props, ref) => {
21742
- const { tableCellEl, positioningAnchorEl, ...rest } = props;
21743
- const [coordinates, setCoordinates] = useState18({ x: 0, y: 0 });
21744
- useLayoutEffect(() => {
21745
- const rect = tableCellEl.getBoundingClientRect();
21746
- const parentRect = positioningAnchorEl.getBoundingClientRect();
21747
- const relativeX = rect.right - parentRect.left;
21748
- const relativeY = rect.top - parentRect.top;
21749
- setCoordinates({ x: relativeX, y: relativeY });
21750
- }, [tableCellEl, positioningAnchorEl]);
21751
- return /* @__PURE__ */ jsx131(
21752
- IconButton,
21753
- {
21754
- ref,
21755
- css: [
21756
- tableActionMenuTrigger,
21757
- {
21758
- top: coordinates.y,
21759
- left: coordinates.x
21760
- }
21761
- ],
21762
- size: "xs",
21763
- buttonType: "unimportant",
21764
- ...rest,
21765
- children: /* @__PURE__ */ jsx131(Icon, { icon: "chevron-down", size: "1rem", iconColor: "currentColor" })
21766
- }
21767
- );
21768
- });
21769
- TableActionMenuTrigger.displayName = "TableActionMenuTrigger";
21770
- function TableActionMenu({
21771
- tableCellNode: _tableCellNode,
21772
- menuPortalEl,
21773
- tableCellEl,
21774
- positioningAnchorEl
21775
- }) {
21776
- const [editor] = useLexicalComposerContext5();
21777
- const [tableCellNode, updateTableCellNode] = useState18(_tableCellNode);
21778
- const [selectionCounts, updateSelectionCounts] = useState18({
21779
- columns: 1,
21780
- rows: 1
21781
- });
21782
- const [menuTriggerKey, setMenuTriggerKey] = useState18(0);
21783
- const incrementMenuTriggerKey = () => {
21784
- setMenuTriggerKey((key) => key += 1);
21785
- };
21786
- useEffect21(() => {
21787
- return editor.registerMutationListener(
21788
- TableCellNode,
21789
- (nodeMutations) => {
21790
- const nodeUpdated = nodeMutations.get(tableCellNode.getKey()) === "updated";
21791
- if (nodeUpdated) {
21792
- editor.getEditorState().read(() => {
21793
- updateTableCellNode(tableCellNode.getLatest());
21794
- });
21795
- }
21796
- },
21797
- { skipInitialization: true }
21798
- );
21799
- }, [editor, tableCellNode]);
21800
- useEffect21(() => {
21801
- editor.getEditorState().read(() => {
21802
- const selection = $getSelection4();
21803
- if ($isTableSelection(selection)) {
21804
- updateSelectionCounts(computeSelectionCount(selection));
21805
- }
21806
- });
21807
- }, [editor]);
21808
- const clearTableSelection = useCallback12(() => {
21809
- editor.update(() => {
21810
- if (tableCellNode.isAttached()) {
21811
- const tableNode = $getTableNodeFromLexicalNodeOrThrow(tableCellNode);
21812
- const tableElement2 = editor.getElementByKey(
21813
- tableNode.getKey()
21814
- );
21815
- if (!tableElement2) {
21816
- throw new Error("Expected to find tableElement in DOM");
21817
- }
21818
- const tableSelection = getTableObserverFromTableElement(tableElement2);
21819
- if (tableSelection !== null) {
21820
- tableSelection.clearHighlight();
21821
- }
21822
- tableNode.markDirty();
21823
- updateTableCellNode(tableCellNode.getLatest());
21824
- }
21825
- const rootNode = $getRoot();
21826
- rootNode.selectStart();
21827
- });
21828
- }, [editor, tableCellNode]);
21829
- const insertTableRowAtSelection = useCallback12(
21830
- (shouldInsertAfter) => {
21831
- editor.update(() => {
21832
- $insertTableRow__EXPERIMENTAL(shouldInsertAfter);
21833
- });
21834
- incrementMenuTriggerKey();
21835
- },
21836
- [editor]
21837
- );
21838
- const insertTableColumnAtSelection = useCallback12(
21839
- (shouldInsertAfter) => {
21840
- editor.update(() => {
21841
- for (let i = 0; i < selectionCounts.columns; i++) {
21842
- $insertTableColumn__EXPERIMENTAL(shouldInsertAfter);
21843
- }
21844
- });
21845
- incrementMenuTriggerKey();
21846
- },
21847
- [editor, selectionCounts.columns]
21848
- );
21849
- const deleteTableRowAtSelection = useCallback12(() => {
21850
- editor.update(() => {
21851
- $deleteTableRow__EXPERIMENTAL();
21852
- });
21853
- incrementMenuTriggerKey();
21854
- }, [editor]);
21855
- const deleteTableAtSelection = useCallback12(() => {
21856
- editor.update(() => {
21857
- const tableNode = $getTableNodeFromLexicalNodeOrThrow(tableCellNode);
21858
- tableNode.remove();
21859
- clearTableSelection();
21860
- });
21861
- }, [editor, tableCellNode, clearTableSelection]);
21862
- const deleteTableColumnAtSelection = useCallback12(() => {
21863
- editor.update(() => {
21864
- $deleteTableColumn__EXPERIMENTAL();
21865
- clearTableSelection();
21866
- });
21867
- incrementMenuTriggerKey();
21868
- }, [editor, clearTableSelection]);
21869
- const toggleTableRowIsHeader = useCallback12(() => {
21870
- editor.update(() => {
21871
- const tableNode = $getTableNodeFromLexicalNodeOrThrow(tableCellNode);
21872
- const tableRowIndex = $getTableRowIndexFromTableCellNode(tableCellNode);
21873
- const tableRows = tableNode.getChildren();
21874
- if (tableRowIndex >= tableRows.length || tableRowIndex < 0) {
21875
- throw new Error("Expected table cell to be inside of table row.");
21876
- }
21877
- const tableRow2 = tableRows[tableRowIndex];
21878
- if (!$isTableRowNode(tableRow2)) {
21879
- throw new Error("Expected table row");
21880
- }
21881
- tableRow2.getChildren().forEach((tableCell) => {
21882
- if (!$isTableCellNode(tableCell)) {
21883
- throw new Error("Expected table cell");
21884
- }
21885
- tableCell.toggleHeaderStyle(TableCellHeaderStates.ROW);
21886
- });
21887
- clearTableSelection();
21888
- });
21889
- }, [editor, tableCellNode, clearTableSelection]);
21890
- const toggleTableColumnIsHeader = useCallback12(() => {
21891
- editor.update(() => {
21892
- const tableNode = $getTableNodeFromLexicalNodeOrThrow(tableCellNode);
21893
- const tableColumnIndex = $getTableColumnIndexFromTableCellNode(tableCellNode);
21894
- const tableRows = tableNode.getChildren();
21895
- const maxRowsLength = Math.max(...tableRows.map((row) => row.getChildren().length));
21896
- if (tableColumnIndex >= maxRowsLength || tableColumnIndex < 0) {
21897
- throw new Error("Expected table cell to be inside of table row.");
21898
- }
21899
- for (let r = 0; r < tableRows.length; r++) {
21900
- const tableRow2 = tableRows[r];
21901
- if (!$isTableRowNode(tableRow2)) {
21902
- throw new Error("Expected table row");
21903
- }
21904
- const tableCells = tableRow2.getChildren();
21905
- if (tableColumnIndex >= tableCells.length) {
21906
- continue;
21907
- }
21908
- const tableCell = tableCells[tableColumnIndex];
21909
- if (!$isTableCellNode(tableCell)) {
21910
- throw new Error("Expected table cell");
21911
- }
21912
- tableCell.toggleHeaderStyle(TableCellHeaderStates.COLUMN);
21913
- }
21914
- clearTableSelection();
21915
- });
21916
- }, [editor, tableCellNode, clearTableSelection]);
21917
- const menuItemCss = css98({
21918
- fontSize: "var(--fs-sm)"
21919
- });
21920
- return /* @__PURE__ */ jsxs87(
21921
- Menu,
21922
- {
21923
- menuTrigger: /* @__PURE__ */ jsx131(
21924
- TableActionMenuTrigger,
21925
- {
21926
- tableCellEl,
21927
- positioningAnchorEl
21928
- },
21929
- menuTriggerKey
21930
- ),
21931
- portalElement: menuPortalEl,
21932
- maxMenuHeight: "300px",
21933
- children: [
21934
- /* @__PURE__ */ jsxs87(
21935
- MenuItem,
21936
- {
21937
- onClick: () => {
21938
- insertTableRowAtSelection(false);
21939
- },
21940
- css: menuItemCss,
21941
- children: [
21942
- "Insert ",
21943
- selectionCounts.rows === 1 ? "row" : `${selectionCounts.rows} rows`,
21944
- " above"
21945
- ]
21946
- }
21947
- ),
21948
- /* @__PURE__ */ jsxs87(MenuItem, { onClick: () => insertTableRowAtSelection(true), css: menuItemCss, children: [
21949
- "Insert ",
21950
- selectionCounts.rows === 1 ? "row" : `${selectionCounts.rows} rows`,
21951
- " below"
21952
- ] }),
21953
- /* @__PURE__ */ jsx131(MenuItemSeparator, {}),
21954
- /* @__PURE__ */ jsxs87(MenuItem, { onClick: () => insertTableColumnAtSelection(false), css: menuItemCss, children: [
21955
- "Insert ",
21956
- selectionCounts.columns === 1 ? "column" : `${selectionCounts.columns} columns`,
21957
- " left"
21958
- ] }),
21959
- /* @__PURE__ */ jsxs87(MenuItem, { onClick: () => insertTableColumnAtSelection(true), css: menuItemCss, children: [
21960
- "Insert ",
21961
- selectionCounts.columns === 1 ? "column" : `${selectionCounts.columns} columns`,
21962
- " right"
21963
- ] }),
21964
- /* @__PURE__ */ jsx131(MenuItemSeparator, {}),
21965
- /* @__PURE__ */ jsx131(MenuItem, { onClick: () => deleteTableColumnAtSelection(), css: menuItemCss, children: "Delete column" }),
21966
- /* @__PURE__ */ jsx131(MenuItem, { onClick: () => deleteTableRowAtSelection(), css: menuItemCss, children: "Delete row" }),
21967
- /* @__PURE__ */ jsx131(MenuItem, { onClick: () => deleteTableAtSelection(), css: menuItemCss, children: "Delete table" }),
21968
- /* @__PURE__ */ jsx131(MenuItemSeparator, {}),
21969
- /* @__PURE__ */ jsxs87(MenuItem, { onClick: () => toggleTableRowIsHeader(), css: menuItemCss, children: [
21970
- (tableCellNode.__headerState & TableCellHeaderStates.ROW) === TableCellHeaderStates.ROW ? "Remove" : "Add",
21971
- " ",
21972
- "row header"
21973
- ] }),
21974
- /* @__PURE__ */ jsxs87(MenuItem, { onClick: () => toggleTableColumnIsHeader(), css: menuItemCss, children: [
21975
- (tableCellNode.__headerState & TableCellHeaderStates.COLUMN) === TableCellHeaderStates.COLUMN ? "Remove" : "Add",
21976
- " ",
21977
- "column header"
21978
- ] })
21979
- ]
21980
- }
21981
- );
21982
- }
21983
- function TableCellActionMenuContainer({
21984
- menuPortalEl,
21985
- positioningAnchorEl
21986
- }) {
21987
- const [editor] = useLexicalComposerContext5();
21988
- const [tableCellNode, setTableMenuCellNode] = useState18(null);
21989
- const [tableCellNodeEl, _setTableMenuCellNodeEl] = useState18(null);
21990
- const [tableCellMenuPortalEl, setTableMenuCellMenuPortalEl] = useState18(null);
21991
- useEffect21(() => {
21992
- const newPortalEl = document.createElement("div");
21993
- setTableMenuCellMenuPortalEl(newPortalEl);
21994
- menuPortalEl.appendChild(newPortalEl);
21995
- return () => {
21996
- newPortalEl.remove();
21997
- };
21998
- }, [menuPortalEl]);
21999
- const setTableMenuCellNodeElem = useCallback12((elem) => {
22000
- if (elem) {
22001
- _setTableMenuCellNodeEl(elem);
22002
- } else {
22003
- _setTableMenuCellNodeEl(null);
22004
- }
22005
- }, []);
22006
- const $moveMenu = useCallback12(() => {
22007
- const selection = $getSelection4();
22008
- const nativeSelection = window.getSelection();
22009
- const activeElement = document.activeElement;
22010
- if (selection == null) {
22011
- setTableMenuCellNode(null);
22012
- return;
22013
- }
22014
- const rootElement = editor.getRootElement();
22015
- if ($isRangeSelection4(selection) && rootElement !== null && nativeSelection !== null && rootElement.contains(nativeSelection.anchorNode)) {
22016
- const tableCellNodeFromSelection = $getTableCellNodeFromLexicalNode(selection.anchor.getNode());
22017
- if (tableCellNodeFromSelection == null) {
22018
- setTableMenuCellNode(null);
22019
- setTableMenuCellNodeElem(null);
22020
- return;
22021
- }
22022
- const tableCellParentNodeDOM = editor.getElementByKey(tableCellNodeFromSelection.getKey());
22023
- if (tableCellParentNodeDOM == null) {
22024
- setTableMenuCellNode(null);
22025
- setTableMenuCellNodeElem(null);
22026
- return;
22027
- }
22028
- setTableMenuCellNode(tableCellNodeFromSelection);
22029
- setTableMenuCellNodeElem(tableCellParentNodeDOM);
22030
- } else if (!activeElement) {
22031
- setTableMenuCellNode(null);
22032
- setTableMenuCellNodeElem(null);
22033
- }
22034
- }, [editor, setTableMenuCellNodeElem]);
22035
- useEffect21(() => {
22036
- return editor.registerUpdateListener(() => {
22037
- editor.getEditorState().read(() => {
22038
- $moveMenu();
22039
- });
22040
- });
22041
- });
22042
- return tableCellNode != null && tableCellNodeEl != null && tableCellMenuPortalEl != null && /* @__PURE__ */ jsx131(
22043
- TableActionMenu,
22044
- {
22045
- tableCellNode,
22046
- menuPortalEl: tableCellMenuPortalEl,
22047
- tableCellEl: tableCellNodeEl,
22048
- positioningAnchorEl
22049
- },
22050
- tableCellNode.getKey()
22051
- );
22052
- }
22053
- function TableActionMenuPlugin({ positioningAnchorEl }) {
22054
- const isEditable = useLexicalEditable();
22055
- return isEditable ? /* @__PURE__ */ jsx131(
22056
- TableCellActionMenuContainer,
22057
- {
22058
- menuPortalEl: positioningAnchorEl,
22059
- positioningAnchorEl
22060
- }
22061
- ) : null;
22062
- }
22063
-
22064
- // src/components/ParameterInputs/rich-text/TableCellResizerPlugin.tsx
22065
- import { css as css99 } from "@emotion/react";
22066
- import { useLexicalComposerContext as useLexicalComposerContext6 } from "@lexical/react/LexicalComposerContext";
22067
- import { useLexicalEditable as useLexicalEditable2 } from "@lexical/react/useLexicalEditable";
22068
- import {
22069
- $computeTableMapSkipCellCheck,
22070
- $getTableNodeFromLexicalNodeOrThrow as $getTableNodeFromLexicalNodeOrThrow2,
22071
- $getTableRowIndexFromTableCellNode as $getTableRowIndexFromTableCellNode2,
22072
- $isTableCellNode as $isTableCellNode2,
22073
- $isTableRowNode as $isTableRowNode2
22074
- } from "@lexical/table";
22075
- import { calculateZoomLevel } from "@lexical/utils";
22076
- import { $getNearestNodeFromDOMNode } from "lexical";
22077
- import { useCallback as useCallback13, useEffect as useEffect22, useMemo as useMemo7, useRef as useRef12, useState as useState19 } from "react";
22078
- import { createPortal as createPortal3 } from "react-dom";
22079
- import { Fragment as Fragment20, jsx as jsx132, jsxs as jsxs88 } from "@emotion/react/jsx-runtime";
22080
- var MIN_ROW_HEIGHT = 33;
22081
- var MIN_COLUMN_WIDTH = 50;
22082
- var tableResizer = css99`
22083
- position: absolute;
22084
- z-index: var(--z-10);
22085
- `;
22086
- var fixedGetDOMCellFromTarget = (node) => {
22087
- let currentNode = node;
22088
- while (currentNode != null) {
22089
- const nodeName = currentNode.nodeName;
22090
- if (nodeName === "TD" || nodeName === "TH") {
22091
- const cell2 = currentNode._cell;
22092
- if (cell2 === void 0) {
22093
- return {
22094
- elem: currentNode
22095
- };
22096
- }
22097
- return cell2;
22098
- }
22099
- currentNode = currentNode.parentNode;
22100
- }
22101
- return null;
22102
- };
22103
- function TableCellResizer({ editor, positioningAnchorEl }) {
22104
- const targetRef = useRef12(null);
22105
- const resizerRef = useRef12(null);
22106
- const tableRectRef = useRef12(null);
22107
- const mouseStartPosRef = useRef12(null);
22108
- const [mouseCurrentPos, updateMouseCurrentPos] = useState19(null);
22109
- const [activeCell, updateActiveCell] = useState19(null);
22110
- const [isMouseDown, updateIsMouseDown] = useState19(false);
22111
- const [draggingDirection, updateDraggingDirection] = useState19(null);
22112
- const resetState = useCallback13(() => {
22113
- updateActiveCell(null);
22114
- targetRef.current = null;
22115
- updateDraggingDirection(null);
22116
- mouseStartPosRef.current = null;
22117
- tableRectRef.current = null;
22118
- }, []);
22119
- const isMouseDownOnEvent = (event) => {
22120
- return (event.buttons & 1) === 1;
22121
- };
22122
- useEffect22(() => {
22123
- const onMouseMove = (event) => {
22124
- setTimeout(() => {
22125
- const target = event.target;
22126
- if (draggingDirection) {
22127
- updateMouseCurrentPos({
22128
- x: event.clientX,
22129
- y: event.clientY
22130
- });
22131
- return;
22132
- }
22133
- updateIsMouseDown(isMouseDownOnEvent(event));
22134
- if (resizerRef.current && resizerRef.current.contains(target)) {
22135
- return;
22136
- }
22137
- if (targetRef.current !== target) {
22138
- targetRef.current = target;
22139
- const cell2 = fixedGetDOMCellFromTarget(target);
22140
- if (cell2 && activeCell !== cell2) {
22141
- editor.update(() => {
22142
- const tableCellNode = $getNearestNodeFromDOMNode(cell2.elem);
22143
- if (!tableCellNode) {
22144
- throw new Error("TableCellResizer: Table cell node not found.");
22145
- }
22146
- const tableNode = $getTableNodeFromLexicalNodeOrThrow2(tableCellNode);
22147
- const tableElement2 = editor.getElementByKey(tableNode.getKey());
22148
- if (!tableElement2) {
22149
- throw new Error("TableCellResizer: Table element not found.");
22150
- }
22151
- targetRef.current = target;
22152
- tableRectRef.current = tableElement2.getBoundingClientRect();
22153
- updateActiveCell(cell2);
22154
- });
22155
- } else if (cell2 == null) {
22156
- resetState();
22157
- }
22158
- }
22159
- }, 0);
22160
- };
22161
- const onMouseDown = () => {
22162
- setTimeout(() => {
22163
- updateIsMouseDown(true);
22164
- }, 0);
22165
- };
22166
- const onMouseUp = () => {
22167
- setTimeout(() => {
22168
- updateIsMouseDown(false);
22169
- }, 0);
22170
- };
22171
- const removeRootListener = editor.registerRootListener((rootElement, prevRootElement) => {
22172
- rootElement == null ? void 0 : rootElement.addEventListener("mousemove", onMouseMove);
22173
- rootElement == null ? void 0 : rootElement.addEventListener("mousedown", onMouseDown);
22174
- rootElement == null ? void 0 : rootElement.addEventListener("mouseup", onMouseUp);
22175
- prevRootElement == null ? void 0 : prevRootElement.removeEventListener("mousemove", onMouseMove);
22176
- prevRootElement == null ? void 0 : prevRootElement.removeEventListener("mousedown", onMouseDown);
22177
- prevRootElement == null ? void 0 : prevRootElement.removeEventListener("mouseup", onMouseUp);
22178
- });
22179
- return () => {
22180
- removeRootListener();
22181
- };
22182
- }, [activeCell, draggingDirection, editor, resetState]);
22183
- const isHeightChanging = (direction) => {
22184
- if (direction === "bottom") {
22185
- return true;
22186
- }
22187
- return false;
22188
- };
22189
- const updateRowHeight = useCallback13(
22190
- (heightChange) => {
22191
- if (!activeCell) {
22192
- throw new Error("TableCellResizer: Expected active cell.");
22193
- }
22194
- editor.update(
22195
- () => {
22196
- const tableCellNode = $getNearestNodeFromDOMNode(activeCell.elem);
22197
- if (!$isTableCellNode2(tableCellNode)) {
22198
- throw new Error("TableCellResizer: Table cell node not found.");
22199
- }
22200
- const tableNode = $getTableNodeFromLexicalNodeOrThrow2(tableCellNode);
22201
- const tableRowIndex = $getTableRowIndexFromTableCellNode2(tableCellNode);
22202
- const tableRows = tableNode.getChildren();
22203
- if (tableRowIndex >= tableRows.length || tableRowIndex < 0) {
22204
- throw new Error("Expected table cell to be inside of table row.");
22205
- }
22206
- const tableRow2 = tableRows[tableRowIndex];
22207
- if (!$isTableRowNode2(tableRow2)) {
22208
- throw new Error("Expected table row");
22209
- }
22210
- let height = tableRow2.getHeight();
22211
- if (height === void 0) {
22212
- const rowCells = tableRow2.getChildren();
22213
- height = Math.min(...rowCells.map((cell2) => {
22214
- var _a;
22215
- return (_a = getCellNodeHeight(cell2, editor)) != null ? _a : Infinity;
22216
- }));
22217
- }
22218
- const newHeight = Math.max(height + heightChange, MIN_ROW_HEIGHT);
22219
- tableRow2.setHeight(newHeight);
22220
- },
22221
- { tag: "skip-scroll-into-view" }
22222
- );
22223
- },
22224
- [activeCell, editor]
22225
- );
22226
- const getCellNodeWidth = (cell2, activeEditor) => {
22227
- const width = cell2.getWidth();
22228
- if (width !== void 0) {
22229
- return width;
22230
- }
22231
- const domCellNode = activeEditor.getElementByKey(cell2.getKey());
22232
- if (domCellNode == null) {
22233
- return void 0;
22234
- }
22235
- const computedStyle = getComputedStyle(domCellNode);
22236
- return domCellNode.clientWidth - parseFloat(computedStyle.paddingLeft) - parseFloat(computedStyle.paddingRight);
22237
- };
22238
- const getCellNodeHeight = (cell2, activeEditor) => {
22239
- const domCellNode = activeEditor.getElementByKey(cell2.getKey());
22240
- return domCellNode == null ? void 0 : domCellNode.clientHeight;
22241
- };
22242
- const getCellColumnIndex = (tableCellNode, tableMap) => {
22243
- for (let row = 0; row < tableMap.length; row++) {
22244
- for (let column = 0; column < tableMap[row].length; column++) {
22245
- if (tableMap[row][column].cell === tableCellNode) {
22246
- return column;
22247
- }
22248
- }
22249
- }
22250
- };
22251
- const updateColumnWidth = useCallback13(
22252
- (widthChange) => {
22253
- if (!activeCell) {
22254
- throw new Error("TableCellResizer: Expected active cell.");
22255
- }
22256
- editor.update(
22257
- () => {
22258
- const tableCellNode = $getNearestNodeFromDOMNode(activeCell.elem);
22259
- if (!$isTableCellNode2(tableCellNode)) {
22260
- throw new Error("TableCellResizer: Table cell node not found.");
22261
- }
22262
- const tableNode = $getTableNodeFromLexicalNodeOrThrow2(tableCellNode);
22263
- const [tableMap] = $computeTableMapSkipCellCheck(tableNode, null, null);
22264
- const columnIndex = getCellColumnIndex(tableCellNode, tableMap);
22265
- if (columnIndex === void 0) {
22266
- throw new Error("TableCellResizer: Table column not found.");
22267
- }
22268
- for (let row = 0; row < tableMap.length; row++) {
22269
- const cell2 = tableMap[row][columnIndex];
22270
- if (cell2.startRow === row && (columnIndex === tableMap[row].length - 1 || tableMap[row][columnIndex].cell !== tableMap[row][columnIndex + 1].cell)) {
22271
- const width = getCellNodeWidth(cell2.cell, editor);
22272
- if (width === void 0) {
22273
- continue;
22274
- }
22275
- const newWidth = Math.max(width + widthChange, MIN_COLUMN_WIDTH);
22276
- cell2.cell.setWidth(newWidth);
22277
- }
22278
- }
22279
- },
22280
- { tag: "skip-scroll-into-view" }
22281
- );
22282
- },
22283
- [activeCell, editor]
22284
- );
22285
- const mouseUpHandler = useCallback13(
22286
- (direction) => {
22287
- const handler = (event) => {
22288
- event.preventDefault();
22289
- event.stopPropagation();
22290
- if (!activeCell) {
22291
- throw new Error("TableCellResizer: Expected active cell.");
22292
- }
22293
- if (mouseStartPosRef.current) {
22294
- const { x, y } = mouseStartPosRef.current;
22295
- if (activeCell === null) {
22296
- return;
22297
- }
22298
- const zoom = calculateZoomLevel(event.target);
22299
- if (isHeightChanging(direction)) {
22300
- const heightChange = (event.clientY - y) / zoom;
22301
- updateRowHeight(heightChange);
22302
- } else {
22303
- const widthChange = (event.clientX - x) / zoom;
22304
- updateColumnWidth(widthChange);
22305
- }
22306
- resetState();
22307
- document.removeEventListener("mouseup", handler);
22308
- }
22309
- };
22310
- return handler;
22311
- },
22312
- [activeCell, resetState, updateColumnWidth, updateRowHeight]
22313
- );
22314
- const toggleResize = useCallback13(
22315
- (direction) => (event) => {
22316
- event.preventDefault();
22317
- event.stopPropagation();
22318
- if (!activeCell) {
22319
- throw new Error("TableCellResizer: Expected active cell.");
22320
- }
22321
- mouseStartPosRef.current = {
22322
- x: event.clientX,
22323
- y: event.clientY
22324
- };
22325
- updateMouseCurrentPos(mouseStartPosRef.current);
22326
- updateDraggingDirection(direction);
22327
- document.addEventListener("mouseup", mouseUpHandler(direction));
22328
- },
22329
- [activeCell, mouseUpHandler]
22330
- );
22331
- const getResizers = useCallback13(() => {
22332
- if (activeCell) {
22333
- const { height, width, top, left } = activeCell.elem.getBoundingClientRect();
22334
- const parentRect = positioningAnchorEl.getBoundingClientRect();
22335
- const zoom = calculateZoomLevel(activeCell.elem);
22336
- const zoneWidth = 10;
22337
- const styles = {
22338
- bottom: {
22339
- backgroundColor: "none",
22340
- cursor: "row-resize",
22341
- height: `${zoneWidth}px`,
22342
- left: `${left - parentRect.left}px`,
22343
- top: `${top - parentRect.top + height - zoneWidth / 2}px`,
22344
- width: `${width}px`
22345
- },
22346
- right: {
22347
- backgroundColor: "none",
22348
- cursor: "col-resize",
22349
- height: `${height}px`,
22350
- left: `${left - parentRect.left + width - zoneWidth / 2}px`,
22351
- top: `${top - parentRect.top}px`,
22352
- width: `${zoneWidth}px`
22353
- }
22354
- };
22355
- const tableRect = tableRectRef.current;
22356
- if (draggingDirection && mouseCurrentPos && tableRect) {
22357
- if (isHeightChanging(draggingDirection)) {
22358
- styles[draggingDirection].left = `${tableRect.left - parentRect.left}px`;
22359
- styles[draggingDirection].top = `${(mouseCurrentPos.y - parentRect.top) / zoom}px`;
22360
- styles[draggingDirection].height = "3px";
22361
- styles[draggingDirection].width = `${tableRect.width}px`;
22362
- } else {
22363
- styles[draggingDirection].top = `${tableRect.top - parentRect.top}px`;
22364
- styles[draggingDirection].left = `${(mouseCurrentPos.x - parentRect.left) / zoom}px`;
22365
- styles[draggingDirection].width = "3px";
22366
- styles[draggingDirection].height = `${tableRect.height}px`;
22367
- }
22368
- styles[draggingDirection].backgroundColor = "#adf";
22369
- }
22370
- return styles;
22371
- }
22372
- return {
22373
- bottom: null,
22374
- left: null,
22375
- right: null,
22376
- top: null
22377
- };
22378
- }, [activeCell, draggingDirection, mouseCurrentPos, positioningAnchorEl]);
22379
- const resizerStyles = getResizers();
22380
- return /* @__PURE__ */ jsx132("div", { ref: resizerRef, children: activeCell != null && !isMouseDown && /* @__PURE__ */ jsxs88(Fragment20, { children: [
22381
- /* @__PURE__ */ jsx132(
22382
- "div",
22383
- {
22384
- css: tableResizer,
22385
- style: resizerStyles.right || void 0,
22386
- onMouseDown: toggleResize("right")
22387
- }
22388
- ),
22389
- /* @__PURE__ */ jsx132(
22390
- "div",
22391
- {
22392
- css: tableResizer,
22393
- style: resizerStyles.bottom || void 0,
22394
- onMouseDown: toggleResize("bottom")
22395
- }
22396
- )
22397
- ] }) });
22398
- }
22399
- function TableCellResizerPlugin({ positioningAnchorEl }) {
22400
- const [editor] = useLexicalComposerContext6();
22401
- const isEditable = useLexicalEditable2();
22402
- return useMemo7(
22403
- () => isEditable ? createPortal3(
22404
- /* @__PURE__ */ jsx132(TableCellResizer, { editor, positioningAnchorEl }),
22405
- positioningAnchorEl
22406
- ) : null,
22407
- [editor, isEditable, positioningAnchorEl]
22408
- );
22409
- }
22410
-
22411
21659
  // src/components/ParameterInputs/ParameterRichText.tsx
22412
- import { Fragment as Fragment21, jsx as jsx133, jsxs as jsxs89 } from "@emotion/react/jsx-runtime";
21660
+ import { Fragment as Fragment20, jsx as jsx131, jsxs as jsxs87 } from "@emotion/react/jsx-runtime";
22413
21661
  var ParameterRichText = ({
22414
21662
  label,
22415
21663
  labelLeadingIcon,
@@ -22428,16 +21676,13 @@ var ParameterRichText = ({
22428
21676
  readOnly,
22429
21677
  editorWrapperClassName,
22430
21678
  editorInputClassName,
22431
- editorInputWrapperClassName,
22432
21679
  editorFooter,
22433
21680
  customNodes,
22434
21681
  children,
22435
21682
  variables,
22436
- customControls,
22437
- onInsertTable,
22438
- minimalInteractivity
21683
+ customControls
22439
21684
  }) => {
22440
- return /* @__PURE__ */ jsxs89(
21685
+ return /* @__PURE__ */ jsxs87(
22441
21686
  ParameterShell,
22442
21687
  {
22443
21688
  "data-testid": "parameter-richtext",
@@ -22451,7 +21696,7 @@ var ParameterRichText = ({
22451
21696
  captionTestId,
22452
21697
  menuItems,
22453
21698
  children: [
22454
- /* @__PURE__ */ jsx133(
21699
+ /* @__PURE__ */ jsx131(
22455
21700
  ParameterRichTextInner,
22456
21701
  {
22457
21702
  value,
@@ -22462,33 +21707,30 @@ var ParameterRichText = ({
22462
21707
  readOnly,
22463
21708
  editorWrapperClassName,
22464
21709
  editorInputClassName,
22465
- editorInputWrapperClassName,
22466
21710
  editorFooter,
22467
21711
  customNodes,
22468
21712
  variables,
22469
21713
  customControls,
22470
- onInsertTable,
22471
- minimalInteractivity,
22472
21714
  children
22473
21715
  }
22474
21716
  ),
22475
- menuItems ? /* @__PURE__ */ jsx133(ParameterMenuButton, { label: `${label} menu`, children: /* @__PURE__ */ jsx133(Fragment21, { children: menuItems }) }) : null
21717
+ menuItems ? /* @__PURE__ */ jsx131(ParameterMenuButton, { label: `${label} menu`, children: /* @__PURE__ */ jsx131(Fragment20, { children: menuItems }) }) : null
22476
21718
  ]
22477
21719
  }
22478
21720
  );
22479
21721
  };
22480
- var editorWrapper = css100`
21722
+ var editorWrapper = css98`
22481
21723
  display: flex;
22482
21724
  flex-flow: column;
22483
21725
  flex-grow: 1;
22484
21726
  `;
22485
- var editorContainer = css100`
21727
+ var editorContainer = css98`
22486
21728
  display: flex;
22487
21729
  flex-flow: column;
22488
21730
  flex-grow: 1;
22489
21731
  position: relative;
22490
21732
  `;
22491
- var editorPlaceholder = css100`
21733
+ var editorPlaceholder = css98`
22492
21734
  color: var(--gray-500);
22493
21735
  font-style: italic;
22494
21736
  /* 1px is added to make sure caret is clearly visible when field is focused
@@ -22499,7 +21741,7 @@ var editorPlaceholder = css100`
22499
21741
  top: var(--spacing-sm);
22500
21742
  user-select: none;
22501
21743
  `;
22502
- var editorInput = css100`
21744
+ var editorInput = css98`
22503
21745
  background: var(--white);
22504
21746
  border: 1px solid var(--gray-200);
22505
21747
  border-radius: var(--rounded-sm);
@@ -22527,14 +21769,11 @@ var ParameterRichTextInner = ({
22527
21769
  readOnly,
22528
21770
  editorWrapperClassName,
22529
21771
  editorInputClassName,
22530
- editorInputWrapperClassName,
22531
21772
  editorFooter,
22532
21773
  children,
22533
21774
  customNodes,
22534
21775
  variables,
22535
- customControls,
22536
- onInsertTable,
22537
- minimalInteractivity
21776
+ customControls
22538
21777
  }) => {
22539
21778
  const lexicalConfig = {
22540
21779
  namespace: "uniform",
@@ -22550,9 +21789,6 @@ var ParameterRichTextInner = ({
22550
21789
  QuoteNode,
22551
21790
  ParagraphNode2,
22552
21791
  CustomCodeNode,
22553
- TableNode,
22554
- TableCellNode2,
22555
- TableRowNode2,
22556
21792
  ...customNodes != null ? customNodes : []
22557
21793
  ],
22558
21794
  theme: {
@@ -22585,15 +21821,12 @@ var ParameterRichTextInner = ({
22585
21821
  }
22586
21822
  },
22587
21823
  quote: blockquoteElement,
22588
- code: codeElement,
22589
- table: tableElement,
22590
- tableCell: tableCellElement,
22591
- tableCellHeader: tableHeaderElement
21824
+ code: codeElement
22592
21825
  },
22593
21826
  editable: !readOnly
22594
21827
  };
22595
- return /* @__PURE__ */ jsxs89(Fragment21, { children: [
22596
- /* @__PURE__ */ jsx133("div", { css: [editorWrapper], className: editorWrapperClassName, children: /* @__PURE__ */ jsx133(LexicalComposer, { initialConfig: lexicalConfig, children: /* @__PURE__ */ jsx133(
21828
+ return /* @__PURE__ */ jsxs87(Fragment20, { children: [
21829
+ /* @__PURE__ */ jsx131("div", { css: [editorWrapper], className: editorWrapperClassName, children: /* @__PURE__ */ jsx131(LexicalComposer, { initialConfig: lexicalConfig, children: /* @__PURE__ */ jsx131(
22597
21830
  RichText,
22598
21831
  {
22599
21832
  onChange,
@@ -22602,11 +21835,8 @@ var ParameterRichTextInner = ({
22602
21835
  onRichTextInit,
22603
21836
  readOnly,
22604
21837
  editorInputClassName,
22605
- editorInputWrapperClassName,
22606
21838
  variables,
22607
21839
  customControls,
22608
- onInsertTable,
22609
- minimalInteractivity,
22610
21840
  children
22611
21841
  }
22612
21842
  ) }) }),
@@ -22629,20 +21859,18 @@ var RichText = ({
22629
21859
  onRichTextInit,
22630
21860
  readOnly,
22631
21861
  editorInputClassName,
22632
- editorInputWrapperClassName,
22633
21862
  children,
22634
21863
  variables,
22635
- customControls,
22636
- onInsertTable,
22637
- minimalInteractivity
21864
+ customControls
22638
21865
  }) => {
22639
- const [editor] = useLexicalComposerContext7();
22640
- useEffect23(() => {
21866
+ const editorContainerRef = useRef12(null);
21867
+ const [editor] = useLexicalComposerContext5();
21868
+ useEffect21(() => {
22641
21869
  if (onRichTextInit) {
22642
21870
  onRichTextInit(editor);
22643
21871
  }
22644
21872
  }, [editor, onRichTextInit]);
22645
- useEffect23(() => {
21873
+ useEffect21(() => {
22646
21874
  const removeUpdateListener = editor.registerUpdateListener(({ editorState, prevEditorState }) => {
22647
21875
  requestAnimationFrame(() => {
22648
21876
  if (!deepEqual2(editorState.toJSON(), prevEditorState.toJSON())) {
@@ -22654,72 +21882,53 @@ var RichText = ({
22654
21882
  removeUpdateListener();
22655
21883
  };
22656
21884
  }, [editor, onChange]);
22657
- useEffect23(() => {
21885
+ useEffect21(() => {
22658
21886
  editor.setEditable(!readOnly);
22659
21887
  }, [editor, readOnly]);
22660
- const [editorContainerRef, setEditorContainerRef] = useState20(null);
22661
- const onRef = (_editorContainerRef) => {
22662
- if (_editorContainerRef !== null) {
22663
- setEditorContainerRef(_editorContainerRef);
22664
- }
22665
- };
22666
- return /* @__PURE__ */ jsxs89(Fragment21, { children: [
22667
- readOnly || minimalInteractivity ? null : /* @__PURE__ */ jsx133(RichTextToolbar_default, { config, customControls, onInsertTable }),
22668
- /* @__PURE__ */ jsxs89(
22669
- "div",
22670
- {
22671
- css: editorContainer,
22672
- className: editorInputWrapperClassName,
22673
- ref: onRef,
22674
- "data-testid": "value-container",
22675
- children: [
22676
- /* @__PURE__ */ jsx133(
22677
- RichTextPlugin,
22678
- {
22679
- contentEditable: /* @__PURE__ */ jsx133(ContentEditable, { css: editorInput, className: editorInputClassName }),
22680
- placeholder: /* @__PURE__ */ jsx133("div", { css: editorPlaceholder, children: readOnly ? "empty" : "start editing..." }),
22681
- ErrorBoundary: LexicalErrorBoundary
22682
- }
22683
- ),
22684
- /* @__PURE__ */ jsx133(ListPlugin, {}),
22685
- /* @__PURE__ */ jsx133(TablePlugin, {}),
22686
- editorContainerRef && !minimalInteractivity ? /* @__PURE__ */ jsx133(TableActionMenuPlugin, { positioningAnchorEl: editorContainerRef }) : null,
22687
- editorContainerRef && !minimalInteractivity ? /* @__PURE__ */ jsx133(TableCellResizerPlugin, { positioningAnchorEl: editorContainerRef }) : null,
22688
- readOnly ? null : /* @__PURE__ */ jsx133(HistoryPlugin, {}),
22689
- editorContainerRef ? /* @__PURE__ */ jsx133(
22690
- LinkNodePlugin,
22691
- {
22692
- onConnectLink: onConnectLink ? onConnectLink : () => Promise.resolve(),
22693
- getBoundPath: (variables == null ? void 0 : variables.bindVariables) ? (path) => {
22694
- var _a, _b;
22695
- return (_b = (_a = variables.bindVariables) == null ? void 0 : _a.call(variables, path)) != null ? _b : path;
22696
- } : void 0,
22697
- positioningAnchorEl: editorContainerRef
22698
- }
22699
- ) : null,
22700
- /* @__PURE__ */ jsx133(ListIndentPlugin, { maxDepth: 4 }),
22701
- /* @__PURE__ */ jsx133(DisableStylesPlugin, {}),
22702
- /* @__PURE__ */ jsx133(MarkdownShortcutPlugin, { transformers: MARKDOWN_TRANSFORMERS }),
22703
- /* @__PURE__ */ jsx133(Fragment21, { children })
22704
- ]
22705
- }
22706
- )
21888
+ return /* @__PURE__ */ jsxs87(Fragment20, { children: [
21889
+ readOnly ? null : /* @__PURE__ */ jsx131(RichTextToolbar_default, { config, customControls }),
21890
+ /* @__PURE__ */ jsxs87("div", { css: editorContainer, ref: editorContainerRef, "data-testid": "value-container", children: [
21891
+ /* @__PURE__ */ jsx131(
21892
+ RichTextPlugin,
21893
+ {
21894
+ contentEditable: /* @__PURE__ */ jsx131(ContentEditable, { css: editorInput, className: editorInputClassName }),
21895
+ placeholder: /* @__PURE__ */ jsx131("div", { css: editorPlaceholder, children: readOnly ? "empty" : "start editing..." }),
21896
+ ErrorBoundary: LexicalErrorBoundary
21897
+ }
21898
+ ),
21899
+ /* @__PURE__ */ jsx131(ListPlugin, {}),
21900
+ readOnly ? null : /* @__PURE__ */ jsx131(HistoryPlugin, {}),
21901
+ /* @__PURE__ */ jsx131(
21902
+ LinkNodePlugin,
21903
+ {
21904
+ onConnectLink: onConnectLink ? onConnectLink : () => Promise.resolve(),
21905
+ getBoundPath: (variables == null ? void 0 : variables.bindVariables) ? (path) => {
21906
+ var _a, _b;
21907
+ return (_b = (_a = variables.bindVariables) == null ? void 0 : _a.call(variables, path)) != null ? _b : path;
21908
+ } : void 0
21909
+ }
21910
+ ),
21911
+ /* @__PURE__ */ jsx131(ListIndentPlugin, { maxDepth: 4 }),
21912
+ /* @__PURE__ */ jsx131(DisableStylesPlugin, {}),
21913
+ /* @__PURE__ */ jsx131(MarkdownShortcutPlugin, { transformers: MARKDOWN_TRANSFORMERS }),
21914
+ /* @__PURE__ */ jsx131(Fragment20, { children })
21915
+ ] })
22707
21916
  ] });
22708
21917
  };
22709
21918
 
22710
21919
  // src/components/ParameterInputs/ParameterSelect.tsx
22711
- import { forwardRef as forwardRef23 } from "react";
22712
- import { jsx as jsx134, jsxs as jsxs90 } from "@emotion/react/jsx-runtime";
22713
- var ParameterSelect = forwardRef23(
21920
+ import { forwardRef as forwardRef22 } from "react";
21921
+ import { jsx as jsx132, jsxs as jsxs88 } from "@emotion/react/jsx-runtime";
21922
+ var ParameterSelect = forwardRef22(
22714
21923
  ({ defaultOption, options, ...props }, ref) => {
22715
21924
  const { shellProps, innerProps } = extractParameterProps(props);
22716
- return /* @__PURE__ */ jsx134(ParameterShell, { ...shellProps, children: /* @__PURE__ */ jsx134(ParameterSelectInner, { options, defaultOption, ...innerProps, ref }) });
21925
+ return /* @__PURE__ */ jsx132(ParameterShell, { ...shellProps, children: /* @__PURE__ */ jsx132(ParameterSelectInner, { options, defaultOption, ...innerProps, ref }) });
22717
21926
  }
22718
21927
  );
22719
- var ParameterSelectInner = forwardRef23(
21928
+ var ParameterSelectInner = forwardRef22(
22720
21929
  ({ defaultOption, options, ...props }, ref) => {
22721
21930
  const { id, label, hiddenLabel } = useParameterShell();
22722
- return /* @__PURE__ */ jsxs90(
21931
+ return /* @__PURE__ */ jsxs88(
22723
21932
  "select",
22724
21933
  {
22725
21934
  css: [input3, selectInput],
@@ -22728,10 +21937,10 @@ var ParameterSelectInner = forwardRef23(
22728
21937
  ref,
22729
21938
  ...props,
22730
21939
  children: [
22731
- defaultOption ? /* @__PURE__ */ jsx134("option", { value: "", children: defaultOption }) : null,
21940
+ defaultOption ? /* @__PURE__ */ jsx132("option", { value: "", children: defaultOption }) : null,
22732
21941
  options.map((option) => {
22733
21942
  var _a;
22734
- return /* @__PURE__ */ jsx134("option", { value: (_a = option.value) != null ? _a : option.label, children: option.label }, option.label);
21943
+ return /* @__PURE__ */ jsx132("option", { value: (_a = option.value) != null ? _a : option.label, children: option.label }, option.label);
22735
21944
  })
22736
21945
  ]
22737
21946
  }
@@ -22740,15 +21949,15 @@ var ParameterSelectInner = forwardRef23(
22740
21949
  );
22741
21950
 
22742
21951
  // src/components/ParameterInputs/ParameterTextarea.tsx
22743
- import { forwardRef as forwardRef24 } from "react";
22744
- import { jsx as jsx135 } from "@emotion/react/jsx-runtime";
22745
- var ParameterTextarea = forwardRef24((props, ref) => {
21952
+ import { forwardRef as forwardRef23 } from "react";
21953
+ import { jsx as jsx133 } from "@emotion/react/jsx-runtime";
21954
+ var ParameterTextarea = forwardRef23((props, ref) => {
22746
21955
  const { shellProps, innerProps } = extractParameterProps(props);
22747
- return /* @__PURE__ */ jsx135(ParameterShell, { "data-testid": "parameter-textarea", ...shellProps, children: /* @__PURE__ */ jsx135(ParameterTextareaInner, { ref, ...innerProps }) });
21956
+ return /* @__PURE__ */ jsx133(ParameterShell, { "data-testid": "parameter-textarea", ...shellProps, children: /* @__PURE__ */ jsx133(ParameterTextareaInner, { ref, ...innerProps }) });
22748
21957
  });
22749
- var ParameterTextareaInner = forwardRef24(({ ...props }, ref) => {
21958
+ var ParameterTextareaInner = forwardRef23(({ ...props }, ref) => {
22750
21959
  const { id, label, hiddenLabel } = useParameterShell();
22751
- return /* @__PURE__ */ jsx135(
21960
+ return /* @__PURE__ */ jsx133(
22752
21961
  "textarea",
22753
21962
  {
22754
21963
  css: [input3, textarea2],
@@ -22761,26 +21970,26 @@ var ParameterTextareaInner = forwardRef24(({ ...props }, ref) => {
22761
21970
  });
22762
21971
 
22763
21972
  // src/components/ParameterInputs/ParameterToggle.tsx
22764
- import { forwardRef as forwardRef25 } from "react";
22765
- import { jsx as jsx136, jsxs as jsxs91 } from "@emotion/react/jsx-runtime";
22766
- var ParameterToggle = forwardRef25((props, ref) => {
21973
+ import { forwardRef as forwardRef24 } from "react";
21974
+ import { jsx as jsx134, jsxs as jsxs89 } from "@emotion/react/jsx-runtime";
21975
+ var ParameterToggle = forwardRef24((props, ref) => {
22767
21976
  const { shellProps, innerProps } = extractParameterProps(props);
22768
- return /* @__PURE__ */ jsx136(ParameterShell, { ...shellProps, children: /* @__PURE__ */ jsx136(ParameterToggleInner, { ref, ...innerProps }) });
21977
+ return /* @__PURE__ */ jsx134(ParameterShell, { ...shellProps, children: /* @__PURE__ */ jsx134(ParameterToggleInner, { ref, ...innerProps }) });
22769
21978
  });
22770
- var ParameterToggleInner = forwardRef25(
21979
+ var ParameterToggleInner = forwardRef24(
22771
21980
  ({ children, ...props }, ref) => {
22772
21981
  const { id, label } = useParameterShell();
22773
- return /* @__PURE__ */ jsxs91("label", { css: inputToggleLabel2, children: [
22774
- /* @__PURE__ */ jsx136("input", { css: toggleInput2, type: props.type, id, ref, ...props }),
22775
- /* @__PURE__ */ jsx136("span", { css: inlineLabel2, children: label }),
21982
+ return /* @__PURE__ */ jsxs89("label", { css: inputToggleLabel2, children: [
21983
+ /* @__PURE__ */ jsx134("input", { css: toggleInput2, type: props.type, id, ref, ...props }),
21984
+ /* @__PURE__ */ jsx134("span", { css: inlineLabel2, children: label }),
22776
21985
  children
22777
21986
  ] });
22778
21987
  }
22779
21988
  );
22780
21989
 
22781
21990
  // src/components/ProgressBar/ProgressBar.styles.ts
22782
- import { css as css101, keyframes as keyframes4 } from "@emotion/react";
22783
- var container3 = css101`
21991
+ import { css as css99, keyframes as keyframes4 } from "@emotion/react";
21992
+ var container3 = css99`
22784
21993
  background: var(--gray-50);
22785
21994
  margin-block: var(--spacing-sm);
22786
21995
  position: relative;
@@ -22790,13 +21999,13 @@ var container3 = css101`
22790
21999
  border: solid 1px var(--gray-300);
22791
22000
  `;
22792
22001
  var themeMap = {
22793
- primary: css101`
22002
+ primary: css99`
22794
22003
  --progress-color: var(--accent-light);
22795
22004
  `,
22796
- secondary: css101`
22005
+ secondary: css99`
22797
22006
  --progress-color: var(--accent-alt-light);
22798
22007
  `,
22799
- destructive: css101`
22008
+ destructive: css99`
22800
22009
  --progress-color: var(--brand-secondary-5);
22801
22010
  `
22802
22011
  };
@@ -22808,10 +22017,10 @@ var slidingBackgroundPosition = keyframes4`
22808
22017
  background-position: 64px 0;
22809
22018
  }
22810
22019
  `;
22811
- var determinate = css101`
22020
+ var determinate = css99`
22812
22021
  background-color: var(--progress-color);
22813
22022
  `;
22814
- var indeterminate = css101`
22023
+ var indeterminate = css99`
22815
22024
  background-image: linear-gradient(
22816
22025
  45deg,
22817
22026
  var(--progress-color) 25%,
@@ -22825,7 +22034,7 @@ var indeterminate = css101`
22825
22034
  background-size: 64px 64px;
22826
22035
  animation: ${slidingBackgroundPosition} 1s linear infinite;
22827
22036
  `;
22828
- var bar = css101`
22037
+ var bar = css99`
22829
22038
  position: absolute;
22830
22039
  inset: 0;
22831
22040
  transition: transform var(--duration-fast) var(--timing-ease-out);
@@ -22833,7 +22042,7 @@ var bar = css101`
22833
22042
  `;
22834
22043
 
22835
22044
  // src/components/ProgressBar/ProgressBar.tsx
22836
- import { jsx as jsx137 } from "@emotion/react/jsx-runtime";
22045
+ import { jsx as jsx135 } from "@emotion/react/jsx-runtime";
22837
22046
  function ProgressBar({
22838
22047
  current,
22839
22048
  max,
@@ -22843,7 +22052,7 @@ function ProgressBar({
22843
22052
  }) {
22844
22053
  const valueNow = Math.min(current, max);
22845
22054
  const valuePercentage = max > 0 ? Math.ceil(100 / max * valueNow) : 0;
22846
- return /* @__PURE__ */ jsx137(
22055
+ return /* @__PURE__ */ jsx135(
22847
22056
  "div",
22848
22057
  {
22849
22058
  css: container3,
@@ -22854,7 +22063,7 @@ function ProgressBar({
22854
22063
  "aria-valuemax": max,
22855
22064
  "aria-valuenow": valueNow,
22856
22065
  ...props,
22857
- children: /* @__PURE__ */ jsx137(
22066
+ children: /* @__PURE__ */ jsx135(
22858
22067
  "div",
22859
22068
  {
22860
22069
  css: [
@@ -22873,30 +22082,30 @@ function ProgressBar({
22873
22082
  }
22874
22083
 
22875
22084
  // src/components/ProgressList/ProgressList.tsx
22876
- import { css as css103 } from "@emotion/react";
22085
+ import { css as css101 } from "@emotion/react";
22877
22086
  import { CgCheckO as CgCheckO2 } from "@react-icons/all-files/cg/CgCheckO";
22878
22087
  import { CgRadioCheck } from "@react-icons/all-files/cg/CgRadioCheck";
22879
22088
  import { CgRecord } from "@react-icons/all-files/cg/CgRecord";
22880
- import { useMemo as useMemo8 } from "react";
22089
+ import { useMemo as useMemo7 } from "react";
22881
22090
 
22882
22091
  // src/components/ProgressList/styles/ProgressList.styles.ts
22883
- import { css as css102 } from "@emotion/react";
22884
- var progressListStyles = css102`
22092
+ import { css as css100 } from "@emotion/react";
22093
+ var progressListStyles = css100`
22885
22094
  display: flex;
22886
22095
  flex-direction: column;
22887
22096
  gap: var(--spacing-sm);
22888
22097
  list-style-type: none;
22889
22098
  `;
22890
- var progressListItemStyles = css102`
22099
+ var progressListItemStyles = css100`
22891
22100
  display: flex;
22892
22101
  gap: var(--spacing-base);
22893
22102
  align-items: center;
22894
22103
  `;
22895
22104
 
22896
22105
  // src/components/ProgressList/ProgressList.tsx
22897
- import { jsx as jsx138, jsxs as jsxs92 } from "@emotion/react/jsx-runtime";
22106
+ import { jsx as jsx136, jsxs as jsxs90 } from "@emotion/react/jsx-runtime";
22898
22107
  var ProgressList = ({ inProgressId, items, autoEllipsis, ...htmlProps }) => {
22899
- const itemsWithStatus = useMemo8(() => {
22108
+ const itemsWithStatus = useMemo7(() => {
22900
22109
  const indexOfInProgressItem = items.findIndex(({ id }) => id === inProgressId);
22901
22110
  return items.map((item, index) => {
22902
22111
  let status = "queued";
@@ -22908,8 +22117,8 @@ var ProgressList = ({ inProgressId, items, autoEllipsis, ...htmlProps }) => {
22908
22117
  return { ...item, status };
22909
22118
  });
22910
22119
  }, [items, inProgressId]);
22911
- return /* @__PURE__ */ jsx138("ol", { css: progressListStyles, ...htmlProps, children: itemsWithStatus.map(({ id, label, status, error, errorLevel }) => {
22912
- return /* @__PURE__ */ jsx138(
22120
+ return /* @__PURE__ */ jsx136("ol", { css: progressListStyles, ...htmlProps, children: itemsWithStatus.map(({ id, label, status, error, errorLevel }) => {
22121
+ return /* @__PURE__ */ jsx136(
22913
22122
  ProgressListItem,
22914
22123
  {
22915
22124
  status,
@@ -22929,7 +22138,7 @@ var ProgressListItem = ({
22929
22138
  errorLevel = "danger",
22930
22139
  autoEllipsis = false
22931
22140
  }) => {
22932
- const icon = useMemo8(() => {
22141
+ const icon = useMemo7(() => {
22933
22142
  if (error) {
22934
22143
  return warningIcon;
22935
22144
  }
@@ -22940,14 +22149,14 @@ var ProgressListItem = ({
22940
22149
  };
22941
22150
  return iconPerStatus[status];
22942
22151
  }, [status, error]);
22943
- const statusStyles = useMemo8(() => {
22152
+ const statusStyles = useMemo7(() => {
22944
22153
  if (error) {
22945
- return errorLevel === "caution" ? css103`
22154
+ return errorLevel === "caution" ? css101`
22946
22155
  color: rgb(161, 98, 7);
22947
22156
  & svg {
22948
22157
  color: rgb(250, 204, 21);
22949
22158
  }
22950
- ` : css103`
22159
+ ` : css101`
22951
22160
  color: rgb(185, 28, 28);
22952
22161
  & svg {
22953
22162
  color: var(--brand-primary-2);
@@ -22955,38 +22164,38 @@ var ProgressListItem = ({
22955
22164
  `;
22956
22165
  }
22957
22166
  const colorPerStatus = {
22958
- completed: css103`
22167
+ completed: css101`
22959
22168
  opacity: 0.75;
22960
22169
  `,
22961
- inProgress: css103`
22170
+ inProgress: css101`
22962
22171
  -webkit-text-stroke-width: thin;
22963
22172
  `,
22964
- queued: css103`
22173
+ queued: css101`
22965
22174
  opacity: 0.5;
22966
22175
  `
22967
22176
  };
22968
22177
  return colorPerStatus[status];
22969
22178
  }, [status, error, errorLevel]);
22970
- return /* @__PURE__ */ jsxs92("li", { css: [progressListItemStyles, statusStyles], children: [
22971
- /* @__PURE__ */ jsx138(Tooltip, { title: error != null ? error : "", children: /* @__PURE__ */ jsx138("div", { children: /* @__PURE__ */ jsx138(Icon, { icon, size: 20, iconColor: "currentColor" }) }) }),
22972
- /* @__PURE__ */ jsxs92("div", { children: [
22179
+ return /* @__PURE__ */ jsxs90("li", { css: [progressListItemStyles, statusStyles], children: [
22180
+ /* @__PURE__ */ jsx136(Tooltip, { title: error != null ? error : "", children: /* @__PURE__ */ jsx136("div", { children: /* @__PURE__ */ jsx136(Icon, { icon, size: 20, iconColor: "currentColor" }) }) }),
22181
+ /* @__PURE__ */ jsxs90("div", { children: [
22973
22182
  children,
22974
- /* @__PURE__ */ jsx138("span", { css: { visibility: autoEllipsis && status === "inProgress" && !error ? "visible" : "hidden" }, children: "..." })
22183
+ /* @__PURE__ */ jsx136("span", { css: { visibility: autoEllipsis && status === "inProgress" && !error ? "visible" : "hidden" }, children: "..." })
22975
22184
  ] })
22976
22185
  ] });
22977
22186
  };
22978
22187
 
22979
22188
  // src/components/SegmentedControl/SegmentedControl.tsx
22980
- import { css as css105 } from "@emotion/react";
22189
+ import { css as css103 } from "@emotion/react";
22981
22190
  import { CgCheck as CgCheck5 } from "@react-icons/all-files/cg/CgCheck";
22982
- import { useCallback as useCallback14, useEffect as useEffect24, useMemo as useMemo9, useRef as useRef13, useState as useState21 } from "react";
22191
+ import { useCallback as useCallback12, useEffect as useEffect22, useMemo as useMemo8, useRef as useRef13, useState as useState18 } from "react";
22983
22192
 
22984
22193
  // src/components/SegmentedControl/SegmentedControl.styles.ts
22985
- import { css as css104 } from "@emotion/react";
22986
- var segmentedControlRootStyles = css104`
22194
+ import { css as css102 } from "@emotion/react";
22195
+ var segmentedControlRootStyles = css102`
22987
22196
  position: relative;
22988
22197
  `;
22989
- var segmentedControlScrollIndicatorsStyles = css104`
22198
+ var segmentedControlScrollIndicatorsStyles = css102`
22990
22199
  position: absolute;
22991
22200
  inset: 0;
22992
22201
  z-index: 1;
@@ -23014,17 +22223,17 @@ var segmentedControlScrollIndicatorsStyles = css104`
23014
22223
  background: linear-gradient(to left, var(--background-color) 10%, transparent);
23015
22224
  }
23016
22225
  `;
23017
- var segmentedControlScrollIndicatorStartVisibleStyles = css104`
22226
+ var segmentedControlScrollIndicatorStartVisibleStyles = css102`
23018
22227
  &::before {
23019
22228
  opacity: 1;
23020
22229
  }
23021
22230
  `;
23022
- var segmentedControlScrollIndicatorEndVisibleStyles = css104`
22231
+ var segmentedControlScrollIndicatorEndVisibleStyles = css102`
23023
22232
  &::after {
23024
22233
  opacity: 1;
23025
22234
  }
23026
22235
  `;
23027
- var segmentedControlWrapperStyles = css104`
22236
+ var segmentedControlWrapperStyles = css102`
23028
22237
  overflow-y: auto;
23029
22238
  scroll-behavior: smooth;
23030
22239
  scrollbar-width: none;
@@ -23033,7 +22242,7 @@ var segmentedControlWrapperStyles = css104`
23033
22242
  height: 0px;
23034
22243
  }
23035
22244
  `;
23036
- var segmentedControlStyles = css104`
22245
+ var segmentedControlStyles = css102`
23037
22246
  --segmented-control-rounded-value: var(--rounded-base);
23038
22247
  --segmented-control-border-width: 1px;
23039
22248
  --segmented-control-selected-color: var(--brand-secondary-3);
@@ -23052,14 +22261,14 @@ var segmentedControlStyles = css104`
23052
22261
  border-radius: calc(var(--segmented-control-rounded-value) + var(--segmented-control-border-width));
23053
22262
  font-size: var(--fs-xs);
23054
22263
  `;
23055
- var segmentedControlVerticalStyles = css104`
22264
+ var segmentedControlVerticalStyles = css102`
23056
22265
  flex-direction: column;
23057
22266
  --segmented-control-first-border-radius: var(--segmented-control-rounded-value)
23058
22267
  var(--segmented-control-rounded-value) 0 0;
23059
22268
  --segmented-control-last-border-radius: 0 0 var(--segmented-control-rounded-value)
23060
22269
  var(--segmented-control-rounded-value);
23061
22270
  `;
23062
- var segmentedControlItemStyles = css104`
22271
+ var segmentedControlItemStyles = css102`
23063
22272
  &:first-of-type label {
23064
22273
  border-radius: var(--segmented-control-first-border-radius);
23065
22274
  }
@@ -23067,10 +22276,10 @@ var segmentedControlItemStyles = css104`
23067
22276
  border-radius: var(--segmented-control-last-border-radius);
23068
22277
  }
23069
22278
  `;
23070
- var segmentedControlInputStyles = css104`
22279
+ var segmentedControlInputStyles = css102`
23071
22280
  ${accessibleHidden}
23072
22281
  `;
23073
- var segmentedControlLabelStyles = (checked, disabled2) => css104`
22282
+ var segmentedControlLabelStyles = (checked, disabled2) => css102`
23074
22283
  position: relative;
23075
22284
  display: flex;
23076
22285
  align-items: center;
@@ -23137,25 +22346,25 @@ var segmentedControlLabelStyles = (checked, disabled2) => css104`
23137
22346
  `}
23138
22347
  }
23139
22348
  `;
23140
- var segmentedControlLabelIconOnlyStyles = css104`
22349
+ var segmentedControlLabelIconOnlyStyles = css102`
23141
22350
  padding-inline: 0.5em;
23142
22351
  `;
23143
- var segmentedControlLabelCheckStyles = css104`
22352
+ var segmentedControlLabelCheckStyles = css102`
23144
22353
  opacity: 0.5;
23145
22354
  `;
23146
- var segmentedControlLabelContentStyles = css104`
22355
+ var segmentedControlLabelContentStyles = css102`
23147
22356
  display: flex;
23148
22357
  align-items: center;
23149
22358
  justify-content: center;
23150
22359
  gap: var(--spacing-sm);
23151
22360
  height: 100%;
23152
22361
  `;
23153
- var segmentedControlLabelTextStyles = css104`
22362
+ var segmentedControlLabelTextStyles = css102`
23154
22363
  white-space: nowrap;
23155
22364
  `;
23156
22365
 
23157
22366
  // src/components/SegmentedControl/SegmentedControl.tsx
23158
- import { jsx as jsx139, jsxs as jsxs93 } from "@emotion/react/jsx-runtime";
22367
+ import { jsx as jsx137, jsxs as jsxs91 } from "@emotion/react/jsx-runtime";
23159
22368
  var SegmentedControl = ({
23160
22369
  name,
23161
22370
  options,
@@ -23171,9 +22380,9 @@ var SegmentedControl = ({
23171
22380
  ...props
23172
22381
  }) => {
23173
22382
  const wrapperRef = useRef13(null);
23174
- const [isOverflowStartShadowVisible, setIsOverflowStartShadowVisible] = useState21(false);
23175
- const [isOverflowEndShadowVisible, setIsOverflowEndShadowVisible] = useState21(false);
23176
- const onOptionChange = useCallback14(
22383
+ const [isOverflowStartShadowVisible, setIsOverflowStartShadowVisible] = useState18(false);
22384
+ const [isOverflowEndShadowVisible, setIsOverflowEndShadowVisible] = useState18(false);
22385
+ const onOptionChange = useCallback12(
23177
22386
  (event) => {
23178
22387
  if (event.target.checked) {
23179
22388
  onChange == null ? void 0 : onChange(options[parseInt(event.target.value)].value);
@@ -23181,19 +22390,19 @@ var SegmentedControl = ({
23181
22390
  },
23182
22391
  [options, onChange]
23183
22392
  );
23184
- const sizeStyles = useMemo9(() => {
22393
+ const sizeStyles = useMemo8(() => {
23185
22394
  const map = {
23186
- sm: css105({ height: "calc(24px - 2px)", fontSize: "var(--fs-xs)" }),
23187
- md: css105({ height: "calc(32px - 2px)", fontSize: "var(--fs-sm)" }),
23188
- lg: css105({ height: "calc(40px - 2px)", fontSize: "var(--fs-base)" }),
23189
- xl: css105({ height: "calc(48px - 2px)", fontSize: "var(--fs-base)" })
22395
+ sm: css103({ height: "calc(24px - 2px)", fontSize: "var(--fs-xs)" }),
22396
+ md: css103({ height: "calc(32px - 2px)", fontSize: "var(--fs-sm)" }),
22397
+ lg: css103({ height: "calc(40px - 2px)", fontSize: "var(--fs-base)" }),
22398
+ xl: css103({ height: "calc(48px - 2px)", fontSize: "var(--fs-base)" })
23190
22399
  };
23191
22400
  return map[size];
23192
22401
  }, [size]);
23193
- const isIconOnly = useMemo9(() => {
22402
+ const isIconOnly = useMemo8(() => {
23194
22403
  return options.every((option) => option && option.icon && !option.label);
23195
22404
  }, [options]);
23196
- useEffect24(() => {
22405
+ useEffect22(() => {
23197
22406
  const wrapperElement = wrapperRef.current;
23198
22407
  const onScroll = () => {
23199
22408
  if (!wrapperElement) {
@@ -23214,8 +22423,8 @@ var SegmentedControl = ({
23214
22423
  wrapperElement == null ? void 0 : wrapperElement.removeEventListener("scroll", onScroll);
23215
22424
  };
23216
22425
  }, []);
23217
- return /* @__PURE__ */ jsxs93("div", { css: [segmentedControlRootStyles, { "--background-color": currentBackgroundColor }], children: [
23218
- /* @__PURE__ */ jsx139("div", { ref: wrapperRef, css: segmentedControlWrapperStyles, children: /* @__PURE__ */ jsx139(
22426
+ return /* @__PURE__ */ jsxs91("div", { css: [segmentedControlRootStyles, { "--background-color": currentBackgroundColor }], children: [
22427
+ /* @__PURE__ */ jsx137("div", { ref: wrapperRef, css: segmentedControlWrapperStyles, children: /* @__PURE__ */ jsx137(
23219
22428
  "div",
23220
22429
  {
23221
22430
  css: [
@@ -23231,12 +22440,12 @@ var SegmentedControl = ({
23231
22440
  }
23232
22441
  const text = option.label ? option.label : option.icon ? null : String(option.value);
23233
22442
  const isDisabled = disabled2 || option.disabled;
23234
- return /* @__PURE__ */ jsx139(Tooltip, { title: (_a = option.tooltip) != null ? _a : "", children: /* @__PURE__ */ jsx139(
22443
+ return /* @__PURE__ */ jsx137(Tooltip, { title: (_a = option.tooltip) != null ? _a : "", children: /* @__PURE__ */ jsx137(
23235
22444
  "div",
23236
22445
  {
23237
22446
  css: segmentedControlItemStyles,
23238
22447
  "data-testid": option["data-testid"] ? option["data-testid"] : "container-segmented-control",
23239
- children: /* @__PURE__ */ jsxs93(
22448
+ children: /* @__PURE__ */ jsxs91(
23240
22449
  "label",
23241
22450
  {
23242
22451
  css: [
@@ -23245,7 +22454,7 @@ var SegmentedControl = ({
23245
22454
  isIconOnly ? segmentedControlLabelIconOnlyStyles : void 0
23246
22455
  ],
23247
22456
  children: [
23248
- /* @__PURE__ */ jsx139(
22457
+ /* @__PURE__ */ jsx137(
23249
22458
  "input",
23250
22459
  {
23251
22460
  css: segmentedControlInputStyles,
@@ -23257,10 +22466,10 @@ var SegmentedControl = ({
23257
22466
  disabled: isDisabled
23258
22467
  }
23259
22468
  ),
23260
- option.value !== value || noCheckmark ? null : /* @__PURE__ */ jsx139(CgCheck5, { css: segmentedControlLabelCheckStyles, "aria-label": "Selected", size: "1.5em" }),
23261
- /* @__PURE__ */ jsxs93("span", { css: segmentedControlLabelContentStyles, children: [
23262
- !option.icon ? null : /* @__PURE__ */ jsx139(Icon, { icon: option.icon, size: iconSize, iconColor: "currentColor" }),
23263
- !text || hideOptionText ? null : /* @__PURE__ */ jsx139("span", { css: segmentedControlLabelTextStyles, children: text })
22469
+ option.value !== value || noCheckmark ? null : /* @__PURE__ */ jsx137(CgCheck5, { css: segmentedControlLabelCheckStyles, "aria-label": "Selected", size: "1.5em" }),
22470
+ /* @__PURE__ */ jsxs91("span", { css: segmentedControlLabelContentStyles, children: [
22471
+ !option.icon ? null : /* @__PURE__ */ jsx137(Icon, { icon: option.icon, size: iconSize, iconColor: "currentColor" }),
22472
+ !text || hideOptionText ? null : /* @__PURE__ */ jsx137("span", { css: segmentedControlLabelTextStyles, children: text })
23264
22473
  ] })
23265
22474
  ]
23266
22475
  }
@@ -23270,7 +22479,7 @@ var SegmentedControl = ({
23270
22479
  })
23271
22480
  }
23272
22481
  ) }),
23273
- /* @__PURE__ */ jsx139(
22482
+ /* @__PURE__ */ jsx137(
23274
22483
  "div",
23275
22484
  {
23276
22485
  css: [
@@ -23284,18 +22493,18 @@ var SegmentedControl = ({
23284
22493
  };
23285
22494
 
23286
22495
  // src/components/Skeleton/Skeleton.styles.ts
23287
- import { css as css106, keyframes as keyframes5 } from "@emotion/react";
22496
+ import { css as css104, keyframes as keyframes5 } from "@emotion/react";
23288
22497
  var lightFadingOut = keyframes5`
23289
22498
  from { opacity: 0.1; }
23290
22499
  to { opacity: 0.025; }
23291
22500
  `;
23292
- var skeletonStyles = css106`
22501
+ var skeletonStyles = css104`
23293
22502
  animation: ${lightFadingOut} 1s ease-out infinite alternate;
23294
22503
  background-color: var(--gray-900);
23295
22504
  `;
23296
22505
 
23297
22506
  // src/components/Skeleton/Skeleton.tsx
23298
- import { jsx as jsx140 } from "@emotion/react/jsx-runtime";
22507
+ import { jsx as jsx138 } from "@emotion/react/jsx-runtime";
23299
22508
  var Skeleton = ({
23300
22509
  width = "100%",
23301
22510
  height = "1.25rem",
@@ -23303,7 +22512,7 @@ var Skeleton = ({
23303
22512
  circle = false,
23304
22513
  children,
23305
22514
  ...otherProps
23306
- }) => /* @__PURE__ */ jsx140(
22515
+ }) => /* @__PURE__ */ jsx138(
23307
22516
  "div",
23308
22517
  {
23309
22518
  css: [
@@ -23323,11 +22532,11 @@ var Skeleton = ({
23323
22532
  );
23324
22533
 
23325
22534
  // src/components/Switch/Switch.tsx
23326
- import { forwardRef as forwardRef26 } from "react";
22535
+ import { forwardRef as forwardRef25 } from "react";
23327
22536
 
23328
22537
  // src/components/Switch/Switch.styles.ts
23329
- import { css as css107 } from "@emotion/react";
23330
- var SwitchInputContainer = css107`
22538
+ import { css as css105 } from "@emotion/react";
22539
+ var SwitchInputContainer = css105`
23331
22540
  cursor: pointer;
23332
22541
  display: inline-block;
23333
22542
  position: relative;
@@ -23336,7 +22545,7 @@ var SwitchInputContainer = css107`
23336
22545
  vertical-align: middle;
23337
22546
  user-select: none;
23338
22547
  `;
23339
- var SwitchInput = (size) => css107`
22548
+ var SwitchInput = (size) => css105`
23340
22549
  appearance: none;
23341
22550
  border-radius: var(--rounded-full);
23342
22551
  background-color: var(--white);
@@ -23347,7 +22556,8 @@ var SwitchInput = (size) => css107`
23347
22556
  width: ${size === "sm" ? "var(--spacing-base)" : "var(--spacing-md)"};
23348
22557
  height: ${size === "sm" ? "var(--spacing-base)" : "var(--spacing-md)"};
23349
22558
  margin-top: ${size === "sm" ? "var(--spacing-xs)" : "none"};
23350
- transition: transform var(--duration-fast) var(--timing-ease-out),
22559
+ transition:
22560
+ transform var(--duration-fast) var(--timing-ease-out),
23351
22561
  background-color var(--duration-fast) var(--timing-ease-out),
23352
22562
  background-image var(--duration-fast) var(--timing-ease-out);
23353
22563
  z-index: var(--z-10);
@@ -23375,7 +22585,7 @@ var SwitchInput = (size) => css107`
23375
22585
  cursor: not-allowed;
23376
22586
  }
23377
22587
  `;
23378
- var SwitchInputDisabled = css107`
22588
+ var SwitchInputDisabled = css105`
23379
22589
  opacity: var(--opacity-50);
23380
22590
  cursor: not-allowed;
23381
22591
 
@@ -23383,7 +22593,7 @@ var SwitchInputDisabled = css107`
23383
22593
  cursor: not-allowed;
23384
22594
  }
23385
22595
  `;
23386
- var SwitchInputLabel = (size) => css107`
22596
+ var SwitchInputLabel = (size) => css105`
23387
22597
  align-items: center;
23388
22598
  color: var(--typography-base);
23389
22599
  display: inline-flex;
@@ -23405,32 +22615,32 @@ var SwitchInputLabel = (size) => css107`
23405
22615
  top: 0;
23406
22616
  }
23407
22617
  `;
23408
- var SwitchText = (size) => css107`
22618
+ var SwitchText = (size) => css105`
23409
22619
  color: var(--gray-500);
23410
22620
  font-size: var(--fs-sm);
23411
22621
  padding-inline: ${size === "sm" ? "var(--spacing-xl)" : "var(--spacing-2xl)"} 0;
23412
22622
  `;
23413
22623
 
23414
22624
  // src/components/Switch/Switch.tsx
23415
- import { Fragment as Fragment22, jsx as jsx141, jsxs as jsxs94 } from "@emotion/react/jsx-runtime";
23416
- var Switch = forwardRef26(
22625
+ import { Fragment as Fragment21, jsx as jsx139, jsxs as jsxs92 } from "@emotion/react/jsx-runtime";
22626
+ var Switch = forwardRef25(
23417
22627
  ({ label, infoText, toggleText, children, switchSize = "base", ...inputProps }, ref) => {
23418
22628
  let additionalText = infoText;
23419
22629
  if (infoText && toggleText) {
23420
22630
  additionalText = inputProps.checked ? toggleText : infoText;
23421
22631
  }
23422
- return /* @__PURE__ */ jsxs94(Fragment22, { children: [
23423
- /* @__PURE__ */ jsxs94(
22632
+ return /* @__PURE__ */ jsxs92(Fragment21, { children: [
22633
+ /* @__PURE__ */ jsxs92(
23424
22634
  "label",
23425
22635
  {
23426
22636
  css: [SwitchInputContainer, inputProps.disabled ? SwitchInputDisabled : void 0],
23427
22637
  children: [
23428
- /* @__PURE__ */ jsx141("input", { type: "checkbox", css: SwitchInput(switchSize), ...inputProps, ref }),
23429
- /* @__PURE__ */ jsx141("span", { css: SwitchInputLabel(switchSize), children: label })
22638
+ /* @__PURE__ */ jsx139("input", { type: "checkbox", css: SwitchInput(switchSize), ...inputProps, ref }),
22639
+ /* @__PURE__ */ jsx139("span", { css: SwitchInputLabel(switchSize), children: label })
23430
22640
  ]
23431
22641
  }
23432
22642
  ),
23433
- additionalText ? /* @__PURE__ */ jsx141("p", { css: SwitchText(switchSize), children: additionalText }) : null,
22643
+ additionalText ? /* @__PURE__ */ jsx139("p", { css: SwitchText(switchSize), children: additionalText }) : null,
23434
22644
  children
23435
22645
  ] });
23436
22646
  }
@@ -23440,8 +22650,8 @@ var Switch = forwardRef26(
23440
22650
  import * as React24 from "react";
23441
22651
 
23442
22652
  // src/components/Table/Table.styles.ts
23443
- import { css as css108 } from "@emotion/react";
23444
- var table = ({ cellPadding = "var(--spacing-sm) var(--spacing-md)" }) => css108`
22653
+ import { css as css106 } from "@emotion/react";
22654
+ var table = ({ cellPadding = "var(--spacing-sm) var(--spacing-md)" }) => css106`
23445
22655
  border-bottom: 1px solid var(--gray-400);
23446
22656
  border-collapse: collapse;
23447
22657
  min-width: 100%;
@@ -23461,54 +22671,54 @@ var table = ({ cellPadding = "var(--spacing-sm) var(--spacing-md)" }) => css108`
23461
22671
  background-color: var(--gray-50);
23462
22672
  }
23463
22673
  `;
23464
- var tableHead = css108`
22674
+ var tableHead = css106`
23465
22675
  color: var(--typography-base);
23466
22676
  text-align: left;
23467
22677
  `;
23468
- var tableRow = css108`
22678
+ var tableRow = css106`
23469
22679
  border-bottom: 1px solid var(--gray-100);
23470
22680
  `;
23471
- var tableCellHead = css108`
22681
+ var tableCellHead = css106`
23472
22682
  font-size: var(--fs-sm);
23473
22683
  text-transform: uppercase;
23474
22684
  font-weight: var(--fw-bold);
23475
22685
  `;
23476
22686
 
23477
22687
  // src/components/Table/Table.tsx
23478
- import { jsx as jsx142 } from "@emotion/react/jsx-runtime";
22688
+ import { jsx as jsx140 } from "@emotion/react/jsx-runtime";
23479
22689
  var Table = React24.forwardRef(
23480
22690
  ({ children, cellPadding, ...otherProps }, ref) => {
23481
- return /* @__PURE__ */ jsx142("table", { ref, css: table({ cellPadding }), ...otherProps, children });
22691
+ return /* @__PURE__ */ jsx140("table", { ref, css: table({ cellPadding }), ...otherProps, children });
23482
22692
  }
23483
22693
  );
23484
22694
  var TableHead = React24.forwardRef(
23485
22695
  ({ children, ...otherProps }, ref) => {
23486
- return /* @__PURE__ */ jsx142("thead", { ref, css: tableHead, ...otherProps, children });
22696
+ return /* @__PURE__ */ jsx140("thead", { ref, css: tableHead, ...otherProps, children });
23487
22697
  }
23488
22698
  );
23489
22699
  var TableBody = React24.forwardRef(
23490
22700
  ({ children, ...otherProps }, ref) => {
23491
- return /* @__PURE__ */ jsx142("tbody", { ref, ...otherProps, children });
22701
+ return /* @__PURE__ */ jsx140("tbody", { ref, ...otherProps, children });
23492
22702
  }
23493
22703
  );
23494
22704
  var TableFoot = React24.forwardRef(
23495
22705
  ({ children, ...otherProps }, ref) => {
23496
- return /* @__PURE__ */ jsx142("tfoot", { ref, ...otherProps, children });
22706
+ return /* @__PURE__ */ jsx140("tfoot", { ref, ...otherProps, children });
23497
22707
  }
23498
22708
  );
23499
22709
  var TableRow = React24.forwardRef(
23500
22710
  ({ children, ...otherProps }, ref) => {
23501
- return /* @__PURE__ */ jsx142("tr", { ref, css: tableRow, ...otherProps, children });
22711
+ return /* @__PURE__ */ jsx140("tr", { ref, css: tableRow, ...otherProps, children });
23502
22712
  }
23503
22713
  );
23504
22714
  var TableCellHead = React24.forwardRef(
23505
22715
  ({ children, ...otherProps }, ref) => {
23506
- return /* @__PURE__ */ jsx142("th", { ref, css: tableCellHead, ...otherProps, children });
22716
+ return /* @__PURE__ */ jsx140("th", { ref, css: tableCellHead, ...otherProps, children });
23507
22717
  }
23508
22718
  );
23509
22719
  var TableCellData = React24.forwardRef(
23510
22720
  ({ children, ...otherProps }, ref) => {
23511
- return /* @__PURE__ */ jsx142("td", { ref, ...otherProps, children });
22721
+ return /* @__PURE__ */ jsx140("td", { ref, ...otherProps, children });
23512
22722
  }
23513
22723
  );
23514
22724
 
@@ -23520,11 +22730,11 @@ import {
23520
22730
  TabProvider as AriakitTabProvider,
23521
22731
  useTabStore as useAriakitTabStore
23522
22732
  } from "@ariakit/react";
23523
- import { useCallback as useCallback15, useEffect as useEffect25, useMemo as useMemo10 } from "react";
22733
+ import { useCallback as useCallback13, useEffect as useEffect23, useMemo as useMemo9 } from "react";
23524
22734
 
23525
22735
  // src/components/Tabs/Tabs.styles.ts
23526
- import { css as css109 } from "@emotion/react";
23527
- var tabButtonStyles = css109`
22736
+ import { css as css107 } from "@emotion/react";
22737
+ var tabButtonStyles = css107`
23528
22738
  align-items: center;
23529
22739
  border: 0;
23530
22740
  height: 2.5rem;
@@ -23541,14 +22751,14 @@ var tabButtonStyles = css109`
23541
22751
  box-shadow: inset 0 -2px 0 var(--brand-secondary-3);
23542
22752
  }
23543
22753
  `;
23544
- var tabButtonGroupStyles = css109`
22754
+ var tabButtonGroupStyles = css107`
23545
22755
  display: flex;
23546
22756
  gap: var(--spacing-base);
23547
22757
  border-bottom: 1px solid var(--gray-300);
23548
22758
  `;
23549
22759
 
23550
22760
  // src/components/Tabs/Tabs.tsx
23551
- import { jsx as jsx143 } from "@emotion/react/jsx-runtime";
22761
+ import { jsx as jsx141 } from "@emotion/react/jsx-runtime";
23552
22762
  var useCurrentTab = () => {
23553
22763
  const context = useAriakitTabStore();
23554
22764
  if (!context) {
@@ -23564,12 +22774,12 @@ var Tabs = ({
23564
22774
  manual,
23565
22775
  ...props
23566
22776
  }) => {
23567
- const selected = useMemo10(() => {
22777
+ const selected = useMemo9(() => {
23568
22778
  if (selectedId) return selectedId;
23569
22779
  return useHashForState && typeof window !== "undefined" && window.location.hash ? window.location.hash.substring(1) : void 0;
23570
22780
  }, [selectedId, useHashForState]);
23571
22781
  const tab = useAriakitTabStore({ ...props, selectOnMove: !manual, selectedId: selected });
23572
- const onTabSelect = useCallback15(
22782
+ const onTabSelect = useCallback13(
23573
22783
  (value) => {
23574
22784
  const selectedValueWithoutNull = value != null ? value : void 0;
23575
22785
  onSelectedIdChange == null ? void 0 : onSelectedIdChange(selectedValueWithoutNull);
@@ -23580,33 +22790,33 @@ var Tabs = ({
23580
22790
  },
23581
22791
  [onSelectedIdChange, useHashForState]
23582
22792
  );
23583
- useEffect25(() => {
22793
+ useEffect23(() => {
23584
22794
  if (selected && selected !== tab.getState().activeId) {
23585
22795
  tab.setSelectedId(selected);
23586
22796
  }
23587
22797
  }, [selected, tab]);
23588
- return /* @__PURE__ */ jsx143(AriakitTabProvider, { store: tab, setSelectedId: onTabSelect, children });
22798
+ return /* @__PURE__ */ jsx141(AriakitTabProvider, { store: tab, setSelectedId: onTabSelect, children });
23589
22799
  };
23590
22800
  var TabButtonGroup = ({ children, ...props }) => {
23591
- return /* @__PURE__ */ jsx143(AriakitTabList, { ...props, css: tabButtonGroupStyles, children });
22801
+ return /* @__PURE__ */ jsx141(AriakitTabList, { ...props, css: tabButtonGroupStyles, children });
23592
22802
  };
23593
22803
  var TabButton = ({
23594
22804
  children,
23595
22805
  id,
23596
22806
  ...props
23597
22807
  }) => {
23598
- return /* @__PURE__ */ jsx143(AriakitTab, { type: "button", id, ...props, css: tabButtonStyles, children });
22808
+ return /* @__PURE__ */ jsx141(AriakitTab, { type: "button", id, ...props, css: tabButtonStyles, children });
23599
22809
  };
23600
22810
  var TabContent = ({
23601
22811
  children,
23602
22812
  ...props
23603
22813
  }) => {
23604
- return /* @__PURE__ */ jsx143(AriakitTabPanel, { ...props, children });
22814
+ return /* @__PURE__ */ jsx141(AriakitTabPanel, { ...props, children });
23605
22815
  };
23606
22816
 
23607
22817
  // src/components/Validation/StatusBullet.styles.ts
23608
- import { css as css110 } from "@emotion/react";
23609
- var StatusBulletContainer = css110`
22818
+ import { css as css108 } from "@emotion/react";
22819
+ var StatusBulletContainer = css108`
23610
22820
  align-items: center;
23611
22821
  align-self: center;
23612
22822
  color: var(--gray-500);
@@ -23623,33 +22833,33 @@ var StatusBulletContainer = css110`
23623
22833
  display: block;
23624
22834
  }
23625
22835
  `;
23626
- var StatusBulletBase = css110`
22836
+ var StatusBulletBase = css108`
23627
22837
  font-size: var(--fs-sm);
23628
22838
  &:before {
23629
22839
  width: var(--fs-xs);
23630
22840
  height: var(--fs-xs);
23631
22841
  }
23632
22842
  `;
23633
- var StatusBulletSmall = css110`
22843
+ var StatusBulletSmall = css108`
23634
22844
  font-size: var(--fs-xs);
23635
22845
  &:before {
23636
22846
  width: var(--fs-xxs);
23637
22847
  height: var(--fs-xxs);
23638
22848
  }
23639
22849
  `;
23640
- var StatusDraft = css110`
22850
+ var StatusDraft = css108`
23641
22851
  &:before {
23642
22852
  background: var(--white);
23643
22853
  box-shadow: inset 0 0 0 0.125rem var(--accent-dark);
23644
22854
  }
23645
22855
  `;
23646
- var StatusModified = css110`
22856
+ var StatusModified = css108`
23647
22857
  &:before {
23648
22858
  background: linear-gradient(to right, var(--white) 50%, var(--accent-dark) 50% 100%);
23649
22859
  box-shadow: inset 0 0 0 0.125rem var(--accent-dark);
23650
22860
  }
23651
22861
  `;
23652
- var StatusError = css110`
22862
+ var StatusError = css108`
23653
22863
  color: var(--error);
23654
22864
  &:before {
23655
22865
  /* TODO: replace this with an svg icon */
@@ -23662,29 +22872,29 @@ var StatusError = css110`
23662
22872
  );
23663
22873
  }
23664
22874
  `;
23665
- var StatusPublished = css110`
22875
+ var StatusPublished = css108`
23666
22876
  &:before {
23667
22877
  background: var(--accent-dark);
23668
22878
  }
23669
22879
  `;
23670
- var StatusOrphan = css110`
22880
+ var StatusOrphan = css108`
23671
22881
  &:before {
23672
22882
  background: var(--brand-secondary-5);
23673
22883
  }
23674
22884
  `;
23675
- var StatusUnknown = css110`
22885
+ var StatusUnknown = css108`
23676
22886
  &:before {
23677
22887
  background: var(--gray-800);
23678
22888
  }
23679
22889
  `;
23680
- var StatusDeleted = css110`
22890
+ var StatusDeleted = css108`
23681
22891
  &:before {
23682
22892
  background: var(--error);
23683
22893
  }
23684
22894
  `;
23685
22895
 
23686
22896
  // src/components/Validation/StatusBullet.tsx
23687
- import { jsx as jsx144 } from "@emotion/react/jsx-runtime";
22897
+ import { jsx as jsx142 } from "@emotion/react/jsx-runtime";
23688
22898
  var StatusBullet = ({
23689
22899
  status,
23690
22900
  hideText = false,
@@ -23704,7 +22914,7 @@ var StatusBullet = ({
23704
22914
  Deleted: StatusDeleted
23705
22915
  };
23706
22916
  const statusSize = size === "base" ? StatusBulletBase : StatusBulletSmall;
23707
- return /* @__PURE__ */ jsx144(
22917
+ return /* @__PURE__ */ jsx142(
23708
22918
  "span",
23709
22919
  {
23710
22920
  role: "status",
@@ -23963,12 +23173,16 @@ export {
23963
23173
  supports,
23964
23174
  textInput,
23965
23175
  toast,
23176
+ uniformAiIcon,
23966
23177
  uniformComponentIcon,
23967
23178
  uniformComponentPatternIcon,
23968
23179
  uniformCompositionPatternIcon,
23180
+ uniformConditionalValuesIcon,
23969
23181
  uniformContentTypeIcon,
23970
23182
  uniformEntryIcon,
23971
23183
  uniformEntryPatternIcon,
23184
+ uniformLocaleDisabledIcon,
23185
+ uniformLocaleIcon,
23972
23186
  useBreakpoint,
23973
23187
  useCloseCurrentDrawer,
23974
23188
  useCurrentDrawer,
@@ -23979,7 +23193,6 @@ export {
23979
23193
  useOutsideClick,
23980
23194
  useParameterShell,
23981
23195
  usePopoverComponentContext,
23982
- useRichTextToolbarState,
23983
23196
  useShortcut,
23984
23197
  functionalColors as utilityColors,
23985
23198
  warningIcon,