@uniformdev/design-system 20.64.1-alpha.3 → 20.65.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/esm/index.js +196 -107
- package/dist/index.js +482 -392
- package/package.json +4 -4
package/dist/index.js
CHANGED
|
@@ -15580,11 +15580,17 @@ var ObjectListSubText2 = ({ children, ...props }) => {
|
|
|
15580
15580
|
|
|
15581
15581
|
// src/components/Pagination/Pagination.tsx
|
|
15582
15582
|
init_emotion_jsx_shim();
|
|
15583
|
+
var React20 = __toESM(require("react"));
|
|
15583
15584
|
var import_react_paginate = __toESM(require("react-paginate"));
|
|
15584
15585
|
|
|
15585
15586
|
// src/components/Pagination/Pagniation.styles.ts
|
|
15586
15587
|
init_emotion_jsx_shim();
|
|
15587
15588
|
var import_css = require("@emotion/css");
|
|
15589
|
+
var wrapper = import_css.css`
|
|
15590
|
+
display: inline-flex;
|
|
15591
|
+
max-width: 100%;
|
|
15592
|
+
overflow-x: auto;
|
|
15593
|
+
`;
|
|
15588
15594
|
var container2 = import_css.css`
|
|
15589
15595
|
align-items: center;
|
|
15590
15596
|
display: flex;
|
|
@@ -15611,6 +15617,91 @@ var page = import_css.css`
|
|
|
15611
15617
|
margin-right: var(--spacing-xs);
|
|
15612
15618
|
`;
|
|
15613
15619
|
|
|
15620
|
+
// src/components/Pagination/usePaginationDisplayRange.ts
|
|
15621
|
+
init_emotion_jsx_shim();
|
|
15622
|
+
var import_react140 = require("react");
|
|
15623
|
+
var DEFAULT_PAGINATION_DISPLAY_RANGE = {
|
|
15624
|
+
marginPagesDisplayed: 2,
|
|
15625
|
+
pageRangeDisplayed: 5
|
|
15626
|
+
};
|
|
15627
|
+
var PREV_NEXT_WIDTH = 64;
|
|
15628
|
+
var BREAK_WIDTH = 28;
|
|
15629
|
+
var PAGE_PADDING = 32;
|
|
15630
|
+
var PAGE_MARGIN = 8;
|
|
15631
|
+
var DIGIT_WIDTH = 10;
|
|
15632
|
+
var WIDE_DISPLAY_RANGE = {
|
|
15633
|
+
marginPagesDisplayed: 2,
|
|
15634
|
+
pageRangeDisplayed: 5
|
|
15635
|
+
};
|
|
15636
|
+
var MEDIUM_DISPLAY_RANGE = {
|
|
15637
|
+
marginPagesDisplayed: 1,
|
|
15638
|
+
pageRangeDisplayed: 3
|
|
15639
|
+
};
|
|
15640
|
+
var COMPACT_DISPLAY_RANGE = {
|
|
15641
|
+
marginPagesDisplayed: 0,
|
|
15642
|
+
pageRangeDisplayed: 3
|
|
15643
|
+
};
|
|
15644
|
+
var MINIMAL_DISPLAY_RANGE = {
|
|
15645
|
+
marginPagesDisplayed: 0,
|
|
15646
|
+
pageRangeDisplayed: 1
|
|
15647
|
+
};
|
|
15648
|
+
function estimatePageButtonWidth(pageCount) {
|
|
15649
|
+
const digits = Math.max(1, String(pageCount).length);
|
|
15650
|
+
return PAGE_PADDING + PAGE_MARGIN + digits * DIGIT_WIDTH;
|
|
15651
|
+
}
|
|
15652
|
+
function getMinimumWidthForDisplayRange(pageCount, displayRange) {
|
|
15653
|
+
const pageButtonWidth = estimatePageButtonWidth(pageCount);
|
|
15654
|
+
const pageButtons = displayRange.marginPagesDisplayed * 2 + displayRange.pageRangeDisplayed;
|
|
15655
|
+
return pageButtons * pageButtonWidth + PREV_NEXT_WIDTH + BREAK_WIDTH * 2;
|
|
15656
|
+
}
|
|
15657
|
+
function getPaginationDisplayRange(containerWidth, pageCount) {
|
|
15658
|
+
if (containerWidth <= 0) {
|
|
15659
|
+
return MINIMAL_DISPLAY_RANGE;
|
|
15660
|
+
}
|
|
15661
|
+
if (containerWidth >= getMinimumWidthForDisplayRange(pageCount, WIDE_DISPLAY_RANGE)) {
|
|
15662
|
+
return WIDE_DISPLAY_RANGE;
|
|
15663
|
+
}
|
|
15664
|
+
if (containerWidth >= getMinimumWidthForDisplayRange(pageCount, MEDIUM_DISPLAY_RANGE)) {
|
|
15665
|
+
return MEDIUM_DISPLAY_RANGE;
|
|
15666
|
+
}
|
|
15667
|
+
if (containerWidth >= getMinimumWidthForDisplayRange(pageCount, COMPACT_DISPLAY_RANGE)) {
|
|
15668
|
+
return COMPACT_DISPLAY_RANGE;
|
|
15669
|
+
}
|
|
15670
|
+
return MINIMAL_DISPLAY_RANGE;
|
|
15671
|
+
}
|
|
15672
|
+
function getAvailablePaginationWidth(container5) {
|
|
15673
|
+
var _a;
|
|
15674
|
+
const measurementElement = (_a = container5.parentElement) != null ? _a : container5;
|
|
15675
|
+
return measurementElement.getBoundingClientRect().width;
|
|
15676
|
+
}
|
|
15677
|
+
function usePaginationDisplayRange(containerRef, pageCount) {
|
|
15678
|
+
const [displayRange, setDisplayRange] = (0, import_react140.useState)(DEFAULT_PAGINATION_DISPLAY_RANGE);
|
|
15679
|
+
(0, import_react140.useEffect)(() => {
|
|
15680
|
+
var _a;
|
|
15681
|
+
const container5 = containerRef.current;
|
|
15682
|
+
if (!container5) {
|
|
15683
|
+
return;
|
|
15684
|
+
}
|
|
15685
|
+
const measurementElement = (_a = container5.parentElement) != null ? _a : container5;
|
|
15686
|
+
const updateDisplayRange = () => {
|
|
15687
|
+
const currentContainer = containerRef.current;
|
|
15688
|
+
if (!currentContainer) {
|
|
15689
|
+
return;
|
|
15690
|
+
}
|
|
15691
|
+
setDisplayRange(getPaginationDisplayRange(getAvailablePaginationWidth(currentContainer), pageCount));
|
|
15692
|
+
};
|
|
15693
|
+
updateDisplayRange();
|
|
15694
|
+
const observer = new ResizeObserver(() => {
|
|
15695
|
+
updateDisplayRange();
|
|
15696
|
+
});
|
|
15697
|
+
observer.observe(measurementElement);
|
|
15698
|
+
return () => {
|
|
15699
|
+
observer.disconnect();
|
|
15700
|
+
};
|
|
15701
|
+
}, [containerRef, pageCount]);
|
|
15702
|
+
return displayRange;
|
|
15703
|
+
}
|
|
15704
|
+
|
|
15614
15705
|
// src/components/Pagination/Pagination.tsx
|
|
15615
15706
|
var import_jsx_runtime122 = require("@emotion/react/jsx-runtime");
|
|
15616
15707
|
function Pagination({
|
|
@@ -15619,15 +15710,14 @@ function Pagination({
|
|
|
15619
15710
|
total,
|
|
15620
15711
|
onPageChange
|
|
15621
15712
|
}) {
|
|
15622
|
-
|
|
15623
|
-
|
|
15624
|
-
|
|
15625
|
-
const
|
|
15626
|
-
|
|
15627
|
-
if (pageCount <= 1) {
|
|
15713
|
+
const containerRef = React20.useRef(null);
|
|
15714
|
+
const pageCount = limit >= 1 ? Math.ceil(total / limit) : 0;
|
|
15715
|
+
const currentPage = limit >= 1 ? Math.ceil(offset / limit) : 0;
|
|
15716
|
+
const { marginPagesDisplayed, pageRangeDisplayed } = usePaginationDisplayRange(containerRef, pageCount);
|
|
15717
|
+
if (limit < 1 || pageCount <= 1) {
|
|
15628
15718
|
return null;
|
|
15629
15719
|
}
|
|
15630
|
-
return /* @__PURE__ */ (0, import_jsx_runtime122.jsx)(
|
|
15720
|
+
return /* @__PURE__ */ (0, import_jsx_runtime122.jsx)("div", { ref: containerRef, className: wrapper, children: /* @__PURE__ */ (0, import_jsx_runtime122.jsx)(
|
|
15631
15721
|
import_react_paginate.default,
|
|
15632
15722
|
{
|
|
15633
15723
|
forcePage: currentPage,
|
|
@@ -15635,8 +15725,8 @@ function Pagination({
|
|
|
15635
15725
|
nextLabel: /* @__PURE__ */ (0, import_jsx_runtime122.jsx)("div", { className: prevNextControls, children: ">" }),
|
|
15636
15726
|
breakLabel: "...",
|
|
15637
15727
|
pageCount,
|
|
15638
|
-
marginPagesDisplayed
|
|
15639
|
-
pageRangeDisplayed
|
|
15728
|
+
marginPagesDisplayed,
|
|
15729
|
+
pageRangeDisplayed,
|
|
15640
15730
|
onPageChange: ({ selected }) => {
|
|
15641
15731
|
onPageChange(limit, selected * limit);
|
|
15642
15732
|
},
|
|
@@ -15647,13 +15737,13 @@ function Pagination({
|
|
|
15647
15737
|
activeClassName: active,
|
|
15648
15738
|
pageClassName: page
|
|
15649
15739
|
}
|
|
15650
|
-
);
|
|
15740
|
+
) });
|
|
15651
15741
|
}
|
|
15652
15742
|
|
|
15653
15743
|
// src/components/ParameterInputs/hooks/ParameterShellContext.tsx
|
|
15654
15744
|
init_emotion_jsx_shim();
|
|
15655
|
-
var
|
|
15656
|
-
var ParameterShellContext = (0,
|
|
15745
|
+
var import_react141 = require("react");
|
|
15746
|
+
var ParameterShellContext = (0, import_react141.createContext)({
|
|
15657
15747
|
id: "",
|
|
15658
15748
|
label: "",
|
|
15659
15749
|
hiddenLabel: void 0,
|
|
@@ -15662,7 +15752,7 @@ var ParameterShellContext = (0, import_react140.createContext)({
|
|
|
15662
15752
|
}
|
|
15663
15753
|
});
|
|
15664
15754
|
var useParameterShell = () => {
|
|
15665
|
-
const { id, label: label2, hiddenLabel, errorMessage, handleManuallySetErrorMessage } = (0,
|
|
15755
|
+
const { id, label: label2, hiddenLabel, errorMessage, handleManuallySetErrorMessage } = (0, import_react141.useContext)(ParameterShellContext);
|
|
15666
15756
|
return {
|
|
15667
15757
|
id,
|
|
15668
15758
|
label: label2,
|
|
@@ -15677,8 +15767,8 @@ init_emotion_jsx_shim();
|
|
|
15677
15767
|
|
|
15678
15768
|
// src/components/ParameterInputs/styles/LabelLeadingIcon.styles.ts
|
|
15679
15769
|
init_emotion_jsx_shim();
|
|
15680
|
-
var
|
|
15681
|
-
var inputIconBtn =
|
|
15770
|
+
var import_react142 = require("@emotion/react");
|
|
15771
|
+
var inputIconBtn = import_react142.css`
|
|
15682
15772
|
align-items: center;
|
|
15683
15773
|
border: none;
|
|
15684
15774
|
border-radius: var(--rounded-base);
|
|
@@ -15743,12 +15833,12 @@ var LabelLeadingIcon = ({
|
|
|
15743
15833
|
|
|
15744
15834
|
// src/components/ParameterInputs/ParameterActionButton.tsx
|
|
15745
15835
|
init_emotion_jsx_shim();
|
|
15746
|
-
var
|
|
15836
|
+
var import_react144 = __toESM(require("react"));
|
|
15747
15837
|
|
|
15748
15838
|
// src/components/ParameterInputs/styles/ParameterActionButton.styles.ts
|
|
15749
15839
|
init_emotion_jsx_shim();
|
|
15750
|
-
var
|
|
15751
|
-
var baseStyles =
|
|
15840
|
+
var import_react143 = require("@emotion/react");
|
|
15841
|
+
var baseStyles = import_react143.css`
|
|
15752
15842
|
--hover-color: var(--accent-dark-hover);
|
|
15753
15843
|
--active-color: var(--accent-dark-active);
|
|
15754
15844
|
border: 1px solid transparent;
|
|
@@ -15773,7 +15863,7 @@ var baseStyles = import_react142.css`
|
|
|
15773
15863
|
cursor: default;
|
|
15774
15864
|
}
|
|
15775
15865
|
`;
|
|
15776
|
-
var solidHoverStyles =
|
|
15866
|
+
var solidHoverStyles = import_react143.css`
|
|
15777
15867
|
--text-color: var(--typography-inverted);
|
|
15778
15868
|
&:hover,
|
|
15779
15869
|
&:focus,
|
|
@@ -15790,7 +15880,7 @@ var solidHoverStyles = import_react142.css`
|
|
|
15790
15880
|
color: var(--text-color);
|
|
15791
15881
|
}
|
|
15792
15882
|
`;
|
|
15793
|
-
var outlineHoverStyles =
|
|
15883
|
+
var outlineHoverStyles = import_react143.css`
|
|
15794
15884
|
--text-color: var(--typography-light);
|
|
15795
15885
|
&:hover:not([aria-disabled='true']),
|
|
15796
15886
|
&:focus:not([aria-disabled='true']),
|
|
@@ -15803,7 +15893,7 @@ var outlineHoverStyles = import_react142.css`
|
|
|
15803
15893
|
border-color: var(--active-color);
|
|
15804
15894
|
}
|
|
15805
15895
|
`;
|
|
15806
|
-
var invertedStyles =
|
|
15896
|
+
var invertedStyles = import_react143.css`
|
|
15807
15897
|
--text-color: var(--typography-inverted);
|
|
15808
15898
|
box-shadow: inset 0 0 0 1px transparent;
|
|
15809
15899
|
&:hover,
|
|
@@ -15848,7 +15938,7 @@ var ParameterActionButton = ({
|
|
|
15848
15938
|
children
|
|
15849
15939
|
}
|
|
15850
15940
|
);
|
|
15851
|
-
if (tooltip && (typeof tooltip === "string" ||
|
|
15941
|
+
if (tooltip && (typeof tooltip === "string" || import_react144.default.isValidElement(tooltip))) {
|
|
15852
15942
|
return /* @__PURE__ */ (0, import_jsx_runtime124.jsx)(Tooltip, { title: tooltip, ...tooltipProps, children: buttonElement });
|
|
15853
15943
|
}
|
|
15854
15944
|
return buttonElement;
|
|
@@ -15859,20 +15949,20 @@ init_emotion_jsx_shim();
|
|
|
15859
15949
|
|
|
15860
15950
|
// src/components/ParameterInputs/styles/ParameterDrawerHeader.styles.ts
|
|
15861
15951
|
init_emotion_jsx_shim();
|
|
15862
|
-
var
|
|
15863
|
-
var ParameterDrawerHeaderContainer =
|
|
15952
|
+
var import_react145 = require("@emotion/react");
|
|
15953
|
+
var ParameterDrawerHeaderContainer = import_react145.css`
|
|
15864
15954
|
align-items: center;
|
|
15865
15955
|
display: flex;
|
|
15866
15956
|
gap: var(--spacing-base);
|
|
15867
15957
|
justify-content: space-between;
|
|
15868
15958
|
margin-bottom: var(--spacing-sm);
|
|
15869
15959
|
`;
|
|
15870
|
-
var ParameterDrawerHeaderTitleGroup =
|
|
15960
|
+
var ParameterDrawerHeaderTitleGroup = import_react145.css`
|
|
15871
15961
|
align-items: center;
|
|
15872
15962
|
display: flex;
|
|
15873
15963
|
gap: var(--spacing-sm);
|
|
15874
15964
|
`;
|
|
15875
|
-
var ParameterDrawerHeaderTitle =
|
|
15965
|
+
var ParameterDrawerHeaderTitle = import_react145.css`
|
|
15876
15966
|
text-overflow: ellipsis;
|
|
15877
15967
|
white-space: nowrap;
|
|
15878
15968
|
overflow: hidden;
|
|
@@ -15893,12 +15983,12 @@ var ParameterDrawerHeader = ({ title, iconBeforeTitle, children }) => {
|
|
|
15893
15983
|
|
|
15894
15984
|
// src/components/ParameterInputs/ParameterGroup.tsx
|
|
15895
15985
|
init_emotion_jsx_shim();
|
|
15896
|
-
var
|
|
15986
|
+
var import_react147 = require("react");
|
|
15897
15987
|
|
|
15898
15988
|
// src/components/ParameterInputs/styles/ParameterGroup.styles.ts
|
|
15899
15989
|
init_emotion_jsx_shim();
|
|
15900
|
-
var
|
|
15901
|
-
var fieldsetStyles =
|
|
15990
|
+
var import_react146 = require("@emotion/react");
|
|
15991
|
+
var fieldsetStyles = import_react146.css`
|
|
15902
15992
|
&:disabled,
|
|
15903
15993
|
[readonly] {
|
|
15904
15994
|
input,
|
|
@@ -15913,7 +16003,7 @@ var fieldsetStyles = import_react145.css`
|
|
|
15913
16003
|
}
|
|
15914
16004
|
}
|
|
15915
16005
|
`;
|
|
15916
|
-
var fieldsetLegend2 =
|
|
16006
|
+
var fieldsetLegend2 = import_react146.css`
|
|
15917
16007
|
display: block;
|
|
15918
16008
|
font-weight: var(--fw-medium);
|
|
15919
16009
|
margin-bottom: var(--spacing-base);
|
|
@@ -15922,7 +16012,7 @@ var fieldsetLegend2 = import_react145.css`
|
|
|
15922
16012
|
|
|
15923
16013
|
// src/components/ParameterInputs/ParameterGroup.tsx
|
|
15924
16014
|
var import_jsx_runtime126 = require("@emotion/react/jsx-runtime");
|
|
15925
|
-
var ParameterGroup = (0,
|
|
16015
|
+
var ParameterGroup = (0, import_react147.forwardRef)(
|
|
15926
16016
|
({ legend, isDisabled, children, ...props }, ref) => {
|
|
15927
16017
|
return /* @__PURE__ */ (0, import_jsx_runtime126.jsxs)("fieldset", { css: fieldsetStyles, disabled: isDisabled, ref, ...props, children: [
|
|
15928
16018
|
/* @__PURE__ */ (0, import_jsx_runtime126.jsx)("legend", { css: fieldsetLegend2, children: legend }),
|
|
@@ -15933,24 +16023,24 @@ var ParameterGroup = (0, import_react146.forwardRef)(
|
|
|
15933
16023
|
|
|
15934
16024
|
// src/components/ParameterInputs/ParameterImage.tsx
|
|
15935
16025
|
init_emotion_jsx_shim();
|
|
15936
|
-
var
|
|
16026
|
+
var import_react155 = require("react");
|
|
15937
16027
|
|
|
15938
16028
|
// src/components/ParameterInputs/ParameterImagePreview.tsx
|
|
15939
16029
|
init_emotion_jsx_shim();
|
|
15940
|
-
var
|
|
16030
|
+
var import_react149 = require("react");
|
|
15941
16031
|
var import_react_dom2 = require("react-dom");
|
|
15942
16032
|
|
|
15943
16033
|
// src/components/ParameterInputs/styles/ParameterImage.styles.ts
|
|
15944
16034
|
init_emotion_jsx_shim();
|
|
15945
|
-
var
|
|
15946
|
-
var previewWrapper =
|
|
16035
|
+
var import_react148 = require("@emotion/react");
|
|
16036
|
+
var previewWrapper = import_react148.css`
|
|
15947
16037
|
margin-top: var(--spacing-xs);
|
|
15948
16038
|
background: var(--gray-50);
|
|
15949
16039
|
padding: var(--spacing-sm);
|
|
15950
16040
|
border: solid 1px var(--gray-300);
|
|
15951
16041
|
border-radius: var(--rounded-sm);
|
|
15952
16042
|
`;
|
|
15953
|
-
var previewLink =
|
|
16043
|
+
var previewLink = import_react148.css`
|
|
15954
16044
|
display: block;
|
|
15955
16045
|
width: 100%;
|
|
15956
16046
|
|
|
@@ -15958,7 +16048,7 @@ var previewLink = import_react147.css`
|
|
|
15958
16048
|
max-height: 9rem;
|
|
15959
16049
|
}
|
|
15960
16050
|
`;
|
|
15961
|
-
var previewModalWrapper =
|
|
16051
|
+
var previewModalWrapper = import_react148.css`
|
|
15962
16052
|
background: var(--gray-50);
|
|
15963
16053
|
display: flex;
|
|
15964
16054
|
height: 100%;
|
|
@@ -15967,7 +16057,7 @@ var previewModalWrapper = import_react147.css`
|
|
|
15967
16057
|
border: solid 1px var(--gray-300);
|
|
15968
16058
|
border-radius: var(--rounded-sm);
|
|
15969
16059
|
`;
|
|
15970
|
-
var previewModalImage =
|
|
16060
|
+
var previewModalImage = import_react148.css`
|
|
15971
16061
|
display: flex;
|
|
15972
16062
|
height: 100%;
|
|
15973
16063
|
width: 100%;
|
|
@@ -15981,7 +16071,7 @@ var previewModalImage = import_react147.css`
|
|
|
15981
16071
|
// src/components/ParameterInputs/ParameterImagePreview.tsx
|
|
15982
16072
|
var import_jsx_runtime127 = require("@emotion/react/jsx-runtime");
|
|
15983
16073
|
function ParameterImagePreview({ imageSrc }) {
|
|
15984
|
-
const [showModal, setShowModal] = (0,
|
|
16074
|
+
const [showModal, setShowModal] = (0, import_react149.useState)(false);
|
|
15985
16075
|
return imageSrc ? /* @__PURE__ */ (0, import_jsx_runtime127.jsxs)("div", { css: previewWrapper, children: [
|
|
15986
16076
|
/* @__PURE__ */ (0, import_jsx_runtime127.jsx)(PreviewImageModal, { open: showModal, imageSrc, onRequestClose: () => setShowModal(false) }),
|
|
15987
16077
|
/* @__PURE__ */ (0, import_jsx_runtime127.jsx)(
|
|
@@ -16014,16 +16104,16 @@ var PreviewImageModal = ({ open, onRequestClose, imageSrc }) => {
|
|
|
16014
16104
|
|
|
16015
16105
|
// src/components/ParameterInputs/ParameterShell.tsx
|
|
16016
16106
|
init_emotion_jsx_shim();
|
|
16017
|
-
var
|
|
16018
|
-
var
|
|
16107
|
+
var import_react153 = require("@emotion/react");
|
|
16108
|
+
var import_react154 = require("react");
|
|
16019
16109
|
|
|
16020
16110
|
// src/components/ParameterInputs/ParameterLabel.tsx
|
|
16021
16111
|
init_emotion_jsx_shim();
|
|
16022
16112
|
|
|
16023
16113
|
// src/components/ParameterInputs/styles/ParameterInput.styles.ts
|
|
16024
16114
|
init_emotion_jsx_shim();
|
|
16025
|
-
var
|
|
16026
|
-
var actionBarVisibilityStyles =
|
|
16115
|
+
var import_react150 = require("@emotion/react");
|
|
16116
|
+
var actionBarVisibilityStyles = import_react150.css`
|
|
16027
16117
|
[data-action-bar] {
|
|
16028
16118
|
opacity: 1;
|
|
16029
16119
|
transform: translateX(0);
|
|
@@ -16032,14 +16122,14 @@ var actionBarVisibilityStyles = import_react149.css`
|
|
|
16032
16122
|
transform var(--duration-fast) var(--timing-ease-out);
|
|
16033
16123
|
}
|
|
16034
16124
|
`;
|
|
16035
|
-
var actionBarVisibilityHiddenStyles =
|
|
16125
|
+
var actionBarVisibilityHiddenStyles = import_react150.css`
|
|
16036
16126
|
opacity: 0;
|
|
16037
16127
|
transform: translateX(1rem);
|
|
16038
16128
|
transition:
|
|
16039
16129
|
opacity var(--duration-fast) var(--timing-ease-out),
|
|
16040
16130
|
transform var(--duration-fast) var(--timing-ease-out);
|
|
16041
16131
|
`;
|
|
16042
|
-
var inputContainer2 =
|
|
16132
|
+
var inputContainer2 = import_react150.css`
|
|
16043
16133
|
position: relative;
|
|
16044
16134
|
scroll-margin: var(--spacing-2xl);
|
|
16045
16135
|
|
|
@@ -16053,14 +16143,14 @@ var inputContainer2 = import_react149.css`
|
|
|
16053
16143
|
${actionBarVisibilityStyles}
|
|
16054
16144
|
}
|
|
16055
16145
|
`;
|
|
16056
|
-
var labelText2 =
|
|
16146
|
+
var labelText2 = import_react150.css`
|
|
16057
16147
|
align-items: center;
|
|
16058
16148
|
display: flex;
|
|
16059
16149
|
gap: var(--spacing-xs);
|
|
16060
16150
|
font-weight: var(--fw-regular);
|
|
16061
16151
|
margin: 0 0 var(--spacing-xs);
|
|
16062
16152
|
`;
|
|
16063
|
-
var input3 =
|
|
16153
|
+
var input3 = import_react150.css`
|
|
16064
16154
|
display: block;
|
|
16065
16155
|
appearance: none;
|
|
16066
16156
|
box-sizing: border-box;
|
|
@@ -16113,18 +16203,18 @@ var input3 = import_react149.css`
|
|
|
16113
16203
|
opacity: var(--opacity-50);
|
|
16114
16204
|
}
|
|
16115
16205
|
`;
|
|
16116
|
-
var selectInput =
|
|
16206
|
+
var selectInput = import_react150.css`
|
|
16117
16207
|
background-image: url("data:image/svg+xml,%3Csvg width='24' height='24' viewBox='0 0 24 24' fill='none' xmlns='http://www.w3.org/2000/svg'%0A%3E%3Cpath d='M6.34317 7.75732L4.92896 9.17154L12 16.2426L19.0711 9.17157L17.6569 7.75735L12 13.4142L6.34317 7.75732Z' fill='currentColor' /%3E%3C/svg%3E");
|
|
16118
16208
|
background-position: right var(--spacing-sm) center;
|
|
16119
16209
|
background-repeat: no-repeat;
|
|
16120
16210
|
background-size: 1rem;
|
|
16121
16211
|
padding-right: var(--spacing-xl);
|
|
16122
16212
|
`;
|
|
16123
|
-
var inputWrapper =
|
|
16213
|
+
var inputWrapper = import_react150.css`
|
|
16124
16214
|
display: flex; // used to correct overflow with chrome textarea
|
|
16125
16215
|
position: relative;
|
|
16126
16216
|
`;
|
|
16127
|
-
var inputIcon2 =
|
|
16217
|
+
var inputIcon2 = import_react150.css`
|
|
16128
16218
|
align-items: center;
|
|
16129
16219
|
background: var(--white);
|
|
16130
16220
|
border-radius: var(--rounded-md) 0 0 var(--rounded-md);
|
|
@@ -16140,7 +16230,7 @@ var inputIcon2 = import_react149.css`
|
|
|
16140
16230
|
width: var(--spacing-lg);
|
|
16141
16231
|
z-index: var(--z-10);
|
|
16142
16232
|
`;
|
|
16143
|
-
var inputToggleLabel2 =
|
|
16233
|
+
var inputToggleLabel2 = import_react150.css`
|
|
16144
16234
|
--inline-label-color: var(--typography-base);
|
|
16145
16235
|
align-items: center;
|
|
16146
16236
|
cursor: pointer;
|
|
@@ -16155,7 +16245,7 @@ var inputToggleLabel2 = import_react149.css`
|
|
|
16155
16245
|
--inline-label-color: var(--gray-400);
|
|
16156
16246
|
}
|
|
16157
16247
|
`;
|
|
16158
|
-
var toggleInput2 =
|
|
16248
|
+
var toggleInput2 = import_react150.css`
|
|
16159
16249
|
appearance: none;
|
|
16160
16250
|
border: 1px solid var(--gray-200);
|
|
16161
16251
|
background: var(--white);
|
|
@@ -16199,7 +16289,7 @@ var toggleInput2 = import_react149.css`
|
|
|
16199
16289
|
border-color: var(--gray-200);
|
|
16200
16290
|
}
|
|
16201
16291
|
`;
|
|
16202
|
-
var toggleInputIndeterminateState =
|
|
16292
|
+
var toggleInputIndeterminateState = import_react150.css`
|
|
16203
16293
|
&:indeterminate,
|
|
16204
16294
|
&:indeterminate:hover,
|
|
16205
16295
|
&:indeterminate:focus {
|
|
@@ -16210,7 +16300,7 @@ var toggleInputIndeterminateState = import_react149.css`
|
|
|
16210
16300
|
color: var(--accent-dark-active);
|
|
16211
16301
|
}
|
|
16212
16302
|
`;
|
|
16213
|
-
var inlineLabel2 =
|
|
16303
|
+
var inlineLabel2 = import_react150.css`
|
|
16214
16304
|
color: var(--inline-label-color);
|
|
16215
16305
|
padding-left: var(--spacing-md);
|
|
16216
16306
|
font-size: var(--fs-sm);
|
|
@@ -16227,7 +16317,7 @@ var inlineLabel2 = import_react149.css`
|
|
|
16227
16317
|
}
|
|
16228
16318
|
}
|
|
16229
16319
|
`;
|
|
16230
|
-
var inputMenu =
|
|
16320
|
+
var inputMenu = import_react150.css`
|
|
16231
16321
|
background: none;
|
|
16232
16322
|
border: none;
|
|
16233
16323
|
padding: var(--spacing-2xs);
|
|
@@ -16241,12 +16331,12 @@ var inputMenu = import_react149.css`
|
|
|
16241
16331
|
cursor: default;
|
|
16242
16332
|
}
|
|
16243
16333
|
`;
|
|
16244
|
-
var inputActionItems =
|
|
16334
|
+
var inputActionItems = import_react150.css`
|
|
16245
16335
|
display: flex;
|
|
16246
16336
|
z-index: var(--z-1);
|
|
16247
16337
|
${actionBarVisibilityHiddenStyles}
|
|
16248
16338
|
`;
|
|
16249
|
-
var inputMenuHover =
|
|
16339
|
+
var inputMenuHover = import_react150.css`
|
|
16250
16340
|
opacity: var(--opacity-50);
|
|
16251
16341
|
transition: background-color var(--duration-fast) var(--timing-ease-out);
|
|
16252
16342
|
margin-top: 0.25rem;
|
|
@@ -16258,11 +16348,11 @@ var inputMenuHover = import_react149.css`
|
|
|
16258
16348
|
background-color: var(--gray-200);
|
|
16259
16349
|
}
|
|
16260
16350
|
`;
|
|
16261
|
-
var textarea2 =
|
|
16351
|
+
var textarea2 = import_react150.css`
|
|
16262
16352
|
resize: vertical;
|
|
16263
16353
|
min-height: 2rem;
|
|
16264
16354
|
`;
|
|
16265
|
-
var dataConnectButton =
|
|
16355
|
+
var dataConnectButton = import_react150.css`
|
|
16266
16356
|
align-items: center;
|
|
16267
16357
|
appearance: none;
|
|
16268
16358
|
box-sizing: border-box;
|
|
@@ -16298,7 +16388,7 @@ var dataConnectButton = import_react149.css`
|
|
|
16298
16388
|
pointer-events: none;
|
|
16299
16389
|
}
|
|
16300
16390
|
`;
|
|
16301
|
-
var linkParameterEmptyContainer =
|
|
16391
|
+
var linkParameterEmptyContainer = import_react150.css`
|
|
16302
16392
|
box-sizing: border-box;
|
|
16303
16393
|
background: var(--white);
|
|
16304
16394
|
border: 1px solid var(--gray-200);
|
|
@@ -16310,7 +16400,7 @@ var linkParameterEmptyContainer = import_react149.css`
|
|
|
16310
16400
|
min-height: 2rem;
|
|
16311
16401
|
width: 100%;
|
|
16312
16402
|
`;
|
|
16313
|
-
var linkParameterControls =
|
|
16403
|
+
var linkParameterControls = import_react150.css`
|
|
16314
16404
|
position: absolute;
|
|
16315
16405
|
inset: 0 0 0 auto;
|
|
16316
16406
|
padding: 0 var(--spacing-base);
|
|
@@ -16319,7 +16409,7 @@ var linkParameterControls = import_react149.css`
|
|
|
16319
16409
|
justify-content: center;
|
|
16320
16410
|
gap: var(--spacing-base);
|
|
16321
16411
|
`;
|
|
16322
|
-
var linkParameterInput = (withExternalLinkIcon) =>
|
|
16412
|
+
var linkParameterInput = (withExternalLinkIcon) => import_react150.css`
|
|
16323
16413
|
padding-right: calc(
|
|
16324
16414
|
${withExternalLinkIcon ? "calc(var(--spacing-lg) * 2 + var(--spacing-xs))" : "var(--spacing-xl)"} +
|
|
16325
16415
|
var(--spacing-base)
|
|
@@ -16332,7 +16422,7 @@ var linkParameterInput = (withExternalLinkIcon) => import_react149.css`
|
|
|
16332
16422
|
}
|
|
16333
16423
|
}
|
|
16334
16424
|
`;
|
|
16335
|
-
var linkParameterIcon =
|
|
16425
|
+
var linkParameterIcon = import_react150.css`
|
|
16336
16426
|
align-items: center;
|
|
16337
16427
|
color: var(--primary-action-default);
|
|
16338
16428
|
display: flex;
|
|
@@ -16358,9 +16448,9 @@ var ParameterLabel = ({ id, asSpan, children, testId, ...props }) => {
|
|
|
16358
16448
|
|
|
16359
16449
|
// src/components/ParameterInputs/ParameterMenuButton.tsx
|
|
16360
16450
|
init_emotion_jsx_shim();
|
|
16361
|
-
var
|
|
16451
|
+
var import_react151 = require("react");
|
|
16362
16452
|
var import_jsx_runtime129 = require("@emotion/react/jsx-runtime");
|
|
16363
|
-
var ParameterMenuButton = (0,
|
|
16453
|
+
var ParameterMenuButton = (0, import_react151.forwardRef)(
|
|
16364
16454
|
({ label: label2, children, disabled: disabled2, withoutPortal }, ref) => {
|
|
16365
16455
|
return /* @__PURE__ */ (0, import_jsx_runtime129.jsx)(
|
|
16366
16456
|
Menu,
|
|
@@ -16388,14 +16478,14 @@ var ParameterMenuButton = (0, import_react150.forwardRef)(
|
|
|
16388
16478
|
|
|
16389
16479
|
// src/components/ParameterInputs/styles/ParameterShell.styles.ts
|
|
16390
16480
|
init_emotion_jsx_shim();
|
|
16391
|
-
var
|
|
16392
|
-
var emptyParameterShell =
|
|
16481
|
+
var import_react152 = require("@emotion/react");
|
|
16482
|
+
var emptyParameterShell = import_react152.css`
|
|
16393
16483
|
border-radius: var(--rounded-sm);
|
|
16394
16484
|
flex-grow: 1;
|
|
16395
16485
|
position: relative;
|
|
16396
16486
|
max-width: 100%;
|
|
16397
16487
|
`;
|
|
16398
|
-
var emptyParameterShellText =
|
|
16488
|
+
var emptyParameterShellText = import_react152.css`
|
|
16399
16489
|
background: var(--brand-secondary-6);
|
|
16400
16490
|
border-radius: var(--rounded-sm);
|
|
16401
16491
|
padding: var(--spacing-sm);
|
|
@@ -16403,7 +16493,7 @@ var emptyParameterShellText = import_react151.css`
|
|
|
16403
16493
|
font-size: var(--fs-sm);
|
|
16404
16494
|
margin: 0;
|
|
16405
16495
|
`;
|
|
16406
|
-
var overrideMarker =
|
|
16496
|
+
var overrideMarker = import_react152.css`
|
|
16407
16497
|
border-radius: var(--rounded-sm);
|
|
16408
16498
|
border: 10px solid var(--gray-300);
|
|
16409
16499
|
border-left-color: transparent;
|
|
@@ -16475,7 +16565,7 @@ var ParameterShell = ({
|
|
|
16475
16565
|
menuWithoutPortal,
|
|
16476
16566
|
...props
|
|
16477
16567
|
}) => {
|
|
16478
|
-
const [manualErrorMessage, setManualErrorMessage] = (0,
|
|
16568
|
+
const [manualErrorMessage, setManualErrorMessage] = (0, import_react154.useState)(void 0);
|
|
16479
16569
|
const setErrorMessage = (message) => setManualErrorMessage(message);
|
|
16480
16570
|
const errorMessaging = errorMessage || manualErrorMessage;
|
|
16481
16571
|
return /* @__PURE__ */ (0, import_jsx_runtime130.jsxs)("div", { css: inputContainer2, ...props, id, children: [
|
|
@@ -16497,7 +16587,7 @@ var ParameterShell = ({
|
|
|
16497
16587
|
css: [
|
|
16498
16588
|
inputMenu,
|
|
16499
16589
|
inputActionItems,
|
|
16500
|
-
menuItems ?
|
|
16590
|
+
menuItems ? import_react153.css`
|
|
16501
16591
|
right: var(--spacing-md);
|
|
16502
16592
|
` : void 0
|
|
16503
16593
|
],
|
|
@@ -16556,7 +16646,7 @@ var ParameterOverrideMarker = (props) => /* @__PURE__ */ (0, import_jsx_runtime1
|
|
|
16556
16646
|
|
|
16557
16647
|
// src/components/ParameterInputs/ParameterImage.tsx
|
|
16558
16648
|
var import_jsx_runtime131 = require("@emotion/react/jsx-runtime");
|
|
16559
|
-
var ParameterImage = (0,
|
|
16649
|
+
var ParameterImage = (0, import_react155.forwardRef)(
|
|
16560
16650
|
({ children, ...props }, ref) => {
|
|
16561
16651
|
const { shellProps, innerProps } = extractParameterProps(props);
|
|
16562
16652
|
return /* @__PURE__ */ (0, import_jsx_runtime131.jsxs)(ParameterShell, { "data-test-id": "parameter-image", ...shellProps, children: [
|
|
@@ -16565,10 +16655,10 @@ var ParameterImage = (0, import_react154.forwardRef)(
|
|
|
16565
16655
|
] });
|
|
16566
16656
|
}
|
|
16567
16657
|
);
|
|
16568
|
-
var ParameterImageInner = (0,
|
|
16658
|
+
var ParameterImageInner = (0, import_react155.forwardRef)((props, ref) => {
|
|
16569
16659
|
const { value } = props;
|
|
16570
16660
|
const { id, label: label2, hiddenLabel, errorMessage } = useParameterShell();
|
|
16571
|
-
const deferredValue = (0,
|
|
16661
|
+
const deferredValue = (0, import_react155.useDeferredValue)(value);
|
|
16572
16662
|
return /* @__PURE__ */ (0, import_jsx_runtime131.jsxs)(import_jsx_runtime131.Fragment, { children: [
|
|
16573
16663
|
/* @__PURE__ */ (0, import_jsx_runtime131.jsx)(
|
|
16574
16664
|
"input",
|
|
@@ -16588,13 +16678,13 @@ var ParameterImageInner = (0, import_react154.forwardRef)((props, ref) => {
|
|
|
16588
16678
|
|
|
16589
16679
|
// src/components/ParameterInputs/ParameterInput.tsx
|
|
16590
16680
|
init_emotion_jsx_shim();
|
|
16591
|
-
var
|
|
16681
|
+
var import_react156 = require("react");
|
|
16592
16682
|
var import_jsx_runtime132 = require("@emotion/react/jsx-runtime");
|
|
16593
|
-
var ParameterInput = (0,
|
|
16683
|
+
var ParameterInput = (0, import_react156.forwardRef)((props, ref) => {
|
|
16594
16684
|
const { shellProps, innerProps } = extractParameterProps(props);
|
|
16595
16685
|
return /* @__PURE__ */ (0, import_jsx_runtime132.jsx)(ParameterShell, { "data-testid": "parameter-input", ...shellProps, children: /* @__PURE__ */ (0, import_jsx_runtime132.jsx)(ParameterInputInner, { ref, ...innerProps }) });
|
|
16596
16686
|
});
|
|
16597
|
-
var ParameterInputInner = (0,
|
|
16687
|
+
var ParameterInputInner = (0, import_react156.forwardRef)(({ enableMouseWheel = false, ...props }, ref) => {
|
|
16598
16688
|
const { id, label: label2, hiddenLabel } = useParameterShell();
|
|
16599
16689
|
const isNumberInputAndMouseWheelDisabled = enableMouseWheel !== true && props.type === "number";
|
|
16600
16690
|
return /* @__PURE__ */ (0, import_jsx_runtime132.jsx)(
|
|
@@ -16614,7 +16704,7 @@ var ParameterInputInner = (0, import_react155.forwardRef)(({ enableMouseWheel =
|
|
|
16614
16704
|
|
|
16615
16705
|
// src/components/ParameterInputs/ParameterLabels.tsx
|
|
16616
16706
|
init_emotion_jsx_shim();
|
|
16617
|
-
var
|
|
16707
|
+
var import_react157 = require("react");
|
|
16618
16708
|
var import_jsx_runtime133 = require("@emotion/react/jsx-runtime");
|
|
16619
16709
|
var ParameterLabels = ({ disabled: disabled2 = false, ...props }) => {
|
|
16620
16710
|
const { shellProps, innerProps } = extractParameterProps(props);
|
|
@@ -16676,18 +16766,18 @@ var ParameterLabelsInner = (props) => {
|
|
|
16676
16766
|
var _a;
|
|
16677
16767
|
const { label: label2 } = useParameterShell();
|
|
16678
16768
|
const { onChange } = props;
|
|
16679
|
-
const containerRef = (0,
|
|
16680
|
-
const hasPositionedRef = (0,
|
|
16681
|
-
const selectedValues = (0,
|
|
16769
|
+
const containerRef = (0, import_react157.useRef)(null);
|
|
16770
|
+
const hasPositionedRef = (0, import_react157.useRef)(false);
|
|
16771
|
+
const selectedValues = (0, import_react157.useMemo)(
|
|
16682
16772
|
() => {
|
|
16683
16773
|
var _a2, _b;
|
|
16684
16774
|
return (_b = (_a2 = props.value) != null ? _a2 : props.defaultValue) != null ? _b : [];
|
|
16685
16775
|
},
|
|
16686
16776
|
[props.value, props.defaultValue]
|
|
16687
16777
|
);
|
|
16688
|
-
const items = (0,
|
|
16689
|
-
const optionsMap = (0,
|
|
16690
|
-
const selectedIds = (0,
|
|
16778
|
+
const items = (0, import_react157.useMemo)(() => convertOptionsToItems(props.options), [props.options]);
|
|
16779
|
+
const optionsMap = (0, import_react157.useMemo)(() => createOptionsMap(props.options), [props.options]);
|
|
16780
|
+
const selectedIds = (0, import_react157.useMemo)(() => {
|
|
16691
16781
|
if (!Array.isArray(selectedValues)) {
|
|
16692
16782
|
return /* @__PURE__ */ new Set();
|
|
16693
16783
|
}
|
|
@@ -16779,9 +16869,9 @@ var ParameterLabelsInner = (props) => {
|
|
|
16779
16869
|
|
|
16780
16870
|
// src/components/ParameterInputs/ParameterLink.tsx
|
|
16781
16871
|
init_emotion_jsx_shim();
|
|
16782
|
-
var
|
|
16872
|
+
var import_react158 = require("react");
|
|
16783
16873
|
var import_jsx_runtime134 = require("@emotion/react/jsx-runtime");
|
|
16784
|
-
var ParameterLink = (0,
|
|
16874
|
+
var ParameterLink = (0, import_react158.forwardRef)(
|
|
16785
16875
|
({ disabled: disabled2, onConnectLink, externalLink, ...props }, ref) => {
|
|
16786
16876
|
const { shellProps, innerProps } = extractParameterProps(props);
|
|
16787
16877
|
return /* @__PURE__ */ (0, import_jsx_runtime134.jsx)(
|
|
@@ -16805,7 +16895,7 @@ var ParameterLink = (0, import_react157.forwardRef)(
|
|
|
16805
16895
|
);
|
|
16806
16896
|
}
|
|
16807
16897
|
);
|
|
16808
|
-
var ParameterLinkInner = (0,
|
|
16898
|
+
var ParameterLinkInner = (0, import_react158.forwardRef)(
|
|
16809
16899
|
({ externalLink, onConnectLink, disabled: disabled2, buttonText = "Select link", ...props }, ref) => {
|
|
16810
16900
|
const { id, label: label2, hiddenLabel } = useParameterShell();
|
|
16811
16901
|
if (!props.value)
|
|
@@ -16991,24 +17081,24 @@ var ParameterNameAndPublicIdInput = ({
|
|
|
16991
17081
|
|
|
16992
17082
|
// src/components/ParameterInputs/ParameterNumberSlider.tsx
|
|
16993
17083
|
init_emotion_jsx_shim();
|
|
16994
|
-
var
|
|
17084
|
+
var import_react162 = require("react");
|
|
16995
17085
|
|
|
16996
17086
|
// src/components/Slider/index.ts
|
|
16997
17087
|
init_emotion_jsx_shim();
|
|
16998
17088
|
|
|
16999
17089
|
// src/components/Slider/Slider.tsx
|
|
17000
17090
|
init_emotion_jsx_shim();
|
|
17001
|
-
var
|
|
17091
|
+
var import_react161 = require("react");
|
|
17002
17092
|
|
|
17003
17093
|
// src/components/Slider/SliderLabels.tsx
|
|
17004
17094
|
init_emotion_jsx_shim();
|
|
17005
|
-
var
|
|
17095
|
+
var import_react160 = require("react");
|
|
17006
17096
|
|
|
17007
17097
|
// src/components/Slider/styles/Slider.styles.ts
|
|
17008
17098
|
init_emotion_jsx_shim();
|
|
17009
|
-
var
|
|
17099
|
+
var import_react159 = require("@emotion/react");
|
|
17010
17100
|
var thumbSize = "20px";
|
|
17011
|
-
var disabledThumbStyles =
|
|
17101
|
+
var disabledThumbStyles = import_react159.css`
|
|
17012
17102
|
background: var(--white);
|
|
17013
17103
|
background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20'%3E%3Cline x1='4' y1='9' x2='16' y2='9' stroke='%236b7280' stroke-width='4' stroke-linecap='round'/%3E%3C/svg%3E");
|
|
17014
17104
|
background-repeat: no-repeat;
|
|
@@ -17016,22 +17106,22 @@ var disabledThumbStyles = import_react158.css`
|
|
|
17016
17106
|
background-size: 12px 12px;
|
|
17017
17107
|
border: 1px solid var(--gray-500);
|
|
17018
17108
|
`;
|
|
17019
|
-
var container3 =
|
|
17109
|
+
var container3 = import_react159.css`
|
|
17020
17110
|
display: flex;
|
|
17021
17111
|
align-items: flex-start;
|
|
17022
17112
|
gap: var(--spacing-base);
|
|
17023
17113
|
width: 100%;
|
|
17024
17114
|
`;
|
|
17025
|
-
var sliderContainer =
|
|
17115
|
+
var sliderContainer = import_react159.css`
|
|
17026
17116
|
flex: 1;
|
|
17027
17117
|
display: flex;
|
|
17028
17118
|
flex-direction: column;
|
|
17029
17119
|
`;
|
|
17030
|
-
var sliderTrackContainer =
|
|
17120
|
+
var sliderTrackContainer = import_react159.css`
|
|
17031
17121
|
position: relative;
|
|
17032
17122
|
padding: var(--spacing-xs) 0;
|
|
17033
17123
|
`;
|
|
17034
|
-
var progressTrack =
|
|
17124
|
+
var progressTrack = import_react159.css`
|
|
17035
17125
|
position: absolute;
|
|
17036
17126
|
top: 50%;
|
|
17037
17127
|
left: 0;
|
|
@@ -17041,7 +17131,7 @@ var progressTrack = import_react158.css`
|
|
|
17041
17131
|
margin-top: -3px;
|
|
17042
17132
|
border-radius: var(--rounded-sm);
|
|
17043
17133
|
`;
|
|
17044
|
-
var progressTrackBackground =
|
|
17134
|
+
var progressTrackBackground = import_react159.css`
|
|
17045
17135
|
position: absolute;
|
|
17046
17136
|
top: 0;
|
|
17047
17137
|
left: 0;
|
|
@@ -17051,7 +17141,7 @@ var progressTrackBackground = import_react158.css`
|
|
|
17051
17141
|
border: 1px solid var(--gray-200);
|
|
17052
17142
|
border-radius: var(--rounded-sm);
|
|
17053
17143
|
`;
|
|
17054
|
-
var progressTrackFill =
|
|
17144
|
+
var progressTrackFill = import_react159.css`
|
|
17055
17145
|
position: absolute;
|
|
17056
17146
|
top: 0;
|
|
17057
17147
|
left: 0;
|
|
@@ -17059,19 +17149,19 @@ var progressTrackFill = import_react158.css`
|
|
|
17059
17149
|
background: var(--accent-light);
|
|
17060
17150
|
border-radius: var(--rounded-sm);
|
|
17061
17151
|
`;
|
|
17062
|
-
var tickMarksContainer =
|
|
17152
|
+
var tickMarksContainer = import_react159.css`
|
|
17063
17153
|
position: relative;
|
|
17064
17154
|
height: 1rem;
|
|
17065
17155
|
margin-top: calc(-1 * var(--spacing-base) + var(--spacing-xs));
|
|
17066
17156
|
`;
|
|
17067
|
-
var tickMark =
|
|
17157
|
+
var tickMark = import_react159.css`
|
|
17068
17158
|
position: absolute;
|
|
17069
17159
|
top: 0;
|
|
17070
17160
|
width: 0.5px;
|
|
17071
17161
|
height: 8px;
|
|
17072
17162
|
background-color: var(--gray-300);
|
|
17073
17163
|
`;
|
|
17074
|
-
var largeTickMark =
|
|
17164
|
+
var largeTickMark = import_react159.css`
|
|
17075
17165
|
position: absolute;
|
|
17076
17166
|
top: 0;
|
|
17077
17167
|
width: 1px;
|
|
@@ -17079,7 +17169,7 @@ var largeTickMark = import_react158.css`
|
|
|
17079
17169
|
background-color: var(--gray-400);
|
|
17080
17170
|
transform: translateX(-50%);
|
|
17081
17171
|
`;
|
|
17082
|
-
var slider =
|
|
17172
|
+
var slider = import_react159.css`
|
|
17083
17173
|
appearance: none;
|
|
17084
17174
|
width: 100%;
|
|
17085
17175
|
width: calc(100% + ${thumbSize});
|
|
@@ -17196,12 +17286,12 @@ var slider = import_react158.css`
|
|
|
17196
17286
|
0 0 0 3px var(--accent-light);
|
|
17197
17287
|
}
|
|
17198
17288
|
`;
|
|
17199
|
-
var labelsContainer =
|
|
17289
|
+
var labelsContainer = import_react159.css`
|
|
17200
17290
|
position: relative;
|
|
17201
17291
|
height: 1.5rem;
|
|
17202
17292
|
width: 100%;
|
|
17203
17293
|
`;
|
|
17204
|
-
var label =
|
|
17294
|
+
var label = import_react159.css`
|
|
17205
17295
|
position: absolute;
|
|
17206
17296
|
top: 0;
|
|
17207
17297
|
font-size: var(--text-sm);
|
|
@@ -17245,12 +17335,12 @@ var label = import_react158.css`
|
|
|
17245
17335
|
max-width: 100%;
|
|
17246
17336
|
}
|
|
17247
17337
|
`;
|
|
17248
|
-
var numberInputContainer =
|
|
17338
|
+
var numberInputContainer = import_react159.css`
|
|
17249
17339
|
flex-shrink: 0;
|
|
17250
17340
|
min-width: 2rem;
|
|
17251
17341
|
margin-top: var(--spacing-sm);
|
|
17252
17342
|
`;
|
|
17253
|
-
var numberInput2 =
|
|
17343
|
+
var numberInput2 = import_react159.css`
|
|
17254
17344
|
appearance: none;
|
|
17255
17345
|
background-color: var(--white);
|
|
17256
17346
|
border: 1px solid var(--gray-200);
|
|
@@ -17428,9 +17518,9 @@ function calculateLabelVisibility(ticks, currentValue, containerWidth) {
|
|
|
17428
17518
|
}));
|
|
17429
17519
|
}
|
|
17430
17520
|
function SliderLabels({ ticks, currentValue, containerWidth = 300 }) {
|
|
17431
|
-
const containerRef = (0,
|
|
17432
|
-
const [measuredWidth, setMeasuredWidth] = (0,
|
|
17433
|
-
(0,
|
|
17521
|
+
const containerRef = (0, import_react160.useRef)(null);
|
|
17522
|
+
const [measuredWidth, setMeasuredWidth] = (0, import_react160.useState)(containerWidth);
|
|
17523
|
+
(0, import_react160.useEffect)(() => {
|
|
17434
17524
|
if (containerRef.current) {
|
|
17435
17525
|
const resizeObserver = new ResizeObserver((entries) => {
|
|
17436
17526
|
for (const entry of entries) {
|
|
@@ -17467,7 +17557,7 @@ function SliderLabels({ ticks, currentValue, containerWidth = 300 }) {
|
|
|
17467
17557
|
|
|
17468
17558
|
// src/components/Slider/Slider.tsx
|
|
17469
17559
|
var import_jsx_runtime138 = require("@emotion/react/jsx-runtime");
|
|
17470
|
-
var Slider = (0,
|
|
17560
|
+
var Slider = (0, import_react161.forwardRef)(
|
|
17471
17561
|
({
|
|
17472
17562
|
value,
|
|
17473
17563
|
onChange,
|
|
@@ -17484,7 +17574,7 @@ var Slider = (0, import_react160.forwardRef)(
|
|
|
17484
17574
|
name
|
|
17485
17575
|
}, ref) => {
|
|
17486
17576
|
const isOptionsMode = Boolean(options && options.length > 0);
|
|
17487
|
-
const { min, max, step, smallTicks, largeTicks } = (0,
|
|
17577
|
+
const { min, max, step, smallTicks, largeTicks } = (0, import_react161.useMemo)(() => {
|
|
17488
17578
|
if (isOptionsMode && options) {
|
|
17489
17579
|
if (options.length === 0) {
|
|
17490
17580
|
return {
|
|
@@ -17562,14 +17652,14 @@ var Slider = (0, import_react160.forwardRef)(
|
|
|
17562
17652
|
}, [isOptionsMode, options, propMin, propMax, propStep]);
|
|
17563
17653
|
const isValueUnset = value === void 0 || value === null || typeof value === "number" && isNaN(value);
|
|
17564
17654
|
const clampedValue = isValueUnset ? min : Math.min(Math.max(value, min), max);
|
|
17565
|
-
const handleSliderChange = (0,
|
|
17655
|
+
const handleSliderChange = (0, import_react161.useCallback)(
|
|
17566
17656
|
(event) => {
|
|
17567
17657
|
const newValue = Number(event.target.value);
|
|
17568
17658
|
onChange(newValue);
|
|
17569
17659
|
},
|
|
17570
17660
|
[onChange]
|
|
17571
17661
|
);
|
|
17572
|
-
const handleNumberInputChange = (0,
|
|
17662
|
+
const handleNumberInputChange = (0, import_react161.useCallback)(
|
|
17573
17663
|
(event) => {
|
|
17574
17664
|
if (event.target.value === "") {
|
|
17575
17665
|
onChange(void 0);
|
|
@@ -17642,13 +17732,13 @@ Slider.displayName = "Slider";
|
|
|
17642
17732
|
|
|
17643
17733
|
// src/components/ParameterInputs/ParameterNumberSlider.tsx
|
|
17644
17734
|
var import_jsx_runtime139 = require("@emotion/react/jsx-runtime");
|
|
17645
|
-
var ParameterNumberSlider = (0,
|
|
17735
|
+
var ParameterNumberSlider = (0, import_react162.forwardRef)(
|
|
17646
17736
|
(props, ref) => {
|
|
17647
17737
|
const { shellProps, innerProps } = extractParameterProps(props);
|
|
17648
17738
|
return /* @__PURE__ */ (0, import_jsx_runtime139.jsx)(ParameterShell, { "data-testid": "parameter-number-slider", ...shellProps, children: /* @__PURE__ */ (0, import_jsx_runtime139.jsx)(ParameterNumberSliderInner, { ref, ...innerProps }) });
|
|
17649
17739
|
}
|
|
17650
17740
|
);
|
|
17651
|
-
var ParameterNumberSliderInner = (0,
|
|
17741
|
+
var ParameterNumberSliderInner = (0, import_react162.forwardRef)(({ ...props }, ref) => {
|
|
17652
17742
|
const { id, label: label2, hiddenLabel } = useParameterShell();
|
|
17653
17743
|
return /* @__PURE__ */ (0, import_jsx_runtime139.jsx)(
|
|
17654
17744
|
Slider,
|
|
@@ -17665,7 +17755,7 @@ ParameterNumberSliderInner.displayName = "ParameterNumberSliderInner";
|
|
|
17665
17755
|
|
|
17666
17756
|
// src/components/ParameterInputs/ParameterRichText.tsx
|
|
17667
17757
|
init_emotion_jsx_shim();
|
|
17668
|
-
var
|
|
17758
|
+
var import_react176 = require("@emotion/react");
|
|
17669
17759
|
var import_list3 = require("@lexical/list");
|
|
17670
17760
|
var import_markdown = require("@lexical/markdown");
|
|
17671
17761
|
var import_LexicalComposer = require("@lexical/react/LexicalComposer");
|
|
@@ -17802,7 +17892,7 @@ var defaultParameterConfiguration = {
|
|
|
17802
17892
|
// src/components/ParameterInputs/ParameterRichText.tsx
|
|
17803
17893
|
var import_fast_equals2 = require("fast-equals");
|
|
17804
17894
|
var import_lexical10 = require("lexical");
|
|
17805
|
-
var
|
|
17895
|
+
var import_react177 = require("react");
|
|
17806
17896
|
|
|
17807
17897
|
// src/components/ParameterInputs/rich-text/CustomCodeNode.ts
|
|
17808
17898
|
init_emotion_jsx_shim();
|
|
@@ -17825,10 +17915,10 @@ init_emotion_jsx_shim();
|
|
|
17825
17915
|
var import_LexicalComposerContext = require("@lexical/react/LexicalComposerContext");
|
|
17826
17916
|
var import_utils4 = require("@lexical/utils");
|
|
17827
17917
|
var import_lexical = require("lexical");
|
|
17828
|
-
var
|
|
17918
|
+
var import_react163 = require("react");
|
|
17829
17919
|
function DisableStylesPlugin() {
|
|
17830
17920
|
const [editor] = (0, import_LexicalComposerContext.useLexicalComposerContext)();
|
|
17831
|
-
(0,
|
|
17921
|
+
(0, import_react163.useEffect)(() => {
|
|
17832
17922
|
return (0, import_utils4.mergeRegister)(
|
|
17833
17923
|
// Disable text alignment on paragraph nodes
|
|
17834
17924
|
editor.registerNodeTransform(import_lexical.ParagraphNode, (node) => {
|
|
@@ -18089,10 +18179,10 @@ init_emotion_jsx_shim();
|
|
|
18089
18179
|
var import_LexicalComposerContext2 = require("@lexical/react/LexicalComposerContext");
|
|
18090
18180
|
var import_utils5 = require("@lexical/utils");
|
|
18091
18181
|
var import_lexical2 = require("lexical");
|
|
18092
|
-
var
|
|
18182
|
+
var import_react164 = require("react");
|
|
18093
18183
|
var ImprovedAssetSelectionPlugin = () => {
|
|
18094
18184
|
const [editor] = (0, import_LexicalComposerContext2.useLexicalComposerContext)();
|
|
18095
|
-
(0,
|
|
18185
|
+
(0, import_react164.useEffect)(() => {
|
|
18096
18186
|
editor.getRootElement();
|
|
18097
18187
|
const onRootClick = (event) => {
|
|
18098
18188
|
if (event.target !== editor.getRootElement()) {
|
|
@@ -18141,13 +18231,13 @@ var ImprovedAssetSelectionPlugin_default = ImprovedAssetSelectionPlugin;
|
|
|
18141
18231
|
|
|
18142
18232
|
// src/components/ParameterInputs/rich-text/LinkNodePlugin.tsx
|
|
18143
18233
|
init_emotion_jsx_shim();
|
|
18144
|
-
var
|
|
18234
|
+
var import_react165 = require("@emotion/react");
|
|
18145
18235
|
var import_LexicalComposerContext3 = require("@lexical/react/LexicalComposerContext");
|
|
18146
18236
|
var import_LexicalNodeEventPlugin = require("@lexical/react/LexicalNodeEventPlugin");
|
|
18147
18237
|
var import_utils6 = require("@lexical/utils");
|
|
18148
18238
|
var import_fast_equals = require("fast-equals");
|
|
18149
18239
|
var import_lexical4 = require("lexical");
|
|
18150
|
-
var
|
|
18240
|
+
var import_react166 = require("react");
|
|
18151
18241
|
|
|
18152
18242
|
// src/components/ParameterInputs/rich-text/utils.ts
|
|
18153
18243
|
init_emotion_jsx_shim();
|
|
@@ -18495,18 +18585,18 @@ var OPEN_LINK_NODE_MODAL_COMMAND = (0, import_lexical4.createCommand)(
|
|
|
18495
18585
|
);
|
|
18496
18586
|
var LINK_POPOVER_OFFSET_X = 0;
|
|
18497
18587
|
var LINK_POPOVER_OFFSET_Y = 8;
|
|
18498
|
-
var linkPopover =
|
|
18588
|
+
var linkPopover = import_react165.css`
|
|
18499
18589
|
position: absolute;
|
|
18500
18590
|
z-index: 11;
|
|
18501
18591
|
`;
|
|
18502
|
-
var linkPopoverContainer =
|
|
18592
|
+
var linkPopoverContainer = import_react165.css`
|
|
18503
18593
|
${Popover};
|
|
18504
18594
|
${PopoverBody};
|
|
18505
18595
|
${PopoverVariantSmall};
|
|
18506
18596
|
align-items: center;
|
|
18507
18597
|
display: flex;
|
|
18508
18598
|
`;
|
|
18509
|
-
var linkPopoverAnchor =
|
|
18599
|
+
var linkPopoverAnchor = import_react165.css`
|
|
18510
18600
|
${link}
|
|
18511
18601
|
${linkColorDefault}
|
|
18512
18602
|
`;
|
|
@@ -18519,17 +18609,17 @@ function LinkNodePlugin({
|
|
|
18519
18609
|
return path;
|
|
18520
18610
|
};
|
|
18521
18611
|
const [editor] = (0, import_LexicalComposerContext3.useLexicalComposerContext)();
|
|
18522
|
-
const [linkPopoverState, setLinkPopoverState] = (0,
|
|
18523
|
-
const linkPopoverElRef = (0,
|
|
18524
|
-
const [isEditorFocused, setIsEditorFocused] = (0,
|
|
18525
|
-
const [isLinkPopoverFocused, setIsLinkPopoverFocused] = (0,
|
|
18526
|
-
(0,
|
|
18612
|
+
const [linkPopoverState, setLinkPopoverState] = (0, import_react166.useState)();
|
|
18613
|
+
const linkPopoverElRef = (0, import_react166.useRef)(null);
|
|
18614
|
+
const [isEditorFocused, setIsEditorFocused] = (0, import_react166.useState)(false);
|
|
18615
|
+
const [isLinkPopoverFocused, setIsLinkPopoverFocused] = (0, import_react166.useState)(false);
|
|
18616
|
+
(0, import_react166.useEffect)(() => {
|
|
18527
18617
|
if (!isEditorFocused && !isLinkPopoverFocused) {
|
|
18528
18618
|
setLinkPopoverState(void 0);
|
|
18529
18619
|
return;
|
|
18530
18620
|
}
|
|
18531
18621
|
}, [isEditorFocused, isLinkPopoverFocused]);
|
|
18532
|
-
(0,
|
|
18622
|
+
(0, import_react166.useEffect)(() => {
|
|
18533
18623
|
if (!editor.hasNodes([LinkNode])) {
|
|
18534
18624
|
throw new Error("LinkNode not registered on editor");
|
|
18535
18625
|
}
|
|
@@ -18633,7 +18723,7 @@ function LinkNodePlugin({
|
|
|
18633
18723
|
)
|
|
18634
18724
|
);
|
|
18635
18725
|
}, [editor, onConnectLink]);
|
|
18636
|
-
const maybeShowLinkToolbar = (0,
|
|
18726
|
+
const maybeShowLinkToolbar = (0, import_react166.useCallback)(() => {
|
|
18637
18727
|
if (!editor.isEditable()) {
|
|
18638
18728
|
return;
|
|
18639
18729
|
}
|
|
@@ -18667,7 +18757,7 @@ function LinkNodePlugin({
|
|
|
18667
18757
|
}
|
|
18668
18758
|
});
|
|
18669
18759
|
}, [editor, positioningAnchorEl]);
|
|
18670
|
-
(0,
|
|
18760
|
+
(0, import_react166.useEffect)(() => {
|
|
18671
18761
|
return editor.registerUpdateListener(({ editorState }) => {
|
|
18672
18762
|
requestAnimationFrame(() => {
|
|
18673
18763
|
editorState.read(() => {
|
|
@@ -18755,7 +18845,7 @@ var import_list = require("@lexical/list");
|
|
|
18755
18845
|
var import_LexicalComposerContext4 = require("@lexical/react/LexicalComposerContext");
|
|
18756
18846
|
var import_utils9 = require("@lexical/utils");
|
|
18757
18847
|
var import_lexical5 = require("lexical");
|
|
18758
|
-
var
|
|
18848
|
+
var import_react167 = require("react");
|
|
18759
18849
|
function isIndentPermitted(maxDepth) {
|
|
18760
18850
|
const selection = (0, import_lexical5.$getSelection)();
|
|
18761
18851
|
if (!(0, import_lexical5.$isRangeSelection)(selection)) {
|
|
@@ -18810,8 +18900,8 @@ function $indentOverTab(selection) {
|
|
|
18810
18900
|
}
|
|
18811
18901
|
function ListIndentPlugin({ maxDepth }) {
|
|
18812
18902
|
const [editor] = (0, import_LexicalComposerContext4.useLexicalComposerContext)();
|
|
18813
|
-
const isInListItemNode = (0,
|
|
18814
|
-
(0,
|
|
18903
|
+
const isInListItemNode = (0, import_react167.useRef)(false);
|
|
18904
|
+
(0, import_react167.useEffect)(() => {
|
|
18815
18905
|
return editor.registerCommand(
|
|
18816
18906
|
import_lexical5.SELECTION_CHANGE_COMMAND,
|
|
18817
18907
|
() => {
|
|
@@ -18828,7 +18918,7 @@ function ListIndentPlugin({ maxDepth }) {
|
|
|
18828
18918
|
import_lexical5.COMMAND_PRIORITY_NORMAL
|
|
18829
18919
|
);
|
|
18830
18920
|
}, [editor]);
|
|
18831
|
-
(0,
|
|
18921
|
+
(0, import_react167.useEffect)(() => {
|
|
18832
18922
|
return (0, import_utils9.mergeRegister)(
|
|
18833
18923
|
editor.registerCommand(
|
|
18834
18924
|
import_lexical5.INDENT_CONTENT_COMMAND,
|
|
@@ -18858,12 +18948,12 @@ function ListIndentPlugin({ maxDepth }) {
|
|
|
18858
18948
|
|
|
18859
18949
|
// src/components/ParameterInputs/rich-text/TableActionMenuPlugin.tsx
|
|
18860
18950
|
init_emotion_jsx_shim();
|
|
18861
|
-
var
|
|
18951
|
+
var import_react168 = require("@emotion/react");
|
|
18862
18952
|
var import_LexicalComposerContext5 = require("@lexical/react/LexicalComposerContext");
|
|
18863
18953
|
var import_useLexicalEditable = require("@lexical/react/useLexicalEditable");
|
|
18864
18954
|
var import_table = require("@lexical/table");
|
|
18865
18955
|
var import_lexical6 = require("lexical");
|
|
18866
|
-
var
|
|
18956
|
+
var import_react169 = require("react");
|
|
18867
18957
|
var import_jsx_runtime141 = require("@emotion/react/jsx-runtime");
|
|
18868
18958
|
function computeSelectionCount(selection) {
|
|
18869
18959
|
const selectionShape = selection.getShape();
|
|
@@ -18872,14 +18962,14 @@ function computeSelectionCount(selection) {
|
|
|
18872
18962
|
rows: selectionShape.toY - selectionShape.fromY + 1
|
|
18873
18963
|
};
|
|
18874
18964
|
}
|
|
18875
|
-
var tableActionMenuTrigger =
|
|
18965
|
+
var tableActionMenuTrigger = import_react168.css`
|
|
18876
18966
|
position: absolute;
|
|
18877
18967
|
transform: translate(calc(-100% - 1px), 1px);
|
|
18878
18968
|
`;
|
|
18879
|
-
var TableActionMenuTrigger = (0,
|
|
18969
|
+
var TableActionMenuTrigger = (0, import_react169.forwardRef)((props, ref) => {
|
|
18880
18970
|
const { tableCellEl, positioningAnchorEl, ...rest } = props;
|
|
18881
|
-
const [coordinates, setCoordinates] = (0,
|
|
18882
|
-
(0,
|
|
18971
|
+
const [coordinates, setCoordinates] = (0, import_react169.useState)({ x: 0, y: 0 });
|
|
18972
|
+
(0, import_react169.useLayoutEffect)(() => {
|
|
18883
18973
|
const rect = tableCellEl.getBoundingClientRect();
|
|
18884
18974
|
const parentRect = positioningAnchorEl.getBoundingClientRect();
|
|
18885
18975
|
const relativeX = rect.right - parentRect.left + positioningAnchorEl.scrollLeft;
|
|
@@ -18912,16 +19002,16 @@ function TableActionMenu({
|
|
|
18912
19002
|
positioningAnchorEl
|
|
18913
19003
|
}) {
|
|
18914
19004
|
const [editor] = (0, import_LexicalComposerContext5.useLexicalComposerContext)();
|
|
18915
|
-
const [tableCellNode, updateTableCellNode] = (0,
|
|
18916
|
-
const [selectionCounts, updateSelectionCounts] = (0,
|
|
19005
|
+
const [tableCellNode, updateTableCellNode] = (0, import_react169.useState)(_tableCellNode);
|
|
19006
|
+
const [selectionCounts, updateSelectionCounts] = (0, import_react169.useState)({
|
|
18917
19007
|
columns: 1,
|
|
18918
19008
|
rows: 1
|
|
18919
19009
|
});
|
|
18920
|
-
const [menuTriggerKey, setMenuTriggerKey] = (0,
|
|
19010
|
+
const [menuTriggerKey, setMenuTriggerKey] = (0, import_react169.useState)(0);
|
|
18921
19011
|
const incrementMenuTriggerKey = () => {
|
|
18922
19012
|
setMenuTriggerKey((key) => key += 1);
|
|
18923
19013
|
};
|
|
18924
|
-
(0,
|
|
19014
|
+
(0, import_react169.useEffect)(() => {
|
|
18925
19015
|
return editor.registerMutationListener(
|
|
18926
19016
|
import_table.TableCellNode,
|
|
18927
19017
|
(nodeMutations) => {
|
|
@@ -18935,7 +19025,7 @@ function TableActionMenu({
|
|
|
18935
19025
|
{ skipInitialization: true }
|
|
18936
19026
|
);
|
|
18937
19027
|
}, [editor, tableCellNode]);
|
|
18938
|
-
(0,
|
|
19028
|
+
(0, import_react169.useEffect)(() => {
|
|
18939
19029
|
editor.getEditorState().read(() => {
|
|
18940
19030
|
const selection = (0, import_lexical6.$getSelection)();
|
|
18941
19031
|
if ((0, import_table.$isTableSelection)(selection)) {
|
|
@@ -18943,7 +19033,7 @@ function TableActionMenu({
|
|
|
18943
19033
|
}
|
|
18944
19034
|
});
|
|
18945
19035
|
}, [editor]);
|
|
18946
|
-
const clearTableSelection = (0,
|
|
19036
|
+
const clearTableSelection = (0, import_react169.useCallback)(() => {
|
|
18947
19037
|
editor.update(() => {
|
|
18948
19038
|
if (tableCellNode.isAttached()) {
|
|
18949
19039
|
const tableNode = (0, import_table.$getTableNodeFromLexicalNodeOrThrow)(tableCellNode);
|
|
@@ -18960,7 +19050,7 @@ function TableActionMenu({
|
|
|
18960
19050
|
(0, import_lexical6.$setSelection)(null);
|
|
18961
19051
|
});
|
|
18962
19052
|
}, [editor, tableCellNode]);
|
|
18963
|
-
const insertTableRowAtSelection = (0,
|
|
19053
|
+
const insertTableRowAtSelection = (0, import_react169.useCallback)(
|
|
18964
19054
|
(shouldInsertAfter) => {
|
|
18965
19055
|
editor.update(() => {
|
|
18966
19056
|
for (let i = 0; i < selectionCounts.rows; i++) {
|
|
@@ -18970,7 +19060,7 @@ function TableActionMenu({
|
|
|
18970
19060
|
},
|
|
18971
19061
|
[editor, selectionCounts.rows]
|
|
18972
19062
|
);
|
|
18973
|
-
const insertTableColumnAtSelection = (0,
|
|
19063
|
+
const insertTableColumnAtSelection = (0, import_react169.useCallback)(
|
|
18974
19064
|
(shouldInsertAfter) => {
|
|
18975
19065
|
editor.update(() => {
|
|
18976
19066
|
for (let i = 0; i < selectionCounts.columns; i++) {
|
|
@@ -18980,26 +19070,26 @@ function TableActionMenu({
|
|
|
18980
19070
|
},
|
|
18981
19071
|
[editor, selectionCounts.columns]
|
|
18982
19072
|
);
|
|
18983
|
-
const deleteTableRowAtSelection = (0,
|
|
19073
|
+
const deleteTableRowAtSelection = (0, import_react169.useCallback)(() => {
|
|
18984
19074
|
editor.update(() => {
|
|
18985
19075
|
(0, import_table.$deleteTableRowAtSelection)();
|
|
18986
19076
|
});
|
|
18987
19077
|
incrementMenuTriggerKey();
|
|
18988
19078
|
}, [editor]);
|
|
18989
|
-
const deleteTableAtSelection = (0,
|
|
19079
|
+
const deleteTableAtSelection = (0, import_react169.useCallback)(() => {
|
|
18990
19080
|
editor.update(() => {
|
|
18991
19081
|
const tableNode = (0, import_table.$getTableNodeFromLexicalNodeOrThrow)(tableCellNode);
|
|
18992
19082
|
tableNode.remove();
|
|
18993
19083
|
clearTableSelection();
|
|
18994
19084
|
});
|
|
18995
19085
|
}, [editor, tableCellNode, clearTableSelection]);
|
|
18996
|
-
const deleteTableColumnAtSelection = (0,
|
|
19086
|
+
const deleteTableColumnAtSelection = (0, import_react169.useCallback)(() => {
|
|
18997
19087
|
editor.update(() => {
|
|
18998
19088
|
(0, import_table.$deleteTableColumnAtSelection)();
|
|
18999
19089
|
});
|
|
19000
19090
|
incrementMenuTriggerKey();
|
|
19001
19091
|
}, [editor]);
|
|
19002
|
-
const toggleTableRowIsHeader = (0,
|
|
19092
|
+
const toggleTableRowIsHeader = (0, import_react169.useCallback)(() => {
|
|
19003
19093
|
editor.update(() => {
|
|
19004
19094
|
const tableNode = (0, import_table.$getTableNodeFromLexicalNodeOrThrow)(tableCellNode);
|
|
19005
19095
|
const tableRowIndex = (0, import_table.$getTableRowIndexFromTableCellNode)(tableCellNode);
|
|
@@ -19019,7 +19109,7 @@ function TableActionMenu({
|
|
|
19019
19109
|
clearTableSelection();
|
|
19020
19110
|
});
|
|
19021
19111
|
}, [editor, tableCellNode, clearTableSelection]);
|
|
19022
|
-
const toggleTableColumnIsHeader = (0,
|
|
19112
|
+
const toggleTableColumnIsHeader = (0, import_react169.useCallback)(() => {
|
|
19023
19113
|
editor.update(() => {
|
|
19024
19114
|
const tableNode = (0, import_table.$getTableNodeFromLexicalNodeOrThrow)(tableCellNode);
|
|
19025
19115
|
const tableColumnIndex = (0, import_table.$getTableColumnIndexFromTableCellNode)(tableCellNode);
|
|
@@ -19039,7 +19129,7 @@ function TableActionMenu({
|
|
|
19039
19129
|
clearTableSelection();
|
|
19040
19130
|
});
|
|
19041
19131
|
}, [editor, tableCellNode, clearTableSelection]);
|
|
19042
|
-
const menuItemCss = (0,
|
|
19132
|
+
const menuItemCss = (0, import_react168.css)({
|
|
19043
19133
|
fontSize: "var(--fs-sm)"
|
|
19044
19134
|
});
|
|
19045
19135
|
return /* @__PURE__ */ (0, import_jsx_runtime141.jsxs)(
|
|
@@ -19110,10 +19200,10 @@ function TableCellActionMenuContainer({
|
|
|
19110
19200
|
positioningAnchorEl
|
|
19111
19201
|
}) {
|
|
19112
19202
|
const [editor] = (0, import_LexicalComposerContext5.useLexicalComposerContext)();
|
|
19113
|
-
const [tableCellNode, setTableMenuCellNode] = (0,
|
|
19114
|
-
const [tableCellNodeEl, _setTableMenuCellNodeEl] = (0,
|
|
19115
|
-
const [tableCellMenuPortalEl, setTableMenuCellMenuPortalEl] = (0,
|
|
19116
|
-
(0,
|
|
19203
|
+
const [tableCellNode, setTableMenuCellNode] = (0, import_react169.useState)(null);
|
|
19204
|
+
const [tableCellNodeEl, _setTableMenuCellNodeEl] = (0, import_react169.useState)(null);
|
|
19205
|
+
const [tableCellMenuPortalEl, setTableMenuCellMenuPortalEl] = (0, import_react169.useState)(null);
|
|
19206
|
+
(0, import_react169.useEffect)(() => {
|
|
19117
19207
|
const newPortalEl = document.createElement("div");
|
|
19118
19208
|
setTableMenuCellMenuPortalEl(newPortalEl);
|
|
19119
19209
|
menuPortalEl.appendChild(newPortalEl);
|
|
@@ -19121,14 +19211,14 @@ function TableCellActionMenuContainer({
|
|
|
19121
19211
|
newPortalEl.remove();
|
|
19122
19212
|
};
|
|
19123
19213
|
}, [menuPortalEl]);
|
|
19124
|
-
const setTableMenuCellNodeElem = (0,
|
|
19214
|
+
const setTableMenuCellNodeElem = (0, import_react169.useCallback)((elem) => {
|
|
19125
19215
|
if (elem) {
|
|
19126
19216
|
_setTableMenuCellNodeEl(elem);
|
|
19127
19217
|
} else {
|
|
19128
19218
|
_setTableMenuCellNodeEl(null);
|
|
19129
19219
|
}
|
|
19130
19220
|
}, []);
|
|
19131
|
-
const $moveMenu = (0,
|
|
19221
|
+
const $moveMenu = (0, import_react169.useCallback)(() => {
|
|
19132
19222
|
const selection = (0, import_lexical6.$getSelection)();
|
|
19133
19223
|
const nativeSelection = window.getSelection();
|
|
19134
19224
|
const activeElement = document.activeElement;
|
|
@@ -19157,7 +19247,7 @@ function TableCellActionMenuContainer({
|
|
|
19157
19247
|
setTableMenuCellNodeElem(null);
|
|
19158
19248
|
}
|
|
19159
19249
|
}, [editor, setTableMenuCellNodeElem]);
|
|
19160
|
-
(0,
|
|
19250
|
+
(0, import_react169.useEffect)(() => {
|
|
19161
19251
|
return editor.registerUpdateListener(() => {
|
|
19162
19252
|
editor.getEditorState().read(() => {
|
|
19163
19253
|
$moveMenu();
|
|
@@ -19185,18 +19275,18 @@ function TableActionMenuPlugin({
|
|
|
19185
19275
|
|
|
19186
19276
|
// src/components/ParameterInputs/rich-text/TableCellResizerPlugin.tsx
|
|
19187
19277
|
init_emotion_jsx_shim();
|
|
19188
|
-
var
|
|
19278
|
+
var import_react170 = require("@emotion/react");
|
|
19189
19279
|
var import_LexicalComposerContext6 = require("@lexical/react/LexicalComposerContext");
|
|
19190
19280
|
var import_useLexicalEditable2 = require("@lexical/react/useLexicalEditable");
|
|
19191
19281
|
var import_table2 = require("@lexical/table");
|
|
19192
19282
|
var import_utils11 = require("@lexical/utils");
|
|
19193
19283
|
var import_lexical7 = require("lexical");
|
|
19194
|
-
var
|
|
19284
|
+
var import_react171 = require("react");
|
|
19195
19285
|
var import_react_dom3 = require("react-dom");
|
|
19196
19286
|
var import_jsx_runtime142 = require("@emotion/react/jsx-runtime");
|
|
19197
19287
|
var MIN_ROW_HEIGHT = 33;
|
|
19198
19288
|
var MIN_COLUMN_WIDTH = 50;
|
|
19199
|
-
var tableResizer =
|
|
19289
|
+
var tableResizer = import_react170.css`
|
|
19200
19290
|
position: absolute;
|
|
19201
19291
|
z-index: var(--z-10);
|
|
19202
19292
|
`;
|
|
@@ -19218,15 +19308,15 @@ var fixedGetDOMCellFromTarget = (node) => {
|
|
|
19218
19308
|
return null;
|
|
19219
19309
|
};
|
|
19220
19310
|
function TableCellResizer({ editor, positioningAnchorEl }) {
|
|
19221
|
-
const targetRef = (0,
|
|
19222
|
-
const resizerRef = (0,
|
|
19223
|
-
const tableRectRef = (0,
|
|
19224
|
-
const mouseStartPosRef = (0,
|
|
19225
|
-
const [mouseCurrentPos, updateMouseCurrentPos] = (0,
|
|
19226
|
-
const [activeCell, updateActiveCell] = (0,
|
|
19227
|
-
const [isMouseDown, updateIsMouseDown] = (0,
|
|
19228
|
-
const [draggingDirection, updateDraggingDirection] = (0,
|
|
19229
|
-
const resetState = (0,
|
|
19311
|
+
const targetRef = (0, import_react171.useRef)(null);
|
|
19312
|
+
const resizerRef = (0, import_react171.useRef)(null);
|
|
19313
|
+
const tableRectRef = (0, import_react171.useRef)(null);
|
|
19314
|
+
const mouseStartPosRef = (0, import_react171.useRef)(null);
|
|
19315
|
+
const [mouseCurrentPos, updateMouseCurrentPos] = (0, import_react171.useState)(null);
|
|
19316
|
+
const [activeCell, updateActiveCell] = (0, import_react171.useState)(null);
|
|
19317
|
+
const [isMouseDown, updateIsMouseDown] = (0, import_react171.useState)(false);
|
|
19318
|
+
const [draggingDirection, updateDraggingDirection] = (0, import_react171.useState)(null);
|
|
19319
|
+
const resetState = (0, import_react171.useCallback)(() => {
|
|
19230
19320
|
updateActiveCell(null);
|
|
19231
19321
|
targetRef.current = null;
|
|
19232
19322
|
updateDraggingDirection(null);
|
|
@@ -19236,7 +19326,7 @@ function TableCellResizer({ editor, positioningAnchorEl }) {
|
|
|
19236
19326
|
const isMouseDownOnEvent = (event) => {
|
|
19237
19327
|
return (event.buttons & 1) === 1;
|
|
19238
19328
|
};
|
|
19239
|
-
(0,
|
|
19329
|
+
(0, import_react171.useEffect)(() => {
|
|
19240
19330
|
const onMouseMove = (event) => {
|
|
19241
19331
|
setTimeout(() => {
|
|
19242
19332
|
const target = event.target;
|
|
@@ -19303,7 +19393,7 @@ function TableCellResizer({ editor, positioningAnchorEl }) {
|
|
|
19303
19393
|
}
|
|
19304
19394
|
return false;
|
|
19305
19395
|
};
|
|
19306
|
-
const updateRowHeight = (0,
|
|
19396
|
+
const updateRowHeight = (0, import_react171.useCallback)(
|
|
19307
19397
|
(heightChange) => {
|
|
19308
19398
|
if (!activeCell) {
|
|
19309
19399
|
throw new Error("TableCellResizer: Expected active cell.");
|
|
@@ -19365,7 +19455,7 @@ function TableCellResizer({ editor, positioningAnchorEl }) {
|
|
|
19365
19455
|
}
|
|
19366
19456
|
}
|
|
19367
19457
|
};
|
|
19368
|
-
const updateColumnWidth = (0,
|
|
19458
|
+
const updateColumnWidth = (0, import_react171.useCallback)(
|
|
19369
19459
|
(widthChange) => {
|
|
19370
19460
|
if (!activeCell) {
|
|
19371
19461
|
throw new Error("TableCellResizer: Expected active cell.");
|
|
@@ -19399,7 +19489,7 @@ function TableCellResizer({ editor, positioningAnchorEl }) {
|
|
|
19399
19489
|
},
|
|
19400
19490
|
[activeCell, editor]
|
|
19401
19491
|
);
|
|
19402
|
-
const mouseUpHandler = (0,
|
|
19492
|
+
const mouseUpHandler = (0, import_react171.useCallback)(
|
|
19403
19493
|
(direction) => {
|
|
19404
19494
|
const handler = (event) => {
|
|
19405
19495
|
event.preventDefault();
|
|
@@ -19428,7 +19518,7 @@ function TableCellResizer({ editor, positioningAnchorEl }) {
|
|
|
19428
19518
|
},
|
|
19429
19519
|
[activeCell, resetState, updateColumnWidth, updateRowHeight]
|
|
19430
19520
|
);
|
|
19431
|
-
const toggleResize = (0,
|
|
19521
|
+
const toggleResize = (0, import_react171.useCallback)(
|
|
19432
19522
|
(direction) => (event) => {
|
|
19433
19523
|
event.preventDefault();
|
|
19434
19524
|
event.stopPropagation();
|
|
@@ -19445,7 +19535,7 @@ function TableCellResizer({ editor, positioningAnchorEl }) {
|
|
|
19445
19535
|
},
|
|
19446
19536
|
[activeCell, mouseUpHandler]
|
|
19447
19537
|
);
|
|
19448
|
-
const getResizers = (0,
|
|
19538
|
+
const getResizers = (0, import_react171.useCallback)(() => {
|
|
19449
19539
|
if (activeCell) {
|
|
19450
19540
|
const { height, width, top: top2, left } = activeCell.elem.getBoundingClientRect();
|
|
19451
19541
|
const parentRect = positioningAnchorEl.getBoundingClientRect();
|
|
@@ -19516,7 +19606,7 @@ function TableCellResizer({ editor, positioningAnchorEl }) {
|
|
|
19516
19606
|
function TableCellResizerPlugin({ positioningAnchorEl }) {
|
|
19517
19607
|
const [editor] = (0, import_LexicalComposerContext6.useLexicalComposerContext)();
|
|
19518
19608
|
const isEditable = (0, import_useLexicalEditable2.useLexicalEditable)();
|
|
19519
|
-
return (0,
|
|
19609
|
+
return (0, import_react171.useMemo)(
|
|
19520
19610
|
() => isEditable ? (0, import_react_dom3.createPortal)(
|
|
19521
19611
|
/* @__PURE__ */ (0, import_jsx_runtime142.jsx)(TableCellResizer, { editor, positioningAnchorEl }),
|
|
19522
19612
|
positioningAnchorEl
|
|
@@ -19530,11 +19620,11 @@ init_emotion_jsx_shim();
|
|
|
19530
19620
|
var import_LexicalComposerContext7 = require("@lexical/react/LexicalComposerContext");
|
|
19531
19621
|
var import_table3 = require("@lexical/table");
|
|
19532
19622
|
var import_lexical8 = require("lexical");
|
|
19533
|
-
var
|
|
19623
|
+
var import_react172 = require("react");
|
|
19534
19624
|
var TableSelectionPlugin = () => {
|
|
19535
19625
|
const [editor] = (0, import_LexicalComposerContext7.useLexicalComposerContext)();
|
|
19536
|
-
const [closestTableCellNode, setClosestTableCellNode] = (0,
|
|
19537
|
-
(0,
|
|
19626
|
+
const [closestTableCellNode, setClosestTableCellNode] = (0, import_react172.useState)(null);
|
|
19627
|
+
(0, import_react172.useEffect)(() => {
|
|
19538
19628
|
return editor.registerCommand(
|
|
19539
19629
|
import_lexical8.SELECTION_CHANGE_COMMAND,
|
|
19540
19630
|
() => {
|
|
@@ -19556,7 +19646,7 @@ var TableSelectionPlugin = () => {
|
|
|
19556
19646
|
import_lexical8.COMMAND_PRIORITY_NORMAL
|
|
19557
19647
|
);
|
|
19558
19648
|
}, [editor]);
|
|
19559
|
-
(0,
|
|
19649
|
+
(0, import_react172.useEffect)(() => {
|
|
19560
19650
|
const onControlA = (event) => {
|
|
19561
19651
|
if (event.key === "a" && (event.ctrlKey || event.metaKey)) {
|
|
19562
19652
|
if (!closestTableCellNode) {
|
|
@@ -19580,7 +19670,7 @@ var TableSelectionPlugin_default = TableSelectionPlugin;
|
|
|
19580
19670
|
|
|
19581
19671
|
// src/components/ParameterInputs/rich-text/toolbar/RichTextToolbar.tsx
|
|
19582
19672
|
init_emotion_jsx_shim();
|
|
19583
|
-
var
|
|
19673
|
+
var import_react174 = require("@emotion/react");
|
|
19584
19674
|
var import_code2 = require("@lexical/code");
|
|
19585
19675
|
var import_list2 = require("@lexical/list");
|
|
19586
19676
|
var import_LexicalComposerContext8 = require("@lexical/react/LexicalComposerContext");
|
|
@@ -19589,7 +19679,7 @@ var import_selection2 = require("@lexical/selection");
|
|
|
19589
19679
|
var import_table4 = require("@lexical/table");
|
|
19590
19680
|
var import_utils12 = require("@lexical/utils");
|
|
19591
19681
|
var import_lexical9 = require("lexical");
|
|
19592
|
-
var
|
|
19682
|
+
var import_react175 = require("react");
|
|
19593
19683
|
|
|
19594
19684
|
// src/components/ParameterInputs/rich-text/toolbar/constants.ts
|
|
19595
19685
|
init_emotion_jsx_shim();
|
|
@@ -19607,29 +19697,29 @@ var TEXTUAL_ELEMENTS = HEADING_ELEMENTS;
|
|
|
19607
19697
|
|
|
19608
19698
|
// src/components/ParameterInputs/rich-text/toolbar/useRichTextToolbarState.ts
|
|
19609
19699
|
init_emotion_jsx_shim();
|
|
19610
|
-
var
|
|
19700
|
+
var import_react173 = require("react");
|
|
19611
19701
|
var useRichTextToolbarState = ({ config }) => {
|
|
19612
19702
|
var _a;
|
|
19613
|
-
const enabledBuiltInFormats = (0,
|
|
19703
|
+
const enabledBuiltInFormats = (0, import_react173.useMemo)(() => {
|
|
19614
19704
|
return richTextBuiltInFormats.filter((format) => {
|
|
19615
19705
|
var _a2, _b;
|
|
19616
19706
|
return (_b = (_a2 = config == null ? void 0 : config.formatting) == null ? void 0 : _a2.builtIn) == null ? void 0 : _b.includes(format.type);
|
|
19617
19707
|
});
|
|
19618
19708
|
}, [config]);
|
|
19619
|
-
const enabledBuiltInElements = (0,
|
|
19709
|
+
const enabledBuiltInElements = (0, import_react173.useMemo)(() => {
|
|
19620
19710
|
return richTextBuiltInElements.filter((element) => {
|
|
19621
19711
|
var _a2, _b;
|
|
19622
19712
|
return (_b = (_a2 = config == null ? void 0 : config.elements) == null ? void 0 : _a2.builtIn) == null ? void 0 : _b.includes(element.type);
|
|
19623
19713
|
});
|
|
19624
19714
|
}, [config]);
|
|
19625
|
-
const enabledBuiltInFormatsWithIcon = (0,
|
|
19715
|
+
const enabledBuiltInFormatsWithIcon = (0, import_react173.useMemo)(() => {
|
|
19626
19716
|
return enabledBuiltInFormats.filter((format) => FORMATS_WITH_ICON.has(format.type));
|
|
19627
19717
|
}, [enabledBuiltInFormats]);
|
|
19628
19718
|
const enabledBuiltInFormatsWithoutIcon = enabledBuiltInFormats.filter(
|
|
19629
19719
|
(format) => !FORMATS_WITH_ICON.has(format.type)
|
|
19630
19720
|
);
|
|
19631
|
-
const [activeFormats, setActiveFormats] = (0,
|
|
19632
|
-
const visibleFormatsWithIcon = (0,
|
|
19721
|
+
const [activeFormats, setActiveFormats] = (0, import_react173.useState)([]);
|
|
19722
|
+
const visibleFormatsWithIcon = (0, import_react173.useMemo)(() => {
|
|
19633
19723
|
const visibleFormats = /* @__PURE__ */ new Set();
|
|
19634
19724
|
activeFormats.filter((type) => FORMATS_WITH_ICON.has(type)).forEach((type) => {
|
|
19635
19725
|
visibleFormats.add(type);
|
|
@@ -19639,7 +19729,7 @@ var useRichTextToolbarState = ({ config }) => {
|
|
|
19639
19729
|
});
|
|
19640
19730
|
return richTextBuiltInFormats.filter((format) => visibleFormats.has(format.type));
|
|
19641
19731
|
}, [activeFormats, enabledBuiltInFormatsWithIcon]);
|
|
19642
|
-
const visibleFormatsWithoutIcon = (0,
|
|
19732
|
+
const visibleFormatsWithoutIcon = (0, import_react173.useMemo)(() => {
|
|
19643
19733
|
const visibleFormats = /* @__PURE__ */ new Set();
|
|
19644
19734
|
activeFormats.filter((type) => !FORMATS_WITH_ICON.has(type)).forEach((type) => {
|
|
19645
19735
|
visibleFormats.add(type);
|
|
@@ -19649,11 +19739,11 @@ var useRichTextToolbarState = ({ config }) => {
|
|
|
19649
19739
|
});
|
|
19650
19740
|
return richTextBuiltInFormats.filter((format) => visibleFormats.has(format.type));
|
|
19651
19741
|
}, [activeFormats, enabledBuiltInFormatsWithoutIcon]);
|
|
19652
|
-
const [activeElement, setActiveElement] = (0,
|
|
19742
|
+
const [activeElement, setActiveElement] = (0, import_react173.useState)("paragraph");
|
|
19653
19743
|
const enabledTextualElements = enabledBuiltInElements.filter(
|
|
19654
19744
|
(element) => TEXTUAL_ELEMENTS.includes(element.type)
|
|
19655
19745
|
);
|
|
19656
|
-
const visibleTextualElements = (0,
|
|
19746
|
+
const visibleTextualElements = (0, import_react173.useMemo)(() => {
|
|
19657
19747
|
if (!TEXTUAL_ELEMENTS.includes(activeElement)) {
|
|
19658
19748
|
return enabledTextualElements;
|
|
19659
19749
|
}
|
|
@@ -19664,30 +19754,30 @@ var useRichTextToolbarState = ({ config }) => {
|
|
|
19664
19754
|
}
|
|
19665
19755
|
);
|
|
19666
19756
|
}, [activeElement, (_a = config == null ? void 0 : config.elements) == null ? void 0 : _a.builtIn, enabledTextualElements]);
|
|
19667
|
-
const [isLink, setIsLink] = (0,
|
|
19668
|
-
const linkElementVisible = (0,
|
|
19757
|
+
const [isLink, setIsLink] = (0, import_react173.useState)(false);
|
|
19758
|
+
const linkElementVisible = (0, import_react173.useMemo)(() => {
|
|
19669
19759
|
return enabledBuiltInElements.some((element) => element.type === "link") || isLink;
|
|
19670
19760
|
}, [isLink, enabledBuiltInElements]);
|
|
19671
|
-
const visibleLists = (0,
|
|
19761
|
+
const visibleLists = (0, import_react173.useMemo)(() => {
|
|
19672
19762
|
return new Set(
|
|
19673
19763
|
["orderedList", "unorderedList"].filter(
|
|
19674
19764
|
(type) => enabledBuiltInElements.some((element) => element.type === type) || activeElement === type
|
|
19675
19765
|
)
|
|
19676
19766
|
);
|
|
19677
19767
|
}, [activeElement, enabledBuiltInElements]);
|
|
19678
|
-
const quoteElementVisible = (0,
|
|
19768
|
+
const quoteElementVisible = (0, import_react173.useMemo)(() => {
|
|
19679
19769
|
return enabledBuiltInElements.some((element) => element.type === "quote") || activeElement === "quote";
|
|
19680
19770
|
}, [activeElement, enabledBuiltInElements]);
|
|
19681
|
-
const codeElementVisible = (0,
|
|
19771
|
+
const codeElementVisible = (0, import_react173.useMemo)(() => {
|
|
19682
19772
|
return enabledBuiltInElements.some((element) => element.type === "code") || activeElement === "code";
|
|
19683
19773
|
}, [activeElement, enabledBuiltInElements]);
|
|
19684
|
-
const tableElementVisible = (0,
|
|
19774
|
+
const tableElementVisible = (0, import_react173.useMemo)(() => {
|
|
19685
19775
|
return enabledBuiltInElements.some((element) => element.type === "table") || activeElement === "table";
|
|
19686
19776
|
}, [activeElement, enabledBuiltInElements]);
|
|
19687
|
-
const assetElementVisible = (0,
|
|
19777
|
+
const assetElementVisible = (0, import_react173.useMemo)(() => {
|
|
19688
19778
|
return enabledBuiltInElements.some((element) => element.type === "asset") || activeElement === "asset";
|
|
19689
19779
|
}, [activeElement, enabledBuiltInElements]);
|
|
19690
|
-
const visibleElementsWithIcons = (0,
|
|
19780
|
+
const visibleElementsWithIcons = (0, import_react173.useMemo)(() => {
|
|
19691
19781
|
const visibleElements = /* @__PURE__ */ new Set();
|
|
19692
19782
|
if (linkElementVisible) {
|
|
19693
19783
|
visibleElements.add("link");
|
|
@@ -19699,7 +19789,7 @@ var useRichTextToolbarState = ({ config }) => {
|
|
|
19699
19789
|
}
|
|
19700
19790
|
return visibleElements;
|
|
19701
19791
|
}, [linkElementVisible, visibleLists]);
|
|
19702
|
-
const visibleInsertElementsWithIcons = (0,
|
|
19792
|
+
const visibleInsertElementsWithIcons = (0, import_react173.useMemo)(() => {
|
|
19703
19793
|
const visibleElements = /* @__PURE__ */ new Set();
|
|
19704
19794
|
if (quoteElementVisible) {
|
|
19705
19795
|
visibleElements.add("quote");
|
|
@@ -19738,7 +19828,7 @@ var useRichTextToolbarState = ({ config }) => {
|
|
|
19738
19828
|
|
|
19739
19829
|
// src/components/ParameterInputs/rich-text/toolbar/RichTextToolbar.tsx
|
|
19740
19830
|
var import_jsx_runtime143 = require("@emotion/react/jsx-runtime");
|
|
19741
|
-
var toolbar =
|
|
19831
|
+
var toolbar = import_react174.css`
|
|
19742
19832
|
${scrollbarStyles}
|
|
19743
19833
|
background: var(--gray-50);
|
|
19744
19834
|
border-radius: var(--rounded-base);
|
|
@@ -19752,7 +19842,7 @@ var toolbar = import_react173.css`
|
|
|
19752
19842
|
top: calc(var(--spacing-sm) * -2);
|
|
19753
19843
|
z-index: 10;
|
|
19754
19844
|
`;
|
|
19755
|
-
var toolbarGroup =
|
|
19845
|
+
var toolbarGroup = import_react174.css`
|
|
19756
19846
|
display: flex;
|
|
19757
19847
|
flex-shrink: 0;
|
|
19758
19848
|
gap: var(--spacing-xs);
|
|
@@ -19769,7 +19859,7 @@ var toolbarGroup = import_react173.css`
|
|
|
19769
19859
|
width: 1px;
|
|
19770
19860
|
}
|
|
19771
19861
|
`;
|
|
19772
|
-
var richTextToolbarButton =
|
|
19862
|
+
var richTextToolbarButton = import_react174.css`
|
|
19773
19863
|
align-items: center;
|
|
19774
19864
|
appearance: none;
|
|
19775
19865
|
border: 0;
|
|
@@ -19783,17 +19873,17 @@ var richTextToolbarButton = import_react173.css`
|
|
|
19783
19873
|
min-width: 32px;
|
|
19784
19874
|
padding: 0 var(--spacing-sm);
|
|
19785
19875
|
`;
|
|
19786
|
-
var richTextToolbarButtonActive =
|
|
19876
|
+
var richTextToolbarButtonActive = import_react174.css`
|
|
19787
19877
|
background: var(--gray-200);
|
|
19788
19878
|
`;
|
|
19789
|
-
var textStyleButton =
|
|
19879
|
+
var textStyleButton = import_react174.css`
|
|
19790
19880
|
justify-content: space-between;
|
|
19791
19881
|
min-width: 7rem;
|
|
19792
19882
|
`;
|
|
19793
|
-
var toolbarIcon =
|
|
19883
|
+
var toolbarIcon = import_react174.css`
|
|
19794
19884
|
color: inherit;
|
|
19795
19885
|
`;
|
|
19796
|
-
var toolbarChevron =
|
|
19886
|
+
var toolbarChevron = import_react174.css`
|
|
19797
19887
|
margin-left: var(--spacing-xs);
|
|
19798
19888
|
`;
|
|
19799
19889
|
var RichTextToolbarIcon = ({ icon }) => {
|
|
@@ -19853,7 +19943,7 @@ var RichTextToolbar = ({ config, customControls, onInsertTable, onInsertAsset })
|
|
|
19853
19943
|
});
|
|
19854
19944
|
});
|
|
19855
19945
|
};
|
|
19856
|
-
const updateToolbar = (0,
|
|
19946
|
+
const updateToolbar = (0, import_react175.useCallback)(() => {
|
|
19857
19947
|
const selection = (0, import_lexical9.$getSelection)();
|
|
19858
19948
|
if (!(0, import_lexical9.$isRangeSelection)(selection)) {
|
|
19859
19949
|
return;
|
|
@@ -19892,7 +19982,7 @@ var RichTextToolbar = ({ config, customControls, onInsertTable, onInsertAsset })
|
|
|
19892
19982
|
setIsLink(false);
|
|
19893
19983
|
}
|
|
19894
19984
|
}, [editor, setActiveElement, setActiveFormats, setIsLink]);
|
|
19895
|
-
(0,
|
|
19985
|
+
(0, import_react175.useEffect)(() => {
|
|
19896
19986
|
return editor.registerCommand(
|
|
19897
19987
|
import_lexical9.SELECTION_CHANGE_COMMAND,
|
|
19898
19988
|
(_payload) => {
|
|
@@ -19902,7 +19992,7 @@ var RichTextToolbar = ({ config, customControls, onInsertTable, onInsertAsset })
|
|
|
19902
19992
|
import_lexical9.COMMAND_PRIORITY_CRITICAL
|
|
19903
19993
|
);
|
|
19904
19994
|
}, [editor, updateToolbar]);
|
|
19905
|
-
(0,
|
|
19995
|
+
(0, import_react175.useEffect)(() => {
|
|
19906
19996
|
return editor.registerUpdateListener(({ editorState }) => {
|
|
19907
19997
|
requestAnimationFrame(() => {
|
|
19908
19998
|
editorState.read(() => {
|
|
@@ -20127,7 +20217,7 @@ var ParameterRichText = ({
|
|
|
20127
20217
|
}
|
|
20128
20218
|
);
|
|
20129
20219
|
};
|
|
20130
|
-
var editorContainerWrapper =
|
|
20220
|
+
var editorContainerWrapper = import_react176.css`
|
|
20131
20221
|
position: relative;
|
|
20132
20222
|
|
|
20133
20223
|
&::before {
|
|
@@ -20143,12 +20233,12 @@ var editorContainerWrapper = import_react175.css`
|
|
|
20143
20233
|
z-index: 2;
|
|
20144
20234
|
}
|
|
20145
20235
|
`;
|
|
20146
|
-
var editorWrapper =
|
|
20236
|
+
var editorWrapper = import_react176.css`
|
|
20147
20237
|
display: flex;
|
|
20148
20238
|
flex-flow: column;
|
|
20149
20239
|
flex-grow: 1;
|
|
20150
20240
|
`;
|
|
20151
|
-
var editorContainer =
|
|
20241
|
+
var editorContainer = import_react176.css`
|
|
20152
20242
|
${scrollbarStyles}
|
|
20153
20243
|
background: var(--white);
|
|
20154
20244
|
border-radius: var(--rounded-sm);
|
|
@@ -20180,7 +20270,7 @@ var editorContainer = import_react175.css`
|
|
|
20180
20270
|
max-height: unset;
|
|
20181
20271
|
}
|
|
20182
20272
|
`;
|
|
20183
|
-
var editorContainerOverflowWrapper =
|
|
20273
|
+
var editorContainerOverflowWrapper = import_react176.css`
|
|
20184
20274
|
overflow: hidden;
|
|
20185
20275
|
pointer-events: none;
|
|
20186
20276
|
|
|
@@ -20188,7 +20278,7 @@ var editorContainerOverflowWrapper = import_react175.css`
|
|
|
20188
20278
|
pointer-events: auto;
|
|
20189
20279
|
}
|
|
20190
20280
|
`;
|
|
20191
|
-
var editorPlaceholder =
|
|
20281
|
+
var editorPlaceholder = import_react176.css`
|
|
20192
20282
|
color: var(--gray-500);
|
|
20193
20283
|
font-style: italic;
|
|
20194
20284
|
/* 1px is added to make sure caret is clearly visible when field is focused
|
|
@@ -20199,7 +20289,7 @@ var editorPlaceholder = import_react175.css`
|
|
|
20199
20289
|
top: calc(1rem + var(--spacing-sm));
|
|
20200
20290
|
user-select: none;
|
|
20201
20291
|
`;
|
|
20202
|
-
var editorInput =
|
|
20292
|
+
var editorInput = import_react176.css`
|
|
20203
20293
|
min-height: 100%;
|
|
20204
20294
|
flex-grow: 1;
|
|
20205
20295
|
|
|
@@ -20303,12 +20393,12 @@ var RichText = ({
|
|
|
20303
20393
|
placeholder
|
|
20304
20394
|
}) => {
|
|
20305
20395
|
const [editor] = (0, import_LexicalComposerContext9.useLexicalComposerContext)();
|
|
20306
|
-
(0,
|
|
20396
|
+
(0, import_react177.useEffect)(() => {
|
|
20307
20397
|
if (onRichTextInit) {
|
|
20308
20398
|
onRichTextInit(editor);
|
|
20309
20399
|
}
|
|
20310
20400
|
}, [editor, onRichTextInit]);
|
|
20311
|
-
(0,
|
|
20401
|
+
(0, import_react177.useEffect)(() => {
|
|
20312
20402
|
const removeUpdateListener = editor.registerUpdateListener(({ editorState, prevEditorState, tags }) => {
|
|
20313
20403
|
requestAnimationFrame(() => {
|
|
20314
20404
|
const previousEditorState = prevEditorState.toJSON();
|
|
@@ -20325,16 +20415,16 @@ var RichText = ({
|
|
|
20325
20415
|
removeUpdateListener();
|
|
20326
20416
|
};
|
|
20327
20417
|
}, [editor, onChange]);
|
|
20328
|
-
(0,
|
|
20418
|
+
(0, import_react177.useEffect)(() => {
|
|
20329
20419
|
editor.setEditable(!readOnly);
|
|
20330
20420
|
}, [editor, readOnly]);
|
|
20331
|
-
const [editorContainerRef, setEditorContainerRef] = (0,
|
|
20421
|
+
const [editorContainerRef, setEditorContainerRef] = (0, import_react177.useState)(null);
|
|
20332
20422
|
const onEditorContainerRef = (_editorContainerRef) => {
|
|
20333
20423
|
if (_editorContainerRef !== null) {
|
|
20334
20424
|
setEditorContainerRef(_editorContainerRef);
|
|
20335
20425
|
}
|
|
20336
20426
|
};
|
|
20337
|
-
const [portalContainerRef, setPortalContainerRef] = (0,
|
|
20427
|
+
const [portalContainerRef, setPortalContainerRef] = (0, import_react177.useState)(null);
|
|
20338
20428
|
const onPortalContainerRef = (_portalContainerRef) => {
|
|
20339
20429
|
if (_portalContainerRef !== null) {
|
|
20340
20430
|
setPortalContainerRef(_portalContainerRef);
|
|
@@ -20412,15 +20502,15 @@ var RichText = ({
|
|
|
20412
20502
|
|
|
20413
20503
|
// src/components/ParameterInputs/ParameterSelect.tsx
|
|
20414
20504
|
init_emotion_jsx_shim();
|
|
20415
|
-
var
|
|
20505
|
+
var import_react178 = require("react");
|
|
20416
20506
|
var import_jsx_runtime145 = require("@emotion/react/jsx-runtime");
|
|
20417
|
-
var ParameterSelect = (0,
|
|
20507
|
+
var ParameterSelect = (0, import_react178.forwardRef)(
|
|
20418
20508
|
({ defaultOption, options, ...props }, ref) => {
|
|
20419
20509
|
const { shellProps, innerProps } = extractParameterProps(props);
|
|
20420
20510
|
return /* @__PURE__ */ (0, import_jsx_runtime145.jsx)(ParameterShell, { ...shellProps, children: /* @__PURE__ */ (0, import_jsx_runtime145.jsx)(ParameterSelectInner, { options, defaultOption, ...innerProps, ref }) });
|
|
20421
20511
|
}
|
|
20422
20512
|
);
|
|
20423
|
-
var ParameterSelectInner = (0,
|
|
20513
|
+
var ParameterSelectInner = (0, import_react178.forwardRef)(
|
|
20424
20514
|
({ defaultOption, options, ...props }, ref) => {
|
|
20425
20515
|
const { id, label: label2, hiddenLabel } = useParameterShell();
|
|
20426
20516
|
return /* @__PURE__ */ (0, import_jsx_runtime145.jsxs)(
|
|
@@ -20445,24 +20535,24 @@ var ParameterSelectInner = (0, import_react177.forwardRef)(
|
|
|
20445
20535
|
|
|
20446
20536
|
// src/components/ParameterInputs/ParameterSelectSlider.tsx
|
|
20447
20537
|
init_emotion_jsx_shim();
|
|
20448
|
-
var
|
|
20538
|
+
var import_react179 = require("react");
|
|
20449
20539
|
var import_jsx_runtime146 = require("@emotion/react/jsx-runtime");
|
|
20450
|
-
var ParameterSelectSlider = (0,
|
|
20540
|
+
var ParameterSelectSlider = (0, import_react179.forwardRef)(
|
|
20451
20541
|
(props, ref) => {
|
|
20452
20542
|
const { shellProps, innerProps } = extractParameterProps(props);
|
|
20453
20543
|
return /* @__PURE__ */ (0, import_jsx_runtime146.jsx)(ParameterShell, { "data-testid": "parameter-select-slider", ...shellProps, children: /* @__PURE__ */ (0, import_jsx_runtime146.jsx)(ParameterSelectSliderInner, { ref, ...innerProps }) });
|
|
20454
20544
|
}
|
|
20455
20545
|
);
|
|
20456
|
-
var ParameterSelectSliderInner = (0,
|
|
20546
|
+
var ParameterSelectSliderInner = (0, import_react179.forwardRef)(({ options, value, onChange, ...props }, ref) => {
|
|
20457
20547
|
const { id, label: label2, hiddenLabel } = useParameterShell();
|
|
20458
|
-
const numericValue = (0,
|
|
20548
|
+
const numericValue = (0, import_react179.useMemo)(() => {
|
|
20459
20549
|
if (value === void 0 || value === null || value === "") {
|
|
20460
20550
|
return void 0;
|
|
20461
20551
|
}
|
|
20462
20552
|
const index = options.findIndex((option) => option.value === value);
|
|
20463
20553
|
return index >= 0 ? index : void 0;
|
|
20464
20554
|
}, [options, value]);
|
|
20465
|
-
const handleChange = (0,
|
|
20555
|
+
const handleChange = (0, import_react179.useCallback)(
|
|
20466
20556
|
(newValue) => {
|
|
20467
20557
|
var _a;
|
|
20468
20558
|
if (newValue === void 0) {
|
|
@@ -20492,13 +20582,13 @@ ParameterSelectSliderInner.displayName = "ParameterSelectSliderInner";
|
|
|
20492
20582
|
|
|
20493
20583
|
// src/components/ParameterInputs/ParameterTextarea.tsx
|
|
20494
20584
|
init_emotion_jsx_shim();
|
|
20495
|
-
var
|
|
20585
|
+
var import_react180 = require("react");
|
|
20496
20586
|
var import_jsx_runtime147 = require("@emotion/react/jsx-runtime");
|
|
20497
|
-
var ParameterTextarea = (0,
|
|
20587
|
+
var ParameterTextarea = (0, import_react180.forwardRef)((props, ref) => {
|
|
20498
20588
|
const { shellProps, innerProps } = extractParameterProps(props);
|
|
20499
20589
|
return /* @__PURE__ */ (0, import_jsx_runtime147.jsx)(ParameterShell, { "data-testid": "parameter-textarea", ...shellProps, children: /* @__PURE__ */ (0, import_jsx_runtime147.jsx)(ParameterTextareaInner, { ref, ...innerProps }) });
|
|
20500
20590
|
});
|
|
20501
|
-
var ParameterTextareaInner = (0,
|
|
20591
|
+
var ParameterTextareaInner = (0, import_react180.forwardRef)(({ ...props }, ref) => {
|
|
20502
20592
|
const { id, label: label2, hiddenLabel } = useParameterShell();
|
|
20503
20593
|
return /* @__PURE__ */ (0, import_jsx_runtime147.jsx)(
|
|
20504
20594
|
"textarea",
|
|
@@ -20514,14 +20604,14 @@ var ParameterTextareaInner = (0, import_react179.forwardRef)(({ ...props }, ref)
|
|
|
20514
20604
|
|
|
20515
20605
|
// src/components/ParameterInputs/ParameterToggle.tsx
|
|
20516
20606
|
init_emotion_jsx_shim();
|
|
20517
|
-
var
|
|
20607
|
+
var import_react181 = require("react");
|
|
20518
20608
|
var import_jsx_runtime148 = require("@emotion/react/jsx-runtime");
|
|
20519
|
-
var ParameterToggle = (0,
|
|
20609
|
+
var ParameterToggle = (0, import_react181.forwardRef)((props, ref) => {
|
|
20520
20610
|
const { shellProps, innerProps } = extractParameterProps(props);
|
|
20521
20611
|
return /* @__PURE__ */ (0, import_jsx_runtime148.jsx)(ParameterShell, { ...shellProps, children: /* @__PURE__ */ (0, import_jsx_runtime148.jsx)(ParameterToggleInner, { ref, ...innerProps }) });
|
|
20522
20612
|
});
|
|
20523
20613
|
ParameterToggle.displayName = "ParameterToggle";
|
|
20524
|
-
var ParameterToggleInner = (0,
|
|
20614
|
+
var ParameterToggleInner = (0, import_react181.forwardRef)(
|
|
20525
20615
|
({ children, ...props }, ref) => {
|
|
20526
20616
|
const { type, withoutIndeterminateState, ...otherProps } = props;
|
|
20527
20617
|
const { id, label: label2 } = useParameterShell();
|
|
@@ -20551,8 +20641,8 @@ init_emotion_jsx_shim();
|
|
|
20551
20641
|
|
|
20552
20642
|
// src/components/ProgressBar/ProgressBar.styles.ts
|
|
20553
20643
|
init_emotion_jsx_shim();
|
|
20554
|
-
var
|
|
20555
|
-
var container4 =
|
|
20644
|
+
var import_react182 = require("@emotion/react");
|
|
20645
|
+
var container4 = import_react182.css`
|
|
20556
20646
|
background: var(--gray-50);
|
|
20557
20647
|
margin-block: var(--spacing-sm);
|
|
20558
20648
|
position: relative;
|
|
@@ -20562,17 +20652,17 @@ var container4 = import_react181.css`
|
|
|
20562
20652
|
border: solid 1px var(--gray-300);
|
|
20563
20653
|
`;
|
|
20564
20654
|
var themeMap = {
|
|
20565
|
-
primary:
|
|
20655
|
+
primary: import_react182.css`
|
|
20566
20656
|
--progress-color: var(--accent-light);
|
|
20567
20657
|
`,
|
|
20568
|
-
secondary:
|
|
20658
|
+
secondary: import_react182.css`
|
|
20569
20659
|
--progress-color: var(--accent-alt-light);
|
|
20570
20660
|
`,
|
|
20571
|
-
destructive:
|
|
20661
|
+
destructive: import_react182.css`
|
|
20572
20662
|
--progress-color: var(--brand-secondary-5);
|
|
20573
20663
|
`
|
|
20574
20664
|
};
|
|
20575
|
-
var slidingBackgroundPosition =
|
|
20665
|
+
var slidingBackgroundPosition = import_react182.keyframes`
|
|
20576
20666
|
from {
|
|
20577
20667
|
background-position: 0 0;
|
|
20578
20668
|
}
|
|
@@ -20580,10 +20670,10 @@ var slidingBackgroundPosition = import_react181.keyframes`
|
|
|
20580
20670
|
background-position: 64px 0;
|
|
20581
20671
|
}
|
|
20582
20672
|
`;
|
|
20583
|
-
var determinate =
|
|
20673
|
+
var determinate = import_react182.css`
|
|
20584
20674
|
background-color: var(--progress-color);
|
|
20585
20675
|
`;
|
|
20586
|
-
var indeterminate =
|
|
20676
|
+
var indeterminate = import_react182.css`
|
|
20587
20677
|
background-image: linear-gradient(
|
|
20588
20678
|
45deg,
|
|
20589
20679
|
var(--progress-color) 25%,
|
|
@@ -20597,7 +20687,7 @@ var indeterminate = import_react181.css`
|
|
|
20597
20687
|
background-size: 64px 64px;
|
|
20598
20688
|
animation: ${slidingBackgroundPosition} 1s linear infinite;
|
|
20599
20689
|
`;
|
|
20600
|
-
var bar =
|
|
20690
|
+
var bar = import_react182.css`
|
|
20601
20691
|
position: absolute;
|
|
20602
20692
|
inset: 0;
|
|
20603
20693
|
transition: transform var(--duration-fast) var(--timing-ease-out);
|
|
@@ -20646,22 +20736,22 @@ function ProgressBar({
|
|
|
20646
20736
|
|
|
20647
20737
|
// src/components/ProgressList/ProgressList.tsx
|
|
20648
20738
|
init_emotion_jsx_shim();
|
|
20649
|
-
var
|
|
20739
|
+
var import_react184 = require("@emotion/react");
|
|
20650
20740
|
var import_CgCheckO4 = require("@react-icons/all-files/cg/CgCheckO");
|
|
20651
20741
|
var import_CgRadioCheck2 = require("@react-icons/all-files/cg/CgRadioCheck");
|
|
20652
20742
|
var import_CgRecord2 = require("@react-icons/all-files/cg/CgRecord");
|
|
20653
|
-
var
|
|
20743
|
+
var import_react185 = require("react");
|
|
20654
20744
|
|
|
20655
20745
|
// src/components/ProgressList/styles/ProgressList.styles.ts
|
|
20656
20746
|
init_emotion_jsx_shim();
|
|
20657
|
-
var
|
|
20658
|
-
var progressListStyles =
|
|
20747
|
+
var import_react183 = require("@emotion/react");
|
|
20748
|
+
var progressListStyles = import_react183.css`
|
|
20659
20749
|
display: flex;
|
|
20660
20750
|
flex-direction: column;
|
|
20661
20751
|
gap: var(--spacing-sm);
|
|
20662
20752
|
list-style-type: none;
|
|
20663
20753
|
`;
|
|
20664
|
-
var progressListItemStyles =
|
|
20754
|
+
var progressListItemStyles = import_react183.css`
|
|
20665
20755
|
display: flex;
|
|
20666
20756
|
gap: var(--spacing-base);
|
|
20667
20757
|
align-items: center;
|
|
@@ -20670,7 +20760,7 @@ var progressListItemStyles = import_react182.css`
|
|
|
20670
20760
|
// src/components/ProgressList/ProgressList.tsx
|
|
20671
20761
|
var import_jsx_runtime150 = require("@emotion/react/jsx-runtime");
|
|
20672
20762
|
var ProgressList = ({ inProgressId, items, autoEllipsis, ...htmlProps }) => {
|
|
20673
|
-
const itemsWithStatus = (0,
|
|
20763
|
+
const itemsWithStatus = (0, import_react185.useMemo)(() => {
|
|
20674
20764
|
const indexOfInProgressItem = items.findIndex(({ id }) => id === inProgressId);
|
|
20675
20765
|
return items.map((item, index) => {
|
|
20676
20766
|
let status = "queued";
|
|
@@ -20703,7 +20793,7 @@ var ProgressListItem = ({
|
|
|
20703
20793
|
errorLevel = "danger",
|
|
20704
20794
|
autoEllipsis = false
|
|
20705
20795
|
}) => {
|
|
20706
|
-
const icon = (0,
|
|
20796
|
+
const icon = (0, import_react185.useMemo)(() => {
|
|
20707
20797
|
if (error) {
|
|
20708
20798
|
return warningIcon;
|
|
20709
20799
|
}
|
|
@@ -20714,14 +20804,14 @@ var ProgressListItem = ({
|
|
|
20714
20804
|
};
|
|
20715
20805
|
return iconPerStatus[status];
|
|
20716
20806
|
}, [status, error]);
|
|
20717
|
-
const statusStyles = (0,
|
|
20807
|
+
const statusStyles = (0, import_react185.useMemo)(() => {
|
|
20718
20808
|
if (error) {
|
|
20719
|
-
return errorLevel === "caution" ?
|
|
20809
|
+
return errorLevel === "caution" ? import_react184.css`
|
|
20720
20810
|
color: rgb(161, 98, 7);
|
|
20721
20811
|
& svg {
|
|
20722
20812
|
color: rgb(250, 204, 21);
|
|
20723
20813
|
}
|
|
20724
|
-
` :
|
|
20814
|
+
` : import_react184.css`
|
|
20725
20815
|
color: rgb(185, 28, 28);
|
|
20726
20816
|
& svg {
|
|
20727
20817
|
color: var(--brand-primary-2);
|
|
@@ -20729,13 +20819,13 @@ var ProgressListItem = ({
|
|
|
20729
20819
|
`;
|
|
20730
20820
|
}
|
|
20731
20821
|
const colorPerStatus = {
|
|
20732
|
-
completed:
|
|
20822
|
+
completed: import_react184.css`
|
|
20733
20823
|
opacity: 0.75;
|
|
20734
20824
|
`,
|
|
20735
|
-
inProgress:
|
|
20825
|
+
inProgress: import_react184.css`
|
|
20736
20826
|
-webkit-text-stroke-width: thin;
|
|
20737
20827
|
`,
|
|
20738
|
-
queued:
|
|
20828
|
+
queued: import_react184.css`
|
|
20739
20829
|
opacity: 0.5;
|
|
20740
20830
|
`
|
|
20741
20831
|
};
|
|
@@ -20752,16 +20842,16 @@ var ProgressListItem = ({
|
|
|
20752
20842
|
|
|
20753
20843
|
// src/components/SegmentedControl/SegmentedControl.tsx
|
|
20754
20844
|
init_emotion_jsx_shim();
|
|
20755
|
-
var
|
|
20756
|
-
var
|
|
20845
|
+
var import_react187 = require("@emotion/react");
|
|
20846
|
+
var import_react188 = require("react");
|
|
20757
20847
|
|
|
20758
20848
|
// src/components/SegmentedControl/SegmentedControl.styles.ts
|
|
20759
20849
|
init_emotion_jsx_shim();
|
|
20760
|
-
var
|
|
20761
|
-
var segmentedControlRootStyles =
|
|
20850
|
+
var import_react186 = require("@emotion/react");
|
|
20851
|
+
var segmentedControlRootStyles = import_react186.css`
|
|
20762
20852
|
position: relative;
|
|
20763
20853
|
`;
|
|
20764
|
-
var segmentedControlScrollIndicatorsStyles =
|
|
20854
|
+
var segmentedControlScrollIndicatorsStyles = import_react186.css`
|
|
20765
20855
|
position: absolute;
|
|
20766
20856
|
inset: 0;
|
|
20767
20857
|
z-index: 1;
|
|
@@ -20789,17 +20879,17 @@ var segmentedControlScrollIndicatorsStyles = import_react185.css`
|
|
|
20789
20879
|
background: linear-gradient(to left, var(--background-color) 10%, transparent);
|
|
20790
20880
|
}
|
|
20791
20881
|
`;
|
|
20792
|
-
var segmentedControlScrollIndicatorStartVisibleStyles =
|
|
20882
|
+
var segmentedControlScrollIndicatorStartVisibleStyles = import_react186.css`
|
|
20793
20883
|
&::before {
|
|
20794
20884
|
opacity: 1;
|
|
20795
20885
|
}
|
|
20796
20886
|
`;
|
|
20797
|
-
var segmentedControlScrollIndicatorEndVisibleStyles =
|
|
20887
|
+
var segmentedControlScrollIndicatorEndVisibleStyles = import_react186.css`
|
|
20798
20888
|
&::after {
|
|
20799
20889
|
opacity: 1;
|
|
20800
20890
|
}
|
|
20801
20891
|
`;
|
|
20802
|
-
var segmentedControlWrapperStyles =
|
|
20892
|
+
var segmentedControlWrapperStyles = import_react186.css`
|
|
20803
20893
|
overflow-y: auto;
|
|
20804
20894
|
scroll-behavior: smooth;
|
|
20805
20895
|
scrollbar-width: none;
|
|
@@ -20808,7 +20898,7 @@ var segmentedControlWrapperStyles = import_react185.css`
|
|
|
20808
20898
|
height: 0px;
|
|
20809
20899
|
}
|
|
20810
20900
|
`;
|
|
20811
|
-
var segmentedControlStyles =
|
|
20901
|
+
var segmentedControlStyles = import_react186.css`
|
|
20812
20902
|
--segmented-control-rounded-value: var(--rounded-base);
|
|
20813
20903
|
--segmented-control-border-width: 1px;
|
|
20814
20904
|
--segmented-control-selected-color: var(--accent-dark);
|
|
@@ -20828,14 +20918,14 @@ var segmentedControlStyles = import_react185.css`
|
|
|
20828
20918
|
border-radius: calc(var(--segmented-control-rounded-value) + var(--segmented-control-border-width));
|
|
20829
20919
|
font-size: var(--fs-xs);
|
|
20830
20920
|
`;
|
|
20831
|
-
var segmentedControlVerticalStyles =
|
|
20921
|
+
var segmentedControlVerticalStyles = import_react186.css`
|
|
20832
20922
|
flex-direction: column;
|
|
20833
20923
|
--segmented-control-first-border-radius: var(--segmented-control-rounded-value)
|
|
20834
20924
|
var(--segmented-control-rounded-value) 0 0;
|
|
20835
20925
|
--segmented-control-last-border-radius: 0 0 var(--segmented-control-rounded-value)
|
|
20836
20926
|
var(--segmented-control-rounded-value);
|
|
20837
20927
|
`;
|
|
20838
|
-
var segmentedControlItemStyles =
|
|
20928
|
+
var segmentedControlItemStyles = import_react186.css`
|
|
20839
20929
|
position: relative;
|
|
20840
20930
|
|
|
20841
20931
|
&:first-of-type label {
|
|
@@ -20861,10 +20951,10 @@ var segmentedControlItemStyles = import_react185.css`
|
|
|
20861
20951
|
box-shadow: var(--segmented-control-border-width) 0 0 0 transparent;
|
|
20862
20952
|
}
|
|
20863
20953
|
`;
|
|
20864
|
-
var segmentedControlInputStyles =
|
|
20954
|
+
var segmentedControlInputStyles = import_react186.css`
|
|
20865
20955
|
${accessibleHidden}
|
|
20866
20956
|
`;
|
|
20867
|
-
var segmentedControlLabelStyles =
|
|
20957
|
+
var segmentedControlLabelStyles = import_react186.css`
|
|
20868
20958
|
position: relative;
|
|
20869
20959
|
display: flex;
|
|
20870
20960
|
align-items: center;
|
|
@@ -20899,20 +20989,20 @@ var segmentedControlLabelStyles = import_react185.css`
|
|
|
20899
20989
|
background-color: var(--gray-400);
|
|
20900
20990
|
}
|
|
20901
20991
|
`;
|
|
20902
|
-
var segmentedControlLabelIconOnlyStyles =
|
|
20992
|
+
var segmentedControlLabelIconOnlyStyles = import_react186.css`
|
|
20903
20993
|
padding-inline: 0.5em;
|
|
20904
20994
|
`;
|
|
20905
|
-
var segmentedControlLabelCheckStyles =
|
|
20995
|
+
var segmentedControlLabelCheckStyles = import_react186.css`
|
|
20906
20996
|
opacity: 0.5;
|
|
20907
20997
|
`;
|
|
20908
|
-
var segmentedControlLabelContentStyles =
|
|
20998
|
+
var segmentedControlLabelContentStyles = import_react186.css`
|
|
20909
20999
|
display: flex;
|
|
20910
21000
|
align-items: center;
|
|
20911
21001
|
justify-content: center;
|
|
20912
21002
|
gap: var(--spacing-sm);
|
|
20913
21003
|
height: 100%;
|
|
20914
21004
|
`;
|
|
20915
|
-
var segmentedControlLabelTextStyles =
|
|
21005
|
+
var segmentedControlLabelTextStyles = import_react186.css`
|
|
20916
21006
|
white-space: nowrap;
|
|
20917
21007
|
`;
|
|
20918
21008
|
|
|
@@ -20933,10 +21023,10 @@ var SegmentedControl = ({
|
|
|
20933
21023
|
// deprecated, destructured to prevent spreading to DOM
|
|
20934
21024
|
...props
|
|
20935
21025
|
}) => {
|
|
20936
|
-
const wrapperRef = (0,
|
|
20937
|
-
const [isOverflowStartShadowVisible, setIsOverflowStartShadowVisible] = (0,
|
|
20938
|
-
const [isOverflowEndShadowVisible, setIsOverflowEndShadowVisible] = (0,
|
|
20939
|
-
const onOptionChange = (0,
|
|
21026
|
+
const wrapperRef = (0, import_react188.useRef)(null);
|
|
21027
|
+
const [isOverflowStartShadowVisible, setIsOverflowStartShadowVisible] = (0, import_react188.useState)(false);
|
|
21028
|
+
const [isOverflowEndShadowVisible, setIsOverflowEndShadowVisible] = (0, import_react188.useState)(false);
|
|
21029
|
+
const onOptionChange = (0, import_react188.useCallback)(
|
|
20940
21030
|
(event) => {
|
|
20941
21031
|
if (event.target.checked) {
|
|
20942
21032
|
onChange == null ? void 0 : onChange(options[parseInt(event.target.value)].value);
|
|
@@ -20944,19 +21034,19 @@ var SegmentedControl = ({
|
|
|
20944
21034
|
},
|
|
20945
21035
|
[options, onChange]
|
|
20946
21036
|
);
|
|
20947
|
-
const sizeStyles = (0,
|
|
21037
|
+
const sizeStyles = (0, import_react188.useMemo)(() => {
|
|
20948
21038
|
const map = {
|
|
20949
|
-
sm: (0,
|
|
20950
|
-
md: (0,
|
|
20951
|
-
lg: (0,
|
|
20952
|
-
xl: (0,
|
|
21039
|
+
sm: (0, import_react187.css)({ height: "calc(24px - 2px)", fontSize: "var(--fs-xs)" }),
|
|
21040
|
+
md: (0, import_react187.css)({ height: "calc(32px - 2px)", fontSize: "var(--fs-sm)" }),
|
|
21041
|
+
lg: (0, import_react187.css)({ height: "calc(40px - 2px)", fontSize: "var(--fs-base)" }),
|
|
21042
|
+
xl: (0, import_react187.css)({ height: "calc(48px - 2px)", fontSize: "var(--fs-base)" })
|
|
20953
21043
|
};
|
|
20954
21044
|
return map[size];
|
|
20955
21045
|
}, [size]);
|
|
20956
|
-
const isIconOnly = (0,
|
|
21046
|
+
const isIconOnly = (0, import_react188.useMemo)(() => {
|
|
20957
21047
|
return options.every((option) => option && option.icon && !option.label);
|
|
20958
21048
|
}, [options]);
|
|
20959
|
-
(0,
|
|
21049
|
+
(0, import_react188.useEffect)(() => {
|
|
20960
21050
|
const wrapperElement = wrapperRef.current;
|
|
20961
21051
|
const onScroll = () => {
|
|
20962
21052
|
if (!wrapperElement) {
|
|
@@ -21051,12 +21141,12 @@ init_emotion_jsx_shim();
|
|
|
21051
21141
|
|
|
21052
21142
|
// src/components/Skeleton/Skeleton.styles.ts
|
|
21053
21143
|
init_emotion_jsx_shim();
|
|
21054
|
-
var
|
|
21055
|
-
var lightFadingOut =
|
|
21144
|
+
var import_react189 = require("@emotion/react");
|
|
21145
|
+
var lightFadingOut = import_react189.keyframes`
|
|
21056
21146
|
from { opacity: 0.1; }
|
|
21057
21147
|
to { opacity: 0.025; }
|
|
21058
21148
|
`;
|
|
21059
|
-
var skeletonStyles =
|
|
21149
|
+
var skeletonStyles = import_react189.css`
|
|
21060
21150
|
animation: ${lightFadingOut} 1s ease-out infinite alternate;
|
|
21061
21151
|
background-color: var(--gray-500);
|
|
21062
21152
|
`;
|
|
@@ -21094,12 +21184,12 @@ init_emotion_jsx_shim();
|
|
|
21094
21184
|
|
|
21095
21185
|
// src/components/Spinner/Spinner.tsx
|
|
21096
21186
|
init_emotion_jsx_shim();
|
|
21097
|
-
var
|
|
21187
|
+
var import_react191 = require("react");
|
|
21098
21188
|
|
|
21099
21189
|
// src/components/Spinner/Spinner.styles.ts
|
|
21100
21190
|
init_emotion_jsx_shim();
|
|
21101
|
-
var
|
|
21102
|
-
var SpinnerStyles =
|
|
21191
|
+
var import_react190 = require("@emotion/react");
|
|
21192
|
+
var SpinnerStyles = import_react190.css`
|
|
21103
21193
|
--color: #00b4ff;
|
|
21104
21194
|
--speed: 5s;
|
|
21105
21195
|
--red: rgb(218, 63, 50);
|
|
@@ -21535,8 +21625,8 @@ var Spinner = ({
|
|
|
21535
21625
|
label: label2,
|
|
21536
21626
|
isPaused
|
|
21537
21627
|
}) => {
|
|
21538
|
-
const ref = (0,
|
|
21539
|
-
(0,
|
|
21628
|
+
const ref = (0, import_react191.useRef)(null);
|
|
21629
|
+
(0, import_react191.useEffect)(() => {
|
|
21540
21630
|
var _a, _b, _c;
|
|
21541
21631
|
(_c = ref.current) == null ? void 0 : _c.style.setProperty("--pyramid-size", ((_b = (_a = ref.current) == null ? void 0 : _a.clientWidth) != null ? _b : 200) / 6 + "px");
|
|
21542
21632
|
}, [width]);
|
|
@@ -21608,11 +21698,11 @@ init_emotion_jsx_shim();
|
|
|
21608
21698
|
|
|
21609
21699
|
// src/components/StackedModal/hooks/StackedModalProvider.tsx
|
|
21610
21700
|
init_emotion_jsx_shim();
|
|
21611
|
-
var
|
|
21701
|
+
var import_react192 = require("react");
|
|
21612
21702
|
var import_jsx_runtime154 = require("@emotion/react/jsx-runtime");
|
|
21613
|
-
var StackedModalContext = (0,
|
|
21703
|
+
var StackedModalContext = (0, import_react192.createContext)(null);
|
|
21614
21704
|
function useStackedModal() {
|
|
21615
|
-
const context = (0,
|
|
21705
|
+
const context = (0, import_react192.useContext)(StackedModalContext);
|
|
21616
21706
|
if (!context) {
|
|
21617
21707
|
throw new Error("useStackedModal must be used within a <StackedModal> component.");
|
|
21618
21708
|
}
|
|
@@ -21628,10 +21718,10 @@ function useStepTransition(index) {
|
|
|
21628
21718
|
};
|
|
21629
21719
|
}
|
|
21630
21720
|
function StackedModalProvider({ children, totalSteps, initialStep }) {
|
|
21631
|
-
const [currentStep, setCurrentStep] = (0,
|
|
21632
|
-
const [direction, setDirection] = (0,
|
|
21633
|
-
const previousStepRef = (0,
|
|
21634
|
-
const nextStep = (0,
|
|
21721
|
+
const [currentStep, setCurrentStep] = (0, import_react192.useState)(initialStep);
|
|
21722
|
+
const [direction, setDirection] = (0, import_react192.useState)("forward");
|
|
21723
|
+
const previousStepRef = (0, import_react192.useRef)(initialStep);
|
|
21724
|
+
const nextStep = (0, import_react192.useCallback)(() => {
|
|
21635
21725
|
setCurrentStep((prev) => {
|
|
21636
21726
|
if (prev >= totalSteps - 1) {
|
|
21637
21727
|
return prev;
|
|
@@ -21641,7 +21731,7 @@ function StackedModalProvider({ children, totalSteps, initialStep }) {
|
|
|
21641
21731
|
return prev + 1;
|
|
21642
21732
|
});
|
|
21643
21733
|
}, [totalSteps]);
|
|
21644
|
-
const goBack = (0,
|
|
21734
|
+
const goBack = (0, import_react192.useCallback)(() => {
|
|
21645
21735
|
setCurrentStep((prev) => {
|
|
21646
21736
|
if (prev <= 0) {
|
|
21647
21737
|
return prev;
|
|
@@ -21651,7 +21741,7 @@ function StackedModalProvider({ children, totalSteps, initialStep }) {
|
|
|
21651
21741
|
return prev - 1;
|
|
21652
21742
|
});
|
|
21653
21743
|
}, []);
|
|
21654
|
-
const goToStep = (0,
|
|
21744
|
+
const goToStep = (0, import_react192.useCallback)(
|
|
21655
21745
|
(index) => {
|
|
21656
21746
|
setCurrentStep((prev) => {
|
|
21657
21747
|
if (index < 0 || index >= totalSteps || index === prev) {
|
|
@@ -21664,7 +21754,7 @@ function StackedModalProvider({ children, totalSteps, initialStep }) {
|
|
|
21664
21754
|
},
|
|
21665
21755
|
[totalSteps]
|
|
21666
21756
|
);
|
|
21667
|
-
const value = (0,
|
|
21757
|
+
const value = (0, import_react192.useMemo)(
|
|
21668
21758
|
() => ({
|
|
21669
21759
|
currentStep,
|
|
21670
21760
|
totalSteps,
|
|
@@ -21681,7 +21771,7 @@ function StackedModalProvider({ children, totalSteps, initialStep }) {
|
|
|
21681
21771
|
|
|
21682
21772
|
// src/components/StackedModal/StackedModal.tsx
|
|
21683
21773
|
init_emotion_jsx_shim();
|
|
21684
|
-
var
|
|
21774
|
+
var import_react194 = __toESM(require("react"));
|
|
21685
21775
|
|
|
21686
21776
|
// src/components/StackedModal/AnimatedStepHeader.tsx
|
|
21687
21777
|
init_emotion_jsx_shim();
|
|
@@ -21691,13 +21781,13 @@ init_emotion_jsx_shim();
|
|
|
21691
21781
|
|
|
21692
21782
|
// src/components/StackedModal/styles/StackedModal.styles.ts
|
|
21693
21783
|
init_emotion_jsx_shim();
|
|
21694
|
-
var
|
|
21695
|
-
var stackedModalRootStyles =
|
|
21784
|
+
var import_react193 = require("@emotion/react");
|
|
21785
|
+
var stackedModalRootStyles = import_react193.css`
|
|
21696
21786
|
dialog > div {
|
|
21697
21787
|
background: var(--white);
|
|
21698
21788
|
}
|
|
21699
21789
|
`;
|
|
21700
|
-
var slideInFromRight =
|
|
21790
|
+
var slideInFromRight = import_react193.keyframes`
|
|
21701
21791
|
from {
|
|
21702
21792
|
transform: translateX(100%);
|
|
21703
21793
|
opacity: 0;
|
|
@@ -21707,7 +21797,7 @@ var slideInFromRight = import_react192.keyframes`
|
|
|
21707
21797
|
opacity: 1;
|
|
21708
21798
|
}
|
|
21709
21799
|
`;
|
|
21710
|
-
var slideOutToLeft =
|
|
21800
|
+
var slideOutToLeft = import_react193.keyframes`
|
|
21711
21801
|
from {
|
|
21712
21802
|
transform: translateX(0);
|
|
21713
21803
|
opacity: 1;
|
|
@@ -21717,7 +21807,7 @@ var slideOutToLeft = import_react192.keyframes`
|
|
|
21717
21807
|
opacity: 0;
|
|
21718
21808
|
}
|
|
21719
21809
|
`;
|
|
21720
|
-
var slideInFromLeft =
|
|
21810
|
+
var slideInFromLeft = import_react193.keyframes`
|
|
21721
21811
|
from {
|
|
21722
21812
|
transform: translateX(-100%);
|
|
21723
21813
|
opacity: 0;
|
|
@@ -21727,7 +21817,7 @@ var slideInFromLeft = import_react192.keyframes`
|
|
|
21727
21817
|
opacity: 1;
|
|
21728
21818
|
}
|
|
21729
21819
|
`;
|
|
21730
|
-
var slideOutToRight =
|
|
21820
|
+
var slideOutToRight = import_react193.keyframes`
|
|
21731
21821
|
from {
|
|
21732
21822
|
transform: translateX(0);
|
|
21733
21823
|
opacity: 1;
|
|
@@ -21737,64 +21827,64 @@ var slideOutToRight = import_react192.keyframes`
|
|
|
21737
21827
|
opacity: 0;
|
|
21738
21828
|
}
|
|
21739
21829
|
`;
|
|
21740
|
-
var stepContainerStyles =
|
|
21830
|
+
var stepContainerStyles = import_react193.css`
|
|
21741
21831
|
position: relative;
|
|
21742
21832
|
flex: 1;
|
|
21743
21833
|
overflow: hidden;
|
|
21744
21834
|
height: 100%;
|
|
21745
21835
|
`;
|
|
21746
|
-
var stepBaseStyles =
|
|
21836
|
+
var stepBaseStyles = import_react193.css`
|
|
21747
21837
|
position: absolute;
|
|
21748
21838
|
inset: 0;
|
|
21749
21839
|
display: flex;
|
|
21750
21840
|
flex-direction: column;
|
|
21751
21841
|
gap: var(--spacing-base);
|
|
21752
21842
|
`;
|
|
21753
|
-
var stepActiveStyles =
|
|
21843
|
+
var stepActiveStyles = import_react193.css`
|
|
21754
21844
|
visibility: visible;
|
|
21755
21845
|
`;
|
|
21756
|
-
var stepInactiveStyles =
|
|
21846
|
+
var stepInactiveStyles = import_react193.css`
|
|
21757
21847
|
visibility: hidden;
|
|
21758
21848
|
`;
|
|
21759
|
-
var stepEnterForwardStyles =
|
|
21849
|
+
var stepEnterForwardStyles = import_react193.css`
|
|
21760
21850
|
animation: ${slideInFromRight} var(--duration-fast) var(--timing-ease-out) forwards;
|
|
21761
21851
|
|
|
21762
21852
|
${prefersReducedMotion("reduce")} {
|
|
21763
21853
|
animation: none;
|
|
21764
21854
|
}
|
|
21765
21855
|
`;
|
|
21766
|
-
var stepExitForwardStyles =
|
|
21856
|
+
var stepExitForwardStyles = import_react193.css`
|
|
21767
21857
|
animation: ${slideOutToLeft} var(--duration-fast) var(--timing-ease-out) forwards;
|
|
21768
21858
|
|
|
21769
21859
|
${prefersReducedMotion("reduce")} {
|
|
21770
21860
|
animation: none;
|
|
21771
21861
|
}
|
|
21772
21862
|
`;
|
|
21773
|
-
var stepEnterBackwardStyles =
|
|
21863
|
+
var stepEnterBackwardStyles = import_react193.css`
|
|
21774
21864
|
animation: ${slideInFromLeft} var(--duration-fast) var(--timing-ease-out) forwards;
|
|
21775
21865
|
|
|
21776
21866
|
${prefersReducedMotion("reduce")} {
|
|
21777
21867
|
animation: none;
|
|
21778
21868
|
}
|
|
21779
21869
|
`;
|
|
21780
|
-
var stepExitBackwardStyles =
|
|
21870
|
+
var stepExitBackwardStyles = import_react193.css`
|
|
21781
21871
|
animation: ${slideOutToRight} var(--duration-fast) var(--timing-ease-out) forwards;
|
|
21782
21872
|
|
|
21783
21873
|
${prefersReducedMotion("reduce")} {
|
|
21784
21874
|
animation: none;
|
|
21785
21875
|
}
|
|
21786
21876
|
`;
|
|
21787
|
-
var headerContainerStyles =
|
|
21877
|
+
var headerContainerStyles = import_react193.css`
|
|
21788
21878
|
position: relative;
|
|
21789
21879
|
overflow: hidden;
|
|
21790
21880
|
flex: 1;
|
|
21791
21881
|
`;
|
|
21792
|
-
var headerItemStyles = (isActive) =>
|
|
21882
|
+
var headerItemStyles = (isActive) => import_react193.css`
|
|
21793
21883
|
position: ${isActive ? "relative" : "absolute"};
|
|
21794
21884
|
inset: 0;
|
|
21795
21885
|
white-space: nowrap;
|
|
21796
21886
|
`;
|
|
21797
|
-
var stepContentStyles =
|
|
21887
|
+
var stepContentStyles = import_react193.css`
|
|
21798
21888
|
position: relative;
|
|
21799
21889
|
flex: 1;
|
|
21800
21890
|
overflow: auto;
|
|
@@ -21857,18 +21947,18 @@ function StackedModalStep({ children, buttonGroup }) {
|
|
|
21857
21947
|
// src/components/StackedModal/StackedModal.tsx
|
|
21858
21948
|
var import_jsx_runtime157 = require("@emotion/react/jsx-runtime");
|
|
21859
21949
|
function filterSteps(children) {
|
|
21860
|
-
return
|
|
21861
|
-
(child) =>
|
|
21950
|
+
return import_react194.default.Children.toArray(children).filter(
|
|
21951
|
+
(child) => import_react194.default.isValidElement(child) && child.type === StackedModalStep
|
|
21862
21952
|
);
|
|
21863
21953
|
}
|
|
21864
|
-
var StackedModal =
|
|
21954
|
+
var StackedModal = import_react194.default.forwardRef(
|
|
21865
21955
|
({ children, initialStep = 0, ...rest }, ref) => {
|
|
21866
21956
|
const steps = filterSteps(children);
|
|
21867
21957
|
return /* @__PURE__ */ (0, import_jsx_runtime157.jsx)(StackedModalProvider, { totalSteps: steps.length, initialStep, children: /* @__PURE__ */ (0, import_jsx_runtime157.jsx)(StackedModalInner, { ref, steps, ...rest }) });
|
|
21868
21958
|
}
|
|
21869
21959
|
);
|
|
21870
21960
|
StackedModal.displayName = "StackedModal";
|
|
21871
|
-
var StackedModalInner =
|
|
21961
|
+
var StackedModalInner = import_react194.default.forwardRef(
|
|
21872
21962
|
({ steps, onRequestClose, modalSize = "lg", width, height }, ref) => {
|
|
21873
21963
|
return /* @__PURE__ */ (0, import_jsx_runtime157.jsx)("div", { css: stackedModalRootStyles, children: /* @__PURE__ */ (0, import_jsx_runtime157.jsx)(
|
|
21874
21964
|
Modal,
|
|
@@ -21898,12 +21988,12 @@ function StackedModalStepWrapper({ index, children }) {
|
|
|
21898
21988
|
|
|
21899
21989
|
// src/components/Switch/Switch.tsx
|
|
21900
21990
|
init_emotion_jsx_shim();
|
|
21901
|
-
var
|
|
21991
|
+
var import_react196 = require("react");
|
|
21902
21992
|
|
|
21903
21993
|
// src/components/Switch/Switch.styles.ts
|
|
21904
21994
|
init_emotion_jsx_shim();
|
|
21905
|
-
var
|
|
21906
|
-
var SwitchInputContainer =
|
|
21995
|
+
var import_react195 = require("@emotion/react");
|
|
21996
|
+
var SwitchInputContainer = import_react195.css`
|
|
21907
21997
|
cursor: pointer;
|
|
21908
21998
|
display: inline-flex;
|
|
21909
21999
|
position: relative;
|
|
@@ -21913,7 +22003,7 @@ var SwitchInputContainer = import_react194.css`
|
|
|
21913
22003
|
user-select: none;
|
|
21914
22004
|
z-index: 0;
|
|
21915
22005
|
`;
|
|
21916
|
-
var SwitchInput = (size) =>
|
|
22006
|
+
var SwitchInput = (size) => import_react195.css`
|
|
21917
22007
|
appearance: none;
|
|
21918
22008
|
border-radius: var(--rounded-full);
|
|
21919
22009
|
background-color: var(--white);
|
|
@@ -21964,18 +22054,18 @@ var SwitchInput = (size) => import_react194.css`
|
|
|
21964
22054
|
cursor: not-allowed;
|
|
21965
22055
|
}
|
|
21966
22056
|
`;
|
|
21967
|
-
var SwitchInputCheckedDirectionLeft =
|
|
22057
|
+
var SwitchInputCheckedDirectionLeft = import_react195.css`
|
|
21968
22058
|
&:checked {
|
|
21969
22059
|
transform: translateX(var(--spacing-base));
|
|
21970
22060
|
}
|
|
21971
22061
|
`;
|
|
21972
|
-
var SwitchInputCheckedDirectionRight =
|
|
22062
|
+
var SwitchInputCheckedDirectionRight = import_react195.css`
|
|
21973
22063
|
transform: translateX(-var(--spacing-base));
|
|
21974
22064
|
&:checked {
|
|
21975
22065
|
transform: translateX(0);
|
|
21976
22066
|
}
|
|
21977
22067
|
`;
|
|
21978
|
-
var SwitchInputDisabled =
|
|
22068
|
+
var SwitchInputDisabled = import_react195.css`
|
|
21979
22069
|
opacity: var(--opacity-50);
|
|
21980
22070
|
cursor: not-allowed;
|
|
21981
22071
|
|
|
@@ -21983,19 +22073,19 @@ var SwitchInputDisabled = import_react194.css`
|
|
|
21983
22073
|
cursor: not-allowed;
|
|
21984
22074
|
}
|
|
21985
22075
|
`;
|
|
21986
|
-
var SwitchInputLabelAlignmentLeft = (size) =>
|
|
22076
|
+
var SwitchInputLabelAlignmentLeft = (size) => import_react195.css`
|
|
21987
22077
|
padding-inline-start: ${size === "sm" ? "var(--spacing-xl)" : "var(--spacing-2xl)"};
|
|
21988
22078
|
&:before {
|
|
21989
22079
|
left: 0;
|
|
21990
22080
|
}
|
|
21991
22081
|
`;
|
|
21992
|
-
var SwitchInputLabelAlignmentRight = (size) =>
|
|
22082
|
+
var SwitchInputLabelAlignmentRight = (size) => import_react195.css`
|
|
21993
22083
|
padding-inline-end: ${size === "sm" ? "var(--spacing-xl)" : "var(--spacing-2xl)"};
|
|
21994
22084
|
&:before {
|
|
21995
22085
|
right: 0;
|
|
21996
22086
|
}
|
|
21997
22087
|
`;
|
|
21998
|
-
var SwitchInputLabel = (size) =>
|
|
22088
|
+
var SwitchInputLabel = (size) => import_react195.css`
|
|
21999
22089
|
align-items: center;
|
|
22000
22090
|
color: var(--typography-base);
|
|
22001
22091
|
display: inline-flex;
|
|
@@ -22016,26 +22106,26 @@ var SwitchInputLabel = (size) => import_react194.css`
|
|
|
22016
22106
|
top: 0;
|
|
22017
22107
|
}
|
|
22018
22108
|
`;
|
|
22019
|
-
var SwitchTextAlignmentLeft = (size) =>
|
|
22109
|
+
var SwitchTextAlignmentLeft = (size) => import_react195.css`
|
|
22020
22110
|
padding-inline-start: ${size === "sm" ? "var(--spacing-xl)" : "var(--spacing-2xl)"};
|
|
22021
22111
|
`;
|
|
22022
|
-
var SwitchTextAlignmentRight = (size) =>
|
|
22112
|
+
var SwitchTextAlignmentRight = (size) => import_react195.css`
|
|
22023
22113
|
padding-inline-end: ${size === "sm" ? "var(--spacing-xl)" : "var(--spacing-2xl)"};
|
|
22024
22114
|
`;
|
|
22025
|
-
var SwitchText =
|
|
22115
|
+
var SwitchText = import_react195.css`
|
|
22026
22116
|
color: var(--gray-500);
|
|
22027
22117
|
font-size: var(--fs-sm);
|
|
22028
22118
|
`;
|
|
22029
|
-
var SwitchInputContainerAlignmentLeft =
|
|
22119
|
+
var SwitchInputContainerAlignmentLeft = import_react195.css`
|
|
22030
22120
|
flex-direction: row;
|
|
22031
22121
|
`;
|
|
22032
|
-
var SwitchInputContainerAlignmentRight =
|
|
22122
|
+
var SwitchInputContainerAlignmentRight = import_react195.css`
|
|
22033
22123
|
flex-direction: row-reverse;
|
|
22034
22124
|
`;
|
|
22035
22125
|
|
|
22036
22126
|
// src/components/Switch/Switch.tsx
|
|
22037
22127
|
var import_jsx_runtime158 = require("@emotion/react/jsx-runtime");
|
|
22038
|
-
var Switch = (0,
|
|
22128
|
+
var Switch = (0, import_react196.forwardRef)(
|
|
22039
22129
|
({
|
|
22040
22130
|
label: label2,
|
|
22041
22131
|
infoText,
|
|
@@ -22046,7 +22136,7 @@ var Switch = (0, import_react195.forwardRef)(
|
|
|
22046
22136
|
...inputProps
|
|
22047
22137
|
}, ref) => {
|
|
22048
22138
|
let additionalText = infoText;
|
|
22049
|
-
const { SwitchInputContainerAlignmentStyles, SwitchInputCheckedDirection, SwitchInputLabelAlignment } = (0,
|
|
22139
|
+
const { SwitchInputContainerAlignmentStyles, SwitchInputCheckedDirection, SwitchInputLabelAlignment } = (0, import_react196.useMemo)(() => {
|
|
22050
22140
|
if (alignment === "left") {
|
|
22051
22141
|
return {
|
|
22052
22142
|
SwitchInputContainerAlignmentStyles: SwitchInputContainerAlignmentLeft,
|
|
@@ -22107,8 +22197,8 @@ init_emotion_jsx_shim();
|
|
|
22107
22197
|
|
|
22108
22198
|
// src/components/Table/Table.styles.ts
|
|
22109
22199
|
init_emotion_jsx_shim();
|
|
22110
|
-
var
|
|
22111
|
-
var table = ({ cellPadding = "var(--spacing-sm)" }) =>
|
|
22200
|
+
var import_react197 = require("@emotion/react");
|
|
22201
|
+
var table = ({ cellPadding = "var(--spacing-sm)" }) => import_react197.css`
|
|
22112
22202
|
border-bottom: 1px solid var(--gray-400);
|
|
22113
22203
|
border-collapse: collapse;
|
|
22114
22204
|
min-width: 100%;
|
|
@@ -22128,21 +22218,21 @@ var table = ({ cellPadding = "var(--spacing-sm)" }) => import_react196.css`
|
|
|
22128
22218
|
background-color: var(--gray-50);
|
|
22129
22219
|
}
|
|
22130
22220
|
`;
|
|
22131
|
-
var tableHead =
|
|
22221
|
+
var tableHead = import_react197.css`
|
|
22132
22222
|
color: var(--typography-base);
|
|
22133
22223
|
text-align: left;
|
|
22134
22224
|
`;
|
|
22135
|
-
var tableRow =
|
|
22225
|
+
var tableRow = import_react197.css`
|
|
22136
22226
|
border-bottom: 1px solid var(--gray-200);
|
|
22137
22227
|
font-size: var(--fs-sm);
|
|
22138
22228
|
`;
|
|
22139
|
-
var tableCellHead =
|
|
22229
|
+
var tableCellHead = import_react197.css`
|
|
22140
22230
|
font-size: var(--fs-sm);
|
|
22141
22231
|
font-weight: var(--fw-regular);
|
|
22142
22232
|
line-height: 1.2;
|
|
22143
22233
|
}
|
|
22144
22234
|
`;
|
|
22145
|
-
var responsiveTableContainer =
|
|
22235
|
+
var responsiveTableContainer = import_react197.css`
|
|
22146
22236
|
max-width: calc(100vw - var(--spacing-md) * 2);
|
|
22147
22237
|
overflow-x: auto;
|
|
22148
22238
|
${scrollbarStyles}
|
|
@@ -22168,39 +22258,39 @@ var ResponsiveTableContainer = ({ children }) => {
|
|
|
22168
22258
|
|
|
22169
22259
|
// src/components/Table/Table.tsx
|
|
22170
22260
|
init_emotion_jsx_shim();
|
|
22171
|
-
var
|
|
22261
|
+
var React26 = __toESM(require("react"));
|
|
22172
22262
|
var import_jsx_runtime160 = require("@emotion/react/jsx-runtime");
|
|
22173
|
-
var Table =
|
|
22263
|
+
var Table = React26.forwardRef(
|
|
22174
22264
|
({ children, cellPadding, ...otherProps }, ref) => {
|
|
22175
22265
|
return /* @__PURE__ */ (0, import_jsx_runtime160.jsx)("table", { ref, css: table({ cellPadding }), ...otherProps, children });
|
|
22176
22266
|
}
|
|
22177
22267
|
);
|
|
22178
|
-
var TableHead =
|
|
22268
|
+
var TableHead = React26.forwardRef(
|
|
22179
22269
|
({ children, ...otherProps }, ref) => {
|
|
22180
22270
|
return /* @__PURE__ */ (0, import_jsx_runtime160.jsx)("thead", { ref, css: tableHead, ...otherProps, children });
|
|
22181
22271
|
}
|
|
22182
22272
|
);
|
|
22183
|
-
var TableBody =
|
|
22273
|
+
var TableBody = React26.forwardRef(
|
|
22184
22274
|
({ children, ...otherProps }, ref) => {
|
|
22185
22275
|
return /* @__PURE__ */ (0, import_jsx_runtime160.jsx)("tbody", { ref, ...otherProps, children });
|
|
22186
22276
|
}
|
|
22187
22277
|
);
|
|
22188
|
-
var TableFoot =
|
|
22278
|
+
var TableFoot = React26.forwardRef(
|
|
22189
22279
|
({ children, ...otherProps }, ref) => {
|
|
22190
22280
|
return /* @__PURE__ */ (0, import_jsx_runtime160.jsx)("tfoot", { ref, ...otherProps, children });
|
|
22191
22281
|
}
|
|
22192
22282
|
);
|
|
22193
|
-
var TableRow =
|
|
22283
|
+
var TableRow = React26.forwardRef(
|
|
22194
22284
|
({ children, ...otherProps }, ref) => {
|
|
22195
22285
|
return /* @__PURE__ */ (0, import_jsx_runtime160.jsx)("tr", { ref, css: tableRow, ...otherProps, children });
|
|
22196
22286
|
}
|
|
22197
22287
|
);
|
|
22198
|
-
var TableCellHead =
|
|
22288
|
+
var TableCellHead = React26.forwardRef(
|
|
22199
22289
|
({ children, ...otherProps }, ref) => {
|
|
22200
22290
|
return /* @__PURE__ */ (0, import_jsx_runtime160.jsx)("th", { ref, css: tableCellHead, ...otherProps, children });
|
|
22201
22291
|
}
|
|
22202
22292
|
);
|
|
22203
|
-
var TableCellData =
|
|
22293
|
+
var TableCellData = React26.forwardRef(
|
|
22204
22294
|
({ children, ...otherProps }, ref) => {
|
|
22205
22295
|
return /* @__PURE__ */ (0, import_jsx_runtime160.jsx)("td", { ref, ...otherProps, children });
|
|
22206
22296
|
}
|
|
@@ -22209,12 +22299,12 @@ var TableCellData = React25.forwardRef(
|
|
|
22209
22299
|
// src/components/Tabs/Tabs.tsx
|
|
22210
22300
|
init_emotion_jsx_shim();
|
|
22211
22301
|
var import_tabs = require("@base-ui/react/tabs");
|
|
22212
|
-
var
|
|
22302
|
+
var import_react199 = require("react");
|
|
22213
22303
|
|
|
22214
22304
|
// src/components/Tabs/Tabs.styles.ts
|
|
22215
22305
|
init_emotion_jsx_shim();
|
|
22216
|
-
var
|
|
22217
|
-
var tabButtonStyles =
|
|
22306
|
+
var import_react198 = require("@emotion/react");
|
|
22307
|
+
var tabButtonStyles = import_react198.css`
|
|
22218
22308
|
align-items: center;
|
|
22219
22309
|
border: 0;
|
|
22220
22310
|
height: 2.5rem;
|
|
@@ -22231,7 +22321,7 @@ var tabButtonStyles = import_react197.css`
|
|
|
22231
22321
|
box-shadow: inset 0 -2px 0 var(--brand-secondary-3);
|
|
22232
22322
|
}
|
|
22233
22323
|
`;
|
|
22234
|
-
var tabButtonGroupStyles =
|
|
22324
|
+
var tabButtonGroupStyles = import_react198.css`
|
|
22235
22325
|
display: flex;
|
|
22236
22326
|
gap: var(--spacing-base);
|
|
22237
22327
|
border-bottom: 1px solid var(--gray-300);
|
|
@@ -22239,16 +22329,16 @@ var tabButtonGroupStyles = import_react197.css`
|
|
|
22239
22329
|
|
|
22240
22330
|
// src/components/Tabs/Tabs.tsx
|
|
22241
22331
|
var import_jsx_runtime161 = require("@emotion/react/jsx-runtime");
|
|
22242
|
-
var TabsContext = (0,
|
|
22332
|
+
var TabsContext = (0, import_react199.createContext)(null);
|
|
22243
22333
|
var useCurrentTab = () => {
|
|
22244
|
-
const context = (0,
|
|
22334
|
+
const context = (0, import_react199.useContext)(TabsContext);
|
|
22245
22335
|
if (!context) {
|
|
22246
22336
|
throw new Error("This component can only be used inside <Tabs>");
|
|
22247
22337
|
}
|
|
22248
22338
|
return context;
|
|
22249
22339
|
};
|
|
22250
|
-
var ManualContext = (0,
|
|
22251
|
-
var TabRegistrationContext = (0,
|
|
22340
|
+
var ManualContext = (0, import_react199.createContext)(false);
|
|
22341
|
+
var TabRegistrationContext = (0, import_react199.createContext)(null);
|
|
22252
22342
|
var Tabs = ({
|
|
22253
22343
|
children,
|
|
22254
22344
|
onSelectedIdChange,
|
|
@@ -22259,14 +22349,14 @@ var Tabs = ({
|
|
|
22259
22349
|
className,
|
|
22260
22350
|
style
|
|
22261
22351
|
}) => {
|
|
22262
|
-
const selected = (0,
|
|
22352
|
+
const selected = (0, import_react199.useMemo)(() => {
|
|
22263
22353
|
if (selectedId) return selectedId;
|
|
22264
22354
|
return useHashForState && typeof window !== "undefined" && window.location.hash ? window.location.hash.substring(1) : void 0;
|
|
22265
22355
|
}, [selectedId, useHashForState]);
|
|
22266
22356
|
const isControlled = selected !== void 0;
|
|
22267
|
-
const [uncontrolledValue, setUncontrolledValue] = (0,
|
|
22268
|
-
const firstTabRegistered = (0,
|
|
22269
|
-
const registerTab = (0,
|
|
22357
|
+
const [uncontrolledValue, setUncontrolledValue] = (0, import_react199.useState)(void 0);
|
|
22358
|
+
const firstTabRegistered = (0, import_react199.useRef)(false);
|
|
22359
|
+
const registerTab = (0, import_react199.useCallback)(
|
|
22270
22360
|
(value) => {
|
|
22271
22361
|
if (!firstTabRegistered.current) {
|
|
22272
22362
|
firstTabRegistered.current = true;
|
|
@@ -22278,7 +22368,7 @@ var Tabs = ({
|
|
|
22278
22368
|
[isControlled]
|
|
22279
22369
|
);
|
|
22280
22370
|
const currentValue = isControlled ? selected : uncontrolledValue;
|
|
22281
|
-
const onTabSelect = (0,
|
|
22371
|
+
const onTabSelect = (0, import_react199.useCallback)(
|
|
22282
22372
|
(value) => {
|
|
22283
22373
|
const selectedValueWithoutNull = value != null ? value : void 0;
|
|
22284
22374
|
if (!isControlled) {
|
|
@@ -22292,7 +22382,7 @@ var Tabs = ({
|
|
|
22292
22382
|
},
|
|
22293
22383
|
[isControlled, onSelectedIdChange, useHashForState]
|
|
22294
22384
|
);
|
|
22295
|
-
const tabsContextValue = (0,
|
|
22385
|
+
const tabsContextValue = (0, import_react199.useMemo)(
|
|
22296
22386
|
() => ({
|
|
22297
22387
|
value: currentValue,
|
|
22298
22388
|
setValue: (v) => onTabSelect(v)
|
|
@@ -22312,7 +22402,7 @@ var Tabs = ({
|
|
|
22312
22402
|
) }) }) });
|
|
22313
22403
|
};
|
|
22314
22404
|
var TabButtonGroup = ({ children, ...props }) => {
|
|
22315
|
-
const manual = (0,
|
|
22405
|
+
const manual = (0, import_react199.useContext)(ManualContext);
|
|
22316
22406
|
return /* @__PURE__ */ (0, import_jsx_runtime161.jsx)(import_tabs.Tabs.List, { activateOnFocus: !manual, ...props, css: tabButtonGroupStyles, children });
|
|
22317
22407
|
};
|
|
22318
22408
|
var TabButton = ({
|
|
@@ -22320,8 +22410,8 @@ var TabButton = ({
|
|
|
22320
22410
|
id,
|
|
22321
22411
|
...props
|
|
22322
22412
|
}) => {
|
|
22323
|
-
const registration = (0,
|
|
22324
|
-
(0,
|
|
22413
|
+
const registration = (0, import_react199.useContext)(TabRegistrationContext);
|
|
22414
|
+
(0, import_react199.useEffect)(() => {
|
|
22325
22415
|
registration == null ? void 0 : registration.registerTab(id);
|
|
22326
22416
|
}, []);
|
|
22327
22417
|
return /* @__PURE__ */ (0, import_jsx_runtime161.jsx)(import_tabs.Tabs.Tab, { type: "button", value: id, "data-tab-id": id, ...props, css: tabButtonStyles, children });
|
|
@@ -22343,8 +22433,8 @@ init_emotion_jsx_shim();
|
|
|
22343
22433
|
|
|
22344
22434
|
// src/components/Validation/StatusBullet.styles.ts
|
|
22345
22435
|
init_emotion_jsx_shim();
|
|
22346
|
-
var
|
|
22347
|
-
var StatusBulletContainer =
|
|
22436
|
+
var import_react200 = require("@emotion/react");
|
|
22437
|
+
var StatusBulletContainer = import_react200.css`
|
|
22348
22438
|
align-items: center;
|
|
22349
22439
|
align-self: center;
|
|
22350
22440
|
color: var(--gray-500);
|
|
@@ -22360,33 +22450,33 @@ var StatusBulletContainer = import_react199.css`
|
|
|
22360
22450
|
display: block;
|
|
22361
22451
|
}
|
|
22362
22452
|
`;
|
|
22363
|
-
var StatusBulletBase =
|
|
22453
|
+
var StatusBulletBase = import_react200.css`
|
|
22364
22454
|
font-size: var(--fs-sm);
|
|
22365
22455
|
&:before {
|
|
22366
22456
|
width: var(--fs-xs);
|
|
22367
22457
|
height: var(--fs-xs);
|
|
22368
22458
|
}
|
|
22369
22459
|
`;
|
|
22370
|
-
var StatusBulletSmall =
|
|
22460
|
+
var StatusBulletSmall = import_react200.css`
|
|
22371
22461
|
font-size: var(--fs-xs);
|
|
22372
22462
|
&:before {
|
|
22373
22463
|
width: var(--fs-xxs);
|
|
22374
22464
|
height: var(--fs-xxs);
|
|
22375
22465
|
}
|
|
22376
22466
|
`;
|
|
22377
|
-
var StatusDraft =
|
|
22467
|
+
var StatusDraft = import_react200.css`
|
|
22378
22468
|
&:before {
|
|
22379
22469
|
background: var(--white);
|
|
22380
22470
|
box-shadow: inset 0 0 0 0.125rem var(--accent-dark);
|
|
22381
22471
|
}
|
|
22382
22472
|
`;
|
|
22383
|
-
var StatusModified =
|
|
22473
|
+
var StatusModified = import_react200.css`
|
|
22384
22474
|
&:before {
|
|
22385
22475
|
background: linear-gradient(to right, var(--white) 50%, var(--accent-dark) 50% 100%);
|
|
22386
22476
|
box-shadow: inset 0 0 0 0.125rem var(--accent-dark);
|
|
22387
22477
|
}
|
|
22388
22478
|
`;
|
|
22389
|
-
var StatusError =
|
|
22479
|
+
var StatusError = import_react200.css`
|
|
22390
22480
|
color: var(--error);
|
|
22391
22481
|
&:before {
|
|
22392
22482
|
/* TODO: replace this with an svg icon */
|
|
@@ -22399,22 +22489,22 @@ var StatusError = import_react199.css`
|
|
|
22399
22489
|
);
|
|
22400
22490
|
}
|
|
22401
22491
|
`;
|
|
22402
|
-
var StatusPublished =
|
|
22492
|
+
var StatusPublished = import_react200.css`
|
|
22403
22493
|
&:before {
|
|
22404
22494
|
background: var(--accent-dark);
|
|
22405
22495
|
}
|
|
22406
22496
|
`;
|
|
22407
|
-
var StatusOrphan =
|
|
22497
|
+
var StatusOrphan = import_react200.css`
|
|
22408
22498
|
&:before {
|
|
22409
22499
|
background: var(--brand-secondary-5);
|
|
22410
22500
|
}
|
|
22411
22501
|
`;
|
|
22412
|
-
var StatusUnknown =
|
|
22502
|
+
var StatusUnknown = import_react200.css`
|
|
22413
22503
|
&:before {
|
|
22414
22504
|
background: var(--gray-800);
|
|
22415
22505
|
}
|
|
22416
22506
|
`;
|
|
22417
|
-
var StatusDeleted =
|
|
22507
|
+
var StatusDeleted = import_react200.css`
|
|
22418
22508
|
&:before {
|
|
22419
22509
|
background: var(--error);
|
|
22420
22510
|
}
|