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