@uniformdev/mesh-sdk-react 19.164.0 → 19.165.1-alpha.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/index.d.mts +14 -5
- package/dist/index.d.ts +14 -5
- package/dist/index.esm.js +132 -72
- package/dist/index.js +278 -221
- package/dist/index.mjs +132 -72
- package/package.json +5 -5
package/dist/index.esm.js
CHANGED
|
@@ -8178,6 +8178,58 @@ var TextEditor = ({
|
|
|
8178
8178
|
);
|
|
8179
8179
|
};
|
|
8180
8180
|
|
|
8181
|
+
// src/components/SearchAndFilter/editors/TextMultiChoiceEditor.tsx
|
|
8182
|
+
import {
|
|
8183
|
+
convertComboBoxGroupsToSelectableGroups as convertComboBoxGroupsToSelectableGroups5,
|
|
8184
|
+
getComboBoxSelectedSelectableGroups as getComboBoxSelectedSelectableGroups3,
|
|
8185
|
+
InputCreatableComboBox
|
|
8186
|
+
} from "@uniformdev/design-system";
|
|
8187
|
+
import { useMemo as useMemo21 } from "react";
|
|
8188
|
+
import { jsx as jsx80 } from "@emotion/react/jsx-runtime";
|
|
8189
|
+
var TextMultiChoiceEditor = ({
|
|
8190
|
+
value,
|
|
8191
|
+
disabled,
|
|
8192
|
+
readOnly,
|
|
8193
|
+
valueTestId,
|
|
8194
|
+
...props
|
|
8195
|
+
}) => {
|
|
8196
|
+
const readOnlyProps = readOnly ? readOnlyAttributes : {};
|
|
8197
|
+
const isClearable = !readOnly || !disabled;
|
|
8198
|
+
const { groupedOptions, selectedOptions } = useMemo21(() => {
|
|
8199
|
+
var _a;
|
|
8200
|
+
const coercedValue = typeof value === "string" ? [value] : value != null ? value : [];
|
|
8201
|
+
const options = (_a = coercedValue.map((v) => ({ label: v, value: v }))) != null ? _a : [];
|
|
8202
|
+
return convertComboBoxGroupsToSelectableGroups5({ options, selectedItems: new Set(value) });
|
|
8203
|
+
}, [value]);
|
|
8204
|
+
return /* @__PURE__ */ jsx80("div", { "data-testid": valueTestId, children: /* @__PURE__ */ jsx80(
|
|
8205
|
+
InputCreatableComboBox,
|
|
8206
|
+
{
|
|
8207
|
+
...props,
|
|
8208
|
+
placeholder: "Type a value\u2026",
|
|
8209
|
+
noOptionsMessage: () => "Type to create a new value",
|
|
8210
|
+
options: groupedOptions,
|
|
8211
|
+
isMulti: true,
|
|
8212
|
+
isClearable,
|
|
8213
|
+
isDisabled: disabled,
|
|
8214
|
+
onChange: (e) => {
|
|
8215
|
+
const selectedValues = getComboBoxSelectedSelectableGroups3(e);
|
|
8216
|
+
return props.onChange([...selectedValues]);
|
|
8217
|
+
},
|
|
8218
|
+
value: selectedOptions,
|
|
8219
|
+
"aria-readonly": readOnly,
|
|
8220
|
+
styles: {
|
|
8221
|
+
menu(base) {
|
|
8222
|
+
return {
|
|
8223
|
+
...base,
|
|
8224
|
+
minWidth: "max-content"
|
|
8225
|
+
};
|
|
8226
|
+
}
|
|
8227
|
+
},
|
|
8228
|
+
...readOnlyProps
|
|
8229
|
+
}
|
|
8230
|
+
) });
|
|
8231
|
+
};
|
|
8232
|
+
|
|
8181
8233
|
// src/components/SearchAndFilter/FilterButton.tsx
|
|
8182
8234
|
import { Counter as Counter2, Icon as Icon6 } from "@uniformdev/design-system";
|
|
8183
8235
|
|
|
@@ -8387,7 +8439,7 @@ var ResetConditionsBtn = css38`
|
|
|
8387
8439
|
border: none;
|
|
8388
8440
|
color: var(--action-destructive-default);
|
|
8389
8441
|
transition: color var(--duration-fast) var(--timing-ease-out);
|
|
8390
|
-
padding: 0;
|
|
8442
|
+
padding: 0 var(--spacing-sm) 0 0;
|
|
8391
8443
|
|
|
8392
8444
|
&:hover,
|
|
8393
8445
|
&:focus {
|
|
@@ -8395,6 +8447,7 @@ var ResetConditionsBtn = css38`
|
|
|
8395
8447
|
}
|
|
8396
8448
|
`;
|
|
8397
8449
|
var IconBtn = css38`
|
|
8450
|
+
align-self: center;
|
|
8398
8451
|
background: transparent;
|
|
8399
8452
|
border: none;
|
|
8400
8453
|
padding: var(--spacing-sm);
|
|
@@ -8424,7 +8477,7 @@ var SearchAndFilterButtonGroup = css38`
|
|
|
8424
8477
|
`;
|
|
8425
8478
|
|
|
8426
8479
|
// src/components/SearchAndFilter/FilterButton.tsx
|
|
8427
|
-
import { jsx as
|
|
8480
|
+
import { jsx as jsx81, jsxs as jsxs44 } from "@emotion/react/jsx-runtime";
|
|
8428
8481
|
var FilterButton2 = ({
|
|
8429
8482
|
text = "Filters",
|
|
8430
8483
|
icon = "filter-add",
|
|
@@ -8445,9 +8498,9 @@ var FilterButton2 = ({
|
|
|
8445
8498
|
...props,
|
|
8446
8499
|
"data-testid": dataTestId,
|
|
8447
8500
|
children: [
|
|
8448
|
-
/* @__PURE__ */
|
|
8449
|
-
/* @__PURE__ */
|
|
8450
|
-
filterCount ? /* @__PURE__ */
|
|
8501
|
+
/* @__PURE__ */ jsx81(Icon6, { icon, iconColor: "currentColor", size: "1rem" }),
|
|
8502
|
+
/* @__PURE__ */ jsx81("span", { css: FilterButtonText, children: text }),
|
|
8503
|
+
filterCount ? /* @__PURE__ */ jsx81(Counter2, { count: filterCount, bgColor: "var(--white)" }) : null
|
|
8451
8504
|
]
|
|
8452
8505
|
}
|
|
8453
8506
|
);
|
|
@@ -8469,22 +8522,19 @@ import {
|
|
|
8469
8522
|
useContext as useContext8,
|
|
8470
8523
|
useDeferredValue as useDeferredValue2,
|
|
8471
8524
|
useEffect as useEffect21,
|
|
8472
|
-
useMemo as
|
|
8525
|
+
useMemo as useMemo22,
|
|
8473
8526
|
useState as useState24
|
|
8474
8527
|
} from "react";
|
|
8475
8528
|
|
|
8476
8529
|
// src/components/SearchAndFilter/FilterEditor.tsx
|
|
8477
|
-
import { jsx as
|
|
8530
|
+
import { jsx as jsx82 } from "@emotion/react/jsx-runtime";
|
|
8478
8531
|
var FilterEditorRenderer = ({ editorType, ...props }) => {
|
|
8479
8532
|
const { filterMapper: contextFilterMapper } = useSearchAndFilter();
|
|
8480
8533
|
const Editor = contextFilterMapper == null ? void 0 : contextFilterMapper[editorType];
|
|
8481
|
-
if (!Editor) {
|
|
8482
|
-
return
|
|
8534
|
+
if (!Editor || editorType === "empty") {
|
|
8535
|
+
return /* @__PURE__ */ jsx82("span", {});
|
|
8483
8536
|
}
|
|
8484
|
-
|
|
8485
|
-
return null;
|
|
8486
|
-
}
|
|
8487
|
-
return /* @__PURE__ */ jsx81(Editor, { ...props });
|
|
8537
|
+
return /* @__PURE__ */ jsx82(Editor, { ...props });
|
|
8488
8538
|
};
|
|
8489
8539
|
var filterMapper = {
|
|
8490
8540
|
multiChoice: FilterMultiChoiceEditor,
|
|
@@ -8492,6 +8542,7 @@ var filterMapper = {
|
|
|
8492
8542
|
date: DateEditor,
|
|
8493
8543
|
dateRange: DateRangeEditor,
|
|
8494
8544
|
text: TextEditor,
|
|
8545
|
+
textMultiChoice: TextMultiChoiceEditor,
|
|
8495
8546
|
numberRange: NumberRangeEditor,
|
|
8496
8547
|
number: NumberEditor,
|
|
8497
8548
|
statusMultiChoice: StatusMultiEditor,
|
|
@@ -8501,9 +8552,9 @@ var filterMapper = {
|
|
|
8501
8552
|
function withInputVariables(WrappedComponent) {
|
|
8502
8553
|
const WithInputVariables = (props) => {
|
|
8503
8554
|
if (Array.isArray(props.value) || !props.bindable || props.disabled || props.readOnly) {
|
|
8504
|
-
return /* @__PURE__ */
|
|
8555
|
+
return /* @__PURE__ */ jsx82(WrappedComponent, { ...props });
|
|
8505
8556
|
}
|
|
8506
|
-
return /* @__PURE__ */
|
|
8557
|
+
return /* @__PURE__ */ jsx82(
|
|
8507
8558
|
InputVariables,
|
|
8508
8559
|
{
|
|
8509
8560
|
disableInlineMenu: true,
|
|
@@ -8511,7 +8562,7 @@ function withInputVariables(WrappedComponent) {
|
|
|
8511
8562
|
onChange: (newValue) => props.onChange(newValue != null ? newValue : ""),
|
|
8512
8563
|
value: props.value,
|
|
8513
8564
|
disabled: props.disabled,
|
|
8514
|
-
inputWhenNoVariables: /* @__PURE__ */
|
|
8565
|
+
inputWhenNoVariables: /* @__PURE__ */ jsx82(WrappedComponent, { ...props })
|
|
8515
8566
|
}
|
|
8516
8567
|
);
|
|
8517
8568
|
};
|
|
@@ -8521,16 +8572,16 @@ function withInputVariablesForMultiValue(WrappedComponent) {
|
|
|
8521
8572
|
const WithInputVariables = (props) => {
|
|
8522
8573
|
var _a;
|
|
8523
8574
|
if (!props.bindable || props.disabled || props.readOnly) {
|
|
8524
|
-
return /* @__PURE__ */
|
|
8575
|
+
return /* @__PURE__ */ jsx82(WrappedComponent, { ...props });
|
|
8525
8576
|
}
|
|
8526
|
-
return /* @__PURE__ */
|
|
8577
|
+
return /* @__PURE__ */ jsx82(
|
|
8527
8578
|
InputVariables,
|
|
8528
8579
|
{
|
|
8529
8580
|
disableInlineMenu: true,
|
|
8530
8581
|
showMenuPosition: "inline-right",
|
|
8531
8582
|
onChange: (newValue) => props.onChange(newValue ? [newValue] : []),
|
|
8532
8583
|
value: (_a = props.value) == null ? void 0 : _a[0],
|
|
8533
|
-
inputWhenNoVariables: /* @__PURE__ */
|
|
8584
|
+
inputWhenNoVariables: /* @__PURE__ */ jsx82(WrappedComponent, { ...props })
|
|
8534
8585
|
}
|
|
8535
8586
|
);
|
|
8536
8587
|
};
|
|
@@ -8546,7 +8597,7 @@ var bindableFiltersMapper = {
|
|
|
8546
8597
|
};
|
|
8547
8598
|
|
|
8548
8599
|
// src/components/SearchAndFilter/hooks/useSearchAndFilter.tsx
|
|
8549
|
-
import { jsx as
|
|
8600
|
+
import { jsx as jsx83 } from "@emotion/react/jsx-runtime";
|
|
8550
8601
|
var SearchAndFilterContext = createContext6({
|
|
8551
8602
|
searchTerm: "",
|
|
8552
8603
|
setSearchTerm: () => {
|
|
@@ -8610,7 +8661,7 @@ var SearchAndFilterProvider = ({
|
|
|
8610
8661
|
},
|
|
8611
8662
|
[filters, onChange]
|
|
8612
8663
|
);
|
|
8613
|
-
const validFilterQuery =
|
|
8664
|
+
const validFilterQuery = useMemo22(() => {
|
|
8614
8665
|
const hasValidFilters = filters.every((f) => f.field && f.operator && f.value);
|
|
8615
8666
|
if (hasValidFilters) {
|
|
8616
8667
|
return filters;
|
|
@@ -8629,7 +8680,7 @@ var SearchAndFilterProvider = ({
|
|
|
8629
8680
|
};
|
|
8630
8681
|
}
|
|
8631
8682
|
}, [filterVisibility]);
|
|
8632
|
-
return /* @__PURE__ */
|
|
8683
|
+
return /* @__PURE__ */ jsx83(
|
|
8633
8684
|
SearchAndFilterContext.Provider,
|
|
8634
8685
|
{
|
|
8635
8686
|
value: {
|
|
@@ -8648,7 +8699,7 @@ var SearchAndFilterProvider = ({
|
|
|
8648
8699
|
filterMapper: filterMapper2,
|
|
8649
8700
|
allowBindingSearchTerm
|
|
8650
8701
|
},
|
|
8651
|
-
children: /* @__PURE__ */
|
|
8702
|
+
children: /* @__PURE__ */ jsx83(VerticalRhythm5, { children })
|
|
8652
8703
|
}
|
|
8653
8704
|
);
|
|
8654
8705
|
};
|
|
@@ -8658,7 +8709,7 @@ var useSearchAndFilter = () => {
|
|
|
8658
8709
|
};
|
|
8659
8710
|
|
|
8660
8711
|
// src/components/SearchAndFilter/FilterControls.tsx
|
|
8661
|
-
import { Fragment as Fragment16, jsx as
|
|
8712
|
+
import { Fragment as Fragment16, jsx as jsx84, jsxs as jsxs45 } from "@emotion/react/jsx-runtime";
|
|
8662
8713
|
var FilterControls = ({
|
|
8663
8714
|
children,
|
|
8664
8715
|
hideSearchInput
|
|
@@ -8689,7 +8740,7 @@ var FilterControls = ({
|
|
|
8689
8740
|
}
|
|
8690
8741
|
}, [searchTerm]);
|
|
8691
8742
|
return /* @__PURE__ */ jsxs45(Fragment16, { children: [
|
|
8692
|
-
/* @__PURE__ */
|
|
8743
|
+
/* @__PURE__ */ jsx84(
|
|
8693
8744
|
FilterButton2,
|
|
8694
8745
|
{
|
|
8695
8746
|
"aria-controls": "search-and-filter-options",
|
|
@@ -8703,7 +8754,7 @@ var FilterControls = ({
|
|
|
8703
8754
|
}
|
|
8704
8755
|
),
|
|
8705
8756
|
hideSearchInput ? null : /* @__PURE__ */ jsxs45("div", { css: BindableKeywordSearchInputStyles, children: [
|
|
8706
|
-
/* @__PURE__ */
|
|
8757
|
+
/* @__PURE__ */ jsx84(
|
|
8707
8758
|
InputVariables,
|
|
8708
8759
|
{
|
|
8709
8760
|
label: "",
|
|
@@ -8713,7 +8764,7 @@ var FilterControls = ({
|
|
|
8713
8764
|
value: localeSearchTerm,
|
|
8714
8765
|
onChange: (value) => setLocaleSearchTerm(value != null ? value : ""),
|
|
8715
8766
|
disableVariables: !allowBindingSearchTerm,
|
|
8716
|
-
inputWhenNoVariables: /* @__PURE__ */
|
|
8767
|
+
inputWhenNoVariables: /* @__PURE__ */ jsx84(
|
|
8717
8768
|
InputKeywordSearch2,
|
|
8718
8769
|
{
|
|
8719
8770
|
placeholder: "Search...",
|
|
@@ -8726,7 +8777,7 @@ var FilterControls = ({
|
|
|
8726
8777
|
)
|
|
8727
8778
|
}
|
|
8728
8779
|
),
|
|
8729
|
-
hasVariableInSearchTerm ? /* @__PURE__ */
|
|
8780
|
+
hasVariableInSearchTerm ? /* @__PURE__ */ jsx84("div", { css: ClearSearchButtonContainer, children: /* @__PURE__ */ jsx84(
|
|
8730
8781
|
"button",
|
|
8731
8782
|
{
|
|
8732
8783
|
css: ClearSearchButtonStyles,
|
|
@@ -8740,7 +8791,7 @@ var FilterControls = ({
|
|
|
8740
8791
|
},
|
|
8741
8792
|
type: "button",
|
|
8742
8793
|
"data-testid": "keyword-search-clear-button",
|
|
8743
|
-
children: /* @__PURE__ */
|
|
8794
|
+
children: /* @__PURE__ */ jsx84(Icon7, { icon: CgClose5, iconColor: "red", size: "1rem" })
|
|
8744
8795
|
}
|
|
8745
8796
|
) }) : null
|
|
8746
8797
|
] }),
|
|
@@ -8750,20 +8801,20 @@ var FilterControls = ({
|
|
|
8750
8801
|
|
|
8751
8802
|
// src/components/SearchAndFilter/FilterItem.tsx
|
|
8752
8803
|
import { Icon as Icon8, InputComboBox as InputComboBox5 } from "@uniformdev/design-system";
|
|
8753
|
-
import { useMemo as
|
|
8804
|
+
import { useMemo as useMemo23 } from "react";
|
|
8754
8805
|
|
|
8755
8806
|
// src/components/SearchAndFilter/FilterMenu.tsx
|
|
8756
8807
|
import { HorizontalRhythm as HorizontalRhythm8, VerticalRhythm as VerticalRhythm6 } from "@uniformdev/design-system";
|
|
8757
8808
|
import React13, { useEffect as useEffect23 } from "react";
|
|
8758
|
-
import { jsx as
|
|
8809
|
+
import { jsx as jsx85, jsxs as jsxs46 } from "@emotion/react/jsx-runtime";
|
|
8759
8810
|
var SearchAndFilterOptionsContainer2 = ({
|
|
8760
8811
|
buttonRow,
|
|
8761
8812
|
additionalFiltersContainer,
|
|
8762
8813
|
children
|
|
8763
8814
|
}) => {
|
|
8764
8815
|
return /* @__PURE__ */ jsxs46("div", { css: SearchAndFilterOptionsContainer, children: [
|
|
8765
|
-
/* @__PURE__ */
|
|
8766
|
-
buttonRow ? /* @__PURE__ */
|
|
8816
|
+
/* @__PURE__ */ jsx85("div", { css: SearchAndFilterOptionsInnerContainer, children }),
|
|
8817
|
+
buttonRow ? /* @__PURE__ */ jsx85(
|
|
8767
8818
|
HorizontalRhythm8,
|
|
8768
8819
|
{
|
|
8769
8820
|
css: SearchAndFilterButtonGroup,
|
|
@@ -8773,7 +8824,7 @@ var SearchAndFilterOptionsContainer2 = ({
|
|
|
8773
8824
|
children: buttonRow
|
|
8774
8825
|
}
|
|
8775
8826
|
) : null,
|
|
8776
|
-
additionalFiltersContainer ? /* @__PURE__ */
|
|
8827
|
+
additionalFiltersContainer ? /* @__PURE__ */ jsx85("div", { children: additionalFiltersContainer }) : null
|
|
8777
8828
|
] });
|
|
8778
8829
|
};
|
|
8779
8830
|
var FilterMenu = ({
|
|
@@ -8793,15 +8844,15 @@ var FilterMenu = ({
|
|
|
8793
8844
|
(_a = innerMenuRef.current) == null ? void 0 : _a.focus();
|
|
8794
8845
|
}
|
|
8795
8846
|
}, [filterVisibility]);
|
|
8796
|
-
return /* @__PURE__ */
|
|
8847
|
+
return /* @__PURE__ */ jsx85(VerticalRhythm6, { gap: "sm", "aria-haspopup": "true", id, "data-testid": dataTestId, children: filterVisibility ? /* @__PURE__ */ jsxs46(
|
|
8797
8848
|
SearchAndFilterOptionsContainer2,
|
|
8798
8849
|
{
|
|
8799
8850
|
buttonRow: menuControls,
|
|
8800
8851
|
additionalFiltersContainer,
|
|
8801
8852
|
children: [
|
|
8802
8853
|
/* @__PURE__ */ jsxs46(HorizontalRhythm8, { gap: "sm", align: "center", justify: "space-between", children: [
|
|
8803
|
-
/* @__PURE__ */
|
|
8804
|
-
(filters == null ? void 0 : filters.length) ? /* @__PURE__ */
|
|
8854
|
+
filterTitle ? /* @__PURE__ */ jsx85("span", { css: Title, ref: innerMenuRef, tabIndex: 0, children: filterTitle }) : null,
|
|
8855
|
+
(filters == null ? void 0 : filters.length) && resetButtonText ? /* @__PURE__ */ jsx85(
|
|
8805
8856
|
"button",
|
|
8806
8857
|
{
|
|
8807
8858
|
type: "button",
|
|
@@ -8822,7 +8873,7 @@ var FilterMenu = ({
|
|
|
8822
8873
|
};
|
|
8823
8874
|
|
|
8824
8875
|
// src/components/SearchAndFilter/FilterItem.tsx
|
|
8825
|
-
import { jsx as
|
|
8876
|
+
import { jsx as jsx86, jsxs as jsxs47 } from "@emotion/react/jsx-runtime";
|
|
8826
8877
|
var FilterItem = ({
|
|
8827
8878
|
index,
|
|
8828
8879
|
paramOptions,
|
|
@@ -8830,7 +8881,8 @@ var FilterItem = ({
|
|
|
8830
8881
|
valueOptions,
|
|
8831
8882
|
onParamChange,
|
|
8832
8883
|
onOperatorChange,
|
|
8833
|
-
onValueChange
|
|
8884
|
+
onValueChange,
|
|
8885
|
+
initialCriteriaTitle = "Where"
|
|
8834
8886
|
}) => {
|
|
8835
8887
|
var _a, _b;
|
|
8836
8888
|
const { filters, handleDeleteFilter, filterOptions } = useSearchAndFilter();
|
|
@@ -8838,7 +8890,7 @@ var FilterItem = ({
|
|
|
8838
8890
|
const operatorLabel = filters[index].operator !== "" ? `operator ${filters[index].operator}` : "unknown operator";
|
|
8839
8891
|
const metaDataLabel = filters[index].value !== "" ? `value ${filters[index].value}` : "unknown value";
|
|
8840
8892
|
const metaDataPossibleOptions = (_b = (_a = operatorOptions.find((op) => filters[index].operator === op.value)) == null ? void 0 : _a.editorType) != null ? _b : "singleChoice";
|
|
8841
|
-
const { selectedFieldValue, selectedOperatorValue, selectedMetaValue, readOnly, bindable } =
|
|
8893
|
+
const { selectedFieldValue, selectedOperatorValue, selectedMetaValue, readOnly, bindable } = useMemo23(() => {
|
|
8842
8894
|
var _a2;
|
|
8843
8895
|
const currentSelectedFilter = filterOptions.find((item) => {
|
|
8844
8896
|
var _a3;
|
|
@@ -8866,9 +8918,9 @@ var FilterItem = ({
|
|
|
8866
8918
|
isClearable: false
|
|
8867
8919
|
} : {};
|
|
8868
8920
|
return /* @__PURE__ */ jsxs47("div", { css: ConditionalFilterRow, "data-testid": "filter-item", children: [
|
|
8869
|
-
/* @__PURE__ */
|
|
8921
|
+
/* @__PURE__ */ jsx86("span", { children: index === 0 ? initialCriteriaTitle : "and" }),
|
|
8870
8922
|
/* @__PURE__ */ jsxs47("div", { css: ConditionalInputRow, children: [
|
|
8871
|
-
/* @__PURE__ */
|
|
8923
|
+
/* @__PURE__ */ jsx86(
|
|
8872
8924
|
InputComboBox5,
|
|
8873
8925
|
{
|
|
8874
8926
|
"aria-label": label,
|
|
@@ -8895,7 +8947,7 @@ var FilterItem = ({
|
|
|
8895
8947
|
name: `filter-field-${index}`
|
|
8896
8948
|
}
|
|
8897
8949
|
),
|
|
8898
|
-
/* @__PURE__ */
|
|
8950
|
+
/* @__PURE__ */ jsx86(
|
|
8899
8951
|
InputComboBox5,
|
|
8900
8952
|
{
|
|
8901
8953
|
"aria-label": operatorLabel,
|
|
@@ -8919,7 +8971,7 @@ var FilterItem = ({
|
|
|
8919
8971
|
name: `filter-operator-${index}`
|
|
8920
8972
|
}
|
|
8921
8973
|
),
|
|
8922
|
-
/* @__PURE__ */
|
|
8974
|
+
/* @__PURE__ */ jsx86(
|
|
8923
8975
|
FilterEditorRenderer,
|
|
8924
8976
|
{
|
|
8925
8977
|
"aria-label": metaDataLabel,
|
|
@@ -8933,7 +8985,7 @@ var FilterItem = ({
|
|
|
8933
8985
|
valueTestId: "filter-value"
|
|
8934
8986
|
}
|
|
8935
8987
|
),
|
|
8936
|
-
readOnly
|
|
8988
|
+
readOnly ? null : /* @__PURE__ */ jsx86(
|
|
8937
8989
|
"button",
|
|
8938
8990
|
{
|
|
8939
8991
|
type: "button",
|
|
@@ -8941,7 +8993,8 @@ var FilterItem = ({
|
|
|
8941
8993
|
"aria-label": "delete filter",
|
|
8942
8994
|
css: IconBtn,
|
|
8943
8995
|
"data-testid": "delete-filter",
|
|
8944
|
-
|
|
8996
|
+
disabled: filters.length === 1,
|
|
8997
|
+
children: /* @__PURE__ */ jsx86(Icon8, { icon: "trash", iconColor: filters.length === 1 ? "gray" : "red", size: "1rem" })
|
|
8945
8998
|
}
|
|
8946
8999
|
)
|
|
8947
9000
|
] })
|
|
@@ -8949,7 +9002,10 @@ var FilterItem = ({
|
|
|
8949
9002
|
};
|
|
8950
9003
|
var FilterItems = ({
|
|
8951
9004
|
addButtonText = "add condition",
|
|
8952
|
-
additionalFiltersContainer
|
|
9005
|
+
additionalFiltersContainer,
|
|
9006
|
+
filterTitle,
|
|
9007
|
+
resetButtonText,
|
|
9008
|
+
initialCriteriaTitle
|
|
8953
9009
|
}) => {
|
|
8954
9010
|
const { filterOptions, filters, setFilters, handleAddFilter } = useSearchAndFilter();
|
|
8955
9011
|
const handleUpdateFilter = (index, prop, value) => {
|
|
@@ -8983,7 +9039,7 @@ var FilterItems = ({
|
|
|
8983
9039
|
}
|
|
8984
9040
|
setFilters(next);
|
|
8985
9041
|
};
|
|
8986
|
-
return /* @__PURE__ */
|
|
9042
|
+
return /* @__PURE__ */ jsx86(
|
|
8987
9043
|
FilterMenu,
|
|
8988
9044
|
{
|
|
8989
9045
|
id: "search-and-filter-options",
|
|
@@ -8996,12 +9052,14 @@ var FilterItems = ({
|
|
|
8996
9052
|
onClick: handleAddFilter,
|
|
8997
9053
|
"data-testid": "add-filter",
|
|
8998
9054
|
children: [
|
|
8999
|
-
/* @__PURE__ */
|
|
9055
|
+
/* @__PURE__ */ jsx86(Icon8, { icon: "math-plus", iconColor: "currentColor", size: "1rem" }),
|
|
9000
9056
|
addButtonText
|
|
9001
9057
|
]
|
|
9002
9058
|
}
|
|
9003
9059
|
),
|
|
9004
9060
|
additionalFiltersContainer,
|
|
9061
|
+
filterTitle,
|
|
9062
|
+
resetButtonText,
|
|
9005
9063
|
children: filters.map((item, i) => {
|
|
9006
9064
|
var _a, _b, _c, _d, _e, _f;
|
|
9007
9065
|
const availableTypeOptions = (_b = (_a = filterOptions.find((fo) => {
|
|
@@ -9010,7 +9068,7 @@ var FilterItems = ({
|
|
|
9010
9068
|
})) == null ? void 0 : _a.options) != null ? _b : [];
|
|
9011
9069
|
const possibleValueOptions = (_d = (_c = availableTypeOptions == null ? void 0 : availableTypeOptions.find((op) => op.value === item.field)) == null ? void 0 : _c.valueOptions) != null ? _d : [];
|
|
9012
9070
|
const possibleOperators = (_f = (_e = availableTypeOptions == null ? void 0 : availableTypeOptions.find((op) => op.value === item.field)) == null ? void 0 : _e.operatorOptions) != null ? _f : [];
|
|
9013
|
-
return /* @__PURE__ */
|
|
9071
|
+
return /* @__PURE__ */ jsx86(
|
|
9014
9072
|
FilterItem,
|
|
9015
9073
|
{
|
|
9016
9074
|
index: i,
|
|
@@ -9019,7 +9077,8 @@ var FilterItems = ({
|
|
|
9019
9077
|
operatorOptions: possibleOperators,
|
|
9020
9078
|
onOperatorChange: (e) => handleUpdateFilter(i, "operator", e),
|
|
9021
9079
|
onValueChange: (e) => handleUpdateFilter(i, "value", e),
|
|
9022
|
-
valueOptions: possibleValueOptions
|
|
9080
|
+
valueOptions: possibleValueOptions,
|
|
9081
|
+
initialCriteriaTitle
|
|
9023
9082
|
},
|
|
9024
9083
|
i
|
|
9025
9084
|
);
|
|
@@ -9033,7 +9092,7 @@ import { VerticalRhythm as VerticalRhythm7 } from "@uniformdev/design-system";
|
|
|
9033
9092
|
|
|
9034
9093
|
// src/components/SearchAndFilter/SearchAndFilterResultContainer.tsx
|
|
9035
9094
|
import { Button as Button6, Callout as Callout6, HorizontalRhythm as HorizontalRhythm9, Paragraph } from "@uniformdev/design-system";
|
|
9036
|
-
import { Fragment as Fragment17, jsx as
|
|
9095
|
+
import { Fragment as Fragment17, jsx as jsx87, jsxs as jsxs48 } from "@emotion/react/jsx-runtime";
|
|
9037
9096
|
var SearchAndFilterResultContainer = ({
|
|
9038
9097
|
buttonText,
|
|
9039
9098
|
clearButtonLabel = "clear",
|
|
@@ -9070,11 +9129,11 @@ var SearchAndFilterResultContainer = ({
|
|
|
9070
9129
|
" results ",
|
|
9071
9130
|
searchTerm ? `for "${searchTerm}"` : null
|
|
9072
9131
|
] }),
|
|
9073
|
-
!searchTerm || hideClearButton ? null : /* @__PURE__ */
|
|
9132
|
+
!searchTerm || hideClearButton ? null : /* @__PURE__ */ jsx87(Button6, { buttonType: "ghostDestructive", size: "zero", onClick: handleClearSearch, children: clearButtonLabel })
|
|
9074
9133
|
] }),
|
|
9075
9134
|
totalResults === 0 ? /* @__PURE__ */ jsxs48(Callout6, { title: calloutTitle != null ? calloutTitle : automateCalloutTitle(), type: "note", children: [
|
|
9076
|
-
calloutText ? /* @__PURE__ */
|
|
9077
|
-
hideClearButton ? null : /* @__PURE__ */
|
|
9135
|
+
calloutText ? /* @__PURE__ */ jsx87(Paragraph, { children: calloutText }) : null,
|
|
9136
|
+
hideClearButton ? null : /* @__PURE__ */ jsx87(
|
|
9078
9137
|
Button6,
|
|
9079
9138
|
{
|
|
9080
9139
|
buttonType: "tertiaryOutline",
|
|
@@ -9089,14 +9148,14 @@ var SearchAndFilterResultContainer = ({
|
|
|
9089
9148
|
};
|
|
9090
9149
|
|
|
9091
9150
|
// src/components/SearchAndFilter/SearchAndFilter.tsx
|
|
9092
|
-
import { jsx as
|
|
9151
|
+
import { jsx as jsx88, jsxs as jsxs49 } from "@emotion/react/jsx-runtime";
|
|
9093
9152
|
var SearchAndFilter = ({
|
|
9094
9153
|
filters,
|
|
9095
9154
|
filterOptions,
|
|
9096
9155
|
filterVisible,
|
|
9097
9156
|
filterControls,
|
|
9098
9157
|
viewSwitchControls,
|
|
9099
|
-
resultsContainerView = /* @__PURE__ */
|
|
9158
|
+
resultsContainerView = /* @__PURE__ */ jsx88(SearchAndFilterResultContainer, {}),
|
|
9100
9159
|
filterMapper: filterMapper2 = filterMapper,
|
|
9101
9160
|
additionalFiltersContainer,
|
|
9102
9161
|
onChange,
|
|
@@ -9106,7 +9165,7 @@ var SearchAndFilter = ({
|
|
|
9106
9165
|
allowBindingSearchTerm = false,
|
|
9107
9166
|
resetFilterValues = []
|
|
9108
9167
|
}) => {
|
|
9109
|
-
return /* @__PURE__ */
|
|
9168
|
+
return /* @__PURE__ */ jsx88(
|
|
9110
9169
|
SearchAndFilterProvider,
|
|
9111
9170
|
{
|
|
9112
9171
|
filters,
|
|
@@ -9121,16 +9180,16 @@ var SearchAndFilter = ({
|
|
|
9121
9180
|
allowBindingSearchTerm,
|
|
9122
9181
|
children: /* @__PURE__ */ jsxs49(VerticalRhythm7, { "data-testid": "search-and-filter", children: [
|
|
9123
9182
|
/* @__PURE__ */ jsxs49("div", { css: SearchAndFilterOutterControlWrapper(viewSwitchControls ? "1fr auto" : "1fr"), children: [
|
|
9124
|
-
/* @__PURE__ */
|
|
9183
|
+
/* @__PURE__ */ jsx88(
|
|
9125
9184
|
"div",
|
|
9126
9185
|
{
|
|
9127
9186
|
css: SearchAndFilterControlsWrapper(viewSwitchControls ? "auto 1fr 0.05fr" : "auto 1fr"),
|
|
9128
|
-
children: !filterControls ? /* @__PURE__ */
|
|
9187
|
+
children: !filterControls ? /* @__PURE__ */ jsx88(FilterControls, { hideSearchInput: !onSearchChange }) : filterControls
|
|
9129
9188
|
}
|
|
9130
9189
|
),
|
|
9131
9190
|
viewSwitchControls
|
|
9132
9191
|
] }),
|
|
9133
|
-
/* @__PURE__ */
|
|
9192
|
+
/* @__PURE__ */ jsx88(FilterItems, { additionalFiltersContainer }),
|
|
9134
9193
|
resultsContainerView
|
|
9135
9194
|
] })
|
|
9136
9195
|
}
|
|
@@ -9141,7 +9200,7 @@ var SearchAndFilter = ({
|
|
|
9141
9200
|
import { InputKeywordSearch as InputKeywordSearch3 } from "@uniformdev/design-system";
|
|
9142
9201
|
import { createContext as createContext7, useState as useState26 } from "react";
|
|
9143
9202
|
import { useDebounce as useDebounce10 } from "react-use";
|
|
9144
|
-
import { jsx as
|
|
9203
|
+
import { jsx as jsx89 } from "@emotion/react/jsx-runtime";
|
|
9145
9204
|
var SearchOnlyContext = createContext7({
|
|
9146
9205
|
searchTerm: "",
|
|
9147
9206
|
setSearchTerm: () => {
|
|
@@ -9158,14 +9217,14 @@ var SearchOnlyFilter = ({ onSearchChange, maxWidth }) => {
|
|
|
9158
9217
|
300,
|
|
9159
9218
|
[localeSearchTerm]
|
|
9160
9219
|
);
|
|
9161
|
-
return /* @__PURE__ */
|
|
9220
|
+
return /* @__PURE__ */ jsx89(
|
|
9162
9221
|
SearchOnlyContext.Provider,
|
|
9163
9222
|
{
|
|
9164
9223
|
value: {
|
|
9165
9224
|
searchTerm,
|
|
9166
9225
|
setSearchTerm: setLocaleSearchTerm
|
|
9167
9226
|
},
|
|
9168
|
-
children: /* @__PURE__ */
|
|
9227
|
+
children: /* @__PURE__ */ jsx89("div", { css: { maxWidth: maxWidth != null ? maxWidth : "712px" }, children: /* @__PURE__ */ jsx89(
|
|
9169
9228
|
InputKeywordSearch3,
|
|
9170
9229
|
{
|
|
9171
9230
|
placeholder: "Search...",
|
|
@@ -9416,7 +9475,7 @@ var InputVariableWrapper = css39`
|
|
|
9416
9475
|
`;
|
|
9417
9476
|
|
|
9418
9477
|
// src/components/SearchAndFilter/SortItems.tsx
|
|
9419
|
-
import { jsx as
|
|
9478
|
+
import { jsx as jsx90, jsxs as jsxs50 } from "@emotion/react/jsx-runtime";
|
|
9420
9479
|
var SortItems = ({
|
|
9421
9480
|
sortByLabel = "Sort by",
|
|
9422
9481
|
localeLabel = "Show locale",
|
|
@@ -9440,9 +9499,9 @@ var SortItems = ({
|
|
|
9440
9499
|
const localeLabelValue = sortOptions.length > 1 ? localeLabel : `${localeLabel}s`;
|
|
9441
9500
|
return /* @__PURE__ */ jsxs50("div", { css: [SortFilterWrapper(hideLocaleOptions)], "data-testid": "sorting-options", children: [
|
|
9442
9501
|
/* @__PURE__ */ jsxs50(VerticalRhythm8, { gap: "xs", children: [
|
|
9443
|
-
/* @__PURE__ */
|
|
9502
|
+
/* @__PURE__ */ jsx90("span", { css: Title2, children: sortByLabel }),
|
|
9444
9503
|
/* @__PURE__ */ jsxs50("div", { css: SortFilterInputRow, children: [
|
|
9445
|
-
/* @__PURE__ */
|
|
9504
|
+
/* @__PURE__ */ jsx90(
|
|
9446
9505
|
InputVariables,
|
|
9447
9506
|
{
|
|
9448
9507
|
disableInlineMenu: disableSortBinding,
|
|
@@ -9450,7 +9509,7 @@ var SortItems = ({
|
|
|
9450
9509
|
value: sortField,
|
|
9451
9510
|
valueToResetTo: "created_at",
|
|
9452
9511
|
onChange: (e) => onSortChange(`${e}_${sortDirection}`),
|
|
9453
|
-
inputWhenNoVariables: /* @__PURE__ */
|
|
9512
|
+
inputWhenNoVariables: /* @__PURE__ */ jsx90(
|
|
9454
9513
|
InputComboBox6,
|
|
9455
9514
|
{
|
|
9456
9515
|
id: "sort-by-field",
|
|
@@ -9473,7 +9532,7 @@ var SortItems = ({
|
|
|
9473
9532
|
)
|
|
9474
9533
|
}
|
|
9475
9534
|
),
|
|
9476
|
-
/* @__PURE__ */
|
|
9535
|
+
/* @__PURE__ */ jsx90(
|
|
9477
9536
|
InputVariables,
|
|
9478
9537
|
{
|
|
9479
9538
|
disableInlineMenu: disableSortBinding,
|
|
@@ -9481,7 +9540,7 @@ var SortItems = ({
|
|
|
9481
9540
|
valueToResetTo: "DESC",
|
|
9482
9541
|
showMenuPosition: disableSortBinding ? void 0 : "inline-right",
|
|
9483
9542
|
onChange: (e) => onSortChange(`${sortField}_${e}`),
|
|
9484
|
-
inputWhenNoVariables: /* @__PURE__ */
|
|
9543
|
+
inputWhenNoVariables: /* @__PURE__ */ jsx90(
|
|
9485
9544
|
SegmentedControl,
|
|
9486
9545
|
{
|
|
9487
9546
|
noCheckmark: true,
|
|
@@ -9513,14 +9572,14 @@ var SortItems = ({
|
|
|
9513
9572
|
)
|
|
9514
9573
|
] })
|
|
9515
9574
|
] }),
|
|
9516
|
-
hideLocaleOptions ? null : /* @__PURE__ */
|
|
9575
|
+
hideLocaleOptions ? null : /* @__PURE__ */ jsx90(VerticalRhythm8, { gap: "xs", css: InputVariableWrapper, children: /* @__PURE__ */ jsx90(
|
|
9517
9576
|
InputVariables,
|
|
9518
9577
|
{
|
|
9519
9578
|
label: localeLabelValue,
|
|
9520
9579
|
value: localeValue,
|
|
9521
9580
|
showMenuPosition: "inline-right",
|
|
9522
9581
|
onChange: (e) => onLocaleChange(e != null ? e : ""),
|
|
9523
|
-
inputWhenNoVariables: /* @__PURE__ */
|
|
9582
|
+
inputWhenNoVariables: /* @__PURE__ */ jsx90(
|
|
9524
9583
|
InputSelect8,
|
|
9525
9584
|
{
|
|
9526
9585
|
name: "localeReturned",
|
|
@@ -9729,6 +9788,7 @@ export {
|
|
|
9729
9788
|
Switch,
|
|
9730
9789
|
TEXTBOX_OPERATORS,
|
|
9731
9790
|
TextEditor,
|
|
9791
|
+
TextMultiChoiceEditor,
|
|
9732
9792
|
TextVariableRenderer,
|
|
9733
9793
|
Textarea,
|
|
9734
9794
|
Theme3 as Theme,
|