@uniformdev/mesh-sdk-react 20.7.1-alpha.12 → 20.7.1-alpha.120
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/LICENSE.txt +1 -1
- package/dist/index.d.mts +62 -10
- package/dist/index.d.ts +62 -10
- package/dist/index.esm.js +137 -61
- package/dist/index.js +139 -66
- package/dist/index.mjs +137 -61
- package/package.json +11 -11
package/dist/index.mjs
CHANGED
|
@@ -774,7 +774,7 @@ import { zodResolver } from "@hookform/resolvers/zod";
|
|
|
774
774
|
import { Button, Callout, HorizontalRhythm, Input, useShortcut } from "@uniformdev/design-system";
|
|
775
775
|
import { useLayoutEffect, useRef as useRef2 } from "react";
|
|
776
776
|
import { useForm } from "react-hook-form";
|
|
777
|
-
import
|
|
777
|
+
import * as z from "zod";
|
|
778
778
|
|
|
779
779
|
// src/components/Variables/styles/VariableEditor.styles.ts
|
|
780
780
|
import { css as css2 } from "@emotion/react";
|
|
@@ -1244,7 +1244,8 @@ function VariablesPlugin({
|
|
|
1244
1244
|
enableEditingVariables,
|
|
1245
1245
|
getEditorContext,
|
|
1246
1246
|
replaceValueOnVariableInsert,
|
|
1247
|
-
filterVariable
|
|
1247
|
+
filterVariable,
|
|
1248
|
+
disableVariableDisplayNames
|
|
1248
1249
|
}) {
|
|
1249
1250
|
const [editor] = useLexicalComposerContext2();
|
|
1250
1251
|
const { variables, dispatch, isEditing, canDispatch, readOnly, knownUndefinedValues, isLoading } = useVariables(true);
|
|
@@ -1322,9 +1323,10 @@ function VariablesPlugin({
|
|
|
1322
1323
|
});
|
|
1323
1324
|
return;
|
|
1324
1325
|
}
|
|
1326
|
+
const initialDisplayName = disableVariableDisplayNames ? prettifyBindExpression(result.selectedVariable.name) : result.selectedVariable.displayName;
|
|
1325
1327
|
editor.dispatchCommand(INSERT_VARIABLE_COMMAND, {
|
|
1326
1328
|
variable: result.selectedVariable.name,
|
|
1327
|
-
initialDisplayName
|
|
1329
|
+
initialDisplayName,
|
|
1328
1330
|
targetKey: sourceKey,
|
|
1329
1331
|
overwriteExistingValue: replaceValueOnVariableInsert
|
|
1330
1332
|
});
|
|
@@ -1372,9 +1374,10 @@ function VariablesPlugin({
|
|
|
1372
1374
|
if (result.canceled) {
|
|
1373
1375
|
return;
|
|
1374
1376
|
}
|
|
1377
|
+
const initialDisplayName = disableVariableDisplayNames ? prettifyBindExpression(result.selectedVariable.name) : result.selectedVariable.displayName;
|
|
1375
1378
|
editor.dispatchCommand(INSERT_VARIABLE_COMMAND, {
|
|
1376
1379
|
variable: result.selectedVariable.name,
|
|
1377
|
-
initialDisplayName
|
|
1380
|
+
initialDisplayName,
|
|
1378
1381
|
targetKey: void 0,
|
|
1379
1382
|
overwriteExistingValue: replaceValueOnVariableInsert
|
|
1380
1383
|
});
|
|
@@ -1393,8 +1396,9 @@ function VariablesPlugin({
|
|
|
1393
1396
|
var _a, _b;
|
|
1394
1397
|
if (!disableVariables) {
|
|
1395
1398
|
const targetVariable = variablesRef.current.variables[reference];
|
|
1399
|
+
const displayName = disableVariableDisplayNames ? prettifyBindExpression(reference) : initialDisplayName != null ? initialDisplayName : (targetVariable == null ? void 0 : targetVariable.displayName) || prettifyBindExpression(reference);
|
|
1396
1400
|
const variableNode = $createVariableNode(reference, {
|
|
1397
|
-
displayName
|
|
1401
|
+
displayName,
|
|
1398
1402
|
hasClickEvent: canEditVariable(reference, targetVariable),
|
|
1399
1403
|
referenceIsValid: true,
|
|
1400
1404
|
tooltip: (_a = targetVariable == null ? void 0 : targetVariable.tooltip) != null ? _a : targetVariable == null ? void 0 : targetVariable.helpText,
|
|
@@ -1431,7 +1435,8 @@ function VariablesPlugin({
|
|
|
1431
1435
|
readOnly,
|
|
1432
1436
|
getEditorContext,
|
|
1433
1437
|
editVariable,
|
|
1434
|
-
replaceValueOnVariableInsert
|
|
1438
|
+
replaceValueOnVariableInsert,
|
|
1439
|
+
disableVariableDisplayNames
|
|
1435
1440
|
]);
|
|
1436
1441
|
const updateExistingNodeIfChanged = useCallback2(
|
|
1437
1442
|
(variableNode) => {
|
|
@@ -1444,9 +1449,10 @@ function VariablesPlugin({
|
|
|
1444
1449
|
return;
|
|
1445
1450
|
}
|
|
1446
1451
|
const tooltip = (_d = (_c = (_b = (_a = targetVar == null ? void 0 : targetVar.tooltip) != null ? _a : targetVar == null ? void 0 : targetVar.helpText) != null ? _b : targetUndefinedVar == null ? void 0 : targetUndefinedVar.error) != null ? _c : targetUndefinedVar == null ? void 0 : targetUndefinedVar.warning) != null ? _d : targetUndefinedVar == null ? void 0 : targetUndefinedVar.info;
|
|
1452
|
+
const displayName = disableVariableDisplayNames ? prettifyBindExpression(variableNode.reference) : (targetVar == null ? void 0 : targetVar.displayName) || (targetUndefinedVar == null ? void 0 : targetUndefinedVar.displayName) || prettifyBindExpression(variableNode.reference);
|
|
1447
1453
|
const newState = {
|
|
1448
1454
|
...currentState,
|
|
1449
|
-
displayName
|
|
1455
|
+
displayName,
|
|
1450
1456
|
isLoading: isLoadingVariables && !targetVar && !(targetUndefinedVar == null ? void 0 : targetUndefinedVar.info),
|
|
1451
1457
|
hasClickEvent: canEditVariable(variableNode.reference, targetVar),
|
|
1452
1458
|
referenceIsValid: (targetUndefinedVar == null ? void 0 : targetUndefinedVar.error) ? false : (targetUndefinedVar == null ? void 0 : targetUndefinedVar.warning) ? "warning" : (targetUndefinedVar == null ? void 0 : targetUndefinedVar.info) ? "info" : isLoadingVariables ? true : Boolean(targetVar),
|
|
@@ -1457,7 +1463,7 @@ function VariablesPlugin({
|
|
|
1457
1463
|
variableNode.setState(newState);
|
|
1458
1464
|
}
|
|
1459
1465
|
},
|
|
1460
|
-
[canEditVariable]
|
|
1466
|
+
[canEditVariable, disableVariableDisplayNames]
|
|
1461
1467
|
);
|
|
1462
1468
|
useEffect4(() => {
|
|
1463
1469
|
let selection;
|
|
@@ -1616,6 +1622,14 @@ var VariableNode = class _VariableNode extends DecoratorNode {
|
|
|
1616
1622
|
updateDOM() {
|
|
1617
1623
|
return false;
|
|
1618
1624
|
}
|
|
1625
|
+
static importDOM() {
|
|
1626
|
+
return {
|
|
1627
|
+
binding: () => ({
|
|
1628
|
+
conversion: $convertBindingElement,
|
|
1629
|
+
priority: 0
|
|
1630
|
+
})
|
|
1631
|
+
};
|
|
1632
|
+
}
|
|
1619
1633
|
/**
|
|
1620
1634
|
* Render the variable node using React.
|
|
1621
1635
|
* NOTE: this is effectively an island of React, and you may not call hooks,
|
|
@@ -1625,6 +1639,21 @@ var VariableNode = class _VariableNode extends DecoratorNode {
|
|
|
1625
1639
|
return /* @__PURE__ */ jsx22(VariableNodeComponent, { state: this.__state, reference: this.reference, nodeKey: this.__key });
|
|
1626
1640
|
}
|
|
1627
1641
|
};
|
|
1642
|
+
function $convertBindingElement(domNode) {
|
|
1643
|
+
const element = domNode;
|
|
1644
|
+
const reference = element.textContent.replace(variablePrefix, "").replace(variableSuffix, "");
|
|
1645
|
+
const node = $createVariableNode(reference, {
|
|
1646
|
+
displayName: prettifyBindExpression(reference),
|
|
1647
|
+
hasClickEvent: true,
|
|
1648
|
+
referenceIsValid: true,
|
|
1649
|
+
tooltip: void 0,
|
|
1650
|
+
isFresh: true,
|
|
1651
|
+
isLoading: false
|
|
1652
|
+
});
|
|
1653
|
+
return {
|
|
1654
|
+
node
|
|
1655
|
+
};
|
|
1656
|
+
}
|
|
1628
1657
|
function $createVariableNode(variableReference, state) {
|
|
1629
1658
|
return new VariableNode(variableReference, state);
|
|
1630
1659
|
}
|
|
@@ -1808,7 +1837,7 @@ var menuBtn2 = css4`
|
|
|
1808
1837
|
transform: translateY(-50%);
|
|
1809
1838
|
`;
|
|
1810
1839
|
var input = css4`
|
|
1811
|
-
--input-padding: 12px var(--spacing-
|
|
1840
|
+
--input-padding: 12px var(--spacing-lg) 12px var(--spacing-sm);
|
|
1812
1841
|
appearance: none;
|
|
1813
1842
|
background-color: var(--white);
|
|
1814
1843
|
border: 1px solid var(--gray-300);
|
|
@@ -1945,6 +1974,7 @@ var input2 = css5`
|
|
|
1945
1974
|
&:disabled,
|
|
1946
1975
|
&:disabled::placeholder,
|
|
1947
1976
|
&:disabled:hover {
|
|
1977
|
+
border-color: var(--gray-200);
|
|
1948
1978
|
border-radius: var(--rounded-sm);
|
|
1949
1979
|
cursor: not-allowed;
|
|
1950
1980
|
color: var(--gray-400);
|
|
@@ -1954,6 +1984,7 @@ var input2 = css5`
|
|
|
1954
1984
|
&[contenteditable='false'] {
|
|
1955
1985
|
cursor: not-allowed;
|
|
1956
1986
|
color: var(--gray-400);
|
|
1987
|
+
border-color: var(--gray-200);
|
|
1957
1988
|
}
|
|
1958
1989
|
|
|
1959
1990
|
> p {
|
|
@@ -2460,7 +2491,8 @@ function InputVariables(props) {
|
|
|
2460
2491
|
styleVariant = "default",
|
|
2461
2492
|
renderMenuInPortal,
|
|
2462
2493
|
disableDismissEditorOnChange,
|
|
2463
|
-
singleTokenMode
|
|
2494
|
+
singleTokenMode,
|
|
2495
|
+
disableVariableDisplayNames
|
|
2464
2496
|
} = props;
|
|
2465
2497
|
const [finalId] = useState7(id != null ? id : () => v4());
|
|
2466
2498
|
const { dispatch, canDispatch, isEditing } = useVariables(true);
|
|
@@ -2483,7 +2515,7 @@ function InputVariables(props) {
|
|
|
2483
2515
|
gap: "xs",
|
|
2484
2516
|
css: css7`
|
|
2485
2517
|
position: relative;
|
|
2486
|
-
& > div:first-
|
|
2518
|
+
& > div:first-of-type {
|
|
2487
2519
|
flex-grow: 1;
|
|
2488
2520
|
}
|
|
2489
2521
|
`,
|
|
@@ -2569,6 +2601,7 @@ function InputVariables(props) {
|
|
|
2569
2601
|
replaceValueOnVariableInsert: useInputWithNoVariables,
|
|
2570
2602
|
autoFocus,
|
|
2571
2603
|
filterVariable,
|
|
2604
|
+
disableVariableDisplayNames,
|
|
2572
2605
|
children: [
|
|
2573
2606
|
/* @__PURE__ */ jsx28(PasteTransformerPlugin, { transformPaste }),
|
|
2574
2607
|
/* @__PURE__ */ jsx28(ControlledValuePlugin, { value, enabled: singleTokenMode || useInputWithNoVariables }),
|
|
@@ -2947,6 +2980,8 @@ var variableValue = css9`
|
|
|
2947
2980
|
|
|
2948
2981
|
// src/components/Variables/VariablesList.tsx
|
|
2949
2982
|
import { Fragment as Fragment8, jsx as jsx33, jsxs as jsxs16 } from "@emotion/react/jsx-runtime";
|
|
2983
|
+
var DroppableHack = Droppable;
|
|
2984
|
+
var DraggableHack = Draggable;
|
|
2950
2985
|
function VariablesList() {
|
|
2951
2986
|
const { variables, dispatch, readOnly } = useVariables();
|
|
2952
2987
|
const sorted = variablesToList(variables).filter((variable) => !variable.system);
|
|
@@ -2968,7 +3003,7 @@ function VariablesList() {
|
|
|
2968
3003
|
}
|
|
2969
3004
|
};
|
|
2970
3005
|
return /* @__PURE__ */ jsxs16(Fragment8, { children: [
|
|
2971
|
-
/* @__PURE__ */ jsx33(DragDropContext, { onDragEnd: (res) => onDragEnd(res), children: /* @__PURE__ */ jsx33(
|
|
3006
|
+
/* @__PURE__ */ jsx33(DragDropContext, { onDragEnd: (res) => onDragEnd(res), children: /* @__PURE__ */ jsx33(DroppableHack, { droppableId: "variables-table", children: (provided) => /* @__PURE__ */ jsxs16(Table, { ...provided.droppableProps, ref: provided.innerRef, children: [
|
|
2972
3007
|
/* @__PURE__ */ jsx33(TableHead, { children: /* @__PURE__ */ jsxs16(TableRow, { children: [
|
|
2973
3008
|
/* @__PURE__ */ jsx33(TableCellHead, { children: "Name" }),
|
|
2974
3009
|
/* @__PURE__ */ jsx33(TableCellHead, { children: "Default Value" }),
|
|
@@ -2979,7 +3014,7 @@ function VariablesList() {
|
|
|
2979
3014
|
const text = displayName != null ? displayName : name2;
|
|
2980
3015
|
const textValue = variableDefaultTextValue(defaultValue);
|
|
2981
3016
|
return /* @__PURE__ */ jsx33(
|
|
2982
|
-
|
|
3017
|
+
DraggableHack,
|
|
2983
3018
|
{
|
|
2984
3019
|
draggableId: name2,
|
|
2985
3020
|
index,
|
|
@@ -3594,8 +3629,8 @@ function urlEncodeRequestParameter(parameter, varValues) {
|
|
|
3594
3629
|
value: decodeVariablesInUrlEncodedString(encodeURIComponent(parameter.value), varValues)
|
|
3595
3630
|
};
|
|
3596
3631
|
}
|
|
3597
|
-
function decodeVariablesInUrlEncodedString(
|
|
3598
|
-
return
|
|
3632
|
+
function decodeVariablesInUrlEncodedString(string2, varValues) {
|
|
3633
|
+
return string2.replace(/(\$|%24)%7B(.*?)%7D/g, (_all, _money, body) => {
|
|
3599
3634
|
var _a;
|
|
3600
3635
|
const varName = decodeURIComponent(body);
|
|
3601
3636
|
return ((_a = varValues == null ? void 0 : varValues[varName]) == null ? void 0 : _a.default) ? variableDefaultTextValue(varValues[varName].default) : `\${${varName}}`;
|
|
@@ -3928,7 +3963,7 @@ var DataRefreshButton = ({
|
|
|
3928
3963
|
onRefreshData,
|
|
3929
3964
|
...props
|
|
3930
3965
|
}) => {
|
|
3931
|
-
return /* @__PURE__ */ jsxs22(Button2, { buttonType: "
|
|
3966
|
+
return /* @__PURE__ */ jsxs22(Button2, { buttonType: "ghost", onClick: onRefreshData, disabled: isLoading, ...props, children: [
|
|
3932
3967
|
!isLoading ? null : /* @__PURE__ */ jsx47(
|
|
3933
3968
|
LoadingIndicator3,
|
|
3934
3969
|
{
|
|
@@ -4202,7 +4237,7 @@ var ObjectSearchListItem = ({
|
|
|
4202
4237
|
),
|
|
4203
4238
|
/* @__PURE__ */ jsxs23("div", { css: ObjectListItemInfoContainer, children: [
|
|
4204
4239
|
selected ? /* @__PURE__ */ jsx49(Chip, { text: "selected", size: "xs" }) : null,
|
|
4205
|
-
!popoverData ? null : /* @__PURE__ */ jsx49(Popover, { ariaLabel: title, buttonText: `See ${title} details`,
|
|
4240
|
+
!popoverData ? null : /* @__PURE__ */ jsx49(Popover, { ariaLabel: title, buttonText: `See ${title} details`, children: popoverData })
|
|
4206
4241
|
] }),
|
|
4207
4242
|
!children ? null : /* @__PURE__ */ jsx49("div", { css: ObjectListItemUnControlledContent, children })
|
|
4208
4243
|
]
|
|
@@ -4232,7 +4267,6 @@ var ObjectSearchContainer = ({
|
|
|
4232
4267
|
role: "list",
|
|
4233
4268
|
css: css16`
|
|
4234
4269
|
> div {
|
|
4235
|
-
transition: max-height var(--duration-slow) var(--timing-ease-out);
|
|
4236
4270
|
max-height: ${selectedListItems.length === 0 ? "50vh" : "184px"};
|
|
4237
4271
|
}
|
|
4238
4272
|
`,
|
|
@@ -4398,7 +4432,7 @@ var ObjectSearchFilterContainer2 = ({ children }) => {
|
|
|
4398
4432
|
};
|
|
4399
4433
|
|
|
4400
4434
|
// src/components/ObjectSearch/ObjectSearchResultItem.tsx
|
|
4401
|
-
import { Button as Button3, Chip as Chip2, Popover as Popover2 } from "@uniformdev/design-system";
|
|
4435
|
+
import { Button as Button3, Chip as Chip2, Link, Popover as Popover2 } from "@uniformdev/design-system";
|
|
4402
4436
|
import { format as timeagoFormat } from "timeago.js";
|
|
4403
4437
|
|
|
4404
4438
|
// src/components/Image/Image.tsx
|
|
@@ -4510,6 +4544,11 @@ var ObjectSearchResultItemTimeStamp = css19`
|
|
|
4510
4544
|
color: var(--gray-500);
|
|
4511
4545
|
font-size: var(--fs-xs);
|
|
4512
4546
|
`;
|
|
4547
|
+
var ObjectSearchResultItemTitleLink = css19`
|
|
4548
|
+
text-decoration: none;
|
|
4549
|
+
color: var(--primary-action-default);
|
|
4550
|
+
font-size: var(--fs-sm);
|
|
4551
|
+
`;
|
|
4513
4552
|
var ObjectSearchAuthorStateGroup = css19`
|
|
4514
4553
|
align-items: center;
|
|
4515
4554
|
display: flex;
|
|
@@ -4544,7 +4583,8 @@ var ObjectSearchResultItem = ({
|
|
|
4544
4583
|
publishedAt,
|
|
4545
4584
|
hideRemoveButton = false,
|
|
4546
4585
|
disableDnD = false,
|
|
4547
|
-
children
|
|
4586
|
+
children,
|
|
4587
|
+
onClick
|
|
4548
4588
|
}) => {
|
|
4549
4589
|
const { onSelectItem } = useObjectSearchContext();
|
|
4550
4590
|
const formatedContentType = Array.isArray(contentType) ? contentType.join(", ") : contentType;
|
|
@@ -4567,7 +4607,19 @@ var ObjectSearchResultItem = ({
|
|
|
4567
4607
|
/* @__PURE__ */ jsxs27("div", { children: [
|
|
4568
4608
|
/* @__PURE__ */ jsx55("span", { css: ObjectSearchResultItemSubtitle, "data-testid": "sub-title", children: formatedContentType }),
|
|
4569
4609
|
/* @__PURE__ */ jsxs27("span", { role: "heading", css: ObjectSearchResultItemTitle, "data-testid": "title", children: [
|
|
4570
|
-
|
|
4610
|
+
onClick ? /* @__PURE__ */ jsx55(
|
|
4611
|
+
Link,
|
|
4612
|
+
{
|
|
4613
|
+
onClick: (e) => {
|
|
4614
|
+
e.preventDefault();
|
|
4615
|
+
e.stopPropagation();
|
|
4616
|
+
onClick();
|
|
4617
|
+
},
|
|
4618
|
+
href: editLink,
|
|
4619
|
+
text: title != null ? title : name,
|
|
4620
|
+
css: ObjectSearchResultItemTitleLink
|
|
4621
|
+
}
|
|
4622
|
+
) : /* @__PURE__ */ jsx55("span", { children: title != null ? title : name }),
|
|
4571
4623
|
!popoverData ? null : /* @__PURE__ */ jsx55(Popover2, { ariaLabel: title, buttonText: `See ${title} details`, children: popoverData })
|
|
4572
4624
|
] }),
|
|
4573
4625
|
!createdAt && !publishStatus ? null : /* @__PURE__ */ jsxs27("div", { css: ObjectSearchAuthorStateGroup, children: [
|
|
@@ -4609,7 +4661,10 @@ function legacyThemeMapper(theme) {
|
|
|
4609
4661
|
|
|
4610
4662
|
// src/components/ObjectSearch/ObjectSearchResultList.tsx
|
|
4611
4663
|
import { Button as Button4, Counter } from "@uniformdev/design-system";
|
|
4612
|
-
import {
|
|
4664
|
+
import {
|
|
4665
|
+
Draggable as Draggable2,
|
|
4666
|
+
Droppable as Droppable2
|
|
4667
|
+
} from "react-beautiful-dnd";
|
|
4613
4668
|
|
|
4614
4669
|
// src/components/ObjectSearch/styles/ObjectSearchResultList.styles.ts
|
|
4615
4670
|
import { css as css20 } from "@emotion/react";
|
|
@@ -4638,6 +4693,8 @@ var ObjectSearchResultListTitle = css20`
|
|
|
4638
4693
|
|
|
4639
4694
|
// src/components/ObjectSearch/ObjectSearchResultList.tsx
|
|
4640
4695
|
import { Fragment as Fragment10, jsx as jsx56, jsxs as jsxs28 } from "@emotion/react/jsx-runtime";
|
|
4696
|
+
var DroppableHack2 = Droppable2;
|
|
4697
|
+
var DraggableHack2 = Draggable2;
|
|
4641
4698
|
function ObjectSearchResultList({
|
|
4642
4699
|
resultLabelText = "Selected",
|
|
4643
4700
|
removeButtonText = "Remove all",
|
|
@@ -4709,7 +4766,7 @@ function ObjectSearchResultList({
|
|
|
4709
4766
|
] })
|
|
4710
4767
|
] }),
|
|
4711
4768
|
!selectedListItems.length ? whenNothingSelected : /* @__PURE__ */ jsx56(DragDropContext, { onDragEnd: (res) => onDragEnd(res), children: /* @__PURE__ */ jsx56(
|
|
4712
|
-
|
|
4769
|
+
DroppableHack2,
|
|
4713
4770
|
{
|
|
4714
4771
|
droppableId: multiSelectId != null ? multiSelectId : "canvas-multi-select",
|
|
4715
4772
|
renderClone: getContainerForDnDReparenting ? getDraggableItem : void 0,
|
|
@@ -4717,7 +4774,7 @@ function ObjectSearchResultList({
|
|
|
4717
4774
|
children: (provided) => /* @__PURE__ */ jsxs28("div", { ...provided.droppableProps, ref: provided.innerRef, children: [
|
|
4718
4775
|
selectedListItems.map((item, i) => {
|
|
4719
4776
|
return /* @__PURE__ */ jsx56(
|
|
4720
|
-
|
|
4777
|
+
DraggableHack2,
|
|
4721
4778
|
{
|
|
4722
4779
|
draggableId: item.id,
|
|
4723
4780
|
index: i,
|
|
@@ -5167,18 +5224,6 @@ var DATE_TIME_OPERATORS = [
|
|
|
5167
5224
|
value: "sys-date-gte",
|
|
5168
5225
|
editorType: "date",
|
|
5169
5226
|
expectedValueType: "single"
|
|
5170
|
-
},
|
|
5171
|
-
{
|
|
5172
|
-
label: "is empty",
|
|
5173
|
-
value: "ndef",
|
|
5174
|
-
editorType: "empty",
|
|
5175
|
-
expectedValueType: "false"
|
|
5176
|
-
},
|
|
5177
|
-
{
|
|
5178
|
-
label: "is not empty",
|
|
5179
|
-
value: "def",
|
|
5180
|
-
editorType: "empty",
|
|
5181
|
-
expectedValueType: "true"
|
|
5182
5227
|
}
|
|
5183
5228
|
];
|
|
5184
5229
|
var RICHTEXT_OPERATORS = [
|
|
@@ -6214,8 +6259,6 @@ var SearchAndFilterOptionsContainer = css21`
|
|
|
6214
6259
|
gap: var(--spacing-sm);
|
|
6215
6260
|
padding: var(--spacing-md) 0 var(--spacing-base);
|
|
6216
6261
|
will-change: height;
|
|
6217
|
-
position: relative;
|
|
6218
|
-
z-index: 2;
|
|
6219
6262
|
`;
|
|
6220
6263
|
var SearchAndFilterOptionsInnerContainer = css21`
|
|
6221
6264
|
display: flex;
|
|
@@ -6234,8 +6277,6 @@ var SearchAndFilterAdditionalContainer = css21`
|
|
|
6234
6277
|
flex-wrap: nowrap;
|
|
6235
6278
|
gap: var(--spacing-base);
|
|
6236
6279
|
padding: var(--spacing-base) var(--spacing-md) 0;
|
|
6237
|
-
position: relative;
|
|
6238
|
-
z-index: 0;
|
|
6239
6280
|
`;
|
|
6240
6281
|
|
|
6241
6282
|
// src/components/SearchAndFilter/FilterButton.tsx
|
|
@@ -6322,6 +6363,7 @@ function withInputVariables(WrappedComponent, noSwapping = false) {
|
|
|
6322
6363
|
return /* @__PURE__ */ jsx72(
|
|
6323
6364
|
InputVariables,
|
|
6324
6365
|
{
|
|
6366
|
+
"data-testid": "filter-value",
|
|
6325
6367
|
disableInlineMenu: true,
|
|
6326
6368
|
showMenuPosition: "inline-right",
|
|
6327
6369
|
onChange: (newValue) => props.onChange(newValue != null ? newValue : ""),
|
|
@@ -6342,6 +6384,7 @@ function withInputVariablesForMultiValue(WrappedComponent) {
|
|
|
6342
6384
|
return /* @__PURE__ */ jsx72(
|
|
6343
6385
|
InputVariables,
|
|
6344
6386
|
{
|
|
6387
|
+
"data-testid": "filter-value",
|
|
6345
6388
|
disableInlineMenu: true,
|
|
6346
6389
|
showMenuPosition: "inline-right",
|
|
6347
6390
|
onChange: (newValue) => props.onChange(newValue ? [newValue] : []),
|
|
@@ -6394,6 +6437,7 @@ var SearchAndFilterProvider = ({
|
|
|
6394
6437
|
onSearchChange,
|
|
6395
6438
|
onChange,
|
|
6396
6439
|
resetFilterValues = [{ field: "", operator: "", value: "" }],
|
|
6440
|
+
onResetFilterValues,
|
|
6397
6441
|
totalResults,
|
|
6398
6442
|
filterMapper: filterMapper2 = filterMapper,
|
|
6399
6443
|
children,
|
|
@@ -6422,9 +6466,12 @@ var SearchAndFilterProvider = ({
|
|
|
6422
6466
|
onChange([...filters, { field: "", operator: "", value: "" }]);
|
|
6423
6467
|
}, [filters, onChange]);
|
|
6424
6468
|
const handleResetFilters = useCallback6(() => {
|
|
6469
|
+
if (onResetFilterValues) {
|
|
6470
|
+
return onResetFilterValues();
|
|
6471
|
+
}
|
|
6425
6472
|
onSearchChange == null ? void 0 : onSearchChange("");
|
|
6426
6473
|
onChange(resetFilterValues);
|
|
6427
|
-
}, [onChange, resetFilterValues, onSearchChange]);
|
|
6474
|
+
}, [onChange, resetFilterValues, onSearchChange, onResetFilterValues]);
|
|
6428
6475
|
const handleDeleteFilter = useCallback6(
|
|
6429
6476
|
(index) => {
|
|
6430
6477
|
const remainingFilters = filters.filter((_, i) => i !== index);
|
|
@@ -6496,17 +6543,17 @@ var FilterControls = ({
|
|
|
6496
6543
|
const editorRef = useRef9(null);
|
|
6497
6544
|
const variableRefernceCountInSearchTerm = hasReferencedVariables2(searchTerm);
|
|
6498
6545
|
const [idToResetInputVariables, setIdToResetInputVariables] = useState20("data-resource-search-term-input");
|
|
6499
|
-
const [
|
|
6546
|
+
const [localSearchTerm, setLocalSearchTerm] = useState20(searchTerm);
|
|
6500
6547
|
useDebounce7(
|
|
6501
6548
|
() => {
|
|
6502
|
-
setSearchTerm(
|
|
6549
|
+
setSearchTerm(localSearchTerm);
|
|
6503
6550
|
},
|
|
6504
6551
|
300,
|
|
6505
|
-
[
|
|
6552
|
+
[localSearchTerm]
|
|
6506
6553
|
);
|
|
6507
6554
|
useEffect18(() => {
|
|
6508
6555
|
if (searchTerm === "") {
|
|
6509
|
-
|
|
6556
|
+
setLocalSearchTerm("");
|
|
6510
6557
|
setIdToResetInputVariables(`data-resource-search-term-input-${v42()}`);
|
|
6511
6558
|
}
|
|
6512
6559
|
}, [searchTerm]);
|
|
@@ -6524,7 +6571,7 @@ var FilterControls = ({
|
|
|
6524
6571
|
dataTestId: "filters-button"
|
|
6525
6572
|
}
|
|
6526
6573
|
),
|
|
6527
|
-
hideSearchInput ? null : /* @__PURE__ */ jsxs33("div", { css: BindableKeywordSearchInputStyles, children: [
|
|
6574
|
+
hideSearchInput ? null : /* @__PURE__ */ jsxs33("div", { css: BindableKeywordSearchInputStyles, "data-testid": "search-container", children: [
|
|
6528
6575
|
/* @__PURE__ */ jsx74(
|
|
6529
6576
|
InputVariables,
|
|
6530
6577
|
{
|
|
@@ -6532,18 +6579,24 @@ var FilterControls = ({
|
|
|
6532
6579
|
id: idToResetInputVariables,
|
|
6533
6580
|
showMenuPosition: "inline-right",
|
|
6534
6581
|
editorRef,
|
|
6535
|
-
value:
|
|
6536
|
-
onChange: (value) =>
|
|
6582
|
+
value: localSearchTerm,
|
|
6583
|
+
onChange: (value) => setLocalSearchTerm(value != null ? value : ""),
|
|
6537
6584
|
disableVariables: !allowBindingSearchTerm,
|
|
6538
6585
|
inputWhenNoVariables: /* @__PURE__ */ jsx74(
|
|
6539
6586
|
InputKeywordSearch,
|
|
6540
6587
|
{
|
|
6541
6588
|
placeholder: "Search...",
|
|
6542
|
-
onSearchTextChanged: (e) =>
|
|
6543
|
-
value:
|
|
6589
|
+
onSearchTextChanged: (e) => setLocalSearchTerm(e),
|
|
6590
|
+
value: localSearchTerm,
|
|
6544
6591
|
compact: true,
|
|
6545
6592
|
rounded: true,
|
|
6546
|
-
css: SearchInput
|
|
6593
|
+
css: SearchInput,
|
|
6594
|
+
onKeyPress: (e) => {
|
|
6595
|
+
if (e.key === "Enter") {
|
|
6596
|
+
e.preventDefault();
|
|
6597
|
+
e.stopPropagation();
|
|
6598
|
+
}
|
|
6599
|
+
}
|
|
6547
6600
|
}
|
|
6548
6601
|
)
|
|
6549
6602
|
}
|
|
@@ -6553,7 +6606,7 @@ var FilterControls = ({
|
|
|
6553
6606
|
{
|
|
6554
6607
|
css: ClearSearchButtonStyles,
|
|
6555
6608
|
onClick: () => {
|
|
6556
|
-
|
|
6609
|
+
setLocalSearchTerm("");
|
|
6557
6610
|
if (editorRef.current) {
|
|
6558
6611
|
if (editorRef.current.getRootElement() !== document.activeElement) {
|
|
6559
6612
|
editorRef.current.dispatchCommand(CLEAR_EDITOR_COMMAND2, void 0);
|
|
@@ -6990,15 +7043,36 @@ var SearchAndFilterResultContainer = ({
|
|
|
6990
7043
|
hideClearButton
|
|
6991
7044
|
}) => {
|
|
6992
7045
|
const { searchTerm, totalResults, filters, handleResetFilters, setSearchTerm } = useSearchAndFilter();
|
|
6993
|
-
const
|
|
6994
|
-
|
|
6995
|
-
|
|
7046
|
+
const emptyFilters = filters.length === 0 || filters.every((filter) => !filter.value);
|
|
7047
|
+
const getTextValue = ({
|
|
7048
|
+
defaultPropText,
|
|
7049
|
+
searchText,
|
|
7050
|
+
filterText,
|
|
7051
|
+
fallbackText
|
|
7052
|
+
}) => {
|
|
7053
|
+
if (defaultPropText) {
|
|
7054
|
+
return defaultPropText;
|
|
7055
|
+
}
|
|
7056
|
+
if (searchTerm && emptyFilters) {
|
|
7057
|
+
return searchText;
|
|
6996
7058
|
}
|
|
6997
|
-
if (
|
|
6998
|
-
return
|
|
7059
|
+
if (!emptyFilters && !searchTerm) {
|
|
7060
|
+
return filterText;
|
|
6999
7061
|
}
|
|
7000
|
-
return
|
|
7062
|
+
return fallbackText;
|
|
7001
7063
|
};
|
|
7064
|
+
const clearButtonText = getTextValue({
|
|
7065
|
+
defaultPropText: buttonText,
|
|
7066
|
+
searchText: "Clear search",
|
|
7067
|
+
filterText: "Clear filters",
|
|
7068
|
+
fallbackText: "Clear results"
|
|
7069
|
+
});
|
|
7070
|
+
const automateCalloutTitle = getTextValue({
|
|
7071
|
+
defaultPropText: calloutTitle,
|
|
7072
|
+
searchText: "No search results found",
|
|
7073
|
+
filterText: "No results match the selected filters",
|
|
7074
|
+
fallbackText: "No matching results found"
|
|
7075
|
+
});
|
|
7002
7076
|
if (totalResults && totalResults > 0) {
|
|
7003
7077
|
return null;
|
|
7004
7078
|
}
|
|
@@ -7019,7 +7093,7 @@ var SearchAndFilterResultContainer = ({
|
|
|
7019
7093
|
] }),
|
|
7020
7094
|
!searchTerm || hideClearButton ? null : /* @__PURE__ */ jsx78(Button5, { buttonType: "ghostDestructive", size: "zero", onClick: handleClearSearch, children: clearButtonLabel })
|
|
7021
7095
|
] }),
|
|
7022
|
-
totalResults === 0 ? /* @__PURE__ */ jsxs37(Callout4, { title:
|
|
7096
|
+
totalResults === 0 ? /* @__PURE__ */ jsxs37(Callout4, { title: automateCalloutTitle, type: "note", children: [
|
|
7023
7097
|
calloutText ? /* @__PURE__ */ jsx78(Paragraph, { children: calloutText }) : null,
|
|
7024
7098
|
hideClearButton ? null : /* @__PURE__ */ jsx78(
|
|
7025
7099
|
Button5,
|
|
@@ -7028,7 +7102,7 @@ var SearchAndFilterResultContainer = ({
|
|
|
7028
7102
|
size: "xs",
|
|
7029
7103
|
onClick: handleClearSearch,
|
|
7030
7104
|
"data-testid": "clear-search",
|
|
7031
|
-
children:
|
|
7105
|
+
children: clearButtonText
|
|
7032
7106
|
}
|
|
7033
7107
|
)
|
|
7034
7108
|
] }) : null
|
|
@@ -7051,7 +7125,8 @@ var SearchAndFilter = ({
|
|
|
7051
7125
|
onSearchChange,
|
|
7052
7126
|
totalResults,
|
|
7053
7127
|
allowBindingSearchTerm = false,
|
|
7054
|
-
resetFilterValues = []
|
|
7128
|
+
resetFilterValues = [],
|
|
7129
|
+
onResetFilterValues
|
|
7055
7130
|
}) => {
|
|
7056
7131
|
return /* @__PURE__ */ jsx79(
|
|
7057
7132
|
SearchAndFilterProvider,
|
|
@@ -7066,6 +7141,7 @@ var SearchAndFilter = ({
|
|
|
7066
7141
|
resetFilterValues,
|
|
7067
7142
|
filterMapper: filterMapper2,
|
|
7068
7143
|
allowBindingSearchTerm,
|
|
7144
|
+
onResetFilterValues,
|
|
7069
7145
|
children: /* @__PURE__ */ jsxs38(VerticalRhythm7, { "data-testid": "search-and-filter", children: [
|
|
7070
7146
|
/* @__PURE__ */ jsxs38("div", { css: SearchAndFilterOutterControlWrapper(viewSwitchControls ? "1fr auto" : "1fr"), children: [
|
|
7071
7147
|
/* @__PURE__ */ jsx79(
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@uniformdev/mesh-sdk-react",
|
|
3
|
-
"version": "20.7.1-alpha.
|
|
3
|
+
"version": "20.7.1-alpha.120+5160373551",
|
|
4
4
|
"description": "Uniform Mesh Framework SDK for React",
|
|
5
5
|
"license": "SEE LICENSE IN LICENSE.txt",
|
|
6
6
|
"main": "./dist/index.js",
|
|
@@ -41,7 +41,7 @@
|
|
|
41
41
|
"test": "jest --maxWorkers=1 --passWithNoTests",
|
|
42
42
|
"lint": "eslint \"src/**/*.{js,ts,tsx}\"",
|
|
43
43
|
"format": "prettier --write \"src/**/*.{js,ts,tsx}\"",
|
|
44
|
-
"document": "api-extractor run --local"
|
|
44
|
+
"document:prebuild": "api-extractor run --local"
|
|
45
45
|
},
|
|
46
46
|
"dependencies": {
|
|
47
47
|
"@hookform/resolvers": "^3.3.1",
|
|
@@ -49,11 +49,11 @@
|
|
|
49
49
|
"@lexical/react": "0.25.0",
|
|
50
50
|
"@lexical/selection": "0.25.0",
|
|
51
51
|
"@lexical/utils": "0.25.0",
|
|
52
|
-
"@react-icons/all-files": "https://github.com/react-icons/react-icons/releases/download/v5.
|
|
53
|
-
"@uniformdev/canvas": "20.7.1-alpha.
|
|
54
|
-
"@uniformdev/design-system": "20.7.1-alpha.
|
|
55
|
-
"@uniformdev/mesh-sdk": "20.7.1-alpha.
|
|
56
|
-
"@uniformdev/richtext": "20.7.1-alpha.
|
|
52
|
+
"@react-icons/all-files": "https://github.com/react-icons/react-icons/releases/download/v5.5.0/react-icons-all-files-5.5.0.tgz",
|
|
53
|
+
"@uniformdev/canvas": "20.7.1-alpha.120+5160373551",
|
|
54
|
+
"@uniformdev/design-system": "20.7.1-alpha.120+5160373551",
|
|
55
|
+
"@uniformdev/mesh-sdk": "20.7.1-alpha.120+5160373551",
|
|
56
|
+
"@uniformdev/richtext": "20.7.1-alpha.120+5160373551",
|
|
57
57
|
"dequal": "^2.0.3",
|
|
58
58
|
"lexical": "0.25.0",
|
|
59
59
|
"mitt": "3.0.1",
|
|
@@ -71,11 +71,11 @@
|
|
|
71
71
|
},
|
|
72
72
|
"devDependencies": {
|
|
73
73
|
"@emotion/react": "11.13.5",
|
|
74
|
-
"@storybook/react": "
|
|
74
|
+
"@storybook/react": "10.1.0",
|
|
75
75
|
"@svgr/cli": "6.5.1",
|
|
76
|
-
"@types/react": "18.3.
|
|
76
|
+
"@types/react": "18.3.24",
|
|
77
77
|
"@types/react-beautiful-dnd": "13.1.8",
|
|
78
|
-
"@types/react-dom": "18.3.
|
|
78
|
+
"@types/react-dom": "18.3.7",
|
|
79
79
|
"@types/uuid": "9.0.4",
|
|
80
80
|
"react": "18.3.1",
|
|
81
81
|
"react-dom": "18.3.1"
|
|
@@ -86,5 +86,5 @@
|
|
|
86
86
|
"publishConfig": {
|
|
87
87
|
"access": "public"
|
|
88
88
|
},
|
|
89
|
-
"gitHead": "
|
|
89
|
+
"gitHead": "5160373551e91f6ef481c9f3687cad238e379591"
|
|
90
90
|
}
|