@uniformdev/mesh-sdk-react 20.50.2-alpha.1 → 20.50.2-alpha.117
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/index.d.mts +122 -6
- package/dist/index.d.ts +122 -6
- package/dist/index.esm.js +482 -284
- package/dist/index.js +840 -638
- package/dist/index.mjs +482 -284
- package/package.json +13 -12
package/dist/index.js
CHANGED
|
@@ -1,3 +1,4 @@
|
|
|
1
|
+
'use client';
|
|
1
2
|
"use strict";
|
|
2
3
|
var __create = Object.create;
|
|
3
4
|
var __defProp = Object.defineProperty;
|
|
@@ -33,10 +34,10 @@ var src_exports = {};
|
|
|
33
34
|
__export(src_exports, {
|
|
34
35
|
$createVariableNode: () => $createVariableNode,
|
|
35
36
|
$isVariableNode: () => $isVariableNode,
|
|
36
|
-
AddListButton: () =>
|
|
37
|
-
Button: () =>
|
|
37
|
+
AddListButton: () => import_design_system54.AddListButton,
|
|
38
|
+
Button: () => import_design_system54.Button,
|
|
38
39
|
CHECKBOX_OPERATORS: () => CHECKBOX_OPERATORS,
|
|
39
|
-
Callout: () =>
|
|
40
|
+
Callout: () => import_design_system54.Callout,
|
|
40
41
|
ControlledValuePlugin: () => ControlledValuePlugin,
|
|
41
42
|
DATE_OPERATORS: () => DATE_OPERATORS,
|
|
42
43
|
DATE_TIME_OPERATORS: () => DATE_TIME_OPERATORS,
|
|
@@ -49,7 +50,10 @@ __export(src_exports, {
|
|
|
49
50
|
DataTypeEditor: () => DataTypeEditor,
|
|
50
51
|
DateEditor: () => DateEditor,
|
|
51
52
|
DateRangeEditor: () => DateRangeEditor,
|
|
52
|
-
|
|
53
|
+
DelegationContext: () => DelegationContext,
|
|
54
|
+
DelegationGate: () => DelegationGate,
|
|
55
|
+
DelegationProvider: () => DelegationProvider,
|
|
56
|
+
DrawerContent: () => import_design_system54.DrawerContent,
|
|
53
57
|
EDIT_VARIABLE_COMMAND: () => EDIT_VARIABLE_COMMAND,
|
|
54
58
|
FilterButton: () => FilterButton2,
|
|
55
59
|
FilterControls: () => FilterControls,
|
|
@@ -59,22 +63,22 @@ __export(src_exports, {
|
|
|
59
63
|
FilterMenu: () => FilterMenu,
|
|
60
64
|
FilterMultiChoiceEditor: () => FilterMultiChoiceEditor,
|
|
61
65
|
FilterSingleChoiceEditor: () => FilterSingleChoiceEditor,
|
|
62
|
-
Heading: () =>
|
|
66
|
+
Heading: () => import_design_system54.Heading,
|
|
63
67
|
INSERT_VARIABLE_COMMAND: () => INSERT_VARIABLE_COMMAND,
|
|
64
68
|
Icons: () => icons_exports,
|
|
65
|
-
Input: () =>
|
|
66
|
-
InputComboBox: () =>
|
|
67
|
-
InputKeywordSearch: () =>
|
|
68
|
-
InputSelect: () =>
|
|
69
|
-
InputToggle: () =>
|
|
69
|
+
Input: () => import_design_system54.Input,
|
|
70
|
+
InputComboBox: () => import_design_system54.InputComboBox,
|
|
71
|
+
InputKeywordSearch: () => import_design_system54.InputKeywordSearch,
|
|
72
|
+
InputSelect: () => import_design_system54.InputSelect,
|
|
73
|
+
InputToggle: () => import_design_system54.InputToggle,
|
|
70
74
|
InputVariables: () => InputVariables,
|
|
71
|
-
Label: () =>
|
|
75
|
+
Label: () => import_design_system54.Label,
|
|
72
76
|
LinkButton: () => LinkButton,
|
|
73
|
-
LoadingIndicator: () =>
|
|
74
|
-
LoadingOverlay: () =>
|
|
77
|
+
LoadingIndicator: () => import_design_system54.LoadingIndicator,
|
|
78
|
+
LoadingOverlay: () => import_design_system54.LoadingOverlay,
|
|
75
79
|
MULTI_SELECT_OPERATORS: () => MULTI_SELECT_OPERATORS,
|
|
76
|
-
Menu: () =>
|
|
77
|
-
MenuItem: () =>
|
|
80
|
+
Menu: () => import_design_system54.Menu,
|
|
81
|
+
MenuItem: () => import_design_system54.MenuItem,
|
|
78
82
|
MeshApp: () => MeshApp,
|
|
79
83
|
NUMBER_OPERATORS: () => NUMBER_OPERATORS,
|
|
80
84
|
NumberEditor: () => NumberEditor,
|
|
@@ -93,22 +97,22 @@ __export(src_exports, {
|
|
|
93
97
|
PUBLISH_STATUS_FIELD_OPERATORS: () => PUBLISH_STATUS_FIELD_OPERATORS,
|
|
94
98
|
ParamTypeDynamicDataProvider: () => ParamTypeDynamicDataProvider,
|
|
95
99
|
ParameterConnectionIndicator: () => ParameterConnectionIndicator,
|
|
96
|
-
ParameterGroup: () =>
|
|
97
|
-
ParameterImage: () =>
|
|
98
|
-
ParameterImageInner: () =>
|
|
99
|
-
ParameterInput: () =>
|
|
100
|
-
ParameterInputInner: () =>
|
|
101
|
-
ParameterLabel: () =>
|
|
102
|
-
ParameterMenuButton: () =>
|
|
100
|
+
ParameterGroup: () => import_design_system54.ParameterGroup,
|
|
101
|
+
ParameterImage: () => import_design_system54.ParameterImage,
|
|
102
|
+
ParameterImageInner: () => import_design_system54.ParameterImageInner,
|
|
103
|
+
ParameterInput: () => import_design_system54.ParameterInput,
|
|
104
|
+
ParameterInputInner: () => import_design_system54.ParameterInputInner,
|
|
105
|
+
ParameterLabel: () => import_design_system54.ParameterLabel,
|
|
106
|
+
ParameterMenuButton: () => import_design_system54.ParameterMenuButton,
|
|
103
107
|
ParameterOrSingleVariable: () => ParameterOrSingleVariable,
|
|
104
|
-
ParameterSelect: () =>
|
|
105
|
-
ParameterSelectInner: () =>
|
|
106
|
-
ParameterShell: () =>
|
|
108
|
+
ParameterSelect: () => import_design_system54.ParameterSelect,
|
|
109
|
+
ParameterSelectInner: () => import_design_system54.ParameterSelectInner,
|
|
110
|
+
ParameterShell: () => import_design_system54.ParameterShell,
|
|
107
111
|
ParameterShellContext: () => import_design_system2.ParameterShellContext,
|
|
108
|
-
ParameterTextarea: () =>
|
|
109
|
-
ParameterTextareaInner: () =>
|
|
110
|
-
ParameterToggle: () =>
|
|
111
|
-
ParameterToggleInner: () =>
|
|
112
|
+
ParameterTextarea: () => import_design_system54.ParameterTextarea,
|
|
113
|
+
ParameterTextareaInner: () => import_design_system54.ParameterTextareaInner,
|
|
114
|
+
ParameterToggle: () => import_design_system54.ParameterToggle,
|
|
115
|
+
ParameterToggleInner: () => import_design_system54.ParameterToggleInner,
|
|
112
116
|
ParameterVariables: () => ParameterVariables,
|
|
113
117
|
QueryFilter: () => QueryFilter,
|
|
114
118
|
RICHTEXT_OPERATORS: () => RICHTEXT_OPERATORS,
|
|
@@ -122,8 +126,8 @@ __export(src_exports, {
|
|
|
122
126
|
RequestUrlInput: () => RequestUrlInput,
|
|
123
127
|
SELECT_OPERATORS: () => SELECT_OPERATORS,
|
|
124
128
|
SYSTEM_FIELD_OPERATORS: () => SYSTEM_FIELD_OPERATORS,
|
|
125
|
-
ScrollableList: () =>
|
|
126
|
-
ScrollableListItem: () =>
|
|
129
|
+
ScrollableList: () => import_design_system54.ScrollableList,
|
|
130
|
+
ScrollableListItem: () => import_design_system54.ScrollableListItem,
|
|
127
131
|
SearchAndFilter: () => SearchAndFilter,
|
|
128
132
|
SearchAndFilterContext: () => SearchAndFilterContext,
|
|
129
133
|
SearchAndFilterOptionsContainer: () => SearchAndFilterOptionsContainer2,
|
|
@@ -134,13 +138,13 @@ __export(src_exports, {
|
|
|
134
138
|
SortItems: () => SortItems,
|
|
135
139
|
StatusMultiEditor: () => StatusMultiEditor,
|
|
136
140
|
StatusSingleEditor: () => StatusSingleEditor,
|
|
137
|
-
Switch: () =>
|
|
141
|
+
Switch: () => import_design_system54.Switch,
|
|
138
142
|
TEXTBOX_OPERATORS: () => TEXTBOX_OPERATORS,
|
|
139
143
|
TextEditor: () => TextEditor,
|
|
140
144
|
TextMultiChoiceEditor: () => TextMultiChoiceEditor,
|
|
141
145
|
TextVariableRenderer: () => TextVariableRenderer,
|
|
142
|
-
Textarea: () =>
|
|
143
|
-
Theme: () =>
|
|
146
|
+
Textarea: () => import_design_system54.Textarea,
|
|
147
|
+
Theme: () => import_design_system54.Theme,
|
|
144
148
|
USER_OPERATORS: () => USER_OPERATORS,
|
|
145
149
|
VariableChip: () => VariableChip,
|
|
146
150
|
VariableEditor: () => VariableEditor,
|
|
@@ -161,6 +165,7 @@ __export(src_exports, {
|
|
|
161
165
|
urlEncodeRequestUrl: () => urlEncodeRequestUrl,
|
|
162
166
|
useConnectedDataAsVariables: () => useConnectedDataAsVariables,
|
|
163
167
|
useContentDataResourceLocaleInfo: () => useContentDataResourceLocaleInfo,
|
|
168
|
+
useDelegation: () => useDelegation,
|
|
164
169
|
useDynamicInputsAsVariables: () => useDynamicInputsAsVariables,
|
|
165
170
|
useMeshLocation: () => useMeshLocation,
|
|
166
171
|
useObjectSearchContext: () => useObjectSearchContext,
|
|
@@ -173,7 +178,7 @@ __export(src_exports, {
|
|
|
173
178
|
useVariableEditor: () => useVariableEditor,
|
|
174
179
|
useVariables: () => useVariables,
|
|
175
180
|
useVariablesMenu: () => useVariablesMenu,
|
|
176
|
-
utilityColors: () =>
|
|
181
|
+
utilityColors: () => import_design_system54.utilityColors,
|
|
177
182
|
variableDefaultTextValue: () => variableDefaultTextValue,
|
|
178
183
|
variablePrefix: () => variablePrefix,
|
|
179
184
|
variableSuffix: () => variableSuffix,
|
|
@@ -444,12 +449,28 @@ function useConnectedDataAsVariables(connectedData) {
|
|
|
444
449
|
);
|
|
445
450
|
}
|
|
446
451
|
|
|
452
|
+
// src/hooks/useDelegation.ts
|
|
453
|
+
var import_react4 = require("react");
|
|
454
|
+
|
|
455
|
+
// src/components/Delegation/DelegationContext.ts
|
|
456
|
+
var import_react3 = require("react");
|
|
457
|
+
var DelegationContext = (0, import_react3.createContext)(null);
|
|
458
|
+
|
|
459
|
+
// src/hooks/useDelegation.ts
|
|
460
|
+
function useDelegation() {
|
|
461
|
+
const ctx = (0, import_react4.useContext)(DelegationContext);
|
|
462
|
+
if (!ctx) {
|
|
463
|
+
throw new Error("useDelegation must be used within a <DelegationProvider>");
|
|
464
|
+
}
|
|
465
|
+
return ctx;
|
|
466
|
+
}
|
|
467
|
+
|
|
447
468
|
// src/hooks/useDynamicInputsAsVariables.tsx
|
|
448
469
|
var import_canvas = require("@uniformdev/canvas");
|
|
449
|
-
var
|
|
470
|
+
var import_react5 = require("react");
|
|
450
471
|
var import_jsx_runtime14 = require("@emotion/react/jsx-runtime");
|
|
451
472
|
function useDynamicInputsAsVariables(dynamicInputs) {
|
|
452
|
-
return (0,
|
|
473
|
+
return (0, import_react5.useMemo)(() => {
|
|
453
474
|
const result = Object.entries(dynamicInputs).reduce(
|
|
454
475
|
(acc, [name2, input3]) => {
|
|
455
476
|
const source = `from ${name2 === import_canvas.LOCALE_DYNAMIC_INPUT_NAME ? "current locale" : input3.type === "path" ? "URL path" : "query string"}`;
|
|
@@ -484,18 +505,18 @@ Current preview value: ${input3.value || "not provided"}`
|
|
|
484
505
|
}
|
|
485
506
|
|
|
486
507
|
// src/hooks/useMeshLocation.ts
|
|
487
|
-
var
|
|
508
|
+
var import_react8 = require("react");
|
|
488
509
|
|
|
489
510
|
// src/components/UniformMeshLocationContext.tsx
|
|
490
|
-
var
|
|
511
|
+
var import_react7 = require("react");
|
|
491
512
|
|
|
492
513
|
// src/components/UniformMeshSdkContext.tsx
|
|
493
514
|
var import_design_system = require("@uniformdev/design-system");
|
|
494
|
-
var
|
|
515
|
+
var import_react6 = require("react");
|
|
495
516
|
var import_jsx_runtime15 = require("@emotion/react/jsx-runtime");
|
|
496
|
-
var UniformMeshSdkContext = (0,
|
|
517
|
+
var UniformMeshSdkContext = (0, import_react6.createContext)(void 0);
|
|
497
518
|
var useUniformMeshSdkContext = () => {
|
|
498
|
-
const context = (0,
|
|
519
|
+
const context = (0, import_react6.useContext)(UniformMeshSdkContext);
|
|
499
520
|
if (!context) {
|
|
500
521
|
throw new Error("useUniformMeshSdkContext must be used within <MeshApp /> or <UniformMeshSdkContext />");
|
|
501
522
|
}
|
|
@@ -510,13 +531,13 @@ function useUniformMeshSdk() {
|
|
|
510
531
|
|
|
511
532
|
// src/components/UniformMeshLocationContext.tsx
|
|
512
533
|
var import_jsx_runtime16 = require("@emotion/react/jsx-runtime");
|
|
513
|
-
var UniformMeshLocationContext = (0,
|
|
534
|
+
var UniformMeshLocationContext = (0, import_react7.createContext)(void 0);
|
|
514
535
|
var UniformMeshLocationContextProvider = ({
|
|
515
536
|
children
|
|
516
537
|
}) => {
|
|
517
538
|
const sdk = useUniformMeshSdk();
|
|
518
|
-
const [location, setLocation] = (0,
|
|
519
|
-
(0,
|
|
539
|
+
const [location, setLocation] = (0, import_react7.useState)(sdk.getCurrentLocation());
|
|
540
|
+
(0, import_react7.useMemo)(() => {
|
|
520
541
|
const valueChangeListener = (event) => {
|
|
521
542
|
setLocation((old) => ({ ...old, value: event.newValue }));
|
|
522
543
|
};
|
|
@@ -533,7 +554,7 @@ var UniformMeshLocationContextProvider = ({
|
|
|
533
554
|
return /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(UniformMeshLocationContext.Provider, { value: { location }, children });
|
|
534
555
|
};
|
|
535
556
|
var useUniformMeshLocationContext = () => {
|
|
536
|
-
const context = (0,
|
|
557
|
+
const context = (0, import_react7.useContext)(UniformMeshLocationContext);
|
|
537
558
|
if (!context) {
|
|
538
559
|
throw new Error("useUniformMeshLocationContext must be used within a UniformMeshLocationContextProvider");
|
|
539
560
|
}
|
|
@@ -546,9 +567,9 @@ function useMeshLocation(expectedLocation) {
|
|
|
546
567
|
if (expectedLocation && location.type !== expectedLocation) {
|
|
547
568
|
throw new Error(`Expected location type ${expectedLocation} but got ${location.type}`);
|
|
548
569
|
}
|
|
549
|
-
const backdoorLocation = (0,
|
|
570
|
+
const backdoorLocation = (0, import_react8.useRef)(location);
|
|
550
571
|
backdoorLocation.current = location;
|
|
551
|
-
const stabilizedSetValueProxy = (0,
|
|
572
|
+
const stabilizedSetValueProxy = (0, import_react8.useMemo)(
|
|
552
573
|
() => (dispatch) => {
|
|
553
574
|
const { newValue, options } = dispatch(backdoorLocation.current.value);
|
|
554
575
|
backdoorLocation.current.setValue(newValue, options);
|
|
@@ -567,7 +588,7 @@ var import_design_system2 = require("@uniformdev/design-system");
|
|
|
567
588
|
|
|
568
589
|
// src/components/Variables/composer/ControlledValuePlugin.tsx
|
|
569
590
|
var import_LexicalComposerContext = require("@lexical/react/LexicalComposerContext");
|
|
570
|
-
var
|
|
591
|
+
var import_react9 = require("react");
|
|
571
592
|
|
|
572
593
|
// src/components/Variables/util/serializeVariablesEditorState.ts
|
|
573
594
|
var import_canvas2 = require("@uniformdev/canvas");
|
|
@@ -711,7 +732,7 @@ function ControlledValuePlugin({
|
|
|
711
732
|
extraDependencies
|
|
712
733
|
}) {
|
|
713
734
|
const [editor] = (0, import_LexicalComposerContext.useLexicalComposerContext)();
|
|
714
|
-
(0,
|
|
735
|
+
(0, import_react9.useEffect)(() => {
|
|
715
736
|
var _a, _b;
|
|
716
737
|
if (!enabled) {
|
|
717
738
|
return;
|
|
@@ -732,7 +753,7 @@ function ControlledValuePlugin({
|
|
|
732
753
|
|
|
733
754
|
// src/components/Variables/composer/VariableChip.tsx
|
|
734
755
|
var import_design_system3 = require("@uniformdev/design-system");
|
|
735
|
-
var
|
|
756
|
+
var import_react10 = require("react");
|
|
736
757
|
var import_jsx_runtime17 = require("@emotion/react/jsx-runtime");
|
|
737
758
|
function VariableChip({
|
|
738
759
|
displayName,
|
|
@@ -748,7 +769,7 @@ function VariableChip({
|
|
|
748
769
|
}) {
|
|
749
770
|
const hasClickEvent = !!onClick;
|
|
750
771
|
const referenceIsValidFr = isFresh ? true : referenceIsValid;
|
|
751
|
-
const Wrapper = referenceIsValidFr === "warning" ? WarningVariableReference : referenceIsValidFr === "info" ? InfoVariableReference : referenceIsValidFr ?
|
|
772
|
+
const Wrapper = referenceIsValidFr === "warning" ? WarningVariableReference : referenceIsValidFr === "info" ? InfoVariableReference : referenceIsValidFr ? import_react10.Fragment : UndefinedVariableReference;
|
|
752
773
|
const extraTitle = !referenceIsValidFr ? errorMessage : hasClickEvent && clickToEdit ? "Click to edit" : void 0;
|
|
753
774
|
const chippy = /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(import_design_system3.MultilineChip, { onClick, "aria-selected": selected ? true : void 0, "aria-disabled": disabled, children: /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(Wrapper, { children: displayName || reference }) });
|
|
754
775
|
if (tooltip) {
|
|
@@ -814,7 +835,7 @@ var import_utils2 = require("@lexical/utils");
|
|
|
814
835
|
var import_canvas5 = require("@uniformdev/canvas");
|
|
815
836
|
var import_design_system6 = require("@uniformdev/design-system");
|
|
816
837
|
var import_lexical5 = require("lexical");
|
|
817
|
-
var
|
|
838
|
+
var import_react18 = require("react");
|
|
818
839
|
|
|
819
840
|
// src/components/Variables/util/prettifyBindExpression.tsx
|
|
820
841
|
function prettifyBindExpression(bindExpression) {
|
|
@@ -823,7 +844,7 @@ function prettifyBindExpression(bindExpression) {
|
|
|
823
844
|
}
|
|
824
845
|
|
|
825
846
|
// src/components/Variables/composer/VariablesPlugin.tsx
|
|
826
|
-
var
|
|
847
|
+
var import_react16 = require("@emotion/react");
|
|
827
848
|
var import_LexicalComposerContext2 = require("@lexical/react/LexicalComposerContext");
|
|
828
849
|
var import_LexicalTypeaheadMenuPlugin = require("@lexical/react/LexicalTypeaheadMenuPlugin");
|
|
829
850
|
var import_utils = require("@lexical/utils");
|
|
@@ -832,12 +853,12 @@ var import_canvas4 = require("@uniformdev/canvas");
|
|
|
832
853
|
var import_design_system5 = require("@uniformdev/design-system");
|
|
833
854
|
var import_lite = require("dequal/lite");
|
|
834
855
|
var import_lexical4 = require("lexical");
|
|
835
|
-
var
|
|
856
|
+
var import_react17 = require("react");
|
|
836
857
|
var import_react_dom = require("react-dom");
|
|
837
858
|
|
|
838
859
|
// src/components/Variables/toolbox/SelectVariableMenu.styles.ts
|
|
839
|
-
var
|
|
840
|
-
var menuBtn =
|
|
860
|
+
var import_react11 = require("@emotion/react");
|
|
861
|
+
var menuBtn = import_react11.css`
|
|
841
862
|
background: none;
|
|
842
863
|
border: none;
|
|
843
864
|
color: var(--gray-500);
|
|
@@ -847,18 +868,18 @@ var menuBtn = import_react9.css`
|
|
|
847
868
|
outline: none;
|
|
848
869
|
}
|
|
849
870
|
`;
|
|
850
|
-
var menuItemTextGroup =
|
|
871
|
+
var menuItemTextGroup = import_react11.css`
|
|
851
872
|
align-items: flex-start;
|
|
852
873
|
display: flex;
|
|
853
874
|
flex-direction: column;
|
|
854
875
|
gap: 0;
|
|
855
876
|
line-height: 1em;
|
|
856
877
|
`;
|
|
857
|
-
var smallText =
|
|
878
|
+
var smallText = import_react11.css`
|
|
858
879
|
font-size: var(--fs-xs);
|
|
859
880
|
color: var(--gray-500);
|
|
860
881
|
`;
|
|
861
|
-
var variablesTipText =
|
|
882
|
+
var variablesTipText = import_react11.css`
|
|
862
883
|
${smallText}
|
|
863
884
|
color: var(--gray-500);
|
|
864
885
|
padding: 0 var(--spacing-sm);
|
|
@@ -866,18 +887,18 @@ var variablesTipText = import_react9.css`
|
|
|
866
887
|
|
|
867
888
|
// src/components/Variables/VariablesProvider.tsx
|
|
868
889
|
var import_mitt = __toESM(require("mitt"));
|
|
869
|
-
var
|
|
890
|
+
var import_react15 = require("react");
|
|
870
891
|
|
|
871
892
|
// src/components/Variables/util/useVariableEditTransaction.ts
|
|
872
|
-
var
|
|
893
|
+
var import_react12 = require("react");
|
|
873
894
|
function useVariableEditTransaction({
|
|
874
895
|
events,
|
|
875
896
|
dispatch,
|
|
876
897
|
isEditing,
|
|
877
898
|
variables
|
|
878
899
|
}) {
|
|
879
|
-
const [isEditingBinding, setIsEditingBinding] = (0,
|
|
880
|
-
(0,
|
|
900
|
+
const [isEditingBinding, setIsEditingBinding] = (0, import_react12.useState)();
|
|
901
|
+
(0, import_react12.useEffect)(() => {
|
|
881
902
|
if (!isEditingBinding) {
|
|
882
903
|
return;
|
|
883
904
|
}
|
|
@@ -888,7 +909,7 @@ function useVariableEditTransaction({
|
|
|
888
909
|
events.on("editCompleted", fn);
|
|
889
910
|
return () => events.off("editCompleted", fn);
|
|
890
911
|
}, [events, isEditingBinding, variables]);
|
|
891
|
-
(0,
|
|
912
|
+
(0, import_react12.useEffect)(() => {
|
|
892
913
|
if (!isEditing) {
|
|
893
914
|
if (isEditingBinding) {
|
|
894
915
|
isEditingBinding.resolve({ canceled: true });
|
|
@@ -896,7 +917,7 @@ function useVariableEditTransaction({
|
|
|
896
917
|
setIsEditingBinding(void 0);
|
|
897
918
|
}
|
|
898
919
|
}, [isEditing, isEditingBinding]);
|
|
899
|
-
return (0,
|
|
920
|
+
return (0, import_react12.useCallback)(
|
|
900
921
|
async function editVariableTxn(variable, context) {
|
|
901
922
|
if (isEditingBinding) {
|
|
902
923
|
dispatch({ type: "cancelEdit" });
|
|
@@ -916,15 +937,15 @@ function useVariableEditTransaction({
|
|
|
916
937
|
}
|
|
917
938
|
|
|
918
939
|
// src/components/Variables/VariableEditor.tsx
|
|
919
|
-
var
|
|
940
|
+
var import_standard_schema = require("@hookform/resolvers/standard-schema");
|
|
920
941
|
var import_design_system4 = require("@uniformdev/design-system");
|
|
921
|
-
var
|
|
942
|
+
var import_react14 = require("react");
|
|
922
943
|
var import_react_hook_form = require("react-hook-form");
|
|
923
|
-
var z = __toESM(require("zod
|
|
944
|
+
var z = __toESM(require("zod"));
|
|
924
945
|
|
|
925
946
|
// src/components/Variables/styles/VariableEditor.styles.ts
|
|
926
|
-
var
|
|
927
|
-
var variablesFormContainer =
|
|
947
|
+
var import_react13 = require("@emotion/react");
|
|
948
|
+
var variablesFormContainer = import_react13.css`
|
|
928
949
|
> * {
|
|
929
950
|
margin: var(--spacing-base) 0 0;
|
|
930
951
|
}
|
|
@@ -933,7 +954,7 @@ var variablesFormContainer = import_react11.css`
|
|
|
933
954
|
// src/components/Variables/VariableEditor.tsx
|
|
934
955
|
var import_jsx_runtime18 = require("@emotion/react/jsx-runtime");
|
|
935
956
|
var schema = z.object({
|
|
936
|
-
name: z.string().
|
|
957
|
+
name: z.string().min(1, "Name can't be empty").regex(/^[^${}]+$/, "$, {, and } are reserved characters and cannot be used in a variable name"),
|
|
937
958
|
default: z.string(),
|
|
938
959
|
displayName: z.string().optional(),
|
|
939
960
|
helpText: z.string().optional(),
|
|
@@ -959,7 +980,7 @@ function VariableEditor({
|
|
|
959
980
|
order: currentVariable == null ? void 0 : currentVariable.order,
|
|
960
981
|
type: (_d = currentVariable == null ? void 0 : currentVariable.type) != null ? _d : ""
|
|
961
982
|
},
|
|
962
|
-
resolver: (0,
|
|
983
|
+
resolver: (0, import_standard_schema.standardSchemaResolver)(schema)
|
|
963
984
|
});
|
|
964
985
|
const submitHandler = handleSubmit((values) => {
|
|
965
986
|
const finalValue = {
|
|
@@ -977,9 +998,9 @@ function VariableEditor({
|
|
|
977
998
|
},
|
|
978
999
|
activeWhenEditing: true
|
|
979
1000
|
});
|
|
980
|
-
const nameRef = (0,
|
|
1001
|
+
const nameRef = (0, import_react14.useRef)(null);
|
|
981
1002
|
const { ref, ...nameRegister } = register("name");
|
|
982
|
-
(0,
|
|
1003
|
+
(0, import_react14.useLayoutEffect)(() => {
|
|
983
1004
|
if (nameRef.current && !nameRef.current.value) {
|
|
984
1005
|
nameRef.current.focus();
|
|
985
1006
|
}
|
|
@@ -1055,7 +1076,7 @@ function VariableEditor({
|
|
|
1055
1076
|
|
|
1056
1077
|
// src/components/Variables/VariablesProvider.tsx
|
|
1057
1078
|
var import_jsx_runtime19 = require("@emotion/react/jsx-runtime");
|
|
1058
|
-
var VariablesContext = (0,
|
|
1079
|
+
var VariablesContext = (0, import_react15.createContext)(null);
|
|
1059
1080
|
function VariablesProvider({
|
|
1060
1081
|
value,
|
|
1061
1082
|
onChange,
|
|
@@ -1066,9 +1087,9 @@ function VariablesProvider({
|
|
|
1066
1087
|
knownUndefinedValues = {},
|
|
1067
1088
|
onChangeKnownUndefinedValue
|
|
1068
1089
|
}) {
|
|
1069
|
-
const [editing, setEditing] = (0,
|
|
1070
|
-
const [editingContext, setEditingContext] = (0,
|
|
1071
|
-
const events = (0,
|
|
1090
|
+
const [editing, setEditing] = (0, import_react15.useState)();
|
|
1091
|
+
const [editingContext, setEditingContext] = (0, import_react15.useState)();
|
|
1092
|
+
const events = (0, import_react15.useMemo)(
|
|
1072
1093
|
() => (0, import_mitt.default)(),
|
|
1073
1094
|
[]
|
|
1074
1095
|
);
|
|
@@ -1076,7 +1097,7 @@ function VariablesProvider({
|
|
|
1076
1097
|
throw new Error("onChange must be provided when readOnly is false");
|
|
1077
1098
|
}
|
|
1078
1099
|
const Editor = editVariableComponent != null ? editVariableComponent : VariableEditor;
|
|
1079
|
-
const valueBasedContextValue = (0,
|
|
1100
|
+
const valueBasedContextValue = (0, import_react15.useMemo)(
|
|
1080
1101
|
() => ({
|
|
1081
1102
|
flatVariables: flattenVariables(value),
|
|
1082
1103
|
dispatch: (event) => {
|
|
@@ -1120,7 +1141,7 @@ function VariablesProvider({
|
|
|
1120
1141
|
isEditing: typeof editing !== "undefined",
|
|
1121
1142
|
variables: value
|
|
1122
1143
|
});
|
|
1123
|
-
const contextValue = (0,
|
|
1144
|
+
const contextValue = (0, import_react15.useMemo)(() => {
|
|
1124
1145
|
return {
|
|
1125
1146
|
...valueBasedContextValue,
|
|
1126
1147
|
editVariableTxn,
|
|
@@ -1131,7 +1152,7 @@ function VariablesProvider({
|
|
|
1131
1152
|
isLoading: !!isLoading
|
|
1132
1153
|
};
|
|
1133
1154
|
}, [valueBasedContextValue, editVariableTxn, editing, events, knownUndefinedValues, isLoading]);
|
|
1134
|
-
(0,
|
|
1155
|
+
(0, import_react15.useEffect)(() => {
|
|
1135
1156
|
if (editing === void 0) {
|
|
1136
1157
|
return;
|
|
1137
1158
|
}
|
|
@@ -1180,7 +1201,7 @@ function VariablesProvider({
|
|
|
1180
1201
|
] });
|
|
1181
1202
|
}
|
|
1182
1203
|
function useVariables(returnEmptyWithoutProvider = false) {
|
|
1183
|
-
const context = (0,
|
|
1204
|
+
const context = (0, import_react15.useContext)(VariablesContext);
|
|
1184
1205
|
if (!context) {
|
|
1185
1206
|
if (returnEmptyWithoutProvider) {
|
|
1186
1207
|
return {
|
|
@@ -1315,7 +1336,7 @@ function useVariablesMenu({
|
|
|
1315
1336
|
getEditorContext
|
|
1316
1337
|
}) {
|
|
1317
1338
|
const { variables, canDispatch, readOnly } = useVariables(true);
|
|
1318
|
-
const canEditVariable = (0,
|
|
1339
|
+
const canEditVariable = (0, import_react17.useCallback)(
|
|
1319
1340
|
(name2, variable) => (
|
|
1320
1341
|
// name === '' means new var. Add var perms computed by menu options.
|
|
1321
1342
|
name2 === "" || canDispatch && enableEditingVariables && !readOnly && !(variable == null ? void 0 : variable.readOnly)
|
|
@@ -1323,7 +1344,7 @@ function useVariablesMenu({
|
|
|
1323
1344
|
[canDispatch, enableEditingVariables, readOnly]
|
|
1324
1345
|
);
|
|
1325
1346
|
const canAddVariable = canDispatch && showAddVariableMenuOption && !readOnly;
|
|
1326
|
-
const { groupedVariables, menuOptions } = (0,
|
|
1347
|
+
const { groupedVariables, menuOptions } = (0, import_react17.useMemo)(() => {
|
|
1327
1348
|
const groupedVariables2 = variablesToGroupedList(variables, filterVariable, getEditorContext == null ? void 0 : getEditorContext());
|
|
1328
1349
|
if (canAddVariable) {
|
|
1329
1350
|
groupedVariables2.unshift({
|
|
@@ -1345,7 +1366,7 @@ function useVariablesMenu({
|
|
|
1345
1366
|
);
|
|
1346
1367
|
return { menuOptions: menuOptions2, groupedVariables: groupedVariables2 };
|
|
1347
1368
|
}, [variables, filterVariable, getEditorContext, canAddVariable, showAddVariableMenuOption]);
|
|
1348
|
-
const onSelect = (0,
|
|
1369
|
+
const onSelect = (0, import_react17.useCallback)(
|
|
1349
1370
|
({ queryString, value, nodeToReplace, editor, overwriteExistingValue }) => {
|
|
1350
1371
|
if (value === ADD_VARIABLE_OPTION) {
|
|
1351
1372
|
editor.update(() => {
|
|
@@ -1394,9 +1415,9 @@ function VariablesPlugin({
|
|
|
1394
1415
|
}) {
|
|
1395
1416
|
const [editor] = (0, import_LexicalComposerContext2.useLexicalComposerContext)();
|
|
1396
1417
|
const { variables, dispatch, isEditing, canDispatch, readOnly, knownUndefinedValues, isLoading } = useVariables(true);
|
|
1397
|
-
const variablesRef = (0,
|
|
1418
|
+
const variablesRef = (0, import_react17.useRef)({ variables, knownUndefinedValues, isLoading });
|
|
1398
1419
|
variablesRef.current = { variables, knownUndefinedValues, isLoading };
|
|
1399
|
-
const canEditVariable = (0,
|
|
1420
|
+
const canEditVariable = (0, import_react17.useCallback)(
|
|
1400
1421
|
(name2, variable) => (
|
|
1401
1422
|
// name === '' means new var. Add var perms computed by menu options.
|
|
1402
1423
|
name2 === "" || canDispatch && enableEditingVariables && !readOnly && !(variable == null ? void 0 : variable.readOnly)
|
|
@@ -1404,13 +1425,13 @@ function VariablesPlugin({
|
|
|
1404
1425
|
[canDispatch, enableEditingVariables, readOnly]
|
|
1405
1426
|
);
|
|
1406
1427
|
const { editVariable } = useVariableEditor();
|
|
1407
|
-
const [queryString, setQueryString] = (0,
|
|
1428
|
+
const [queryString, setQueryString] = (0, import_react17.useState)(null);
|
|
1408
1429
|
const { groupedVariables, menuOptions, onSelect } = useVariablesMenu({
|
|
1409
1430
|
showAddVariableMenuOption,
|
|
1410
1431
|
filterVariable,
|
|
1411
1432
|
getEditorContext
|
|
1412
1433
|
});
|
|
1413
|
-
const { filteredGroupedVariables, filteredMenuOptions } = (0,
|
|
1434
|
+
const { filteredGroupedVariables, filteredMenuOptions } = (0, import_react17.useMemo)(() => {
|
|
1414
1435
|
if (!queryString) {
|
|
1415
1436
|
return {
|
|
1416
1437
|
filteredGroupedVariables: groupedVariables,
|
|
@@ -1433,7 +1454,7 @@ function VariablesPlugin({
|
|
|
1433
1454
|
)
|
|
1434
1455
|
};
|
|
1435
1456
|
}, [queryString, groupedVariables, menuOptions]);
|
|
1436
|
-
const onSelectOption = (0,
|
|
1457
|
+
const onSelectOption = (0, import_react17.useCallback)(
|
|
1437
1458
|
(selectedOption, nodeToReplace, closeMenu) => {
|
|
1438
1459
|
onSelect({
|
|
1439
1460
|
queryString: queryString != null ? queryString : void 0,
|
|
@@ -1446,7 +1467,7 @@ function VariablesPlugin({
|
|
|
1446
1467
|
},
|
|
1447
1468
|
[editor, onSelect, queryString, replaceValueOnVariableInsert]
|
|
1448
1469
|
);
|
|
1449
|
-
(0,
|
|
1470
|
+
(0, import_react17.useEffect)(() => {
|
|
1450
1471
|
return (0, import_utils.mergeRegister)(
|
|
1451
1472
|
editor.registerCommand(
|
|
1452
1473
|
EDIT_VARIABLE_COMMAND,
|
|
@@ -1586,7 +1607,7 @@ function VariablesPlugin({
|
|
|
1586
1607
|
replaceValueOnVariableInsert,
|
|
1587
1608
|
disableVariableDisplayNames
|
|
1588
1609
|
]);
|
|
1589
|
-
const updateExistingNodeIfChanged = (0,
|
|
1610
|
+
const updateExistingNodeIfChanged = (0, import_react17.useCallback)(
|
|
1590
1611
|
(variableNode) => {
|
|
1591
1612
|
var _a, _b, _c, _d;
|
|
1592
1613
|
const targetVar = variablesRef.current.variables[variableNode.reference];
|
|
@@ -1613,7 +1634,7 @@ function VariablesPlugin({
|
|
|
1613
1634
|
},
|
|
1614
1635
|
[canEditVariable, disableVariableDisplayNames]
|
|
1615
1636
|
);
|
|
1616
|
-
(0,
|
|
1637
|
+
(0, import_react17.useEffect)(() => {
|
|
1617
1638
|
let selection;
|
|
1618
1639
|
editor.read(() => {
|
|
1619
1640
|
selection = (0, import_lexical4.$getSelection)();
|
|
@@ -1627,7 +1648,7 @@ function VariablesPlugin({
|
|
|
1627
1648
|
});
|
|
1628
1649
|
});
|
|
1629
1650
|
}, [editor, variables, knownUndefinedValues, canEditVariable, updateExistingNodeIfChanged]);
|
|
1630
|
-
(0,
|
|
1651
|
+
(0, import_react17.useEffect)(() => {
|
|
1631
1652
|
return editor.registerNodeTransform(VariableNode, (variableNode) => {
|
|
1632
1653
|
updateExistingNodeIfChanged(variableNode);
|
|
1633
1654
|
});
|
|
@@ -1652,7 +1673,7 @@ function VariablesPlugin({
|
|
|
1652
1673
|
"div",
|
|
1653
1674
|
{
|
|
1654
1675
|
"data-auto-resize-opt-in": true,
|
|
1655
|
-
css:
|
|
1676
|
+
css: import_react16.css`
|
|
1656
1677
|
box-shadow: var(--shadow-base);
|
|
1657
1678
|
border-radius: var(--rounded-base);
|
|
1658
1679
|
background: var(--gray-50);
|
|
@@ -1816,7 +1837,7 @@ function VariableNodeComponent({
|
|
|
1816
1837
|
const [editor] = (0, import_LexicalComposerContext3.useLexicalComposerContext)();
|
|
1817
1838
|
const [isSelected, setSelected, clearSelection] = (0, import_useLexicalNodeSelection.useLexicalNodeSelection)(nodeKey);
|
|
1818
1839
|
const readOnly = !editor.isEditable();
|
|
1819
|
-
const onDelete = (0,
|
|
1840
|
+
const onDelete = (0, import_react18.useCallback)(
|
|
1820
1841
|
(event) => {
|
|
1821
1842
|
if (isSelected && (0, import_lexical5.$isNodeSelection)((0, import_lexical5.$getSelection)())) {
|
|
1822
1843
|
event.preventDefault();
|
|
@@ -1829,7 +1850,7 @@ function VariableNodeComponent({
|
|
|
1829
1850
|
},
|
|
1830
1851
|
[isSelected, nodeKey]
|
|
1831
1852
|
);
|
|
1832
|
-
(0,
|
|
1853
|
+
(0, import_react18.useEffect)(() => {
|
|
1833
1854
|
return (0, import_utils2.mergeRegister)(
|
|
1834
1855
|
editor.registerCommand(import_lexical5.KEY_DELETE_COMMAND, onDelete, import_lexical5.COMMAND_PRIORITY_LOW),
|
|
1835
1856
|
editor.registerCommand(import_lexical5.KEY_BACKSPACE_COMMAND, onDelete, import_lexical5.COMMAND_PRIORITY_LOW),
|
|
@@ -1917,9 +1938,9 @@ function $isTargetWithinDecorator(target) {
|
|
|
1917
1938
|
}
|
|
1918
1939
|
|
|
1919
1940
|
// src/components/Variables/InputVariables.tsx
|
|
1920
|
-
var
|
|
1941
|
+
var import_react29 = require("@emotion/react");
|
|
1921
1942
|
var import_design_system9 = require("@uniformdev/design-system");
|
|
1922
|
-
var
|
|
1943
|
+
var import_react30 = require("react");
|
|
1923
1944
|
var import_uuid = require("uuid");
|
|
1924
1945
|
|
|
1925
1946
|
// src/components/Variables/composer/EditorRefPlugin.tsx
|
|
@@ -1940,10 +1961,10 @@ function EditorRefPlugin({
|
|
|
1940
1961
|
var import_LexicalComposerContext5 = require("@lexical/react/LexicalComposerContext");
|
|
1941
1962
|
var import_utils3 = require("@lexical/utils");
|
|
1942
1963
|
var import_lexical6 = require("lexical");
|
|
1943
|
-
var
|
|
1964
|
+
var import_react19 = require("react");
|
|
1944
1965
|
function PasteTransformerPlugin({ transformPaste }) {
|
|
1945
1966
|
const [editor] = (0, import_LexicalComposerContext5.useLexicalComposerContext)();
|
|
1946
|
-
(0,
|
|
1967
|
+
(0, import_react19.useEffect)(() => {
|
|
1947
1968
|
return (0, import_utils3.mergeRegister)(
|
|
1948
1969
|
editor.registerCommand(
|
|
1949
1970
|
import_lexical6.PASTE_COMMAND,
|
|
@@ -1968,17 +1989,17 @@ function PasteTransformerPlugin({ transformPaste }) {
|
|
|
1968
1989
|
}
|
|
1969
1990
|
|
|
1970
1991
|
// src/components/Variables/styles/InputVariables.styles.ts
|
|
1971
|
-
var
|
|
1972
|
-
var menuContainer =
|
|
1992
|
+
var import_react20 = require("@emotion/react");
|
|
1993
|
+
var menuContainer = import_react20.css`
|
|
1973
1994
|
position: relative;
|
|
1974
1995
|
`;
|
|
1975
|
-
var menuBtn2 =
|
|
1996
|
+
var menuBtn2 = import_react20.css`
|
|
1976
1997
|
position: absolute;
|
|
1977
1998
|
top: 50%;
|
|
1978
1999
|
right: var(--spacing-sm);
|
|
1979
2000
|
transform: translateY(-50%);
|
|
1980
2001
|
`;
|
|
1981
|
-
var input =
|
|
2002
|
+
var input = import_react20.css`
|
|
1982
2003
|
--input-padding: 12px var(--spacing-lg) 12px var(--spacing-sm);
|
|
1983
2004
|
appearance: none;
|
|
1984
2005
|
background-color: var(--white);
|
|
@@ -2023,7 +2044,7 @@ var input = import_react18.css`
|
|
|
2023
2044
|
margin: 0;
|
|
2024
2045
|
}
|
|
2025
2046
|
`;
|
|
2026
|
-
var inputCompact =
|
|
2047
|
+
var inputCompact = import_react20.css`
|
|
2027
2048
|
border: 1px solid var(--white);
|
|
2028
2049
|
padding-block: var(--spacing-sm);
|
|
2029
2050
|
font-size: var(--fs-sm);
|
|
@@ -2032,11 +2053,11 @@ var inputCompact = import_react18.css`
|
|
|
2032
2053
|
min-height: 39px;
|
|
2033
2054
|
}
|
|
2034
2055
|
`;
|
|
2035
|
-
var inputDisabled =
|
|
2056
|
+
var inputDisabled = import_react20.css`
|
|
2036
2057
|
cursor: not-allowed;
|
|
2037
2058
|
opacity: var(--opacity-50);
|
|
2038
2059
|
`;
|
|
2039
|
-
var placeholderCaption =
|
|
2060
|
+
var placeholderCaption = import_react20.css`
|
|
2040
2061
|
position: absolute;
|
|
2041
2062
|
color: var(--gray-400);
|
|
2042
2063
|
inset: 12px var(--spacing-base) 12px var(--spacing-sm);
|
|
@@ -2045,14 +2066,14 @@ var placeholderCaption = import_react18.css`
|
|
|
2045
2066
|
white-space: nowrap;
|
|
2046
2067
|
pointer-events: none;
|
|
2047
2068
|
`;
|
|
2048
|
-
var placeholderCompact =
|
|
2069
|
+
var placeholderCompact = import_react20.css`
|
|
2049
2070
|
inset: var(--spacing-sm) var(--spacing-lg) var(--spacing-sm) var(--spacing-sm);
|
|
2050
2071
|
`;
|
|
2051
2072
|
|
|
2052
2073
|
// src/components/Variables/styles/ParameterVariables.styles.ts
|
|
2053
|
-
var
|
|
2074
|
+
var import_react21 = require("@emotion/react");
|
|
2054
2075
|
var import_design_system7 = require("@uniformdev/design-system");
|
|
2055
|
-
var variableBindButton =
|
|
2076
|
+
var variableBindButton = import_react21.css`
|
|
2056
2077
|
--hover-color: var(--accent-dark-hover);
|
|
2057
2078
|
--active-color: var(--accent-dark-active);
|
|
2058
2079
|
border: 1px solid transparent;
|
|
@@ -2095,7 +2116,7 @@ var variableBindButton = import_react19.css`
|
|
|
2095
2116
|
max-height: unset;
|
|
2096
2117
|
}
|
|
2097
2118
|
`;
|
|
2098
|
-
var input2 =
|
|
2119
|
+
var input2 = import_react21.css`
|
|
2099
2120
|
display: block;
|
|
2100
2121
|
appearance: none;
|
|
2101
2122
|
box-sizing: border-box;
|
|
@@ -2149,7 +2170,7 @@ var input2 = import_react19.css`
|
|
|
2149
2170
|
margin: 0;
|
|
2150
2171
|
}
|
|
2151
2172
|
`;
|
|
2152
|
-
var inputMultiLine = (lines) =>
|
|
2173
|
+
var inputMultiLine = (lines) => import_react21.css`
|
|
2153
2174
|
${import_design_system7.scrollbarStyles}
|
|
2154
2175
|
// 1.5 = line height, spacing-sm = top and bottom padding + spacing-xs to give a slight increase in height
|
|
2155
2176
|
// as the text looked to close to the bottom of the input
|
|
@@ -2160,7 +2181,7 @@ var inputMultiLine = (lines) => import_react19.css`
|
|
|
2160
2181
|
|
|
2161
2182
|
// src/components/Variables/toolbox/InputVariablesProvider.tsx
|
|
2162
2183
|
var import_canvas6 = require("@uniformdev/canvas");
|
|
2163
|
-
var
|
|
2184
|
+
var import_react22 = require("react");
|
|
2164
2185
|
function useInputVariablesState({
|
|
2165
2186
|
value,
|
|
2166
2187
|
onChange,
|
|
@@ -2176,14 +2197,14 @@ function useInputVariablesState({
|
|
|
2176
2197
|
}) {
|
|
2177
2198
|
const { variables } = useVariables(true);
|
|
2178
2199
|
const variableReferenceCountInValue = (0, import_canvas6.hasReferencedVariables)(value != null ? value : "");
|
|
2179
|
-
const [lastKnownId, setLastKnownId] = (0,
|
|
2180
|
-
const [hadVariablesInValue, setHadVariablesInValue] = (0,
|
|
2181
|
-
(0,
|
|
2200
|
+
const [lastKnownId, setLastKnownId] = (0, import_react22.useState)(id);
|
|
2201
|
+
const [hadVariablesInValue, setHadVariablesInValue] = (0, import_react22.useState)(variableReferenceCountInValue > 0);
|
|
2202
|
+
(0, import_react22.useEffect)(() => {
|
|
2182
2203
|
if (variableReferenceCountInValue) {
|
|
2183
2204
|
setHadVariablesInValue(true);
|
|
2184
2205
|
}
|
|
2185
2206
|
}, [variableReferenceCountInValue]);
|
|
2186
|
-
(0,
|
|
2207
|
+
(0, import_react22.useEffect)(() => {
|
|
2187
2208
|
if (id !== lastKnownId) {
|
|
2188
2209
|
setLastKnownId(id);
|
|
2189
2210
|
setHadVariablesInValue(variableReferenceCountInValue > 0);
|
|
@@ -2192,7 +2213,7 @@ function useInputVariablesState({
|
|
|
2192
2213
|
const hadVariablesInValueForReals = inputWhenNoVariables ? hadVariablesInValue : variableReferenceCountInValue > 0;
|
|
2193
2214
|
const disableVariablesForReals = disableVariables || Object.keys(variables).length === 0 && !showAddVariableMenuOption;
|
|
2194
2215
|
const disableResetForReals = !inputWhenNoVariables || !hadVariablesInValueForReals;
|
|
2195
|
-
const sharedMenuProps = (0,
|
|
2216
|
+
const sharedMenuProps = (0, import_react22.useMemo)(
|
|
2196
2217
|
() => ({
|
|
2197
2218
|
menuTooltip,
|
|
2198
2219
|
showAddVariableMenuOption,
|
|
@@ -2225,8 +2246,8 @@ function useInputVariablesState({
|
|
|
2225
2246
|
}
|
|
2226
2247
|
|
|
2227
2248
|
// src/components/Variables/toolbox/VariableField.styles.ts
|
|
2228
|
-
var
|
|
2229
|
-
var labelText =
|
|
2249
|
+
var import_react23 = require("@emotion/react");
|
|
2250
|
+
var labelText = import_react23.css`
|
|
2230
2251
|
align-items: center;
|
|
2231
2252
|
display: flex;
|
|
2232
2253
|
gap: var(--spacing-xs);
|
|
@@ -2242,7 +2263,7 @@ var import_lexical7 = require("lexical");
|
|
|
2242
2263
|
var import_BsFillPlusCircleFill = require("@react-icons/all-files/bs/BsFillPlusCircleFill");
|
|
2243
2264
|
var import_CgUsbC = require("@react-icons/all-files/cg/CgUsbC");
|
|
2244
2265
|
var import_design_system8 = require("@uniformdev/design-system");
|
|
2245
|
-
var
|
|
2266
|
+
var import_react24 = require("react");
|
|
2246
2267
|
var import_jsx_runtime22 = require("@emotion/react/jsx-runtime");
|
|
2247
2268
|
function SelectVariableMenu({
|
|
2248
2269
|
onSelectVariable,
|
|
@@ -2257,7 +2278,7 @@ function SelectVariableMenu({
|
|
|
2257
2278
|
filterVariable
|
|
2258
2279
|
}) {
|
|
2259
2280
|
const { variables, canDispatch, readOnly } = useVariables(true);
|
|
2260
|
-
const btnRef = (0,
|
|
2281
|
+
const btnRef = (0, import_react24.useRef)(null);
|
|
2261
2282
|
const { editVariable } = useVariableEditor();
|
|
2262
2283
|
const variablesGroups = variablesToGroupedList(variables, filterVariable, getEditorContext == null ? void 0 : getEditorContext());
|
|
2263
2284
|
const showAddVariableMenuOptionForReals = showAddVariableMenuOption && canDispatch && !readOnly;
|
|
@@ -2390,14 +2411,14 @@ var import_LexicalAutoFocusPlugin = require("@lexical/react/LexicalAutoFocusPlug
|
|
|
2390
2411
|
var import_LexicalClearEditorPlugin = require("@lexical/react/LexicalClearEditorPlugin");
|
|
2391
2412
|
var import_LexicalComposer = require("@lexical/react/LexicalComposer");
|
|
2392
2413
|
var import_LexicalOnChangePlugin = require("@lexical/react/LexicalOnChangePlugin");
|
|
2393
|
-
var
|
|
2414
|
+
var import_react27 = require("react");
|
|
2394
2415
|
|
|
2395
2416
|
// src/components/Variables/composer/DisablePlugin.tsx
|
|
2396
2417
|
var import_LexicalComposerContext7 = require("@lexical/react/LexicalComposerContext");
|
|
2397
|
-
var
|
|
2418
|
+
var import_react25 = require("react");
|
|
2398
2419
|
function DisablePlugin({ disabled }) {
|
|
2399
2420
|
const [editor] = (0, import_LexicalComposerContext7.useLexicalComposerContext)();
|
|
2400
|
-
(0,
|
|
2421
|
+
(0, import_react25.useEffect)(() => {
|
|
2401
2422
|
editor.setEditable(!disabled);
|
|
2402
2423
|
}, [editor, disabled]);
|
|
2403
2424
|
return null;
|
|
@@ -2406,10 +2427,10 @@ function DisablePlugin({ disabled }) {
|
|
|
2406
2427
|
// src/components/Variables/composer/SingleLineTextPlugin.tsx
|
|
2407
2428
|
var import_LexicalComposerContext8 = require("@lexical/react/LexicalComposerContext");
|
|
2408
2429
|
var import_lexical8 = require("lexical");
|
|
2409
|
-
var
|
|
2430
|
+
var import_react26 = require("react");
|
|
2410
2431
|
function SingleLineTextPlugin() {
|
|
2411
2432
|
const [editor] = (0, import_LexicalComposerContext8.useLexicalComposerContext)();
|
|
2412
|
-
(0,
|
|
2433
|
+
(0, import_react26.useEffect)(() => {
|
|
2413
2434
|
editor.registerNodeTransform(import_lexical8.LineBreakNode, (node) => {
|
|
2414
2435
|
node.remove();
|
|
2415
2436
|
});
|
|
@@ -2430,8 +2451,8 @@ function VariablesComposer(props) {
|
|
|
2430
2451
|
autoFocus,
|
|
2431
2452
|
...variablesPluginProps
|
|
2432
2453
|
} = props;
|
|
2433
|
-
const [lastEmittedValue, setLastEmittedValue] = (0,
|
|
2434
|
-
const editorConfig = (0,
|
|
2454
|
+
const [lastEmittedValue, setLastEmittedValue] = (0, import_react27.useState)(value);
|
|
2455
|
+
const editorConfig = (0, import_react27.useMemo)(
|
|
2435
2456
|
() => ({
|
|
2436
2457
|
namespace: "uniform",
|
|
2437
2458
|
onError(error) {
|
|
@@ -2440,11 +2461,11 @@ function VariablesComposer(props) {
|
|
|
2440
2461
|
nodes: [VariableNode],
|
|
2441
2462
|
editorState: deserializeVariablesEditorState(props.value)
|
|
2442
2463
|
}),
|
|
2443
|
-
//
|
|
2464
|
+
// oxlint-disable-next-line react/exhaustive-deps
|
|
2444
2465
|
[]
|
|
2445
2466
|
);
|
|
2446
|
-
const editorState = (0,
|
|
2447
|
-
const updateTimeout = (0,
|
|
2467
|
+
const editorState = (0, import_react27.useRef)(void 0);
|
|
2468
|
+
const updateTimeout = (0, import_react27.useRef)(void 0);
|
|
2448
2469
|
if (typeof document === "undefined") return null;
|
|
2449
2470
|
return /* @__PURE__ */ (0, import_jsx_runtime25.jsxs)(import_LexicalComposer.LexicalComposer, { initialConfig: editorConfig, children: [
|
|
2450
2471
|
/* @__PURE__ */ (0, import_jsx_runtime25.jsx)(
|
|
@@ -2486,7 +2507,7 @@ var import_LexicalHistoryPlugin = require("@lexical/react/LexicalHistoryPlugin")
|
|
|
2486
2507
|
var import_LexicalPlainTextPlugin = require("@lexical/react/LexicalPlainTextPlugin");
|
|
2487
2508
|
var import_utils4 = require("@lexical/utils");
|
|
2488
2509
|
var import_lexical9 = require("lexical");
|
|
2489
|
-
var
|
|
2510
|
+
var import_react28 = require("react");
|
|
2490
2511
|
var import_jsx_runtime26 = require("@emotion/react/jsx-runtime");
|
|
2491
2512
|
function VariablesComposerInput({
|
|
2492
2513
|
css: css23,
|
|
@@ -2508,7 +2529,7 @@ function VariablesComposerInput({
|
|
|
2508
2529
|
}
|
|
2509
2530
|
function RichishCopyAndPastePlugin() {
|
|
2510
2531
|
const [editor] = (0, import_LexicalComposerContext9.useLexicalComposerContext)();
|
|
2511
|
-
(0,
|
|
2532
|
+
(0, import_react28.useEffect)(() => {
|
|
2512
2533
|
return (0, import_utils4.mergeRegister)(
|
|
2513
2534
|
editor.registerCommand(
|
|
2514
2535
|
import_lexical9.COPY_COMMAND,
|
|
@@ -2615,7 +2636,7 @@ function InputVariables(props) {
|
|
|
2615
2636
|
singleTokenMode,
|
|
2616
2637
|
disableVariableDisplayNames
|
|
2617
2638
|
} = props;
|
|
2618
|
-
const [finalId] = (0,
|
|
2639
|
+
const [finalId] = (0, import_react30.useState)(id != null ? id : () => (0, import_uuid.v4)());
|
|
2619
2640
|
const { dispatch, canDispatch, isEditing } = useVariables(true);
|
|
2620
2641
|
const { disableVariablesForReals, hadVariablesInValue, sharedMenuProps } = useInputVariablesState(props);
|
|
2621
2642
|
const useInputWithNoVariables = Boolean(inputWhenNoVariables && !hadVariablesInValue);
|
|
@@ -2634,7 +2655,7 @@ function InputVariables(props) {
|
|
|
2634
2655
|
{
|
|
2635
2656
|
align: "center",
|
|
2636
2657
|
gap: "xs",
|
|
2637
|
-
css:
|
|
2658
|
+
css: import_react29.css`
|
|
2638
2659
|
position: relative;
|
|
2639
2660
|
& > div:first-of-type {
|
|
2640
2661
|
flex-grow: 1;
|
|
@@ -2763,7 +2784,7 @@ function InputVariablesOverlayMenu({
|
|
|
2763
2784
|
var import_CgUsbC2 = require("@react-icons/all-files/cg/CgUsbC");
|
|
2764
2785
|
var import_canvas7 = require("@uniformdev/canvas");
|
|
2765
2786
|
var import_design_system10 = require("@uniformdev/design-system");
|
|
2766
|
-
var
|
|
2787
|
+
var import_react31 = require("react");
|
|
2767
2788
|
var import_jsx_runtime28 = require("@emotion/react/jsx-runtime");
|
|
2768
2789
|
function ParameterConnectionIndicator({
|
|
2769
2790
|
children,
|
|
@@ -2774,7 +2795,7 @@ function ParameterConnectionIndicator({
|
|
|
2774
2795
|
overrideMenuButtonParentMargin,
|
|
2775
2796
|
renderMenuInPortal = false
|
|
2776
2797
|
}) {
|
|
2777
|
-
const hasVariablesInValue = (0,
|
|
2798
|
+
const hasVariablesInValue = (0, import_react31.useMemo)(() => {
|
|
2778
2799
|
let result = false;
|
|
2779
2800
|
(0, import_canvas7.bindVariablesToObject)({
|
|
2780
2801
|
value,
|
|
@@ -2819,21 +2840,21 @@ function ParameterConnectionIndicator({
|
|
|
2819
2840
|
|
|
2820
2841
|
// src/components/Variables/ParameterOrSingleVariable.tsx
|
|
2821
2842
|
var import_design_system11 = require("@uniformdev/design-system");
|
|
2822
|
-
var
|
|
2843
|
+
var import_react33 = require("react");
|
|
2823
2844
|
|
|
2824
2845
|
// src/components/Variables/composer/OnDisconnectPlugin.tsx
|
|
2825
2846
|
var import_LexicalComposerContext10 = require("@lexical/react/LexicalComposerContext");
|
|
2826
2847
|
var import_utils5 = require("@lexical/utils");
|
|
2827
2848
|
var import_lexical10 = require("lexical");
|
|
2828
|
-
var
|
|
2849
|
+
var import_react32 = require("react");
|
|
2829
2850
|
function OnDisconnectPlugin({
|
|
2830
2851
|
onDisconnect
|
|
2831
2852
|
}) {
|
|
2832
2853
|
const [editor] = (0, import_LexicalComposerContext10.useLexicalComposerContext)();
|
|
2833
2854
|
const { variables } = useVariables(true);
|
|
2834
|
-
const variablesRef = (0,
|
|
2855
|
+
const variablesRef = (0, import_react32.useRef)(variables);
|
|
2835
2856
|
variablesRef.current = variables;
|
|
2836
|
-
(0,
|
|
2857
|
+
(0, import_react32.useEffect)(() => {
|
|
2837
2858
|
return (0, import_utils5.mergeRegister)(
|
|
2838
2859
|
editor.registerCommand(
|
|
2839
2860
|
DISCONNECT_VARIABLE_COMMAND,
|
|
@@ -2878,7 +2899,7 @@ function ParameterOrSingleVariable(props) {
|
|
|
2878
2899
|
hasVariablesInValue,
|
|
2879
2900
|
setHadVariablesInValue
|
|
2880
2901
|
} = useInputVariablesState(props);
|
|
2881
|
-
const handleDisconnect = (0,
|
|
2902
|
+
const handleDisconnect = (0, import_react33.useCallback)(
|
|
2882
2903
|
(variable) => {
|
|
2883
2904
|
setHadVariablesInValue(false);
|
|
2884
2905
|
if (onDisconnect) {
|
|
@@ -2931,7 +2952,7 @@ function ParameterOrSingleVariable(props) {
|
|
|
2931
2952
|
}
|
|
2932
2953
|
|
|
2933
2954
|
// src/components/Variables/ParameterVariables.tsx
|
|
2934
|
-
var
|
|
2955
|
+
var import_react34 = require("@emotion/react");
|
|
2935
2956
|
var import_design_system12 = require("@uniformdev/design-system");
|
|
2936
2957
|
var import_jsx_runtime30 = require("@emotion/react/jsx-runtime");
|
|
2937
2958
|
function ParameterVariables(props) {
|
|
@@ -2988,8 +3009,8 @@ function ParameterVariables(props) {
|
|
|
2988
3009
|
"data-text-value": value,
|
|
2989
3010
|
css: [
|
|
2990
3011
|
input2,
|
|
2991
|
-
typeof multiLine === "number" ? inputMultiLine(multiLine) : multiLine === true ? inputMultiLine(2) :
|
|
2992
|
-
inputCss != null ? inputCss :
|
|
3012
|
+
typeof multiLine === "number" ? inputMultiLine(multiLine) : multiLine === true ? inputMultiLine(2) : import_react34.css``,
|
|
3013
|
+
inputCss != null ? inputCss : import_react34.css``
|
|
2993
3014
|
]
|
|
2994
3015
|
}
|
|
2995
3016
|
)
|
|
@@ -3025,18 +3046,18 @@ ${prettifyBindExpression(bindExpression)}`
|
|
|
3025
3046
|
}
|
|
3026
3047
|
|
|
3027
3048
|
// src/components/Variables/VariablesList.tsx
|
|
3028
|
-
var
|
|
3049
|
+
var import_react37 = require("@emotion/react");
|
|
3029
3050
|
var import_dnd2 = require("@hello-pangea/dnd");
|
|
3030
3051
|
var import_CgTrash = require("@react-icons/all-files/cg/CgTrash");
|
|
3031
3052
|
var import_design_system13 = require("@uniformdev/design-system");
|
|
3032
3053
|
|
|
3033
3054
|
// src/components/DragDropContext.tsx
|
|
3034
3055
|
var import_dnd = require("@hello-pangea/dnd");
|
|
3035
|
-
var
|
|
3056
|
+
var import_react35 = require("react");
|
|
3036
3057
|
var import_react_use = require("react-use");
|
|
3037
3058
|
var import_jsx_runtime31 = require("@emotion/react/jsx-runtime");
|
|
3038
3059
|
function DragDropContext({ children, ...props }) {
|
|
3039
|
-
const [isReady, setIsReady] = (0,
|
|
3060
|
+
const [isReady, setIsReady] = (0, import_react35.useState)(false);
|
|
3040
3061
|
(0, import_react_use.useDebounce)(
|
|
3041
3062
|
() => {
|
|
3042
3063
|
setIsReady(true);
|
|
@@ -3048,8 +3069,8 @@ function DragDropContext({ children, ...props }) {
|
|
|
3048
3069
|
}
|
|
3049
3070
|
|
|
3050
3071
|
// src/components/Variables/styles/VariablesList.styles.ts
|
|
3051
|
-
var
|
|
3052
|
-
var tableRow = (isDragging) =>
|
|
3072
|
+
var import_react36 = require("@emotion/react");
|
|
3073
|
+
var tableRow = (isDragging) => import_react36.css`
|
|
3053
3074
|
position: relative;
|
|
3054
3075
|
${isDragging ? `
|
|
3055
3076
|
display: table;
|
|
@@ -3057,7 +3078,7 @@ var tableRow = (isDragging) => import_react34.css`
|
|
|
3057
3078
|
top: auto !important;
|
|
3058
3079
|
` : void 0}
|
|
3059
3080
|
`;
|
|
3060
|
-
var tableCellDragIcon =
|
|
3081
|
+
var tableCellDragIcon = import_react36.css`
|
|
3061
3082
|
&::after {
|
|
3062
3083
|
content: '';
|
|
3063
3084
|
display: block;
|
|
@@ -3075,7 +3096,7 @@ var tableCellDragIcon = import_react34.css`
|
|
|
3075
3096
|
opacity: 1;
|
|
3076
3097
|
}
|
|
3077
3098
|
`;
|
|
3078
|
-
var variableName =
|
|
3099
|
+
var variableName = import_react36.css`
|
|
3079
3100
|
border: none;
|
|
3080
3101
|
font-weight: var(--fw-medium);
|
|
3081
3102
|
padding: 0;
|
|
@@ -3085,7 +3106,7 @@ var variableName = import_react34.css`
|
|
|
3085
3106
|
white-space: nowrap;
|
|
3086
3107
|
max-width: 20ch;
|
|
3087
3108
|
`;
|
|
3088
|
-
var variableValue =
|
|
3109
|
+
var variableValue = import_react36.css`
|
|
3089
3110
|
overflow: hidden;
|
|
3090
3111
|
text-overflow: ellipsis;
|
|
3091
3112
|
white-space: nowrap;
|
|
@@ -3164,7 +3185,7 @@ function VariablesList() {
|
|
|
3164
3185
|
title: `delete ${text}`,
|
|
3165
3186
|
css: [
|
|
3166
3187
|
import_design_system13.button,
|
|
3167
|
-
|
|
3188
|
+
import_react37.css`
|
|
3168
3189
|
background: transparent;
|
|
3169
3190
|
`
|
|
3170
3191
|
],
|
|
@@ -3294,9 +3315,9 @@ function TextVariableRenderer({ definition, value, setValue }) {
|
|
|
3294
3315
|
}
|
|
3295
3316
|
|
|
3296
3317
|
// src/components/Request/RequestBody.tsx
|
|
3297
|
-
var
|
|
3318
|
+
var import_react39 = require("@emotion/react");
|
|
3298
3319
|
var import_design_system15 = require("@uniformdev/design-system");
|
|
3299
|
-
var
|
|
3320
|
+
var import_react40 = require("react");
|
|
3300
3321
|
|
|
3301
3322
|
// src/components/Request/RequestProvider.tsx
|
|
3302
3323
|
var React4 = __toESM(require("react"));
|
|
@@ -3384,11 +3405,11 @@ function useRequest() {
|
|
|
3384
3405
|
}
|
|
3385
3406
|
|
|
3386
3407
|
// src/components/Request/styles/Request.styles.ts
|
|
3387
|
-
var
|
|
3388
|
-
var innerContentStyles =
|
|
3408
|
+
var import_react38 = require("@emotion/react");
|
|
3409
|
+
var innerContentStyles = import_react38.css`
|
|
3389
3410
|
background: var(--white);
|
|
3390
3411
|
`;
|
|
3391
|
-
var requestTypeContainer = (bgColor) =>
|
|
3412
|
+
var requestTypeContainer = (bgColor) => import_react38.css`
|
|
3392
3413
|
align-items: start;
|
|
3393
3414
|
background: ${bgColor};
|
|
3394
3415
|
display: grid;
|
|
@@ -3426,11 +3447,11 @@ var LANGUAGE_TO_CONTENT_TYPE = {
|
|
|
3426
3447
|
};
|
|
3427
3448
|
function RequestBody() {
|
|
3428
3449
|
const { request, dispatch } = useRequest();
|
|
3429
|
-
const [language, setLanguage] = (0,
|
|
3450
|
+
const [language, setLanguage] = (0, import_react40.useState)("json");
|
|
3430
3451
|
return /* @__PURE__ */ (0, import_jsx_runtime37.jsxs)(
|
|
3431
3452
|
"div",
|
|
3432
3453
|
{
|
|
3433
|
-
css:
|
|
3454
|
+
css: import_react39.css`
|
|
3434
3455
|
background: var(--white);
|
|
3435
3456
|
`,
|
|
3436
3457
|
children: [
|
|
@@ -3438,7 +3459,7 @@ function RequestBody() {
|
|
|
3438
3459
|
RequestTypeContainer,
|
|
3439
3460
|
{
|
|
3440
3461
|
bgColor: "var(--gray-100)",
|
|
3441
|
-
css:
|
|
3462
|
+
css: import_react39.css`
|
|
3442
3463
|
padding: var(--spacing-sm) var(--spacing-base);
|
|
3443
3464
|
`,
|
|
3444
3465
|
children: /* @__PURE__ */ (0, import_jsx_runtime37.jsx)(
|
|
@@ -3715,8 +3736,8 @@ function RequestParameters({
|
|
|
3715
3736
|
}
|
|
3716
3737
|
|
|
3717
3738
|
// src/components/Request/RequestUrl.tsx
|
|
3718
|
-
var
|
|
3719
|
-
var
|
|
3739
|
+
var import_react41 = require("@emotion/react");
|
|
3740
|
+
var import_react42 = require("react");
|
|
3720
3741
|
|
|
3721
3742
|
// src/components/Request/urlEncodeRequestParameter.ts
|
|
3722
3743
|
function urlEncodeRequestUrl(url, varValues) {
|
|
@@ -3742,7 +3763,7 @@ function RequestUrl() {
|
|
|
3742
3763
|
var _a, _b;
|
|
3743
3764
|
const { variables } = useVariables();
|
|
3744
3765
|
const { request } = useRequest();
|
|
3745
|
-
const mergedParameters = (0,
|
|
3766
|
+
const mergedParameters = (0, import_react42.useMemo)(() => {
|
|
3746
3767
|
var _a2;
|
|
3747
3768
|
if (!((_a2 = request.baseRequest) == null ? void 0 : _a2.parameters)) {
|
|
3748
3769
|
return request.parameters;
|
|
@@ -3752,7 +3773,7 @@ function RequestUrl() {
|
|
|
3752
3773
|
return /* @__PURE__ */ (0, import_jsx_runtime41.jsxs)(
|
|
3753
3774
|
"small",
|
|
3754
3775
|
{
|
|
3755
|
-
css:
|
|
3776
|
+
css: import_react41.css`
|
|
3756
3777
|
display: inline-block;
|
|
3757
3778
|
margin-bottom: var(--spacing-xs);
|
|
3758
3779
|
word-break: break-word;
|
|
@@ -3985,17 +4006,182 @@ function convertRequestDataToDataType(dataType, requestData) {
|
|
|
3985
4006
|
};
|
|
3986
4007
|
}
|
|
3987
4008
|
|
|
3988
|
-
// src/components/
|
|
4009
|
+
// src/components/Delegation/DelegationGate.tsx
|
|
3989
4010
|
var import_design_system19 = require("@uniformdev/design-system");
|
|
4011
|
+
var import_react43 = require("react");
|
|
4012
|
+
var import_jsx_runtime45 = require("@emotion/react/jsx-runtime");
|
|
4013
|
+
var defaultLoadingWrapperStyle = {
|
|
4014
|
+
position: "relative",
|
|
4015
|
+
minHeight: "12rem",
|
|
4016
|
+
width: "100%"
|
|
4017
|
+
};
|
|
4018
|
+
function DefaultDelegationLoading() {
|
|
4019
|
+
return /* @__PURE__ */ (0, import_jsx_runtime45.jsx)("div", { style: defaultLoadingWrapperStyle, children: /* @__PURE__ */ (0, import_jsx_runtime45.jsx)(import_design_system19.LoadingOverlay, { isActive: true, statusMessage: "Connecting to Uniform..." }) });
|
|
4020
|
+
}
|
|
4021
|
+
function DefaultDelegationDisabled() {
|
|
4022
|
+
return /* @__PURE__ */ (0, import_jsx_runtime45.jsx)(import_design_system19.Callout, { type: "caution", title: "Feature unavailable", children: "This app requires permissions that are not currently enabled. Please contact your Uniform administrator to enable identity delegation for this integration." });
|
|
4023
|
+
}
|
|
4024
|
+
function DefaultDelegationError({ error }) {
|
|
4025
|
+
(0, import_react43.useEffect)(() => {
|
|
4026
|
+
console.error("Delegation connection failed", error);
|
|
4027
|
+
}, [error]);
|
|
4028
|
+
return /* @__PURE__ */ (0, import_jsx_runtime45.jsx)(import_design_system19.Callout, { type: "error", title: "Connection error", children: /* @__PURE__ */ (0, import_jsx_runtime45.jsx)("p", { children: "Failed to connect to Uniform. Try again, or contact your administrator if the problem persists." }) });
|
|
4029
|
+
}
|
|
4030
|
+
function DelegationGate({
|
|
4031
|
+
children,
|
|
4032
|
+
loadingComponent,
|
|
4033
|
+
disabledComponent,
|
|
4034
|
+
errorComponent
|
|
4035
|
+
}) {
|
|
4036
|
+
const { status, error } = useDelegation();
|
|
4037
|
+
if (status === "active") {
|
|
4038
|
+
return /* @__PURE__ */ (0, import_jsx_runtime45.jsx)(import_jsx_runtime45.Fragment, { children });
|
|
4039
|
+
}
|
|
4040
|
+
if (status === "idle" || status === "acquiring") {
|
|
4041
|
+
return /* @__PURE__ */ (0, import_jsx_runtime45.jsx)(import_jsx_runtime45.Fragment, { children: loadingComponent !== void 0 ? loadingComponent : /* @__PURE__ */ (0, import_jsx_runtime45.jsx)(DefaultDelegationLoading, {}) });
|
|
4042
|
+
}
|
|
4043
|
+
if (status === "disabled") {
|
|
4044
|
+
return /* @__PURE__ */ (0, import_jsx_runtime45.jsx)(import_jsx_runtime45.Fragment, { children: disabledComponent !== void 0 ? disabledComponent : /* @__PURE__ */ (0, import_jsx_runtime45.jsx)(DefaultDelegationDisabled, {}) });
|
|
4045
|
+
}
|
|
4046
|
+
if (status === "error") {
|
|
4047
|
+
const resolvedError = error != null ? error : new Error("Unknown delegation error");
|
|
4048
|
+
if (errorComponent !== void 0) {
|
|
4049
|
+
if (typeof errorComponent === "function") {
|
|
4050
|
+
return /* @__PURE__ */ (0, import_jsx_runtime45.jsx)(import_jsx_runtime45.Fragment, { children: errorComponent({ error: resolvedError }) });
|
|
4051
|
+
}
|
|
4052
|
+
return /* @__PURE__ */ (0, import_jsx_runtime45.jsx)(import_jsx_runtime45.Fragment, { children: errorComponent });
|
|
4053
|
+
}
|
|
4054
|
+
return /* @__PURE__ */ (0, import_jsx_runtime45.jsx)(DefaultDelegationError, { error: resolvedError });
|
|
4055
|
+
}
|
|
4056
|
+
return null;
|
|
4057
|
+
}
|
|
4058
|
+
|
|
4059
|
+
// src/components/Delegation/DelegationProvider.tsx
|
|
4060
|
+
var import_react44 = require("react");
|
|
4061
|
+
var import_jsx_runtime46 = require("@emotion/react/jsx-runtime");
|
|
4062
|
+
var DEFAULT_REVALIDATE_AFTER_MS = 5 * 60 * 1e3;
|
|
4063
|
+
function DelegationProvider({
|
|
4064
|
+
sdk,
|
|
4065
|
+
onSessionToken,
|
|
4066
|
+
checkActive,
|
|
4067
|
+
revalidateOnFocus = true,
|
|
4068
|
+
revalidateAfterMs = DEFAULT_REVALIDATE_AFTER_MS,
|
|
4069
|
+
children
|
|
4070
|
+
}) {
|
|
4071
|
+
const [status, setStatus] = (0, import_react44.useState)("idle");
|
|
4072
|
+
const [error, setError] = (0, import_react44.useState)(null);
|
|
4073
|
+
const acquiringRef = (0, import_react44.useRef)(false);
|
|
4074
|
+
const mountedRef = (0, import_react44.useRef)(true);
|
|
4075
|
+
const statusRef = (0, import_react44.useRef)("idle");
|
|
4076
|
+
statusRef.current = status;
|
|
4077
|
+
const acquire = (0, import_react44.useCallback)(async () => {
|
|
4078
|
+
if (acquiringRef.current) {
|
|
4079
|
+
return;
|
|
4080
|
+
}
|
|
4081
|
+
acquiringRef.current = true;
|
|
4082
|
+
setStatus("acquiring");
|
|
4083
|
+
setError(null);
|
|
4084
|
+
try {
|
|
4085
|
+
const isActive = await checkActive();
|
|
4086
|
+
if (isActive) {
|
|
4087
|
+
if (mountedRef.current) {
|
|
4088
|
+
setStatus("active");
|
|
4089
|
+
}
|
|
4090
|
+
return;
|
|
4091
|
+
}
|
|
4092
|
+
if (!mountedRef.current) {
|
|
4093
|
+
return;
|
|
4094
|
+
}
|
|
4095
|
+
const sessionToken = await sdk.getSessionToken();
|
|
4096
|
+
if (!mountedRef.current) {
|
|
4097
|
+
return;
|
|
4098
|
+
}
|
|
4099
|
+
if (!sessionToken) {
|
|
4100
|
+
setStatus("disabled");
|
|
4101
|
+
return;
|
|
4102
|
+
}
|
|
4103
|
+
await onSessionToken(sessionToken);
|
|
4104
|
+
if (mountedRef.current) {
|
|
4105
|
+
setStatus("active");
|
|
4106
|
+
}
|
|
4107
|
+
} catch (err) {
|
|
4108
|
+
if (mountedRef.current) {
|
|
4109
|
+
setError(err instanceof Error ? err : new Error(String(err)));
|
|
4110
|
+
setStatus("error");
|
|
4111
|
+
}
|
|
4112
|
+
} finally {
|
|
4113
|
+
acquiringRef.current = false;
|
|
4114
|
+
}
|
|
4115
|
+
}, [sdk, onSessionToken, checkActive]);
|
|
4116
|
+
(0, import_react44.useEffect)(() => {
|
|
4117
|
+
mountedRef.current = true;
|
|
4118
|
+
void acquire();
|
|
4119
|
+
return () => {
|
|
4120
|
+
mountedRef.current = false;
|
|
4121
|
+
};
|
|
4122
|
+
}, [acquire]);
|
|
4123
|
+
const revalidate = (0, import_react44.useCallback)(async () => {
|
|
4124
|
+
if (acquiringRef.current) {
|
|
4125
|
+
return;
|
|
4126
|
+
}
|
|
4127
|
+
if (statusRef.current !== "active") {
|
|
4128
|
+
return;
|
|
4129
|
+
}
|
|
4130
|
+
try {
|
|
4131
|
+
const isActive = await checkActive();
|
|
4132
|
+
if (!mountedRef.current) {
|
|
4133
|
+
return;
|
|
4134
|
+
}
|
|
4135
|
+
if (!isActive) {
|
|
4136
|
+
void acquire();
|
|
4137
|
+
}
|
|
4138
|
+
} catch (e) {
|
|
4139
|
+
}
|
|
4140
|
+
}, [checkActive, acquire]);
|
|
4141
|
+
(0, import_react44.useEffect)(() => {
|
|
4142
|
+
if (!revalidateOnFocus) {
|
|
4143
|
+
return;
|
|
4144
|
+
}
|
|
4145
|
+
if (typeof document === "undefined") {
|
|
4146
|
+
return;
|
|
4147
|
+
}
|
|
4148
|
+
let hiddenAt = document.visibilityState === "hidden" ? Date.now() : null;
|
|
4149
|
+
const handleVisibilityChange = () => {
|
|
4150
|
+
if (document.visibilityState === "hidden") {
|
|
4151
|
+
hiddenAt = Date.now();
|
|
4152
|
+
return;
|
|
4153
|
+
}
|
|
4154
|
+
if (document.visibilityState === "visible") {
|
|
4155
|
+
const elapsed = hiddenAt === null ? 0 : Date.now() - hiddenAt;
|
|
4156
|
+
hiddenAt = null;
|
|
4157
|
+
if (elapsed >= revalidateAfterMs) {
|
|
4158
|
+
void revalidate();
|
|
4159
|
+
}
|
|
4160
|
+
}
|
|
4161
|
+
};
|
|
4162
|
+
document.addEventListener("visibilitychange", handleVisibilityChange);
|
|
4163
|
+
return () => {
|
|
4164
|
+
document.removeEventListener("visibilitychange", handleVisibilityChange);
|
|
4165
|
+
};
|
|
4166
|
+
}, [revalidateOnFocus, revalidateAfterMs, revalidate]);
|
|
4167
|
+
const reacquire = (0, import_react44.useCallback)(() => {
|
|
4168
|
+
void acquire();
|
|
4169
|
+
}, [acquire]);
|
|
4170
|
+
const value = (0, import_react44.useMemo)(() => ({ status, error, reacquire }), [status, error, reacquire]);
|
|
4171
|
+
return /* @__PURE__ */ (0, import_jsx_runtime46.jsx)(DelegationContext.Provider, { value, children });
|
|
4172
|
+
}
|
|
4173
|
+
|
|
4174
|
+
// src/components/MeshApp.tsx
|
|
4175
|
+
var import_design_system20 = require("@uniformdev/design-system");
|
|
3990
4176
|
|
|
3991
4177
|
// src/hooks/useInitializeUniformMeshSdk.ts
|
|
3992
4178
|
var import_mesh_sdk = require("@uniformdev/mesh-sdk");
|
|
3993
|
-
var
|
|
4179
|
+
var import_react45 = require("react");
|
|
3994
4180
|
var useInitializeUniformMeshSdk = ({ autoResizingDisabled } = {}) => {
|
|
3995
|
-
const [error, setError] = (0,
|
|
3996
|
-
const [sdk, setSdk] = (0,
|
|
3997
|
-
const initializationInProgress = (0,
|
|
3998
|
-
(0,
|
|
4181
|
+
const [error, setError] = (0, import_react45.useState)();
|
|
4182
|
+
const [sdk, setSdk] = (0, import_react45.useState)();
|
|
4183
|
+
const initializationInProgress = (0, import_react45.useRef)(false);
|
|
4184
|
+
(0, import_react45.useEffect)(
|
|
3999
4185
|
() => {
|
|
4000
4186
|
if (typeof window === "undefined" || sdk) {
|
|
4001
4187
|
return;
|
|
@@ -4013,7 +4199,7 @@ var useInitializeUniformMeshSdk = ({ autoResizingDisabled } = {}) => {
|
|
|
4013
4199
|
setSdk(window.UniformMeshSDK);
|
|
4014
4200
|
}
|
|
4015
4201
|
},
|
|
4016
|
-
//
|
|
4202
|
+
// oxlint-disable-next-line react/exhaustive-deps
|
|
4017
4203
|
[autoResizingDisabled]
|
|
4018
4204
|
);
|
|
4019
4205
|
return {
|
|
@@ -4028,7 +4214,7 @@ var useInitializeUniformMeshSdk = ({ autoResizingDisabled } = {}) => {
|
|
|
4028
4214
|
};
|
|
4029
4215
|
|
|
4030
4216
|
// src/components/MeshApp.tsx
|
|
4031
|
-
var
|
|
4217
|
+
var import_jsx_runtime47 = require("@emotion/react/jsx-runtime");
|
|
4032
4218
|
var MeshApp = ({
|
|
4033
4219
|
children,
|
|
4034
4220
|
loadingComponent,
|
|
@@ -4037,36 +4223,36 @@ var MeshApp = ({
|
|
|
4037
4223
|
const { initializing, error, sdk } = useInitializeUniformMeshSdk();
|
|
4038
4224
|
if (initializing || !sdk) {
|
|
4039
4225
|
const LoadingComponent = loadingComponent;
|
|
4040
|
-
return LoadingComponent ? /* @__PURE__ */ (0,
|
|
4226
|
+
return LoadingComponent ? /* @__PURE__ */ (0, import_jsx_runtime47.jsx)(LoadingComponent, {}) : /* @__PURE__ */ (0, import_jsx_runtime47.jsx)(import_design_system20.LoadingIndicator, {});
|
|
4041
4227
|
}
|
|
4042
4228
|
if (error) {
|
|
4043
4229
|
const ErrorComponent = errorComponent;
|
|
4044
4230
|
if (ErrorComponent) {
|
|
4045
|
-
return /* @__PURE__ */ (0,
|
|
4231
|
+
return /* @__PURE__ */ (0, import_jsx_runtime47.jsx)(ErrorComponent, { error });
|
|
4046
4232
|
}
|
|
4047
4233
|
throw error;
|
|
4048
4234
|
}
|
|
4049
|
-
return /* @__PURE__ */ (0,
|
|
4050
|
-
/* @__PURE__ */ (0,
|
|
4051
|
-
/* @__PURE__ */ (0,
|
|
4235
|
+
return /* @__PURE__ */ (0, import_jsx_runtime47.jsxs)(UniformMeshSdkContext.Provider, { value: { sdk }, children: [
|
|
4236
|
+
/* @__PURE__ */ (0, import_jsx_runtime47.jsx)(import_design_system20.Theme, {}),
|
|
4237
|
+
/* @__PURE__ */ (0, import_jsx_runtime47.jsx)(import_design_system20.IconsProvider, { children: /* @__PURE__ */ (0, import_jsx_runtime47.jsx)(UniformMeshLocationContextProvider, { children }) })
|
|
4052
4238
|
] });
|
|
4053
4239
|
};
|
|
4054
4240
|
|
|
4055
4241
|
// src/components/ObjectSearch/DataRefreshButton.tsx
|
|
4056
|
-
var
|
|
4057
|
-
var
|
|
4058
|
-
var
|
|
4242
|
+
var import_react46 = require("@emotion/react");
|
|
4243
|
+
var import_design_system21 = require("@uniformdev/design-system");
|
|
4244
|
+
var import_jsx_runtime48 = require("@emotion/react/jsx-runtime");
|
|
4059
4245
|
var DataRefreshButton = ({
|
|
4060
4246
|
buttonText,
|
|
4061
4247
|
isLoading,
|
|
4062
4248
|
onRefreshData,
|
|
4063
4249
|
...props
|
|
4064
4250
|
}) => {
|
|
4065
|
-
return /* @__PURE__ */ (0,
|
|
4066
|
-
!isLoading ? null : /* @__PURE__ */ (0,
|
|
4067
|
-
|
|
4251
|
+
return /* @__PURE__ */ (0, import_jsx_runtime48.jsxs)(import_design_system21.Button, { buttonType: "ghost", onClick: onRefreshData, disabled: isLoading, ...props, children: [
|
|
4252
|
+
!isLoading ? null : /* @__PURE__ */ (0, import_jsx_runtime48.jsx)(
|
|
4253
|
+
import_design_system21.LoadingIndicator,
|
|
4068
4254
|
{
|
|
4069
|
-
css:
|
|
4255
|
+
css: import_react46.css`
|
|
4070
4256
|
${isLoading ? "opacity: 0.2;" : void 0}
|
|
4071
4257
|
`
|
|
4072
4258
|
}
|
|
@@ -4076,15 +4262,15 @@ var DataRefreshButton = ({
|
|
|
4076
4262
|
};
|
|
4077
4263
|
|
|
4078
4264
|
// src/components/ObjectSearch/ObjectSearchContainer.tsx
|
|
4079
|
-
var
|
|
4265
|
+
var import_react49 = require("@emotion/react");
|
|
4080
4266
|
var import_canvas9 = require("@uniformdev/canvas");
|
|
4081
|
-
var
|
|
4267
|
+
var import_design_system24 = require("@uniformdev/design-system");
|
|
4082
4268
|
|
|
4083
4269
|
// src/components/ObjectSearch/hooks/ObjectSearchContext.tsx
|
|
4084
4270
|
var import_canvas8 = require("@uniformdev/canvas");
|
|
4085
|
-
var
|
|
4086
|
-
var
|
|
4087
|
-
var ObjectSearchContext = (0,
|
|
4271
|
+
var import_react47 = require("react");
|
|
4272
|
+
var import_jsx_runtime49 = require("@emotion/react/jsx-runtime");
|
|
4273
|
+
var ObjectSearchContext = (0, import_react47.createContext)({
|
|
4088
4274
|
onSetQuery: () => {
|
|
4089
4275
|
},
|
|
4090
4276
|
onSelectItem: () => {
|
|
@@ -4105,16 +4291,16 @@ var ObjectSearchProvider = ({
|
|
|
4105
4291
|
children,
|
|
4106
4292
|
defaultQuery
|
|
4107
4293
|
}) => {
|
|
4108
|
-
const [query, setQuery] = (0,
|
|
4294
|
+
const [query, setQuery] = (0, import_react47.useState)({
|
|
4109
4295
|
contentType: "",
|
|
4110
4296
|
keyword: "",
|
|
4111
4297
|
...defaultQuery
|
|
4112
4298
|
});
|
|
4113
4299
|
const { flatVariables } = useVariables(true);
|
|
4114
|
-
const querySearchDeferred = (0,
|
|
4115
|
-
const [selectedItems, setSelectedItems] = (0,
|
|
4116
|
-
const [list, setList] = (0,
|
|
4117
|
-
const onSetQuery = (0,
|
|
4300
|
+
const querySearchDeferred = (0, import_react47.useDeferredValue)(query);
|
|
4301
|
+
const [selectedItems, setSelectedItems] = (0, import_react47.useState)(currentlySelectedItems != null ? currentlySelectedItems : []);
|
|
4302
|
+
const [list, setList] = (0, import_react47.useState)({});
|
|
4303
|
+
const onSetQuery = (0, import_react47.useCallback)(
|
|
4118
4304
|
(value2) => {
|
|
4119
4305
|
if (Array.isArray(value2.contentType) && value2.contentType.length > 0) {
|
|
4120
4306
|
return setQuery({
|
|
@@ -4126,7 +4312,7 @@ var ObjectSearchProvider = ({
|
|
|
4126
4312
|
},
|
|
4127
4313
|
[setQuery]
|
|
4128
4314
|
);
|
|
4129
|
-
const onSelectItem = (0,
|
|
4315
|
+
const onSelectItem = (0, import_react47.useCallback)(
|
|
4130
4316
|
(selectedResult) => {
|
|
4131
4317
|
if (Array.isArray(selectedResult)) {
|
|
4132
4318
|
setSelectedItems(selectedResult);
|
|
@@ -4140,17 +4326,17 @@ var ObjectSearchProvider = ({
|
|
|
4140
4326
|
},
|
|
4141
4327
|
[setSelectedItems, selectedItems]
|
|
4142
4328
|
);
|
|
4143
|
-
const onRemoveAllSelectedItems = (0,
|
|
4329
|
+
const onRemoveAllSelectedItems = (0, import_react47.useCallback)(() => {
|
|
4144
4330
|
setSelectedItems([]);
|
|
4145
4331
|
}, [setSelectedItems]);
|
|
4146
|
-
const onSetList = (0,
|
|
4332
|
+
const onSetList = (0, import_react47.useCallback)(
|
|
4147
4333
|
(value2) => {
|
|
4148
4334
|
setList(value2);
|
|
4149
4335
|
},
|
|
4150
4336
|
[setList]
|
|
4151
4337
|
);
|
|
4152
|
-
const boundQuery = (0,
|
|
4153
|
-
const value = (0,
|
|
4338
|
+
const boundQuery = (0, import_react47.useMemo)(() => bindQuery(query, flatVariables), [query, flatVariables]);
|
|
4339
|
+
const value = (0, import_react47.useMemo)(
|
|
4154
4340
|
() => ({
|
|
4155
4341
|
boundQuery,
|
|
4156
4342
|
onSetQuery,
|
|
@@ -4174,10 +4360,10 @@ var ObjectSearchProvider = ({
|
|
|
4174
4360
|
onSetList
|
|
4175
4361
|
]
|
|
4176
4362
|
);
|
|
4177
|
-
return /* @__PURE__ */ (0,
|
|
4363
|
+
return /* @__PURE__ */ (0, import_jsx_runtime49.jsx)(ObjectSearchContext.Provider, { value, children });
|
|
4178
4364
|
};
|
|
4179
4365
|
function useObjectSearchContext() {
|
|
4180
|
-
return (0,
|
|
4366
|
+
return (0, import_react47.useContext)(ObjectSearchContext);
|
|
4181
4367
|
}
|
|
4182
4368
|
function bindQuery(query, inputs) {
|
|
4183
4369
|
const { result, errors } = (0, import_canvas8.bindVariablesToObject)({
|
|
@@ -4192,12 +4378,12 @@ function bindQuery(query, inputs) {
|
|
|
4192
4378
|
}
|
|
4193
4379
|
|
|
4194
4380
|
// src/components/ObjectSearch/ObjectSearchListItem.tsx
|
|
4195
|
-
var
|
|
4381
|
+
var import_design_system23 = require("@uniformdev/design-system");
|
|
4196
4382
|
|
|
4197
4383
|
// src/components/ObjectSearch/styles/ObjectSearchListItem.styles.ts
|
|
4198
|
-
var
|
|
4199
|
-
var
|
|
4200
|
-
var ObjectListItemContainer =
|
|
4384
|
+
var import_react48 = require("@emotion/react");
|
|
4385
|
+
var import_design_system22 = require("@uniformdev/design-system");
|
|
4386
|
+
var ObjectListItemContainer = import_react48.css`
|
|
4201
4387
|
align-items: center;
|
|
4202
4388
|
border: 1px solid var(--gray-300);
|
|
4203
4389
|
border-radius: var(--rounded-base);
|
|
@@ -4206,12 +4392,12 @@ var ObjectListItemContainer = import_react44.css`
|
|
|
4206
4392
|
grid-template-columns: 1fr auto;
|
|
4207
4393
|
padding: var(--spacing-sm);
|
|
4208
4394
|
`;
|
|
4209
|
-
var ObjectListItemContainerDisabled =
|
|
4395
|
+
var ObjectListItemContainerDisabled = import_react48.css`
|
|
4210
4396
|
opacity: var(--opacity-50);
|
|
4211
4397
|
pointer-events: none;
|
|
4212
4398
|
`;
|
|
4213
|
-
var ObjectListItemLoading =
|
|
4214
|
-
animation: ${
|
|
4399
|
+
var ObjectListItemLoading = import_react48.css`
|
|
4400
|
+
animation: ${import_design_system22.skeletonLoading} 1s linear infinite alternate;
|
|
4215
4401
|
border-color: transparent;
|
|
4216
4402
|
min-height: 42px;
|
|
4217
4403
|
position: relative;
|
|
@@ -4234,43 +4420,43 @@ var ObjectListItemLoading = import_react44.css`
|
|
|
4234
4420
|
width: 1rem;
|
|
4235
4421
|
}
|
|
4236
4422
|
`;
|
|
4237
|
-
var ObjectListItemHeadingGroup =
|
|
4423
|
+
var ObjectListItemHeadingGroup = import_react48.css`
|
|
4238
4424
|
align-items: center;
|
|
4239
4425
|
display: grid;
|
|
4240
4426
|
`;
|
|
4241
|
-
var ObjectListItemThumbnail =
|
|
4427
|
+
var ObjectListItemThumbnail = import_react48.css`
|
|
4242
4428
|
width: 30px;
|
|
4243
4429
|
height: 30px;
|
|
4244
4430
|
object-fit: cover;
|
|
4245
4431
|
`;
|
|
4246
|
-
var ObjectListItemTitle =
|
|
4432
|
+
var ObjectListItemTitle = import_react48.css`
|
|
4247
4433
|
color: var(--typography-base);
|
|
4248
4434
|
display: block;
|
|
4249
4435
|
font-size: var(--fs-sm);
|
|
4250
4436
|
`;
|
|
4251
|
-
var ObjectListItemSubtitle =
|
|
4437
|
+
var ObjectListItemSubtitle = import_react48.css`
|
|
4252
4438
|
color: var(--gray-500);
|
|
4253
4439
|
display: block;
|
|
4254
4440
|
font-size: var(--fs-xs);
|
|
4255
4441
|
line-height: 1;
|
|
4256
4442
|
`;
|
|
4257
|
-
var ObjectListItemInfoContainer =
|
|
4443
|
+
var ObjectListItemInfoContainer = import_react48.css`
|
|
4258
4444
|
align-items: center;
|
|
4259
4445
|
display: flex;
|
|
4260
4446
|
gap: var(--spacing-sm);
|
|
4261
4447
|
justify-content: center;
|
|
4262
4448
|
`;
|
|
4263
|
-
var ObjectListItemControlledContent =
|
|
4449
|
+
var ObjectListItemControlledContent = import_react48.css`
|
|
4264
4450
|
display: flex;
|
|
4265
4451
|
gap: var(--spacing-sm);
|
|
4266
4452
|
`;
|
|
4267
|
-
var ObjectListItemUnControlledContent =
|
|
4453
|
+
var ObjectListItemUnControlledContent = import_react48.css`
|
|
4268
4454
|
margin-top: var(--spacing-sm);
|
|
4269
4455
|
grid-column: 1 / -1;
|
|
4270
4456
|
`;
|
|
4271
4457
|
|
|
4272
4458
|
// src/components/ObjectSearch/ObjectSearchListItem.tsx
|
|
4273
|
-
var
|
|
4459
|
+
var import_jsx_runtime50 = require("@emotion/react/jsx-runtime");
|
|
4274
4460
|
var ObjectSearchListItem = ({
|
|
4275
4461
|
id,
|
|
4276
4462
|
title,
|
|
@@ -4295,7 +4481,7 @@ var ObjectSearchListItem = ({
|
|
|
4295
4481
|
return onSelectItem([selectedItem]);
|
|
4296
4482
|
};
|
|
4297
4483
|
const selected = selectedListItems.some((item) => item.id === id);
|
|
4298
|
-
return /* @__PURE__ */ (0,
|
|
4484
|
+
return /* @__PURE__ */ (0, import_jsx_runtime50.jsxs)(
|
|
4299
4485
|
"div",
|
|
4300
4486
|
{
|
|
4301
4487
|
role: "listitem",
|
|
@@ -4303,7 +4489,7 @@ var ObjectSearchListItem = ({
|
|
|
4303
4489
|
"data-testid": "list-item",
|
|
4304
4490
|
...props,
|
|
4305
4491
|
children: [
|
|
4306
|
-
/* @__PURE__ */ (0,
|
|
4492
|
+
/* @__PURE__ */ (0, import_jsx_runtime50.jsxs)(
|
|
4307
4493
|
"div",
|
|
4308
4494
|
{
|
|
4309
4495
|
role: "button",
|
|
@@ -4311,7 +4497,7 @@ var ObjectSearchListItem = ({
|
|
|
4311
4497
|
css: ObjectListItemControlledContent,
|
|
4312
4498
|
"aria-disabled": disabled,
|
|
4313
4499
|
children: [
|
|
4314
|
-
imageUrl ? /* @__PURE__ */ (0,
|
|
4500
|
+
imageUrl ? /* @__PURE__ */ (0, import_jsx_runtime50.jsx)(
|
|
4315
4501
|
"img",
|
|
4316
4502
|
{
|
|
4317
4503
|
src: imageUrl,
|
|
@@ -4320,28 +4506,28 @@ var ObjectSearchListItem = ({
|
|
|
4320
4506
|
loading: "lazy"
|
|
4321
4507
|
}
|
|
4322
4508
|
) : null,
|
|
4323
|
-
/* @__PURE__ */ (0,
|
|
4324
|
-
!contentType ? null : /* @__PURE__ */ (0,
|
|
4325
|
-
/* @__PURE__ */ (0,
|
|
4509
|
+
/* @__PURE__ */ (0, import_jsx_runtime50.jsxs)("div", { role: "heading", css: ObjectListItemHeadingGroup, children: [
|
|
4510
|
+
!contentType ? null : /* @__PURE__ */ (0, import_jsx_runtime50.jsx)("span", { css: ObjectListItemSubtitle, children: formatedContentType }),
|
|
4511
|
+
/* @__PURE__ */ (0, import_jsx_runtime50.jsx)("span", { css: ObjectListItemTitle, "data-testid": "title", children: title })
|
|
4326
4512
|
] })
|
|
4327
4513
|
]
|
|
4328
4514
|
}
|
|
4329
4515
|
),
|
|
4330
|
-
/* @__PURE__ */ (0,
|
|
4331
|
-
selected ? /* @__PURE__ */ (0,
|
|
4332
|
-
!popoverData ? null : /* @__PURE__ */ (0,
|
|
4516
|
+
/* @__PURE__ */ (0, import_jsx_runtime50.jsxs)("div", { css: ObjectListItemInfoContainer, children: [
|
|
4517
|
+
selected ? /* @__PURE__ */ (0, import_jsx_runtime50.jsx)(import_design_system23.Chip, { text: "selected", size: "xs" }) : null,
|
|
4518
|
+
!popoverData ? null : /* @__PURE__ */ (0, import_jsx_runtime50.jsx)(import_design_system23.Popover, { ariaLabel: title, buttonText: `See ${title} details`, children: popoverData })
|
|
4333
4519
|
] }),
|
|
4334
|
-
!children ? null : /* @__PURE__ */ (0,
|
|
4520
|
+
!children ? null : /* @__PURE__ */ (0, import_jsx_runtime50.jsx)("div", { css: ObjectListItemUnControlledContent, children })
|
|
4335
4521
|
]
|
|
4336
4522
|
}
|
|
4337
4523
|
);
|
|
4338
4524
|
};
|
|
4339
4525
|
var ObjectSearchListItemLoadingSkeleton = () => {
|
|
4340
|
-
return /* @__PURE__ */ (0,
|
|
4526
|
+
return /* @__PURE__ */ (0, import_jsx_runtime50.jsx)("div", { role: "presentation", css: [ObjectListItemContainer, ObjectListItemLoading] });
|
|
4341
4527
|
};
|
|
4342
4528
|
|
|
4343
4529
|
// src/components/ObjectSearch/ObjectSearchContainer.tsx
|
|
4344
|
-
var
|
|
4530
|
+
var import_jsx_runtime51 = require("@emotion/react/jsx-runtime");
|
|
4345
4531
|
var ObjectSearchContainer = ({
|
|
4346
4532
|
label,
|
|
4347
4533
|
enableDynamicInputToResultId,
|
|
@@ -4353,19 +4539,19 @@ var ObjectSearchContainer = ({
|
|
|
4353
4539
|
const { onSelectItem, selectedListItems, list } = useObjectSearchContext();
|
|
4354
4540
|
const { flatVariables } = useVariables(true);
|
|
4355
4541
|
const inputValue = (_b = (_a = selectedListItems == null ? void 0 : selectedListItems[0]) == null ? void 0 : _a.id) != null ? _b : "";
|
|
4356
|
-
const listItems = resultList != null ? resultList : /* @__PURE__ */ (0,
|
|
4357
|
-
|
|
4542
|
+
const listItems = resultList != null ? resultList : /* @__PURE__ */ (0, import_jsx_runtime51.jsx)(
|
|
4543
|
+
import_design_system24.ScrollableList,
|
|
4358
4544
|
{
|
|
4359
4545
|
role: "list",
|
|
4360
|
-
css:
|
|
4546
|
+
css: import_react49.css`
|
|
4361
4547
|
> div {
|
|
4362
4548
|
max-height: ${selectedListItems.length === 0 ? "50vh" : "184px"};
|
|
4363
4549
|
}
|
|
4364
4550
|
`,
|
|
4365
|
-
children: /* @__PURE__ */ (0,
|
|
4551
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime51.jsx)(DefaultResultList, {})
|
|
4366
4552
|
}
|
|
4367
4553
|
);
|
|
4368
|
-
const body = /* @__PURE__ */ (0,
|
|
4554
|
+
const body = /* @__PURE__ */ (0, import_jsx_runtime51.jsxs)(import_design_system24.VerticalRhythm, { children: [
|
|
4369
4555
|
searchFilters,
|
|
4370
4556
|
listItems
|
|
4371
4557
|
] });
|
|
@@ -4396,8 +4582,8 @@ var ObjectSearchContainer = ({
|
|
|
4396
4582
|
}
|
|
4397
4583
|
]);
|
|
4398
4584
|
};
|
|
4399
|
-
return /* @__PURE__ */ (0,
|
|
4400
|
-
/* @__PURE__ */ (0,
|
|
4585
|
+
return /* @__PURE__ */ (0, import_jsx_runtime51.jsxs)(import_design_system24.VerticalRhythm, { children: [
|
|
4586
|
+
/* @__PURE__ */ (0, import_jsx_runtime51.jsx)(import_design_system24.Container, { backgroundColor: "gray-50", padding: "var(--spacing-base)", border: true, children: label ? /* @__PURE__ */ (0, import_jsx_runtime51.jsx)(
|
|
4401
4587
|
InputVariables,
|
|
4402
4588
|
{
|
|
4403
4589
|
label,
|
|
@@ -4419,21 +4605,21 @@ var DefaultResultList = () => {
|
|
|
4419
4605
|
var _a;
|
|
4420
4606
|
const { list } = useObjectSearchContext();
|
|
4421
4607
|
if (!list.items) {
|
|
4422
|
-
return Array.from(Array(5).keys()).map((i) => /* @__PURE__ */ (0,
|
|
4608
|
+
return Array.from(Array(5).keys()).map((i) => /* @__PURE__ */ (0, import_jsx_runtime51.jsx)(ObjectSearchListItemLoadingSkeleton, {}, i));
|
|
4423
4609
|
}
|
|
4424
4610
|
if (list.items.length === 0) {
|
|
4425
|
-
return /* @__PURE__ */ (0,
|
|
4611
|
+
return /* @__PURE__ */ (0, import_jsx_runtime51.jsx)(import_design_system24.Callout, { type: "info", children: "No results were found" });
|
|
4426
4612
|
}
|
|
4427
|
-
return (_a = list.items) == null ? void 0 : _a.map((item) => /* @__PURE__ */ (0,
|
|
4613
|
+
return (_a = list.items) == null ? void 0 : _a.map((item) => /* @__PURE__ */ (0, import_jsx_runtime51.jsx)(ObjectSearchListItem, { ...item }, item.id));
|
|
4428
4614
|
};
|
|
4429
4615
|
|
|
4430
4616
|
// src/components/ObjectSearch/ObjectSearchFilter.tsx
|
|
4431
|
-
var
|
|
4432
|
-
var
|
|
4617
|
+
var import_design_system25 = require("@uniformdev/design-system");
|
|
4618
|
+
var import_react51 = require("react");
|
|
4433
4619
|
|
|
4434
4620
|
// src/components/ObjectSearch/styles/ObjectSearchFilterContainer.styles.ts
|
|
4435
|
-
var
|
|
4436
|
-
var ObjectSearchFilterContainerLabel =
|
|
4621
|
+
var import_react50 = require("@emotion/react");
|
|
4622
|
+
var ObjectSearchFilterContainerLabel = import_react50.css`
|
|
4437
4623
|
align-items: center;
|
|
4438
4624
|
display: flex;
|
|
4439
4625
|
font-size: var(--fs-sm);
|
|
@@ -4441,18 +4627,18 @@ var ObjectSearchFilterContainerLabel = import_react46.css`
|
|
|
4441
4627
|
line-height: 1rem;
|
|
4442
4628
|
margin-bottom: var(--spacing-sm);
|
|
4443
4629
|
`;
|
|
4444
|
-
var ObjectSearchFilterContainer =
|
|
4630
|
+
var ObjectSearchFilterContainer = import_react50.css`
|
|
4445
4631
|
display: grid;
|
|
4446
4632
|
gap: var(--spacing-base);
|
|
4447
4633
|
`;
|
|
4448
|
-
var ObjectSearchFilterGrid = (gridColumns) =>
|
|
4634
|
+
var ObjectSearchFilterGrid = (gridColumns) => import_react50.css`
|
|
4449
4635
|
display: grid;
|
|
4450
4636
|
grid-template-columns: ${gridColumns};
|
|
4451
4637
|
gap: var(--spacing-base);
|
|
4452
4638
|
`;
|
|
4453
4639
|
|
|
4454
4640
|
// src/components/ObjectSearch/ObjectSearchFilter.tsx
|
|
4455
|
-
var
|
|
4641
|
+
var import_jsx_runtime52 = require("@emotion/react/jsx-runtime");
|
|
4456
4642
|
var ObjectSearchFilter = ({
|
|
4457
4643
|
requireContentType,
|
|
4458
4644
|
typeSelectorAllTypesOptionText = "All content types",
|
|
@@ -4463,7 +4649,7 @@ var ObjectSearchFilter = ({
|
|
|
4463
4649
|
}) => {
|
|
4464
4650
|
var _a, _b;
|
|
4465
4651
|
const { query, onSetQuery } = useObjectSearchContext();
|
|
4466
|
-
const [searchState, setSearchState] = (0,
|
|
4652
|
+
const [searchState, setSearchState] = (0, import_react51.useState)({
|
|
4467
4653
|
contentType: (_a = query.contentType) != null ? _a : "",
|
|
4468
4654
|
keyword: (_b = query.keyword) != null ? _b : ""
|
|
4469
4655
|
});
|
|
@@ -4473,7 +4659,7 @@ var ObjectSearchFilter = ({
|
|
|
4473
4659
|
});
|
|
4474
4660
|
onSetQuery({ ...query, ...value });
|
|
4475
4661
|
};
|
|
4476
|
-
const memoizedSelectOptions = (0,
|
|
4662
|
+
const memoizedSelectOptions = (0, import_react51.useMemo)(() => {
|
|
4477
4663
|
if (!requireContentType && !(selectOptions == null ? void 0 : selectOptions.length)) {
|
|
4478
4664
|
return [];
|
|
4479
4665
|
}
|
|
@@ -4483,7 +4669,7 @@ var ObjectSearchFilter = ({
|
|
|
4483
4669
|
];
|
|
4484
4670
|
}, [requireContentType, typeSelectorAllTypesOptionText, selectOptions]);
|
|
4485
4671
|
const shouldRenderSelect = memoizedSelectOptions.length > 0;
|
|
4486
|
-
return /* @__PURE__ */ (0,
|
|
4672
|
+
return /* @__PURE__ */ (0, import_jsx_runtime52.jsxs)(
|
|
4487
4673
|
"fieldset",
|
|
4488
4674
|
{
|
|
4489
4675
|
css: [
|
|
@@ -4491,8 +4677,8 @@ var ObjectSearchFilter = ({
|
|
|
4491
4677
|
ObjectSearchFilterGrid(shouldRenderSelect ? "1fr 2fr" : "1fr")
|
|
4492
4678
|
],
|
|
4493
4679
|
children: [
|
|
4494
|
-
memoizedSelectOptions.length ? /* @__PURE__ */ (0,
|
|
4495
|
-
|
|
4680
|
+
memoizedSelectOptions.length ? /* @__PURE__ */ (0, import_jsx_runtime52.jsx)(
|
|
4681
|
+
import_design_system25.InputSelect,
|
|
4496
4682
|
{
|
|
4497
4683
|
label: selectLabel,
|
|
4498
4684
|
showLabel: false,
|
|
@@ -4501,8 +4687,8 @@ var ObjectSearchFilter = ({
|
|
|
4501
4687
|
value: query.contentType
|
|
4502
4688
|
}
|
|
4503
4689
|
) : null,
|
|
4504
|
-
/* @__PURE__ */ (0,
|
|
4505
|
-
|
|
4690
|
+
/* @__PURE__ */ (0, import_jsx_runtime52.jsx)(
|
|
4691
|
+
import_design_system25.DebouncedInputKeywordSearch,
|
|
4506
4692
|
{
|
|
4507
4693
|
inputFieldName: searchInputName,
|
|
4508
4694
|
placeholder: searchInputPlaceholderText,
|
|
@@ -4518,27 +4704,27 @@ var ObjectSearchFilter = ({
|
|
|
4518
4704
|
};
|
|
4519
4705
|
|
|
4520
4706
|
// src/components/ObjectSearch/ObjectSearchFilterContainer.tsx
|
|
4521
|
-
var
|
|
4707
|
+
var import_jsx_runtime53 = require("@emotion/react/jsx-runtime");
|
|
4522
4708
|
var ObjectSearchFilterContainer2 = ({ children }) => {
|
|
4523
|
-
return /* @__PURE__ */ (0,
|
|
4709
|
+
return /* @__PURE__ */ (0, import_jsx_runtime53.jsx)("div", { children: /* @__PURE__ */ (0, import_jsx_runtime53.jsx)("div", { css: ObjectSearchFilterContainer, children }) });
|
|
4524
4710
|
};
|
|
4525
4711
|
|
|
4526
4712
|
// src/components/ObjectSearch/ObjectSearchResultItem.tsx
|
|
4527
|
-
var
|
|
4713
|
+
var import_design_system27 = require("@uniformdev/design-system");
|
|
4528
4714
|
var import_timeago = require("timeago.js");
|
|
4529
4715
|
|
|
4530
4716
|
// src/components/Image/Image.tsx
|
|
4531
|
-
var
|
|
4717
|
+
var import_jsx_runtime54 = require("@emotion/react/jsx-runtime");
|
|
4532
4718
|
function Image({ src, alt, className }) {
|
|
4533
4719
|
const CompImage = src && typeof src !== "string" ? src : null;
|
|
4534
|
-
return CompImage ? /* @__PURE__ */ (0,
|
|
4720
|
+
return CompImage ? /* @__PURE__ */ (0, import_jsx_runtime54.jsx)(CompImage, { className }) : /* @__PURE__ */ (0, import_jsx_runtime54.jsx)("img", { src, alt, className });
|
|
4535
4721
|
}
|
|
4536
4722
|
|
|
4537
4723
|
// src/components/ObjectSearch/styles/ObjectSearchResultItemButton.styles.ts
|
|
4538
|
-
var
|
|
4539
|
-
var
|
|
4540
|
-
var ButtonStyles =
|
|
4541
|
-
${
|
|
4724
|
+
var import_react52 = require("@emotion/react");
|
|
4725
|
+
var import_design_system26 = require("@uniformdev/design-system");
|
|
4726
|
+
var ButtonStyles = import_react52.css`
|
|
4727
|
+
${import_design_system26.button}
|
|
4542
4728
|
background: transparent;
|
|
4543
4729
|
border: 1px solid var(--typography-base);
|
|
4544
4730
|
color: var(--typography-base);
|
|
@@ -4565,20 +4751,20 @@ var ButtonStyles = import_react48.css`
|
|
|
4565
4751
|
text-decoration: none;
|
|
4566
4752
|
}
|
|
4567
4753
|
`;
|
|
4568
|
-
var ButtonIcon =
|
|
4754
|
+
var ButtonIcon = import_react52.css`
|
|
4569
4755
|
width: 1rem;
|
|
4570
4756
|
height: 1rem;
|
|
4571
4757
|
`;
|
|
4572
4758
|
|
|
4573
4759
|
// src/components/ObjectSearch/ObjectSearchResultItemButton.tsx
|
|
4574
|
-
var
|
|
4760
|
+
var import_jsx_runtime55 = require("@emotion/react/jsx-runtime");
|
|
4575
4761
|
var ObjectSearchResultItemButton = ({
|
|
4576
4762
|
text,
|
|
4577
4763
|
icon,
|
|
4578
4764
|
...props
|
|
4579
4765
|
}) => {
|
|
4580
|
-
return /* @__PURE__ */ (0,
|
|
4581
|
-
!icon ? null : /* @__PURE__ */ (0,
|
|
4766
|
+
return /* @__PURE__ */ (0, import_jsx_runtime55.jsxs)("button", { type: "button", css: ButtonStyles, ...props, children: [
|
|
4767
|
+
!icon ? null : /* @__PURE__ */ (0, import_jsx_runtime55.jsx)(Image, { src: icon, css: ButtonIcon }),
|
|
4582
4768
|
text
|
|
4583
4769
|
] });
|
|
4584
4770
|
};
|
|
@@ -4587,15 +4773,15 @@ var LinkButton = ({
|
|
|
4587
4773
|
icon,
|
|
4588
4774
|
...props
|
|
4589
4775
|
}) => {
|
|
4590
|
-
return /* @__PURE__ */ (0,
|
|
4591
|
-
!icon ? null : /* @__PURE__ */ (0,
|
|
4776
|
+
return /* @__PURE__ */ (0, import_jsx_runtime55.jsxs)("a", { ...props, css: ButtonStyles, target: "_blank", rel: "noopener noreferrer", children: [
|
|
4777
|
+
!icon ? null : /* @__PURE__ */ (0, import_jsx_runtime55.jsx)(Image, { src: icon, css: ButtonIcon }),
|
|
4592
4778
|
text
|
|
4593
4779
|
] });
|
|
4594
4780
|
};
|
|
4595
4781
|
|
|
4596
4782
|
// src/components/ObjectSearch/styles/ObjectSearchResultItem.styles.ts
|
|
4597
|
-
var
|
|
4598
|
-
var ObjectSearchResultItemContainer =
|
|
4783
|
+
var import_react53 = require("@emotion/react");
|
|
4784
|
+
var ObjectSearchResultItemContainer = import_react53.css`
|
|
4599
4785
|
align-items: center;
|
|
4600
4786
|
border: 1px solid var(--gray-300);
|
|
4601
4787
|
border-radius: var(--rounded-base);
|
|
@@ -4611,7 +4797,7 @@ var ObjectSearchResultItemContainer = import_react49.css`
|
|
|
4611
4797
|
}
|
|
4612
4798
|
}
|
|
4613
4799
|
`;
|
|
4614
|
-
var ObjectSearchDragHandle =
|
|
4800
|
+
var ObjectSearchDragHandle = import_react53.css`
|
|
4615
4801
|
border-left: 2px dotted var(--gray-300);
|
|
4616
4802
|
border-right: 2px dotted var(--gray-300);
|
|
4617
4803
|
position: absolute;
|
|
@@ -4620,47 +4806,47 @@ var ObjectSearchDragHandle = import_react49.css`
|
|
|
4620
4806
|
transition: opacity var(--duration-fast) var(--timing-ease-out);
|
|
4621
4807
|
opacity: 0;
|
|
4622
4808
|
`;
|
|
4623
|
-
var ObjectSearchResultItemSubtitle =
|
|
4809
|
+
var ObjectSearchResultItemSubtitle = import_react53.css`
|
|
4624
4810
|
color: var(--gray-500);
|
|
4625
4811
|
display: block;
|
|
4626
4812
|
font-size: var(--fs-xs);
|
|
4627
4813
|
line-height: 1;
|
|
4628
4814
|
`;
|
|
4629
|
-
var ObjectSearchResultItemTitle =
|
|
4815
|
+
var ObjectSearchResultItemTitle = import_react53.css`
|
|
4630
4816
|
align-items: center;
|
|
4631
4817
|
color: var(--typography-base);
|
|
4632
4818
|
display: flex;
|
|
4633
4819
|
gap: var(--spacing-xs);
|
|
4634
4820
|
`;
|
|
4635
|
-
var ObjectSearchResultItemTimeStamp =
|
|
4821
|
+
var ObjectSearchResultItemTimeStamp = import_react53.css`
|
|
4636
4822
|
color: var(--gray-500);
|
|
4637
4823
|
font-size: var(--fs-xs);
|
|
4638
4824
|
`;
|
|
4639
|
-
var ObjectSearchResultItemTitleLink =
|
|
4825
|
+
var ObjectSearchResultItemTitleLink = import_react53.css`
|
|
4640
4826
|
text-decoration: none;
|
|
4641
4827
|
color: var(--primary-action-default);
|
|
4642
4828
|
font-size: var(--fs-sm);
|
|
4643
4829
|
`;
|
|
4644
|
-
var ObjectSearchAuthorStateGroup =
|
|
4830
|
+
var ObjectSearchAuthorStateGroup = import_react53.css`
|
|
4645
4831
|
align-items: center;
|
|
4646
4832
|
display: flex;
|
|
4647
4833
|
gap: var(--spacing-sm);
|
|
4648
4834
|
`;
|
|
4649
|
-
var ObjectSearchUpdateGroup =
|
|
4835
|
+
var ObjectSearchUpdateGroup = import_react53.css`
|
|
4650
4836
|
display: grid;
|
|
4651
4837
|
`;
|
|
4652
|
-
var ObjectSearchContentContainer =
|
|
4838
|
+
var ObjectSearchContentContainer = import_react53.css`
|
|
4653
4839
|
display: flex;
|
|
4654
4840
|
gap: var(--spacing-base);
|
|
4655
4841
|
`;
|
|
4656
|
-
var ObjectSearchImage =
|
|
4842
|
+
var ObjectSearchImage = import_react53.css`
|
|
4657
4843
|
width: 56px;
|
|
4658
4844
|
height: 56px;
|
|
4659
4845
|
object-fit: cover;
|
|
4660
4846
|
`;
|
|
4661
4847
|
|
|
4662
4848
|
// src/components/ObjectSearch/ObjectSearchResultItem.tsx
|
|
4663
|
-
var
|
|
4849
|
+
var import_jsx_runtime56 = require("@emotion/react/jsx-runtime");
|
|
4664
4850
|
var ObjectSearchResultItem = ({
|
|
4665
4851
|
id,
|
|
4666
4852
|
title,
|
|
@@ -4684,10 +4870,10 @@ var ObjectSearchResultItem = ({
|
|
|
4684
4870
|
onSelectItem({ id, title: id });
|
|
4685
4871
|
onRemove == null ? void 0 : onRemove();
|
|
4686
4872
|
};
|
|
4687
|
-
return /* @__PURE__ */ (0,
|
|
4688
|
-
disableDnD ? null : /* @__PURE__ */ (0,
|
|
4689
|
-
/* @__PURE__ */ (0,
|
|
4690
|
-
!imageUrl ? null : /* @__PURE__ */ (0,
|
|
4873
|
+
return /* @__PURE__ */ (0, import_jsx_runtime56.jsxs)("div", { css: ObjectSearchResultItemContainer, "data-testid": "search-result-item", children: [
|
|
4874
|
+
disableDnD ? null : /* @__PURE__ */ (0, import_jsx_runtime56.jsx)("div", { role: "presentation", className: "drag-handle", css: ObjectSearchDragHandle }),
|
|
4875
|
+
/* @__PURE__ */ (0, import_jsx_runtime56.jsx)("div", { children: /* @__PURE__ */ (0, import_jsx_runtime56.jsxs)("div", { css: ObjectSearchContentContainer, children: [
|
|
4876
|
+
!imageUrl ? null : /* @__PURE__ */ (0, import_jsx_runtime56.jsx)(
|
|
4691
4877
|
"img",
|
|
4692
4878
|
{
|
|
4693
4879
|
src: imageUrl,
|
|
@@ -4696,11 +4882,11 @@ var ObjectSearchResultItem = ({
|
|
|
4696
4882
|
loading: "lazy"
|
|
4697
4883
|
}
|
|
4698
4884
|
),
|
|
4699
|
-
/* @__PURE__ */ (0,
|
|
4700
|
-
/* @__PURE__ */ (0,
|
|
4701
|
-
/* @__PURE__ */ (0,
|
|
4702
|
-
onClick ? /* @__PURE__ */ (0,
|
|
4703
|
-
|
|
4885
|
+
/* @__PURE__ */ (0, import_jsx_runtime56.jsxs)("div", { children: [
|
|
4886
|
+
/* @__PURE__ */ (0, import_jsx_runtime56.jsx)("span", { css: ObjectSearchResultItemSubtitle, "data-testid": "sub-title", children: formatedContentType }),
|
|
4887
|
+
/* @__PURE__ */ (0, import_jsx_runtime56.jsxs)("span", { role: "heading", css: ObjectSearchResultItemTitle, "data-testid": "title", children: [
|
|
4888
|
+
onClick ? /* @__PURE__ */ (0, import_jsx_runtime56.jsx)(
|
|
4889
|
+
import_design_system27.Link,
|
|
4704
4890
|
{
|
|
4705
4891
|
onClick: (e) => {
|
|
4706
4892
|
e.preventDefault();
|
|
@@ -4711,28 +4897,28 @@ var ObjectSearchResultItem = ({
|
|
|
4711
4897
|
text: title != null ? title : name,
|
|
4712
4898
|
css: ObjectSearchResultItemTitleLink
|
|
4713
4899
|
}
|
|
4714
|
-
) : /* @__PURE__ */ (0,
|
|
4715
|
-
!popoverData ? null : /* @__PURE__ */ (0,
|
|
4900
|
+
) : /* @__PURE__ */ (0, import_jsx_runtime56.jsx)("span", { children: title != null ? title : name }),
|
|
4901
|
+
!popoverData ? null : /* @__PURE__ */ (0, import_jsx_runtime56.jsx)(import_design_system27.Popover, { ariaLabel: title, buttonText: `See ${title} details`, children: popoverData })
|
|
4716
4902
|
] }),
|
|
4717
|
-
!createdAt && !publishStatus ? null : /* @__PURE__ */ (0,
|
|
4718
|
-
!(publishStatus == null ? void 0 : publishStatus.text) ? null : /* @__PURE__ */ (0,
|
|
4719
|
-
!createdAt && !publishedAt ? null : /* @__PURE__ */ (0,
|
|
4720
|
-
!createdAt ? null : /* @__PURE__ */ (0,
|
|
4721
|
-
/* @__PURE__ */ (0,
|
|
4903
|
+
!createdAt && !publishStatus ? null : /* @__PURE__ */ (0, import_jsx_runtime56.jsxs)("div", { css: ObjectSearchAuthorStateGroup, children: [
|
|
4904
|
+
!(publishStatus == null ? void 0 : publishStatus.text) ? null : /* @__PURE__ */ (0, import_jsx_runtime56.jsx)(import_design_system27.Chip, { theme: legacyThemeMapper(publishStatus.theme), text: publishStatus.text, size: "xs" }),
|
|
4905
|
+
!createdAt && !publishedAt ? null : /* @__PURE__ */ (0, import_jsx_runtime56.jsxs)("div", { css: ObjectSearchUpdateGroup, children: [
|
|
4906
|
+
!createdAt ? null : /* @__PURE__ */ (0, import_jsx_runtime56.jsxs)("small", { css: ObjectSearchResultItemTimeStamp, children: [
|
|
4907
|
+
/* @__PURE__ */ (0, import_jsx_runtime56.jsx)("strong", { children: "Last updated: " }),
|
|
4722
4908
|
(0, import_timeago.format)(createdAt)
|
|
4723
4909
|
] }),
|
|
4724
|
-
!publishedAt ? null : /* @__PURE__ */ (0,
|
|
4725
|
-
/* @__PURE__ */ (0,
|
|
4910
|
+
!publishedAt ? null : /* @__PURE__ */ (0, import_jsx_runtime56.jsxs)("small", { css: ObjectSearchResultItemTimeStamp, children: [
|
|
4911
|
+
/* @__PURE__ */ (0, import_jsx_runtime56.jsx)("strong", { children: "Last published: " }),
|
|
4726
4912
|
(0, import_timeago.format)(publishedAt)
|
|
4727
4913
|
] })
|
|
4728
4914
|
] })
|
|
4729
4915
|
] }),
|
|
4730
|
-
/* @__PURE__ */ (0,
|
|
4916
|
+
/* @__PURE__ */ (0, import_jsx_runtime56.jsx)("div", { children })
|
|
4731
4917
|
] })
|
|
4732
4918
|
] }) }),
|
|
4733
|
-
!editLink && hideRemoveButton ? null : /* @__PURE__ */ (0,
|
|
4734
|
-
!editLink ? null : /* @__PURE__ */ (0,
|
|
4735
|
-
hideRemoveButton ? null : /* @__PURE__ */ (0,
|
|
4919
|
+
!editLink && hideRemoveButton ? null : /* @__PURE__ */ (0, import_jsx_runtime56.jsxs)("div", { css: ObjectSearchAuthorStateGroup, children: [
|
|
4920
|
+
!editLink ? null : /* @__PURE__ */ (0, import_jsx_runtime56.jsx)(LinkButton, { text: "Edit", href: editLink, icon: editLinkIcon }),
|
|
4921
|
+
hideRemoveButton ? null : /* @__PURE__ */ (0, import_jsx_runtime56.jsx)(import_design_system27.Button, { buttonType: "ghostDestructive", onClick: onRemoveItem, children: "Remove" })
|
|
4736
4922
|
] })
|
|
4737
4923
|
] });
|
|
4738
4924
|
};
|
|
@@ -4753,35 +4939,35 @@ function legacyThemeMapper(theme) {
|
|
|
4753
4939
|
|
|
4754
4940
|
// src/components/ObjectSearch/ObjectSearchResultList.tsx
|
|
4755
4941
|
var import_dnd3 = require("@hello-pangea/dnd");
|
|
4756
|
-
var
|
|
4942
|
+
var import_design_system28 = require("@uniformdev/design-system");
|
|
4757
4943
|
|
|
4758
4944
|
// src/components/ObjectSearch/styles/ObjectSearchResultList.styles.ts
|
|
4759
|
-
var
|
|
4760
|
-
var ObjectSearchResultListContainer =
|
|
4945
|
+
var import_react54 = require("@emotion/react");
|
|
4946
|
+
var ObjectSearchResultListContainer = import_react54.css`
|
|
4761
4947
|
align-items: center;
|
|
4762
4948
|
display: flex;
|
|
4763
4949
|
gap: var(--spacing-sm);
|
|
4764
4950
|
justify-content: space-between;
|
|
4765
4951
|
`;
|
|
4766
|
-
var ObjectSearchDragContainer =
|
|
4952
|
+
var ObjectSearchDragContainer = import_react54.css`
|
|
4767
4953
|
margin: 0 0 var(--spacing-sm);
|
|
4768
4954
|
`;
|
|
4769
|
-
var ObjectSearchContainerDragging =
|
|
4955
|
+
var ObjectSearchContainerDragging = import_react54.css`
|
|
4770
4956
|
box-shadow: var(--shadow-base);
|
|
4771
4957
|
opacity: var(--opacity-50);
|
|
4772
4958
|
`;
|
|
4773
|
-
var ObjectSearchResultListCounterContainer =
|
|
4959
|
+
var ObjectSearchResultListCounterContainer = import_react54.css`
|
|
4774
4960
|
align-items: center;
|
|
4775
4961
|
display: flex;
|
|
4776
4962
|
gap: var(--spacing-sm);
|
|
4777
4963
|
`;
|
|
4778
|
-
var ObjectSearchResultListTitle =
|
|
4964
|
+
var ObjectSearchResultListTitle = import_react54.css`
|
|
4779
4965
|
font-weight: var(--fw-bold);
|
|
4780
4966
|
line-height: 1;
|
|
4781
4967
|
`;
|
|
4782
4968
|
|
|
4783
4969
|
// src/components/ObjectSearch/ObjectSearchResultList.tsx
|
|
4784
|
-
var
|
|
4970
|
+
var import_jsx_runtime57 = require("@emotion/react/jsx-runtime");
|
|
4785
4971
|
var DroppableHack2 = import_dnd3.Droppable;
|
|
4786
4972
|
var DraggableHack2 = import_dnd3.Draggable;
|
|
4787
4973
|
function ObjectSearchResultList({
|
|
@@ -4791,7 +4977,7 @@ function ObjectSearchResultList({
|
|
|
4791
4977
|
hideRemoveButton = false,
|
|
4792
4978
|
resultLabelOverride,
|
|
4793
4979
|
additionalButtons,
|
|
4794
|
-
renderResultComponent = (value) => /* @__PURE__ */ (0,
|
|
4980
|
+
renderResultComponent = (value) => /* @__PURE__ */ (0, import_jsx_runtime57.jsx)(ObjectSearchResultItem, { ...value }),
|
|
4795
4981
|
multiSelectId,
|
|
4796
4982
|
disableDnD = false,
|
|
4797
4983
|
getContainerForDnDReparenting,
|
|
@@ -4818,7 +5004,7 @@ function ObjectSearchResultList({
|
|
|
4818
5004
|
...item,
|
|
4819
5005
|
disableDnD: selectedListItems.length === 1 || disableDnD
|
|
4820
5006
|
});
|
|
4821
|
-
return /* @__PURE__ */ (0,
|
|
5007
|
+
return /* @__PURE__ */ (0, import_jsx_runtime57.jsx)(
|
|
4822
5008
|
"div",
|
|
4823
5009
|
{
|
|
4824
5010
|
css: [
|
|
@@ -4833,17 +5019,17 @@ function ObjectSearchResultList({
|
|
|
4833
5019
|
}
|
|
4834
5020
|
);
|
|
4835
5021
|
};
|
|
4836
|
-
return /* @__PURE__ */ (0,
|
|
4837
|
-
/* @__PURE__ */ (0,
|
|
4838
|
-
!resultLabelOverride ? /* @__PURE__ */ (0,
|
|
4839
|
-
/* @__PURE__ */ (0,
|
|
5022
|
+
return /* @__PURE__ */ (0, import_jsx_runtime57.jsxs)(import_jsx_runtime57.Fragment, { children: [
|
|
5023
|
+
/* @__PURE__ */ (0, import_jsx_runtime57.jsxs)("div", { role: "group", css: ObjectSearchResultListContainer, children: [
|
|
5024
|
+
!resultLabelOverride ? /* @__PURE__ */ (0, import_jsx_runtime57.jsxs)("div", { role: "note", css: ObjectSearchResultListCounterContainer, children: [
|
|
5025
|
+
/* @__PURE__ */ (0, import_jsx_runtime57.jsx)("span", { css: ObjectSearchResultListTitle, children: resultLabelText }),
|
|
4840
5026
|
" ",
|
|
4841
|
-
!selectedListItems.length ? null : /* @__PURE__ */ (0,
|
|
5027
|
+
!selectedListItems.length ? null : /* @__PURE__ */ (0, import_jsx_runtime57.jsx)(import_design_system28.Counter, { count: selectedListItems.length })
|
|
4842
5028
|
] }) : resultLabelOverride,
|
|
4843
|
-
/* @__PURE__ */ (0,
|
|
5029
|
+
/* @__PURE__ */ (0, import_jsx_runtime57.jsxs)("div", { css: ObjectSearchResultListCounterContainer, children: [
|
|
4844
5030
|
additionalButtons,
|
|
4845
|
-
hideRemoveButton ? null : /* @__PURE__ */ (0,
|
|
4846
|
-
|
|
5031
|
+
hideRemoveButton ? null : /* @__PURE__ */ (0, import_jsx_runtime57.jsx)(
|
|
5032
|
+
import_design_system28.Button,
|
|
4847
5033
|
{
|
|
4848
5034
|
buttonType: "ghostDestructive",
|
|
4849
5035
|
size: "xs",
|
|
@@ -4854,15 +5040,15 @@ function ObjectSearchResultList({
|
|
|
4854
5040
|
)
|
|
4855
5041
|
] })
|
|
4856
5042
|
] }),
|
|
4857
|
-
!selectedListItems.length ? whenNothingSelected : /* @__PURE__ */ (0,
|
|
5043
|
+
!selectedListItems.length ? whenNothingSelected : /* @__PURE__ */ (0, import_jsx_runtime57.jsx)(DragDropContext, { onDragEnd: (res) => onDragEnd(res), children: /* @__PURE__ */ (0, import_jsx_runtime57.jsx)(
|
|
4858
5044
|
DroppableHack2,
|
|
4859
5045
|
{
|
|
4860
5046
|
droppableId: multiSelectId != null ? multiSelectId : "canvas-multi-select",
|
|
4861
5047
|
renderClone: getContainerForDnDReparenting ? getDraggableItem : void 0,
|
|
4862
5048
|
getContainerForClone: getContainerForDnDReparenting,
|
|
4863
|
-
children: (provided) => /* @__PURE__ */ (0,
|
|
5049
|
+
children: (provided) => /* @__PURE__ */ (0, import_jsx_runtime57.jsxs)("div", { ...provided.droppableProps, ref: provided.innerRef, children: [
|
|
4864
5050
|
selectedListItems.map((item, i) => {
|
|
4865
|
-
return /* @__PURE__ */ (0,
|
|
5051
|
+
return /* @__PURE__ */ (0, import_jsx_runtime57.jsx)(
|
|
4866
5052
|
DraggableHack2,
|
|
4867
5053
|
{
|
|
4868
5054
|
draggableId: item.id,
|
|
@@ -4881,9 +5067,9 @@ function ObjectSearchResultList({
|
|
|
4881
5067
|
}
|
|
4882
5068
|
|
|
4883
5069
|
// src/components/ObjectSearch/QueryFilter.tsx
|
|
4884
|
-
var
|
|
4885
|
-
var
|
|
4886
|
-
var
|
|
5070
|
+
var import_design_system29 = require("@uniformdev/design-system");
|
|
5071
|
+
var import_react55 = require("react");
|
|
5072
|
+
var import_jsx_runtime58 = require("@emotion/react/jsx-runtime");
|
|
4887
5073
|
var QueryFilter = ({
|
|
4888
5074
|
requireContentType,
|
|
4889
5075
|
queryFilterTitle = "Configure Query",
|
|
@@ -4911,7 +5097,7 @@ var QueryFilter = ({
|
|
|
4911
5097
|
}) => {
|
|
4912
5098
|
var _a, _b, _c, _d, _e, _f, _g;
|
|
4913
5099
|
const { query, onSetQuery } = useObjectSearchContext();
|
|
4914
|
-
const [queryState, setQueryState] = (0,
|
|
5100
|
+
const [queryState, setQueryState] = (0, import_react55.useState)({
|
|
4915
5101
|
contentType: (_a = query.contentType) != null ? _a : "",
|
|
4916
5102
|
keyword: (_b = query.keyword) != null ? _b : "",
|
|
4917
5103
|
count: (_c = query.count) != null ? _c : 5,
|
|
@@ -4922,13 +5108,13 @@ var QueryFilter = ({
|
|
|
4922
5108
|
setQueryState((prev) => ({ ...prev, ...value }));
|
|
4923
5109
|
onSetQuery({ ...query, ...value });
|
|
4924
5110
|
};
|
|
4925
|
-
(0,
|
|
5111
|
+
(0, import_react55.useEffect)(() => {
|
|
4926
5112
|
onSetQuery(queryState);
|
|
4927
5113
|
}, []);
|
|
4928
|
-
return /* @__PURE__ */ (0,
|
|
4929
|
-
/* @__PURE__ */ (0,
|
|
4930
|
-
/* @__PURE__ */ (0,
|
|
4931
|
-
/* @__PURE__ */ (0,
|
|
5114
|
+
return /* @__PURE__ */ (0, import_jsx_runtime58.jsxs)("fieldset", { children: [
|
|
5115
|
+
/* @__PURE__ */ (0, import_jsx_runtime58.jsx)("span", { css: ObjectSearchFilterContainerLabel, children: queryFilterTitle }),
|
|
5116
|
+
/* @__PURE__ */ (0, import_jsx_runtime58.jsx)("div", { css: ObjectSearchFilterContainer, children: /* @__PURE__ */ (0, import_jsx_runtime58.jsxs)(import_design_system29.VerticalRhythm, { children: [
|
|
5117
|
+
/* @__PURE__ */ (0, import_jsx_runtime58.jsx)(
|
|
4932
5118
|
InputVariables,
|
|
4933
5119
|
{
|
|
4934
5120
|
label: searchInputLabel,
|
|
@@ -4936,8 +5122,8 @@ var QueryFilter = ({
|
|
|
4936
5122
|
onChange: (newQuery) => handleFilterChange({ keyword: newQuery }),
|
|
4937
5123
|
disableInlineMenu: true,
|
|
4938
5124
|
id: "qf_searchText",
|
|
4939
|
-
inputWhenNoVariables: /* @__PURE__ */ (0,
|
|
4940
|
-
|
|
5125
|
+
inputWhenNoVariables: /* @__PURE__ */ (0, import_jsx_runtime58.jsx)(
|
|
5126
|
+
import_design_system29.DebouncedInputKeywordSearch,
|
|
4941
5127
|
{
|
|
4942
5128
|
id: "qf_searchText",
|
|
4943
5129
|
inputFieldName: searchInputName,
|
|
@@ -4950,8 +5136,8 @@ var QueryFilter = ({
|
|
|
4950
5136
|
)
|
|
4951
5137
|
}
|
|
4952
5138
|
),
|
|
4953
|
-
/* @__PURE__ */ (0,
|
|
4954
|
-
/* @__PURE__ */ (0,
|
|
5139
|
+
/* @__PURE__ */ (0, import_jsx_runtime58.jsxs)("div", { css: ObjectSearchFilterGrid("1fr 100px"), children: [
|
|
5140
|
+
/* @__PURE__ */ (0, import_jsx_runtime58.jsx)(
|
|
4955
5141
|
InputVariables,
|
|
4956
5142
|
{
|
|
4957
5143
|
label: contentTypeLabel,
|
|
@@ -4959,8 +5145,8 @@ var QueryFilter = ({
|
|
|
4959
5145
|
value: (_g = queryState.contentType) != null ? _g : "",
|
|
4960
5146
|
onChange: (newType) => handleFilterChange({ contentType: newType }),
|
|
4961
5147
|
disableInlineMenu: true,
|
|
4962
|
-
inputWhenNoVariables: /* @__PURE__ */ (0,
|
|
4963
|
-
|
|
5148
|
+
inputWhenNoVariables: /* @__PURE__ */ (0, import_jsx_runtime58.jsx)(
|
|
5149
|
+
import_design_system29.InputSelect,
|
|
4964
5150
|
{
|
|
4965
5151
|
id: "qf_contentType",
|
|
4966
5152
|
label: contentTypeLabel,
|
|
@@ -4973,7 +5159,7 @@ var QueryFilter = ({
|
|
|
4973
5159
|
)
|
|
4974
5160
|
}
|
|
4975
5161
|
),
|
|
4976
|
-
/* @__PURE__ */ (0,
|
|
5162
|
+
/* @__PURE__ */ (0, import_jsx_runtime58.jsx)(
|
|
4977
5163
|
InputVariables,
|
|
4978
5164
|
{
|
|
4979
5165
|
label: countLabel,
|
|
@@ -4982,8 +5168,8 @@ var QueryFilter = ({
|
|
|
4982
5168
|
onChange: (newCount) => handleFilterChange({ count: newCount }),
|
|
4983
5169
|
disableInlineMenu: true,
|
|
4984
5170
|
valueToResetTo: "5",
|
|
4985
|
-
inputWhenNoVariables: /* @__PURE__ */ (0,
|
|
4986
|
-
|
|
5171
|
+
inputWhenNoVariables: /* @__PURE__ */ (0, import_jsx_runtime58.jsx)(
|
|
5172
|
+
import_design_system29.Input,
|
|
4987
5173
|
{
|
|
4988
5174
|
id: "qf_count",
|
|
4989
5175
|
label: countLabel,
|
|
@@ -4997,8 +5183,8 @@ var QueryFilter = ({
|
|
|
4997
5183
|
}
|
|
4998
5184
|
)
|
|
4999
5185
|
] }),
|
|
5000
|
-
/* @__PURE__ */ (0,
|
|
5001
|
-
/* @__PURE__ */ (0,
|
|
5186
|
+
/* @__PURE__ */ (0, import_jsx_runtime58.jsxs)("div", { css: ObjectSearchFilterGrid("2fr 1fr"), children: [
|
|
5187
|
+
/* @__PURE__ */ (0, import_jsx_runtime58.jsx)(
|
|
5002
5188
|
InputVariables,
|
|
5003
5189
|
{
|
|
5004
5190
|
id: "qf_sortBy",
|
|
@@ -5006,8 +5192,8 @@ var QueryFilter = ({
|
|
|
5006
5192
|
value: queryState.sortBy,
|
|
5007
5193
|
onChange: (newSortBy) => handleFilterChange({ sortBy: newSortBy }),
|
|
5008
5194
|
disableInlineMenu: true,
|
|
5009
|
-
inputWhenNoVariables: /* @__PURE__ */ (0,
|
|
5010
|
-
|
|
5195
|
+
inputWhenNoVariables: /* @__PURE__ */ (0, import_jsx_runtime58.jsx)(
|
|
5196
|
+
import_design_system29.InputSelect,
|
|
5011
5197
|
{
|
|
5012
5198
|
label: sortLabel,
|
|
5013
5199
|
id: "qf_sortBy",
|
|
@@ -5020,7 +5206,7 @@ var QueryFilter = ({
|
|
|
5020
5206
|
)
|
|
5021
5207
|
}
|
|
5022
5208
|
),
|
|
5023
|
-
/* @__PURE__ */ (0,
|
|
5209
|
+
/* @__PURE__ */ (0, import_jsx_runtime58.jsx)(
|
|
5024
5210
|
InputVariables,
|
|
5025
5211
|
{
|
|
5026
5212
|
label: sortOrderLabel,
|
|
@@ -5028,8 +5214,8 @@ var QueryFilter = ({
|
|
|
5028
5214
|
value: queryState.sortOrder,
|
|
5029
5215
|
onChange: (newSort) => handleFilterChange({ sortOrder: newSort }),
|
|
5030
5216
|
disableInlineMenu: true,
|
|
5031
|
-
inputWhenNoVariables: /* @__PURE__ */ (0,
|
|
5032
|
-
|
|
5217
|
+
inputWhenNoVariables: /* @__PURE__ */ (0, import_jsx_runtime58.jsx)(
|
|
5218
|
+
import_design_system29.InputSelect,
|
|
5033
5219
|
{
|
|
5034
5220
|
label: sortOrderLabel,
|
|
5035
5221
|
id: "qf_sortOrder",
|
|
@@ -5048,8 +5234,8 @@ var QueryFilter = ({
|
|
|
5048
5234
|
};
|
|
5049
5235
|
|
|
5050
5236
|
// src/components/ParamTypeDynamicDataProvider.tsx
|
|
5051
|
-
var
|
|
5052
|
-
var
|
|
5237
|
+
var import_react56 = require("react");
|
|
5238
|
+
var import_jsx_runtime59 = require("@emotion/react/jsx-runtime");
|
|
5053
5239
|
function ParamTypeDynamicDataProvider(props) {
|
|
5054
5240
|
const { children } = props;
|
|
5055
5241
|
const {
|
|
@@ -5057,11 +5243,11 @@ function ParamTypeDynamicDataProvider(props) {
|
|
|
5057
5243
|
} = useMeshLocation("paramType");
|
|
5058
5244
|
const dynamicInputsAsVariables = useDynamicInputsAsVariables(dynamicInputs);
|
|
5059
5245
|
const connectedDataAsVariables = useConnectedDataAsVariables(connectedData);
|
|
5060
|
-
const variables = (0,
|
|
5246
|
+
const variables = (0, import_react56.useMemo)(
|
|
5061
5247
|
() => ({ ...connectedDataAsVariables, ...dynamicInputsAsVariables }),
|
|
5062
5248
|
[dynamicInputsAsVariables, connectedDataAsVariables]
|
|
5063
5249
|
);
|
|
5064
|
-
return /* @__PURE__ */ (0,
|
|
5250
|
+
return /* @__PURE__ */ (0, import_jsx_runtime59.jsx)(VariablesProvider, { value: variables, onChange: () => {
|
|
5065
5251
|
}, editVariableComponent: JsonMeshVariableEditor, children });
|
|
5066
5252
|
}
|
|
5067
5253
|
var JsonMeshVariableEditor = ({
|
|
@@ -5070,9 +5256,9 @@ var JsonMeshVariableEditor = ({
|
|
|
5070
5256
|
variable,
|
|
5071
5257
|
context
|
|
5072
5258
|
}) => {
|
|
5073
|
-
const sillyRef = (0,
|
|
5259
|
+
const sillyRef = (0, import_react56.useRef)(false);
|
|
5074
5260
|
const { editConnectedData } = useMeshLocation("paramType");
|
|
5075
|
-
(0,
|
|
5261
|
+
(0, import_react56.useEffect)(() => {
|
|
5076
5262
|
if (sillyRef.current) {
|
|
5077
5263
|
return;
|
|
5078
5264
|
}
|
|
@@ -5508,6 +5694,12 @@ var MULTI_SELECT_OPERATORS = [
|
|
|
5508
5694
|
editorType: "multiChoice",
|
|
5509
5695
|
expectedValueType: "array"
|
|
5510
5696
|
},
|
|
5697
|
+
{
|
|
5698
|
+
label: "is all of...",
|
|
5699
|
+
value: "all",
|
|
5700
|
+
editorType: "multiChoice",
|
|
5701
|
+
expectedValueType: "array"
|
|
5702
|
+
},
|
|
5511
5703
|
{
|
|
5512
5704
|
label: "is empty",
|
|
5513
5705
|
value: "ndef",
|
|
@@ -5535,10 +5727,10 @@ var MULTI_SELECT_OPERATORS = [
|
|
|
5535
5727
|
];
|
|
5536
5728
|
|
|
5537
5729
|
// src/components/SearchAndFilter/editors/DateEditor.tsx
|
|
5538
|
-
var
|
|
5539
|
-
var
|
|
5730
|
+
var import_design_system30 = require("@uniformdev/design-system");
|
|
5731
|
+
var import_react57 = require("react");
|
|
5540
5732
|
var import_react_use2 = require("react-use");
|
|
5541
|
-
var
|
|
5733
|
+
var import_jsx_runtime60 = require("@emotion/react/jsx-runtime");
|
|
5542
5734
|
var DateEditor = ({
|
|
5543
5735
|
onChange,
|
|
5544
5736
|
ariaLabel,
|
|
@@ -5547,10 +5739,10 @@ var DateEditor = ({
|
|
|
5547
5739
|
readOnly,
|
|
5548
5740
|
valueTestId
|
|
5549
5741
|
}) => {
|
|
5550
|
-
const [innerValue, setInnerValue] = (0,
|
|
5742
|
+
const [innerValue, setInnerValue] = (0, import_react57.useState)(value != null ? value : "");
|
|
5551
5743
|
(0, import_react_use2.useDebounce)(() => onChange(innerValue), 500, [innerValue]);
|
|
5552
|
-
return /* @__PURE__ */ (0,
|
|
5553
|
-
|
|
5744
|
+
return /* @__PURE__ */ (0, import_jsx_runtime60.jsx)(
|
|
5745
|
+
import_design_system30.Input,
|
|
5554
5746
|
{
|
|
5555
5747
|
type: "date",
|
|
5556
5748
|
label: ariaLabel,
|
|
@@ -5565,22 +5757,22 @@ var DateEditor = ({
|
|
|
5565
5757
|
};
|
|
5566
5758
|
|
|
5567
5759
|
// src/components/SearchAndFilter/editors/DateRangeEditor.tsx
|
|
5568
|
-
var
|
|
5569
|
-
var
|
|
5760
|
+
var import_design_system32 = require("@uniformdev/design-system");
|
|
5761
|
+
var import_react58 = require("react");
|
|
5570
5762
|
var import_react_use3 = require("react-use");
|
|
5571
5763
|
|
|
5572
5764
|
// src/components/SearchAndFilter/editors/shared/ErrorContainer.tsx
|
|
5573
|
-
var
|
|
5574
|
-
var
|
|
5765
|
+
var import_design_system31 = require("@uniformdev/design-system");
|
|
5766
|
+
var import_jsx_runtime61 = require("@emotion/react/jsx-runtime");
|
|
5575
5767
|
var ErrorContainer = ({ errorMessage }) => {
|
|
5576
|
-
return /* @__PURE__ */ (0,
|
|
5768
|
+
return /* @__PURE__ */ (0, import_jsx_runtime61.jsx)(
|
|
5577
5769
|
"div",
|
|
5578
5770
|
{
|
|
5579
5771
|
css: {
|
|
5580
5772
|
gridColumn: "span 6",
|
|
5581
5773
|
order: 6
|
|
5582
5774
|
},
|
|
5583
|
-
children: /* @__PURE__ */ (0,
|
|
5775
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime61.jsx)(import_design_system31.FieldMessage, { errorMessage })
|
|
5584
5776
|
}
|
|
5585
5777
|
);
|
|
5586
5778
|
};
|
|
@@ -5593,7 +5785,7 @@ var twoColumnGrid = {
|
|
|
5593
5785
|
};
|
|
5594
5786
|
|
|
5595
5787
|
// src/components/SearchAndFilter/editors/DateRangeEditor.tsx
|
|
5596
|
-
var
|
|
5788
|
+
var import_jsx_runtime62 = require("@emotion/react/jsx-runtime");
|
|
5597
5789
|
var DateRangeEditor = ({
|
|
5598
5790
|
ariaLabel,
|
|
5599
5791
|
onChange,
|
|
@@ -5602,9 +5794,9 @@ var DateRangeEditor = ({
|
|
|
5602
5794
|
readOnly,
|
|
5603
5795
|
valueTestId
|
|
5604
5796
|
}) => {
|
|
5605
|
-
const [minDateValue, setMinDateValue] = (0,
|
|
5606
|
-
const [maxDateValue, setMaxDateValue] = (0,
|
|
5607
|
-
const [error, setError] = (0,
|
|
5797
|
+
const [minDateValue, setMinDateValue] = (0, import_react58.useState)(value ? value[0] : "");
|
|
5798
|
+
const [maxDateValue, setMaxDateValue] = (0, import_react58.useState)(value ? value[1] : "");
|
|
5799
|
+
const [error, setError] = (0, import_react58.useState)("");
|
|
5608
5800
|
(0, import_react_use3.useDebounce)(
|
|
5609
5801
|
() => {
|
|
5610
5802
|
if (minDateValue && maxDateValue && !error) {
|
|
@@ -5616,7 +5808,7 @@ var DateRangeEditor = ({
|
|
|
5616
5808
|
500,
|
|
5617
5809
|
[minDateValue, maxDateValue]
|
|
5618
5810
|
);
|
|
5619
|
-
(0,
|
|
5811
|
+
(0, import_react58.useEffect)(() => {
|
|
5620
5812
|
if (!minDateValue || !maxDateValue) {
|
|
5621
5813
|
return;
|
|
5622
5814
|
}
|
|
@@ -5651,10 +5843,10 @@ var DateRangeEditor = ({
|
|
|
5651
5843
|
setMaxDateValue("");
|
|
5652
5844
|
}
|
|
5653
5845
|
}, [minDateValue, maxDateValue, setError]);
|
|
5654
|
-
return /* @__PURE__ */ (0,
|
|
5655
|
-
/* @__PURE__ */ (0,
|
|
5656
|
-
/* @__PURE__ */ (0,
|
|
5657
|
-
|
|
5846
|
+
return /* @__PURE__ */ (0, import_jsx_runtime62.jsxs)(import_jsx_runtime62.Fragment, { children: [
|
|
5847
|
+
/* @__PURE__ */ (0, import_jsx_runtime62.jsxs)("div", { css: twoColumnGrid, "data-testid": valueTestId, children: [
|
|
5848
|
+
/* @__PURE__ */ (0, import_jsx_runtime62.jsx)(
|
|
5849
|
+
import_design_system32.Input,
|
|
5658
5850
|
{
|
|
5659
5851
|
label: `${ariaLabel}-min-date`,
|
|
5660
5852
|
type: "date",
|
|
@@ -5667,8 +5859,8 @@ var DateRangeEditor = ({
|
|
|
5667
5859
|
"data-testid": "value-low"
|
|
5668
5860
|
}
|
|
5669
5861
|
),
|
|
5670
|
-
/* @__PURE__ */ (0,
|
|
5671
|
-
|
|
5862
|
+
/* @__PURE__ */ (0, import_jsx_runtime62.jsx)(
|
|
5863
|
+
import_design_system32.Input,
|
|
5672
5864
|
{
|
|
5673
5865
|
label: `${ariaLabel}-max-date`,
|
|
5674
5866
|
type: "date",
|
|
@@ -5682,13 +5874,13 @@ var DateRangeEditor = ({
|
|
|
5682
5874
|
}
|
|
5683
5875
|
)
|
|
5684
5876
|
] }),
|
|
5685
|
-
/* @__PURE__ */ (0,
|
|
5877
|
+
/* @__PURE__ */ (0, import_jsx_runtime62.jsx)(ErrorContainer, { errorMessage: error })
|
|
5686
5878
|
] });
|
|
5687
5879
|
};
|
|
5688
5880
|
|
|
5689
5881
|
// src/components/SearchAndFilter/editors/FilterMultiChoiceEditor.tsx
|
|
5690
|
-
var
|
|
5691
|
-
var
|
|
5882
|
+
var import_design_system33 = require("@uniformdev/design-system");
|
|
5883
|
+
var import_react59 = require("react");
|
|
5692
5884
|
|
|
5693
5885
|
// src/components/SearchAndFilter/editors/shared/readOnlyAttributes.tsx
|
|
5694
5886
|
var readOnlyAttributes = {
|
|
@@ -5698,7 +5890,7 @@ var readOnlyAttributes = {
|
|
|
5698
5890
|
};
|
|
5699
5891
|
|
|
5700
5892
|
// src/components/SearchAndFilter/editors/FilterMultiChoiceEditor.tsx
|
|
5701
|
-
var
|
|
5893
|
+
var import_jsx_runtime63 = require("@emotion/react/jsx-runtime");
|
|
5702
5894
|
var FilterMultiChoiceEditor = ({
|
|
5703
5895
|
value,
|
|
5704
5896
|
options,
|
|
@@ -5709,12 +5901,12 @@ var FilterMultiChoiceEditor = ({
|
|
|
5709
5901
|
}) => {
|
|
5710
5902
|
const readOnlyProps = readOnly ? readOnlyAttributes : {};
|
|
5711
5903
|
const isClearable = !readOnly || !disabled;
|
|
5712
|
-
const { groupedOptions, selectedOptions } = (0,
|
|
5713
|
-
() => (0,
|
|
5904
|
+
const { groupedOptions, selectedOptions } = (0, import_react59.useMemo)(
|
|
5905
|
+
() => (0, import_design_system33.convertComboBoxGroupsToSelectableGroups)({ options: options != null ? options : [], selectedItems: new Set(value) }),
|
|
5714
5906
|
[options, value]
|
|
5715
5907
|
);
|
|
5716
|
-
return /* @__PURE__ */ (0,
|
|
5717
|
-
|
|
5908
|
+
return /* @__PURE__ */ (0, import_jsx_runtime63.jsx)("div", { "data-testid": valueTestId, children: /* @__PURE__ */ (0, import_jsx_runtime63.jsx)(
|
|
5909
|
+
import_design_system33.InputComboBox,
|
|
5718
5910
|
{
|
|
5719
5911
|
...props,
|
|
5720
5912
|
placeholder: "Type to search...",
|
|
@@ -5723,7 +5915,7 @@ var FilterMultiChoiceEditor = ({
|
|
|
5723
5915
|
isClearable,
|
|
5724
5916
|
isDisabled: disabled,
|
|
5725
5917
|
onChange: (e) => {
|
|
5726
|
-
const selectedValues = (0,
|
|
5918
|
+
const selectedValues = (0, import_design_system33.getComboBoxSelectedSelectableGroups)(e);
|
|
5727
5919
|
return props.onChange([...selectedValues]);
|
|
5728
5920
|
},
|
|
5729
5921
|
value: selectedOptions,
|
|
@@ -5742,9 +5934,9 @@ var FilterMultiChoiceEditor = ({
|
|
|
5742
5934
|
};
|
|
5743
5935
|
|
|
5744
5936
|
// src/components/SearchAndFilter/editors/FilterSingleChoiceEditor.tsx
|
|
5745
|
-
var
|
|
5746
|
-
var
|
|
5747
|
-
var
|
|
5937
|
+
var import_design_system34 = require("@uniformdev/design-system");
|
|
5938
|
+
var import_react60 = require("react");
|
|
5939
|
+
var import_jsx_runtime64 = require("@emotion/react/jsx-runtime");
|
|
5748
5940
|
var FilterSingleChoiceEditor = ({
|
|
5749
5941
|
options,
|
|
5750
5942
|
value,
|
|
@@ -5754,16 +5946,16 @@ var FilterSingleChoiceEditor = ({
|
|
|
5754
5946
|
valueTestId
|
|
5755
5947
|
}) => {
|
|
5756
5948
|
const readOnlyProps = readOnly ? readOnlyAttributes : {};
|
|
5757
|
-
const { groupedOptions, selectedOptions } = (0,
|
|
5758
|
-
() => (0,
|
|
5949
|
+
const { groupedOptions, selectedOptions } = (0, import_react60.useMemo)(
|
|
5950
|
+
() => (0, import_design_system34.convertComboBoxGroupsToSelectableGroups)({
|
|
5759
5951
|
options: options != null ? options : [],
|
|
5760
5952
|
selectedItems: new Set(value ? [String(value)] : void 0),
|
|
5761
5953
|
selectionMode: "single"
|
|
5762
5954
|
}),
|
|
5763
5955
|
[options, value]
|
|
5764
5956
|
);
|
|
5765
|
-
return /* @__PURE__ */ (0,
|
|
5766
|
-
|
|
5957
|
+
return /* @__PURE__ */ (0, import_jsx_runtime64.jsx)("div", { "data-testid": valueTestId, children: /* @__PURE__ */ (0, import_jsx_runtime64.jsx)(
|
|
5958
|
+
import_design_system34.InputComboBox,
|
|
5767
5959
|
{
|
|
5768
5960
|
placeholder: "Type to search...",
|
|
5769
5961
|
options: groupedOptions,
|
|
@@ -5791,10 +5983,10 @@ var FilterSingleChoiceEditor = ({
|
|
|
5791
5983
|
};
|
|
5792
5984
|
|
|
5793
5985
|
// src/components/SearchAndFilter/editors/NumberEditor.tsx
|
|
5794
|
-
var
|
|
5795
|
-
var
|
|
5986
|
+
var import_design_system35 = require("@uniformdev/design-system");
|
|
5987
|
+
var import_react61 = require("react");
|
|
5796
5988
|
var import_react_use4 = require("react-use");
|
|
5797
|
-
var
|
|
5989
|
+
var import_jsx_runtime65 = require("@emotion/react/jsx-runtime");
|
|
5798
5990
|
var NumberEditor = ({
|
|
5799
5991
|
ariaLabel,
|
|
5800
5992
|
onChange,
|
|
@@ -5803,10 +5995,10 @@ var NumberEditor = ({
|
|
|
5803
5995
|
readOnly,
|
|
5804
5996
|
valueTestId
|
|
5805
5997
|
}) => {
|
|
5806
|
-
const [innerValue, setInnerValue] = (0,
|
|
5998
|
+
const [innerValue, setInnerValue] = (0, import_react61.useState)(value != null ? value : "");
|
|
5807
5999
|
(0, import_react_use4.useDebounce)(() => onChange(innerValue), 500, [innerValue]);
|
|
5808
|
-
return /* @__PURE__ */ (0,
|
|
5809
|
-
|
|
6000
|
+
return /* @__PURE__ */ (0, import_jsx_runtime65.jsx)(
|
|
6001
|
+
import_design_system35.Input,
|
|
5810
6002
|
{
|
|
5811
6003
|
label: ariaLabel,
|
|
5812
6004
|
type: "number",
|
|
@@ -5822,10 +6014,10 @@ var NumberEditor = ({
|
|
|
5822
6014
|
};
|
|
5823
6015
|
|
|
5824
6016
|
// src/components/SearchAndFilter/editors/NumberRangeEditor.tsx
|
|
5825
|
-
var
|
|
5826
|
-
var
|
|
6017
|
+
var import_design_system36 = require("@uniformdev/design-system");
|
|
6018
|
+
var import_react62 = require("react");
|
|
5827
6019
|
var import_react_use5 = require("react-use");
|
|
5828
|
-
var
|
|
6020
|
+
var import_jsx_runtime66 = require("@emotion/react/jsx-runtime");
|
|
5829
6021
|
var NumberRangeEditor = ({
|
|
5830
6022
|
onChange,
|
|
5831
6023
|
disabled,
|
|
@@ -5834,9 +6026,9 @@ var NumberRangeEditor = ({
|
|
|
5834
6026
|
readOnly,
|
|
5835
6027
|
valueTestId
|
|
5836
6028
|
}) => {
|
|
5837
|
-
const [minValue, setMinValue] = (0,
|
|
5838
|
-
const [maxValue, setMaxValue] = (0,
|
|
5839
|
-
const [error, setError] = (0,
|
|
6029
|
+
const [minValue, setMinValue] = (0, import_react62.useState)("");
|
|
6030
|
+
const [maxValue, setMaxValue] = (0, import_react62.useState)("");
|
|
6031
|
+
const [error, setError] = (0, import_react62.useState)("");
|
|
5840
6032
|
(0, import_react_use5.useDebounce)(
|
|
5841
6033
|
() => {
|
|
5842
6034
|
if (minValue && maxValue && !error) {
|
|
@@ -5848,7 +6040,7 @@ var NumberRangeEditor = ({
|
|
|
5848
6040
|
500,
|
|
5849
6041
|
[minValue, maxValue]
|
|
5850
6042
|
);
|
|
5851
|
-
(0,
|
|
6043
|
+
(0, import_react62.useEffect)(() => {
|
|
5852
6044
|
if (!maxValue && !minValue) {
|
|
5853
6045
|
return;
|
|
5854
6046
|
}
|
|
@@ -5870,10 +6062,10 @@ var NumberRangeEditor = ({
|
|
|
5870
6062
|
setMaxValue(maxValue);
|
|
5871
6063
|
}
|
|
5872
6064
|
}, [maxValue, minValue, setError]);
|
|
5873
|
-
return /* @__PURE__ */ (0,
|
|
5874
|
-
/* @__PURE__ */ (0,
|
|
5875
|
-
/* @__PURE__ */ (0,
|
|
5876
|
-
|
|
6065
|
+
return /* @__PURE__ */ (0, import_jsx_runtime66.jsxs)(import_jsx_runtime66.Fragment, { children: [
|
|
6066
|
+
/* @__PURE__ */ (0, import_jsx_runtime66.jsxs)("div", { css: twoColumnGrid, "data-testid": valueTestId, children: [
|
|
6067
|
+
/* @__PURE__ */ (0, import_jsx_runtime66.jsx)(
|
|
6068
|
+
import_design_system36.Input,
|
|
5877
6069
|
{
|
|
5878
6070
|
label: `${ariaLabel}-min`,
|
|
5879
6071
|
type: "number",
|
|
@@ -5888,8 +6080,8 @@ var NumberRangeEditor = ({
|
|
|
5888
6080
|
"data-testid": "value-low"
|
|
5889
6081
|
}
|
|
5890
6082
|
),
|
|
5891
|
-
/* @__PURE__ */ (0,
|
|
5892
|
-
|
|
6083
|
+
/* @__PURE__ */ (0, import_jsx_runtime66.jsx)(
|
|
6084
|
+
import_design_system36.Input,
|
|
5893
6085
|
{
|
|
5894
6086
|
type: "number",
|
|
5895
6087
|
label: `${ariaLabel}-max`,
|
|
@@ -5905,20 +6097,20 @@ var NumberRangeEditor = ({
|
|
|
5905
6097
|
}
|
|
5906
6098
|
)
|
|
5907
6099
|
] }),
|
|
5908
|
-
/* @__PURE__ */ (0,
|
|
6100
|
+
/* @__PURE__ */ (0, import_jsx_runtime66.jsx)(ErrorContainer, { errorMessage: error })
|
|
5909
6101
|
] });
|
|
5910
6102
|
};
|
|
5911
6103
|
|
|
5912
6104
|
// src/components/SearchAndFilter/editors/StatusMultiEditor.tsx
|
|
5913
|
-
var
|
|
5914
|
-
var
|
|
6105
|
+
var import_design_system38 = require("@uniformdev/design-system");
|
|
6106
|
+
var import_react63 = require("react");
|
|
5915
6107
|
|
|
5916
6108
|
// src/components/SearchAndFilter/editors/shared/CustomOptions.tsx
|
|
5917
|
-
var
|
|
5918
|
-
var
|
|
6109
|
+
var import_design_system37 = require("@uniformdev/design-system");
|
|
6110
|
+
var import_jsx_runtime67 = require("@emotion/react/jsx-runtime");
|
|
5919
6111
|
var CustomOptions = ({ label, value }) => {
|
|
5920
|
-
return /* @__PURE__ */ (0,
|
|
5921
|
-
|
|
6112
|
+
return /* @__PURE__ */ (0, import_jsx_runtime67.jsx)(
|
|
6113
|
+
import_design_system37.StatusBullet,
|
|
5922
6114
|
{
|
|
5923
6115
|
status: label,
|
|
5924
6116
|
message: Array.isArray(value) ? value.join(",") : value
|
|
@@ -5927,7 +6119,7 @@ var CustomOptions = ({ label, value }) => {
|
|
|
5927
6119
|
};
|
|
5928
6120
|
|
|
5929
6121
|
// src/components/SearchAndFilter/editors/StatusMultiEditor.tsx
|
|
5930
|
-
var
|
|
6122
|
+
var import_jsx_runtime68 = require("@emotion/react/jsx-runtime");
|
|
5931
6123
|
var StatusMultiEditor = ({
|
|
5932
6124
|
options,
|
|
5933
6125
|
value,
|
|
@@ -5937,17 +6129,17 @@ var StatusMultiEditor = ({
|
|
|
5937
6129
|
valueTestId
|
|
5938
6130
|
}) => {
|
|
5939
6131
|
const readOnlyProps = readOnly ? readOnlyAttributes : {};
|
|
5940
|
-
const { groupedOptions, selectedOptions } = (0,
|
|
5941
|
-
() => (0,
|
|
6132
|
+
const { groupedOptions, selectedOptions } = (0, import_react63.useMemo)(
|
|
6133
|
+
() => (0, import_design_system38.convertComboBoxGroupsToSelectableGroups)({ options: options != null ? options : [], selectedItems: new Set(value) }),
|
|
5942
6134
|
[options, value]
|
|
5943
6135
|
);
|
|
5944
|
-
return /* @__PURE__ */ (0,
|
|
5945
|
-
|
|
6136
|
+
return /* @__PURE__ */ (0, import_jsx_runtime68.jsx)("div", { "data-testid": valueTestId, children: /* @__PURE__ */ (0, import_jsx_runtime68.jsx)(
|
|
6137
|
+
import_design_system38.InputComboBox,
|
|
5946
6138
|
{
|
|
5947
6139
|
options: groupedOptions != null ? groupedOptions : [],
|
|
5948
6140
|
isMulti: true,
|
|
5949
6141
|
onChange: (e) => {
|
|
5950
|
-
const selectedValues = (0,
|
|
6142
|
+
const selectedValues = (0, import_design_system38.getComboBoxSelectedSelectableGroups)(e);
|
|
5951
6143
|
return onChange([...selectedValues]);
|
|
5952
6144
|
},
|
|
5953
6145
|
formatOptionLabel: CustomOptions,
|
|
@@ -5968,9 +6160,9 @@ var StatusMultiEditor = ({
|
|
|
5968
6160
|
};
|
|
5969
6161
|
|
|
5970
6162
|
// src/components/SearchAndFilter/editors/StatusSingleEditor.tsx
|
|
5971
|
-
var
|
|
5972
|
-
var
|
|
5973
|
-
var
|
|
6163
|
+
var import_design_system39 = require("@uniformdev/design-system");
|
|
6164
|
+
var import_react64 = require("react");
|
|
6165
|
+
var import_jsx_runtime69 = require("@emotion/react/jsx-runtime");
|
|
5974
6166
|
var StatusSingleEditor = ({
|
|
5975
6167
|
options,
|
|
5976
6168
|
value,
|
|
@@ -5980,16 +6172,16 @@ var StatusSingleEditor = ({
|
|
|
5980
6172
|
valueTestId
|
|
5981
6173
|
}) => {
|
|
5982
6174
|
const readOnlyProps = readOnly ? readOnlyAttributes : {};
|
|
5983
|
-
const { groupedOptions, selectedOptions } = (0,
|
|
5984
|
-
() => (0,
|
|
6175
|
+
const { groupedOptions, selectedOptions } = (0, import_react64.useMemo)(
|
|
6176
|
+
() => (0, import_design_system39.convertComboBoxGroupsToSelectableGroups)({
|
|
5985
6177
|
options: options != null ? options : [],
|
|
5986
6178
|
selectedItems: new Set(value ? [value] : void 0),
|
|
5987
6179
|
selectionMode: "single"
|
|
5988
6180
|
}),
|
|
5989
6181
|
[options, value]
|
|
5990
6182
|
);
|
|
5991
|
-
return /* @__PURE__ */ (0,
|
|
5992
|
-
|
|
6183
|
+
return /* @__PURE__ */ (0, import_jsx_runtime69.jsx)("div", { "data-testid": valueTestId, children: /* @__PURE__ */ (0, import_jsx_runtime69.jsx)(
|
|
6184
|
+
import_design_system39.InputComboBox,
|
|
5993
6185
|
{
|
|
5994
6186
|
options: groupedOptions,
|
|
5995
6187
|
onChange: (e) => {
|
|
@@ -6016,10 +6208,10 @@ var StatusSingleEditor = ({
|
|
|
6016
6208
|
};
|
|
6017
6209
|
|
|
6018
6210
|
// src/components/SearchAndFilter/editors/TextEditor.tsx
|
|
6019
|
-
var
|
|
6020
|
-
var
|
|
6211
|
+
var import_design_system40 = require("@uniformdev/design-system");
|
|
6212
|
+
var import_react65 = require("react");
|
|
6021
6213
|
var import_react_use6 = require("react-use");
|
|
6022
|
-
var
|
|
6214
|
+
var import_jsx_runtime70 = require("@emotion/react/jsx-runtime");
|
|
6023
6215
|
var TextEditor = ({
|
|
6024
6216
|
onChange,
|
|
6025
6217
|
ariaLabel,
|
|
@@ -6027,10 +6219,10 @@ var TextEditor = ({
|
|
|
6027
6219
|
readOnly,
|
|
6028
6220
|
valueTestId
|
|
6029
6221
|
}) => {
|
|
6030
|
-
const [innerValue, setInnerValue] = (0,
|
|
6222
|
+
const [innerValue, setInnerValue] = (0, import_react65.useState)(value != null ? value : "");
|
|
6031
6223
|
(0, import_react_use6.useDebounce)(() => onChange(innerValue), 500, [innerValue]);
|
|
6032
|
-
return /* @__PURE__ */ (0,
|
|
6033
|
-
|
|
6224
|
+
return /* @__PURE__ */ (0, import_jsx_runtime70.jsx)(
|
|
6225
|
+
import_design_system40.Input,
|
|
6034
6226
|
{
|
|
6035
6227
|
showLabel: false,
|
|
6036
6228
|
label: ariaLabel,
|
|
@@ -6044,9 +6236,9 @@ var TextEditor = ({
|
|
|
6044
6236
|
};
|
|
6045
6237
|
|
|
6046
6238
|
// src/components/SearchAndFilter/editors/TextMultiChoiceEditor.tsx
|
|
6047
|
-
var
|
|
6048
|
-
var
|
|
6049
|
-
var
|
|
6239
|
+
var import_design_system41 = require("@uniformdev/design-system");
|
|
6240
|
+
var import_react66 = require("react");
|
|
6241
|
+
var import_jsx_runtime71 = require("@emotion/react/jsx-runtime");
|
|
6050
6242
|
var TextMultiChoiceEditor = ({
|
|
6051
6243
|
value,
|
|
6052
6244
|
disabled,
|
|
@@ -6056,14 +6248,14 @@ var TextMultiChoiceEditor = ({
|
|
|
6056
6248
|
}) => {
|
|
6057
6249
|
const readOnlyProps = readOnly ? readOnlyAttributes : {};
|
|
6058
6250
|
const isClearable = !readOnly || !disabled;
|
|
6059
|
-
const { groupedOptions, selectedOptions } = (0,
|
|
6251
|
+
const { groupedOptions, selectedOptions } = (0, import_react66.useMemo)(() => {
|
|
6060
6252
|
var _a;
|
|
6061
6253
|
const coercedValue = typeof value === "string" ? [value] : value != null ? value : [];
|
|
6062
6254
|
const options = (_a = coercedValue.map((v) => ({ label: v, value: v }))) != null ? _a : [];
|
|
6063
|
-
return (0,
|
|
6255
|
+
return (0, import_design_system41.convertComboBoxGroupsToSelectableGroups)({ options, selectedItems: new Set(value) });
|
|
6064
6256
|
}, [value]);
|
|
6065
|
-
return /* @__PURE__ */ (0,
|
|
6066
|
-
|
|
6257
|
+
return /* @__PURE__ */ (0, import_jsx_runtime71.jsx)("div", { "data-testid": valueTestId, children: /* @__PURE__ */ (0, import_jsx_runtime71.jsx)(
|
|
6258
|
+
import_design_system41.InputCreatableComboBox,
|
|
6067
6259
|
{
|
|
6068
6260
|
...props,
|
|
6069
6261
|
placeholder: "Type a value\u2026",
|
|
@@ -6073,7 +6265,7 @@ var TextMultiChoiceEditor = ({
|
|
|
6073
6265
|
isClearable,
|
|
6074
6266
|
isDisabled: disabled,
|
|
6075
6267
|
onChange: (e) => {
|
|
6076
|
-
const selectedValues = (0,
|
|
6268
|
+
const selectedValues = (0, import_design_system41.getComboBoxSelectedSelectableGroups)(e);
|
|
6077
6269
|
return props.onChange([...selectedValues]);
|
|
6078
6270
|
},
|
|
6079
6271
|
value: selectedOptions,
|
|
@@ -6092,31 +6284,31 @@ var TextMultiChoiceEditor = ({
|
|
|
6092
6284
|
};
|
|
6093
6285
|
|
|
6094
6286
|
// src/components/SearchAndFilter/FilterButton.tsx
|
|
6095
|
-
var
|
|
6287
|
+
var import_design_system43 = require("@uniformdev/design-system");
|
|
6096
6288
|
|
|
6097
6289
|
// src/components/SearchAndFilter/styles/SearchAndFilter.styles.ts
|
|
6098
|
-
var
|
|
6099
|
-
var
|
|
6100
|
-
var SearchAndFilterControlsWrapper = (gridColumns) =>
|
|
6290
|
+
var import_react67 = require("@emotion/react");
|
|
6291
|
+
var import_design_system42 = require("@uniformdev/design-system");
|
|
6292
|
+
var SearchAndFilterControlsWrapper = (gridColumns) => import_react67.css`
|
|
6101
6293
|
align-items: stretch;
|
|
6102
6294
|
display: grid;
|
|
6103
6295
|
grid-template-columns: ${gridColumns};
|
|
6104
6296
|
gap: var(--spacing-sm);
|
|
6105
6297
|
`;
|
|
6106
|
-
var SearchAndFilterOutterControlWrapper = (gridColumns) =>
|
|
6298
|
+
var SearchAndFilterOutterControlWrapper = (gridColumns) => import_react67.css`
|
|
6107
6299
|
align-items: stretch;
|
|
6108
6300
|
display: grid;
|
|
6109
6301
|
grid-template-columns: ${gridColumns};
|
|
6110
6302
|
gap: var(--spacing-sm);
|
|
6111
6303
|
`;
|
|
6112
|
-
var ConditionalFilterRow =
|
|
6304
|
+
var ConditionalFilterRow = import_react67.css`
|
|
6113
6305
|
align-items: baseline;
|
|
6114
6306
|
display: grid;
|
|
6115
6307
|
grid-template-columns: 35px 1fr;
|
|
6116
6308
|
gap: var(--spacing-sm);
|
|
6117
6309
|
margin-left: var(--spacing-base);
|
|
6118
6310
|
|
|
6119
|
-
${(0,
|
|
6311
|
+
${(0, import_design_system42.cq)("380px")} {
|
|
6120
6312
|
&:after {
|
|
6121
6313
|
content: '';
|
|
6122
6314
|
display: block;
|
|
@@ -6135,22 +6327,22 @@ var ConditionalFilterRow = import_react63.css`
|
|
|
6135
6327
|
grid-template-columns: 50px 1fr;
|
|
6136
6328
|
}
|
|
6137
6329
|
|
|
6138
|
-
${(0,
|
|
6330
|
+
${(0, import_design_system42.cq)("580px")} {
|
|
6139
6331
|
&:after {
|
|
6140
6332
|
display: none;
|
|
6141
6333
|
}
|
|
6142
6334
|
}
|
|
6143
6335
|
|
|
6144
6336
|
@media (prefers-reduced-motion: no-preference) {
|
|
6145
|
-
animation: ${
|
|
6337
|
+
animation: ${import_design_system42.fadeInLtr} var(--duration-fast) var(--timing-ease-out);
|
|
6146
6338
|
}
|
|
6147
6339
|
`;
|
|
6148
|
-
var ConditionalInputRow =
|
|
6340
|
+
var ConditionalInputRow = import_react67.css`
|
|
6149
6341
|
display: flex;
|
|
6150
6342
|
gap: var(--spacing-sm);
|
|
6151
6343
|
flex-wrap: wrap;
|
|
6152
6344
|
|
|
6153
|
-
${(0,
|
|
6345
|
+
${(0, import_design_system42.cq)("380px")} {
|
|
6154
6346
|
& > div:nth-child(-n + 2) {
|
|
6155
6347
|
width: calc(50% - var(--spacing-sm));
|
|
6156
6348
|
}
|
|
@@ -6159,7 +6351,7 @@ var ConditionalInputRow = import_react63.css`
|
|
|
6159
6351
|
width: calc(100% - 48px);
|
|
6160
6352
|
}
|
|
6161
6353
|
}
|
|
6162
|
-
${(0,
|
|
6354
|
+
${(0, import_design_system42.cq)("764px")} {
|
|
6163
6355
|
align-items: flex-start;
|
|
6164
6356
|
display: grid;
|
|
6165
6357
|
grid-template-columns: 250px 160px 1fr 32px;
|
|
@@ -6169,16 +6361,16 @@ var ConditionalInputRow = import_react63.css`
|
|
|
6169
6361
|
}
|
|
6170
6362
|
}
|
|
6171
6363
|
`;
|
|
6172
|
-
var ConditionalInputRowEmpty =
|
|
6364
|
+
var ConditionalInputRowEmpty = import_react67.css`
|
|
6173
6365
|
flex-wrap: nowrap;
|
|
6174
6366
|
`;
|
|
6175
|
-
var SearchInput =
|
|
6367
|
+
var SearchInput = import_react67.css`
|
|
6176
6368
|
&& {
|
|
6177
6369
|
max-height: 40px;
|
|
6178
6370
|
min-height: unset;
|
|
6179
6371
|
}
|
|
6180
6372
|
`;
|
|
6181
|
-
var BindableKeywordSearchInputStyles =
|
|
6373
|
+
var BindableKeywordSearchInputStyles = import_react67.css`
|
|
6182
6374
|
position: relative;
|
|
6183
6375
|
width: 100%;
|
|
6184
6376
|
|
|
@@ -6193,19 +6385,19 @@ var BindableKeywordSearchInputStyles = import_react63.css`
|
|
|
6193
6385
|
white-space: nowrap;
|
|
6194
6386
|
}
|
|
6195
6387
|
`;
|
|
6196
|
-
var ClearSearchButtonContainer =
|
|
6388
|
+
var ClearSearchButtonContainer = import_react67.css`
|
|
6197
6389
|
align-items: center;
|
|
6198
6390
|
display: flex;
|
|
6199
6391
|
position: absolute;
|
|
6200
6392
|
inset: 0 var(--spacing-lg) 0 auto;
|
|
6201
6393
|
`;
|
|
6202
|
-
var ClearSearchButtonStyles =
|
|
6394
|
+
var ClearSearchButtonStyles = import_react67.css`
|
|
6203
6395
|
background: none;
|
|
6204
6396
|
border: none;
|
|
6205
6397
|
padding: 0;
|
|
6206
6398
|
pointer-events: all;
|
|
6207
6399
|
`;
|
|
6208
|
-
var FilterButton =
|
|
6400
|
+
var FilterButton = import_react67.css`
|
|
6209
6401
|
align-items: center;
|
|
6210
6402
|
background: var(--white);
|
|
6211
6403
|
border: 1px solid var(--gray-300);
|
|
@@ -6242,13 +6434,13 @@ var FilterButton = import_react63.css`
|
|
|
6242
6434
|
opacity: var(--opacity-50);
|
|
6243
6435
|
}
|
|
6244
6436
|
`;
|
|
6245
|
-
var FilterButtonText =
|
|
6437
|
+
var FilterButtonText = import_react67.css`
|
|
6246
6438
|
overflow: hidden;
|
|
6247
6439
|
text-overflow: ellipsis;
|
|
6248
6440
|
white-space: nowrap;
|
|
6249
6441
|
max-width: 14ch;
|
|
6250
6442
|
`;
|
|
6251
|
-
var FilterButtonSelected =
|
|
6443
|
+
var FilterButtonSelected = import_react67.css`
|
|
6252
6444
|
background: var(--gray-100);
|
|
6253
6445
|
border-color: var(--gray-300);
|
|
6254
6446
|
|
|
@@ -6256,7 +6448,7 @@ var FilterButtonSelected = import_react63.css`
|
|
|
6256
6448
|
color: var(--accent-dark);
|
|
6257
6449
|
}
|
|
6258
6450
|
`;
|
|
6259
|
-
var FilterButtonWithOptions =
|
|
6451
|
+
var FilterButtonWithOptions = import_react67.css`
|
|
6260
6452
|
:where([aria-expanded='true']) {
|
|
6261
6453
|
background: var(--purple-rain-100);
|
|
6262
6454
|
border-color: var(--accent-light);
|
|
@@ -6268,14 +6460,14 @@ var FilterButtonWithOptions = import_react63.css`
|
|
|
6268
6460
|
}
|
|
6269
6461
|
}
|
|
6270
6462
|
`;
|
|
6271
|
-
var SearchIcon =
|
|
6463
|
+
var SearchIcon = import_react67.css`
|
|
6272
6464
|
color: var(--icon-color);
|
|
6273
6465
|
position: absolute;
|
|
6274
6466
|
inset: 0 var(--spacing-base) 0 auto;
|
|
6275
6467
|
margin: auto;
|
|
6276
6468
|
transition: color var(--duration-fast) var(--timing-ease-out);
|
|
6277
6469
|
`;
|
|
6278
|
-
var AddConditionalBtn =
|
|
6470
|
+
var AddConditionalBtn = import_react67.css`
|
|
6279
6471
|
align-items: center;
|
|
6280
6472
|
background: transparent;
|
|
6281
6473
|
border: none;
|
|
@@ -6294,14 +6486,14 @@ var AddConditionalBtn = import_react63.css`
|
|
|
6294
6486
|
color: var(--gray-400);
|
|
6295
6487
|
}
|
|
6296
6488
|
`;
|
|
6297
|
-
var Title =
|
|
6489
|
+
var Title = import_react67.css`
|
|
6298
6490
|
color: var(--typography-light);
|
|
6299
6491
|
|
|
6300
6492
|
&:focus {
|
|
6301
6493
|
outline: none;
|
|
6302
6494
|
}
|
|
6303
6495
|
`;
|
|
6304
|
-
var ResetConditionsBtn =
|
|
6496
|
+
var ResetConditionsBtn = import_react67.css`
|
|
6305
6497
|
background: transparent;
|
|
6306
6498
|
border: none;
|
|
6307
6499
|
color: var(--action-destructive-default);
|
|
@@ -6316,13 +6508,13 @@ var ResetConditionsBtn = import_react63.css`
|
|
|
6316
6508
|
color: var(--gray-400);
|
|
6317
6509
|
}
|
|
6318
6510
|
`;
|
|
6319
|
-
var IconBtn =
|
|
6511
|
+
var IconBtn = import_react67.css`
|
|
6320
6512
|
align-self: center;
|
|
6321
6513
|
background: transparent;
|
|
6322
6514
|
border: none;
|
|
6323
6515
|
padding: var(--spacing-sm);
|
|
6324
6516
|
`;
|
|
6325
|
-
var SearchAndFilterOptionsContainer =
|
|
6517
|
+
var SearchAndFilterOptionsContainer = import_react67.css`
|
|
6326
6518
|
background: var(--gray-50);
|
|
6327
6519
|
border: 1px solid var(--gray-300);
|
|
6328
6520
|
border-radius: var(--rounded-base);
|
|
@@ -6333,17 +6525,17 @@ var SearchAndFilterOptionsContainer = import_react63.css`
|
|
|
6333
6525
|
padding: var(--spacing-md) 0 var(--spacing-base);
|
|
6334
6526
|
will-change: height;
|
|
6335
6527
|
`;
|
|
6336
|
-
var SearchAndFilterOptionsInnerContainer =
|
|
6528
|
+
var SearchAndFilterOptionsInnerContainer = import_react67.css`
|
|
6337
6529
|
display: flex;
|
|
6338
6530
|
flex-direction: column;
|
|
6339
6531
|
gap: var(--spacing-sm);
|
|
6340
6532
|
padding-inline: var(--spacing-md);
|
|
6341
6533
|
`;
|
|
6342
|
-
var SearchAndFilterButtonGroup =
|
|
6534
|
+
var SearchAndFilterButtonGroup = import_react67.css`
|
|
6343
6535
|
margin-top: var(--spacing-xs);
|
|
6344
6536
|
margin-left: calc(56px + var(--spacing-md));
|
|
6345
6537
|
`;
|
|
6346
|
-
var SearchAndFilterAdditionalContainer =
|
|
6538
|
+
var SearchAndFilterAdditionalContainer = import_react67.css`
|
|
6347
6539
|
align-items: center;
|
|
6348
6540
|
border-top: 1px solid var(--gray-300);
|
|
6349
6541
|
display: flex;
|
|
@@ -6353,17 +6545,17 @@ var SearchAndFilterAdditionalContainer = import_react63.css`
|
|
|
6353
6545
|
`;
|
|
6354
6546
|
|
|
6355
6547
|
// src/components/SearchAndFilter/FilterButton.tsx
|
|
6356
|
-
var
|
|
6548
|
+
var import_jsx_runtime72 = require("@emotion/react/jsx-runtime");
|
|
6357
6549
|
var FilterButton2 = ({
|
|
6358
6550
|
text = "Filters",
|
|
6359
|
-
icon =
|
|
6551
|
+
icon = import_design_system43.customIcons["filter-add"],
|
|
6360
6552
|
filterCount,
|
|
6361
6553
|
hasSelectedValue,
|
|
6362
6554
|
dataTestId,
|
|
6363
6555
|
showDropdownIcon,
|
|
6364
6556
|
...props
|
|
6365
6557
|
}) => {
|
|
6366
|
-
return /* @__PURE__ */ (0,
|
|
6558
|
+
return /* @__PURE__ */ (0, import_jsx_runtime72.jsxs)(
|
|
6367
6559
|
"button",
|
|
6368
6560
|
{
|
|
6369
6561
|
type: "button",
|
|
@@ -6375,10 +6567,10 @@ var FilterButton2 = ({
|
|
|
6375
6567
|
...props,
|
|
6376
6568
|
"data-testid": dataTestId,
|
|
6377
6569
|
children: [
|
|
6378
|
-
/* @__PURE__ */ (0,
|
|
6379
|
-
/* @__PURE__ */ (0,
|
|
6380
|
-
filterCount ? /* @__PURE__ */ (0,
|
|
6381
|
-
showDropdownIcon ? /* @__PURE__ */ (0,
|
|
6570
|
+
/* @__PURE__ */ (0, import_jsx_runtime72.jsx)(import_design_system43.Icon, { icon, iconColor: "currentColor", size: "1rem" }),
|
|
6571
|
+
/* @__PURE__ */ (0, import_jsx_runtime72.jsx)("span", { css: FilterButtonText, children: text }),
|
|
6572
|
+
filterCount ? /* @__PURE__ */ (0, import_jsx_runtime72.jsx)(import_design_system43.Counter, { count: filterCount, bgColor: "var(--white)" }) : null,
|
|
6573
|
+
showDropdownIcon ? /* @__PURE__ */ (0, import_jsx_runtime72.jsx)(import_design_system43.Icon, { icon: "chevron-down", iconColor: "currentColor", size: "1rem" }) : null
|
|
6382
6574
|
]
|
|
6383
6575
|
}
|
|
6384
6576
|
);
|
|
@@ -6387,25 +6579,25 @@ var FilterButton2 = ({
|
|
|
6387
6579
|
// src/components/SearchAndFilter/FilterControls.tsx
|
|
6388
6580
|
var import_CgClose = require("@react-icons/all-files/cg/CgClose");
|
|
6389
6581
|
var import_canvas10 = require("@uniformdev/canvas");
|
|
6390
|
-
var
|
|
6582
|
+
var import_design_system45 = require("@uniformdev/design-system");
|
|
6391
6583
|
var import_lexical11 = require("lexical");
|
|
6392
|
-
var
|
|
6584
|
+
var import_react69 = require("react");
|
|
6393
6585
|
var import_react_use7 = require("react-use");
|
|
6394
6586
|
var import_uuid2 = require("uuid");
|
|
6395
6587
|
|
|
6396
6588
|
// src/components/SearchAndFilter/hooks/useSearchAndFilter.tsx
|
|
6397
|
-
var
|
|
6398
|
-
var
|
|
6589
|
+
var import_design_system44 = require("@uniformdev/design-system");
|
|
6590
|
+
var import_react68 = require("react");
|
|
6399
6591
|
|
|
6400
6592
|
// src/components/SearchAndFilter/FilterEditor.tsx
|
|
6401
|
-
var
|
|
6593
|
+
var import_jsx_runtime73 = require("@emotion/react/jsx-runtime");
|
|
6402
6594
|
var FilterEditorRenderer = ({ editorType, ...props }) => {
|
|
6403
6595
|
const { filterMapper: contextFilterMapper } = useSearchAndFilter();
|
|
6404
6596
|
const Editor = contextFilterMapper == null ? void 0 : contextFilterMapper[editorType];
|
|
6405
6597
|
if (!Editor || editorType === "empty") {
|
|
6406
|
-
return /* @__PURE__ */ (0,
|
|
6598
|
+
return /* @__PURE__ */ (0, import_jsx_runtime73.jsx)("span", {});
|
|
6407
6599
|
}
|
|
6408
|
-
return /* @__PURE__ */ (0,
|
|
6600
|
+
return /* @__PURE__ */ (0, import_jsx_runtime73.jsx)(Editor, { ...props });
|
|
6409
6601
|
};
|
|
6410
6602
|
var filterMapper = {
|
|
6411
6603
|
multiChoice: FilterMultiChoiceEditor,
|
|
@@ -6423,9 +6615,9 @@ var filterMapper = {
|
|
|
6423
6615
|
function withInputVariables(WrappedComponent, noSwapping = false) {
|
|
6424
6616
|
const WithInputVariables = (props) => {
|
|
6425
6617
|
if (Array.isArray(props.value) || !props.bindable || props.disabled || props.readOnly) {
|
|
6426
|
-
return /* @__PURE__ */ (0,
|
|
6618
|
+
return /* @__PURE__ */ (0, import_jsx_runtime73.jsx)(WrappedComponent, { ...props });
|
|
6427
6619
|
}
|
|
6428
|
-
return /* @__PURE__ */ (0,
|
|
6620
|
+
return /* @__PURE__ */ (0, import_jsx_runtime73.jsx)(
|
|
6429
6621
|
InputVariables,
|
|
6430
6622
|
{
|
|
6431
6623
|
"data-testid": "filter-value",
|
|
@@ -6434,7 +6626,7 @@ function withInputVariables(WrappedComponent, noSwapping = false) {
|
|
|
6434
6626
|
onChange: (newValue) => props.onChange(newValue != null ? newValue : ""),
|
|
6435
6627
|
value: props.value,
|
|
6436
6628
|
disabled: props.disabled,
|
|
6437
|
-
inputWhenNoVariables: noSwapping ? void 0 : /* @__PURE__ */ (0,
|
|
6629
|
+
inputWhenNoVariables: noSwapping ? void 0 : /* @__PURE__ */ (0, import_jsx_runtime73.jsx)(WrappedComponent, { ...props })
|
|
6438
6630
|
}
|
|
6439
6631
|
);
|
|
6440
6632
|
};
|
|
@@ -6444,9 +6636,9 @@ function withInputVariablesForMultiValue(WrappedComponent) {
|
|
|
6444
6636
|
const WithInputVariables = (props) => {
|
|
6445
6637
|
var _a;
|
|
6446
6638
|
if (!props.bindable || props.disabled || props.readOnly) {
|
|
6447
|
-
return /* @__PURE__ */ (0,
|
|
6639
|
+
return /* @__PURE__ */ (0, import_jsx_runtime73.jsx)(WrappedComponent, { ...props });
|
|
6448
6640
|
}
|
|
6449
|
-
return /* @__PURE__ */ (0,
|
|
6641
|
+
return /* @__PURE__ */ (0, import_jsx_runtime73.jsx)(
|
|
6450
6642
|
InputVariables,
|
|
6451
6643
|
{
|
|
6452
6644
|
"data-testid": "filter-value",
|
|
@@ -6454,7 +6646,7 @@ function withInputVariablesForMultiValue(WrappedComponent) {
|
|
|
6454
6646
|
showMenuPosition: "inline-right",
|
|
6455
6647
|
onChange: (newValue) => props.onChange(newValue ? [newValue] : []),
|
|
6456
6648
|
value: (_a = props.value) == null ? void 0 : _a[0],
|
|
6457
|
-
inputWhenNoVariables: /* @__PURE__ */ (0,
|
|
6649
|
+
inputWhenNoVariables: /* @__PURE__ */ (0, import_jsx_runtime73.jsx)(WrappedComponent, { ...props })
|
|
6458
6650
|
}
|
|
6459
6651
|
);
|
|
6460
6652
|
};
|
|
@@ -6470,8 +6662,8 @@ var bindableFiltersMapper = {
|
|
|
6470
6662
|
};
|
|
6471
6663
|
|
|
6472
6664
|
// src/components/SearchAndFilter/hooks/useSearchAndFilter.tsx
|
|
6473
|
-
var
|
|
6474
|
-
var SearchAndFilterContext = (0,
|
|
6665
|
+
var import_jsx_runtime74 = require("@emotion/react/jsx-runtime");
|
|
6666
|
+
var SearchAndFilterContext = (0, import_react68.createContext)({
|
|
6475
6667
|
searchTerm: "",
|
|
6476
6668
|
setSearchTerm: () => {
|
|
6477
6669
|
},
|
|
@@ -6491,6 +6683,7 @@ var SearchAndFilterContext = (0, import_react64.createContext)({
|
|
|
6491
6683
|
validFilterQuery: [],
|
|
6492
6684
|
filterMapper: {},
|
|
6493
6685
|
totalResults: 0,
|
|
6686
|
+
isLoading: false,
|
|
6494
6687
|
allowBindingSearchTerm: false
|
|
6495
6688
|
});
|
|
6496
6689
|
var SearchAndFilterProvider = ({
|
|
@@ -6504,21 +6697,22 @@ var SearchAndFilterProvider = ({
|
|
|
6504
6697
|
resetFilterValues = [{ field: "", operator: "", value: "" }],
|
|
6505
6698
|
onResetFilterValues,
|
|
6506
6699
|
totalResults,
|
|
6700
|
+
isLoading,
|
|
6507
6701
|
filterMapper: filterMapper2 = filterMapper,
|
|
6508
6702
|
children,
|
|
6509
6703
|
allowBindingSearchTerm
|
|
6510
6704
|
}) => {
|
|
6511
|
-
const [searchTerm, setSearchTerm] = (0,
|
|
6512
|
-
const deferredSearchTerm = (0,
|
|
6513
|
-
const [filterVisibility, setFilterVisibility] = (0,
|
|
6514
|
-
const handleSearchTerm = (0,
|
|
6705
|
+
const [searchTerm, setSearchTerm] = (0, import_react68.useState)(defaultSearchTerm);
|
|
6706
|
+
const deferredSearchTerm = (0, import_react68.useDeferredValue)(searchTerm);
|
|
6707
|
+
const [filterVisibility, setFilterVisibility] = (0, import_react68.useState)(alwaysVisible || filterVisible);
|
|
6708
|
+
const handleSearchTerm = (0, import_react68.useCallback)(
|
|
6515
6709
|
(term) => {
|
|
6516
6710
|
setSearchTerm(term);
|
|
6517
6711
|
onSearchChange == null ? void 0 : onSearchChange(term);
|
|
6518
6712
|
},
|
|
6519
6713
|
[setSearchTerm, onSearchChange]
|
|
6520
6714
|
);
|
|
6521
|
-
const handleToggleFilterVisibility = (0,
|
|
6715
|
+
const handleToggleFilterVisibility = (0, import_react68.useCallback)(
|
|
6522
6716
|
(visible) => {
|
|
6523
6717
|
if (alwaysVisible) {
|
|
6524
6718
|
return;
|
|
@@ -6527,30 +6721,31 @@ var SearchAndFilterProvider = ({
|
|
|
6527
6721
|
},
|
|
6528
6722
|
[alwaysVisible]
|
|
6529
6723
|
);
|
|
6530
|
-
const handleAddFilter = (0,
|
|
6724
|
+
const handleAddFilter = (0, import_react68.useCallback)(() => {
|
|
6531
6725
|
onChange([...filters, { field: "", operator: "", value: "" }]);
|
|
6532
6726
|
}, [filters, onChange]);
|
|
6533
|
-
const handleResetFilters = (0,
|
|
6727
|
+
const handleResetFilters = (0, import_react68.useCallback)(() => {
|
|
6728
|
+
setSearchTerm("");
|
|
6534
6729
|
if (onResetFilterValues) {
|
|
6535
6730
|
return onResetFilterValues();
|
|
6536
6731
|
}
|
|
6537
6732
|
onSearchChange == null ? void 0 : onSearchChange("");
|
|
6538
6733
|
onChange(resetFilterValues);
|
|
6539
6734
|
}, [onChange, resetFilterValues, onSearchChange, onResetFilterValues]);
|
|
6540
|
-
const handleDeleteFilter = (0,
|
|
6735
|
+
const handleDeleteFilter = (0, import_react68.useCallback)(
|
|
6541
6736
|
(index) => {
|
|
6542
6737
|
const remainingFilters = filters.filter((_, i) => i !== index);
|
|
6543
6738
|
onChange(remainingFilters);
|
|
6544
6739
|
},
|
|
6545
6740
|
[filters, onChange]
|
|
6546
6741
|
);
|
|
6547
|
-
const validFilterQuery = (0,
|
|
6742
|
+
const validFilterQuery = (0, import_react68.useMemo)(() => {
|
|
6548
6743
|
const hasValidFilters = filters.every((f) => f.field && f.operator && f.value);
|
|
6549
6744
|
if (hasValidFilters) {
|
|
6550
6745
|
return filters;
|
|
6551
6746
|
}
|
|
6552
6747
|
}, [filters]);
|
|
6553
|
-
(0,
|
|
6748
|
+
(0, import_react68.useEffect)(() => {
|
|
6554
6749
|
if (filterVisibility) {
|
|
6555
6750
|
const handleEscKeyFilterClose = (e) => {
|
|
6556
6751
|
if (e.key === "Escape") {
|
|
@@ -6563,7 +6758,7 @@ var SearchAndFilterProvider = ({
|
|
|
6563
6758
|
};
|
|
6564
6759
|
}
|
|
6565
6760
|
}, [filterVisibility, handleToggleFilterVisibility]);
|
|
6566
|
-
return /* @__PURE__ */ (0,
|
|
6761
|
+
return /* @__PURE__ */ (0, import_jsx_runtime74.jsx)(
|
|
6567
6762
|
SearchAndFilterContext.Provider,
|
|
6568
6763
|
{
|
|
6569
6764
|
value: {
|
|
@@ -6579,20 +6774,21 @@ var SearchAndFilterProvider = ({
|
|
|
6579
6774
|
filterOptions,
|
|
6580
6775
|
validFilterQuery,
|
|
6581
6776
|
totalResults,
|
|
6777
|
+
isLoading,
|
|
6582
6778
|
filterMapper: filterMapper2,
|
|
6583
6779
|
allowBindingSearchTerm
|
|
6584
6780
|
},
|
|
6585
|
-
children: /* @__PURE__ */ (0,
|
|
6781
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime74.jsx)(import_design_system44.VerticalRhythm, { children })
|
|
6586
6782
|
}
|
|
6587
6783
|
);
|
|
6588
6784
|
};
|
|
6589
6785
|
var useSearchAndFilter = () => {
|
|
6590
|
-
const value = (0,
|
|
6786
|
+
const value = (0, import_react68.useContext)(SearchAndFilterContext);
|
|
6591
6787
|
return { ...value };
|
|
6592
6788
|
};
|
|
6593
6789
|
|
|
6594
6790
|
// src/components/SearchAndFilter/FilterControls.tsx
|
|
6595
|
-
var
|
|
6791
|
+
var import_jsx_runtime75 = require("@emotion/react/jsx-runtime");
|
|
6596
6792
|
var FilterControls = ({
|
|
6597
6793
|
children,
|
|
6598
6794
|
hideSearchInput
|
|
@@ -6605,10 +6801,10 @@ var FilterControls = ({
|
|
|
6605
6801
|
searchTerm,
|
|
6606
6802
|
allowBindingSearchTerm
|
|
6607
6803
|
} = useSearchAndFilter();
|
|
6608
|
-
const editorRef = (0,
|
|
6804
|
+
const editorRef = (0, import_react69.useRef)(null);
|
|
6609
6805
|
const variableRefernceCountInSearchTerm = (0, import_canvas10.hasReferencedVariables)(searchTerm);
|
|
6610
|
-
const [idToResetInputVariables, setIdToResetInputVariables] = (0,
|
|
6611
|
-
const [localSearchTerm, setLocalSearchTerm] = (0,
|
|
6806
|
+
const [idToResetInputVariables, setIdToResetInputVariables] = (0, import_react69.useState)("data-resource-search-term-input");
|
|
6807
|
+
const [localSearchTerm, setLocalSearchTerm] = (0, import_react69.useState)(searchTerm);
|
|
6612
6808
|
(0, import_react_use7.useDebounce)(
|
|
6613
6809
|
() => {
|
|
6614
6810
|
setSearchTerm(localSearchTerm);
|
|
@@ -6616,14 +6812,14 @@ var FilterControls = ({
|
|
|
6616
6812
|
300,
|
|
6617
6813
|
[localSearchTerm]
|
|
6618
6814
|
);
|
|
6619
|
-
(0,
|
|
6815
|
+
(0, import_react69.useEffect)(() => {
|
|
6620
6816
|
if (searchTerm === "") {
|
|
6621
6817
|
setLocalSearchTerm("");
|
|
6622
6818
|
setIdToResetInputVariables(`data-resource-search-term-input-${(0, import_uuid2.v4)()}`);
|
|
6623
6819
|
}
|
|
6624
6820
|
}, [searchTerm]);
|
|
6625
|
-
return /* @__PURE__ */ (0,
|
|
6626
|
-
/* @__PURE__ */ (0,
|
|
6821
|
+
return /* @__PURE__ */ (0, import_jsx_runtime75.jsxs)(import_jsx_runtime75.Fragment, { children: [
|
|
6822
|
+
/* @__PURE__ */ (0, import_jsx_runtime75.jsx)(
|
|
6627
6823
|
FilterButton2,
|
|
6628
6824
|
{
|
|
6629
6825
|
"aria-controls": "search-and-filter-options",
|
|
@@ -6636,8 +6832,8 @@ var FilterControls = ({
|
|
|
6636
6832
|
dataTestId: "filters-button"
|
|
6637
6833
|
}
|
|
6638
6834
|
),
|
|
6639
|
-
hideSearchInput ? null : /* @__PURE__ */ (0,
|
|
6640
|
-
/* @__PURE__ */ (0,
|
|
6835
|
+
hideSearchInput ? null : /* @__PURE__ */ (0, import_jsx_runtime75.jsxs)("div", { css: BindableKeywordSearchInputStyles, "data-testid": "search-container", children: [
|
|
6836
|
+
/* @__PURE__ */ (0, import_jsx_runtime75.jsx)(
|
|
6641
6837
|
InputVariables,
|
|
6642
6838
|
{
|
|
6643
6839
|
label: "",
|
|
@@ -6647,8 +6843,8 @@ var FilterControls = ({
|
|
|
6647
6843
|
value: localSearchTerm,
|
|
6648
6844
|
onChange: (value) => setLocalSearchTerm(value != null ? value : ""),
|
|
6649
6845
|
disableVariables: !allowBindingSearchTerm,
|
|
6650
|
-
inputWhenNoVariables: /* @__PURE__ */ (0,
|
|
6651
|
-
|
|
6846
|
+
inputWhenNoVariables: /* @__PURE__ */ (0, import_jsx_runtime75.jsx)(
|
|
6847
|
+
import_design_system45.InputKeywordSearch,
|
|
6652
6848
|
{
|
|
6653
6849
|
placeholder: "Search...",
|
|
6654
6850
|
onSearchTextChanged: (e) => setLocalSearchTerm(e),
|
|
@@ -6666,7 +6862,7 @@ var FilterControls = ({
|
|
|
6666
6862
|
)
|
|
6667
6863
|
}
|
|
6668
6864
|
),
|
|
6669
|
-
variableRefernceCountInSearchTerm ? /* @__PURE__ */ (0,
|
|
6865
|
+
variableRefernceCountInSearchTerm ? /* @__PURE__ */ (0, import_jsx_runtime75.jsx)("div", { css: ClearSearchButtonContainer, children: /* @__PURE__ */ (0, import_jsx_runtime75.jsx)(
|
|
6670
6866
|
"button",
|
|
6671
6867
|
{
|
|
6672
6868
|
css: ClearSearchButtonStyles,
|
|
@@ -6680,7 +6876,7 @@ var FilterControls = ({
|
|
|
6680
6876
|
},
|
|
6681
6877
|
type: "button",
|
|
6682
6878
|
"data-testid": "keyword-search-clear-button",
|
|
6683
|
-
children: /* @__PURE__ */ (0,
|
|
6879
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime75.jsx)(import_design_system45.Icon, { icon: import_CgClose.CgClose, iconColor: "red", size: "1rem" })
|
|
6684
6880
|
}
|
|
6685
6881
|
) }) : null
|
|
6686
6882
|
] }),
|
|
@@ -6690,8 +6886,8 @@ var FilterControls = ({
|
|
|
6690
6886
|
|
|
6691
6887
|
// src/components/SearchAndFilter/FilterItem.tsx
|
|
6692
6888
|
var import_CgTrash2 = require("@react-icons/all-files/cg/CgTrash");
|
|
6693
|
-
var
|
|
6694
|
-
var
|
|
6889
|
+
var import_design_system46 = require("@uniformdev/design-system");
|
|
6890
|
+
var import_react70 = require("react");
|
|
6695
6891
|
|
|
6696
6892
|
// src/components/SearchAndFilter/util/isFilterBindable.ts
|
|
6697
6893
|
function isFilterBindable(filter, operator) {
|
|
@@ -6700,7 +6896,7 @@ function isFilterBindable(filter, operator) {
|
|
|
6700
6896
|
}
|
|
6701
6897
|
|
|
6702
6898
|
// src/components/SearchAndFilter/FilterItem.tsx
|
|
6703
|
-
var
|
|
6899
|
+
var import_jsx_runtime76 = require("@emotion/react/jsx-runtime");
|
|
6704
6900
|
var FilterItem = ({
|
|
6705
6901
|
index,
|
|
6706
6902
|
operatorOptions,
|
|
@@ -6718,7 +6914,7 @@ var FilterItem = ({
|
|
|
6718
6914
|
const operatorLabel = filters[index].operator !== "" ? `operator ${filters[index].operator}` : "unknown operator";
|
|
6719
6915
|
const metaDataLabel = filters[index].value !== "" ? `value ${filters[index].value}` : "unknown value";
|
|
6720
6916
|
const metaDataPossibleOptions = (_b = (_a = operatorOptions.find((op) => filters[index].operator === op.value)) == null ? void 0 : _a.editorType) != null ? _b : "singleChoice";
|
|
6721
|
-
const { selectedFieldValue, selectedOperatorValue, selectedMetaValue, readOnly, bindable } = (0,
|
|
6917
|
+
const { selectedFieldValue, selectedOperatorValue, selectedMetaValue, readOnly, bindable } = (0, import_react70.useMemo)(() => {
|
|
6722
6918
|
var _a2;
|
|
6723
6919
|
const currentSelectedFilterGroup = filterOptions.find((item) => {
|
|
6724
6920
|
var _a3;
|
|
@@ -6748,10 +6944,10 @@ var FilterItem = ({
|
|
|
6748
6944
|
} : {};
|
|
6749
6945
|
const CustomLeftHandComponent = selectedFieldValue == null ? void 0 : selectedFieldValue.leftHandSideComponentWhenSelected;
|
|
6750
6946
|
const isEmptyOperator = metaDataPossibleOptions === "empty";
|
|
6751
|
-
return /* @__PURE__ */ (0,
|
|
6752
|
-
/* @__PURE__ */ (0,
|
|
6753
|
-
/* @__PURE__ */ (0,
|
|
6754
|
-
CustomLeftHandComponent ? /* @__PURE__ */ (0,
|
|
6947
|
+
return /* @__PURE__ */ (0, import_jsx_runtime76.jsxs)("div", { css: ConditionalFilterRow, "data-testid": "filter-item", children: [
|
|
6948
|
+
/* @__PURE__ */ (0, import_jsx_runtime76.jsx)("span", { children: index === 0 ? initialCriteriaTitle : criteriaGroupOperator }),
|
|
6949
|
+
/* @__PURE__ */ (0, import_jsx_runtime76.jsxs)("div", { css: [ConditionalInputRow, isEmptyOperator ? ConditionalInputRowEmpty : null], children: [
|
|
6950
|
+
CustomLeftHandComponent ? /* @__PURE__ */ (0, import_jsx_runtime76.jsx)(
|
|
6755
6951
|
CustomLeftHandComponent,
|
|
6756
6952
|
{
|
|
6757
6953
|
filterOption: selectedFieldValue,
|
|
@@ -6761,8 +6957,8 @@ var FilterItem = ({
|
|
|
6761
6957
|
onFilterOptionChange("");
|
|
6762
6958
|
}
|
|
6763
6959
|
}
|
|
6764
|
-
) : /* @__PURE__ */ (0,
|
|
6765
|
-
|
|
6960
|
+
) : /* @__PURE__ */ (0, import_jsx_runtime76.jsx)(
|
|
6961
|
+
import_design_system46.InputComboBox,
|
|
6766
6962
|
{
|
|
6767
6963
|
"aria-label": label,
|
|
6768
6964
|
options: filterOptions,
|
|
@@ -6788,8 +6984,8 @@ var FilterItem = ({
|
|
|
6788
6984
|
name: `filter-field-${index}`
|
|
6789
6985
|
}
|
|
6790
6986
|
),
|
|
6791
|
-
/* @__PURE__ */ (0,
|
|
6792
|
-
|
|
6987
|
+
/* @__PURE__ */ (0, import_jsx_runtime76.jsx)(
|
|
6988
|
+
import_design_system46.InputComboBox,
|
|
6793
6989
|
{
|
|
6794
6990
|
"aria-label": operatorLabel,
|
|
6795
6991
|
options: operatorOptions,
|
|
@@ -6812,7 +7008,7 @@ var FilterItem = ({
|
|
|
6812
7008
|
name: `filter-operator-${index}`
|
|
6813
7009
|
}
|
|
6814
7010
|
),
|
|
6815
|
-
/* @__PURE__ */ (0,
|
|
7011
|
+
/* @__PURE__ */ (0, import_jsx_runtime76.jsx)(
|
|
6816
7012
|
FilterEditorRenderer,
|
|
6817
7013
|
{
|
|
6818
7014
|
"aria-label": metaDataLabel,
|
|
@@ -6827,7 +7023,7 @@ var FilterItem = ({
|
|
|
6827
7023
|
filterFieldName: filters[index].field
|
|
6828
7024
|
}
|
|
6829
7025
|
),
|
|
6830
|
-
readOnly ? null : /* @__PURE__ */ (0,
|
|
7026
|
+
readOnly ? null : /* @__PURE__ */ (0, import_jsx_runtime76.jsx)(
|
|
6831
7027
|
"button",
|
|
6832
7028
|
{
|
|
6833
7029
|
type: "button",
|
|
@@ -6836,7 +7032,7 @@ var FilterItem = ({
|
|
|
6836
7032
|
css: IconBtn,
|
|
6837
7033
|
"data-testid": "delete-filter",
|
|
6838
7034
|
disabled: filters.length === 1,
|
|
6839
|
-
children: /* @__PURE__ */ (0,
|
|
7035
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime76.jsx)(import_design_system46.Icon, { icon: import_CgTrash2.CgTrash, iconColor: filters.length === 1 ? "gray" : "red", size: "1rem" })
|
|
6840
7036
|
}
|
|
6841
7037
|
)
|
|
6842
7038
|
] })
|
|
@@ -6845,21 +7041,21 @@ var FilterItem = ({
|
|
|
6845
7041
|
|
|
6846
7042
|
// src/components/SearchAndFilter/FilterItems.tsx
|
|
6847
7043
|
var import_CgMathPlus = require("@react-icons/all-files/cg/CgMathPlus");
|
|
6848
|
-
var
|
|
7044
|
+
var import_design_system48 = require("@uniformdev/design-system");
|
|
6849
7045
|
|
|
6850
7046
|
// src/components/SearchAndFilter/FilterMenu.tsx
|
|
6851
|
-
var
|
|
6852
|
-
var
|
|
6853
|
-
var
|
|
7047
|
+
var import_design_system47 = require("@uniformdev/design-system");
|
|
7048
|
+
var import_react71 = __toESM(require("react"));
|
|
7049
|
+
var import_jsx_runtime77 = require("@emotion/react/jsx-runtime");
|
|
6854
7050
|
var SearchAndFilterOptionsContainer2 = ({
|
|
6855
7051
|
buttonRow,
|
|
6856
7052
|
additionalFiltersContainer,
|
|
6857
7053
|
children
|
|
6858
7054
|
}) => {
|
|
6859
|
-
return /* @__PURE__ */ (0,
|
|
6860
|
-
/* @__PURE__ */ (0,
|
|
6861
|
-
buttonRow ? /* @__PURE__ */ (0,
|
|
6862
|
-
|
|
7055
|
+
return /* @__PURE__ */ (0, import_jsx_runtime77.jsxs)("div", { css: SearchAndFilterOptionsContainer, children: [
|
|
7056
|
+
/* @__PURE__ */ (0, import_jsx_runtime77.jsx)("div", { css: SearchAndFilterOptionsInnerContainer, children }),
|
|
7057
|
+
buttonRow ? /* @__PURE__ */ (0, import_jsx_runtime77.jsx)(
|
|
7058
|
+
import_design_system47.HorizontalRhythm,
|
|
6863
7059
|
{
|
|
6864
7060
|
css: SearchAndFilterButtonGroup,
|
|
6865
7061
|
gap: "sm",
|
|
@@ -6868,7 +7064,7 @@ var SearchAndFilterOptionsContainer2 = ({
|
|
|
6868
7064
|
children: buttonRow
|
|
6869
7065
|
}
|
|
6870
7066
|
) : null,
|
|
6871
|
-
additionalFiltersContainer ? /* @__PURE__ */ (0,
|
|
7067
|
+
additionalFiltersContainer ? /* @__PURE__ */ (0, import_jsx_runtime77.jsx)("div", { css: SearchAndFilterAdditionalContainer, children: additionalFiltersContainer }) : null
|
|
6872
7068
|
] });
|
|
6873
7069
|
};
|
|
6874
7070
|
var FilterMenu = ({
|
|
@@ -6881,22 +7077,22 @@ var FilterMenu = ({
|
|
|
6881
7077
|
resetButtonText = "reset"
|
|
6882
7078
|
}) => {
|
|
6883
7079
|
const { filterVisibility, setFilterVisibility, handleResetFilters, filters } = useSearchAndFilter();
|
|
6884
|
-
const innerMenuRef =
|
|
6885
|
-
(0,
|
|
7080
|
+
const innerMenuRef = import_react71.default.useRef(null);
|
|
7081
|
+
(0, import_react71.useEffect)(() => {
|
|
6886
7082
|
var _a;
|
|
6887
7083
|
if (filterVisibility) {
|
|
6888
7084
|
(_a = innerMenuRef.current) == null ? void 0 : _a.focus();
|
|
6889
7085
|
}
|
|
6890
7086
|
}, [filterVisibility]);
|
|
6891
|
-
return /* @__PURE__ */ (0,
|
|
7087
|
+
return /* @__PURE__ */ (0, import_jsx_runtime77.jsx)(import_design_system47.VerticalRhythm, { gap: "sm", "aria-haspopup": "true", id, "data-testid": dataTestId, children: filterVisibility ? /* @__PURE__ */ (0, import_jsx_runtime77.jsxs)(
|
|
6892
7088
|
SearchAndFilterOptionsContainer2,
|
|
6893
7089
|
{
|
|
6894
7090
|
buttonRow: menuControls,
|
|
6895
7091
|
additionalFiltersContainer,
|
|
6896
7092
|
children: [
|
|
6897
|
-
/* @__PURE__ */ (0,
|
|
6898
|
-
filterTitle ? /* @__PURE__ */ (0,
|
|
6899
|
-
(filters == null ? void 0 : filters.length) && resetButtonText ? /* @__PURE__ */ (0,
|
|
7093
|
+
/* @__PURE__ */ (0, import_jsx_runtime77.jsxs)(import_design_system47.HorizontalRhythm, { gap: "sm", align: "center", justify: "space-between", children: [
|
|
7094
|
+
filterTitle ? /* @__PURE__ */ (0, import_jsx_runtime77.jsx)("span", { css: Title, ref: innerMenuRef, tabIndex: 0, children: filterTitle }) : null,
|
|
7095
|
+
(filters == null ? void 0 : filters.length) && resetButtonText ? /* @__PURE__ */ (0, import_jsx_runtime77.jsx)(
|
|
6900
7096
|
"button",
|
|
6901
7097
|
{
|
|
6902
7098
|
type: "button",
|
|
@@ -7007,7 +7203,7 @@ function hasBindings(currentValue) {
|
|
|
7007
7203
|
}
|
|
7008
7204
|
|
|
7009
7205
|
// src/components/SearchAndFilter/FilterItems.tsx
|
|
7010
|
-
var
|
|
7206
|
+
var import_jsx_runtime78 = require("@emotion/react/jsx-runtime");
|
|
7011
7207
|
var FilterItems = ({
|
|
7012
7208
|
addButtonText = "add condition",
|
|
7013
7209
|
additionalFiltersContainer,
|
|
@@ -7023,7 +7219,7 @@ var FilterItems = ({
|
|
|
7023
7219
|
next[index] = { ...next[index], [prop]: value };
|
|
7024
7220
|
if (prop === "operator") {
|
|
7025
7221
|
const newOperatorId = value;
|
|
7026
|
-
const currentFilter =
|
|
7222
|
+
const currentFilter = filters[index];
|
|
7027
7223
|
if (!newOperatorId) {
|
|
7028
7224
|
throw new Error("you bad");
|
|
7029
7225
|
}
|
|
@@ -7044,12 +7240,12 @@ var FilterItems = ({
|
|
|
7044
7240
|
}
|
|
7045
7241
|
setFilters(next);
|
|
7046
7242
|
};
|
|
7047
|
-
return /* @__PURE__ */ (0,
|
|
7243
|
+
return /* @__PURE__ */ (0, import_jsx_runtime78.jsx)(
|
|
7048
7244
|
FilterMenu,
|
|
7049
7245
|
{
|
|
7050
7246
|
id: "search-and-filter-options",
|
|
7051
7247
|
dataTestId: "search-and-filter-options",
|
|
7052
|
-
menuControls: /* @__PURE__ */ (0,
|
|
7248
|
+
menuControls: /* @__PURE__ */ (0, import_jsx_runtime78.jsxs)(
|
|
7053
7249
|
"button",
|
|
7054
7250
|
{
|
|
7055
7251
|
type: "button",
|
|
@@ -7057,7 +7253,7 @@ var FilterItems = ({
|
|
|
7057
7253
|
onClick: handleAddFilter,
|
|
7058
7254
|
"data-testid": "add-filter",
|
|
7059
7255
|
children: [
|
|
7060
|
-
/* @__PURE__ */ (0,
|
|
7256
|
+
/* @__PURE__ */ (0, import_jsx_runtime78.jsx)(import_design_system48.Icon, { icon: import_CgMathPlus.CgMathPlus, iconColor: "currentColor", size: "1rem" }),
|
|
7061
7257
|
addButtonText
|
|
7062
7258
|
]
|
|
7063
7259
|
}
|
|
@@ -7073,7 +7269,7 @@ var FilterItems = ({
|
|
|
7073
7269
|
})) == null ? void 0 : _a.options) != null ? _b : [];
|
|
7074
7270
|
const possibleValueOptions = (_d = (_c = availableTypeOptions == null ? void 0 : availableTypeOptions.find((op) => op.value === item.field)) == null ? void 0 : _c.valueOptions) != null ? _d : [];
|
|
7075
7271
|
const possibleOperators = (_f = (_e = availableTypeOptions == null ? void 0 : availableTypeOptions.find((op) => op.value === item.field)) == null ? void 0 : _e.operatorOptions) != null ? _f : [];
|
|
7076
|
-
return /* @__PURE__ */ (0,
|
|
7272
|
+
return /* @__PURE__ */ (0, import_jsx_runtime78.jsx)(
|
|
7077
7273
|
FilterItem,
|
|
7078
7274
|
{
|
|
7079
7275
|
index: i,
|
|
@@ -7094,11 +7290,11 @@ var FilterItems = ({
|
|
|
7094
7290
|
};
|
|
7095
7291
|
|
|
7096
7292
|
// src/components/SearchAndFilter/SearchAndFilter.tsx
|
|
7097
|
-
var
|
|
7293
|
+
var import_design_system50 = require("@uniformdev/design-system");
|
|
7098
7294
|
|
|
7099
7295
|
// src/components/SearchAndFilter/SearchAndFilterResultContainer.tsx
|
|
7100
|
-
var
|
|
7101
|
-
var
|
|
7296
|
+
var import_design_system49 = require("@uniformdev/design-system");
|
|
7297
|
+
var import_jsx_runtime79 = require("@emotion/react/jsx-runtime");
|
|
7102
7298
|
var SearchAndFilterResultContainer = ({
|
|
7103
7299
|
buttonText,
|
|
7104
7300
|
clearButtonLabel = "clear",
|
|
@@ -7107,7 +7303,7 @@ var SearchAndFilterResultContainer = ({
|
|
|
7107
7303
|
onHandleClear,
|
|
7108
7304
|
hideClearButton
|
|
7109
7305
|
}) => {
|
|
7110
|
-
const { searchTerm, totalResults, filters, handleResetFilters, setSearchTerm } = useSearchAndFilter();
|
|
7306
|
+
const { searchTerm, totalResults, filters, handleResetFilters, setSearchTerm, isLoading } = useSearchAndFilter();
|
|
7111
7307
|
const emptyFilters = filters.length === 0 || filters.every((filter) => !filter.value);
|
|
7112
7308
|
const getTextValue = ({
|
|
7113
7309
|
defaultPropText,
|
|
@@ -7138,7 +7334,7 @@ var SearchAndFilterResultContainer = ({
|
|
|
7138
7334
|
filterText: "No results match the selected filters",
|
|
7139
7335
|
fallbackText: "No matching results found"
|
|
7140
7336
|
});
|
|
7141
|
-
if (totalResults
|
|
7337
|
+
if (isLoading || totalResults === void 0 || totalResults > 0) {
|
|
7142
7338
|
return null;
|
|
7143
7339
|
}
|
|
7144
7340
|
const handleClearSearch = () => {
|
|
@@ -7149,19 +7345,19 @@ var SearchAndFilterResultContainer = ({
|
|
|
7149
7345
|
handleResetFilters();
|
|
7150
7346
|
}
|
|
7151
7347
|
};
|
|
7152
|
-
return /* @__PURE__ */ (0,
|
|
7153
|
-
/* @__PURE__ */ (0,
|
|
7154
|
-
/* @__PURE__ */ (0,
|
|
7348
|
+
return /* @__PURE__ */ (0, import_jsx_runtime79.jsxs)(import_jsx_runtime79.Fragment, { children: [
|
|
7349
|
+
/* @__PURE__ */ (0, import_jsx_runtime79.jsxs)(import_design_system49.HorizontalRhythm, { children: [
|
|
7350
|
+
/* @__PURE__ */ (0, import_jsx_runtime79.jsxs)("span", { children: [
|
|
7155
7351
|
totalResults,
|
|
7156
7352
|
" results ",
|
|
7157
7353
|
searchTerm ? `for "${searchTerm}"` : null
|
|
7158
7354
|
] }),
|
|
7159
|
-
!searchTerm || hideClearButton ? null : /* @__PURE__ */ (0,
|
|
7355
|
+
!searchTerm || hideClearButton ? null : /* @__PURE__ */ (0, import_jsx_runtime79.jsx)(import_design_system49.Button, { buttonType: "ghostDestructive", size: "zero", onClick: handleClearSearch, children: clearButtonLabel })
|
|
7160
7356
|
] }),
|
|
7161
|
-
totalResults === 0 ? /* @__PURE__ */ (0,
|
|
7162
|
-
calloutText ? /* @__PURE__ */ (0,
|
|
7163
|
-
hideClearButton ? null : /* @__PURE__ */ (0,
|
|
7164
|
-
|
|
7357
|
+
totalResults === 0 ? /* @__PURE__ */ (0, import_jsx_runtime79.jsxs)(import_design_system49.Callout, { title: automateCalloutTitle, type: "note", children: [
|
|
7358
|
+
calloutText ? /* @__PURE__ */ (0, import_jsx_runtime79.jsx)(import_design_system49.Paragraph, { children: calloutText }) : null,
|
|
7359
|
+
hideClearButton ? null : /* @__PURE__ */ (0, import_jsx_runtime79.jsx)(
|
|
7360
|
+
import_design_system49.Button,
|
|
7165
7361
|
{
|
|
7166
7362
|
buttonType: "tertiaryOutline",
|
|
7167
7363
|
size: "xs",
|
|
@@ -7175,25 +7371,26 @@ var SearchAndFilterResultContainer = ({
|
|
|
7175
7371
|
};
|
|
7176
7372
|
|
|
7177
7373
|
// src/components/SearchAndFilter/SearchAndFilter.tsx
|
|
7178
|
-
var
|
|
7374
|
+
var import_jsx_runtime80 = require("@emotion/react/jsx-runtime");
|
|
7179
7375
|
var SearchAndFilter = ({
|
|
7180
7376
|
filters,
|
|
7181
7377
|
filterOptions,
|
|
7182
7378
|
filterVisible,
|
|
7183
7379
|
filterControls,
|
|
7184
7380
|
viewSwitchControls,
|
|
7185
|
-
resultsContainerView = /* @__PURE__ */ (0,
|
|
7381
|
+
resultsContainerView = /* @__PURE__ */ (0, import_jsx_runtime80.jsx)(SearchAndFilterResultContainer, {}),
|
|
7186
7382
|
filterMapper: filterMapper2 = filterMapper,
|
|
7187
7383
|
additionalFiltersContainer,
|
|
7188
7384
|
onChange,
|
|
7189
7385
|
defaultSearchTerm,
|
|
7190
7386
|
onSearchChange,
|
|
7191
7387
|
totalResults,
|
|
7388
|
+
isLoading,
|
|
7192
7389
|
allowBindingSearchTerm = false,
|
|
7193
7390
|
resetFilterValues = [],
|
|
7194
7391
|
onResetFilterValues
|
|
7195
7392
|
}) => {
|
|
7196
|
-
return /* @__PURE__ */ (0,
|
|
7393
|
+
return /* @__PURE__ */ (0, import_jsx_runtime80.jsx)(
|
|
7197
7394
|
SearchAndFilterProvider,
|
|
7198
7395
|
{
|
|
7199
7396
|
filters,
|
|
@@ -7203,22 +7400,23 @@ var SearchAndFilter = ({
|
|
|
7203
7400
|
defaultSearchTerm,
|
|
7204
7401
|
onSearchChange,
|
|
7205
7402
|
totalResults,
|
|
7403
|
+
isLoading,
|
|
7206
7404
|
resetFilterValues,
|
|
7207
7405
|
filterMapper: filterMapper2,
|
|
7208
7406
|
allowBindingSearchTerm,
|
|
7209
7407
|
onResetFilterValues,
|
|
7210
|
-
children: /* @__PURE__ */ (0,
|
|
7211
|
-
/* @__PURE__ */ (0,
|
|
7212
|
-
/* @__PURE__ */ (0,
|
|
7408
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime80.jsxs)(import_design_system50.VerticalRhythm, { "data-testid": "search-and-filter", children: [
|
|
7409
|
+
/* @__PURE__ */ (0, import_jsx_runtime80.jsxs)("div", { css: SearchAndFilterOutterControlWrapper(viewSwitchControls ? "1fr auto" : "1fr"), children: [
|
|
7410
|
+
/* @__PURE__ */ (0, import_jsx_runtime80.jsx)(
|
|
7213
7411
|
"div",
|
|
7214
7412
|
{
|
|
7215
7413
|
css: SearchAndFilterControlsWrapper(viewSwitchControls ? "auto 1fr 0.05fr" : "auto 1fr"),
|
|
7216
|
-
children: !filterControls ? /* @__PURE__ */ (0,
|
|
7414
|
+
children: !filterControls ? /* @__PURE__ */ (0, import_jsx_runtime80.jsx)(FilterControls, { hideSearchInput: !onSearchChange }) : filterControls
|
|
7217
7415
|
}
|
|
7218
7416
|
),
|
|
7219
7417
|
viewSwitchControls
|
|
7220
7418
|
] }),
|
|
7221
|
-
/* @__PURE__ */ (0,
|
|
7419
|
+
/* @__PURE__ */ (0, import_jsx_runtime80.jsx)(FilterItems, { additionalFiltersContainer }),
|
|
7222
7420
|
resultsContainerView
|
|
7223
7421
|
] })
|
|
7224
7422
|
}
|
|
@@ -7226,18 +7424,18 @@ var SearchAndFilter = ({
|
|
|
7226
7424
|
};
|
|
7227
7425
|
|
|
7228
7426
|
// src/components/SearchAndFilter/SearchOnlyFilter.tsx
|
|
7229
|
-
var
|
|
7230
|
-
var
|
|
7427
|
+
var import_design_system51 = require("@uniformdev/design-system");
|
|
7428
|
+
var import_react72 = require("react");
|
|
7231
7429
|
var import_react_use8 = require("react-use");
|
|
7232
|
-
var
|
|
7233
|
-
var SearchOnlyContext = (0,
|
|
7430
|
+
var import_jsx_runtime81 = require("@emotion/react/jsx-runtime");
|
|
7431
|
+
var SearchOnlyContext = (0, import_react72.createContext)({
|
|
7234
7432
|
searchTerm: "",
|
|
7235
7433
|
setSearchTerm: () => {
|
|
7236
7434
|
}
|
|
7237
7435
|
});
|
|
7238
7436
|
var SearchOnlyFilter = ({ onSearchChange, maxWidth }) => {
|
|
7239
7437
|
const { searchTerm, setSearchTerm } = useSearchAndFilter();
|
|
7240
|
-
const [localeSearchTerm, setLocaleSearchTerm] = (0,
|
|
7438
|
+
const [localeSearchTerm, setLocaleSearchTerm] = (0, import_react72.useState)("");
|
|
7241
7439
|
(0, import_react_use8.useDebounce)(
|
|
7242
7440
|
() => {
|
|
7243
7441
|
setSearchTerm(localeSearchTerm);
|
|
@@ -7246,15 +7444,15 @@ var SearchOnlyFilter = ({ onSearchChange, maxWidth }) => {
|
|
|
7246
7444
|
300,
|
|
7247
7445
|
[localeSearchTerm]
|
|
7248
7446
|
);
|
|
7249
|
-
return /* @__PURE__ */ (0,
|
|
7447
|
+
return /* @__PURE__ */ (0, import_jsx_runtime81.jsx)(
|
|
7250
7448
|
SearchOnlyContext.Provider,
|
|
7251
7449
|
{
|
|
7252
7450
|
value: {
|
|
7253
7451
|
searchTerm,
|
|
7254
7452
|
setSearchTerm: setLocaleSearchTerm
|
|
7255
7453
|
},
|
|
7256
|
-
children: /* @__PURE__ */ (0,
|
|
7257
|
-
|
|
7454
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime81.jsx)("div", { css: { maxWidth: maxWidth != null ? maxWidth : "712px" }, children: /* @__PURE__ */ (0, import_jsx_runtime81.jsx)(
|
|
7455
|
+
import_design_system51.InputKeywordSearch,
|
|
7258
7456
|
{
|
|
7259
7457
|
placeholder: "Search...",
|
|
7260
7458
|
onSearchTextChanged: (e) => setLocaleSearchTerm(e),
|
|
@@ -7268,18 +7466,18 @@ var SearchOnlyFilter = ({ onSearchChange, maxWidth }) => {
|
|
|
7268
7466
|
};
|
|
7269
7467
|
|
|
7270
7468
|
// src/components/SearchAndFilter/SortItems.tsx
|
|
7271
|
-
var
|
|
7469
|
+
var import_design_system53 = require("@uniformdev/design-system");
|
|
7272
7470
|
|
|
7273
7471
|
// src/components/SearchAndFilter/styles/SortItems.styles.ts
|
|
7274
|
-
var
|
|
7275
|
-
var
|
|
7276
|
-
var ConditionalFilterRow2 =
|
|
7472
|
+
var import_react73 = require("@emotion/react");
|
|
7473
|
+
var import_design_system52 = require("@uniformdev/design-system");
|
|
7474
|
+
var ConditionalFilterRow2 = import_react73.css`
|
|
7277
7475
|
display: grid;
|
|
7278
7476
|
grid-template-columns: 35px 1fr;
|
|
7279
7477
|
gap: var(--spacing-sm);
|
|
7280
7478
|
margin-left: var(--spacing-base);
|
|
7281
7479
|
|
|
7282
|
-
${(0,
|
|
7480
|
+
${(0, import_design_system52.cq)("380px")} {
|
|
7283
7481
|
align-items: center;
|
|
7284
7482
|
|
|
7285
7483
|
&:after {
|
|
@@ -7300,22 +7498,22 @@ var ConditionalFilterRow2 = import_react69.css`
|
|
|
7300
7498
|
grid-template-columns: 50px 1fr;
|
|
7301
7499
|
}
|
|
7302
7500
|
|
|
7303
|
-
${(0,
|
|
7501
|
+
${(0, import_design_system52.cq)("580px")} {
|
|
7304
7502
|
&:after {
|
|
7305
7503
|
display: none;
|
|
7306
7504
|
}
|
|
7307
7505
|
}
|
|
7308
7506
|
|
|
7309
7507
|
@media (prefers-reduced-motion: no-preference) {
|
|
7310
|
-
animation: ${
|
|
7508
|
+
animation: ${import_design_system52.fadeInLtr} var(--duration-fast) var(--timing-ease-out);
|
|
7311
7509
|
}
|
|
7312
7510
|
`;
|
|
7313
|
-
var ConditionalInputRow2 =
|
|
7511
|
+
var ConditionalInputRow2 = import_react73.css`
|
|
7314
7512
|
display: flex;
|
|
7315
7513
|
gap: var(--spacing-sm);
|
|
7316
7514
|
flex-wrap: wrap;
|
|
7317
7515
|
|
|
7318
|
-
${(0,
|
|
7516
|
+
${(0, import_design_system52.cq)("380px")} {
|
|
7319
7517
|
& > div:nth-child(-n + 2) {
|
|
7320
7518
|
width: calc(50% - var(--spacing-sm));
|
|
7321
7519
|
}
|
|
@@ -7324,7 +7522,7 @@ var ConditionalInputRow2 = import_react69.css`
|
|
|
7324
7522
|
width: calc(100% - 48px);
|
|
7325
7523
|
}
|
|
7326
7524
|
}
|
|
7327
|
-
${(0,
|
|
7525
|
+
${(0, import_design_system52.cq)("580px")} {
|
|
7328
7526
|
display: grid;
|
|
7329
7527
|
grid-template-columns: 200px 160px 1fr 32px;
|
|
7330
7528
|
|
|
@@ -7333,13 +7531,13 @@ var ConditionalInputRow2 = import_react69.css`
|
|
|
7333
7531
|
}
|
|
7334
7532
|
}
|
|
7335
7533
|
`;
|
|
7336
|
-
var SearchInput2 =
|
|
7534
|
+
var SearchInput2 = import_react73.css`
|
|
7337
7535
|
&& {
|
|
7338
7536
|
max-height: 40px;
|
|
7339
7537
|
min-height: unset;
|
|
7340
7538
|
}
|
|
7341
7539
|
`;
|
|
7342
|
-
var FilterButton3 =
|
|
7540
|
+
var FilterButton3 = import_react73.css`
|
|
7343
7541
|
align-items: center;
|
|
7344
7542
|
background: var(--white);
|
|
7345
7543
|
border: 1px solid var(--gray-300);
|
|
@@ -7376,13 +7574,13 @@ var FilterButton3 = import_react69.css`
|
|
|
7376
7574
|
opacity: var(--opacity-50);
|
|
7377
7575
|
}
|
|
7378
7576
|
`;
|
|
7379
|
-
var FilterButtonText2 =
|
|
7577
|
+
var FilterButtonText2 = import_react73.css`
|
|
7380
7578
|
overflow: hidden;
|
|
7381
7579
|
text-overflow: ellipsis;
|
|
7382
7580
|
white-space: nowrap;
|
|
7383
7581
|
max-width: 14ch;
|
|
7384
7582
|
`;
|
|
7385
|
-
var FilterButtonSelected2 =
|
|
7583
|
+
var FilterButtonSelected2 = import_react73.css`
|
|
7386
7584
|
background: var(--gray-100);
|
|
7387
7585
|
border-color: var(--gray-300);
|
|
7388
7586
|
|
|
@@ -7390,7 +7588,7 @@ var FilterButtonSelected2 = import_react69.css`
|
|
|
7390
7588
|
color: var(--accent-dark);
|
|
7391
7589
|
}
|
|
7392
7590
|
`;
|
|
7393
|
-
var FilterButtonWithOptions2 =
|
|
7591
|
+
var FilterButtonWithOptions2 = import_react73.css`
|
|
7394
7592
|
:where([aria-expanded='true']) {
|
|
7395
7593
|
background: var(--purple-rain-100);
|
|
7396
7594
|
border-color: var(--accent-light);
|
|
@@ -7402,14 +7600,14 @@ var FilterButtonWithOptions2 = import_react69.css`
|
|
|
7402
7600
|
}
|
|
7403
7601
|
}
|
|
7404
7602
|
`;
|
|
7405
|
-
var SearchIcon2 =
|
|
7603
|
+
var SearchIcon2 = import_react73.css`
|
|
7406
7604
|
color: var(--icon-color);
|
|
7407
7605
|
position: absolute;
|
|
7408
7606
|
inset: 0 var(--spacing-base) 0 auto;
|
|
7409
7607
|
margin: auto;
|
|
7410
7608
|
transition: color var(--duration-fast) var(--timing-ease-out);
|
|
7411
7609
|
`;
|
|
7412
|
-
var AddConditionalBtn2 =
|
|
7610
|
+
var AddConditionalBtn2 = import_react73.css`
|
|
7413
7611
|
align-items: center;
|
|
7414
7612
|
background: transparent;
|
|
7415
7613
|
border: none;
|
|
@@ -7428,14 +7626,14 @@ var AddConditionalBtn2 = import_react69.css`
|
|
|
7428
7626
|
color: var(--gray-400);
|
|
7429
7627
|
}
|
|
7430
7628
|
`;
|
|
7431
|
-
var Title2 =
|
|
7629
|
+
var Title2 = import_react73.css`
|
|
7432
7630
|
color: var(--typography-light);
|
|
7433
7631
|
|
|
7434
7632
|
&:focus {
|
|
7435
7633
|
outline: none;
|
|
7436
7634
|
}
|
|
7437
7635
|
`;
|
|
7438
|
-
var ResetConditionsBtn2 =
|
|
7636
|
+
var ResetConditionsBtn2 = import_react73.css`
|
|
7439
7637
|
background: transparent;
|
|
7440
7638
|
border: none;
|
|
7441
7639
|
color: var(--action-destructive-default);
|
|
@@ -7447,12 +7645,12 @@ var ResetConditionsBtn2 = import_react69.css`
|
|
|
7447
7645
|
color: var(--action-destructive-hover);
|
|
7448
7646
|
}
|
|
7449
7647
|
`;
|
|
7450
|
-
var IconBtn2 =
|
|
7648
|
+
var IconBtn2 = import_react73.css`
|
|
7451
7649
|
background: transparent;
|
|
7452
7650
|
border: none;
|
|
7453
7651
|
padding: var(--spacing-sm);
|
|
7454
7652
|
`;
|
|
7455
|
-
var SearchAndFilterOptionsContainer3 =
|
|
7653
|
+
var SearchAndFilterOptionsContainer3 = import_react73.css`
|
|
7456
7654
|
background: var(--gray-50);
|
|
7457
7655
|
border: 1px solid var(--gray-300);
|
|
7458
7656
|
border-radius: var(--rounded-base);
|
|
@@ -7465,34 +7663,34 @@ var SearchAndFilterOptionsContainer3 = import_react69.css`
|
|
|
7465
7663
|
position: relative;
|
|
7466
7664
|
z-index: 1;
|
|
7467
7665
|
`;
|
|
7468
|
-
var SearchAndFilterOptionsInnerContainer2 =
|
|
7666
|
+
var SearchAndFilterOptionsInnerContainer2 = import_react73.css`
|
|
7469
7667
|
display: flex;
|
|
7470
7668
|
flex-direction: column;
|
|
7471
7669
|
gap: var(--spacing-sm);
|
|
7472
7670
|
padding-inline: var(--spacing-md);
|
|
7473
7671
|
`;
|
|
7474
|
-
var SearchAndFilterButtonGroup2 =
|
|
7672
|
+
var SearchAndFilterButtonGroup2 = import_react73.css`
|
|
7475
7673
|
margin-top: var(--spacing-xs);
|
|
7476
7674
|
margin-left: calc(56px + var(--spacing-md));
|
|
7477
7675
|
`;
|
|
7478
|
-
var SortFilterWrapper = (hiddenLocaleInput) =>
|
|
7676
|
+
var SortFilterWrapper = (hiddenLocaleInput) => import_react73.css`
|
|
7479
7677
|
align-items: center;
|
|
7480
7678
|
display: flex;
|
|
7481
7679
|
gap: var(--spacing-base);
|
|
7482
7680
|
flex-grow: 1;
|
|
7483
7681
|
|
|
7484
|
-
${(0,
|
|
7682
|
+
${(0, import_design_system52.cq)("420px")} {
|
|
7485
7683
|
display: grid;
|
|
7486
7684
|
grid-template-columns: ${hiddenLocaleInput ? "1fr" : "1fr minmax(140px, 0.25fr)"};
|
|
7487
7685
|
}
|
|
7488
7686
|
`;
|
|
7489
|
-
var SortFilterInputRow =
|
|
7687
|
+
var SortFilterInputRow = import_react73.css`
|
|
7490
7688
|
align-items: center;
|
|
7491
7689
|
display: grid;
|
|
7492
7690
|
grid-template-columns: 1fr auto;
|
|
7493
7691
|
gap: var(--spacing-base);
|
|
7494
7692
|
`;
|
|
7495
|
-
var InputVariableWrapper =
|
|
7693
|
+
var InputVariableWrapper = import_react73.css`
|
|
7496
7694
|
flex-grow: 1;
|
|
7497
7695
|
|
|
7498
7696
|
// we need to override label styles nested within the input variable
|
|
@@ -7503,7 +7701,7 @@ var InputVariableWrapper = import_react69.css`
|
|
|
7503
7701
|
`;
|
|
7504
7702
|
|
|
7505
7703
|
// src/components/SearchAndFilter/SortItems.tsx
|
|
7506
|
-
var
|
|
7704
|
+
var import_jsx_runtime82 = require("@emotion/react/jsx-runtime");
|
|
7507
7705
|
var SortItems = ({
|
|
7508
7706
|
sortByLabel = "Sort by",
|
|
7509
7707
|
localeLabel = "Show locale",
|
|
@@ -7525,11 +7723,11 @@ var SortItems = ({
|
|
|
7525
7723
|
return (_a2 = item.options) == null ? void 0 : _a2.find((option) => option.value === sortField);
|
|
7526
7724
|
})) == null ? void 0 : _a.options) == null ? void 0 : _b.find((nestedOption) => nestedOption.value === sortField);
|
|
7527
7725
|
const localeLabelValue = sortOptions.length > 1 ? localeLabel : `${localeLabel}s`;
|
|
7528
|
-
return /* @__PURE__ */ (0,
|
|
7529
|
-
/* @__PURE__ */ (0,
|
|
7530
|
-
/* @__PURE__ */ (0,
|
|
7531
|
-
/* @__PURE__ */ (0,
|
|
7532
|
-
/* @__PURE__ */ (0,
|
|
7726
|
+
return /* @__PURE__ */ (0, import_jsx_runtime82.jsxs)("div", { css: [SortFilterWrapper(hideLocaleOptions)], "data-testid": "sorting-options", children: [
|
|
7727
|
+
/* @__PURE__ */ (0, import_jsx_runtime82.jsxs)(import_design_system53.VerticalRhythm, { gap: "xs", children: [
|
|
7728
|
+
/* @__PURE__ */ (0, import_jsx_runtime82.jsx)("span", { css: Title2, children: sortByLabel }),
|
|
7729
|
+
/* @__PURE__ */ (0, import_jsx_runtime82.jsxs)("div", { css: SortFilterInputRow, children: [
|
|
7730
|
+
/* @__PURE__ */ (0, import_jsx_runtime82.jsx)(
|
|
7533
7731
|
InputVariables,
|
|
7534
7732
|
{
|
|
7535
7733
|
disableInlineMenu: disableSortBinding,
|
|
@@ -7537,8 +7735,8 @@ var SortItems = ({
|
|
|
7537
7735
|
value: sortField,
|
|
7538
7736
|
valueToResetTo: "created_at",
|
|
7539
7737
|
onChange: (e) => onSortChange(`${e}_${sortDirection}`),
|
|
7540
|
-
inputWhenNoVariables: /* @__PURE__ */ (0,
|
|
7541
|
-
|
|
7738
|
+
inputWhenNoVariables: /* @__PURE__ */ (0, import_jsx_runtime82.jsx)(
|
|
7739
|
+
import_design_system53.InputComboBox,
|
|
7542
7740
|
{
|
|
7543
7741
|
id: "sort-by-field",
|
|
7544
7742
|
"aria-label": "Sort by",
|
|
@@ -7560,7 +7758,7 @@ var SortItems = ({
|
|
|
7560
7758
|
)
|
|
7561
7759
|
}
|
|
7562
7760
|
),
|
|
7563
|
-
/* @__PURE__ */ (0,
|
|
7761
|
+
/* @__PURE__ */ (0, import_jsx_runtime82.jsx)(
|
|
7564
7762
|
InputVariables,
|
|
7565
7763
|
{
|
|
7566
7764
|
disableInlineMenu: disableSortBinding,
|
|
@@ -7568,8 +7766,8 @@ var SortItems = ({
|
|
|
7568
7766
|
valueToResetTo: "DESC",
|
|
7569
7767
|
showMenuPosition: disableSortBinding ? void 0 : "inline-right",
|
|
7570
7768
|
onChange: (e) => onSortChange(`${sortField}_${e}`),
|
|
7571
|
-
inputWhenNoVariables: /* @__PURE__ */ (0,
|
|
7572
|
-
|
|
7769
|
+
inputWhenNoVariables: /* @__PURE__ */ (0, import_jsx_runtime82.jsx)(
|
|
7770
|
+
import_design_system53.SegmentedControl,
|
|
7573
7771
|
{
|
|
7574
7772
|
noCheckmark: true,
|
|
7575
7773
|
name: "sortBy",
|
|
@@ -7600,15 +7798,15 @@ var SortItems = ({
|
|
|
7600
7798
|
)
|
|
7601
7799
|
] })
|
|
7602
7800
|
] }),
|
|
7603
|
-
hideLocaleOptions ? null : /* @__PURE__ */ (0,
|
|
7801
|
+
hideLocaleOptions ? null : /* @__PURE__ */ (0, import_jsx_runtime82.jsx)(import_design_system53.VerticalRhythm, { gap: "xs", css: InputVariableWrapper, children: /* @__PURE__ */ (0, import_jsx_runtime82.jsx)(
|
|
7604
7802
|
InputVariables,
|
|
7605
7803
|
{
|
|
7606
7804
|
label: localeLabelValue,
|
|
7607
7805
|
value: localeValue,
|
|
7608
7806
|
showMenuPosition: "inline-right",
|
|
7609
7807
|
onChange: (e) => onLocaleChange(e != null ? e : ""),
|
|
7610
|
-
inputWhenNoVariables: /* @__PURE__ */ (0,
|
|
7611
|
-
|
|
7808
|
+
inputWhenNoVariables: /* @__PURE__ */ (0, import_jsx_runtime82.jsx)(
|
|
7809
|
+
import_design_system53.InputSelect,
|
|
7612
7810
|
{
|
|
7613
7811
|
name: "localeReturned",
|
|
7614
7812
|
"aria-label": localeLabelValue,
|
|
@@ -7638,7 +7836,7 @@ function createLocationValidator(setValue, validate) {
|
|
|
7638
7836
|
|
|
7639
7837
|
// src/utils/useContentDataResourceLocaleInfo.ts
|
|
7640
7838
|
var import_canvas12 = require("@uniformdev/canvas");
|
|
7641
|
-
var
|
|
7839
|
+
var import_react74 = require("react");
|
|
7642
7840
|
function useContentDataResourceLocaleInfo({
|
|
7643
7841
|
locale,
|
|
7644
7842
|
defaultLocale,
|
|
@@ -7646,12 +7844,12 @@ function useContentDataResourceLocaleInfo({
|
|
|
7646
7844
|
dynamicInputs
|
|
7647
7845
|
}) {
|
|
7648
7846
|
var _a;
|
|
7649
|
-
const setLocaleRef = (0,
|
|
7847
|
+
const setLocaleRef = (0, import_react74.useRef)(setLocale);
|
|
7650
7848
|
setLocaleRef.current = setLocale;
|
|
7651
7849
|
const { flatVariables } = useVariables();
|
|
7652
7850
|
const effectiveLocale = locale != null ? locale : dynamicInputs[import_canvas12.LOCALE_DYNAMIC_INPUT_NAME] ? (0, import_canvas12.createVariableReference)(import_canvas12.LOCALE_DYNAMIC_INPUT_NAME) : defaultLocale != null ? defaultLocale : "";
|
|
7653
7851
|
const boundLocale = (_a = (0, import_canvas12.bindVariables)({ variables: flatVariables, value: effectiveLocale }).result) != null ? _a : effectiveLocale;
|
|
7654
|
-
(0,
|
|
7852
|
+
(0, import_react74.useEffect)(() => {
|
|
7655
7853
|
if (locale === void 0 && effectiveLocale && setLocaleRef.current) {
|
|
7656
7854
|
setLocaleRef.current(effectiveLocale);
|
|
7657
7855
|
}
|
|
@@ -7660,7 +7858,7 @@ function useContentDataResourceLocaleInfo({
|
|
|
7660
7858
|
}
|
|
7661
7859
|
|
|
7662
7860
|
// src/index.ts
|
|
7663
|
-
var
|
|
7861
|
+
var import_design_system54 = require("@uniformdev/design-system");
|
|
7664
7862
|
__reExport(src_exports, require("@uniformdev/mesh-sdk"), module.exports);
|
|
7665
7863
|
// Annotate the CommonJS export names for ESM import in node:
|
|
7666
7864
|
0 && (module.exports = {
|
|
@@ -7682,6 +7880,9 @@ __reExport(src_exports, require("@uniformdev/mesh-sdk"), module.exports);
|
|
|
7682
7880
|
DataTypeEditor,
|
|
7683
7881
|
DateEditor,
|
|
7684
7882
|
DateRangeEditor,
|
|
7883
|
+
DelegationContext,
|
|
7884
|
+
DelegationGate,
|
|
7885
|
+
DelegationProvider,
|
|
7685
7886
|
DrawerContent,
|
|
7686
7887
|
EDIT_VARIABLE_COMMAND,
|
|
7687
7888
|
FilterButton,
|
|
@@ -7794,6 +7995,7 @@ __reExport(src_exports, require("@uniformdev/mesh-sdk"), module.exports);
|
|
|
7794
7995
|
urlEncodeRequestUrl,
|
|
7795
7996
|
useConnectedDataAsVariables,
|
|
7796
7997
|
useContentDataResourceLocaleInfo,
|
|
7998
|
+
useDelegation,
|
|
7797
7999
|
useDynamicInputsAsVariables,
|
|
7798
8000
|
useMeshLocation,
|
|
7799
8001
|
useObjectSearchContext,
|