@uniformdev/design-system 19.176.1-alpha.9 → 19.177.1
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/esm/index.js +521 -407
- package/dist/index.d.mts +21 -2
- package/dist/index.d.ts +21 -2
- package/dist/index.js +591 -469
- package/package.json +4 -4
package/dist/esm/index.js
CHANGED
|
@@ -15888,7 +15888,6 @@ var DragHandleStyles = css56`
|
|
|
15888
15888
|
background: transparent;
|
|
15889
15889
|
border: 0;
|
|
15890
15890
|
position: relative;
|
|
15891
|
-
height: 3.125rem;
|
|
15892
15891
|
width: 1rem;
|
|
15893
15892
|
cursor: grab;
|
|
15894
15893
|
|
|
@@ -15914,13 +15913,13 @@ var DragHandleDisabled = css56`
|
|
|
15914
15913
|
// src/components/DragHandle/DragHandle.tsx
|
|
15915
15914
|
import { jsx as jsx69 } from "@emotion/react/jsx-runtime";
|
|
15916
15915
|
var DragHandle = forwardRef14(
|
|
15917
|
-
({ disableDnd, ...props }, ref) => {
|
|
15916
|
+
({ disableDnd, height = "3.125rem", ...props }, ref) => {
|
|
15918
15917
|
return /* @__PURE__ */ jsx69(
|
|
15919
15918
|
"button",
|
|
15920
15919
|
{
|
|
15921
15920
|
type: "button",
|
|
15922
15921
|
ref,
|
|
15923
|
-
css: [DragHandleStyles, disableDnd ? DragHandleDisabled : null],
|
|
15922
|
+
css: [DragHandleStyles, disableDnd ? DragHandleDisabled : null, { height }],
|
|
15924
15923
|
disabled: disableDnd,
|
|
15925
15924
|
...props
|
|
15926
15925
|
}
|
|
@@ -18897,32 +18896,114 @@ var ObjectGridItemIconWithTooltip = ({
|
|
|
18897
18896
|
return /* @__PURE__ */ jsx107(Tooltip, { title: tooltipTitle, placement, children: /* @__PURE__ */ jsx107("span", { children: /* @__PURE__ */ jsx107(Icon, { icon, iconColor, size: "1rem" }) }) });
|
|
18898
18897
|
};
|
|
18899
18898
|
|
|
18900
|
-
// src/components/Objects/styles/
|
|
18899
|
+
// src/components/Objects/styles/ObjectGridItemLoadingSkeleton.styles.ts
|
|
18901
18900
|
import { css as css84 } from "@emotion/react";
|
|
18902
|
-
var
|
|
18903
|
-
|
|
18901
|
+
var ObjectGridItemLoadingSkeleton = css84`
|
|
18902
|
+
border-radius: var(--rounded-base);
|
|
18904
18903
|
display: flex;
|
|
18904
|
+
flex-direction: column;
|
|
18905
18905
|
gap: var(--spacing-sm);
|
|
18906
|
+
transition: border-color var(--duration-fast) var(--timing-ease-out);
|
|
18907
|
+
`;
|
|
18908
|
+
var ObjectGridItemLoadingText = (textLength) => css84`
|
|
18909
|
+
animation: ${fadeIn} 1s linear infinite alternate;
|
|
18910
|
+
border-radius: var(--rounded-base);
|
|
18911
|
+
background: var(--gray-300);
|
|
18912
|
+
display: block;
|
|
18913
|
+
width: clamp(24px, 100%, ${textLength});
|
|
18914
|
+
height: var(--fs-base);
|
|
18915
|
+
`;
|
|
18916
|
+
var ObjectGridItemLoadingImageWrapper = css84`
|
|
18917
|
+
aspect-ratio: 16/9;
|
|
18918
|
+
max-width: 100%;
|
|
18919
|
+
max-height: 100%;
|
|
18920
|
+
height: auto;
|
|
18921
|
+
padding: var(--spacing-sm);
|
|
18922
|
+
overflow: hidden;
|
|
18923
|
+
`;
|
|
18924
|
+
var ObjectGridItemLoadingImage = css84`
|
|
18925
|
+
animation: ${fadeIn} 1s linear infinite alternate;
|
|
18926
|
+
border-radius: var(--rounded-base);
|
|
18927
|
+
background: var(--gray-300);
|
|
18928
|
+
display: block;
|
|
18929
|
+
width: 100%;
|
|
18930
|
+
height: auto;
|
|
18931
|
+
aspect-ratio: 1;
|
|
18932
|
+
`;
|
|
18933
|
+
var ObjectGridItemLoadingContentWrapper = css84`
|
|
18934
|
+
padding: 0 var(--spacing-sm) var(--spacing-sm);
|
|
18935
|
+
min-height: 52px;
|
|
18936
|
+
`;
|
|
18937
|
+
var ObjectGridItemLoadingContentContainer = css84`
|
|
18906
18938
|
flex-grow: 1;
|
|
18939
|
+
gap: var(--spacing-xs);
|
|
18940
|
+
`;
|
|
18941
|
+
|
|
18942
|
+
// src/components/Objects/ObjectGridItemLoadingSkeleton.tsx
|
|
18943
|
+
import { jsx as jsx108, jsxs as jsxs72 } from "@emotion/react/jsx-runtime";
|
|
18944
|
+
var ObjectGridItemLoadingSkeleton2 = () => {
|
|
18945
|
+
return /* @__PURE__ */ jsxs72("div", { css: ObjectGridItemLoadingSkeleton, children: [
|
|
18946
|
+
/* @__PURE__ */ jsx108("div", { css: ObjectGridItemLoadingImageWrapper, "data-testid": "object-grid-item-cover-skeleton", children: /* @__PURE__ */ jsx108("span", { css: ObjectGridItemLoadingImage, role: "presentation" }) }),
|
|
18947
|
+
/* @__PURE__ */ jsxs72(
|
|
18948
|
+
HorizontalRhythm,
|
|
18949
|
+
{
|
|
18950
|
+
css: ObjectGridItemLoadingContentWrapper,
|
|
18951
|
+
align: "flex-start",
|
|
18952
|
+
justify: "space-between",
|
|
18953
|
+
gap: "sm",
|
|
18954
|
+
children: [
|
|
18955
|
+
/* @__PURE__ */ jsxs72(VerticalRhythm, { css: ObjectGridItemLoadingContentContainer, gap: "0", children: [
|
|
18956
|
+
/* @__PURE__ */ jsx108(HorizontalRhythm, { gap: "xs", align: "center", children: /* @__PURE__ */ jsx108("span", { role: "presentation", css: ObjectGridItemLoadingText("18ch") }) }),
|
|
18957
|
+
/* @__PURE__ */ jsx108("span", { role: "presentation", css: ObjectGridItemLoadingText("12ch") })
|
|
18958
|
+
] }),
|
|
18959
|
+
/* @__PURE__ */ jsxs72(HorizontalRhythm, { css: ObjectGridItemLoadingContentContainer, gap: "xs", justify: "flex-end", children: [
|
|
18960
|
+
/* @__PURE__ */ jsx108("span", { role: "presentation", css: ObjectGridItemLoadingText("6ch") }),
|
|
18961
|
+
/* @__PURE__ */ jsx108("span", { role: "presentation", css: ObjectGridItemLoadingText("24px") })
|
|
18962
|
+
] })
|
|
18963
|
+
]
|
|
18964
|
+
}
|
|
18965
|
+
)
|
|
18966
|
+
] });
|
|
18967
|
+
};
|
|
18968
|
+
|
|
18969
|
+
// src/components/Objects/styles/ObjectListItem.styles.ts
|
|
18970
|
+
import { css as css85 } from "@emotion/react";
|
|
18971
|
+
var ObjectListItem = css85`
|
|
18972
|
+
background: var(--white);
|
|
18973
|
+
display: grid;
|
|
18974
|
+
gap: var(--spacing-sm);
|
|
18907
18975
|
padding: var(--spacing-sm);
|
|
18908
18976
|
transition: background-color var(--duration-fast) var(--timing-ease-out);
|
|
18977
|
+
container-type: inline-size;
|
|
18978
|
+
grid-template-columns: auto 1fr auto;
|
|
18909
18979
|
|
|
18910
18980
|
&:hover {
|
|
18911
18981
|
background: var(--gray-50);
|
|
18912
18982
|
}
|
|
18913
18983
|
`;
|
|
18914
|
-
var ObjectListItemSingle =
|
|
18984
|
+
var ObjectListItemSingle = css85`
|
|
18915
18985
|
align-items: center;
|
|
18916
18986
|
`;
|
|
18917
|
-
var ObjectListItemContentWrapper =
|
|
18987
|
+
var ObjectListItemContentWrapper = css85`
|
|
18988
|
+
display: grid;
|
|
18989
|
+
gap: var(--spacing-sm);
|
|
18990
|
+
justify-content: space-between;
|
|
18918
18991
|
flex-grow: 1;
|
|
18992
|
+
|
|
18993
|
+
${cq("34rem")} {
|
|
18994
|
+
grid-template-columns: auto 1fr auto;
|
|
18995
|
+
}
|
|
18996
|
+
`;
|
|
18997
|
+
var ObjectListItemRightSlot = css85`
|
|
18998
|
+
display: flex;
|
|
18999
|
+
gap: var(--spacing-sm);
|
|
18919
19000
|
`;
|
|
18920
|
-
var ObjectListItemContainer =
|
|
19001
|
+
var ObjectListItemContainer = css85`
|
|
18921
19002
|
> [role='listitem'] {
|
|
18922
19003
|
border-top: 1px solid var(--gray-200);
|
|
18923
19004
|
}
|
|
18924
19005
|
`;
|
|
18925
|
-
var ObjectListItemCover =
|
|
19006
|
+
var ObjectListItemCover = css85`
|
|
18926
19007
|
align-items: center;
|
|
18927
19008
|
background: var(--gray-100);
|
|
18928
19009
|
color: var(--gray-500);
|
|
@@ -18932,12 +19013,12 @@ var ObjectListItemCover = css84`
|
|
|
18932
19013
|
text-align: center;
|
|
18933
19014
|
font-size: var(--fs-xs);
|
|
18934
19015
|
`;
|
|
18935
|
-
var ObjectListItemImage =
|
|
19016
|
+
var ObjectListItemImage = css85`
|
|
18936
19017
|
object-fit: cover;
|
|
18937
19018
|
width: 100%;
|
|
18938
19019
|
height: 100%;
|
|
18939
19020
|
`;
|
|
18940
|
-
var ObjectListItemLoading =
|
|
19021
|
+
var ObjectListItemLoading = css85`
|
|
18941
19022
|
animation: ${skeletonLoading} 1s linear infinite alternate;
|
|
18942
19023
|
background: var(--white);
|
|
18943
19024
|
display: flex;
|
|
@@ -18945,15 +19026,18 @@ var ObjectListItemLoading = css84`
|
|
|
18945
19026
|
flex-grow: 1;
|
|
18946
19027
|
padding: var(--spacing-sm);
|
|
18947
19028
|
`;
|
|
18948
|
-
var
|
|
19029
|
+
var ObjectListItemLoadingInner = css85`
|
|
19030
|
+
flex-grow: 1;
|
|
19031
|
+
`;
|
|
19032
|
+
var ObjectListItemLoadingText = (textLength) => css85`
|
|
18949
19033
|
animation: ${fadeIn} 1s linear infinite alternate;
|
|
18950
19034
|
border-radius: var(--rounded-base);
|
|
18951
19035
|
background: var(--gray-300);
|
|
18952
19036
|
display: block;
|
|
18953
|
-
width: ${textLength};
|
|
19037
|
+
width: clamp(10ch, 100%, ${textLength});
|
|
18954
19038
|
height: var(--fs-base);
|
|
18955
19039
|
`;
|
|
18956
|
-
var ObjectListItemLoadingImage =
|
|
19040
|
+
var ObjectListItemLoadingImage = css85`
|
|
18957
19041
|
animation: ${fadeIn} 1s linear infinite alternate;
|
|
18958
19042
|
border-radius: var(--rounded-base);
|
|
18959
19043
|
background: var(--gray-300);
|
|
@@ -18961,30 +19045,42 @@ var ObjectListItemLoadingImage = css84`
|
|
|
18961
19045
|
width: 80px;
|
|
18962
19046
|
height: 55px;
|
|
18963
19047
|
`;
|
|
19048
|
+
var ObjectListItemHeadingWrapper = css85`
|
|
19049
|
+
display: flex;
|
|
19050
|
+
gap: var(--spacing-xs);
|
|
19051
|
+
`;
|
|
18964
19052
|
|
|
18965
19053
|
// src/components/Objects/ObjectItemLoadingSkeleton.tsx
|
|
18966
|
-
import { jsx as
|
|
18967
|
-
var ObjectItemLoadingSkeleton = ({
|
|
18968
|
-
|
|
18969
|
-
|
|
18970
|
-
|
|
18971
|
-
|
|
18972
|
-
|
|
18973
|
-
|
|
18974
|
-
|
|
18975
|
-
|
|
18976
|
-
|
|
18977
|
-
|
|
18978
|
-
|
|
18979
|
-
|
|
18980
|
-
|
|
19054
|
+
import { jsx as jsx109, jsxs as jsxs73 } from "@emotion/react/jsx-runtime";
|
|
19055
|
+
var ObjectItemLoadingSkeleton = ({
|
|
19056
|
+
showCover,
|
|
19057
|
+
renderAs = "single"
|
|
19058
|
+
}) => {
|
|
19059
|
+
return /* @__PURE__ */ jsxs73(
|
|
19060
|
+
"div",
|
|
19061
|
+
{
|
|
19062
|
+
css: [
|
|
19063
|
+
ObjectListItemLoading,
|
|
19064
|
+
{
|
|
19065
|
+
alignItems: renderAs === "multi" ? "flex-start" : "center"
|
|
19066
|
+
}
|
|
19067
|
+
],
|
|
19068
|
+
children: [
|
|
19069
|
+
showCover ? /* @__PURE__ */ jsx109("div", { "data-testid": "object-list-item-cover-skeleton", children: /* @__PURE__ */ jsx109("span", { role: "presentation", css: ObjectListItemLoadingImage }) }) : null,
|
|
19070
|
+
/* @__PURE__ */ jsx109(VerticalRhythm, { css: ObjectListItemLoadingInner, justify: "space-between", gap: "sm", children: /* @__PURE__ */ jsxs73(VerticalRhythm, { gap: "xs", children: [
|
|
19071
|
+
/* @__PURE__ */ jsx109(HorizontalRhythm, { gap: "xs", align: "center", children: /* @__PURE__ */ jsx109("span", { role: "presentation", css: ObjectListItemLoadingText("30ch") }) }),
|
|
19072
|
+
/* @__PURE__ */ jsx109("span", { role: "presentation", css: ObjectListItemLoadingText("20ch") })
|
|
19073
|
+
] }) })
|
|
19074
|
+
]
|
|
19075
|
+
}
|
|
19076
|
+
);
|
|
18981
19077
|
};
|
|
18982
19078
|
|
|
18983
19079
|
// src/components/Objects/ObjectListItem.tsx
|
|
18984
|
-
import { jsx as
|
|
19080
|
+
import { jsx as jsx110, jsxs as jsxs74 } from "@emotion/react/jsx-runtime";
|
|
18985
19081
|
var ObjectListItem2 = (props) => {
|
|
18986
|
-
const { renderAs, isSelected, cover, header: header2, rightSlot, menuItems, ...divProps } = props;
|
|
18987
|
-
return /* @__PURE__ */
|
|
19082
|
+
const { renderAs, isSelected, cover, header: header2, rightSlot, menuItems, dragHandle, ...divProps } = props;
|
|
19083
|
+
return /* @__PURE__ */ jsxs74(
|
|
18988
19084
|
"div",
|
|
18989
19085
|
{
|
|
18990
19086
|
role: "listitem",
|
|
@@ -18993,46 +19089,45 @@ var ObjectListItem2 = (props) => {
|
|
|
18993
19089
|
"aria-selected": isSelected,
|
|
18994
19090
|
...divProps,
|
|
18995
19091
|
children: [
|
|
18996
|
-
|
|
18997
|
-
/* @__PURE__ */
|
|
18998
|
-
/* @__PURE__ */
|
|
18999
|
-
|
|
19092
|
+
/* @__PURE__ */ jsx110(HorizontalRhythm, { gap: "sm", align: "center", children: dragHandle }),
|
|
19093
|
+
/* @__PURE__ */ jsxs74("div", { css: ObjectListItemContentWrapper, children: [
|
|
19094
|
+
/* @__PURE__ */ jsx110(HorizontalRhythm, { gap: "sm", align: "center", children: cover }),
|
|
19095
|
+
/* @__PURE__ */ jsxs74(VerticalRhythm, { gap: "0", children: [
|
|
19096
|
+
/* @__PURE__ */ jsx110(HorizontalRhythm, { gap: "xs", align: renderAs === "multi" ? "flex-start" : "center", children: header2 }),
|
|
19000
19097
|
renderAs === "multi" ? props.children : null
|
|
19001
19098
|
] }),
|
|
19002
|
-
/* @__PURE__ */
|
|
19003
|
-
|
|
19004
|
-
|
|
19005
|
-
|
|
19006
|
-
|
|
19007
|
-
|
|
19008
|
-
|
|
19009
|
-
|
|
19010
|
-
|
|
19011
|
-
|
|
19012
|
-
] })
|
|
19013
|
-
] })
|
|
19099
|
+
/* @__PURE__ */ jsx110(HorizontalRhythm, { gap: "xs", align: "flex-start", children: rightSlot })
|
|
19100
|
+
] }),
|
|
19101
|
+
menuItems ? /* @__PURE__ */ jsx110(HorizontalRhythm, { gap: "0", align: "flex-start", children: /* @__PURE__ */ jsx110(
|
|
19102
|
+
Menu,
|
|
19103
|
+
{
|
|
19104
|
+
menuTrigger: /* @__PURE__ */ jsx110(MenuThreeDots, { "data-testid": "object-list-item-menu-btn" }),
|
|
19105
|
+
placement: "bottom-end",
|
|
19106
|
+
children: menuItems
|
|
19107
|
+
}
|
|
19108
|
+
) }) : null
|
|
19014
19109
|
]
|
|
19015
19110
|
}
|
|
19016
19111
|
);
|
|
19017
19112
|
};
|
|
19018
19113
|
|
|
19019
19114
|
// src/components/Objects/ObjectListItemContainer.tsx
|
|
19020
|
-
import { jsx as
|
|
19115
|
+
import { jsx as jsx111 } from "@emotion/react/jsx-runtime";
|
|
19021
19116
|
var ObjectListItemContainer2 = ({ children, gap = "0", ...props }) => {
|
|
19022
|
-
return /* @__PURE__ */
|
|
19117
|
+
return /* @__PURE__ */ jsx111(VerticalRhythm, { gap, css: ObjectListItemContainer, role: "list", ...props, children });
|
|
19023
19118
|
};
|
|
19024
19119
|
|
|
19025
19120
|
// src/components/Objects/ObjectListItemCover.tsx
|
|
19026
|
-
import { jsx as
|
|
19121
|
+
import { jsx as jsx112 } from "@emotion/react/jsx-runtime";
|
|
19027
19122
|
var ObjectListItemCover2 = ({
|
|
19028
19123
|
imageUrl,
|
|
19029
19124
|
noImageText = "Image not available",
|
|
19030
19125
|
...props
|
|
19031
19126
|
}) => {
|
|
19032
19127
|
if (!imageUrl) {
|
|
19033
|
-
return /* @__PURE__ */
|
|
19128
|
+
return /* @__PURE__ */ jsx112("div", { css: ObjectListItemCover, role: "presentation", "data-testid": "object-list-item-thumbnail", children: noImageText });
|
|
19034
19129
|
}
|
|
19035
|
-
return /* @__PURE__ */
|
|
19130
|
+
return /* @__PURE__ */ jsx112("div", { css: ObjectListItemCover, children: /* @__PURE__ */ jsx112(
|
|
19036
19131
|
"img",
|
|
19037
19132
|
{
|
|
19038
19133
|
src: imageUrl,
|
|
@@ -19044,18 +19139,36 @@ var ObjectListItemCover2 = ({
|
|
|
19044
19139
|
) });
|
|
19045
19140
|
};
|
|
19046
19141
|
|
|
19142
|
+
// src/components/Objects/styles/ObjectListItemHeading.styles.ts
|
|
19143
|
+
import { css as css86 } from "@emotion/react";
|
|
19144
|
+
var ObjectListItemHeading = css86`
|
|
19145
|
+
display: flex;
|
|
19146
|
+
flex-direction: column;
|
|
19147
|
+
gap: var(--spacing-xs);
|
|
19148
|
+
|
|
19149
|
+
${cq("34rem")} {
|
|
19150
|
+
align-items: center;
|
|
19151
|
+
flex-direction: row;
|
|
19152
|
+
}
|
|
19153
|
+
`;
|
|
19154
|
+
var ObjectListItemHeadingAfterWrapper = css86`
|
|
19155
|
+
line-height: 1.25;
|
|
19156
|
+
`;
|
|
19157
|
+
|
|
19047
19158
|
// src/components/Objects/ObjectListItemHeading.tsx
|
|
19048
|
-
import { jsx as
|
|
19049
|
-
var
|
|
19159
|
+
import { jsx as jsx113, jsxs as jsxs75 } from "@emotion/react/jsx-runtime";
|
|
19160
|
+
var ObjectListItemHeading2 = ({
|
|
19050
19161
|
heading,
|
|
19051
19162
|
beforeHeadingSlot,
|
|
19052
19163
|
afterHeadingSlot,
|
|
19053
19164
|
...props
|
|
19054
19165
|
}) => {
|
|
19055
|
-
return /* @__PURE__ */
|
|
19056
|
-
beforeHeadingSlot,
|
|
19057
|
-
/* @__PURE__ */
|
|
19058
|
-
|
|
19166
|
+
return /* @__PURE__ */ jsxs75("div", { css: ObjectListItemHeading, ...props, children: [
|
|
19167
|
+
beforeHeadingSlot ? /* @__PURE__ */ jsx113(HorizontalRhythm, { gap: "xs", align: "center", children: beforeHeadingSlot }) : null,
|
|
19168
|
+
/* @__PURE__ */ jsxs75(HorizontalRhythm, { css: ObjectListItemHeadingAfterWrapper, gap: "xs", align: "flex-start", children: [
|
|
19169
|
+
/* @__PURE__ */ jsx113("div", { role: "heading", children: heading }),
|
|
19170
|
+
afterHeadingSlot
|
|
19171
|
+
] })
|
|
19059
19172
|
] });
|
|
19060
19173
|
};
|
|
19061
19174
|
|
|
@@ -19063,35 +19176,35 @@ var ObjectListItemHeading = ({
|
|
|
19063
19176
|
import Paginate from "react-paginate";
|
|
19064
19177
|
|
|
19065
19178
|
// src/components/Pagination/Pagniation.styles.ts
|
|
19066
|
-
import { css as
|
|
19067
|
-
var container2 =
|
|
19179
|
+
import { css as css87 } from "@emotion/css";
|
|
19180
|
+
var container2 = css87`
|
|
19068
19181
|
align-items: center;
|
|
19069
19182
|
display: flex;
|
|
19070
19183
|
`;
|
|
19071
|
-
var disabled =
|
|
19184
|
+
var disabled = css87`
|
|
19072
19185
|
opacity: var(--opacity-50);
|
|
19073
19186
|
`;
|
|
19074
|
-
var disabledLink =
|
|
19187
|
+
var disabledLink = css87`
|
|
19075
19188
|
cursor: pointer-default;
|
|
19076
19189
|
`;
|
|
19077
|
-
var pageLink =
|
|
19190
|
+
var pageLink = css87`
|
|
19078
19191
|
display: block;
|
|
19079
19192
|
padding: var(--spacing-sm) var(--spacing-base);
|
|
19080
19193
|
`;
|
|
19081
|
-
var prevNextControls =
|
|
19194
|
+
var prevNextControls = css87`
|
|
19082
19195
|
padding: var(--spacing-sm) var(--spacing-base);
|
|
19083
19196
|
`;
|
|
19084
|
-
var active =
|
|
19197
|
+
var active = css87`
|
|
19085
19198
|
border-radius: var(--rounded-base);
|
|
19086
19199
|
background: var(--gray-200);
|
|
19087
19200
|
`;
|
|
19088
|
-
var page =
|
|
19201
|
+
var page = css87`
|
|
19089
19202
|
margin-left: var(--spacing-xs);
|
|
19090
19203
|
margin-right: var(--spacing-xs);
|
|
19091
19204
|
`;
|
|
19092
19205
|
|
|
19093
19206
|
// src/components/Pagination/Pagination.tsx
|
|
19094
|
-
import { jsx as
|
|
19207
|
+
import { jsx as jsx114 } from "@emotion/react/jsx-runtime";
|
|
19095
19208
|
function Pagination({
|
|
19096
19209
|
limit,
|
|
19097
19210
|
offset,
|
|
@@ -19106,12 +19219,12 @@ function Pagination({
|
|
|
19106
19219
|
if (pageCount <= 1) {
|
|
19107
19220
|
return null;
|
|
19108
19221
|
}
|
|
19109
|
-
return /* @__PURE__ */
|
|
19222
|
+
return /* @__PURE__ */ jsx114(
|
|
19110
19223
|
Paginate,
|
|
19111
19224
|
{
|
|
19112
19225
|
forcePage: currentPage,
|
|
19113
|
-
previousLabel: /* @__PURE__ */
|
|
19114
|
-
nextLabel: /* @__PURE__ */
|
|
19226
|
+
previousLabel: /* @__PURE__ */ jsx114("div", { className: prevNextControls, children: "<" }),
|
|
19227
|
+
nextLabel: /* @__PURE__ */ jsx114("div", { className: prevNextControls, children: ">" }),
|
|
19115
19228
|
breakLabel: "...",
|
|
19116
19229
|
pageCount,
|
|
19117
19230
|
marginPagesDisplayed: 2,
|
|
@@ -19151,8 +19264,8 @@ var useParameterShell = () => {
|
|
|
19151
19264
|
};
|
|
19152
19265
|
|
|
19153
19266
|
// src/components/ParameterInputs/styles/LabelLeadingIcon.styles.ts
|
|
19154
|
-
import { css as
|
|
19155
|
-
var inputIconBtn =
|
|
19267
|
+
import { css as css88 } from "@emotion/react";
|
|
19268
|
+
var inputIconBtn = css88`
|
|
19156
19269
|
align-items: center;
|
|
19157
19270
|
border: none;
|
|
19158
19271
|
border-radius: var(--rounded-base);
|
|
@@ -19178,7 +19291,7 @@ var inputIconBtn = css86`
|
|
|
19178
19291
|
`;
|
|
19179
19292
|
|
|
19180
19293
|
// src/components/ParameterInputs/LabelLeadingIcon.tsx
|
|
19181
|
-
import { jsx as
|
|
19294
|
+
import { jsx as jsx115, jsxs as jsxs76 } from "@emotion/react/jsx-runtime";
|
|
19182
19295
|
var LabelLeadingIcon = ({
|
|
19183
19296
|
icon,
|
|
19184
19297
|
iconColor,
|
|
@@ -19190,7 +19303,7 @@ var LabelLeadingIcon = ({
|
|
|
19190
19303
|
...props
|
|
19191
19304
|
}) => {
|
|
19192
19305
|
const titleFr = title2 != null ? title2 : isLocked ? "Read-only pattern parameter" : isBound ? "Connected to external content. Click to edit" : "Click to connect to external content";
|
|
19193
|
-
return /* @__PURE__ */
|
|
19306
|
+
return /* @__PURE__ */ jsx115(Tooltip, { title: titleFr, children: /* @__PURE__ */ jsxs76(
|
|
19194
19307
|
"button",
|
|
19195
19308
|
{
|
|
19196
19309
|
css: inputIconBtn,
|
|
@@ -19200,7 +19313,7 @@ var LabelLeadingIcon = ({
|
|
|
19200
19313
|
...props,
|
|
19201
19314
|
"data-testid": "lock-button",
|
|
19202
19315
|
children: [
|
|
19203
|
-
/* @__PURE__ */
|
|
19316
|
+
/* @__PURE__ */ jsx115(
|
|
19204
19317
|
Icon,
|
|
19205
19318
|
{
|
|
19206
19319
|
icon: isLocked ? "lock" : icon ? icon : "arrows-expand-down-right",
|
|
@@ -19216,8 +19329,8 @@ var LabelLeadingIcon = ({
|
|
|
19216
19329
|
var ConnectToDataElementButton = LabelLeadingIcon;
|
|
19217
19330
|
|
|
19218
19331
|
// src/components/ParameterInputs/styles/ParameterInput.styles.ts
|
|
19219
|
-
import { css as
|
|
19220
|
-
var inputContainer2 =
|
|
19332
|
+
import { css as css89 } from "@emotion/react";
|
|
19333
|
+
var inputContainer2 = css89`
|
|
19221
19334
|
position: relative;
|
|
19222
19335
|
scroll-margin: var(--spacing-2xl);
|
|
19223
19336
|
|
|
@@ -19230,14 +19343,14 @@ var inputContainer2 = css87`
|
|
|
19230
19343
|
}
|
|
19231
19344
|
}
|
|
19232
19345
|
`;
|
|
19233
|
-
var labelText2 =
|
|
19346
|
+
var labelText2 = css89`
|
|
19234
19347
|
align-items: center;
|
|
19235
19348
|
display: flex;
|
|
19236
19349
|
gap: var(--spacing-xs);
|
|
19237
19350
|
font-weight: var(--fw-regular);
|
|
19238
19351
|
margin: 0 0 var(--spacing-xs);
|
|
19239
19352
|
`;
|
|
19240
|
-
var input3 =
|
|
19353
|
+
var input3 = css89`
|
|
19241
19354
|
display: block;
|
|
19242
19355
|
appearance: none;
|
|
19243
19356
|
box-sizing: border-box;
|
|
@@ -19285,18 +19398,18 @@ var input3 = css87`
|
|
|
19285
19398
|
color: var(--gray-400);
|
|
19286
19399
|
}
|
|
19287
19400
|
`;
|
|
19288
|
-
var selectInput =
|
|
19401
|
+
var selectInput = css89`
|
|
19289
19402
|
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");
|
|
19290
19403
|
background-position: right var(--spacing-sm) center;
|
|
19291
19404
|
background-repeat: no-repeat;
|
|
19292
19405
|
background-size: 1rem;
|
|
19293
19406
|
padding-right: var(--spacing-xl);
|
|
19294
19407
|
`;
|
|
19295
|
-
var inputWrapper =
|
|
19408
|
+
var inputWrapper = css89`
|
|
19296
19409
|
display: flex; // used to correct overflow with chrome textarea
|
|
19297
19410
|
position: relative;
|
|
19298
19411
|
`;
|
|
19299
|
-
var inputIcon2 =
|
|
19412
|
+
var inputIcon2 = css89`
|
|
19300
19413
|
align-items: center;
|
|
19301
19414
|
background: var(--white);
|
|
19302
19415
|
border-radius: var(--rounded-md) 0 0 var(--rounded-md);
|
|
@@ -19312,7 +19425,7 @@ var inputIcon2 = css87`
|
|
|
19312
19425
|
width: var(--spacing-lg);
|
|
19313
19426
|
z-index: var(--z-10);
|
|
19314
19427
|
`;
|
|
19315
|
-
var inputToggleLabel2 =
|
|
19428
|
+
var inputToggleLabel2 = css89`
|
|
19316
19429
|
--inline-label-color: var(--typography-base);
|
|
19317
19430
|
align-items: center;
|
|
19318
19431
|
cursor: pointer;
|
|
@@ -19327,7 +19440,7 @@ var inputToggleLabel2 = css87`
|
|
|
19327
19440
|
--inline-label-color: var(--gray-400);
|
|
19328
19441
|
}
|
|
19329
19442
|
`;
|
|
19330
|
-
var toggleInput2 =
|
|
19443
|
+
var toggleInput2 = css89`
|
|
19331
19444
|
appearance: none;
|
|
19332
19445
|
border: 1px solid var(--gray-200);
|
|
19333
19446
|
background: var(--white);
|
|
@@ -19380,7 +19493,7 @@ var toggleInput2 = css87`
|
|
|
19380
19493
|
border-color: var(--gray-300);
|
|
19381
19494
|
}
|
|
19382
19495
|
`;
|
|
19383
|
-
var inlineLabel2 =
|
|
19496
|
+
var inlineLabel2 = css89`
|
|
19384
19497
|
color: var(--inline-label-color);
|
|
19385
19498
|
padding-left: var(--spacing-md);
|
|
19386
19499
|
font-size: var(--fs-sm);
|
|
@@ -19397,7 +19510,7 @@ var inlineLabel2 = css87`
|
|
|
19397
19510
|
}
|
|
19398
19511
|
}
|
|
19399
19512
|
`;
|
|
19400
|
-
var inputMenu =
|
|
19513
|
+
var inputMenu = css89`
|
|
19401
19514
|
background: none;
|
|
19402
19515
|
border: none;
|
|
19403
19516
|
padding: var(--spacing-2xs);
|
|
@@ -19405,10 +19518,10 @@ var inputMenu = css87`
|
|
|
19405
19518
|
top: calc(var(--spacing-md) * -1.2);
|
|
19406
19519
|
right: 0;
|
|
19407
19520
|
`;
|
|
19408
|
-
var inputActionItems =
|
|
19521
|
+
var inputActionItems = css89`
|
|
19409
19522
|
display: flex;
|
|
19410
19523
|
`;
|
|
19411
|
-
var inputMenuHover =
|
|
19524
|
+
var inputMenuHover = css89`
|
|
19412
19525
|
opacity: var(--opacity-50);
|
|
19413
19526
|
transition: background-color var(--duration-fast) var(--timing-ease-out);
|
|
19414
19527
|
|
|
@@ -19418,11 +19531,11 @@ var inputMenuHover = css87`
|
|
|
19418
19531
|
background-color: var(--gray-200);
|
|
19419
19532
|
}
|
|
19420
19533
|
`;
|
|
19421
|
-
var textarea2 =
|
|
19534
|
+
var textarea2 = css89`
|
|
19422
19535
|
resize: vertical;
|
|
19423
19536
|
min-height: 2rem;
|
|
19424
19537
|
`;
|
|
19425
|
-
var dataConnectButton =
|
|
19538
|
+
var dataConnectButton = css89`
|
|
19426
19539
|
align-items: center;
|
|
19427
19540
|
appearance: none;
|
|
19428
19541
|
box-sizing: border-box;
|
|
@@ -19457,7 +19570,7 @@ var dataConnectButton = css87`
|
|
|
19457
19570
|
pointer-events: none;
|
|
19458
19571
|
}
|
|
19459
19572
|
`;
|
|
19460
|
-
var linkParameterBtn =
|
|
19573
|
+
var linkParameterBtn = css89`
|
|
19461
19574
|
border-radius: var(--rounded-base);
|
|
19462
19575
|
background: transparent;
|
|
19463
19576
|
border: none;
|
|
@@ -19466,7 +19579,7 @@ var linkParameterBtn = css87`
|
|
|
19466
19579
|
font-size: var(--fs-sm);
|
|
19467
19580
|
line-height: 1;
|
|
19468
19581
|
`;
|
|
19469
|
-
var linkParameterControls =
|
|
19582
|
+
var linkParameterControls = css89`
|
|
19470
19583
|
position: absolute;
|
|
19471
19584
|
inset: 0 0 0 auto;
|
|
19472
19585
|
padding: 0 var(--spacing-base);
|
|
@@ -19475,7 +19588,7 @@ var linkParameterControls = css87`
|
|
|
19475
19588
|
justify-content: center;
|
|
19476
19589
|
gap: var(--spacing-base);
|
|
19477
19590
|
`;
|
|
19478
|
-
var linkParameterInput = (withExternalLinkIcon) =>
|
|
19591
|
+
var linkParameterInput = (withExternalLinkIcon) => css89`
|
|
19479
19592
|
padding-right: calc(
|
|
19480
19593
|
${withExternalLinkIcon ? "calc(var(--spacing-lg) * 2 + var(--spacing-xs))" : "var(--spacing-xl)"} +
|
|
19481
19594
|
var(--spacing-base)
|
|
@@ -19488,7 +19601,7 @@ var linkParameterInput = (withExternalLinkIcon) => css87`
|
|
|
19488
19601
|
}
|
|
19489
19602
|
}
|
|
19490
19603
|
`;
|
|
19491
|
-
var linkParameterIcon =
|
|
19604
|
+
var linkParameterIcon = css89`
|
|
19492
19605
|
align-items: center;
|
|
19493
19606
|
color: var(--brand-secondary-3);
|
|
19494
19607
|
display: flex;
|
|
@@ -19503,7 +19616,7 @@ var linkParameterIcon = css87`
|
|
|
19503
19616
|
`;
|
|
19504
19617
|
|
|
19505
19618
|
// src/components/ParameterInputs/ParameterDataResource.tsx
|
|
19506
|
-
import { jsx as
|
|
19619
|
+
import { jsx as jsx116, jsxs as jsxs77 } from "@emotion/react/jsx-runtime";
|
|
19507
19620
|
function ParameterDataResource({
|
|
19508
19621
|
label,
|
|
19509
19622
|
labelLeadingIcon,
|
|
@@ -19513,12 +19626,12 @@ function ParameterDataResource({
|
|
|
19513
19626
|
disabled: disabled2,
|
|
19514
19627
|
children
|
|
19515
19628
|
}) {
|
|
19516
|
-
return /* @__PURE__ */
|
|
19517
|
-
/* @__PURE__ */
|
|
19629
|
+
return /* @__PURE__ */ jsxs77("div", { "data-testid": "parameter-data-connect-button", children: [
|
|
19630
|
+
/* @__PURE__ */ jsxs77("span", { css: labelText2, children: [
|
|
19518
19631
|
labelLeadingIcon ? labelLeadingIcon : null,
|
|
19519
19632
|
label
|
|
19520
19633
|
] }),
|
|
19521
|
-
/* @__PURE__ */
|
|
19634
|
+
/* @__PURE__ */ jsxs77(
|
|
19522
19635
|
"button",
|
|
19523
19636
|
{
|
|
19524
19637
|
type: "button",
|
|
@@ -19527,30 +19640,30 @@ function ParameterDataResource({
|
|
|
19527
19640
|
disabled: disabled2,
|
|
19528
19641
|
onClick: onConnectDatasource,
|
|
19529
19642
|
children: [
|
|
19530
|
-
/* @__PURE__ */
|
|
19643
|
+
/* @__PURE__ */ jsx116("span", { className: "advance-input-icon", css: [inputIcon2], children: /* @__PURE__ */ jsx116(Icon, { icon: "stack", iconColor: "currentColor", size: "1rem" }) }),
|
|
19531
19644
|
children
|
|
19532
19645
|
]
|
|
19533
19646
|
}
|
|
19534
19647
|
),
|
|
19535
|
-
caption ? /* @__PURE__ */
|
|
19648
|
+
caption ? /* @__PURE__ */ jsx116(Caption, { children: caption }) : null
|
|
19536
19649
|
] });
|
|
19537
19650
|
}
|
|
19538
19651
|
|
|
19539
19652
|
// src/components/ParameterInputs/styles/ParameterDrawerHeader.styles.ts
|
|
19540
|
-
import { css as
|
|
19541
|
-
var ParameterDrawerHeaderContainer =
|
|
19653
|
+
import { css as css90 } from "@emotion/react";
|
|
19654
|
+
var ParameterDrawerHeaderContainer = css90`
|
|
19542
19655
|
align-items: center;
|
|
19543
19656
|
display: flex;
|
|
19544
19657
|
gap: var(--spacing-base);
|
|
19545
19658
|
justify-content: space-between;
|
|
19546
19659
|
margin-bottom: var(--spacing-sm);
|
|
19547
19660
|
`;
|
|
19548
|
-
var ParameterDrawerHeaderTitleGroup =
|
|
19661
|
+
var ParameterDrawerHeaderTitleGroup = css90`
|
|
19549
19662
|
align-items: center;
|
|
19550
19663
|
display: flex;
|
|
19551
19664
|
gap: var(--spacing-sm);
|
|
19552
19665
|
`;
|
|
19553
|
-
var ParameterDrawerHeaderTitle =
|
|
19666
|
+
var ParameterDrawerHeaderTitle = css90`
|
|
19554
19667
|
text-overflow: ellipsis;
|
|
19555
19668
|
white-space: nowrap;
|
|
19556
19669
|
overflow: hidden;
|
|
@@ -19558,12 +19671,12 @@ var ParameterDrawerHeaderTitle = css88`
|
|
|
19558
19671
|
`;
|
|
19559
19672
|
|
|
19560
19673
|
// src/components/ParameterInputs/ParameterDrawerHeader.tsx
|
|
19561
|
-
import { jsx as
|
|
19674
|
+
import { jsx as jsx117, jsxs as jsxs78 } from "@emotion/react/jsx-runtime";
|
|
19562
19675
|
var ParameterDrawerHeader = ({ title: title2, iconBeforeTitle, children }) => {
|
|
19563
|
-
return /* @__PURE__ */
|
|
19564
|
-
/* @__PURE__ */
|
|
19676
|
+
return /* @__PURE__ */ jsxs78("div", { css: ParameterDrawerHeaderContainer, children: [
|
|
19677
|
+
/* @__PURE__ */ jsxs78("header", { css: ParameterDrawerHeaderTitleGroup, children: [
|
|
19565
19678
|
iconBeforeTitle,
|
|
19566
|
-
/* @__PURE__ */
|
|
19679
|
+
/* @__PURE__ */ jsx117(Heading2, { level: 3, withMarginBottom: false, css: ParameterDrawerHeaderTitle, title: title2, children: title2 })
|
|
19567
19680
|
] }),
|
|
19568
19681
|
children
|
|
19569
19682
|
] });
|
|
@@ -19573,8 +19686,8 @@ var ParameterDrawerHeader = ({ title: title2, iconBeforeTitle, children }) => {
|
|
|
19573
19686
|
import { forwardRef as forwardRef17 } from "react";
|
|
19574
19687
|
|
|
19575
19688
|
// src/components/ParameterInputs/styles/ParameterGroup.styles.ts
|
|
19576
|
-
import { css as
|
|
19577
|
-
var fieldsetStyles =
|
|
19689
|
+
import { css as css91 } from "@emotion/react";
|
|
19690
|
+
var fieldsetStyles = css91`
|
|
19578
19691
|
&:disabled,
|
|
19579
19692
|
[readonly] {
|
|
19580
19693
|
pointer-events: none;
|
|
@@ -19585,7 +19698,7 @@ var fieldsetStyles = css89`
|
|
|
19585
19698
|
}
|
|
19586
19699
|
}
|
|
19587
19700
|
`;
|
|
19588
|
-
var fieldsetLegend2 =
|
|
19701
|
+
var fieldsetLegend2 = css91`
|
|
19589
19702
|
display: block;
|
|
19590
19703
|
font-weight: var(--fw-medium);
|
|
19591
19704
|
margin-bottom: var(--spacing-sm);
|
|
@@ -19593,11 +19706,11 @@ var fieldsetLegend2 = css89`
|
|
|
19593
19706
|
`;
|
|
19594
19707
|
|
|
19595
19708
|
// src/components/ParameterInputs/ParameterGroup.tsx
|
|
19596
|
-
import { jsx as
|
|
19709
|
+
import { jsx as jsx118, jsxs as jsxs79 } from "@emotion/react/jsx-runtime";
|
|
19597
19710
|
var ParameterGroup = forwardRef17(
|
|
19598
19711
|
({ legend, isDisabled, children, ...props }, ref) => {
|
|
19599
|
-
return /* @__PURE__ */
|
|
19600
|
-
/* @__PURE__ */
|
|
19712
|
+
return /* @__PURE__ */ jsxs79("fieldset", { css: fieldsetStyles, disabled: isDisabled, ref, ...props, children: [
|
|
19713
|
+
/* @__PURE__ */ jsx118("legend", { css: fieldsetLegend2, children: legend }),
|
|
19601
19714
|
children
|
|
19602
19715
|
] });
|
|
19603
19716
|
}
|
|
@@ -19611,15 +19724,15 @@ import { useState as useState14 } from "react";
|
|
|
19611
19724
|
import { createPortal as createPortal2 } from "react-dom";
|
|
19612
19725
|
|
|
19613
19726
|
// src/components/ParameterInputs/styles/ParameterImage.styles.ts
|
|
19614
|
-
import { css as
|
|
19615
|
-
var previewWrapper =
|
|
19727
|
+
import { css as css92 } from "@emotion/react";
|
|
19728
|
+
var previewWrapper = css92`
|
|
19616
19729
|
margin-top: var(--spacing-xs);
|
|
19617
19730
|
background: var(--gray-50);
|
|
19618
19731
|
padding: var(--spacing-sm);
|
|
19619
19732
|
border: solid 1px var(--gray-300);
|
|
19620
19733
|
border-radius: var(--rounded-sm);
|
|
19621
19734
|
`;
|
|
19622
|
-
var previewLink =
|
|
19735
|
+
var previewLink = css92`
|
|
19623
19736
|
display: block;
|
|
19624
19737
|
width: 100%;
|
|
19625
19738
|
|
|
@@ -19627,7 +19740,7 @@ var previewLink = css90`
|
|
|
19627
19740
|
max-height: 9rem;
|
|
19628
19741
|
}
|
|
19629
19742
|
`;
|
|
19630
|
-
var previewModalWrapper =
|
|
19743
|
+
var previewModalWrapper = css92`
|
|
19631
19744
|
background: var(--gray-50);
|
|
19632
19745
|
display: flex;
|
|
19633
19746
|
height: 100%;
|
|
@@ -19636,7 +19749,7 @@ var previewModalWrapper = css90`
|
|
|
19636
19749
|
border: solid 1px var(--gray-300);
|
|
19637
19750
|
border-radius: var(--rounded-sm);
|
|
19638
19751
|
`;
|
|
19639
|
-
var previewModalImage =
|
|
19752
|
+
var previewModalImage = css92`
|
|
19640
19753
|
display: flex;
|
|
19641
19754
|
height: 100%;
|
|
19642
19755
|
width: 100%;
|
|
@@ -19648,32 +19761,32 @@ var previewModalImage = css90`
|
|
|
19648
19761
|
`;
|
|
19649
19762
|
|
|
19650
19763
|
// src/components/ParameterInputs/ParameterImagePreview.tsx
|
|
19651
|
-
import { Fragment as Fragment15, jsx as
|
|
19764
|
+
import { Fragment as Fragment15, jsx as jsx119, jsxs as jsxs80 } from "@emotion/react/jsx-runtime";
|
|
19652
19765
|
function ParameterImagePreview({ imageSrc }) {
|
|
19653
19766
|
const [showModal, setShowModal] = useState14(false);
|
|
19654
|
-
return imageSrc ? /* @__PURE__ */
|
|
19655
|
-
/* @__PURE__ */
|
|
19656
|
-
/* @__PURE__ */
|
|
19767
|
+
return imageSrc ? /* @__PURE__ */ jsxs80("div", { css: previewWrapper, children: [
|
|
19768
|
+
/* @__PURE__ */ jsx119(PreviewImageModal, { open: showModal, imageSrc, onRequestClose: () => setShowModal(false) }),
|
|
19769
|
+
/* @__PURE__ */ jsx119(
|
|
19657
19770
|
"button",
|
|
19658
19771
|
{
|
|
19659
19772
|
css: previewLink,
|
|
19660
19773
|
onClick: () => {
|
|
19661
19774
|
setShowModal(true);
|
|
19662
19775
|
},
|
|
19663
|
-
children: /* @__PURE__ */
|
|
19776
|
+
children: /* @__PURE__ */ jsx119(Image, { src: imageSrc, "data-testid": "parameter-image-preview" })
|
|
19664
19777
|
}
|
|
19665
19778
|
)
|
|
19666
19779
|
] }) : null;
|
|
19667
19780
|
}
|
|
19668
19781
|
var PreviewImageModal = ({ open, onRequestClose, imageSrc }) => {
|
|
19669
|
-
return open ? /* @__PURE__ */
|
|
19670
|
-
/* @__PURE__ */
|
|
19782
|
+
return open ? /* @__PURE__ */ jsx119(Fragment15, { children: createPortal2(
|
|
19783
|
+
/* @__PURE__ */ jsx119(
|
|
19671
19784
|
Modal,
|
|
19672
19785
|
{
|
|
19673
19786
|
header: "Image Preview",
|
|
19674
19787
|
onRequestClose,
|
|
19675
|
-
buttonGroup: /* @__PURE__ */
|
|
19676
|
-
children: /* @__PURE__ */
|
|
19788
|
+
buttonGroup: /* @__PURE__ */ jsx119(Button, { buttonType: "secondary", onClick: onRequestClose, children: "Ok" }),
|
|
19789
|
+
children: /* @__PURE__ */ jsx119("div", { css: previewModalWrapper, children: /* @__PURE__ */ jsx119(Image, { src: imageSrc, css: previewModalImage, "data-testid": "parameter-image-preview" }) })
|
|
19677
19790
|
}
|
|
19678
19791
|
),
|
|
19679
19792
|
document.body
|
|
@@ -19681,25 +19794,25 @@ var PreviewImageModal = ({ open, onRequestClose, imageSrc }) => {
|
|
|
19681
19794
|
};
|
|
19682
19795
|
|
|
19683
19796
|
// src/components/ParameterInputs/ParameterShell.tsx
|
|
19684
|
-
import { css as
|
|
19797
|
+
import { css as css94 } from "@emotion/react";
|
|
19685
19798
|
import { useState as useState15 } from "react";
|
|
19686
19799
|
|
|
19687
19800
|
// src/components/ParameterInputs/ParameterLabel.tsx
|
|
19688
|
-
import { jsx as
|
|
19801
|
+
import { jsx as jsx120 } from "@emotion/react/jsx-runtime";
|
|
19689
19802
|
var ParameterLabel = ({ id, asSpan, children, ...props }) => {
|
|
19690
|
-
return !asSpan ? /* @__PURE__ */
|
|
19803
|
+
return !asSpan ? /* @__PURE__ */ jsx120("label", { ...props, htmlFor: id, css: labelText2, children }) : /* @__PURE__ */ jsx120("span", { "aria-labelledby": id, css: labelText2, children });
|
|
19691
19804
|
};
|
|
19692
19805
|
|
|
19693
19806
|
// src/components/ParameterInputs/ParameterMenuButton.tsx
|
|
19694
19807
|
import { forwardRef as forwardRef18 } from "react";
|
|
19695
|
-
import { jsx as
|
|
19808
|
+
import { jsx as jsx121 } from "@emotion/react/jsx-runtime";
|
|
19696
19809
|
var ParameterMenuButton = forwardRef18(
|
|
19697
19810
|
({ label, children }, ref) => {
|
|
19698
|
-
return /* @__PURE__ */
|
|
19811
|
+
return /* @__PURE__ */ jsx121(
|
|
19699
19812
|
Menu,
|
|
19700
19813
|
{
|
|
19701
19814
|
menuLabel: `${label} menu`,
|
|
19702
|
-
menuTrigger: /* @__PURE__ */
|
|
19815
|
+
menuTrigger: /* @__PURE__ */ jsx121(
|
|
19703
19816
|
"button",
|
|
19704
19817
|
{
|
|
19705
19818
|
className: "parameter-menu",
|
|
@@ -19707,7 +19820,7 @@ var ParameterMenuButton = forwardRef18(
|
|
|
19707
19820
|
type: "button",
|
|
19708
19821
|
"aria-label": `${label} options`,
|
|
19709
19822
|
ref,
|
|
19710
|
-
children: /* @__PURE__ */
|
|
19823
|
+
children: /* @__PURE__ */ jsx121(Icon, { icon: "more-alt", iconColor: "currentColor", size: "0.9rem" })
|
|
19711
19824
|
}
|
|
19712
19825
|
),
|
|
19713
19826
|
children
|
|
@@ -19717,14 +19830,14 @@ var ParameterMenuButton = forwardRef18(
|
|
|
19717
19830
|
);
|
|
19718
19831
|
|
|
19719
19832
|
// src/components/ParameterInputs/styles/ParameterShell.styles.ts
|
|
19720
|
-
import { css as
|
|
19721
|
-
var emptyParameterShell =
|
|
19833
|
+
import { css as css93 } from "@emotion/react";
|
|
19834
|
+
var emptyParameterShell = css93`
|
|
19722
19835
|
border-radius: var(--rounded-sm);
|
|
19723
19836
|
flex-grow: 1;
|
|
19724
19837
|
position: relative;
|
|
19725
19838
|
max-width: 100%;
|
|
19726
19839
|
`;
|
|
19727
|
-
var emptyParameterShellText =
|
|
19840
|
+
var emptyParameterShellText = css93`
|
|
19728
19841
|
background: var(--brand-secondary-6);
|
|
19729
19842
|
border-radius: var(--rounded-sm);
|
|
19730
19843
|
padding: var(--spacing-sm);
|
|
@@ -19732,7 +19845,7 @@ var emptyParameterShellText = css91`
|
|
|
19732
19845
|
font-size: var(--fs-sm);
|
|
19733
19846
|
margin: 0;
|
|
19734
19847
|
`;
|
|
19735
|
-
var overrideMarker =
|
|
19848
|
+
var overrideMarker = css93`
|
|
19736
19849
|
border-radius: var(--rounded-sm);
|
|
19737
19850
|
border: 10px solid var(--gray-300);
|
|
19738
19851
|
border-left-color: transparent;
|
|
@@ -19743,7 +19856,7 @@ var overrideMarker = css91`
|
|
|
19743
19856
|
`;
|
|
19744
19857
|
|
|
19745
19858
|
// src/components/ParameterInputs/ParameterShell.tsx
|
|
19746
|
-
import { jsx as
|
|
19859
|
+
import { jsx as jsx122, jsxs as jsxs81 } from "@emotion/react/jsx-runtime";
|
|
19747
19860
|
var extractParameterProps = (props) => {
|
|
19748
19861
|
const {
|
|
19749
19862
|
id,
|
|
@@ -19806,33 +19919,33 @@ var ParameterShell = ({
|
|
|
19806
19919
|
const [manualErrorMessage, setManualErrorMessage] = useState15(void 0);
|
|
19807
19920
|
const setErrorMessage = (message) => setManualErrorMessage(message);
|
|
19808
19921
|
const errorMessaging = errorMessage || manualErrorMessage;
|
|
19809
|
-
return /* @__PURE__ */
|
|
19810
|
-
hiddenLabel || title2 ? null : /* @__PURE__ */
|
|
19922
|
+
return /* @__PURE__ */ jsxs81("div", { css: inputContainer2, ...props, id, children: [
|
|
19923
|
+
hiddenLabel || title2 ? null : /* @__PURE__ */ jsxs81(ParameterLabel, { id, css: labelText2, children: [
|
|
19811
19924
|
labelLeadingIcon != null ? labelLeadingIcon : null,
|
|
19812
19925
|
label,
|
|
19813
19926
|
labelTrailingIcon != null ? labelTrailingIcon : null
|
|
19814
19927
|
] }),
|
|
19815
|
-
!title2 ? null : /* @__PURE__ */
|
|
19928
|
+
!title2 ? null : /* @__PURE__ */ jsxs81(ParameterLabel, { id, asSpan: true, children: [
|
|
19816
19929
|
labelLeadingIcon != null ? labelLeadingIcon : null,
|
|
19817
19930
|
title2,
|
|
19818
19931
|
labelTrailingIcon != null ? labelTrailingIcon : null
|
|
19819
19932
|
] }),
|
|
19820
|
-
/* @__PURE__ */
|
|
19821
|
-
actionItems ? /* @__PURE__ */
|
|
19933
|
+
/* @__PURE__ */ jsxs81("div", { css: inputWrapper, children: [
|
|
19934
|
+
actionItems ? /* @__PURE__ */ jsx122(
|
|
19822
19935
|
"div",
|
|
19823
19936
|
{
|
|
19824
19937
|
css: [
|
|
19825
19938
|
inputMenu,
|
|
19826
19939
|
inputActionItems,
|
|
19827
|
-
menuItems ?
|
|
19940
|
+
menuItems ? css94`
|
|
19828
19941
|
right: var(--spacing-md);
|
|
19829
19942
|
` : void 0
|
|
19830
19943
|
],
|
|
19831
19944
|
children: actionItems
|
|
19832
19945
|
}
|
|
19833
19946
|
) : null,
|
|
19834
|
-
menuItems ? /* @__PURE__ */
|
|
19835
|
-
/* @__PURE__ */
|
|
19947
|
+
menuItems ? /* @__PURE__ */ jsx122(ParameterMenuButton, { label: `${label} menu`, children: menuItems }) : null,
|
|
19948
|
+
/* @__PURE__ */ jsx122(
|
|
19836
19949
|
ParameterShellContext.Provider,
|
|
19837
19950
|
{
|
|
19838
19951
|
value: {
|
|
@@ -19842,14 +19955,14 @@ var ParameterShell = ({
|
|
|
19842
19955
|
errorMessage: errorMessaging,
|
|
19843
19956
|
handleManuallySetErrorMessage: (message) => setErrorMessage(message)
|
|
19844
19957
|
},
|
|
19845
|
-
children: isParameterGroup ? /* @__PURE__ */
|
|
19958
|
+
children: isParameterGroup ? /* @__PURE__ */ jsx122("div", { style: { flexGrow: 1 }, children }) : /* @__PURE__ */ jsxs81(ParameterShellPlaceholder, { children: [
|
|
19846
19959
|
children,
|
|
19847
|
-
hasOverriddenValue && onResetOverriddenValue ? /* @__PURE__ */
|
|
19960
|
+
hasOverriddenValue && onResetOverriddenValue ? /* @__PURE__ */ jsx122(ParameterOverrideMarker, { onClick: onResetOverriddenValue }) : null
|
|
19848
19961
|
] })
|
|
19849
19962
|
}
|
|
19850
19963
|
)
|
|
19851
19964
|
] }),
|
|
19852
|
-
/* @__PURE__ */
|
|
19965
|
+
/* @__PURE__ */ jsx122(
|
|
19853
19966
|
FieldMessage,
|
|
19854
19967
|
{
|
|
19855
19968
|
helperMessageTestId: captionTestId,
|
|
@@ -19863,17 +19976,17 @@ var ParameterShell = ({
|
|
|
19863
19976
|
] });
|
|
19864
19977
|
};
|
|
19865
19978
|
var ParameterShellPlaceholder = ({ children }) => {
|
|
19866
|
-
return /* @__PURE__ */
|
|
19979
|
+
return /* @__PURE__ */ jsx122("div", { css: emptyParameterShell, children });
|
|
19867
19980
|
};
|
|
19868
|
-
var ParameterOverrideMarker = (props) => /* @__PURE__ */
|
|
19981
|
+
var ParameterOverrideMarker = (props) => /* @__PURE__ */ jsx122(Tooltip, { title: "The default value has been overridden", children: /* @__PURE__ */ jsx122("button", { type: "button", css: overrideMarker, ...props, children: /* @__PURE__ */ jsx122("span", { hidden: true, children: "reset overridden value to default" }) }) });
|
|
19869
19982
|
|
|
19870
19983
|
// src/components/ParameterInputs/ParameterImage.tsx
|
|
19871
|
-
import { Fragment as Fragment16, jsx as
|
|
19984
|
+
import { Fragment as Fragment16, jsx as jsx123, jsxs as jsxs82 } from "@emotion/react/jsx-runtime";
|
|
19872
19985
|
var ParameterImage = forwardRef19(
|
|
19873
19986
|
({ children, ...props }, ref) => {
|
|
19874
19987
|
const { shellProps, innerProps } = extractParameterProps(props);
|
|
19875
|
-
return /* @__PURE__ */
|
|
19876
|
-
/* @__PURE__ */
|
|
19988
|
+
return /* @__PURE__ */ jsxs82(ParameterShell, { "data-test-id": "parameter-image", ...shellProps, children: [
|
|
19989
|
+
/* @__PURE__ */ jsx123(ParameterImageInner, { ref, ...innerProps }),
|
|
19877
19990
|
children
|
|
19878
19991
|
] });
|
|
19879
19992
|
}
|
|
@@ -19882,8 +19995,8 @@ var ParameterImageInner = forwardRef19((props, ref) => {
|
|
|
19882
19995
|
const { value } = props;
|
|
19883
19996
|
const { id, label, hiddenLabel, errorMessage } = useParameterShell();
|
|
19884
19997
|
const deferredValue = useDeferredValue(value);
|
|
19885
|
-
return /* @__PURE__ */
|
|
19886
|
-
/* @__PURE__ */
|
|
19998
|
+
return /* @__PURE__ */ jsxs82(Fragment16, { children: [
|
|
19999
|
+
/* @__PURE__ */ jsx123(
|
|
19887
20000
|
"input",
|
|
19888
20001
|
{
|
|
19889
20002
|
css: input3,
|
|
@@ -19895,21 +20008,21 @@ var ParameterImageInner = forwardRef19((props, ref) => {
|
|
|
19895
20008
|
...props
|
|
19896
20009
|
}
|
|
19897
20010
|
),
|
|
19898
|
-
errorMessage || props.disablePreview ? null : /* @__PURE__ */
|
|
20011
|
+
errorMessage || props.disablePreview ? null : /* @__PURE__ */ jsx123(ParameterImagePreview, { imageSrc: deferredValue })
|
|
19899
20012
|
] });
|
|
19900
20013
|
});
|
|
19901
20014
|
|
|
19902
20015
|
// src/components/ParameterInputs/ParameterInput.tsx
|
|
19903
20016
|
import { forwardRef as forwardRef20 } from "react";
|
|
19904
|
-
import { jsx as
|
|
20017
|
+
import { jsx as jsx124 } from "@emotion/react/jsx-runtime";
|
|
19905
20018
|
var ParameterInput = forwardRef20((props, ref) => {
|
|
19906
20019
|
const { shellProps, innerProps } = extractParameterProps(props);
|
|
19907
|
-
return /* @__PURE__ */
|
|
20020
|
+
return /* @__PURE__ */ jsx124(ParameterShell, { "data-testid": "parameter-input", ...shellProps, children: /* @__PURE__ */ jsx124(ParameterInputInner, { ref, ...innerProps }) });
|
|
19908
20021
|
});
|
|
19909
20022
|
var ParameterInputInner = forwardRef20(
|
|
19910
20023
|
({ ...props }, ref) => {
|
|
19911
20024
|
const { id, label, hiddenLabel } = useParameterShell();
|
|
19912
|
-
return /* @__PURE__ */
|
|
20025
|
+
return /* @__PURE__ */ jsx124(
|
|
19913
20026
|
"input",
|
|
19914
20027
|
{
|
|
19915
20028
|
css: input3,
|
|
@@ -19926,18 +20039,18 @@ var ParameterInputInner = forwardRef20(
|
|
|
19926
20039
|
|
|
19927
20040
|
// src/components/ParameterInputs/ParameterLink.tsx
|
|
19928
20041
|
import { forwardRef as forwardRef21 } from "react";
|
|
19929
|
-
import { jsx as
|
|
20042
|
+
import { jsx as jsx125, jsxs as jsxs83 } from "@emotion/react/jsx-runtime";
|
|
19930
20043
|
var ParameterLink = forwardRef21(
|
|
19931
20044
|
({ disabled: disabled2, onConnectLink, externalLink, ...props }, ref) => {
|
|
19932
20045
|
const { shellProps, innerProps } = extractParameterProps(props);
|
|
19933
|
-
return /* @__PURE__ */
|
|
20046
|
+
return /* @__PURE__ */ jsx125(
|
|
19934
20047
|
ParameterShell,
|
|
19935
20048
|
{
|
|
19936
20049
|
"data-testid": "link-parameter-editor",
|
|
19937
20050
|
...shellProps,
|
|
19938
20051
|
label: innerProps.value ? shellProps.label : "",
|
|
19939
20052
|
title: !innerProps.value ? shellProps.label : void 0,
|
|
19940
|
-
children: /* @__PURE__ */
|
|
20053
|
+
children: /* @__PURE__ */ jsx125(
|
|
19941
20054
|
ParameterLinkInner,
|
|
19942
20055
|
{
|
|
19943
20056
|
onConnectLink,
|
|
@@ -19954,9 +20067,9 @@ var ParameterLinkInner = forwardRef21(
|
|
|
19954
20067
|
({ externalLink, onConnectLink, disabled: disabled2, buttonText = "Select link", ...props }, ref) => {
|
|
19955
20068
|
const { id, label, hiddenLabel } = useParameterShell();
|
|
19956
20069
|
if (!props.value)
|
|
19957
|
-
return /* @__PURE__ */
|
|
19958
|
-
return /* @__PURE__ */
|
|
19959
|
-
/* @__PURE__ */
|
|
20070
|
+
return /* @__PURE__ */ jsx125("button", { type: "button", css: dataConnectButton, disabled: disabled2, onClick: onConnectLink, children: buttonText });
|
|
20071
|
+
return /* @__PURE__ */ jsxs83("div", { css: inputWrapper, children: [
|
|
20072
|
+
/* @__PURE__ */ jsx125(
|
|
19960
20073
|
"input",
|
|
19961
20074
|
{
|
|
19962
20075
|
type: "text",
|
|
@@ -19968,8 +20081,8 @@ var ParameterLinkInner = forwardRef21(
|
|
|
19968
20081
|
...props
|
|
19969
20082
|
}
|
|
19970
20083
|
),
|
|
19971
|
-
/* @__PURE__ */
|
|
19972
|
-
/* @__PURE__ */
|
|
20084
|
+
/* @__PURE__ */ jsxs83("div", { css: linkParameterControls, children: [
|
|
20085
|
+
/* @__PURE__ */ jsx125(
|
|
19973
20086
|
"button",
|
|
19974
20087
|
{
|
|
19975
20088
|
type: "button",
|
|
@@ -19980,7 +20093,7 @@ var ParameterLinkInner = forwardRef21(
|
|
|
19980
20093
|
children: "edit"
|
|
19981
20094
|
}
|
|
19982
20095
|
),
|
|
19983
|
-
externalLink ? /* @__PURE__ */
|
|
20096
|
+
externalLink ? /* @__PURE__ */ jsx125(
|
|
19984
20097
|
"a",
|
|
19985
20098
|
{
|
|
19986
20099
|
href: externalLink,
|
|
@@ -19988,7 +20101,7 @@ var ParameterLinkInner = forwardRef21(
|
|
|
19988
20101
|
title: "Open link in new tab",
|
|
19989
20102
|
target: "_blank",
|
|
19990
20103
|
rel: "noopener noreferrer",
|
|
19991
|
-
children: /* @__PURE__ */
|
|
20104
|
+
children: /* @__PURE__ */ jsx125(Icon, { icon: "arrows-expand-up-right", iconColor: "currentColor", size: "1rem" })
|
|
19992
20105
|
}
|
|
19993
20106
|
) : null
|
|
19994
20107
|
] })
|
|
@@ -19997,15 +20110,15 @@ var ParameterLinkInner = forwardRef21(
|
|
|
19997
20110
|
);
|
|
19998
20111
|
|
|
19999
20112
|
// src/components/ParameterInputs/ParameterMultiSelect.tsx
|
|
20000
|
-
import { jsx as
|
|
20113
|
+
import { jsx as jsx126 } from "@emotion/react/jsx-runtime";
|
|
20001
20114
|
var ParameterMultiSelect = ({ disabled: disabled2 = false, ...props }) => {
|
|
20002
20115
|
const { shellProps, innerProps } = extractParameterProps(props);
|
|
20003
|
-
return /* @__PURE__ */
|
|
20116
|
+
return /* @__PURE__ */ jsx126(ParameterShell, { ...shellProps, children: /* @__PURE__ */ jsx126(ParameterMultiSelectInner, { isDisabled: disabled2, ...innerProps }) });
|
|
20004
20117
|
};
|
|
20005
20118
|
var ParameterMultiSelectInner = (props) => {
|
|
20006
20119
|
var _a;
|
|
20007
20120
|
const { id, label } = useParameterShell();
|
|
20008
|
-
return /* @__PURE__ */
|
|
20121
|
+
return /* @__PURE__ */ jsx126(
|
|
20009
20122
|
InputComboBox,
|
|
20010
20123
|
{
|
|
20011
20124
|
menuPortalTarget: document.body,
|
|
@@ -20055,7 +20168,7 @@ var ParameterMultiSelectInner = (props) => {
|
|
|
20055
20168
|
};
|
|
20056
20169
|
|
|
20057
20170
|
// src/components/ParameterInputs/ParameterNameAndPublicIdInput.tsx
|
|
20058
|
-
import { Fragment as Fragment17, jsx as
|
|
20171
|
+
import { Fragment as Fragment17, jsx as jsx127, jsxs as jsxs84 } from "@emotion/react/jsx-runtime";
|
|
20059
20172
|
var ParameterNameAndPublicIdInput = ({
|
|
20060
20173
|
id,
|
|
20061
20174
|
onBlur,
|
|
@@ -20081,8 +20194,8 @@ var ParameterNameAndPublicIdInput = ({
|
|
|
20081
20194
|
navigator.clipboard.writeText(values[publicIdFieldName]);
|
|
20082
20195
|
};
|
|
20083
20196
|
autoFocus == null ? void 0 : autoFocus();
|
|
20084
|
-
return /* @__PURE__ */
|
|
20085
|
-
/* @__PURE__ */
|
|
20197
|
+
return /* @__PURE__ */ jsxs84(Fragment17, { children: [
|
|
20198
|
+
/* @__PURE__ */ jsx127(
|
|
20086
20199
|
ParameterInput,
|
|
20087
20200
|
{
|
|
20088
20201
|
id: nameIdField,
|
|
@@ -20101,7 +20214,7 @@ var ParameterNameAndPublicIdInput = ({
|
|
|
20101
20214
|
value: values[nameIdField]
|
|
20102
20215
|
}
|
|
20103
20216
|
),
|
|
20104
|
-
/* @__PURE__ */
|
|
20217
|
+
/* @__PURE__ */ jsx127(
|
|
20105
20218
|
ParameterInput,
|
|
20106
20219
|
{
|
|
20107
20220
|
id: publicIdFieldName,
|
|
@@ -20115,11 +20228,11 @@ var ParameterNameAndPublicIdInput = ({
|
|
|
20115
20228
|
caption: !publicIdError ? publicIdCaption : void 0,
|
|
20116
20229
|
placeholder: publicIdPlaceholderText,
|
|
20117
20230
|
errorMessage: publicIdError,
|
|
20118
|
-
menuItems: /* @__PURE__ */
|
|
20231
|
+
menuItems: /* @__PURE__ */ jsx127(
|
|
20119
20232
|
MenuItem,
|
|
20120
20233
|
{
|
|
20121
20234
|
disabled: !values[publicIdFieldName],
|
|
20122
|
-
icon: /* @__PURE__ */
|
|
20235
|
+
icon: /* @__PURE__ */ jsx127(Icon, { icon: "path-trim", iconColor: "currentColor" }),
|
|
20123
20236
|
onClick: handleCopyPidFieldValue,
|
|
20124
20237
|
children: "Copy"
|
|
20125
20238
|
}
|
|
@@ -20127,12 +20240,12 @@ var ParameterNameAndPublicIdInput = ({
|
|
|
20127
20240
|
value: values[publicIdFieldName]
|
|
20128
20241
|
}
|
|
20129
20242
|
),
|
|
20130
|
-
(warnOverLength == null ? void 0 : warnOverLength.length) && values[publicIdFieldName].length > warnOverLength.length ? /* @__PURE__ */
|
|
20243
|
+
(warnOverLength == null ? void 0 : warnOverLength.length) && values[publicIdFieldName].length > warnOverLength.length ? /* @__PURE__ */ jsx127(Callout, { type: "caution", children: warnOverLength.message }) : null
|
|
20131
20244
|
] });
|
|
20132
20245
|
};
|
|
20133
20246
|
|
|
20134
20247
|
// src/components/ParameterInputs/ParameterRichText.tsx
|
|
20135
|
-
import { css as
|
|
20248
|
+
import { css as css98 } from "@emotion/react";
|
|
20136
20249
|
import { ListItemNode, ListNode as ListNode2 } from "@lexical/list";
|
|
20137
20250
|
import {
|
|
20138
20251
|
CODE,
|
|
@@ -20284,23 +20397,23 @@ function DisableStylesPlugin() {
|
|
|
20284
20397
|
}
|
|
20285
20398
|
|
|
20286
20399
|
// src/components/ParameterInputs/rich-text/editorStyles.ts
|
|
20287
|
-
import { css as
|
|
20288
|
-
var textBold =
|
|
20400
|
+
import { css as css95 } from "@emotion/css";
|
|
20401
|
+
var textBold = css95`
|
|
20289
20402
|
font-weight: 700;
|
|
20290
20403
|
`;
|
|
20291
|
-
var textItalic =
|
|
20404
|
+
var textItalic = css95`
|
|
20292
20405
|
font-style: italic;
|
|
20293
20406
|
`;
|
|
20294
|
-
var textUnderline =
|
|
20407
|
+
var textUnderline = css95`
|
|
20295
20408
|
text-decoration: underline;
|
|
20296
20409
|
`;
|
|
20297
|
-
var textStrikethrough =
|
|
20410
|
+
var textStrikethrough = css95`
|
|
20298
20411
|
text-decoration: line-through;
|
|
20299
20412
|
`;
|
|
20300
|
-
var textUnderlineStrikethrough =
|
|
20413
|
+
var textUnderlineStrikethrough = css95`
|
|
20301
20414
|
text-decoration: underline line-through;
|
|
20302
20415
|
`;
|
|
20303
|
-
var textCode =
|
|
20416
|
+
var textCode = css95`
|
|
20304
20417
|
background-color: var(--gray-100);
|
|
20305
20418
|
border-radius: var(--rounded-sm);
|
|
20306
20419
|
display: inline-block;
|
|
@@ -20311,68 +20424,68 @@ var textCode = css93`
|
|
|
20311
20424
|
padding-left: var(--spacing-xs);
|
|
20312
20425
|
padding-right: var(--spacing-xs);
|
|
20313
20426
|
`;
|
|
20314
|
-
var textSuperscript =
|
|
20427
|
+
var textSuperscript = css95`
|
|
20315
20428
|
vertical-align: super;
|
|
20316
20429
|
font-size: smaller;
|
|
20317
20430
|
`;
|
|
20318
|
-
var textSubscript =
|
|
20431
|
+
var textSubscript = css95`
|
|
20319
20432
|
vertical-align: sub;
|
|
20320
20433
|
font-size: smaller;
|
|
20321
20434
|
`;
|
|
20322
|
-
var linkElement =
|
|
20435
|
+
var linkElement = css95`
|
|
20323
20436
|
${link}
|
|
20324
20437
|
${linkColorDefault}
|
|
20325
20438
|
text-decoration: underline;
|
|
20326
20439
|
`;
|
|
20327
|
-
var h12 =
|
|
20440
|
+
var h12 = css95`
|
|
20328
20441
|
font-size: clamp(1.35rem, var(--fluid-font-base), 1.7rem);
|
|
20329
20442
|
`;
|
|
20330
|
-
var h22 =
|
|
20443
|
+
var h22 = css95`
|
|
20331
20444
|
font-size: clamp(1.35rem, var(--fluid-font-base), 1.6rem);
|
|
20332
20445
|
`;
|
|
20333
|
-
var h32 =
|
|
20446
|
+
var h32 = css95`
|
|
20334
20447
|
font-size: clamp(1.25rem, var(--fluid-font-base), 1.5rem);
|
|
20335
20448
|
`;
|
|
20336
|
-
var h42 =
|
|
20449
|
+
var h42 = css95`
|
|
20337
20450
|
font-size: clamp(1.15rem, var(--fluid-font-base), 1.25rem);
|
|
20338
20451
|
`;
|
|
20339
|
-
var h52 =
|
|
20452
|
+
var h52 = css95`
|
|
20340
20453
|
font-size: clamp(var(--fs-base), var(--fluid-font-base), 1.15rem);
|
|
20341
20454
|
`;
|
|
20342
|
-
var h62 =
|
|
20455
|
+
var h62 = css95`
|
|
20343
20456
|
font-size: var(--fs-base);
|
|
20344
20457
|
`;
|
|
20345
|
-
var heading1Element =
|
|
20458
|
+
var heading1Element = css95`
|
|
20346
20459
|
${h12}
|
|
20347
20460
|
${commonHeadingAttr(true)}
|
|
20348
20461
|
${commonLineHeight}
|
|
20349
20462
|
`;
|
|
20350
|
-
var heading2Element =
|
|
20463
|
+
var heading2Element = css95`
|
|
20351
20464
|
${h22}
|
|
20352
20465
|
${commonHeadingAttr(true)}
|
|
20353
20466
|
${commonLineHeight}
|
|
20354
20467
|
`;
|
|
20355
|
-
var heading3Element =
|
|
20468
|
+
var heading3Element = css95`
|
|
20356
20469
|
${h32}
|
|
20357
20470
|
${commonHeadingAttr(true)}
|
|
20358
20471
|
${commonLineHeight}
|
|
20359
20472
|
`;
|
|
20360
|
-
var heading4Element =
|
|
20473
|
+
var heading4Element = css95`
|
|
20361
20474
|
${h42}
|
|
20362
20475
|
${commonHeadingAttr(true)}
|
|
20363
20476
|
${commonLineHeight}
|
|
20364
20477
|
`;
|
|
20365
|
-
var heading5Element =
|
|
20478
|
+
var heading5Element = css95`
|
|
20366
20479
|
${h52}
|
|
20367
20480
|
${commonHeadingAttr(true)}
|
|
20368
20481
|
${commonLineHeight}
|
|
20369
20482
|
`;
|
|
20370
|
-
var heading6Element =
|
|
20483
|
+
var heading6Element = css95`
|
|
20371
20484
|
${h62}
|
|
20372
20485
|
${commonHeadingAttr(true)}
|
|
20373
20486
|
${commonLineHeight}
|
|
20374
20487
|
`;
|
|
20375
|
-
var paragraphElement =
|
|
20488
|
+
var paragraphElement = css95`
|
|
20376
20489
|
line-height: 1.5;
|
|
20377
20490
|
margin-bottom: var(--spacing-base);
|
|
20378
20491
|
|
|
@@ -20380,7 +20493,7 @@ var paragraphElement = css93`
|
|
|
20380
20493
|
margin-bottom: 0;
|
|
20381
20494
|
}
|
|
20382
20495
|
`;
|
|
20383
|
-
var orderedListElement =
|
|
20496
|
+
var orderedListElement = css95`
|
|
20384
20497
|
${commonLineHeight}
|
|
20385
20498
|
display: block;
|
|
20386
20499
|
list-style: decimal;
|
|
@@ -20409,7 +20522,7 @@ var orderedListElement = css93`
|
|
|
20409
20522
|
}
|
|
20410
20523
|
}
|
|
20411
20524
|
`;
|
|
20412
|
-
var unorderedListElement =
|
|
20525
|
+
var unorderedListElement = css95`
|
|
20413
20526
|
${commonLineHeight}
|
|
20414
20527
|
display: block;
|
|
20415
20528
|
list-style: disc;
|
|
@@ -20430,13 +20543,13 @@ var unorderedListElement = css93`
|
|
|
20430
20543
|
}
|
|
20431
20544
|
}
|
|
20432
20545
|
`;
|
|
20433
|
-
var listItemElement =
|
|
20546
|
+
var listItemElement = css95`
|
|
20434
20547
|
margin-left: var(--spacing-md);
|
|
20435
20548
|
`;
|
|
20436
|
-
var nestedListItemElement =
|
|
20549
|
+
var nestedListItemElement = css95`
|
|
20437
20550
|
list-style-type: none;
|
|
20438
20551
|
`;
|
|
20439
|
-
var blockquoteElement =
|
|
20552
|
+
var blockquoteElement = css95`
|
|
20440
20553
|
border-left: 0.25rem solid var(--gray-300);
|
|
20441
20554
|
color: var(--gray-600);
|
|
20442
20555
|
margin-bottom: var(--spacing-base);
|
|
@@ -20446,7 +20559,7 @@ var blockquoteElement = css93`
|
|
|
20446
20559
|
margin-bottom: 0;
|
|
20447
20560
|
}
|
|
20448
20561
|
`;
|
|
20449
|
-
var codeElement =
|
|
20562
|
+
var codeElement = css95`
|
|
20450
20563
|
background-color: var(--gray-100);
|
|
20451
20564
|
border-radius: var(--rounded-sm);
|
|
20452
20565
|
display: block;
|
|
@@ -20463,7 +20576,7 @@ var codeElement = css93`
|
|
|
20463
20576
|
`;
|
|
20464
20577
|
|
|
20465
20578
|
// src/components/ParameterInputs/rich-text/LinkNodePlugin.tsx
|
|
20466
|
-
import { css as
|
|
20579
|
+
import { css as css96 } from "@emotion/react";
|
|
20467
20580
|
import { useLexicalComposerContext as useLexicalComposerContext2 } from "@lexical/react/LexicalComposerContext";
|
|
20468
20581
|
import { NodeEventPlugin } from "@lexical/react/LexicalNodeEventPlugin";
|
|
20469
20582
|
import { addClassNamesToElement, isHTMLAnchorElement, mergeRegister as mergeRegister2 } from "@lexical/utils";
|
|
@@ -20516,7 +20629,7 @@ var getSelectedNode = (selection) => {
|
|
|
20516
20629
|
};
|
|
20517
20630
|
|
|
20518
20631
|
// src/components/ParameterInputs/rich-text/LinkNodePlugin.tsx
|
|
20519
|
-
import { Fragment as Fragment18, jsx as
|
|
20632
|
+
import { Fragment as Fragment18, jsx as jsx128, jsxs as jsxs85 } from "@emotion/react/jsx-runtime";
|
|
20520
20633
|
var isProjectMapLinkValue = (value) => {
|
|
20521
20634
|
return (value == null ? void 0 : value.type) === "projectMapNode" && Boolean(
|
|
20522
20635
|
value.nodeId && value.path && value.projectMapId
|
|
@@ -20803,16 +20916,16 @@ var OPEN_LINK_NODE_MODAL_COMMAND = createCommand(
|
|
|
20803
20916
|
);
|
|
20804
20917
|
var LINK_POPOVER_OFFSET_X = 0;
|
|
20805
20918
|
var LINK_POPOVER_OFFSET_Y = 8;
|
|
20806
|
-
var linkPopover =
|
|
20919
|
+
var linkPopover = css96`
|
|
20807
20920
|
position: absolute;
|
|
20808
20921
|
z-index: 5;
|
|
20809
20922
|
`;
|
|
20810
|
-
var linkPopoverContainer =
|
|
20923
|
+
var linkPopoverContainer = css96`
|
|
20811
20924
|
${Popover()};
|
|
20812
20925
|
align-items: center;
|
|
20813
20926
|
display: flex;
|
|
20814
20927
|
`;
|
|
20815
|
-
var linkPopoverAnchor =
|
|
20928
|
+
var linkPopoverAnchor = css96`
|
|
20816
20929
|
${link}
|
|
20817
20930
|
${linkColorDefault}
|
|
20818
20931
|
`;
|
|
@@ -20959,8 +21072,8 @@ function LinkNodePlugin({ onConnectLink, getBoundPath }) {
|
|
|
20959
21072
|
});
|
|
20960
21073
|
});
|
|
20961
21074
|
};
|
|
20962
|
-
return /* @__PURE__ */
|
|
20963
|
-
/* @__PURE__ */
|
|
21075
|
+
return /* @__PURE__ */ jsxs85(Fragment18, { children: [
|
|
21076
|
+
/* @__PURE__ */ jsx128(
|
|
20964
21077
|
NodeEventPlugin,
|
|
20965
21078
|
{
|
|
20966
21079
|
nodeType: LinkNode,
|
|
@@ -20970,7 +21083,7 @@ function LinkNodePlugin({ onConnectLink, getBoundPath }) {
|
|
|
20970
21083
|
}
|
|
20971
21084
|
}
|
|
20972
21085
|
),
|
|
20973
|
-
linkPopoverState ? /* @__PURE__ */
|
|
21086
|
+
linkPopoverState ? /* @__PURE__ */ jsx128(
|
|
20974
21087
|
"div",
|
|
20975
21088
|
{
|
|
20976
21089
|
css: linkPopover,
|
|
@@ -20979,8 +21092,8 @@ function LinkNodePlugin({ onConnectLink, getBoundPath }) {
|
|
|
20979
21092
|
top: linkPopoverState.position.y
|
|
20980
21093
|
},
|
|
20981
21094
|
ref: linkPopoverElRef,
|
|
20982
|
-
children: /* @__PURE__ */
|
|
20983
|
-
linkPopoverState.node.__link.type === "projectMapNode" ? linkPopoverState.node.__link.path : /* @__PURE__ */
|
|
21095
|
+
children: /* @__PURE__ */ jsxs85("div", { css: linkPopoverContainer, children: [
|
|
21096
|
+
linkPopoverState.node.__link.type === "projectMapNode" ? linkPopoverState.node.__link.path : /* @__PURE__ */ jsx128(
|
|
20984
21097
|
"a",
|
|
20985
21098
|
{
|
|
20986
21099
|
href: parsePath(
|
|
@@ -20992,7 +21105,7 @@ function LinkNodePlugin({ onConnectLink, getBoundPath }) {
|
|
|
20992
21105
|
children: parsePath(linkPopoverState.node.__link.path)
|
|
20993
21106
|
}
|
|
20994
21107
|
),
|
|
20995
|
-
/* @__PURE__ */
|
|
21108
|
+
/* @__PURE__ */ jsx128(
|
|
20996
21109
|
Button,
|
|
20997
21110
|
{
|
|
20998
21111
|
size: "xs",
|
|
@@ -21000,7 +21113,7 @@ function LinkNodePlugin({ onConnectLink, getBoundPath }) {
|
|
|
21000
21113
|
onEditLinkNode(linkPopoverState.node);
|
|
21001
21114
|
},
|
|
21002
21115
|
buttonType: "ghost",
|
|
21003
|
-
children: /* @__PURE__ */
|
|
21116
|
+
children: /* @__PURE__ */ jsx128(Icon, { icon: "pen", size: "1rem", title: "Edit link" })
|
|
21004
21117
|
}
|
|
21005
21118
|
)
|
|
21006
21119
|
] })
|
|
@@ -21025,7 +21138,7 @@ import {
|
|
|
21025
21138
|
INDENT_CONTENT_COMMAND
|
|
21026
21139
|
} from "lexical";
|
|
21027
21140
|
import { useEffect as useEffect19 } from "react";
|
|
21028
|
-
import { jsx as
|
|
21141
|
+
import { jsx as jsx129 } from "@emotion/react/jsx-runtime";
|
|
21029
21142
|
function isIndentPermitted(maxDepth) {
|
|
21030
21143
|
const selection = $getSelection2();
|
|
21031
21144
|
if (!$isRangeSelection2(selection)) {
|
|
@@ -21055,11 +21168,11 @@ function ListIndentPlugin({ maxDepth }) {
|
|
|
21055
21168
|
COMMAND_PRIORITY_CRITICAL
|
|
21056
21169
|
);
|
|
21057
21170
|
}, [editor, maxDepth]);
|
|
21058
|
-
return /* @__PURE__ */
|
|
21171
|
+
return /* @__PURE__ */ jsx129(TabIndentationPlugin, {});
|
|
21059
21172
|
}
|
|
21060
21173
|
|
|
21061
21174
|
// src/components/ParameterInputs/rich-text/RichTextToolbar.tsx
|
|
21062
|
-
import { css as
|
|
21175
|
+
import { css as css97 } from "@emotion/react";
|
|
21063
21176
|
import { $createCodeNode } from "@lexical/code";
|
|
21064
21177
|
import {
|
|
21065
21178
|
$isListNode as $isListNode2,
|
|
@@ -21082,8 +21195,8 @@ import {
|
|
|
21082
21195
|
SELECTION_CHANGE_COMMAND
|
|
21083
21196
|
} from "lexical";
|
|
21084
21197
|
import { useCallback as useCallback11, useEffect as useEffect20, useMemo as useMemo6, useState as useState17 } from "react";
|
|
21085
|
-
import { Fragment as Fragment19, jsx as
|
|
21086
|
-
var toolbar =
|
|
21198
|
+
import { Fragment as Fragment19, jsx as jsx130, jsxs as jsxs86 } from "@emotion/react/jsx-runtime";
|
|
21199
|
+
var toolbar = css97`
|
|
21087
21200
|
background: var(--gray-50);
|
|
21088
21201
|
border-radius: var(--rounded-base);
|
|
21089
21202
|
display: flex;
|
|
@@ -21095,7 +21208,7 @@ var toolbar = css95`
|
|
|
21095
21208
|
top: calc(var(--spacing-sm) * -2);
|
|
21096
21209
|
z-index: 10;
|
|
21097
21210
|
`;
|
|
21098
|
-
var toolbarGroup =
|
|
21211
|
+
var toolbarGroup = css97`
|
|
21099
21212
|
display: flex;
|
|
21100
21213
|
gap: var(--spacing-xs);
|
|
21101
21214
|
position: relative;
|
|
@@ -21111,7 +21224,7 @@ var toolbarGroup = css95`
|
|
|
21111
21224
|
width: 1px;
|
|
21112
21225
|
}
|
|
21113
21226
|
`;
|
|
21114
|
-
var richTextToolbarButton =
|
|
21227
|
+
var richTextToolbarButton = css97`
|
|
21115
21228
|
align-items: center;
|
|
21116
21229
|
appearance: none;
|
|
21117
21230
|
border: 0;
|
|
@@ -21124,17 +21237,17 @@ var richTextToolbarButton = css95`
|
|
|
21124
21237
|
min-width: 32px;
|
|
21125
21238
|
padding: 0 var(--spacing-sm);
|
|
21126
21239
|
`;
|
|
21127
|
-
var richTextToolbarButtonActive =
|
|
21240
|
+
var richTextToolbarButtonActive = css97`
|
|
21128
21241
|
background: var(--gray-200);
|
|
21129
21242
|
`;
|
|
21130
|
-
var toolbarIcon =
|
|
21243
|
+
var toolbarIcon = css97`
|
|
21131
21244
|
color: inherit;
|
|
21132
21245
|
`;
|
|
21133
|
-
var toolbarChevron =
|
|
21246
|
+
var toolbarChevron = css97`
|
|
21134
21247
|
margin-left: var(--spacing-xs);
|
|
21135
21248
|
`;
|
|
21136
21249
|
var RichTextToolbarIcon = ({ icon }) => {
|
|
21137
|
-
return /* @__PURE__ */
|
|
21250
|
+
return /* @__PURE__ */ jsx130(Icon, { icon, css: toolbarIcon, size: "1rem" });
|
|
21138
21251
|
};
|
|
21139
21252
|
var FORMATS_WITH_ICON = /* @__PURE__ */ new Map([
|
|
21140
21253
|
["bold", "format-bold"],
|
|
@@ -21243,15 +21356,15 @@ var RichTextToolbar = ({ config, customControls }) => {
|
|
|
21243
21356
|
});
|
|
21244
21357
|
});
|
|
21245
21358
|
}, [editor, updateToolbar]);
|
|
21246
|
-
return /* @__PURE__ */
|
|
21247
|
-
/* @__PURE__ */
|
|
21359
|
+
return /* @__PURE__ */ jsxs86("div", { css: toolbar, children: [
|
|
21360
|
+
/* @__PURE__ */ jsxs86(
|
|
21248
21361
|
Menu,
|
|
21249
21362
|
{
|
|
21250
21363
|
menuLabel: "Elements",
|
|
21251
|
-
menuTrigger: /* @__PURE__ */
|
|
21364
|
+
menuTrigger: /* @__PURE__ */ jsxs86("button", { css: richTextToolbarButton, title: "Text styles", children: [
|
|
21252
21365
|
visibleTextualElements.some((element) => element.type === activeElement) ? getLabelForElement(activeElement) : getLabelForElement("paragraph"),
|
|
21253
21366
|
" ",
|
|
21254
|
-
/* @__PURE__ */
|
|
21367
|
+
/* @__PURE__ */ jsx130(Icon, { icon: "chevron-down", css: [toolbarIcon, toolbarChevron], size: "1rem" })
|
|
21255
21368
|
] }),
|
|
21256
21369
|
placement: "bottom-start",
|
|
21257
21370
|
children: [
|
|
@@ -21261,7 +21374,7 @@ var RichTextToolbar = ({ config, customControls }) => {
|
|
|
21261
21374
|
type: "paragraph"
|
|
21262
21375
|
},
|
|
21263
21376
|
...visibleTextualElements
|
|
21264
|
-
].map((element) => /* @__PURE__ */
|
|
21377
|
+
].map((element) => /* @__PURE__ */ jsx130(
|
|
21265
21378
|
MenuItem,
|
|
21266
21379
|
{
|
|
21267
21380
|
onClick: () => {
|
|
@@ -21271,12 +21384,12 @@ var RichTextToolbar = ({ config, customControls }) => {
|
|
|
21271
21384
|
},
|
|
21272
21385
|
element.type
|
|
21273
21386
|
)),
|
|
21274
|
-
visibleTextualElements.length === 0 ? /* @__PURE__ */
|
|
21387
|
+
visibleTextualElements.length === 0 ? /* @__PURE__ */ jsx130(MenuItem, { disabled: true, children: "Alternative text styles are not available" }) : null
|
|
21275
21388
|
]
|
|
21276
21389
|
}
|
|
21277
21390
|
),
|
|
21278
|
-
visibleFormatsWithIcon.length > 0 || visibleFormatsWithoutIcon.length > 0 ? /* @__PURE__ */
|
|
21279
|
-
visibleFormatsWithIcon.map((format) => /* @__PURE__ */
|
|
21391
|
+
visibleFormatsWithIcon.length > 0 || visibleFormatsWithoutIcon.length > 0 ? /* @__PURE__ */ jsxs86("div", { css: toolbarGroup, children: [
|
|
21392
|
+
visibleFormatsWithIcon.map((format) => /* @__PURE__ */ jsx130(Tooltip, { title: format.label, placement: "top", children: /* @__PURE__ */ jsx130(
|
|
21280
21393
|
"button",
|
|
21281
21394
|
{
|
|
21282
21395
|
onClick: () => {
|
|
@@ -21286,16 +21399,16 @@ var RichTextToolbar = ({ config, customControls }) => {
|
|
|
21286
21399
|
richTextToolbarButton,
|
|
21287
21400
|
activeFormats.includes(format.type) ? richTextToolbarButtonActive : null
|
|
21288
21401
|
],
|
|
21289
|
-
children: /* @__PURE__ */
|
|
21402
|
+
children: /* @__PURE__ */ jsx130(RichTextToolbarIcon, { icon: FORMATS_WITH_ICON.get(format.type) })
|
|
21290
21403
|
}
|
|
21291
21404
|
) }, format.type)),
|
|
21292
|
-
visibleFormatsWithoutIcon.length > 0 ? /* @__PURE__ */
|
|
21405
|
+
visibleFormatsWithoutIcon.length > 0 ? /* @__PURE__ */ jsx130(
|
|
21293
21406
|
Menu,
|
|
21294
21407
|
{
|
|
21295
21408
|
menuLabel: "Alternative text styles",
|
|
21296
|
-
menuTrigger: /* @__PURE__ */
|
|
21409
|
+
menuTrigger: /* @__PURE__ */ jsx130("button", { css: richTextToolbarButton, title: "Alternative text styles", children: /* @__PURE__ */ jsx130(Icon, { icon: "more-alt", css: toolbarIcon }) }),
|
|
21297
21410
|
placement: "bottom-start",
|
|
21298
|
-
children: visibleFormatsWithoutIcon.map((format) => /* @__PURE__ */
|
|
21411
|
+
children: visibleFormatsWithoutIcon.map((format) => /* @__PURE__ */ jsx130(
|
|
21299
21412
|
MenuItem,
|
|
21300
21413
|
{
|
|
21301
21414
|
onClick: () => {
|
|
@@ -21308,19 +21421,19 @@ var RichTextToolbar = ({ config, customControls }) => {
|
|
|
21308
21421
|
}
|
|
21309
21422
|
) : null
|
|
21310
21423
|
] }) : null,
|
|
21311
|
-
visibleElementsWithIcons.size > 0 ? /* @__PURE__ */
|
|
21312
|
-
linkElementVisible ? /* @__PURE__ */
|
|
21424
|
+
visibleElementsWithIcons.size > 0 ? /* @__PURE__ */ jsxs86("div", { css: toolbarGroup, children: [
|
|
21425
|
+
linkElementVisible ? /* @__PURE__ */ jsx130(Tooltip, { title: "Link", placement: "top", children: /* @__PURE__ */ jsx130(
|
|
21313
21426
|
"button",
|
|
21314
21427
|
{
|
|
21315
21428
|
onClick: () => {
|
|
21316
21429
|
isLink ? editor.dispatchCommand(REMOVE_LINK_NODE_COMMAND, {}) : editor.dispatchCommand(OPEN_LINK_NODE_MODAL_COMMAND, {});
|
|
21317
21430
|
},
|
|
21318
21431
|
css: [richTextToolbarButton, isLink ? richTextToolbarButtonActive : null],
|
|
21319
|
-
children: /* @__PURE__ */
|
|
21432
|
+
children: /* @__PURE__ */ jsx130(RichTextToolbarIcon, { icon: "link" })
|
|
21320
21433
|
}
|
|
21321
21434
|
) }) : null,
|
|
21322
|
-
visibleLists.size > 0 ? /* @__PURE__ */
|
|
21323
|
-
visibleLists.has("unorderedList") ? /* @__PURE__ */
|
|
21435
|
+
visibleLists.size > 0 ? /* @__PURE__ */ jsxs86(Fragment19, { children: [
|
|
21436
|
+
visibleLists.has("unorderedList") ? /* @__PURE__ */ jsx130(Tooltip, { title: "Bullet List", placement: "top", children: /* @__PURE__ */ jsx130(
|
|
21324
21437
|
"button",
|
|
21325
21438
|
{
|
|
21326
21439
|
onClick: () => {
|
|
@@ -21330,10 +21443,10 @@ var RichTextToolbar = ({ config, customControls }) => {
|
|
|
21330
21443
|
richTextToolbarButton,
|
|
21331
21444
|
activeElement === "unorderedList" ? richTextToolbarButtonActive : null
|
|
21332
21445
|
],
|
|
21333
|
-
children: /* @__PURE__ */
|
|
21446
|
+
children: /* @__PURE__ */ jsx130(RichTextToolbarIcon, { icon: "layout-list" })
|
|
21334
21447
|
}
|
|
21335
21448
|
) }) : null,
|
|
21336
|
-
visibleLists.has("orderedList") ? /* @__PURE__ */
|
|
21449
|
+
visibleLists.has("orderedList") ? /* @__PURE__ */ jsx130(Tooltip, { title: "Ordered List", placement: "top", children: /* @__PURE__ */ jsx130(
|
|
21337
21450
|
"button",
|
|
21338
21451
|
{
|
|
21339
21452
|
onClick: () => {
|
|
@@ -21343,32 +21456,32 @@ var RichTextToolbar = ({ config, customControls }) => {
|
|
|
21343
21456
|
richTextToolbarButton,
|
|
21344
21457
|
activeElement === "orderedList" ? richTextToolbarButtonActive : null
|
|
21345
21458
|
],
|
|
21346
|
-
children: /* @__PURE__ */
|
|
21459
|
+
children: /* @__PURE__ */ jsx130(RichTextToolbarIcon, { icon: "layout-list-numbered" })
|
|
21347
21460
|
}
|
|
21348
21461
|
) }) : null
|
|
21349
21462
|
] }) : null,
|
|
21350
|
-
quoteElementVisible ? /* @__PURE__ */
|
|
21463
|
+
quoteElementVisible ? /* @__PURE__ */ jsx130(Tooltip, { title: "Blockquote", placement: "top", children: /* @__PURE__ */ jsx130(
|
|
21351
21464
|
"button",
|
|
21352
21465
|
{
|
|
21353
21466
|
onClick: () => {
|
|
21354
21467
|
activeElement === "quote" ? onSelectElement("paragraph") : onSelectElement("quote");
|
|
21355
21468
|
},
|
|
21356
21469
|
css: [richTextToolbarButton, activeElement === "quote" ? richTextToolbarButtonActive : null],
|
|
21357
|
-
children: /* @__PURE__ */
|
|
21470
|
+
children: /* @__PURE__ */ jsx130(RichTextToolbarIcon, { icon: "quote" })
|
|
21358
21471
|
}
|
|
21359
21472
|
) }) : null,
|
|
21360
|
-
codeElementVisible ? /* @__PURE__ */
|
|
21473
|
+
codeElementVisible ? /* @__PURE__ */ jsx130(Tooltip, { title: "Code Block", placement: "top", children: /* @__PURE__ */ jsx130(
|
|
21361
21474
|
"button",
|
|
21362
21475
|
{
|
|
21363
21476
|
onClick: () => {
|
|
21364
21477
|
activeElement === "code" ? onSelectElement("paragraph") : onSelectElement("code");
|
|
21365
21478
|
},
|
|
21366
21479
|
css: [richTextToolbarButton, activeElement === "code" ? richTextToolbarButtonActive : null],
|
|
21367
|
-
children: /* @__PURE__ */
|
|
21480
|
+
children: /* @__PURE__ */ jsx130(RichTextToolbarIcon, { icon: "code-slash" })
|
|
21368
21481
|
}
|
|
21369
21482
|
) }) : null
|
|
21370
21483
|
] }) : null,
|
|
21371
|
-
customControls ? /* @__PURE__ */
|
|
21484
|
+
customControls ? /* @__PURE__ */ jsx130("div", { css: toolbarGroup, children: customControls }) : null
|
|
21372
21485
|
] });
|
|
21373
21486
|
};
|
|
21374
21487
|
var RichTextToolbar_default = RichTextToolbar;
|
|
@@ -21482,7 +21595,7 @@ var useRichTextToolbarState = ({ config }) => {
|
|
|
21482
21595
|
};
|
|
21483
21596
|
|
|
21484
21597
|
// src/components/ParameterInputs/ParameterRichText.tsx
|
|
21485
|
-
import { Fragment as Fragment20, jsx as
|
|
21598
|
+
import { Fragment as Fragment20, jsx as jsx131, jsxs as jsxs87 } from "@emotion/react/jsx-runtime";
|
|
21486
21599
|
var ParameterRichText = ({
|
|
21487
21600
|
label,
|
|
21488
21601
|
labelLeadingIcon,
|
|
@@ -21507,7 +21620,7 @@ var ParameterRichText = ({
|
|
|
21507
21620
|
variables,
|
|
21508
21621
|
customControls
|
|
21509
21622
|
}) => {
|
|
21510
|
-
return /* @__PURE__ */
|
|
21623
|
+
return /* @__PURE__ */ jsxs87(
|
|
21511
21624
|
ParameterShell,
|
|
21512
21625
|
{
|
|
21513
21626
|
"data-testid": "parameter-richtext",
|
|
@@ -21521,7 +21634,7 @@ var ParameterRichText = ({
|
|
|
21521
21634
|
captionTestId,
|
|
21522
21635
|
menuItems,
|
|
21523
21636
|
children: [
|
|
21524
|
-
/* @__PURE__ */
|
|
21637
|
+
/* @__PURE__ */ jsx131(
|
|
21525
21638
|
ParameterRichTextInner,
|
|
21526
21639
|
{
|
|
21527
21640
|
value,
|
|
@@ -21539,23 +21652,23 @@ var ParameterRichText = ({
|
|
|
21539
21652
|
children
|
|
21540
21653
|
}
|
|
21541
21654
|
),
|
|
21542
|
-
menuItems ? /* @__PURE__ */
|
|
21655
|
+
menuItems ? /* @__PURE__ */ jsx131(ParameterMenuButton, { label: `${label} menu`, children: /* @__PURE__ */ jsx131(Fragment20, { children: menuItems }) }) : null
|
|
21543
21656
|
]
|
|
21544
21657
|
}
|
|
21545
21658
|
);
|
|
21546
21659
|
};
|
|
21547
|
-
var editorWrapper =
|
|
21660
|
+
var editorWrapper = css98`
|
|
21548
21661
|
display: flex;
|
|
21549
21662
|
flex-flow: column;
|
|
21550
21663
|
flex-grow: 1;
|
|
21551
21664
|
`;
|
|
21552
|
-
var editorContainer =
|
|
21665
|
+
var editorContainer = css98`
|
|
21553
21666
|
display: flex;
|
|
21554
21667
|
flex-flow: column;
|
|
21555
21668
|
flex-grow: 1;
|
|
21556
21669
|
position: relative;
|
|
21557
21670
|
`;
|
|
21558
|
-
var editorPlaceholder =
|
|
21671
|
+
var editorPlaceholder = css98`
|
|
21559
21672
|
color: var(--gray-500);
|
|
21560
21673
|
font-style: italic;
|
|
21561
21674
|
/* 1px is added to make sure caret is clearly visible when field is focused
|
|
@@ -21566,7 +21679,7 @@ var editorPlaceholder = css96`
|
|
|
21566
21679
|
top: var(--spacing-sm);
|
|
21567
21680
|
user-select: none;
|
|
21568
21681
|
`;
|
|
21569
|
-
var editorInput =
|
|
21682
|
+
var editorInput = css98`
|
|
21570
21683
|
background: var(--white);
|
|
21571
21684
|
border: 1px solid var(--gray-200);
|
|
21572
21685
|
border-radius: var(--rounded-sm);
|
|
@@ -21650,8 +21763,8 @@ var ParameterRichTextInner = ({
|
|
|
21650
21763
|
},
|
|
21651
21764
|
editable: !readOnly
|
|
21652
21765
|
};
|
|
21653
|
-
return /* @__PURE__ */
|
|
21654
|
-
/* @__PURE__ */
|
|
21766
|
+
return /* @__PURE__ */ jsxs87(Fragment20, { children: [
|
|
21767
|
+
/* @__PURE__ */ jsx131("div", { css: [editorWrapper], className: editorWrapperClassName, children: /* @__PURE__ */ jsx131(LexicalComposer, { initialConfig: lexicalConfig, children: /* @__PURE__ */ jsx131(
|
|
21655
21768
|
RichText,
|
|
21656
21769
|
{
|
|
21657
21770
|
onChange,
|
|
@@ -21710,20 +21823,20 @@ var RichText = ({
|
|
|
21710
21823
|
useEffect21(() => {
|
|
21711
21824
|
editor.setEditable(!readOnly);
|
|
21712
21825
|
}, [editor, readOnly]);
|
|
21713
|
-
return /* @__PURE__ */
|
|
21714
|
-
readOnly ? null : /* @__PURE__ */
|
|
21715
|
-
/* @__PURE__ */
|
|
21716
|
-
/* @__PURE__ */
|
|
21826
|
+
return /* @__PURE__ */ jsxs87(Fragment20, { children: [
|
|
21827
|
+
readOnly ? null : /* @__PURE__ */ jsx131(RichTextToolbar_default, { config, customControls }),
|
|
21828
|
+
/* @__PURE__ */ jsxs87("div", { css: editorContainer, ref: editorContainerRef, "data-testid": "value-container", children: [
|
|
21829
|
+
/* @__PURE__ */ jsx131(
|
|
21717
21830
|
RichTextPlugin,
|
|
21718
21831
|
{
|
|
21719
|
-
contentEditable: /* @__PURE__ */
|
|
21720
|
-
placeholder: /* @__PURE__ */
|
|
21832
|
+
contentEditable: /* @__PURE__ */ jsx131(ContentEditable, { css: editorInput, className: editorInputClassName }),
|
|
21833
|
+
placeholder: /* @__PURE__ */ jsx131("div", { css: editorPlaceholder, children: readOnly ? "empty" : "start editing..." }),
|
|
21721
21834
|
ErrorBoundary: LexicalErrorBoundary
|
|
21722
21835
|
}
|
|
21723
21836
|
),
|
|
21724
|
-
/* @__PURE__ */
|
|
21725
|
-
readOnly ? null : /* @__PURE__ */
|
|
21726
|
-
/* @__PURE__ */
|
|
21837
|
+
/* @__PURE__ */ jsx131(ListPlugin, {}),
|
|
21838
|
+
readOnly ? null : /* @__PURE__ */ jsx131(HistoryPlugin, {}),
|
|
21839
|
+
/* @__PURE__ */ jsx131(
|
|
21727
21840
|
LinkNodePlugin,
|
|
21728
21841
|
{
|
|
21729
21842
|
onConnectLink: onConnectLink ? onConnectLink : () => Promise.resolve(),
|
|
@@ -21733,27 +21846,27 @@ var RichText = ({
|
|
|
21733
21846
|
} : void 0
|
|
21734
21847
|
}
|
|
21735
21848
|
),
|
|
21736
|
-
/* @__PURE__ */
|
|
21737
|
-
/* @__PURE__ */
|
|
21738
|
-
/* @__PURE__ */
|
|
21739
|
-
/* @__PURE__ */
|
|
21849
|
+
/* @__PURE__ */ jsx131(ListIndentPlugin, { maxDepth: 4 }),
|
|
21850
|
+
/* @__PURE__ */ jsx131(DisableStylesPlugin, {}),
|
|
21851
|
+
/* @__PURE__ */ jsx131(MarkdownShortcutPlugin, { transformers: MARKDOWN_TRANSFORMERS }),
|
|
21852
|
+
/* @__PURE__ */ jsx131(Fragment20, { children })
|
|
21740
21853
|
] })
|
|
21741
21854
|
] });
|
|
21742
21855
|
};
|
|
21743
21856
|
|
|
21744
21857
|
// src/components/ParameterInputs/ParameterSelect.tsx
|
|
21745
21858
|
import { forwardRef as forwardRef22 } from "react";
|
|
21746
|
-
import { jsx as
|
|
21859
|
+
import { jsx as jsx132, jsxs as jsxs88 } from "@emotion/react/jsx-runtime";
|
|
21747
21860
|
var ParameterSelect = forwardRef22(
|
|
21748
21861
|
({ defaultOption, options, ...props }, ref) => {
|
|
21749
21862
|
const { shellProps, innerProps } = extractParameterProps(props);
|
|
21750
|
-
return /* @__PURE__ */
|
|
21863
|
+
return /* @__PURE__ */ jsx132(ParameterShell, { ...shellProps, children: /* @__PURE__ */ jsx132(ParameterSelectInner, { options, defaultOption, ...innerProps, ref }) });
|
|
21751
21864
|
}
|
|
21752
21865
|
);
|
|
21753
21866
|
var ParameterSelectInner = forwardRef22(
|
|
21754
21867
|
({ defaultOption, options, ...props }, ref) => {
|
|
21755
21868
|
const { id, label, hiddenLabel } = useParameterShell();
|
|
21756
|
-
return /* @__PURE__ */
|
|
21869
|
+
return /* @__PURE__ */ jsxs88(
|
|
21757
21870
|
"select",
|
|
21758
21871
|
{
|
|
21759
21872
|
css: [input3, selectInput],
|
|
@@ -21762,10 +21875,10 @@ var ParameterSelectInner = forwardRef22(
|
|
|
21762
21875
|
ref,
|
|
21763
21876
|
...props,
|
|
21764
21877
|
children: [
|
|
21765
|
-
defaultOption ? /* @__PURE__ */
|
|
21878
|
+
defaultOption ? /* @__PURE__ */ jsx132("option", { value: "", children: defaultOption }) : null,
|
|
21766
21879
|
options.map((option) => {
|
|
21767
21880
|
var _a;
|
|
21768
|
-
return /* @__PURE__ */
|
|
21881
|
+
return /* @__PURE__ */ jsx132("option", { value: (_a = option.value) != null ? _a : option.label, children: option.label }, option.label);
|
|
21769
21882
|
})
|
|
21770
21883
|
]
|
|
21771
21884
|
}
|
|
@@ -21775,14 +21888,14 @@ var ParameterSelectInner = forwardRef22(
|
|
|
21775
21888
|
|
|
21776
21889
|
// src/components/ParameterInputs/ParameterTextarea.tsx
|
|
21777
21890
|
import { forwardRef as forwardRef23 } from "react";
|
|
21778
|
-
import { jsx as
|
|
21891
|
+
import { jsx as jsx133 } from "@emotion/react/jsx-runtime";
|
|
21779
21892
|
var ParameterTextarea = forwardRef23((props, ref) => {
|
|
21780
21893
|
const { shellProps, innerProps } = extractParameterProps(props);
|
|
21781
|
-
return /* @__PURE__ */
|
|
21894
|
+
return /* @__PURE__ */ jsx133(ParameterShell, { "data-testid": "parameter-textarea", ...shellProps, children: /* @__PURE__ */ jsx133(ParameterTextareaInner, { ref, ...innerProps }) });
|
|
21782
21895
|
});
|
|
21783
21896
|
var ParameterTextareaInner = forwardRef23(({ ...props }, ref) => {
|
|
21784
21897
|
const { id, label, hiddenLabel } = useParameterShell();
|
|
21785
|
-
return /* @__PURE__ */
|
|
21898
|
+
return /* @__PURE__ */ jsx133(
|
|
21786
21899
|
"textarea",
|
|
21787
21900
|
{
|
|
21788
21901
|
css: [input3, textarea2],
|
|
@@ -21796,25 +21909,25 @@ var ParameterTextareaInner = forwardRef23(({ ...props }, ref) => {
|
|
|
21796
21909
|
|
|
21797
21910
|
// src/components/ParameterInputs/ParameterToggle.tsx
|
|
21798
21911
|
import { forwardRef as forwardRef24 } from "react";
|
|
21799
|
-
import { jsx as
|
|
21912
|
+
import { jsx as jsx134, jsxs as jsxs89 } from "@emotion/react/jsx-runtime";
|
|
21800
21913
|
var ParameterToggle = forwardRef24((props, ref) => {
|
|
21801
21914
|
const { shellProps, innerProps } = extractParameterProps(props);
|
|
21802
|
-
return /* @__PURE__ */
|
|
21915
|
+
return /* @__PURE__ */ jsx134(ParameterShell, { ...shellProps, children: /* @__PURE__ */ jsx134(ParameterToggleInner, { ref, ...innerProps }) });
|
|
21803
21916
|
});
|
|
21804
21917
|
var ParameterToggleInner = forwardRef24(
|
|
21805
21918
|
({ children, ...props }, ref) => {
|
|
21806
21919
|
const { id, label } = useParameterShell();
|
|
21807
|
-
return /* @__PURE__ */
|
|
21808
|
-
/* @__PURE__ */
|
|
21809
|
-
/* @__PURE__ */
|
|
21920
|
+
return /* @__PURE__ */ jsxs89("label", { css: inputToggleLabel2, children: [
|
|
21921
|
+
/* @__PURE__ */ jsx134("input", { css: toggleInput2, type: props.type, id, ref, ...props }),
|
|
21922
|
+
/* @__PURE__ */ jsx134("span", { css: inlineLabel2, children: label }),
|
|
21810
21923
|
children
|
|
21811
21924
|
] });
|
|
21812
21925
|
}
|
|
21813
21926
|
);
|
|
21814
21927
|
|
|
21815
21928
|
// src/components/ProgressBar/ProgressBar.styles.ts
|
|
21816
|
-
import { css as
|
|
21817
|
-
var container3 =
|
|
21929
|
+
import { css as css99, keyframes as keyframes4 } from "@emotion/react";
|
|
21930
|
+
var container3 = css99`
|
|
21818
21931
|
background: var(--gray-50);
|
|
21819
21932
|
margin-block: var(--spacing-sm);
|
|
21820
21933
|
position: relative;
|
|
@@ -21824,13 +21937,13 @@ var container3 = css97`
|
|
|
21824
21937
|
border: solid 1px var(--gray-300);
|
|
21825
21938
|
`;
|
|
21826
21939
|
var themeMap = {
|
|
21827
|
-
primary:
|
|
21940
|
+
primary: css99`
|
|
21828
21941
|
--progress-color: var(--accent-light);
|
|
21829
21942
|
`,
|
|
21830
|
-
secondary:
|
|
21943
|
+
secondary: css99`
|
|
21831
21944
|
--progress-color: var(--accent-alt-light);
|
|
21832
21945
|
`,
|
|
21833
|
-
destructive:
|
|
21946
|
+
destructive: css99`
|
|
21834
21947
|
--progress-color: var(--brand-secondary-5);
|
|
21835
21948
|
`
|
|
21836
21949
|
};
|
|
@@ -21842,10 +21955,10 @@ var slidingBackgroundPosition = keyframes4`
|
|
|
21842
21955
|
background-position: 64px 0;
|
|
21843
21956
|
}
|
|
21844
21957
|
`;
|
|
21845
|
-
var determinate =
|
|
21958
|
+
var determinate = css99`
|
|
21846
21959
|
background-color: var(--progress-color);
|
|
21847
21960
|
`;
|
|
21848
|
-
var indeterminate =
|
|
21961
|
+
var indeterminate = css99`
|
|
21849
21962
|
background-image: linear-gradient(
|
|
21850
21963
|
45deg,
|
|
21851
21964
|
var(--progress-color) 25%,
|
|
@@ -21859,7 +21972,7 @@ var indeterminate = css97`
|
|
|
21859
21972
|
background-size: 64px 64px;
|
|
21860
21973
|
animation: ${slidingBackgroundPosition} 1s linear infinite;
|
|
21861
21974
|
`;
|
|
21862
|
-
var bar =
|
|
21975
|
+
var bar = css99`
|
|
21863
21976
|
position: absolute;
|
|
21864
21977
|
inset: 0;
|
|
21865
21978
|
transition: transform var(--duration-fast) var(--timing-ease-out);
|
|
@@ -21867,7 +21980,7 @@ var bar = css97`
|
|
|
21867
21980
|
`;
|
|
21868
21981
|
|
|
21869
21982
|
// src/components/ProgressBar/ProgressBar.tsx
|
|
21870
|
-
import { jsx as
|
|
21983
|
+
import { jsx as jsx135 } from "@emotion/react/jsx-runtime";
|
|
21871
21984
|
function ProgressBar({
|
|
21872
21985
|
current,
|
|
21873
21986
|
max,
|
|
@@ -21877,7 +21990,7 @@ function ProgressBar({
|
|
|
21877
21990
|
}) {
|
|
21878
21991
|
const valueNow = Math.min(current, max);
|
|
21879
21992
|
const valuePercentage = max > 0 ? Math.ceil(100 / max * valueNow) : 0;
|
|
21880
|
-
return /* @__PURE__ */
|
|
21993
|
+
return /* @__PURE__ */ jsx135(
|
|
21881
21994
|
"div",
|
|
21882
21995
|
{
|
|
21883
21996
|
css: container3,
|
|
@@ -21888,7 +22001,7 @@ function ProgressBar({
|
|
|
21888
22001
|
"aria-valuemax": max,
|
|
21889
22002
|
"aria-valuenow": valueNow,
|
|
21890
22003
|
...props,
|
|
21891
|
-
children: /* @__PURE__ */
|
|
22004
|
+
children: /* @__PURE__ */ jsx135(
|
|
21892
22005
|
"div",
|
|
21893
22006
|
{
|
|
21894
22007
|
css: [
|
|
@@ -21907,28 +22020,28 @@ function ProgressBar({
|
|
|
21907
22020
|
}
|
|
21908
22021
|
|
|
21909
22022
|
// src/components/ProgressList/ProgressList.tsx
|
|
21910
|
-
import { css as
|
|
22023
|
+
import { css as css101 } from "@emotion/react";
|
|
21911
22024
|
import { CgCheckO as CgCheckO2 } from "@react-icons/all-files/cg/CgCheckO";
|
|
21912
22025
|
import { CgRadioCheck } from "@react-icons/all-files/cg/CgRadioCheck";
|
|
21913
22026
|
import { CgRecord } from "@react-icons/all-files/cg/CgRecord";
|
|
21914
22027
|
import { useMemo as useMemo7 } from "react";
|
|
21915
22028
|
|
|
21916
22029
|
// src/components/ProgressList/styles/ProgressList.styles.ts
|
|
21917
|
-
import { css as
|
|
21918
|
-
var progressListStyles =
|
|
22030
|
+
import { css as css100 } from "@emotion/react";
|
|
22031
|
+
var progressListStyles = css100`
|
|
21919
22032
|
display: flex;
|
|
21920
22033
|
flex-direction: column;
|
|
21921
22034
|
gap: var(--spacing-sm);
|
|
21922
22035
|
list-style-type: none;
|
|
21923
22036
|
`;
|
|
21924
|
-
var progressListItemStyles =
|
|
22037
|
+
var progressListItemStyles = css100`
|
|
21925
22038
|
display: flex;
|
|
21926
22039
|
gap: var(--spacing-base);
|
|
21927
22040
|
align-items: center;
|
|
21928
22041
|
`;
|
|
21929
22042
|
|
|
21930
22043
|
// src/components/ProgressList/ProgressList.tsx
|
|
21931
|
-
import { jsx as
|
|
22044
|
+
import { jsx as jsx136, jsxs as jsxs90 } from "@emotion/react/jsx-runtime";
|
|
21932
22045
|
var ProgressList = ({ inProgressId, items, autoEllipsis, ...htmlProps }) => {
|
|
21933
22046
|
const itemsWithStatus = useMemo7(() => {
|
|
21934
22047
|
const indexOfInProgressItem = items.findIndex(({ id }) => id === inProgressId);
|
|
@@ -21942,8 +22055,8 @@ var ProgressList = ({ inProgressId, items, autoEllipsis, ...htmlProps }) => {
|
|
|
21942
22055
|
return { ...item, status };
|
|
21943
22056
|
});
|
|
21944
22057
|
}, [items, inProgressId]);
|
|
21945
|
-
return /* @__PURE__ */
|
|
21946
|
-
return /* @__PURE__ */
|
|
22058
|
+
return /* @__PURE__ */ jsx136("ol", { css: progressListStyles, ...htmlProps, children: itemsWithStatus.map(({ id, label, status, error, errorLevel }) => {
|
|
22059
|
+
return /* @__PURE__ */ jsx136(
|
|
21947
22060
|
ProgressListItem,
|
|
21948
22061
|
{
|
|
21949
22062
|
status,
|
|
@@ -21976,12 +22089,12 @@ var ProgressListItem = ({
|
|
|
21976
22089
|
}, [status, error]);
|
|
21977
22090
|
const statusStyles = useMemo7(() => {
|
|
21978
22091
|
if (error) {
|
|
21979
|
-
return errorLevel === "caution" ?
|
|
22092
|
+
return errorLevel === "caution" ? css101`
|
|
21980
22093
|
color: rgb(161, 98, 7);
|
|
21981
22094
|
& svg {
|
|
21982
22095
|
color: rgb(250, 204, 21);
|
|
21983
22096
|
}
|
|
21984
|
-
` :
|
|
22097
|
+
` : css101`
|
|
21985
22098
|
color: rgb(185, 28, 28);
|
|
21986
22099
|
& svg {
|
|
21987
22100
|
color: var(--brand-primary-2);
|
|
@@ -21989,38 +22102,38 @@ var ProgressListItem = ({
|
|
|
21989
22102
|
`;
|
|
21990
22103
|
}
|
|
21991
22104
|
const colorPerStatus = {
|
|
21992
|
-
completed:
|
|
22105
|
+
completed: css101`
|
|
21993
22106
|
opacity: 0.75;
|
|
21994
22107
|
`,
|
|
21995
|
-
inProgress:
|
|
22108
|
+
inProgress: css101`
|
|
21996
22109
|
-webkit-text-stroke-width: thin;
|
|
21997
22110
|
`,
|
|
21998
|
-
queued:
|
|
22111
|
+
queued: css101`
|
|
21999
22112
|
opacity: 0.5;
|
|
22000
22113
|
`
|
|
22001
22114
|
};
|
|
22002
22115
|
return colorPerStatus[status];
|
|
22003
22116
|
}, [status, error, errorLevel]);
|
|
22004
|
-
return /* @__PURE__ */
|
|
22005
|
-
/* @__PURE__ */
|
|
22006
|
-
/* @__PURE__ */
|
|
22117
|
+
return /* @__PURE__ */ jsxs90("li", { css: [progressListItemStyles, statusStyles], children: [
|
|
22118
|
+
/* @__PURE__ */ jsx136(Tooltip, { title: error != null ? error : "", children: /* @__PURE__ */ jsx136("div", { children: /* @__PURE__ */ jsx136(Icon, { icon, size: 20, iconColor: "currentColor" }) }) }),
|
|
22119
|
+
/* @__PURE__ */ jsxs90("div", { children: [
|
|
22007
22120
|
children,
|
|
22008
|
-
/* @__PURE__ */
|
|
22121
|
+
/* @__PURE__ */ jsx136("span", { css: { visibility: autoEllipsis && status === "inProgress" && !error ? "visible" : "hidden" }, children: "..." })
|
|
22009
22122
|
] })
|
|
22010
22123
|
] });
|
|
22011
22124
|
};
|
|
22012
22125
|
|
|
22013
22126
|
// src/components/SegmentedControl/SegmentedControl.tsx
|
|
22014
|
-
import { css as
|
|
22127
|
+
import { css as css103 } from "@emotion/react";
|
|
22015
22128
|
import { CgCheck as CgCheck5 } from "@react-icons/all-files/cg/CgCheck";
|
|
22016
22129
|
import { useCallback as useCallback12, useEffect as useEffect22, useMemo as useMemo8, useRef as useRef13, useState as useState18 } from "react";
|
|
22017
22130
|
|
|
22018
22131
|
// src/components/SegmentedControl/SegmentedControl.styles.ts
|
|
22019
|
-
import { css as
|
|
22020
|
-
var segmentedControlRootStyles =
|
|
22132
|
+
import { css as css102 } from "@emotion/react";
|
|
22133
|
+
var segmentedControlRootStyles = css102`
|
|
22021
22134
|
position: relative;
|
|
22022
22135
|
`;
|
|
22023
|
-
var segmentedControlScrollIndicatorsStyles =
|
|
22136
|
+
var segmentedControlScrollIndicatorsStyles = css102`
|
|
22024
22137
|
position: absolute;
|
|
22025
22138
|
inset: 0;
|
|
22026
22139
|
z-index: 1;
|
|
@@ -22048,17 +22161,17 @@ var segmentedControlScrollIndicatorsStyles = css100`
|
|
|
22048
22161
|
background: linear-gradient(to left, var(--background-color) 10%, transparent);
|
|
22049
22162
|
}
|
|
22050
22163
|
`;
|
|
22051
|
-
var segmentedControlScrollIndicatorStartVisibleStyles =
|
|
22164
|
+
var segmentedControlScrollIndicatorStartVisibleStyles = css102`
|
|
22052
22165
|
&::before {
|
|
22053
22166
|
opacity: 1;
|
|
22054
22167
|
}
|
|
22055
22168
|
`;
|
|
22056
|
-
var segmentedControlScrollIndicatorEndVisibleStyles =
|
|
22169
|
+
var segmentedControlScrollIndicatorEndVisibleStyles = css102`
|
|
22057
22170
|
&::after {
|
|
22058
22171
|
opacity: 1;
|
|
22059
22172
|
}
|
|
22060
22173
|
`;
|
|
22061
|
-
var segmentedControlWrapperStyles =
|
|
22174
|
+
var segmentedControlWrapperStyles = css102`
|
|
22062
22175
|
overflow-y: auto;
|
|
22063
22176
|
scroll-behavior: smooth;
|
|
22064
22177
|
scrollbar-width: none;
|
|
@@ -22067,7 +22180,7 @@ var segmentedControlWrapperStyles = css100`
|
|
|
22067
22180
|
height: 0px;
|
|
22068
22181
|
}
|
|
22069
22182
|
`;
|
|
22070
|
-
var segmentedControlStyles =
|
|
22183
|
+
var segmentedControlStyles = css102`
|
|
22071
22184
|
--segmented-control-rounded-value: var(--rounded-base);
|
|
22072
22185
|
--segmented-control-border-width: 1px;
|
|
22073
22186
|
--segmented-control-selected-color: var(--brand-secondary-3);
|
|
@@ -22086,14 +22199,14 @@ var segmentedControlStyles = css100`
|
|
|
22086
22199
|
border-radius: calc(var(--segmented-control-rounded-value) + var(--segmented-control-border-width));
|
|
22087
22200
|
font-size: var(--fs-xs);
|
|
22088
22201
|
`;
|
|
22089
|
-
var segmentedControlVerticalStyles =
|
|
22202
|
+
var segmentedControlVerticalStyles = css102`
|
|
22090
22203
|
flex-direction: column;
|
|
22091
22204
|
--segmented-control-first-border-radius: var(--segmented-control-rounded-value)
|
|
22092
22205
|
var(--segmented-control-rounded-value) 0 0;
|
|
22093
22206
|
--segmented-control-last-border-radius: 0 0 var(--segmented-control-rounded-value)
|
|
22094
22207
|
var(--segmented-control-rounded-value);
|
|
22095
22208
|
`;
|
|
22096
|
-
var segmentedControlItemStyles =
|
|
22209
|
+
var segmentedControlItemStyles = css102`
|
|
22097
22210
|
&:first-of-type label {
|
|
22098
22211
|
border-radius: var(--segmented-control-first-border-radius);
|
|
22099
22212
|
}
|
|
@@ -22101,10 +22214,10 @@ var segmentedControlItemStyles = css100`
|
|
|
22101
22214
|
border-radius: var(--segmented-control-last-border-radius);
|
|
22102
22215
|
}
|
|
22103
22216
|
`;
|
|
22104
|
-
var segmentedControlInputStyles =
|
|
22217
|
+
var segmentedControlInputStyles = css102`
|
|
22105
22218
|
${accessibleHidden}
|
|
22106
22219
|
`;
|
|
22107
|
-
var segmentedControlLabelStyles = (checked, disabled2) =>
|
|
22220
|
+
var segmentedControlLabelStyles = (checked, disabled2) => css102`
|
|
22108
22221
|
position: relative;
|
|
22109
22222
|
display: flex;
|
|
22110
22223
|
align-items: center;
|
|
@@ -22171,25 +22284,25 @@ var segmentedControlLabelStyles = (checked, disabled2) => css100`
|
|
|
22171
22284
|
`}
|
|
22172
22285
|
}
|
|
22173
22286
|
`;
|
|
22174
|
-
var segmentedControlLabelIconOnlyStyles =
|
|
22287
|
+
var segmentedControlLabelIconOnlyStyles = css102`
|
|
22175
22288
|
padding-inline: 0.5em;
|
|
22176
22289
|
`;
|
|
22177
|
-
var segmentedControlLabelCheckStyles =
|
|
22290
|
+
var segmentedControlLabelCheckStyles = css102`
|
|
22178
22291
|
opacity: 0.5;
|
|
22179
22292
|
`;
|
|
22180
|
-
var segmentedControlLabelContentStyles =
|
|
22293
|
+
var segmentedControlLabelContentStyles = css102`
|
|
22181
22294
|
display: flex;
|
|
22182
22295
|
align-items: center;
|
|
22183
22296
|
justify-content: center;
|
|
22184
22297
|
gap: var(--spacing-sm);
|
|
22185
22298
|
height: 100%;
|
|
22186
22299
|
`;
|
|
22187
|
-
var segmentedControlLabelTextStyles =
|
|
22300
|
+
var segmentedControlLabelTextStyles = css102`
|
|
22188
22301
|
white-space: nowrap;
|
|
22189
22302
|
`;
|
|
22190
22303
|
|
|
22191
22304
|
// src/components/SegmentedControl/SegmentedControl.tsx
|
|
22192
|
-
import { jsx as
|
|
22305
|
+
import { jsx as jsx137, jsxs as jsxs91 } from "@emotion/react/jsx-runtime";
|
|
22193
22306
|
var SegmentedControl = ({
|
|
22194
22307
|
name,
|
|
22195
22308
|
options,
|
|
@@ -22217,10 +22330,10 @@ var SegmentedControl = ({
|
|
|
22217
22330
|
);
|
|
22218
22331
|
const sizeStyles = useMemo8(() => {
|
|
22219
22332
|
const map = {
|
|
22220
|
-
sm:
|
|
22221
|
-
md:
|
|
22222
|
-
lg:
|
|
22223
|
-
xl:
|
|
22333
|
+
sm: css103({ height: "calc(24px - 2px)", fontSize: "var(--fs-xs)" }),
|
|
22334
|
+
md: css103({ height: "calc(32px - 2px)", fontSize: "var(--fs-sm)" }),
|
|
22335
|
+
lg: css103({ height: "calc(40px - 2px)", fontSize: "var(--fs-base)" }),
|
|
22336
|
+
xl: css103({ height: "calc(48px - 2px)", fontSize: "var(--fs-base)" })
|
|
22224
22337
|
};
|
|
22225
22338
|
return map[size];
|
|
22226
22339
|
}, [size]);
|
|
@@ -22248,8 +22361,8 @@ var SegmentedControl = ({
|
|
|
22248
22361
|
wrapperElement == null ? void 0 : wrapperElement.removeEventListener("scroll", onScroll);
|
|
22249
22362
|
};
|
|
22250
22363
|
}, []);
|
|
22251
|
-
return /* @__PURE__ */
|
|
22252
|
-
/* @__PURE__ */
|
|
22364
|
+
return /* @__PURE__ */ jsxs91("div", { css: [segmentedControlRootStyles, { "--background-color": currentBackgroundColor }], children: [
|
|
22365
|
+
/* @__PURE__ */ jsx137("div", { ref: wrapperRef, css: segmentedControlWrapperStyles, children: /* @__PURE__ */ jsx137(
|
|
22253
22366
|
"div",
|
|
22254
22367
|
{
|
|
22255
22368
|
css: [
|
|
@@ -22265,12 +22378,12 @@ var SegmentedControl = ({
|
|
|
22265
22378
|
}
|
|
22266
22379
|
const text = option.label ? option.label : option.icon ? null : String(option.value);
|
|
22267
22380
|
const isDisabled = disabled2 || option.disabled;
|
|
22268
|
-
return /* @__PURE__ */
|
|
22381
|
+
return /* @__PURE__ */ jsx137(Tooltip, { title: (_a = option.tooltip) != null ? _a : "", children: /* @__PURE__ */ jsx137(
|
|
22269
22382
|
"div",
|
|
22270
22383
|
{
|
|
22271
22384
|
css: segmentedControlItemStyles,
|
|
22272
22385
|
"data-testid": option["data-testid"] ? option["data-testid"] : "container-segmented-control",
|
|
22273
|
-
children: /* @__PURE__ */
|
|
22386
|
+
children: /* @__PURE__ */ jsxs91(
|
|
22274
22387
|
"label",
|
|
22275
22388
|
{
|
|
22276
22389
|
css: [
|
|
@@ -22279,7 +22392,7 @@ var SegmentedControl = ({
|
|
|
22279
22392
|
isIconOnly ? segmentedControlLabelIconOnlyStyles : void 0
|
|
22280
22393
|
],
|
|
22281
22394
|
children: [
|
|
22282
|
-
/* @__PURE__ */
|
|
22395
|
+
/* @__PURE__ */ jsx137(
|
|
22283
22396
|
"input",
|
|
22284
22397
|
{
|
|
22285
22398
|
css: segmentedControlInputStyles,
|
|
@@ -22291,10 +22404,10 @@ var SegmentedControl = ({
|
|
|
22291
22404
|
disabled: isDisabled
|
|
22292
22405
|
}
|
|
22293
22406
|
),
|
|
22294
|
-
option.value !== value || noCheckmark ? null : /* @__PURE__ */
|
|
22295
|
-
/* @__PURE__ */
|
|
22296
|
-
!option.icon ? null : /* @__PURE__ */
|
|
22297
|
-
!text || hideOptionText ? null : /* @__PURE__ */
|
|
22407
|
+
option.value !== value || noCheckmark ? null : /* @__PURE__ */ jsx137(CgCheck5, { css: segmentedControlLabelCheckStyles, "aria-label": "Selected", size: "1.5em" }),
|
|
22408
|
+
/* @__PURE__ */ jsxs91("span", { css: segmentedControlLabelContentStyles, children: [
|
|
22409
|
+
!option.icon ? null : /* @__PURE__ */ jsx137(Icon, { icon: option.icon, size: iconSize, iconColor: "currentColor" }),
|
|
22410
|
+
!text || hideOptionText ? null : /* @__PURE__ */ jsx137("span", { css: segmentedControlLabelTextStyles, children: text })
|
|
22298
22411
|
] })
|
|
22299
22412
|
]
|
|
22300
22413
|
}
|
|
@@ -22304,7 +22417,7 @@ var SegmentedControl = ({
|
|
|
22304
22417
|
})
|
|
22305
22418
|
}
|
|
22306
22419
|
) }),
|
|
22307
|
-
/* @__PURE__ */
|
|
22420
|
+
/* @__PURE__ */ jsx137(
|
|
22308
22421
|
"div",
|
|
22309
22422
|
{
|
|
22310
22423
|
css: [
|
|
@@ -22318,18 +22431,18 @@ var SegmentedControl = ({
|
|
|
22318
22431
|
};
|
|
22319
22432
|
|
|
22320
22433
|
// src/components/Skeleton/Skeleton.styles.ts
|
|
22321
|
-
import { css as
|
|
22434
|
+
import { css as css104, keyframes as keyframes5 } from "@emotion/react";
|
|
22322
22435
|
var lightFadingOut = keyframes5`
|
|
22323
22436
|
from { opacity: 0.1; }
|
|
22324
22437
|
to { opacity: 0.025; }
|
|
22325
22438
|
`;
|
|
22326
|
-
var skeletonStyles =
|
|
22439
|
+
var skeletonStyles = css104`
|
|
22327
22440
|
animation: ${lightFadingOut} 1s ease-out infinite alternate;
|
|
22328
22441
|
background-color: var(--gray-900);
|
|
22329
22442
|
`;
|
|
22330
22443
|
|
|
22331
22444
|
// src/components/Skeleton/Skeleton.tsx
|
|
22332
|
-
import { jsx as
|
|
22445
|
+
import { jsx as jsx138 } from "@emotion/react/jsx-runtime";
|
|
22333
22446
|
var Skeleton = ({
|
|
22334
22447
|
width = "100%",
|
|
22335
22448
|
height = "1.25rem",
|
|
@@ -22337,7 +22450,7 @@ var Skeleton = ({
|
|
|
22337
22450
|
circle = false,
|
|
22338
22451
|
children,
|
|
22339
22452
|
...otherProps
|
|
22340
|
-
}) => /* @__PURE__ */
|
|
22453
|
+
}) => /* @__PURE__ */ jsx138(
|
|
22341
22454
|
"div",
|
|
22342
22455
|
{
|
|
22343
22456
|
css: [
|
|
@@ -22360,8 +22473,8 @@ var Skeleton = ({
|
|
|
22360
22473
|
import { forwardRef as forwardRef25 } from "react";
|
|
22361
22474
|
|
|
22362
22475
|
// src/components/Switch/Switch.styles.ts
|
|
22363
|
-
import { css as
|
|
22364
|
-
var SwitchInputContainer =
|
|
22476
|
+
import { css as css105 } from "@emotion/react";
|
|
22477
|
+
var SwitchInputContainer = css105`
|
|
22365
22478
|
cursor: pointer;
|
|
22366
22479
|
display: inline-block;
|
|
22367
22480
|
position: relative;
|
|
@@ -22370,7 +22483,7 @@ var SwitchInputContainer = css103`
|
|
|
22370
22483
|
vertical-align: middle;
|
|
22371
22484
|
user-select: none;
|
|
22372
22485
|
`;
|
|
22373
|
-
var SwitchInput = (size) =>
|
|
22486
|
+
var SwitchInput = (size) => css105`
|
|
22374
22487
|
appearance: none;
|
|
22375
22488
|
border-radius: var(--rounded-full);
|
|
22376
22489
|
background-color: var(--white);
|
|
@@ -22409,7 +22522,7 @@ var SwitchInput = (size) => css103`
|
|
|
22409
22522
|
cursor: not-allowed;
|
|
22410
22523
|
}
|
|
22411
22524
|
`;
|
|
22412
|
-
var SwitchInputDisabled =
|
|
22525
|
+
var SwitchInputDisabled = css105`
|
|
22413
22526
|
opacity: var(--opacity-50);
|
|
22414
22527
|
cursor: not-allowed;
|
|
22415
22528
|
|
|
@@ -22417,7 +22530,7 @@ var SwitchInputDisabled = css103`
|
|
|
22417
22530
|
cursor: not-allowed;
|
|
22418
22531
|
}
|
|
22419
22532
|
`;
|
|
22420
|
-
var SwitchInputLabel = (size) =>
|
|
22533
|
+
var SwitchInputLabel = (size) => css105`
|
|
22421
22534
|
align-items: center;
|
|
22422
22535
|
color: var(--typography-base);
|
|
22423
22536
|
display: inline-flex;
|
|
@@ -22439,32 +22552,32 @@ var SwitchInputLabel = (size) => css103`
|
|
|
22439
22552
|
top: 0;
|
|
22440
22553
|
}
|
|
22441
22554
|
`;
|
|
22442
|
-
var SwitchText = (size) =>
|
|
22555
|
+
var SwitchText = (size) => css105`
|
|
22443
22556
|
color: var(--gray-500);
|
|
22444
22557
|
font-size: var(--fs-sm);
|
|
22445
22558
|
padding-inline: ${size === "sm" ? "var(--spacing-xl)" : "var(--spacing-2xl)"} 0;
|
|
22446
22559
|
`;
|
|
22447
22560
|
|
|
22448
22561
|
// src/components/Switch/Switch.tsx
|
|
22449
|
-
import { Fragment as Fragment21, jsx as
|
|
22562
|
+
import { Fragment as Fragment21, jsx as jsx139, jsxs as jsxs92 } from "@emotion/react/jsx-runtime";
|
|
22450
22563
|
var Switch = forwardRef25(
|
|
22451
22564
|
({ label, infoText, toggleText, children, switchSize = "base", ...inputProps }, ref) => {
|
|
22452
22565
|
let additionalText = infoText;
|
|
22453
22566
|
if (infoText && toggleText) {
|
|
22454
22567
|
additionalText = inputProps.checked ? toggleText : infoText;
|
|
22455
22568
|
}
|
|
22456
|
-
return /* @__PURE__ */
|
|
22457
|
-
/* @__PURE__ */
|
|
22569
|
+
return /* @__PURE__ */ jsxs92(Fragment21, { children: [
|
|
22570
|
+
/* @__PURE__ */ jsxs92(
|
|
22458
22571
|
"label",
|
|
22459
22572
|
{
|
|
22460
22573
|
css: [SwitchInputContainer, inputProps.disabled ? SwitchInputDisabled : void 0],
|
|
22461
22574
|
children: [
|
|
22462
|
-
/* @__PURE__ */
|
|
22463
|
-
/* @__PURE__ */
|
|
22575
|
+
/* @__PURE__ */ jsx139("input", { type: "checkbox", css: SwitchInput(switchSize), ...inputProps, ref }),
|
|
22576
|
+
/* @__PURE__ */ jsx139("span", { css: SwitchInputLabel(switchSize), children: label })
|
|
22464
22577
|
]
|
|
22465
22578
|
}
|
|
22466
22579
|
),
|
|
22467
|
-
additionalText ? /* @__PURE__ */
|
|
22580
|
+
additionalText ? /* @__PURE__ */ jsx139("p", { css: SwitchText(switchSize), children: additionalText }) : null,
|
|
22468
22581
|
children
|
|
22469
22582
|
] });
|
|
22470
22583
|
}
|
|
@@ -22474,8 +22587,8 @@ var Switch = forwardRef25(
|
|
|
22474
22587
|
import * as React24 from "react";
|
|
22475
22588
|
|
|
22476
22589
|
// src/components/Table/Table.styles.ts
|
|
22477
|
-
import { css as
|
|
22478
|
-
var table = ({ cellPadding = "var(--spacing-sm) var(--spacing-md)" }) =>
|
|
22590
|
+
import { css as css106 } from "@emotion/react";
|
|
22591
|
+
var table = ({ cellPadding = "var(--spacing-sm) var(--spacing-md)" }) => css106`
|
|
22479
22592
|
border-bottom: 1px solid var(--gray-400);
|
|
22480
22593
|
border-collapse: collapse;
|
|
22481
22594
|
min-width: 100%;
|
|
@@ -22495,54 +22608,54 @@ var table = ({ cellPadding = "var(--spacing-sm) var(--spacing-md)" }) => css104`
|
|
|
22495
22608
|
background-color: var(--gray-50);
|
|
22496
22609
|
}
|
|
22497
22610
|
`;
|
|
22498
|
-
var tableHead =
|
|
22611
|
+
var tableHead = css106`
|
|
22499
22612
|
color: var(--typography-base);
|
|
22500
22613
|
text-align: left;
|
|
22501
22614
|
`;
|
|
22502
|
-
var tableRow =
|
|
22615
|
+
var tableRow = css106`
|
|
22503
22616
|
border-bottom: 1px solid var(--gray-100);
|
|
22504
22617
|
`;
|
|
22505
|
-
var tableCellHead =
|
|
22618
|
+
var tableCellHead = css106`
|
|
22506
22619
|
font-size: var(--fs-sm);
|
|
22507
22620
|
text-transform: uppercase;
|
|
22508
22621
|
font-weight: var(--fw-bold);
|
|
22509
22622
|
`;
|
|
22510
22623
|
|
|
22511
22624
|
// src/components/Table/Table.tsx
|
|
22512
|
-
import { jsx as
|
|
22625
|
+
import { jsx as jsx140 } from "@emotion/react/jsx-runtime";
|
|
22513
22626
|
var Table = React24.forwardRef(
|
|
22514
22627
|
({ children, cellPadding, ...otherProps }, ref) => {
|
|
22515
|
-
return /* @__PURE__ */
|
|
22628
|
+
return /* @__PURE__ */ jsx140("table", { ref, css: table({ cellPadding }), ...otherProps, children });
|
|
22516
22629
|
}
|
|
22517
22630
|
);
|
|
22518
22631
|
var TableHead = React24.forwardRef(
|
|
22519
22632
|
({ children, ...otherProps }, ref) => {
|
|
22520
|
-
return /* @__PURE__ */
|
|
22633
|
+
return /* @__PURE__ */ jsx140("thead", { ref, css: tableHead, ...otherProps, children });
|
|
22521
22634
|
}
|
|
22522
22635
|
);
|
|
22523
22636
|
var TableBody = React24.forwardRef(
|
|
22524
22637
|
({ children, ...otherProps }, ref) => {
|
|
22525
|
-
return /* @__PURE__ */
|
|
22638
|
+
return /* @__PURE__ */ jsx140("tbody", { ref, ...otherProps, children });
|
|
22526
22639
|
}
|
|
22527
22640
|
);
|
|
22528
22641
|
var TableFoot = React24.forwardRef(
|
|
22529
22642
|
({ children, ...otherProps }, ref) => {
|
|
22530
|
-
return /* @__PURE__ */
|
|
22643
|
+
return /* @__PURE__ */ jsx140("tfoot", { ref, ...otherProps, children });
|
|
22531
22644
|
}
|
|
22532
22645
|
);
|
|
22533
22646
|
var TableRow = React24.forwardRef(
|
|
22534
22647
|
({ children, ...otherProps }, ref) => {
|
|
22535
|
-
return /* @__PURE__ */
|
|
22648
|
+
return /* @__PURE__ */ jsx140("tr", { ref, css: tableRow, ...otherProps, children });
|
|
22536
22649
|
}
|
|
22537
22650
|
);
|
|
22538
22651
|
var TableCellHead = React24.forwardRef(
|
|
22539
22652
|
({ children, ...otherProps }, ref) => {
|
|
22540
|
-
return /* @__PURE__ */
|
|
22653
|
+
return /* @__PURE__ */ jsx140("th", { ref, css: tableCellHead, ...otherProps, children });
|
|
22541
22654
|
}
|
|
22542
22655
|
);
|
|
22543
22656
|
var TableCellData = React24.forwardRef(
|
|
22544
22657
|
({ children, ...otherProps }, ref) => {
|
|
22545
|
-
return /* @__PURE__ */
|
|
22658
|
+
return /* @__PURE__ */ jsx140("td", { ref, ...otherProps, children });
|
|
22546
22659
|
}
|
|
22547
22660
|
);
|
|
22548
22661
|
|
|
@@ -22557,8 +22670,8 @@ import {
|
|
|
22557
22670
|
import { useCallback as useCallback13, useEffect as useEffect23, useMemo as useMemo9 } from "react";
|
|
22558
22671
|
|
|
22559
22672
|
// src/components/Tabs/Tabs.styles.ts
|
|
22560
|
-
import { css as
|
|
22561
|
-
var tabButtonStyles =
|
|
22673
|
+
import { css as css107 } from "@emotion/react";
|
|
22674
|
+
var tabButtonStyles = css107`
|
|
22562
22675
|
align-items: center;
|
|
22563
22676
|
border: 0;
|
|
22564
22677
|
height: 2.5rem;
|
|
@@ -22575,14 +22688,14 @@ var tabButtonStyles = css105`
|
|
|
22575
22688
|
box-shadow: inset 0 -2px 0 var(--brand-secondary-3);
|
|
22576
22689
|
}
|
|
22577
22690
|
`;
|
|
22578
|
-
var tabButtonGroupStyles =
|
|
22691
|
+
var tabButtonGroupStyles = css107`
|
|
22579
22692
|
display: flex;
|
|
22580
22693
|
gap: var(--spacing-base);
|
|
22581
22694
|
border-bottom: 1px solid var(--gray-300);
|
|
22582
22695
|
`;
|
|
22583
22696
|
|
|
22584
22697
|
// src/components/Tabs/Tabs.tsx
|
|
22585
|
-
import { jsx as
|
|
22698
|
+
import { jsx as jsx141 } from "@emotion/react/jsx-runtime";
|
|
22586
22699
|
var useCurrentTab = () => {
|
|
22587
22700
|
const context = useAriakitTabStore();
|
|
22588
22701
|
if (!context) {
|
|
@@ -22619,28 +22732,28 @@ var Tabs = ({
|
|
|
22619
22732
|
tab.setSelectedId(selected);
|
|
22620
22733
|
}
|
|
22621
22734
|
}, [selected, tab]);
|
|
22622
|
-
return /* @__PURE__ */
|
|
22735
|
+
return /* @__PURE__ */ jsx141(AriakitTabProvider, { store: tab, setSelectedId: onTabSelect, children });
|
|
22623
22736
|
};
|
|
22624
22737
|
var TabButtonGroup = ({ children, ...props }) => {
|
|
22625
|
-
return /* @__PURE__ */
|
|
22738
|
+
return /* @__PURE__ */ jsx141(AriakitTabList, { ...props, css: tabButtonGroupStyles, children });
|
|
22626
22739
|
};
|
|
22627
22740
|
var TabButton = ({
|
|
22628
22741
|
children,
|
|
22629
22742
|
id,
|
|
22630
22743
|
...props
|
|
22631
22744
|
}) => {
|
|
22632
|
-
return /* @__PURE__ */
|
|
22745
|
+
return /* @__PURE__ */ jsx141(AriakitTab, { type: "button", id, ...props, css: tabButtonStyles, children });
|
|
22633
22746
|
};
|
|
22634
22747
|
var TabContent = ({
|
|
22635
22748
|
children,
|
|
22636
22749
|
...props
|
|
22637
22750
|
}) => {
|
|
22638
|
-
return /* @__PURE__ */
|
|
22751
|
+
return /* @__PURE__ */ jsx141(AriakitTabPanel, { ...props, children });
|
|
22639
22752
|
};
|
|
22640
22753
|
|
|
22641
22754
|
// src/components/Validation/StatusBullet.styles.ts
|
|
22642
|
-
import { css as
|
|
22643
|
-
var StatusBulletContainer =
|
|
22755
|
+
import { css as css108 } from "@emotion/react";
|
|
22756
|
+
var StatusBulletContainer = css108`
|
|
22644
22757
|
align-items: center;
|
|
22645
22758
|
align-self: center;
|
|
22646
22759
|
color: var(--gray-500);
|
|
@@ -22657,33 +22770,33 @@ var StatusBulletContainer = css106`
|
|
|
22657
22770
|
display: block;
|
|
22658
22771
|
}
|
|
22659
22772
|
`;
|
|
22660
|
-
var StatusBulletBase =
|
|
22773
|
+
var StatusBulletBase = css108`
|
|
22661
22774
|
font-size: var(--fs-sm);
|
|
22662
22775
|
&:before {
|
|
22663
22776
|
width: var(--fs-xs);
|
|
22664
22777
|
height: var(--fs-xs);
|
|
22665
22778
|
}
|
|
22666
22779
|
`;
|
|
22667
|
-
var StatusBulletSmall =
|
|
22780
|
+
var StatusBulletSmall = css108`
|
|
22668
22781
|
font-size: var(--fs-xs);
|
|
22669
22782
|
&:before {
|
|
22670
22783
|
width: var(--fs-xxs);
|
|
22671
22784
|
height: var(--fs-xxs);
|
|
22672
22785
|
}
|
|
22673
22786
|
`;
|
|
22674
|
-
var StatusDraft =
|
|
22787
|
+
var StatusDraft = css108`
|
|
22675
22788
|
&:before {
|
|
22676
22789
|
background: var(--white);
|
|
22677
22790
|
box-shadow: inset 0 0 0 0.125rem var(--accent-dark);
|
|
22678
22791
|
}
|
|
22679
22792
|
`;
|
|
22680
|
-
var StatusModified =
|
|
22793
|
+
var StatusModified = css108`
|
|
22681
22794
|
&:before {
|
|
22682
22795
|
background: linear-gradient(to right, var(--white) 50%, var(--accent-dark) 50% 100%);
|
|
22683
22796
|
box-shadow: inset 0 0 0 0.125rem var(--accent-dark);
|
|
22684
22797
|
}
|
|
22685
22798
|
`;
|
|
22686
|
-
var StatusError =
|
|
22799
|
+
var StatusError = css108`
|
|
22687
22800
|
color: var(--error);
|
|
22688
22801
|
&:before {
|
|
22689
22802
|
/* TODO: replace this with an svg icon */
|
|
@@ -22696,29 +22809,29 @@ var StatusError = css106`
|
|
|
22696
22809
|
);
|
|
22697
22810
|
}
|
|
22698
22811
|
`;
|
|
22699
|
-
var StatusPublished =
|
|
22812
|
+
var StatusPublished = css108`
|
|
22700
22813
|
&:before {
|
|
22701
22814
|
background: var(--accent-dark);
|
|
22702
22815
|
}
|
|
22703
22816
|
`;
|
|
22704
|
-
var StatusOrphan =
|
|
22817
|
+
var StatusOrphan = css108`
|
|
22705
22818
|
&:before {
|
|
22706
22819
|
background: var(--brand-secondary-5);
|
|
22707
22820
|
}
|
|
22708
22821
|
`;
|
|
22709
|
-
var StatusUnknown =
|
|
22822
|
+
var StatusUnknown = css108`
|
|
22710
22823
|
&:before {
|
|
22711
22824
|
background: var(--gray-800);
|
|
22712
22825
|
}
|
|
22713
22826
|
`;
|
|
22714
|
-
var StatusDeleted =
|
|
22827
|
+
var StatusDeleted = css108`
|
|
22715
22828
|
&:before {
|
|
22716
22829
|
background: var(--error);
|
|
22717
22830
|
}
|
|
22718
22831
|
`;
|
|
22719
22832
|
|
|
22720
22833
|
// src/components/Validation/StatusBullet.tsx
|
|
22721
|
-
import { jsx as
|
|
22834
|
+
import { jsx as jsx142 } from "@emotion/react/jsx-runtime";
|
|
22722
22835
|
var StatusBullet = ({
|
|
22723
22836
|
status,
|
|
22724
22837
|
hideText = false,
|
|
@@ -22738,7 +22851,7 @@ var StatusBullet = ({
|
|
|
22738
22851
|
Deleted: StatusDeleted
|
|
22739
22852
|
};
|
|
22740
22853
|
const statusSize = size === "base" ? StatusBulletBase : StatusBulletSmall;
|
|
22741
|
-
return /* @__PURE__ */
|
|
22854
|
+
return /* @__PURE__ */ jsx142(
|
|
22742
22855
|
"span",
|
|
22743
22856
|
{
|
|
22744
22857
|
role: "status",
|
|
@@ -22848,11 +22961,12 @@ export {
|
|
|
22848
22961
|
ObjectGridItemCoverButton,
|
|
22849
22962
|
ObjectGridItemHeading2 as ObjectGridItemHeading,
|
|
22850
22963
|
ObjectGridItemIconWithTooltip,
|
|
22964
|
+
ObjectGridItemLoadingSkeleton2 as ObjectGridItemLoadingSkeleton,
|
|
22851
22965
|
ObjectItemLoadingSkeleton,
|
|
22852
22966
|
ObjectListItem2 as ObjectListItem,
|
|
22853
22967
|
ObjectListItemContainer2 as ObjectListItemContainer,
|
|
22854
22968
|
ObjectListItemCover2 as ObjectListItemCover,
|
|
22855
|
-
ObjectListItemHeading,
|
|
22969
|
+
ObjectListItemHeading2 as ObjectListItemHeading,
|
|
22856
22970
|
PageHeaderSection,
|
|
22857
22971
|
Pagination,
|
|
22858
22972
|
Paragraph,
|