@uniformdev/mesh-sdk-react 19.134.3-alpha.28 → 19.135.1-alpha.9

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.mjs CHANGED
@@ -2652,6 +2652,9 @@ function DefaultDamItemRenderer({ item }) {
2652
2652
  ] }) : null;
2653
2653
  }
2654
2654
 
2655
+ // src/components/DataResourceDynamicInputProvider.tsx
2656
+ import { createContext as createContext4, useContext as useContext6 } from "react";
2657
+
2655
2658
  // src/hooks/useConnectedDataAsVariables.tsx
2656
2659
  import { useMemo as useMemo3 } from "react";
2657
2660
  function useConnectedDataAsVariables(connectedData) {
@@ -2945,15 +2948,16 @@ import {
2945
2948
  KEY_BACKSPACE_COMMAND,
2946
2949
  KEY_DELETE_COMMAND
2947
2950
  } from "lexical";
2948
- import { useCallback as useCallback3, useEffect as useEffect8 } from "react";
2951
+ import { useCallback as useCallback3, useEffect as useEffect9 } from "react";
2949
2952
 
2950
2953
  // src/components/Variables/util/prettifyBindExpression.tsx
2951
2954
  function prettifyBindExpression(bindExpression) {
2952
- return bindExpression.substring(bindExpression.lastIndexOf(":") + 1);
2955
+ const [, expression] = bindExpression.split(":");
2956
+ return expression;
2953
2957
  }
2954
2958
 
2955
2959
  // src/components/Variables/composer/VariableChip.tsx
2956
- import { MultilineChip } from "@uniformdev/design-system";
2960
+ import { MultilineChip, Tooltip, VerticalRhythm } from "@uniformdev/design-system";
2957
2961
  import { Fragment as Fragment5 } from "react";
2958
2962
  import { jsx as jsx30 } from "@emotion/react/jsx-runtime";
2959
2963
  function VariableChip({
@@ -2969,42 +2973,58 @@ function VariableChip({
2969
2973
  }) {
2970
2974
  const hasClickEvent = !!onClick;
2971
2975
  const referenceIsValidFr = isFresh ? true : referenceIsValid;
2972
- const Wrapper = referenceIsValidFr === "info" ? InfoVariableReference : referenceIsValidFr ? Fragment5 : UndefinedVariableReference;
2976
+ const Wrapper = referenceIsValidFr === "warning" ? WarningVariableReference : referenceIsValidFr === "info" ? InfoVariableReference : referenceIsValidFr ? Fragment5 : UndefinedVariableReference;
2973
2977
  const extraTitle = !referenceIsValidFr ? `${reference} is not defined.` : hasClickEvent && clickToEdit ? "Click to edit" : void 0;
2978
+ const chippy = /* @__PURE__ */ jsx30(MultilineChip, { onClick, "aria-selected": selected ? true : void 0, "aria-disabled": disabled, children: /* @__PURE__ */ jsx30(Wrapper, { children: displayName || reference }) });
2979
+ if (tooltip) {
2980
+ const tip = tooltip ? `${tooltip}${extraTitle ? `
2981
+
2982
+ ${extraTitle}` : ""}` : extraTitle != null ? extraTitle : "";
2983
+ const tipLines = tip.split("\n");
2984
+ return /* @__PURE__ */ jsx30(
2985
+ Tooltip,
2986
+ {
2987
+ title: /* @__PURE__ */ jsx30(VerticalRhythm, { gap: "sm", children: tipLines.map((t, index) => /* @__PURE__ */ jsx30("div", { children: t }, index)) }),
2988
+ children: /* @__PURE__ */ jsx30("span", { children: chippy })
2989
+ }
2990
+ );
2991
+ }
2992
+ return chippy;
2993
+ }
2994
+ function UndefinedVariableReference({ children }) {
2974
2995
  return /* @__PURE__ */ jsx30(
2975
- MultilineChip,
2996
+ "span",
2976
2997
  {
2977
- title: tooltip ? `${tooltip}${extraTitle ? `
2978
-
2979
- ${extraTitle}` : ""}` : extraTitle,
2980
- onClick,
2981
- "aria-selected": selected ? true : void 0,
2982
- "aria-disabled": disabled,
2983
- children: /* @__PURE__ */ jsx30(Wrapper, { children: displayName || reference })
2998
+ style: {
2999
+ textDecoration: "underline",
3000
+ textDecorationStyle: "wavy",
3001
+ textDecorationColor: "var(--error)"
3002
+ },
3003
+ children
2984
3004
  }
2985
3005
  );
2986
3006
  }
2987
- function UndefinedVariableReference({ children }) {
3007
+ function InfoVariableReference({ children }) {
2988
3008
  return /* @__PURE__ */ jsx30(
2989
3009
  "span",
2990
3010
  {
2991
3011
  style: {
2992
3012
  textDecoration: "underline",
2993
3013
  textDecorationStyle: "wavy",
2994
- textDecorationColor: "red"
3014
+ textDecorationColor: "var(--primary-action-default)"
2995
3015
  },
2996
3016
  children
2997
3017
  }
2998
3018
  );
2999
3019
  }
3000
- function InfoVariableReference({ children }) {
3020
+ function WarningVariableReference({ children }) {
3001
3021
  return /* @__PURE__ */ jsx30(
3002
3022
  "span",
3003
3023
  {
3004
3024
  style: {
3005
3025
  textDecoration: "underline",
3006
3026
  textDecorationStyle: "wavy",
3007
- textDecorationColor: "blue"
3027
+ textDecorationColor: "var(--alert)"
3008
3028
  },
3009
3029
  children
3010
3030
  }
@@ -3034,7 +3054,7 @@ import {
3034
3054
  COMMAND_PRIORITY_NORMAL,
3035
3055
  createCommand
3036
3056
  } from "lexical";
3037
- import { useCallback as useCallback2, useEffect as useEffect7, useMemo as useMemo8, useRef as useRef10, useState as useState10 } from "react";
3057
+ import { useCallback as useCallback2, useEffect as useEffect8, useMemo as useMemo8, useRef as useRef10, useState as useState10 } from "react";
3038
3058
  import { createPortal } from "react-dom";
3039
3059
 
3040
3060
  // src/components/Variables/toolbox/SelectVariableMenu.styles.ts
@@ -3068,7 +3088,7 @@ var variablesTipText = css18`
3068
3088
 
3069
3089
  // src/components/Variables/VariablesProvider.tsx
3070
3090
  import mitt from "mitt";
3071
- import { createContext as createContext3, useContext as useContext5, useMemo as useMemo7, useState as useState9 } from "react";
3091
+ import { createContext as createContext3, useContext as useContext5, useEffect as useEffect7, useMemo as useMemo7, useState as useState9 } from "react";
3072
3092
 
3073
3093
  // src/components/Variables/util/useVariableEditTransaction.ts
3074
3094
  import { useCallback, useEffect as useEffect6, useState as useState8 } from "react";
@@ -3265,7 +3285,8 @@ function VariablesProvider({
3265
3285
  readOnly,
3266
3286
  isLoading,
3267
3287
  children,
3268
- knownUndefinedValues = {}
3288
+ knownUndefinedValues = {},
3289
+ onChangeKnownUndefinedValue
3269
3290
  }) {
3270
3291
  const [editing, setEditing] = useState9();
3271
3292
  const [editingContext, setEditingContext] = useState9();
@@ -3332,6 +3353,15 @@ function VariablesProvider({
3332
3353
  isLoading: !!isLoading
3333
3354
  };
3334
3355
  }, [valueBasedContextValue, editVariableTxn, editing, events, knownUndefinedValues, isLoading]);
3356
+ useEffect7(() => {
3357
+ if (editing === void 0) {
3358
+ return;
3359
+ }
3360
+ const activeElement = document.activeElement;
3361
+ if (activeElement && "blur" in activeElement && typeof activeElement.blur === "function") {
3362
+ activeElement.blur();
3363
+ }
3364
+ }, [editing]);
3335
3365
  return /* @__PURE__ */ jsxs17(VariablesContext.Provider, { value: contextValue, children: [
3336
3366
  children,
3337
3367
  typeof editing !== "undefined" ? /* @__PURE__ */ jsx32(
@@ -3340,9 +3370,19 @@ function VariablesProvider({
3340
3370
  context: editingContext,
3341
3371
  onSubmit: (val, editorCompletedContext) => {
3342
3372
  contextValue.dispatch({ type: "cancelEdit" });
3343
- const { name, ...varValue } = val;
3344
- const latestValue = { ...value, [name]: varValue };
3345
- onChange == null ? void 0 : onChange(latestValue);
3373
+ if ("resultType" in val) {
3374
+ if (!onChangeKnownUndefinedValue) {
3375
+ throw new Error(
3376
+ "onChangeKnownUndefinedValue must be provided to handle known-undefined-value results"
3377
+ );
3378
+ }
3379
+ const { name, ...kuv } = val;
3380
+ onChangeKnownUndefinedValue(val.name, kuv);
3381
+ } else {
3382
+ const { name, ...varValue } = val;
3383
+ const latestValue = { ...value, [name]: varValue };
3384
+ onChange == null ? void 0 : onChange(latestValue);
3385
+ }
3346
3386
  events.emit("editCompleted", {
3347
3387
  canceled: false,
3348
3388
  selectedVariable: val,
@@ -3625,7 +3665,7 @@ function VariablesPlugin({
3625
3665
  },
3626
3666
  [editor, onSelect, queryString, replaceValueOnVariableInsert]
3627
3667
  );
3628
- useEffect7(() => {
3668
+ useEffect8(() => {
3629
3669
  return mergeRegister(
3630
3670
  editor.registerCommand(
3631
3671
  EDIT_VARIABLE_COMMAND,
@@ -3757,21 +3797,21 @@ function VariablesPlugin({
3757
3797
  ]);
3758
3798
  const updateExistingNodeIfChanged = useCallback2(
3759
3799
  (variableNode) => {
3760
- var _a, _b, _c;
3800
+ var _a, _b, _c, _d;
3761
3801
  const targetVar = variablesRef.current.variables[variableNode.reference];
3762
3802
  const targetUndefinedVar = variablesRef.current.knownUndefinedValues[variableNode.reference];
3763
3803
  const isLoadingVariables = variablesRef.current.isLoading;
3764
3804
  const currentState = variableNode.getState();
3765
- if (currentState.isFresh && !targetVar) {
3805
+ if (currentState.isFresh && !targetVar && !targetUndefinedVar) {
3766
3806
  return;
3767
3807
  }
3768
- const tooltip = (_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.info;
3808
+ 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;
3769
3809
  const newState = {
3770
3810
  ...currentState,
3771
3811
  displayName: (targetVar == null ? void 0 : targetVar.displayName) || (targetUndefinedVar == null ? void 0 : targetUndefinedVar.displayName) || variableNode.reference,
3772
3812
  isLoading: isLoadingVariables && !targetVar && !(targetUndefinedVar == null ? void 0 : targetUndefinedVar.info),
3773
3813
  hasClickEvent: canEditVariable(variableNode.reference, targetVar),
3774
- referenceIsValid: (targetUndefinedVar == null ? void 0 : targetUndefinedVar.info) ? "info" : isLoadingVariables ? true : Boolean(targetVar),
3814
+ 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),
3775
3815
  tooltip,
3776
3816
  isFresh: false
3777
3817
  };
@@ -3781,14 +3821,14 @@ function VariablesPlugin({
3781
3821
  },
3782
3822
  [canEditVariable]
3783
3823
  );
3784
- useEffect7(() => {
3824
+ useEffect8(() => {
3785
3825
  editor.update(() => {
3786
3826
  $nodesOfType2(VariableNode).forEach((variableNode) => {
3787
3827
  updateExistingNodeIfChanged(variableNode);
3788
3828
  });
3789
3829
  });
3790
- }, [editor, variables, canEditVariable, updateExistingNodeIfChanged]);
3791
- useEffect7(() => {
3830
+ }, [editor, variables, knownUndefinedValues, canEditVariable, updateExistingNodeIfChanged]);
3831
+ useEffect8(() => {
3792
3832
  return editor.registerNodeTransform(VariableNode, (variableNode) => {
3793
3833
  updateExistingNodeIfChanged(variableNode);
3794
3834
  });
@@ -3967,7 +4007,7 @@ function VariableNodeComponent({
3967
4007
  },
3968
4008
  [isSelected, nodeKey]
3969
4009
  );
3970
- useEffect8(() => {
4010
+ useEffect9(() => {
3971
4011
  return mergeRegister2(
3972
4012
  editor.registerCommand(KEY_DELETE_COMMAND, onDelete, COMMAND_PRIORITY_LOW),
3973
4013
  editor.registerCommand(KEY_BACKSPACE_COMMAND, onDelete, COMMAND_PRIORITY_LOW),
@@ -4084,10 +4124,10 @@ function EditorRefPlugin({
4084
4124
  import { useLexicalComposerContext as useLexicalComposerContext5 } from "@lexical/react/LexicalComposerContext";
4085
4125
  import { mergeRegister as mergeRegister3 } from "@lexical/utils";
4086
4126
  import { $getSelection as $getSelection3, $isRangeSelection as $isRangeSelection2, COMMAND_PRIORITY_HIGH, PASTE_COMMAND } from "lexical";
4087
- import { useEffect as useEffect9 } from "react";
4127
+ import { useEffect as useEffect10 } from "react";
4088
4128
  function PasteTransformerPlugin({ transformPaste }) {
4089
4129
  const [editor] = useLexicalComposerContext5();
4090
- useEffect9(() => {
4130
+ useEffect10(() => {
4091
4131
  return mergeRegister3(
4092
4132
  editor.registerCommand(
4093
4133
  PASTE_COMMAND,
@@ -4168,6 +4208,7 @@ var input = css21`
4168
4208
  var inputCompact = css21`
4169
4209
  border: 1px solid var(--white);
4170
4210
  padding-block: var(--spacing-sm);
4211
+ min-height: 39px;
4171
4212
  font-size: var(--fs-sm);
4172
4213
  `;
4173
4214
  var inputDisabled = css21`
@@ -4177,14 +4218,14 @@ var inputDisabled = css21`
4177
4218
  var placeholderCaption = css21`
4178
4219
  position: absolute;
4179
4220
  color: var(--gray-400);
4180
- inset: var(--spacing-base) var(--spacing-lg) var(--spacing-base) var(--spacing-base);
4221
+ inset: 12px var(--spacing-base) 12px var(--spacing-sm);
4181
4222
  overflow: hidden;
4182
4223
  text-overflow: ellipsis;
4183
4224
  white-space: nowrap;
4184
4225
  pointer-events: none;
4185
4226
  `;
4186
4227
  var placeholderCompact = css21`
4187
- inset: var(--spacing-sm) var(--spacing-lg) var(--spacing-sm) var(--spacing-base);
4228
+ inset: var(--spacing-sm) var(--spacing-lg) var(--spacing-sm) var(--spacing-sm);
4188
4229
  `;
4189
4230
 
4190
4231
  // src/components/Variables/styles/ParameterVariables.styles.ts
@@ -4525,14 +4566,14 @@ function VariableField({
4525
4566
  }) {
4526
4567
  const { variables } = useVariables(true);
4527
4568
  const varCount = Object.keys(variables).length;
4528
- const variableSelector = (varCount > 0 || (selectVariableMenuOptions == null ? void 0 : selectVariableMenuOptions.showAddVariableMenuOption)) && !disableVariables ? /* @__PURE__ */ jsx37(
4569
+ const variableSelector = (varCount > 0 || (selectVariableMenuOptions == null ? void 0 : selectVariableMenuOptions.showAddVariableMenuOption)) && !disableVariables ? /* @__PURE__ */ jsx37("div", { "data-testid": "label-var-menu", children: /* @__PURE__ */ jsx37(
4529
4570
  VariablesComposerVariableMenu,
4530
4571
  {
4531
4572
  ...selectVariableMenuOptions,
4532
4573
  buttonCss: [variableBindButton2, selectVariableMenuOptions == null ? void 0 : selectVariableMenuOptions.buttonCss],
4533
4574
  buttonProps: isActive ? { "aria-pressed": "true" } : void 0
4534
4575
  }
4535
- ) : null;
4576
+ ) }) : null;
4536
4577
  return /* @__PURE__ */ jsxs20("div", { "data-testid": "variable-field", children: [
4537
4578
  /* @__PURE__ */ jsxs20("label", { htmlFor: id, css: labelText, "data-testid": "field-name", children: [
4538
4579
  variableSelector,
@@ -4551,10 +4592,10 @@ import { useMemo as useMemo10, useRef as useRef12, useState as useState12 } from
4551
4592
 
4552
4593
  // src/components/Variables/composer/DisablePlugin.tsx
4553
4594
  import { useLexicalComposerContext as useLexicalComposerContext7 } from "@lexical/react/LexicalComposerContext";
4554
- import { useEffect as useEffect11 } from "react";
4595
+ import { useEffect as useEffect12 } from "react";
4555
4596
  function DisablePlugin({ disabled }) {
4556
4597
  const [editor] = useLexicalComposerContext7();
4557
- useEffect11(() => {
4598
+ useEffect12(() => {
4558
4599
  editor.setEditable(!disabled);
4559
4600
  }, [editor, disabled]);
4560
4601
  return null;
@@ -4563,10 +4604,10 @@ function DisablePlugin({ disabled }) {
4563
4604
  // src/components/Variables/composer/SingleLineTextPlugin.tsx
4564
4605
  import { useLexicalComposerContext as useLexicalComposerContext8 } from "@lexical/react/LexicalComposerContext";
4565
4606
  import { LineBreakNode } from "lexical";
4566
- import { useEffect as useEffect12 } from "react";
4607
+ import { useEffect as useEffect13 } from "react";
4567
4608
  function SingleLineTextPlugin() {
4568
4609
  const [editor] = useLexicalComposerContext8();
4569
- useEffect12(() => {
4610
+ useEffect13(() => {
4570
4611
  editor.registerNodeTransform(LineBreakNode, (node) => {
4571
4612
  node.remove();
4572
4613
  });
@@ -4688,10 +4729,10 @@ import {
4688
4729
  CUT_COMMAND,
4689
4730
  PASTE_COMMAND as PASTE_COMMAND2
4690
4731
  } from "lexical";
4691
- import { useEffect as useEffect13 } from "react";
4732
+ import { useEffect as useEffect14 } from "react";
4692
4733
  import { Fragment as Fragment9, jsx as jsx39, jsxs as jsxs22 } from "@emotion/react/jsx-runtime";
4693
4734
  function VariablesComposerInput({
4694
- css: css38,
4735
+ css: css40,
4695
4736
  placeholder,
4696
4737
  ...contentEditableProps
4697
4738
  }) {
@@ -4710,7 +4751,7 @@ function VariablesComposerInput({
4710
4751
  }
4711
4752
  function RichishCopyAndPastePlugin() {
4712
4753
  const [editor] = useLexicalComposerContext9();
4713
- useEffect13(() => {
4754
+ useEffect14(() => {
4714
4755
  return mergeRegister4(
4715
4756
  editor.registerCommand(
4716
4757
  COPY_COMMAND,
@@ -4812,7 +4853,8 @@ function InputVariables(props) {
4812
4853
  editorRef,
4813
4854
  filterVariable,
4814
4855
  styleVariant = "default",
4815
- renderMenuInPortal
4856
+ renderMenuInPortal,
4857
+ disableDismissEditorOnChange
4816
4858
  } = props;
4817
4859
  const [finalId] = useState13(id != null ? id : () => v42());
4818
4860
  const { dispatch, canDispatch, isEditing } = useVariables(true);
@@ -4822,7 +4864,7 @@ function InputVariables(props) {
4822
4864
  "div",
4823
4865
  {
4824
4866
  onKeyDown: () => {
4825
- if (isEditing && canDispatch) {
4867
+ if (!disableDismissEditorOnChange && isEditing && canDispatch) {
4826
4868
  dispatch({ type: "cancelEdit" });
4827
4869
  }
4828
4870
  },
@@ -4834,6 +4876,7 @@ function InputVariables(props) {
4834
4876
  align: "center",
4835
4877
  gap: "xs",
4836
4878
  css: css24`
4879
+ position: relative;
4837
4880
  & > div:first-child {
4838
4881
  flex-grow: 1;
4839
4882
  }
@@ -4901,7 +4944,7 @@ function InputVariables(props) {
4901
4944
  },
4902
4945
  id: finalId,
4903
4946
  isActive: hadVariablesInValue,
4904
- disableVariables: disableVariablesForReals || showMenuPosition && showMenuPosition !== "label" || disableInlineMenu === true || disableInlineMenu === "by-label",
4947
+ disableVariables: disableVariablesForReals || showMenuPosition && showMenuPosition !== "label" || disableInlineMenu === "by-label",
4905
4948
  children: input3
4906
4949
  }
4907
4950
  );
@@ -4939,7 +4982,7 @@ function InputVariablesOverlayMenu({
4939
4982
  if (disabled) {
4940
4983
  return /* @__PURE__ */ jsx40(Fragment10, { children });
4941
4984
  }
4942
- return /* @__PURE__ */ jsxs23("div", { css: menuContainer, children: [
4985
+ return /* @__PURE__ */ jsxs23("div", { css: menuContainer, "data-testid": "inline-var-menu", children: [
4943
4986
  children,
4944
4987
  /* @__PURE__ */ jsx40(
4945
4988
  VariablesComposerVariableMenu,
@@ -4964,7 +5007,8 @@ function ParameterConnectionIndicator({
4964
5007
  value,
4965
5008
  menuOptions,
4966
5009
  disabled,
4967
- menuTooltip = "Insert variable"
5010
+ menuTooltip = "Insert variable",
5011
+ overrideMenuButtonParentMargin
4968
5012
  }) {
4969
5013
  const hasVariablesInValue = useMemo11(() => {
4970
5014
  let result = false;
@@ -4985,13 +5029,21 @@ function ParameterConnectionIndicator({
4985
5029
  placement: "bottom-start",
4986
5030
  withoutPortal: true,
4987
5031
  menuTrigger: /* @__PURE__ */ jsx41(
4988
- "button",
5032
+ "div",
4989
5033
  {
4990
- title: menuTooltip,
4991
- "aria-pressed": hasVariablesInValue,
4992
- css: [menuBtn, variableBindButton],
4993
- type: "button",
4994
- children: /* @__PURE__ */ jsx41(CgUsbC2, { size: "1.4rem" })
5034
+ css: overrideMenuButtonParentMargin ? {
5035
+ marginBottom: overrideMenuButtonParentMargin
5036
+ } : void 0,
5037
+ children: /* @__PURE__ */ jsx41(
5038
+ "button",
5039
+ {
5040
+ title: menuTooltip,
5041
+ "aria-pressed": hasVariablesInValue,
5042
+ css: [menuBtn, variableBindButton],
5043
+ type: "button",
5044
+ children: /* @__PURE__ */ jsx41(CgUsbC2, { size: "1.4rem" })
5045
+ }
5046
+ )
4995
5047
  }
4996
5048
  ),
4997
5049
  menuLabel: menuTooltip,
@@ -5009,7 +5061,7 @@ import { useCallback as useCallback4 } from "react";
5009
5061
  import { useLexicalComposerContext as useLexicalComposerContext10 } from "@lexical/react/LexicalComposerContext";
5010
5062
  import { mergeRegister as mergeRegister5 } from "@lexical/utils";
5011
5063
  import { $getNodeByKey as $getNodeByKey3, COMMAND_PRIORITY_HIGH as COMMAND_PRIORITY_HIGH3 } from "lexical";
5012
- import { useEffect as useEffect14, useRef as useRef13 } from "react";
5064
+ import { useEffect as useEffect15, useRef as useRef13 } from "react";
5013
5065
  function OnDisconnectPlugin({
5014
5066
  onDisconnect
5015
5067
  }) {
@@ -5017,7 +5069,7 @@ function OnDisconnectPlugin({
5017
5069
  const { variables } = useVariables(true);
5018
5070
  const variablesRef = useRef13(variables);
5019
5071
  variablesRef.current = variables;
5020
- useEffect14(() => {
5072
+ useEffect15(() => {
5021
5073
  return mergeRegister5(
5022
5074
  editor.registerCommand(
5023
5075
  DISCONNECT_VARIABLE_COMMAND,
@@ -5154,19 +5206,17 @@ function ParameterVariables(props) {
5154
5206
  children: [
5155
5207
  editorRef ? /* @__PURE__ */ jsx43(EditorRefPlugin, { editorRef }) : null,
5156
5208
  /* @__PURE__ */ jsx43(ControlledValuePlugin, { value, enabled: useInputWhenNoVariables }),
5157
- /* @__PURE__ */ jsxs26(
5158
- HorizontalRhythm7,
5159
- {
5160
- align: "center",
5161
- gap: "xs",
5162
- css: { width: "100%" },
5163
- onKeyDown: () => {
5164
- if (isEditing && canDispatch) {
5165
- dispatch({ type: "cancelEdit" });
5166
- }
5167
- },
5168
- children: [
5169
- /* @__PURE__ */ jsx43("div", { css: { flex: 1 }, children: useInputWhenNoVariables ? inputWhenNoVariables : /* @__PURE__ */ jsx43(
5209
+ /* @__PURE__ */ jsxs26(HorizontalRhythm7, { align: "center", gap: "xs", css: { width: "100%" }, children: [
5210
+ /* @__PURE__ */ jsx43(
5211
+ "div",
5212
+ {
5213
+ css: { flex: 1 },
5214
+ onKeyDown: () => {
5215
+ if (isEditing && canDispatch) {
5216
+ dispatch({ type: "cancelEdit" });
5217
+ }
5218
+ },
5219
+ children: useInputWhenNoVariables ? inputWhenNoVariables : /* @__PURE__ */ jsx43(
5170
5220
  VariablesComposerInput,
5171
5221
  {
5172
5222
  "aria-label": ariaLabel,
@@ -5178,20 +5228,20 @@ function ParameterVariables(props) {
5178
5228
  inputCss != null ? inputCss : css25``
5179
5229
  ]
5180
5230
  }
5181
- ) }),
5182
- disableVariablesForReals ? null : /* @__PURE__ */ jsx43(
5183
- VariablesComposerVariableMenu,
5184
- {
5185
- ...sharedMenuProps,
5186
- buttonCss: [variableBindButton],
5187
- tip: useInputWhenNoVariables ? void 0 : "Tip: access this list by typing $$",
5188
- buttonProps: hasVariablesInValue ? { "aria-pressed": "true" } : void 0,
5189
- replaceValueOnVariableInsert: useInputWhenNoVariables
5190
- }
5191
5231
  )
5192
- ]
5193
- }
5194
- )
5232
+ }
5233
+ ),
5234
+ disableVariablesForReals ? null : /* @__PURE__ */ jsx43(
5235
+ VariablesComposerVariableMenu,
5236
+ {
5237
+ ...sharedMenuProps,
5238
+ buttonCss: [variableBindButton],
5239
+ tip: useInputWhenNoVariables ? void 0 : "Tip: access this list by typing $$",
5240
+ buttonProps: hasVariablesInValue ? { "aria-pressed": "true" } : void 0,
5241
+ replaceValueOnVariableInsert: useInputWhenNoVariables
5242
+ }
5243
+ )
5244
+ ] })
5195
5245
  ]
5196
5246
  }
5197
5247
  );
@@ -5199,7 +5249,7 @@ function ParameterVariables(props) {
5199
5249
 
5200
5250
  // src/components/Variables/util/convertConnectedDataToVariable.ts
5201
5251
  function convertConnectedDataToVariable(bindExpression, value) {
5202
- const isValuePrimitive = typeof value === "string" || typeof value === "number" || typeof value === "boolean";
5252
+ const isValuePrimitive = typeof value === "string" && value.length > 0 || typeof value === "number" || typeof value === "boolean";
5203
5253
  return {
5204
5254
  ephemeral: true,
5205
5255
  displayName: isValuePrimitive ? value.toString() : prettifyBindExpression(bindExpression),
@@ -5374,6 +5424,10 @@ function VariablesList() {
5374
5424
 
5375
5425
  // src/components/DataResourceDynamicInputProvider.tsx
5376
5426
  import { jsx as jsx45 } from "@emotion/react/jsx-runtime";
5427
+ var DataResourceInputContext = createContext4(void 0);
5428
+ var useDataResourceDynamicInputs = () => {
5429
+ return useContext6(DataResourceInputContext);
5430
+ };
5377
5431
  function DataResourceDynamicInputProvider(props) {
5378
5432
  const { children, dynamicInputs } = props;
5379
5433
  if (dynamicInputs) {
@@ -5392,11 +5446,11 @@ function DataResourceDynamicInputProviderRenderer({
5392
5446
  dynamicInputs
5393
5447
  }) {
5394
5448
  const variables = useDynamicInputsAsVariables(dynamicInputs);
5395
- return /* @__PURE__ */ jsx45(VariablesProvider, { value: variables, readOnly: true, children });
5449
+ return /* @__PURE__ */ jsx45(DataResourceInputContext.Provider, { value: dynamicInputs, children: /* @__PURE__ */ jsx45(VariablesProvider, { value: variables, readOnly: true, children }) });
5396
5450
  }
5397
5451
 
5398
5452
  // src/components/DataResourceVariablesList.tsx
5399
- import { Callout as Callout4, VerticalRhythm } from "@uniformdev/design-system";
5453
+ import { Callout as Callout4, VerticalRhythm as VerticalRhythm2 } from "@uniformdev/design-system";
5400
5454
  import { jsx as jsx46 } from "@emotion/react/jsx-runtime";
5401
5455
  function DataResourceVariablesList(props) {
5402
5456
  const {
@@ -5428,7 +5482,7 @@ function DataResourceVariablesListExplicit({
5428
5482
  }
5429
5483
  return /* @__PURE__ */ jsx46(Callout4, { type: "note", children: "No settings are required." });
5430
5484
  }
5431
- return /* @__PURE__ */ jsx46(DataResourceDynamicInputProvider, { dynamicInputs, children: /* @__PURE__ */ jsx46(VerticalRhythm, { children: variableDefinitions.map((variableDefinition) => {
5485
+ return /* @__PURE__ */ jsx46(DataResourceDynamicInputProvider, { dynamicInputs, children: /* @__PURE__ */ jsx46(VerticalRhythm2, { children: variableDefinitions.map((variableDefinition) => {
5432
5486
  var _a, _b, _c;
5433
5487
  const VariableRenderer = variableDefinition.type ? (_a = typeRenderers == null ? void 0 : typeRenderers[variableDefinition.type]) != null ? _a : TextVariableRenderer : TextVariableRenderer;
5434
5488
  return /* @__PURE__ */ jsx46("div", { children: /* @__PURE__ */ jsx46(
@@ -5655,6 +5709,7 @@ function RequestBody() {
5655
5709
  // src/components/Request/RequestHeaders.tsx
5656
5710
  import {
5657
5711
  Input as Input3,
5712
+ InputToggle,
5658
5713
  Table as Table2,
5659
5714
  TableBody as TableBody2,
5660
5715
  TableCellData as TableCellData2,
@@ -5736,8 +5791,11 @@ function RequestHeaders({
5736
5791
  }
5737
5792
  ) : null }),
5738
5793
  addOmitIfEmpty ? /* @__PURE__ */ jsx50(TableCellData2, { width: "50%", children: header.key ? /* @__PURE__ */ jsx50(
5739
- Input3,
5794
+ InputToggle,
5740
5795
  {
5796
+ label: "Omit if empty",
5797
+ showLabel: false,
5798
+ name: "omitIfEmpty",
5741
5799
  type: "checkbox",
5742
5800
  checked: header.omitIfEmpty,
5743
5801
  "data-testid": "header-omitifempty",
@@ -5782,6 +5840,7 @@ function RequestMethodSelect(props) {
5782
5840
  // src/components/Request/RequestParameters.tsx
5783
5841
  import {
5784
5842
  Input as Input4,
5843
+ InputToggle as InputToggle2,
5785
5844
  Table as Table3,
5786
5845
  TableBody as TableBody3,
5787
5846
  TableCellData as TableCellData3,
@@ -5873,8 +5932,11 @@ function RequestParameters({
5873
5932
  }
5874
5933
  ) : null }),
5875
5934
  addOmitIfEmpty ? /* @__PURE__ */ jsx52(TableCellData3, { width: "50%", children: parameter.key ? /* @__PURE__ */ jsx52(
5876
- Input4,
5935
+ InputToggle2,
5877
5936
  {
5937
+ label: "Omit if empty",
5938
+ showLabel: false,
5939
+ name: "omitIfEmpty",
5878
5940
  type: "checkbox",
5879
5941
  checked: parameter.omitIfEmpty,
5880
5942
  "data-testid": "parameter-omitifempty",
@@ -6173,12 +6235,12 @@ import { LoadingIndicator as LoadingIndicator3, Theme as Theme2 } from "@uniform
6173
6235
 
6174
6236
  // src/hooks/useInitializeUniformMeshSdk.ts
6175
6237
  import { initializeUniformMeshSDK } from "@uniformdev/mesh-sdk";
6176
- import { useEffect as useEffect15, useRef as useRef14, useState as useState15 } from "react";
6238
+ import { useEffect as useEffect16, useRef as useRef14, useState as useState15 } from "react";
6177
6239
  var useInitializeUniformMeshSdk = ({ autoResizingDisabled } = {}) => {
6178
6240
  const [error, setError] = useState15();
6179
6241
  const [sdk, setSdk] = useState15();
6180
6242
  const initializationInProgress = useRef14(false);
6181
- useEffect15(
6243
+ useEffect16(
6182
6244
  () => {
6183
6245
  if (typeof window === "undefined" || sdk) {
6184
6246
  return;
@@ -6259,22 +6321,23 @@ var DataRefreshButton = ({
6259
6321
  };
6260
6322
 
6261
6323
  // src/components/ObjectSearch/ObjectSearchContainer.tsx
6262
- import { css as css33 } from "@emotion/react";
6324
+ import { css as css36 } from "@emotion/react";
6263
6325
  import { bindVariables } from "@uniformdev/canvas";
6264
- import { Callout as Callout5, Container, IconsProvider, ScrollableList, VerticalRhythm as VerticalRhythm2 } from "@uniformdev/design-system";
6326
+ import { Callout as Callout5, Container, IconsProvider, ScrollableList, VerticalRhythm as VerticalRhythm3 } from "@uniformdev/design-system";
6327
+ import React12 from "react";
6265
6328
 
6266
6329
  // src/components/ObjectSearch/hooks/ObjectSearchContext.tsx
6267
6330
  import { bindVariablesToObject as bindVariablesToObject2 } from "@uniformdev/canvas";
6268
6331
  import {
6269
- createContext as createContext5,
6332
+ createContext as createContext6,
6270
6333
  useCallback as useCallback5,
6271
- useContext as useContext7,
6334
+ useContext as useContext8,
6272
6335
  useDeferredValue,
6273
6336
  useMemo as useMemo14,
6274
6337
  useState as useState16
6275
6338
  } from "react";
6276
6339
  import { jsx as jsx59 } from "@emotion/react/jsx-runtime";
6277
- var ObjectSearchContext = createContext5({
6340
+ var ObjectSearchContext = createContext6({
6278
6341
  onSetQuery: () => {
6279
6342
  },
6280
6343
  onSelectItem: () => {
@@ -6282,8 +6345,6 @@ var ObjectSearchContext = createContext5({
6282
6345
  query: {},
6283
6346
  boundQuery: {},
6284
6347
  list: {},
6285
- onSetList: () => {
6286
- },
6287
6348
  selectedListItems: [],
6288
6349
  onRemoveAllSelectedItems: () => {
6289
6350
  },
@@ -6367,7 +6428,7 @@ var ObjectSearchProvider = ({
6367
6428
  return /* @__PURE__ */ jsx59(ObjectSearchContext.Provider, { value, children });
6368
6429
  };
6369
6430
  function useObjectSearchContext() {
6370
- return useContext7(ObjectSearchContext);
6431
+ return useContext8(ObjectSearchContext);
6371
6432
  }
6372
6433
  function bindQuery(query, inputs) {
6373
6434
  const { result, errors } = bindVariablesToObject2({
@@ -6523,201 +6584,18 @@ var ObjectSearchListItemLoadingSkeleton = () => {
6523
6584
  return /* @__PURE__ */ jsx60("div", { role: "presentation", css: [ObjectListItemContainer, ObjectListItemLoading] });
6524
6585
  };
6525
6586
 
6526
- // src/components/ObjectSearch/ObjectSearchContainer.tsx
6527
- import { jsx as jsx61, jsxs as jsxs35 } from "@emotion/react/jsx-runtime";
6528
- var ObjectSearchContainer = ({
6529
- label,
6530
- enableDynamicInputToResultId,
6531
- searchFilters,
6532
- resultList,
6533
- children
6534
- }) => {
6535
- var _a, _b;
6536
- const { onSelectItem, selectedListItems, list } = useObjectSearchContext();
6537
- const { flatVariables } = useVariables(true);
6538
- const inputValue = (_b = (_a = selectedListItems == null ? void 0 : selectedListItems[0]) == null ? void 0 : _a.id) != null ? _b : "";
6539
- const listItems = resultList != null ? resultList : /* @__PURE__ */ jsx61(
6540
- ScrollableList,
6541
- {
6542
- role: "list",
6543
- css: css33`
6544
- > div {
6545
- transition: max-height var(--duration-slow) var(--timing-ease-out);
6546
- max-height: ${selectedListItems.length === 0 ? "50vh" : "184px"};
6547
- }
6548
- `,
6549
- children: /* @__PURE__ */ jsx61(DefaultResultList, {})
6550
- }
6551
- );
6552
- const body = /* @__PURE__ */ jsxs35(VerticalRhythm2, { children: [
6553
- searchFilters,
6554
- listItems
6555
- ] });
6556
- const handleSelectedVariableChange = (selectedValue) => {
6557
- var _a2;
6558
- if (!selectedValue) {
6559
- onSelectItem([]);
6560
- return;
6561
- }
6562
- const { result, errors } = bindVariables({
6563
- value: selectedValue,
6564
- variables: flatVariables,
6565
- errorPrefix: "Dynamic input"
6566
- });
6567
- if (!result) {
6568
- onSelectItem([]);
6569
- return;
6570
- }
6571
- const item = (_a2 = list.items) == null ? void 0 : _a2.find((i) => i.id === result);
6572
- onSelectItem([
6573
- {
6574
- title: selectedValue,
6575
- contentType: (errors == null ? void 0 : errors.length) ? errors[0] instanceof Error ? errors[0].message : errors[0] : `Current dynamic value "${result}" is not an ID in the options`,
6576
- // spread any matched list item, overriding the above default props
6577
- ...item,
6578
- // we want to make sure the ID is our dynamic value
6579
- id: selectedValue
6580
- }
6581
- ]);
6582
- };
6583
- return /* @__PURE__ */ jsx61(IconsProvider, { children: /* @__PURE__ */ jsxs35(VerticalRhythm2, { children: [
6584
- /* @__PURE__ */ jsx61(Container, { backgroundColor: "gray-50", padding: "var(--spacing-base)", border: true, children: label ? /* @__PURE__ */ jsx61(
6585
- InputVariables,
6586
- {
6587
- label,
6588
- value: inputValue,
6589
- onChange: (value) => {
6590
- if (value === inputValue) {
6591
- return;
6592
- }
6593
- handleSelectedVariableChange(value);
6594
- },
6595
- inputWhenNoVariables: body,
6596
- disableVariables: !enableDynamicInputToResultId
6597
- }
6598
- ) : body }),
6599
- children
6600
- ] }) });
6601
- };
6602
- var DefaultResultList = () => {
6603
- var _a;
6604
- const { list } = useObjectSearchContext();
6605
- if (!list.items) {
6606
- return Array.from(Array(5).keys()).map((i) => /* @__PURE__ */ jsx61(ObjectSearchListItemLoadingSkeleton, {}, i));
6607
- }
6608
- if (list.items.length === 0) {
6609
- return /* @__PURE__ */ jsx61(Callout5, { type: "info", children: "No results were found" });
6610
- }
6611
- return (_a = list.items) == null ? void 0 : _a.map((item) => /* @__PURE__ */ jsx61(ObjectSearchListItem, { ...item }, item.id));
6612
- };
6613
-
6614
- // src/components/ObjectSearch/ObjectSearchFilter.tsx
6615
- import { DebouncedInputKeywordSearch, InputSelect as InputSelect6 } from "@uniformdev/design-system";
6616
- import { useMemo as useMemo15, useState as useState17 } from "react";
6617
-
6618
- // src/components/ObjectSearch/styles/ObjectSearchFilterContainer.styles.ts
6619
- import { css as css34 } from "@emotion/react";
6620
- var ObjectSearchFilterContainerLabel = css34`
6621
- align-items: center;
6622
- display: flex;
6623
- font-size: var(--fs-sm);
6624
- font-weight: var(--fw-bold);
6625
- line-height: 1rem;
6626
- margin-bottom: var(--spacing-sm);
6627
- `;
6628
- var ObjectSearchFilterContainer = css34`
6629
- display: grid;
6630
- gap: var(--spacing-base);
6631
- `;
6632
- var ObjectSearchFilterGrid = (gridColumns) => css34`
6633
- display: grid;
6634
- grid-template-columns: ${gridColumns};
6635
- gap: var(--spacing-base);
6636
- `;
6637
-
6638
- // src/components/ObjectSearch/ObjectSearchFilter.tsx
6639
- import { jsx as jsx62, jsxs as jsxs36 } from "@emotion/react/jsx-runtime";
6640
- var ObjectSearchFilter = ({
6641
- requireContentType,
6642
- typeSelectorAllTypesOptionText = "All content types",
6643
- searchInputName = "searchText",
6644
- searchInputPlaceholderText = "Enter keyword to narrow your results",
6645
- selectLabel = "Content Type Select",
6646
- selectOptions
6647
- }) => {
6648
- var _a, _b;
6649
- const { query, onSetQuery } = useObjectSearchContext();
6650
- const [searchState, setSearchState] = useState17({
6651
- contentType: (_a = query.contentType) != null ? _a : "",
6652
- keyword: (_b = query.keyword) != null ? _b : ""
6653
- });
6654
- const handleFilterChange = (value) => {
6655
- setSearchState((prev) => {
6656
- return { ...prev, ...value };
6657
- });
6658
- onSetQuery({ ...query, ...value });
6659
- };
6660
- const memoizedSelectOptions = useMemo15(() => {
6661
- if (!requireContentType && !(selectOptions == null ? void 0 : selectOptions.length)) {
6662
- return [];
6663
- }
6664
- return [
6665
- ...!requireContentType ? [{ value: "any", label: typeSelectorAllTypesOptionText }] : [],
6666
- ...selectOptions != null ? selectOptions : []
6667
- ];
6668
- }, [requireContentType, typeSelectorAllTypesOptionText, selectOptions]);
6669
- const shouldRenderSelect = memoizedSelectOptions.length > 0;
6670
- return /* @__PURE__ */ jsxs36(
6671
- "fieldset",
6672
- {
6673
- css: [
6674
- ObjectSearchFilterContainer,
6675
- ObjectSearchFilterGrid(shouldRenderSelect ? "1fr 2fr" : "1fr")
6676
- ],
6677
- children: [
6678
- memoizedSelectOptions.length ? /* @__PURE__ */ jsx62(
6679
- InputSelect6,
6680
- {
6681
- label: selectLabel,
6682
- showLabel: false,
6683
- onChange: (e) => handleFilterChange({ contentType: e.target.value }),
6684
- options: memoizedSelectOptions,
6685
- value: query.contentType
6686
- }
6687
- ) : null,
6688
- /* @__PURE__ */ jsx62(
6689
- DebouncedInputKeywordSearch,
6690
- {
6691
- inputFieldName: searchInputName,
6692
- placeholder: searchInputPlaceholderText,
6693
- onSearchTextChanged: (keyword) => handleFilterChange({ keyword }),
6694
- disabledFieldSubmission: true,
6695
- defaultValue: searchState.keyword,
6696
- delay: 300
6697
- }
6698
- )
6699
- ]
6700
- }
6701
- );
6702
- };
6703
-
6704
- // src/components/ObjectSearch/ObjectSearchFilterContainer.tsx
6705
- import { jsx as jsx63, jsxs as jsxs37 } from "@emotion/react/jsx-runtime";
6706
- var ObjectSearchFilterContainer2 = ({ label, children }) => {
6707
- return /* @__PURE__ */ jsxs37("div", { children: [
6708
- label ? /* @__PURE__ */ jsx63("span", { css: ObjectSearchFilterContainerLabel, children: label }) : null,
6709
- /* @__PURE__ */ jsx63("div", { css: ObjectSearchFilterContainer, children })
6710
- ] });
6711
- };
6587
+ // src/components/ObjectSearch/ObjectSearchResultList.tsx
6588
+ import { Button as Button5, Counter } from "@uniformdev/design-system";
6589
+ import { Draggable as Draggable3, Droppable as Droppable3 } from "react-beautiful-dnd";
6712
6590
 
6713
6591
  // src/components/ObjectSearch/ObjectSearchResultItem.tsx
6714
6592
  import { Badge, Button as Button4, Popover as Popover2 } from "@uniformdev/design-system";
6715
6593
  import { format as timeagoFormat } from "timeago.js";
6716
6594
 
6717
6595
  // src/components/ObjectSearch/styles/ObjectSearchResultItemButton.styles.ts
6718
- import { css as css35 } from "@emotion/react";
6596
+ import { css as css33 } from "@emotion/react";
6719
6597
  import { button as button2 } from "@uniformdev/design-system";
6720
- var ButtonStyles = css35`
6598
+ var ButtonStyles = css33`
6721
6599
  ${button2}
6722
6600
  background: transparent;
6723
6601
  border: 1px solid var(--typography-base);
@@ -6744,20 +6622,20 @@ var ButtonStyles = css35`
6744
6622
  text-decoration: none;
6745
6623
  }
6746
6624
  `;
6747
- var ButtonIcon = css35`
6625
+ var ButtonIcon = css33`
6748
6626
  width: 1rem;
6749
6627
  height: 1rem;
6750
6628
  `;
6751
6629
 
6752
6630
  // src/components/ObjectSearch/ObjectSearchResultItemButton.tsx
6753
- import { jsx as jsx64, jsxs as jsxs38 } from "@emotion/react/jsx-runtime";
6631
+ import { jsx as jsx61, jsxs as jsxs35 } from "@emotion/react/jsx-runtime";
6754
6632
  var ObjectSearchResultItemButton = ({
6755
6633
  text,
6756
6634
  icon,
6757
6635
  ...props
6758
6636
  }) => {
6759
- return /* @__PURE__ */ jsxs38("button", { type: "button", css: ButtonStyles, ...props, children: [
6760
- !icon ? null : /* @__PURE__ */ jsx64(Image, { src: icon, css: ButtonIcon }),
6637
+ return /* @__PURE__ */ jsxs35("button", { type: "button", css: ButtonStyles, ...props, children: [
6638
+ !icon ? null : /* @__PURE__ */ jsx61(Image, { src: icon, css: ButtonIcon }),
6761
6639
  text
6762
6640
  ] });
6763
6641
  };
@@ -6766,15 +6644,15 @@ var LinkButton = ({
6766
6644
  icon,
6767
6645
  ...props
6768
6646
  }) => {
6769
- return /* @__PURE__ */ jsxs38("a", { ...props, css: ButtonStyles, target: "_blank", rel: "noopener noreferrer", children: [
6770
- !icon ? null : /* @__PURE__ */ jsx64(Image, { src: icon, css: ButtonIcon }),
6647
+ return /* @__PURE__ */ jsxs35("a", { ...props, css: ButtonStyles, target: "_blank", rel: "noopener noreferrer", children: [
6648
+ !icon ? null : /* @__PURE__ */ jsx61(Image, { src: icon, css: ButtonIcon }),
6771
6649
  text
6772
6650
  ] });
6773
6651
  };
6774
6652
 
6775
6653
  // src/components/ObjectSearch/styles/ObjectSearchResultItem.styles.ts
6776
- import { css as css36 } from "@emotion/react";
6777
- var ObjectSearchResultItemContainer = css36`
6654
+ import { css as css34 } from "@emotion/react";
6655
+ var ObjectSearchResultItemContainer = css34`
6778
6656
  align-items: center;
6779
6657
  border: 1px solid var(--gray-300);
6780
6658
  border-radius: var(--rounded-base);
@@ -6790,7 +6668,7 @@ var ObjectSearchResultItemContainer = css36`
6790
6668
  }
6791
6669
  }
6792
6670
  `;
6793
- var ObjectSearchDragHandle = css36`
6671
+ var ObjectSearchDragHandle = css34`
6794
6672
  border-left: 2px dotted var(--gray-300);
6795
6673
  border-right: 2px dotted var(--gray-300);
6796
6674
  position: absolute;
@@ -6799,41 +6677,41 @@ var ObjectSearchDragHandle = css36`
6799
6677
  transition: opacity var(--duration-fast) var(--timing-ease-out);
6800
6678
  opacity: 0;
6801
6679
  `;
6802
- var ObjectSearchResultItemSubtitle = css36`
6680
+ var ObjectSearchResultItemSubtitle = css34`
6803
6681
  color: var(--gray-500);
6804
6682
  display: block;
6805
6683
  font-size: var(--fs-xs);
6806
6684
  line-height: 1;
6807
6685
  `;
6808
- var ObjectSearchResultItemTitle = css36`
6686
+ var ObjectSearchResultItemTitle = css34`
6809
6687
  align-items: center;
6810
6688
  color: var(--typography-base);
6811
6689
  display: flex;
6812
6690
  gap: var(--spacing-xs);
6813
6691
  `;
6814
- var ObjectSearchResultItemTimeStamp = css36`
6692
+ var ObjectSearchResultItemTimeStamp = css34`
6815
6693
  color: var(--gray-500);
6816
6694
  font-size: var(--fs-xs);
6817
6695
  `;
6818
- var ObjectSearchAuthorStateGroup = css36`
6696
+ var ObjectSearchAuthorStateGroup = css34`
6819
6697
  align-items: center;
6820
6698
  display: flex;
6821
6699
  gap: var(--spacing-sm);
6822
6700
  `;
6823
- var ObjectSearchUpdateGroup = css36`
6701
+ var ObjectSearchUpdateGroup = css34`
6824
6702
  display: grid;
6825
6703
  `;
6826
- var ObjectSearchContentContainer = css36`
6704
+ var ObjectSearchContentContainer = css34`
6827
6705
  display: flex;
6828
6706
  gap: var(--spacing-base);
6829
6707
  `;
6830
- var ObjectSearchImage = css36`
6708
+ var ObjectSearchImage = css34`
6831
6709
  width: 56px;
6832
6710
  object-fit: contain;
6833
6711
  `;
6834
6712
 
6835
6713
  // src/components/ObjectSearch/ObjectSearchResultItem.tsx
6836
- import { jsx as jsx65, jsxs as jsxs39 } from "@emotion/react/jsx-runtime";
6714
+ import { jsx as jsx62, jsxs as jsxs36 } from "@emotion/react/jsx-runtime";
6837
6715
  var ObjectSearchResultItem = ({
6838
6716
  id,
6839
6717
  title,
@@ -6857,70 +6735,66 @@ var ObjectSearchResultItem = ({
6857
6735
  onSelectItem({ id, title: id });
6858
6736
  onRemove == null ? void 0 : onRemove();
6859
6737
  };
6860
- return /* @__PURE__ */ jsxs39("div", { css: ObjectSearchResultItemContainer, "data-testid": "search-result-item", children: [
6861
- disableDnD ? null : /* @__PURE__ */ jsx65("div", { role: "presentation", className: "drag-handle", css: ObjectSearchDragHandle }),
6862
- /* @__PURE__ */ jsx65("div", { children: /* @__PURE__ */ jsxs39("div", { css: ObjectSearchContentContainer, children: [
6863
- !imageUrl ? null : /* @__PURE__ */ jsx65("img", { src: imageUrl, alt: `Thumbnail for ${title}`, css: ObjectSearchImage }),
6864
- /* @__PURE__ */ jsxs39("div", { children: [
6865
- /* @__PURE__ */ jsx65("span", { css: ObjectSearchResultItemSubtitle, "data-testid": "sub-title", children: formatedContentType }),
6866
- /* @__PURE__ */ jsxs39("span", { role: "heading", css: ObjectSearchResultItemTitle, "data-testid": "title", children: [
6738
+ return /* @__PURE__ */ jsxs36("div", { css: ObjectSearchResultItemContainer, "data-testid": "search-result-item", children: [
6739
+ disableDnD ? null : /* @__PURE__ */ jsx62("div", { role: "presentation", className: "drag-handle", css: ObjectSearchDragHandle }),
6740
+ /* @__PURE__ */ jsx62("div", { children: /* @__PURE__ */ jsxs36("div", { css: ObjectSearchContentContainer, children: [
6741
+ !imageUrl ? null : /* @__PURE__ */ jsx62("img", { src: imageUrl, alt: `Thumbnail for ${title}`, css: ObjectSearchImage }),
6742
+ /* @__PURE__ */ jsxs36("div", { children: [
6743
+ /* @__PURE__ */ jsx62("span", { css: ObjectSearchResultItemSubtitle, "data-testid": "sub-title", children: formatedContentType }),
6744
+ /* @__PURE__ */ jsxs36("span", { role: "heading", css: ObjectSearchResultItemTitle, "data-testid": "title", children: [
6867
6745
  title != null ? title : name,
6868
- !popoverData ? null : /* @__PURE__ */ jsx65(Popover2, { baseId: title, ariaLabel: title, buttonText: `See ${title} details`, children: popoverData })
6746
+ !popoverData ? null : /* @__PURE__ */ jsx62(Popover2, { baseId: title, ariaLabel: title, buttonText: `See ${title} details`, children: popoverData })
6869
6747
  ] }),
6870
- !createdAt && !publishStatus ? null : /* @__PURE__ */ jsxs39("div", { css: ObjectSearchAuthorStateGroup, children: [
6871
- !(publishStatus == null ? void 0 : publishStatus.text) ? null : /* @__PURE__ */ jsx65(Badge, { ...publishStatus, size: "sm", uppercaseText: true }),
6872
- !createdAt && !publishedAt ? null : /* @__PURE__ */ jsxs39("div", { css: ObjectSearchUpdateGroup, children: [
6873
- !createdAt ? null : /* @__PURE__ */ jsxs39("small", { css: ObjectSearchResultItemTimeStamp, children: [
6874
- /* @__PURE__ */ jsx65("strong", { children: "Last updated: " }),
6748
+ !createdAt && !publishStatus ? null : /* @__PURE__ */ jsxs36("div", { css: ObjectSearchAuthorStateGroup, children: [
6749
+ !(publishStatus == null ? void 0 : publishStatus.text) ? null : /* @__PURE__ */ jsx62(Badge, { ...publishStatus, size: "sm", uppercaseText: true }),
6750
+ !createdAt && !publishedAt ? null : /* @__PURE__ */ jsxs36("div", { css: ObjectSearchUpdateGroup, children: [
6751
+ !createdAt ? null : /* @__PURE__ */ jsxs36("small", { css: ObjectSearchResultItemTimeStamp, children: [
6752
+ /* @__PURE__ */ jsx62("strong", { children: "Last updated: " }),
6875
6753
  timeagoFormat(createdAt)
6876
6754
  ] }),
6877
- !publishedAt ? null : /* @__PURE__ */ jsxs39("small", { css: ObjectSearchResultItemTimeStamp, children: [
6878
- /* @__PURE__ */ jsx65("strong", { children: "Last published: " }),
6755
+ !publishedAt ? null : /* @__PURE__ */ jsxs36("small", { css: ObjectSearchResultItemTimeStamp, children: [
6756
+ /* @__PURE__ */ jsx62("strong", { children: "Last published: " }),
6879
6757
  timeagoFormat(publishedAt)
6880
6758
  ] })
6881
6759
  ] })
6882
6760
  ] }),
6883
- /* @__PURE__ */ jsx65("div", { children })
6761
+ /* @__PURE__ */ jsx62("div", { children })
6884
6762
  ] })
6885
6763
  ] }) }),
6886
- !editLink && hideRemoveButton ? null : /* @__PURE__ */ jsxs39("div", { css: ObjectSearchAuthorStateGroup, children: [
6887
- !editLink ? null : /* @__PURE__ */ jsx65(LinkButton, { text: "Edit", href: editLink, icon: editLinkIcon }),
6888
- hideRemoveButton ? null : /* @__PURE__ */ jsx65(Button4, { buttonType: "ghostDestructive", onClick: onRemoveItem, children: "Remove" })
6764
+ !editLink && hideRemoveButton ? null : /* @__PURE__ */ jsxs36("div", { css: ObjectSearchAuthorStateGroup, children: [
6765
+ !editLink ? null : /* @__PURE__ */ jsx62(LinkButton, { text: "Edit", href: editLink, icon: editLinkIcon }),
6766
+ hideRemoveButton ? null : /* @__PURE__ */ jsx62(Button4, { buttonType: "ghostDestructive", onClick: onRemoveItem, children: "Remove" })
6889
6767
  ] })
6890
6768
  ] });
6891
6769
  };
6892
6770
 
6893
- // src/components/ObjectSearch/ObjectSearchResultList.tsx
6894
- import { Button as Button5, Counter } from "@uniformdev/design-system";
6895
- import { Draggable as Draggable3, Droppable as Droppable3 } from "react-beautiful-dnd";
6896
-
6897
6771
  // src/components/ObjectSearch/styles/ObjectSearchResultList.styles.ts
6898
- import { css as css37 } from "@emotion/react";
6899
- var ObjectSearchResultListContainer = css37`
6772
+ import { css as css35 } from "@emotion/react";
6773
+ var ObjectSearchResultListContainer = css35`
6900
6774
  align-items: center;
6901
6775
  display: flex;
6902
6776
  gap: var(--spacing-sm);
6903
6777
  justify-content: space-between;
6904
6778
  `;
6905
- var ObjectSearchDragContainer = css37`
6779
+ var ObjectSearchDragContainer = css35`
6906
6780
  margin: 0 0 var(--spacing-sm);
6907
6781
  `;
6908
- var ObjectSearchContainerDragging = css37`
6782
+ var ObjectSearchContainerDragging = css35`
6909
6783
  box-shadow: var(--shadow-base);
6910
6784
  opacity: var(--opacity-50);
6911
6785
  `;
6912
- var ObjectSearchResultListCounterContainer = css37`
6786
+ var ObjectSearchResultListCounterContainer = css35`
6913
6787
  align-items: center;
6914
6788
  display: flex;
6915
6789
  gap: var(--spacing-sm);
6916
6790
  `;
6917
- var ObjectSearchResultListTitle = css37`
6791
+ var ObjectSearchResultListTitle = css35`
6918
6792
  font-weight: var(--fw-bold);
6919
6793
  line-height: 1;
6920
6794
  `;
6921
6795
 
6922
6796
  // src/components/ObjectSearch/ObjectSearchResultList.tsx
6923
- import { Fragment as Fragment13, jsx as jsx66, jsxs as jsxs40 } from "@emotion/react/jsx-runtime";
6797
+ import { Fragment as Fragment13, jsx as jsx63, jsxs as jsxs37 } from "@emotion/react/jsx-runtime";
6924
6798
  function ObjectSearchResultList({
6925
6799
  resultLabelText = "Selected",
6926
6800
  removeButtonText = "Remove all",
@@ -6928,7 +6802,7 @@ function ObjectSearchResultList({
6928
6802
  hideRemoveButton = false,
6929
6803
  resultLabelOverride,
6930
6804
  additionalButtons,
6931
- renderResultComponent = (value) => /* @__PURE__ */ jsx66(ObjectSearchResultItem, { ...value }),
6805
+ renderResultComponent = (value) => /* @__PURE__ */ jsx63(ObjectSearchResultItem, { ...value }),
6932
6806
  multiSelectId,
6933
6807
  disableDnD = false,
6934
6808
  getContainerForDnDReparenting,
@@ -6953,9 +6827,10 @@ function ObjectSearchResultList({
6953
6827
  const item = selectedListItems.find((i) => i.id === rubric.draggableId);
6954
6828
  const renderListItem = renderResultComponent({
6955
6829
  ...item,
6830
+ hideRemoveButton,
6956
6831
  disableDnD: selectedListItems.length === 1 || disableDnD
6957
6832
  });
6958
- return /* @__PURE__ */ jsx66(
6833
+ return /* @__PURE__ */ jsx63(
6959
6834
  "div",
6960
6835
  {
6961
6836
  css: [
@@ -6970,16 +6845,16 @@ function ObjectSearchResultList({
6970
6845
  }
6971
6846
  );
6972
6847
  };
6973
- return /* @__PURE__ */ jsxs40(Fragment13, { children: [
6974
- /* @__PURE__ */ jsxs40("div", { role: "group", css: ObjectSearchResultListContainer, children: [
6975
- !resultLabelOverride ? /* @__PURE__ */ jsxs40("div", { role: "note", css: ObjectSearchResultListCounterContainer, children: [
6976
- /* @__PURE__ */ jsx66("span", { css: ObjectSearchResultListTitle, children: resultLabelText }),
6848
+ return /* @__PURE__ */ jsxs37(Fragment13, { children: [
6849
+ /* @__PURE__ */ jsxs37("div", { role: "group", css: ObjectSearchResultListContainer, children: [
6850
+ !resultLabelOverride ? /* @__PURE__ */ jsxs37("div", { role: "note", css: ObjectSearchResultListCounterContainer, children: [
6851
+ /* @__PURE__ */ jsx63("span", { css: ObjectSearchResultListTitle, children: resultLabelText }),
6977
6852
  " ",
6978
- !selectedListItems.length ? null : /* @__PURE__ */ jsx66(Counter, { count: selectedListItems.length })
6853
+ !selectedListItems.length ? null : /* @__PURE__ */ jsx63(Counter, { count: selectedListItems.length })
6979
6854
  ] }) : resultLabelOverride,
6980
- /* @__PURE__ */ jsxs40("div", { css: ObjectSearchResultListCounterContainer, children: [
6855
+ /* @__PURE__ */ jsxs37("div", { css: ObjectSearchResultListCounterContainer, children: [
6981
6856
  additionalButtons,
6982
- hideRemoveButton ? null : /* @__PURE__ */ jsx66(
6857
+ hideRemoveButton ? null : /* @__PURE__ */ jsx63(
6983
6858
  Button5,
6984
6859
  {
6985
6860
  buttonType: "ghostDestructive",
@@ -6991,15 +6866,15 @@ function ObjectSearchResultList({
6991
6866
  )
6992
6867
  ] })
6993
6868
  ] }),
6994
- !selectedListItems.length ? whenNothingSelected : /* @__PURE__ */ jsx66(DragDropContext, { onDragEnd: (res) => onDragEnd(res), children: /* @__PURE__ */ jsx66(
6869
+ !selectedListItems.length ? whenNothingSelected : /* @__PURE__ */ jsx63(DragDropContext, { onDragEnd: (res) => onDragEnd(res), children: /* @__PURE__ */ jsx63(
6995
6870
  Droppable3,
6996
6871
  {
6997
6872
  droppableId: multiSelectId != null ? multiSelectId : "canvas-multi-select",
6998
6873
  renderClone: getContainerForDnDReparenting ? getDraggableItem : void 0,
6999
6874
  getContainerForClone: getContainerForDnDReparenting,
7000
- children: (provided) => /* @__PURE__ */ jsxs40("div", { ...provided.droppableProps, ref: provided.innerRef, children: [
6875
+ children: (provided) => /* @__PURE__ */ jsxs37("div", { ...provided.droppableProps, ref: provided.innerRef, children: [
7001
6876
  selectedListItems.map((item, i) => {
7002
- return /* @__PURE__ */ jsx66(
6877
+ return /* @__PURE__ */ jsx63(
7003
6878
  Draggable3,
7004
6879
  {
7005
6880
  draggableId: item.id,
@@ -7017,28 +6892,292 @@ function ObjectSearchResultList({
7017
6892
  ] });
7018
6893
  }
7019
6894
 
7020
- // src/components/ObjectSearch/QueryFilter.tsx
7021
- import { DebouncedInputKeywordSearch as DebouncedInputKeywordSearch2, Input as Input5, InputSelect as InputSelect7, VerticalRhythm as VerticalRhythm3 } from "@uniformdev/design-system";
7022
- import { useEffect as useEffect16, useState as useState18 } from "react";
7023
- import { jsx as jsx67, jsxs as jsxs41 } from "@emotion/react/jsx-runtime";
7024
- var QueryFilter = ({
7025
- requireContentType,
7026
- queryFilterTitle = "Configure Query",
7027
- contentTypeLabel = "Filter by content type",
7028
- typeSelectorAllTypesOptionText = "All content types",
7029
- contentTypeOptions,
7030
- searchInputName = "searchText",
7031
- searchInputPlaceholderText = "Enter keyword to narrow your results",
7032
- searchInputLabel = "Query",
7033
- countLabel = "Count",
7034
- countValue = 5,
7035
- sortLabel = "Sort By",
7036
- sortOptions,
7037
- sortOrderLabel = "Sort Order",
7038
- sortOrderOptions = [
7039
- {
7040
- value: "asc",
7041
- label: "Ascending"
6895
+ // src/components/ObjectSearch/ObjectSearchContainer.tsx
6896
+ import { Fragment as Fragment14, jsx as jsx64, jsxs as jsxs38 } from "@emotion/react/jsx-runtime";
6897
+ var ObjectSearchContainer = ({
6898
+ label,
6899
+ enableDynamicInputToResultId,
6900
+ searchFilters,
6901
+ resultList,
6902
+ children = /* @__PURE__ */ jsx64(ObjectSearchResultList, {})
6903
+ }) => {
6904
+ var _a, _b;
6905
+ const { onSelectItem, selectedListItems, list, dynamicEntryId, onSetQuery, query } = useObjectSearchContext();
6906
+ const { flatVariables } = useVariables(true);
6907
+ const inputValue = (_b = dynamicEntryId != null ? dynamicEntryId : (_a = selectedListItems[0]) == null ? void 0 : _a.id) != null ? _b : "";
6908
+ const isDynamicEntryIdAvailable = React12.useMemo(
6909
+ () => Boolean(inputValue && hasReferencedVariables(inputValue)),
6910
+ [inputValue]
6911
+ );
6912
+ const listItems = resultList != null ? resultList : /* @__PURE__ */ jsx64(
6913
+ ScrollableList,
6914
+ {
6915
+ role: "list",
6916
+ css: css36`
6917
+ > div {
6918
+ transition: max-height var(--duration-slow) var(--timing-ease-out);
6919
+ max-height: ${selectedListItems.length === 0 ? "50vh" : "184px"};
6920
+ }
6921
+ `,
6922
+ children: /* @__PURE__ */ jsx64(DefaultResultList, {})
6923
+ }
6924
+ );
6925
+ const handleSelectedVariableChange = (selectedValue) => {
6926
+ var _a2;
6927
+ if (!selectedValue) {
6928
+ onSelectItem([]);
6929
+ return;
6930
+ }
6931
+ const { result, errors } = bindVariables({
6932
+ value: selectedValue,
6933
+ variables: flatVariables,
6934
+ errorPrefix: "Dynamic input"
6935
+ });
6936
+ if (!result) {
6937
+ onSelectItem([]);
6938
+ return;
6939
+ }
6940
+ const item = (_a2 = list.items) == null ? void 0 : _a2.find((i) => i.id === result);
6941
+ onSelectItem([
6942
+ {
6943
+ title: selectedValue,
6944
+ contentType: (errors == null ? void 0 : errors.length) ? errors[0] instanceof Error ? errors[0].message : errors[0] : `Current dynamic value "${result}" is not an ID in the options`,
6945
+ // spread any matched list item, overriding the above default props
6946
+ ...item,
6947
+ // we want to make sure the ID is our dynamic value
6948
+ id: selectedValue
6949
+ }
6950
+ ]);
6951
+ if (hasReferencedVariables(selectedValue)) {
6952
+ onSetQuery({ ...query, dynamicEntryId: selectedValue });
6953
+ }
6954
+ };
6955
+ const showSearchList = !label || !isDynamicEntryIdAvailable || !enableDynamicInputToResultId;
6956
+ return /* @__PURE__ */ jsx64(IconsProvider, { children: /* @__PURE__ */ jsxs38(VerticalRhythm3, { children: [
6957
+ /* @__PURE__ */ jsx64(Container, { backgroundColor: "gray-50", padding: "var(--spacing-base)", border: true, children: /* @__PURE__ */ jsxs38(VerticalRhythm3, { children: [
6958
+ label ? /* @__PURE__ */ jsx64(
6959
+ InputVariables,
6960
+ {
6961
+ id: "entryId",
6962
+ label,
6963
+ value: inputValue,
6964
+ onChange: (value) => {
6965
+ if (value === inputValue) {
6966
+ return;
6967
+ }
6968
+ handleSelectedVariableChange(value);
6969
+ },
6970
+ inputWhenNoVariables: /* @__PURE__ */ jsx64(Fragment14, { children: searchFilters }),
6971
+ disableVariables: !enableDynamicInputToResultId
6972
+ }
6973
+ ) : searchFilters,
6974
+ showSearchList ? listItems : null
6975
+ ] }) }),
6976
+ children
6977
+ ] }) });
6978
+ };
6979
+ var DefaultResultList = () => {
6980
+ var _a, _b;
6981
+ const { list, isListLoading } = useObjectSearchContext();
6982
+ if (isListLoading || !list.items) {
6983
+ return Array.from(Array(5).keys()).map((i) => /* @__PURE__ */ jsx64(ObjectSearchListItemLoadingSkeleton, {}, i));
6984
+ }
6985
+ if (((_a = list.items) == null ? void 0 : _a.length) === 0) {
6986
+ return /* @__PURE__ */ jsx64(Callout5, { type: "info", children: "No results were found" });
6987
+ }
6988
+ return (_b = list.items) == null ? void 0 : _b.map((item) => /* @__PURE__ */ jsx64(ObjectSearchListItem, { ...item }, item.id));
6989
+ };
6990
+
6991
+ // src/components/ObjectSearch/ObjectSearchFilter.tsx
6992
+ import { DebouncedInputKeywordSearch, InputSelect as InputSelect6, VerticalRhythm as VerticalRhythm4 } from "@uniformdev/design-system";
6993
+ import { useMemo as useMemo15, useState as useState17 } from "react";
6994
+ import { useDebounce as useDebounce4 } from "react-use";
6995
+
6996
+ // src/utils/createLocationValidator.ts
6997
+ function createLocationValidator(setValue, validate) {
6998
+ return (dispatch) => setValue((previous) => {
6999
+ const { newValue, options } = dispatch(previous);
7000
+ return { newValue, options: validate(newValue, options) };
7001
+ });
7002
+ }
7003
+
7004
+ // src/utils/useContentDataResourceLocaleInfo.ts
7005
+ import { bindVariables as bindVariables2, createVariableReference as createVariableReference4, LOCALE_DYNAMIC_INPUT_NAME as LOCALE_DYNAMIC_INPUT_NAME2 } from "@uniformdev/canvas";
7006
+ import { useEffect as useEffect17, useRef as useRef15 } from "react";
7007
+ function useContentDataResourceLocaleInfo({
7008
+ locale,
7009
+ setLocale,
7010
+ dynamicInputs
7011
+ }) {
7012
+ var _a;
7013
+ const setLocaleRef = useRef15(setLocale);
7014
+ setLocaleRef.current = setLocale;
7015
+ const { flatVariables } = useVariables();
7016
+ const effectiveLocale = locale != null ? locale : dynamicInputs[LOCALE_DYNAMIC_INPUT_NAME2] ? createVariableReference4(LOCALE_DYNAMIC_INPUT_NAME2) : "";
7017
+ const boundLocale = (_a = bindVariables2({ variables: flatVariables, value: effectiveLocale }).result) != null ? _a : effectiveLocale;
7018
+ useEffect17(() => {
7019
+ if (locale === void 0 && effectiveLocale && setLocaleRef.current) {
7020
+ setLocaleRef.current(createVariableReference4(LOCALE_DYNAMIC_INPUT_NAME2));
7021
+ }
7022
+ }, [locale, effectiveLocale]);
7023
+ return { effectiveLocale, boundLocale: boundLocale ? boundLocale : void 0 };
7024
+ }
7025
+
7026
+ // src/components/ObjectSearch/styles/ObjectSearchFilterContainer.styles.ts
7027
+ import { css as css37 } from "@emotion/react";
7028
+ var ObjectSearchFilterContainerLabel = css37`
7029
+ align-items: center;
7030
+ display: flex;
7031
+ font-size: var(--fs-sm);
7032
+ font-weight: var(--fw-bold);
7033
+ line-height: 1rem;
7034
+ margin-bottom: var(--spacing-sm);
7035
+ `;
7036
+ var ObjectSearchFilterContainer = css37`
7037
+ display: grid;
7038
+ gap: var(--spacing-base);
7039
+ `;
7040
+ var ObjectSearchFilterGrid = (gridColumns) => css37`
7041
+ display: grid;
7042
+ grid-template-columns: ${gridColumns};
7043
+ gap: var(--spacing-base);
7044
+ `;
7045
+
7046
+ // src/components/ObjectSearch/ObjectSearchFilter.tsx
7047
+ import { jsx as jsx65, jsxs as jsxs39 } from "@emotion/react/jsx-runtime";
7048
+ var ObjectSearchFilter = ({
7049
+ requireContentType,
7050
+ typeSelectorAllTypesOptionText = "All content types",
7051
+ searchInputName = "searchText",
7052
+ searchInputPlaceholderText = "Enter keyword to narrow your results",
7053
+ selectLabel = "Content Type Select",
7054
+ localeFilterLabel = "Filter by locale",
7055
+ selectOptions
7056
+ }) => {
7057
+ var _a, _b, _c;
7058
+ const { query, onSetQuery, localeOptions, enableFilterByLocale } = useObjectSearchContext();
7059
+ const dynamicInputs = useDataResourceDynamicInputs();
7060
+ const { boundLocale = "", effectiveLocale } = useContentDataResourceLocaleInfo({
7061
+ locale: query.locale,
7062
+ dynamicInputs: dynamicInputs != null ? dynamicInputs : {},
7063
+ setLocale: (newLocale) => handleFilterChange({ locale: newLocale != null ? newLocale : "" })
7064
+ });
7065
+ const [searchState, setSearchState] = useState17({
7066
+ keyword: (_a = query.keyword) != null ? _a : "",
7067
+ contentType: (_b = query.contentType) != null ? _b : "",
7068
+ locale: (_c = query.locale) != null ? _c : ""
7069
+ });
7070
+ const handleFilterChange = (value) => {
7071
+ setSearchState((prev) => {
7072
+ return { ...prev, ...value };
7073
+ });
7074
+ };
7075
+ useDebounce4(
7076
+ () => {
7077
+ onSetQuery({ ...query, ...searchState });
7078
+ },
7079
+ 500,
7080
+ [searchState]
7081
+ );
7082
+ const memoizedSelectOptions = useMemo15(() => {
7083
+ if (!requireContentType && !(selectOptions == null ? void 0 : selectOptions.length)) {
7084
+ return [];
7085
+ }
7086
+ return [
7087
+ ...!requireContentType ? [{ value: "any", label: typeSelectorAllTypesOptionText }] : [],
7088
+ ...selectOptions != null ? selectOptions : []
7089
+ ];
7090
+ }, [requireContentType, typeSelectorAllTypesOptionText, selectOptions]);
7091
+ const shouldRenderSelect = memoizedSelectOptions.length > 0;
7092
+ return /* @__PURE__ */ jsxs39(VerticalRhythm4, { gap: "base", children: [
7093
+ /* @__PURE__ */ jsxs39(
7094
+ "fieldset",
7095
+ {
7096
+ css: [
7097
+ ObjectSearchFilterContainer,
7098
+ ObjectSearchFilterGrid(shouldRenderSelect ? "1fr 2fr" : "1fr")
7099
+ ],
7100
+ children: [
7101
+ memoizedSelectOptions.length ? /* @__PURE__ */ jsx65(
7102
+ InputSelect6,
7103
+ {
7104
+ label: selectLabel,
7105
+ showLabel: false,
7106
+ onChange: (e) => handleFilterChange({ contentType: e.target.value }),
7107
+ options: memoizedSelectOptions,
7108
+ value: query.contentType,
7109
+ "data-testid": "select-entry"
7110
+ }
7111
+ ) : null,
7112
+ /* @__PURE__ */ jsx65(
7113
+ DebouncedInputKeywordSearch,
7114
+ {
7115
+ inputFieldName: searchInputName,
7116
+ placeholder: searchInputPlaceholderText,
7117
+ onSearchTextChanged: (keyword) => handleFilterChange({ keyword }),
7118
+ disabledFieldSubmission: true,
7119
+ defaultValue: searchState.keyword,
7120
+ delay: 300
7121
+ }
7122
+ )
7123
+ ]
7124
+ }
7125
+ ),
7126
+ enableFilterByLocale && (localeOptions == null ? void 0 : localeOptions.length) && /* @__PURE__ */ jsx65(
7127
+ InputVariables,
7128
+ {
7129
+ label: localeFilterLabel,
7130
+ id: "locale",
7131
+ value: effectiveLocale,
7132
+ onChange: (newLocale) => handleFilterChange({ locale: newLocale != null ? newLocale : "" }),
7133
+ disableInlineMenu: true,
7134
+ inputWhenNoVariables: /* @__PURE__ */ jsx65(
7135
+ InputSelect6,
7136
+ {
7137
+ id: "locale",
7138
+ options: localeOptions,
7139
+ name: "locale",
7140
+ label: "",
7141
+ value: boundLocale,
7142
+ onChange: (e) => handleFilterChange({ locale: e.target.value })
7143
+ }
7144
+ )
7145
+ }
7146
+ )
7147
+ ] });
7148
+ };
7149
+
7150
+ // src/components/ObjectSearch/ObjectSearchFilterContainer.tsx
7151
+ import { jsx as jsx66, jsxs as jsxs40 } from "@emotion/react/jsx-runtime";
7152
+ var ObjectSearchFilterContainer2 = ({ label, children }) => {
7153
+ return /* @__PURE__ */ jsxs40("div", { children: [
7154
+ label ? /* @__PURE__ */ jsx66("span", { css: ObjectSearchFilterContainerLabel, children: label }) : null,
7155
+ /* @__PURE__ */ jsx66("div", { css: ObjectSearchFilterContainer, children })
7156
+ ] });
7157
+ };
7158
+
7159
+ // src/components/ObjectSearch/QueryFilter.tsx
7160
+ import { DebouncedInputKeywordSearch as DebouncedInputKeywordSearch2, Input as Input5, InputSelect as InputSelect7, VerticalRhythm as VerticalRhythm5 } from "@uniformdev/design-system";
7161
+ import { useEffect as useEffect18, useState as useState18 } from "react";
7162
+ import { jsx as jsx67, jsxs as jsxs41 } from "@emotion/react/jsx-runtime";
7163
+ var QueryFilter = ({
7164
+ requireContentType,
7165
+ queryFilterTitle = "Configure Query",
7166
+ contentTypeLabel = "Filter by content type",
7167
+ typeSelectorAllTypesOptionText = "All content types",
7168
+ contentTypeOptions,
7169
+ searchInputName = "searchText",
7170
+ searchInputPlaceholderText = "Enter keyword to narrow your results",
7171
+ searchInputLabel = "Query",
7172
+ countLabel = "Count",
7173
+ countValue = 5,
7174
+ sortLabel = "Sort By",
7175
+ sortOptions,
7176
+ sortOrderLabel = "Sort Order",
7177
+ sortOrderOptions = [
7178
+ {
7179
+ value: "asc",
7180
+ label: "Ascending"
7042
7181
  },
7043
7182
  {
7044
7183
  value: "desc",
@@ -7060,12 +7199,12 @@ var QueryFilter = ({
7060
7199
  setQueryState((prev) => ({ ...prev, ...value }));
7061
7200
  onSetQuery({ ...query, ...value });
7062
7201
  };
7063
- useEffect16(() => {
7202
+ useEffect18(() => {
7064
7203
  onSetQuery(queryState);
7065
7204
  }, []);
7066
7205
  return /* @__PURE__ */ jsxs41("fieldset", { children: [
7067
7206
  /* @__PURE__ */ jsx67("span", { css: ObjectSearchFilterContainerLabel, children: queryFilterTitle }),
7068
- /* @__PURE__ */ jsx67("div", { css: ObjectSearchFilterContainer, children: /* @__PURE__ */ jsxs41(VerticalRhythm3, { children: [
7207
+ /* @__PURE__ */ jsx67("div", { css: ObjectSearchFilterContainer, children: /* @__PURE__ */ jsxs41(VerticalRhythm5, { children: [
7069
7208
  /* @__PURE__ */ jsx67(
7070
7209
  InputVariables,
7071
7210
  {
@@ -7185,9 +7324,107 @@ var QueryFilter = ({
7185
7324
  ] });
7186
7325
  };
7187
7326
 
7188
- // src/components/ParamTypeDynamicDataProvider.tsx
7189
- import { useEffect as useEffect17, useMemo as useMemo16, useRef as useRef15 } from "react";
7327
+ // src/components/ObjectSearch/ObjectSearchListOfSearchResults.tsx
7328
+ import { Callout as Callout6 } from "@uniformdev/design-system";
7190
7329
  import { jsx as jsx68 } from "@emotion/react/jsx-runtime";
7330
+ function ObjectSearchListOfSearchResults() {
7331
+ var _a, _b;
7332
+ const { list, isListLoading } = useObjectSearchContext();
7333
+ if (isListLoading) {
7334
+ return Array.from(Array(5).keys()).map((i) => /* @__PURE__ */ jsx68(ObjectSearchListItemLoadingSkeleton, {}, i));
7335
+ }
7336
+ if (((_a = list.items) == null ? void 0 : _a.length) === 0) {
7337
+ return /* @__PURE__ */ jsx68(Callout6, { type: "info", children: "No results were found" });
7338
+ }
7339
+ return (_b = list.items) == null ? void 0 : _b.map((item) => /* @__PURE__ */ jsx68(ObjectSearchListItem, { ...item }, item.id));
7340
+ }
7341
+
7342
+ // src/components/ObjectSearch/hooks/ControlledObjectSearchProvider.tsx
7343
+ import { useCallback as useCallback6, useDeferredValue as useDeferredValue2, useEffect as useEffect19, useMemo as useMemo16, useRef as useRef16 } from "react";
7344
+ import { jsx as jsx69 } from "@emotion/react/jsx-runtime";
7345
+ var ControlledObjectSearchProvider = ({
7346
+ selectedItems,
7347
+ searchResultItems,
7348
+ selectedItemsLoading,
7349
+ searchResultListLoading,
7350
+ onQueryChange = () => {
7351
+ },
7352
+ onSelectItemsChange,
7353
+ isMulti = false,
7354
+ children,
7355
+ query = {},
7356
+ enableFilterByLocale,
7357
+ localeOptions,
7358
+ dynamicEntryId,
7359
+ isManualSelection
7360
+ }) => {
7361
+ var _a, _b;
7362
+ const { flatVariables } = useVariables(true);
7363
+ const querySearchDeferred = useDeferredValue2(query);
7364
+ const innerSelectedItems = useRef16(selectedItems);
7365
+ useEffect19(() => {
7366
+ if (selectedItems !== void 0) {
7367
+ innerSelectedItems.current = selectedItems;
7368
+ }
7369
+ }, [selectedItems]);
7370
+ const onSetQuery = useCallback6(
7371
+ (value) => {
7372
+ const newQuery = { ...query, ...value };
7373
+ onQueryChange(newQuery);
7374
+ },
7375
+ // eslint-disable-next-line react-hooks/exhaustive-deps
7376
+ [onQueryChange]
7377
+ );
7378
+ const onSelectItem = useCallback6(
7379
+ (selectedResult) => {
7380
+ var _a2;
7381
+ if (Array.isArray(selectedResult)) {
7382
+ innerSelectedItems.current = selectedResult;
7383
+ onSelectItemsChange(selectedResult);
7384
+ } else {
7385
+ const itemIsAlreadySelected = selectedItems == null ? void 0 : selectedItems.some((item) => item.id === selectedResult.id);
7386
+ const updatedSelectedItems = itemIsAlreadySelected ? (_a2 = selectedItems == null ? void 0 : selectedItems.filter((item) => item.id !== selectedResult.id)) != null ? _a2 : [] : [...selectedItems != null ? selectedItems : [], selectedResult];
7387
+ innerSelectedItems.current = updatedSelectedItems;
7388
+ onSelectItemsChange(updatedSelectedItems);
7389
+ }
7390
+ },
7391
+ [onSelectItemsChange, selectedItems]
7392
+ );
7393
+ const onRemoveAllSelectedItems = useCallback6(() => {
7394
+ innerSelectedItems.current = [];
7395
+ onSelectItemsChange([]);
7396
+ }, [onSelectItemsChange]);
7397
+ const list = useMemo16(() => ({ items: searchResultItems }), [searchResultItems]);
7398
+ const boundQuery = useMemo16(() => bindQuery(query, flatVariables), [query, flatVariables]);
7399
+ const isLoadingInitially = Boolean(
7400
+ isManualSelection ? !((_a = innerSelectedItems.current) == null ? void 0 : _a.length) && selectedItemsLoading : selectedItemsLoading
7401
+ );
7402
+ return /* @__PURE__ */ jsx69(
7403
+ ObjectSearchContext.Provider,
7404
+ {
7405
+ value: {
7406
+ boundQuery,
7407
+ onSetQuery,
7408
+ query: querySearchDeferred,
7409
+ onSelectItem,
7410
+ selectedListItems: (_b = isManualSelection ? innerSelectedItems.current : selectedItems) != null ? _b : [],
7411
+ onRemoveAllSelectedItems,
7412
+ list,
7413
+ isSelectedItemsListLoading: isLoadingInitially,
7414
+ isListLoading: searchResultListLoading,
7415
+ isMulti,
7416
+ localeOptions,
7417
+ enableFilterByLocale,
7418
+ dynamicEntryId
7419
+ },
7420
+ children
7421
+ }
7422
+ );
7423
+ };
7424
+
7425
+ // src/components/ParamTypeDynamicDataProvider.tsx
7426
+ import { useEffect as useEffect20, useMemo as useMemo17, useRef as useRef17 } from "react";
7427
+ import { jsx as jsx70 } from "@emotion/react/jsx-runtime";
7191
7428
  function ParamTypeDynamicDataProvider(props) {
7192
7429
  const { children } = props;
7193
7430
  const {
@@ -7195,11 +7432,11 @@ function ParamTypeDynamicDataProvider(props) {
7195
7432
  } = useMeshLocation("paramType");
7196
7433
  const dynamicInputsAsVariables = useDynamicInputsAsVariables(dynamicInputs);
7197
7434
  const connectedDataAsVariables = useConnectedDataAsVariables(connectedData);
7198
- const variables = useMemo16(
7435
+ const variables = useMemo17(
7199
7436
  () => ({ ...connectedDataAsVariables, ...dynamicInputsAsVariables }),
7200
7437
  [dynamicInputsAsVariables, connectedDataAsVariables]
7201
7438
  );
7202
- return /* @__PURE__ */ jsx68(VariablesProvider, { value: variables, onChange: () => {
7439
+ return /* @__PURE__ */ jsx70(VariablesProvider, { value: variables, onChange: () => {
7203
7440
  }, editVariableComponent: JsonMeshVariableEditor, children });
7204
7441
  }
7205
7442
  var JsonMeshVariableEditor = ({
@@ -7208,9 +7445,9 @@ var JsonMeshVariableEditor = ({
7208
7445
  variable,
7209
7446
  context
7210
7447
  }) => {
7211
- const sillyRef = useRef15(false);
7448
+ const sillyRef = useRef17(false);
7212
7449
  const { editConnectedData } = useMeshLocation("paramType");
7213
- useEffect17(() => {
7450
+ useEffect20(() => {
7214
7451
  if (sillyRef.current) {
7215
7452
  return;
7216
7453
  }
@@ -7238,102 +7475,2096 @@ var JsonMeshVariableEditor = ({
7238
7475
  return null;
7239
7476
  };
7240
7477
 
7241
- // src/components/SearchAndFilter/filtersMapper.tsx
7242
- import {
7243
- filterMapper,
7244
- FilterMultiChoiceEditor
7245
- } from "@uniformdev/design-system";
7246
- import { DateEditor, FilterSingleChoiceEditor, NumberEditor, TextEditor } from "@uniformdev/design-system";
7247
- import { jsx as jsx69 } from "@emotion/react/jsx-runtime";
7248
- function withInputVariables(WrappedComponent) {
7249
- const WithInputVariables = (props) => {
7250
- if (Array.isArray(props.value) || !props.bindable) {
7251
- return /* @__PURE__ */ jsx69(WrappedComponent, { ...props });
7252
- }
7253
- return /* @__PURE__ */ jsx69(
7254
- InputVariables,
7255
- {
7256
- disableInlineMenu: true,
7257
- showMenuPosition: "inline-right",
7258
- onChange: (newValue) => props.onChange(newValue != null ? newValue : ""),
7259
- value: props.value,
7260
- disabled: props.disabled,
7261
- inputWhenNoVariables: /* @__PURE__ */ jsx69(WrappedComponent, { ...props })
7262
- }
7263
- );
7264
- };
7265
- return WithInputVariables;
7266
- }
7267
- function withInputVariablesForMultiValue(WrappedComponent) {
7268
- const WithInputVariables = (props) => {
7269
- var _a;
7478
+ // src/components/SearchAndFilter/constants.ts
7479
+ var NUMBER_OPERATORS = [
7480
+ {
7481
+ label: "equals...",
7482
+ symbol: "=",
7483
+ value: "eq",
7484
+ editorType: "number"
7485
+ },
7486
+ {
7487
+ label: "does not equal...",
7488
+ symbol: "\u2260",
7489
+ value: "neq",
7490
+ editorType: "number"
7491
+ },
7492
+ {
7493
+ label: "greater than...",
7494
+ symbol: ">",
7495
+ value: "gt",
7496
+ editorType: "number"
7497
+ },
7498
+ {
7499
+ label: "greater than or equal to...",
7500
+ symbol: "\u2265",
7501
+ value: "gte",
7502
+ editorType: "number"
7503
+ },
7504
+ {
7505
+ label: "less than...",
7506
+ symbol: "<",
7507
+ value: "lt",
7508
+ editorType: "number"
7509
+ },
7510
+ {
7511
+ label: "less than or equal to...",
7512
+ symbol: "\u2264",
7513
+ value: "lte",
7514
+ editorType: "number"
7515
+ },
7516
+ {
7517
+ label: "is empty",
7518
+ value: "ndef",
7519
+ editorType: "empty"
7520
+ },
7521
+ {
7522
+ label: "is between...",
7523
+ value: "between",
7524
+ editorType: "numberRange"
7525
+ },
7526
+ {
7527
+ label: "is not empty",
7528
+ value: "def",
7529
+ editorType: "empty"
7530
+ }
7531
+ ];
7532
+ var DATE_OPERATORS = [
7533
+ {
7534
+ label: "is",
7535
+ value: "eq",
7536
+ editorType: "date"
7537
+ },
7538
+ {
7539
+ label: "is between...",
7540
+ value: "between",
7541
+ editorType: "dateRange"
7542
+ },
7543
+ {
7544
+ label: "is before...",
7545
+ value: "lt",
7546
+ editorType: "date"
7547
+ },
7548
+ {
7549
+ label: "is after...",
7550
+ value: "gt",
7551
+ editorType: "date"
7552
+ },
7553
+ {
7554
+ label: "is on or before...",
7555
+ value: "lte",
7556
+ editorType: "date"
7557
+ },
7558
+ {
7559
+ label: "is on or after...",
7560
+ value: "gte",
7561
+ editorType: "date"
7562
+ },
7563
+ {
7564
+ label: "is empty",
7565
+ value: "ndef",
7566
+ editorType: "empty"
7567
+ },
7568
+ {
7569
+ label: "is not",
7570
+ value: "neq",
7571
+ editorType: "date"
7572
+ },
7573
+ {
7574
+ label: "is not empty",
7575
+ value: "def",
7576
+ editorType: "empty"
7577
+ }
7578
+ ];
7579
+ var TEXTBOX_OPERATORS = [
7580
+ {
7581
+ label: "contains...",
7582
+ value: "match",
7583
+ editorType: "text"
7584
+ },
7585
+ {
7586
+ label: "is",
7587
+ value: "eq",
7588
+ editorType: "text"
7589
+ },
7590
+ {
7591
+ label: "is empty",
7592
+ value: "ndef",
7593
+ editorType: "empty"
7594
+ },
7595
+ {
7596
+ label: "starts with...",
7597
+ value: "starts",
7598
+ editorType: "text"
7599
+ },
7600
+ {
7601
+ label: "is not",
7602
+ value: "neq",
7603
+ editorType: "text"
7604
+ },
7605
+ {
7606
+ label: "is not empty",
7607
+ value: "def",
7608
+ editorType: "empty"
7609
+ }
7610
+ ];
7611
+ var USER_OPERATORS = [
7612
+ {
7613
+ label: "contains...",
7614
+ value: "match",
7615
+ editorType: "text"
7616
+ },
7617
+ {
7618
+ label: "is",
7619
+ value: "eq",
7620
+ editorType: "text"
7621
+ },
7622
+ {
7623
+ label: "starts with...",
7624
+ value: "starts",
7625
+ editorType: "text"
7626
+ },
7627
+ {
7628
+ label: "is not",
7629
+ value: "neq",
7630
+ editorType: "text"
7631
+ }
7632
+ ];
7633
+ var SYSTEM_DATE_OPERATORS = [
7634
+ {
7635
+ label: "is",
7636
+ value: "sys-date-eq",
7637
+ editorType: "date"
7638
+ },
7639
+ {
7640
+ label: "is between...",
7641
+ value: "sys-date-between",
7642
+ editorType: "dateRange"
7643
+ },
7644
+ {
7645
+ label: "is before...",
7646
+ value: "sys-date-lt",
7647
+ editorType: "date"
7648
+ },
7649
+ {
7650
+ label: "is after...",
7651
+ value: "sys-date-gt",
7652
+ editorType: "date"
7653
+ },
7654
+ {
7655
+ label: "is on or before...",
7656
+ value: "sys-date-lte",
7657
+ editorType: "date"
7658
+ },
7659
+ {
7660
+ label: "is on or after...",
7661
+ value: "sys-date-gte",
7662
+ editorType: "date"
7663
+ },
7664
+ {
7665
+ label: "is not",
7666
+ value: "sys-date-neq",
7667
+ editorType: "date"
7668
+ }
7669
+ ];
7670
+ var RICHTEXT_OPERATORS = [
7671
+ {
7672
+ label: "contains...",
7673
+ value: "match",
7674
+ editorType: "text"
7675
+ },
7676
+ {
7677
+ label: "is empty",
7678
+ value: "ndef",
7679
+ editorType: "empty"
7680
+ },
7681
+ {
7682
+ label: "starts with...",
7683
+ value: "starts",
7684
+ editorType: "text"
7685
+ },
7686
+ {
7687
+ label: "is not empty",
7688
+ value: "def",
7689
+ editorType: "empty"
7690
+ }
7691
+ ];
7692
+ var CHECKBOX_OPERATORS = [
7693
+ {
7694
+ label: "is checked",
7695
+ value: "def",
7696
+ editorType: "empty"
7697
+ },
7698
+ {
7699
+ label: "is not checked",
7700
+ value: "ndef",
7701
+ editorType: "empty"
7702
+ }
7703
+ ];
7704
+ var SYSTEM_FIELD_OPERATORS = [
7705
+ {
7706
+ label: "is",
7707
+ value: "eq",
7708
+ editorType: "singleChoice"
7709
+ },
7710
+ {
7711
+ label: "is any of...",
7712
+ value: "in",
7713
+ editorType: "multiChoice"
7714
+ },
7715
+ {
7716
+ label: "is not",
7717
+ value: "neq",
7718
+ editorType: "singleChoice"
7719
+ },
7720
+ {
7721
+ label: "is none of...",
7722
+ value: "nin",
7723
+ editorType: "multiChoice"
7724
+ }
7725
+ ];
7726
+ var PUBLISH_STATUS_FIELD_OPERATORS = [
7727
+ {
7728
+ label: "is",
7729
+ value: "eq",
7730
+ editorType: "statusSingleChoice"
7731
+ },
7732
+ {
7733
+ label: "is any of...",
7734
+ value: "in",
7735
+ editorType: "statusMultiChoice"
7736
+ },
7737
+ {
7738
+ label: "is not",
7739
+ value: "neq",
7740
+ editorType: "statusSingleChoice"
7741
+ },
7742
+ {
7743
+ label: "is none of...",
7744
+ value: "nin",
7745
+ editorType: "statusMultiChoice"
7746
+ }
7747
+ ];
7748
+ var SELECT_OPERATORS = [
7749
+ {
7750
+ label: "is",
7751
+ value: "eq",
7752
+ editorType: "singleChoice"
7753
+ },
7754
+ {
7755
+ label: "is any of...",
7756
+ value: "in",
7757
+ editorType: "multiChoice"
7758
+ },
7759
+ {
7760
+ label: "is empty",
7761
+ value: "ndef",
7762
+ editorType: "empty"
7763
+ },
7764
+ {
7765
+ label: "contains...",
7766
+ value: "match",
7767
+ editorType: "text"
7768
+ },
7769
+ {
7770
+ label: "starts with...",
7771
+ value: "starts",
7772
+ editorType: "text"
7773
+ },
7774
+ {
7775
+ label: "is not",
7776
+ value: "neq",
7777
+ editorType: "singleChoice"
7778
+ },
7779
+ {
7780
+ label: "is none of...",
7781
+ value: "nin",
7782
+ editorType: "multiChoice"
7783
+ },
7784
+ {
7785
+ label: "is not empty",
7786
+ value: "def",
7787
+ editorType: "empty"
7788
+ }
7789
+ ];
7790
+
7791
+ // src/components/SearchAndFilter/FilterButton.tsx
7792
+ import { Counter as Counter2, Icon as Icon6 } from "@uniformdev/design-system";
7793
+
7794
+ // src/components/SearchAndFilter/styles/SearchAndFilter.styles.ts
7795
+ import { css as css38 } from "@emotion/react";
7796
+ import { cq, fadeInLtr } from "@uniformdev/design-system";
7797
+ var SearchAndFilterControlsWrapper = (gridColumns) => css38`
7798
+ align-items: stretch;
7799
+ display: grid;
7800
+ grid-template-columns: ${gridColumns};
7801
+ gap: var(--spacing-sm);
7802
+ `;
7803
+ var SearchAndFilterOutterControlWrapper = (gridColumns) => css38`
7804
+ align-items: stretch;
7805
+ display: grid;
7806
+ grid-template-columns: ${gridColumns};
7807
+ gap: var(--spacing-sm);
7808
+ `;
7809
+ var ConditionalFilterRow = css38`
7810
+ display: grid;
7811
+ grid-template-columns: 35px 1fr;
7812
+ gap: var(--spacing-sm);
7813
+ margin-left: var(--spacing-base);
7814
+
7815
+ ${cq("380px")} {
7816
+ align-items: center;
7817
+
7818
+ &:after {
7819
+ content: '';
7820
+ display: block;
7821
+ height: 1px;
7822
+ background: var(--gray-300);
7823
+ width: calc(100% - var(--spacing-base));
7824
+ margin-left: var(--spacing-base);
7825
+ }
7826
+ &:last-of-type:after {
7827
+ display: none;
7828
+ }
7829
+ }
7830
+
7831
+ &:nth-of-type(2) {
7832
+ margin-left: 0;
7833
+ grid-template-columns: 50px 1fr;
7834
+ }
7835
+
7836
+ ${cq("580px")} {
7837
+ &:after {
7838
+ display: none;
7839
+ }
7840
+ }
7841
+
7842
+ @media (prefers-reduced-motion: no-preference) {
7843
+ animation: ${fadeInLtr} var(--duration-fast) var(--timing-ease-out);
7844
+ }
7845
+ `;
7846
+ var ConditionalInputRow = css38`
7847
+ display: flex;
7848
+ gap: var(--spacing-sm);
7849
+ flex-wrap: wrap;
7850
+
7851
+ ${cq("380px")} {
7852
+ & > div:nth-child(-n + 2) {
7853
+ width: calc(50% - var(--spacing-sm));
7854
+ }
7855
+
7856
+ & > div:nth-child(n + 3) {
7857
+ width: calc(100% - 48px);
7858
+ }
7859
+ }
7860
+ ${cq("764px")} {
7861
+ display: grid;
7862
+ grid-template-columns: 200px 160px 1fr 32px;
7863
+
7864
+ & > div:nth-child(n) {
7865
+ width: auto;
7866
+ }
7867
+ }
7868
+ `;
7869
+ var SearchInput = css38`
7870
+ max-height: 40px;
7871
+ min-height: unset;
7872
+ `;
7873
+ var BindableKeywordSearchInputStyles = css38`
7874
+ position: relative;
7875
+ width: 100%;
7876
+
7877
+ & [data-lexical-editor='true'] {
7878
+ padding: var(--spacing-sm) var(--spacing-lg) var(--spacing-sm) var(--spacing-base);
7879
+ font-size: var(--fs-sm);
7880
+ border-radius: var(--rounded-full);
7881
+ max-height: 40px;
7882
+ min-height: unset;
7883
+ width: 100%;
7884
+ position: relative;
7885
+ white-space: nowrap;
7886
+ }
7887
+ `;
7888
+ var ClearSearchButtonContainer = css38`
7889
+ align-items: center;
7890
+ display: flex;
7891
+ position: absolute;
7892
+ inset: 0 var(--spacing-lg) 0 auto;
7893
+ `;
7894
+ var ClearSearchButtonStyles = css38`
7895
+ background: none;
7896
+ border: none;
7897
+ padding: 0;
7898
+ pointer-events: all;
7899
+ `;
7900
+ var FilterButton = css38`
7901
+ align-items: center;
7902
+ background: var(--white);
7903
+ border: 1px solid var(--gray-300);
7904
+ border-radius: var(--rounded-full);
7905
+ color: var(--typography-base);
7906
+ display: flex;
7907
+ font-size: var(--fs-sm);
7908
+ gap: var(--spacing-sm);
7909
+ padding: var(--spacing-sm) var(--spacing-base);
7910
+ max-height: 40px;
7911
+ transition: color var(--duration-fast) var(--timing-ease-out),
7912
+ background-color var(--duration-fast) var(--timing-ease-out),
7913
+ border-color var(--duration-fast) var(--timing-ease-out),
7914
+ box-shadow var(--duration-fast) var(--timing-ease-out);
7915
+
7916
+ svg {
7917
+ color: var(--gray-300);
7918
+ transition: color var(--duration-fast) var(--timing-ease-out);
7919
+ }
7920
+
7921
+ &:hover,
7922
+ :where([aria-expanded='true']) {
7923
+ outline: none;
7924
+ background: var(--gray-200);
7925
+ border-color: var(--gray-300);
7926
+
7927
+ svg {
7928
+ color: var(--typography-base);
7929
+ }
7930
+ }
7931
+
7932
+ &:disabled {
7933
+ opacity: var(--opacity-50);
7934
+ }
7935
+ `;
7936
+ var FilterButtonText = css38`
7937
+ overflow: hidden;
7938
+ text-overflow: ellipsis;
7939
+ white-space: nowrap;
7940
+ max-width: 14ch;
7941
+ `;
7942
+ var FilterButtonSelected = css38`
7943
+ background: var(--gray-100);
7944
+ border-color: var(--gray-300);
7945
+
7946
+ svg {
7947
+ color: var(--accent-dark);
7948
+ }
7949
+ `;
7950
+ var FilterButtonWithOptions = css38`
7951
+ :where([aria-expanded='true']) {
7952
+ background: var(--purple-rain-100);
7953
+ border-color: var(--accent-light);
7954
+ color: var(--typography-base);
7955
+ box-shadow: var(--elevation-100);
7956
+
7957
+ svg {
7958
+ color: var(--accent-dark);
7959
+ }
7960
+ }
7961
+ `;
7962
+ var SearchIcon = css38`
7963
+ color: var(--icon-color);
7964
+ position: absolute;
7965
+ inset: 0 var(--spacing-base) 0 auto;
7966
+ margin: auto;
7967
+ transition: color var(--duration-fast) var(--timing-ease-out);
7968
+ `;
7969
+ var AddConditionalBtn = css38`
7970
+ align-items: center;
7971
+ background: transparent;
7972
+ border: none;
7973
+ color: var(--primary-action-default);
7974
+ display: flex;
7975
+ gap: var(--spacing-sm);
7976
+ transition: color var(--duration-fast) var(--timing-ease-out);
7977
+ padding: 0;
7978
+
7979
+ &:hover,
7980
+ &:focus {
7981
+ color: var(--primary-action-hover);
7982
+ }
7983
+
7984
+ &:disabled {
7985
+ color: var(--gray-400);
7986
+ }
7987
+ `;
7988
+ var Title = css38`
7989
+ color: var(--typography-light);
7990
+
7991
+ &:focus {
7992
+ outline: none;
7993
+ }
7994
+ `;
7995
+ var ResetConditionsBtn = css38`
7996
+ background: transparent;
7997
+ border: none;
7998
+ color: var(--action-destructive-default);
7999
+ transition: color var(--duration-fast) var(--timing-ease-out);
8000
+ padding: 0;
8001
+
8002
+ &:hover,
8003
+ &:focus {
8004
+ color: var(--action-destructive-hover);
8005
+ }
8006
+ `;
8007
+ var IconBtn = css38`
8008
+ background: transparent;
8009
+ border: none;
8010
+ padding: var(--spacing-sm);
8011
+ `;
8012
+ var SearchAndFilterOptionsContainer = css38`
8013
+ background: var(--gray-50);
8014
+ border: 1px solid var(--gray-300);
8015
+ border-radius: var(--rounded-base);
8016
+ container-type: inline-size;
8017
+ display: flex;
8018
+ flex-direction: column;
8019
+ gap: var(--spacing-sm);
8020
+ padding: var(--spacing-md) 0 var(--spacing-base);
8021
+ will-change: height;
8022
+ position: relative;
8023
+ z-index: 1;
8024
+ `;
8025
+ var SearchAndFilterOptionsInnerContainer = css38`
8026
+ display: flex;
8027
+ flex-direction: column;
8028
+ gap: var(--spacing-sm);
8029
+ padding-inline: var(--spacing-md);
8030
+ `;
8031
+ var SearchAndFilterButtonGroup = css38`
8032
+ margin-top: var(--spacing-xs);
8033
+ margin-left: calc(56px + var(--spacing-md));
8034
+ `;
8035
+
8036
+ // src/components/SearchAndFilter/FilterButton.tsx
8037
+ import { jsx as jsx71, jsxs as jsxs42 } from "@emotion/react/jsx-runtime";
8038
+ var FilterButton2 = ({
8039
+ text = "Filters",
8040
+ icon = "filter-add",
8041
+ filterCount,
8042
+ hasSelectedValue,
8043
+ dataTestId,
8044
+ ...props
8045
+ }) => {
8046
+ return /* @__PURE__ */ jsxs42(
8047
+ "button",
8048
+ {
8049
+ type: "button",
8050
+ css: [
8051
+ FilterButton,
8052
+ hasSelectedValue ? FilterButtonSelected : void 0,
8053
+ filterCount ? [FilterButtonWithOptions, FilterButtonSelected] : void 0
8054
+ ],
8055
+ ...props,
8056
+ "data-testid": dataTestId,
8057
+ children: [
8058
+ /* @__PURE__ */ jsx71(Icon6, { icon, iconColor: "currentColor", size: "1rem" }),
8059
+ /* @__PURE__ */ jsx71("span", { css: FilterButtonText, children: text }),
8060
+ filterCount ? /* @__PURE__ */ jsx71(Counter2, { count: filterCount, bgColor: "var(--white)" }) : null
8061
+ ]
8062
+ }
8063
+ );
8064
+ };
8065
+
8066
+ // src/components/SearchAndFilter/FilterControls.tsx
8067
+ import { CgClose as CgClose5 } from "@react-icons/all-files/cg/CgClose";
8068
+ import { Icon as Icon7, InputKeywordSearch as InputKeywordSearch2 } from "@uniformdev/design-system";
8069
+ import { CLEAR_EDITOR_COMMAND as CLEAR_EDITOR_COMMAND2 } from "lexical";
8070
+ import { useEffect as useEffect23, useRef as useRef18, useState as useState21 } from "react";
8071
+ import { useDebounce as useDebounce6 } from "react-use";
8072
+ import { v4 as v43 } from "uuid";
8073
+
8074
+ // src/components/SearchAndFilter/hooks/useSearchAndFilter.tsx
8075
+ import { VerticalRhythm as VerticalRhythm6 } from "@uniformdev/design-system";
8076
+ import {
8077
+ createContext as createContext7,
8078
+ useCallback as useCallback7,
8079
+ useContext as useContext9,
8080
+ useDeferredValue as useDeferredValue3,
8081
+ useEffect as useEffect22,
8082
+ useMemo as useMemo18,
8083
+ useState as useState20
8084
+ } from "react";
8085
+
8086
+ // src/components/SearchAndFilter/FilterEditor.tsx
8087
+ import { FieldMessage, Input as Input6, InputComboBox, StatusBullet } from "@uniformdev/design-system";
8088
+ import { useEffect as useEffect21, useState as useState19 } from "react";
8089
+ import { useDebounce as useDebounce5 } from "react-use";
8090
+ import { Fragment as Fragment15, jsx as jsx72, jsxs as jsxs43 } from "@emotion/react/jsx-runtime";
8091
+ var readOnlyAttributes = {
8092
+ isSearchable: false,
8093
+ menuIsOpen: false,
8094
+ isClearable: false
8095
+ };
8096
+ var FilterMultiChoiceEditor = ({
8097
+ value,
8098
+ options,
8099
+ disabled,
8100
+ readOnly,
8101
+ valueTestId,
8102
+ ...props
8103
+ }) => {
8104
+ const readOnlyProps = readOnly ? readOnlyAttributes : {};
8105
+ const isClearable = !readOnly || !disabled;
8106
+ return /* @__PURE__ */ jsx72("div", { "data-testid": valueTestId, children: /* @__PURE__ */ jsx72(
8107
+ InputComboBox,
8108
+ {
8109
+ ...props,
8110
+ placeholder: "Type to search...",
8111
+ options,
8112
+ isMulti: true,
8113
+ isClearable,
8114
+ isDisabled: disabled,
8115
+ onChange: (e) => {
8116
+ var _a;
8117
+ return props.onChange((_a = e == null ? void 0 : e.map((option) => option.value)) != null ? _a : []);
8118
+ },
8119
+ value: options == null ? void 0 : options.filter((option) => value == null ? void 0 : value.includes(option.value)),
8120
+ "aria-readonly": readOnly,
8121
+ styles: {
8122
+ menu(base) {
8123
+ return {
8124
+ ...base,
8125
+ minWidth: "max-content"
8126
+ };
8127
+ }
8128
+ },
8129
+ ...readOnlyProps
8130
+ }
8131
+ ) });
8132
+ };
8133
+ var FilterSingleChoiceEditor = ({
8134
+ options,
8135
+ value,
8136
+ disabled,
8137
+ readOnly,
8138
+ onChange,
8139
+ valueTestId
8140
+ }) => {
8141
+ var _a;
8142
+ const readOnlyProps = readOnly ? readOnlyAttributes : {};
8143
+ return /* @__PURE__ */ jsx72("div", { "data-testid": valueTestId, children: /* @__PURE__ */ jsx72(
8144
+ InputComboBox,
8145
+ {
8146
+ placeholder: "Type to search...",
8147
+ options,
8148
+ isClearable: true,
8149
+ onChange: (e) => {
8150
+ var _a2;
8151
+ return onChange((_a2 = e == null ? void 0 : e.value) != null ? _a2 : "");
8152
+ },
8153
+ isDisabled: disabled,
8154
+ value: (_a = options == null ? void 0 : options.find((option) => option.value === value)) != null ? _a : null,
8155
+ "aria-readonly": readOnly,
8156
+ styles: {
8157
+ menu(base) {
8158
+ return {
8159
+ ...base,
8160
+ minWidth: "max-content"
8161
+ };
8162
+ }
8163
+ },
8164
+ ...readOnlyProps
8165
+ }
8166
+ ) });
8167
+ };
8168
+ var CustomOptions = ({ label, value }) => {
8169
+ return /* @__PURE__ */ jsx72(StatusBullet, { status: label, message: value });
8170
+ };
8171
+ var StatusMultiEditor = ({
8172
+ options,
8173
+ value,
8174
+ disabled,
8175
+ readOnly,
8176
+ onChange,
8177
+ valueTestId
8178
+ }) => {
8179
+ const readOnlyProps = readOnly ? readOnlyAttributes : {};
8180
+ return /* @__PURE__ */ jsx72("div", { "data-testid": valueTestId, children: /* @__PURE__ */ jsx72(
8181
+ InputComboBox,
8182
+ {
8183
+ options,
8184
+ isMulti: true,
8185
+ onChange: (e) => {
8186
+ var _a;
8187
+ return onChange((_a = e.map((item) => item.value)) != null ? _a : []);
8188
+ },
8189
+ formatOptionLabel: CustomOptions,
8190
+ "aria-readonly": readOnly,
8191
+ value: options == null ? void 0 : options.filter((option) => value == null ? void 0 : value.includes(option.value)),
8192
+ isDisabled: disabled,
8193
+ styles: {
8194
+ menu(base) {
8195
+ return {
8196
+ ...base,
8197
+ minWidth: "max-content"
8198
+ };
8199
+ }
8200
+ },
8201
+ ...readOnlyProps
8202
+ }
8203
+ ) });
8204
+ };
8205
+ var StatusSingleEditor = ({
8206
+ options,
8207
+ value,
8208
+ disabled,
8209
+ readOnly,
8210
+ onChange,
8211
+ valueTestId
8212
+ }) => {
8213
+ const readOnlyProps = readOnly ? readOnlyAttributes : {};
8214
+ return /* @__PURE__ */ jsx72("div", { "data-testid": valueTestId, children: /* @__PURE__ */ jsx72(
8215
+ InputComboBox,
8216
+ {
8217
+ options,
8218
+ onChange: (e) => {
8219
+ var _a;
8220
+ return onChange((_a = e == null ? void 0 : e.value) != null ? _a : "");
8221
+ },
8222
+ formatOptionLabel: CustomOptions,
8223
+ "aria-readonly": readOnly,
8224
+ value: options == null ? void 0 : options.find((option) => option.value === value),
8225
+ isDisabled: disabled,
8226
+ styles: {
8227
+ menu(base) {
8228
+ return {
8229
+ ...base,
8230
+ minWidth: "max-content"
8231
+ };
8232
+ }
8233
+ },
8234
+ ...readOnlyProps
8235
+ }
8236
+ ) });
8237
+ };
8238
+ var TextEditor = ({
8239
+ onChange,
8240
+ ariaLabel,
8241
+ value,
8242
+ readOnly,
8243
+ valueTestId
8244
+ }) => {
8245
+ const [innerValue, setInnerValue] = useState19(value != null ? value : "");
8246
+ useDebounce5(() => onChange(innerValue), 500, [innerValue]);
8247
+ return /* @__PURE__ */ jsx72(
8248
+ Input6,
8249
+ {
8250
+ showLabel: false,
8251
+ label: ariaLabel,
8252
+ onChange: (e) => setInnerValue(e.currentTarget.value),
8253
+ placeholder: "Enter phrase to search\u2026",
8254
+ value: innerValue,
8255
+ readOnly,
8256
+ "data-testid": valueTestId
8257
+ }
8258
+ );
8259
+ };
8260
+ var NumberRangeEditor = ({
8261
+ onChange,
8262
+ disabled,
8263
+ ariaLabel,
8264
+ value,
8265
+ readOnly,
8266
+ valueTestId
8267
+ }) => {
8268
+ const [minValue, setMinValue] = useState19("");
8269
+ const [maxValue, setMaxValue] = useState19("");
8270
+ const [error, setError] = useState19("");
8271
+ useDebounce5(
8272
+ () => {
8273
+ if (minValue && maxValue && !error) {
8274
+ onChange([minValue, maxValue]);
8275
+ } else {
8276
+ onChange([]);
8277
+ }
8278
+ },
8279
+ 500,
8280
+ [minValue, maxValue]
8281
+ );
8282
+ useEffect21(() => {
8283
+ if (!maxValue && !minValue) {
8284
+ return;
8285
+ }
8286
+ const max = Number(maxValue);
8287
+ const min = Number(minValue);
8288
+ if (max < min || min > max) {
8289
+ setError("Please enter a valid numeric range");
8290
+ return;
8291
+ }
8292
+ if (maxValue && !minValue || minValue && !maxValue) {
8293
+ setError("Please enter both a low and high number");
8294
+ return;
8295
+ }
8296
+ if (error) {
8297
+ setError("");
8298
+ }
8299
+ if (min && max) {
8300
+ setMinValue(minValue);
8301
+ setMaxValue(maxValue);
8302
+ }
8303
+ }, [maxValue, minValue, setError]);
8304
+ return /* @__PURE__ */ jsxs43(Fragment15, { children: [
8305
+ /* @__PURE__ */ jsxs43("div", { css: twoColumnGrid, "data-testid": valueTestId, children: [
8306
+ /* @__PURE__ */ jsx72(
8307
+ Input6,
8308
+ {
8309
+ label: `${ariaLabel}-min`,
8310
+ type: "number",
8311
+ showLabel: false,
8312
+ min: 0,
8313
+ placeholder: "Low",
8314
+ onChange: (e) => setMinValue(e.currentTarget.value),
8315
+ "aria-invalid": !error ? false : true,
8316
+ disabled,
8317
+ value: value ? value[0] : "",
8318
+ readOnly,
8319
+ "data-testid": "value-low"
8320
+ }
8321
+ ),
8322
+ /* @__PURE__ */ jsx72(
8323
+ Input6,
8324
+ {
8325
+ type: "number",
8326
+ label: `${ariaLabel}-max`,
8327
+ showLabel: false,
8328
+ min: 0,
8329
+ placeholder: "High",
8330
+ onChange: (e) => setMaxValue(e.currentTarget.value),
8331
+ "aria-invalid": !error ? false : true,
8332
+ disabled,
8333
+ value: value ? value[1] : "",
8334
+ readOnly,
8335
+ "data-testid": "value-high"
8336
+ }
8337
+ )
8338
+ ] }),
8339
+ /* @__PURE__ */ jsx72(ErrorContainer, { errorMessage: error })
8340
+ ] });
8341
+ };
8342
+ var NumberEditor = ({
8343
+ ariaLabel,
8344
+ onChange,
8345
+ disabled,
8346
+ value,
8347
+ readOnly,
8348
+ valueTestId
8349
+ }) => {
8350
+ const [innerValue, setInnerValue] = useState19(value != null ? value : "");
8351
+ useDebounce5(() => onChange(innerValue), 500, [innerValue]);
8352
+ return /* @__PURE__ */ jsx72(
8353
+ Input6,
8354
+ {
8355
+ label: ariaLabel,
8356
+ type: "number",
8357
+ showLabel: false,
8358
+ min: 0,
8359
+ onChange: (e) => setInnerValue(e.currentTarget.value),
8360
+ disabled,
8361
+ value: innerValue,
8362
+ readOnly,
8363
+ "data-testid": valueTestId
8364
+ }
8365
+ );
8366
+ };
8367
+ var DateEditor = ({
8368
+ onChange,
8369
+ ariaLabel,
8370
+ disabled,
8371
+ value,
8372
+ readOnly,
8373
+ valueTestId
8374
+ }) => {
8375
+ const [innerValue, setInnerValue] = useState19(value != null ? value : "");
8376
+ useDebounce5(() => onChange(innerValue), 500, [innerValue]);
8377
+ return /* @__PURE__ */ jsx72(
8378
+ Input6,
8379
+ {
8380
+ type: "date",
8381
+ label: ariaLabel,
8382
+ showLabel: false,
8383
+ onChange: (e) => setInnerValue(e.currentTarget.value),
8384
+ disabled,
8385
+ value: innerValue,
8386
+ readOnly,
8387
+ "data-testid": valueTestId
8388
+ }
8389
+ );
8390
+ };
8391
+ var DateRangeEditor = ({
8392
+ ariaLabel,
8393
+ onChange,
8394
+ disabled,
8395
+ value,
8396
+ readOnly,
8397
+ valueTestId
8398
+ }) => {
8399
+ const [minDateValue, setMinDateValue] = useState19(value ? value[0] : "");
8400
+ const [maxDateValue, setMaxDateValue] = useState19(value ? value[1] : "");
8401
+ const [error, setError] = useState19("");
8402
+ useDebounce5(
8403
+ () => {
8404
+ if (minDateValue && maxDateValue && !error) {
8405
+ onChange([minDateValue, maxDateValue]);
8406
+ } else {
8407
+ onChange([]);
8408
+ }
8409
+ },
8410
+ 500,
8411
+ [minDateValue, maxDateValue]
8412
+ );
8413
+ useEffect21(() => {
8414
+ if (!minDateValue || !maxDateValue) {
8415
+ return;
8416
+ }
8417
+ const minDate = new Date(minDateValue);
8418
+ const maxDate = new Date(maxDateValue);
8419
+ if (maxDate < minDate) {
8420
+ setError("The max date cannot be lower than the min date");
8421
+ return;
8422
+ }
8423
+ if (maxDate && !minDate) {
8424
+ setError("Please enter both a low and high date");
8425
+ return;
8426
+ }
8427
+ const minDateString = minDate.toDateString();
8428
+ const maxDateString = maxDate.toDateString();
8429
+ if (minDateString === maxDateString || maxDateString === minDateString) {
8430
+ setError("The min and max date cannot be the same");
8431
+ return;
8432
+ }
8433
+ if (minDate > maxDate) {
8434
+ setError("The min date cannot be higher than the max date");
8435
+ return;
8436
+ }
8437
+ if (error) {
8438
+ setError("");
8439
+ }
8440
+ if (minDate && maxDate) {
8441
+ setMinDateValue(minDateValue);
8442
+ setMaxDateValue(maxDateValue);
8443
+ } else {
8444
+ setMinDateValue("");
8445
+ setMaxDateValue("");
8446
+ }
8447
+ }, [minDateValue, maxDateValue, setError]);
8448
+ return /* @__PURE__ */ jsxs43(Fragment15, { children: [
8449
+ /* @__PURE__ */ jsxs43("div", { css: twoColumnGrid, "data-testid": valueTestId, children: [
8450
+ /* @__PURE__ */ jsx72(
8451
+ Input6,
8452
+ {
8453
+ label: `${ariaLabel}-min-date`,
8454
+ type: "date",
8455
+ showLabel: false,
8456
+ value: minDateValue,
8457
+ onChange: (e) => setMinDateValue(e.currentTarget.value),
8458
+ "aria-invalid": !error ? false : true,
8459
+ disabled,
8460
+ readOnly,
8461
+ "data-testid": "value-low"
8462
+ }
8463
+ ),
8464
+ /* @__PURE__ */ jsx72(
8465
+ Input6,
8466
+ {
8467
+ label: `${ariaLabel}-max-date`,
8468
+ type: "date",
8469
+ showLabel: false,
8470
+ value: maxDateValue,
8471
+ onChange: (e) => setMaxDateValue(e.currentTarget.value),
8472
+ "aria-invalid": !error ? false : true,
8473
+ disabled,
8474
+ readOnly,
8475
+ "data-testid": "value-high"
8476
+ }
8477
+ )
8478
+ ] }),
8479
+ /* @__PURE__ */ jsx72(ErrorContainer, { errorMessage: error })
8480
+ ] });
8481
+ };
8482
+ var FilterEditorRenderer = ({ editorType, ...props }) => {
8483
+ const { filterMapper: contextFilterMapper } = useSearchAndFilter();
8484
+ const Editor = contextFilterMapper == null ? void 0 : contextFilterMapper[editorType];
8485
+ if (!Editor) {
8486
+ return null;
8487
+ }
8488
+ if (editorType === "empty") {
8489
+ return null;
8490
+ }
8491
+ return /* @__PURE__ */ jsx72(Editor, { ...props });
8492
+ };
8493
+ var filterMapper = {
8494
+ multiChoice: FilterMultiChoiceEditor,
8495
+ singleChoice: FilterSingleChoiceEditor,
8496
+ date: DateEditor,
8497
+ dateRange: DateRangeEditor,
8498
+ text: TextEditor,
8499
+ numberRange: NumberRangeEditor,
8500
+ number: NumberEditor,
8501
+ statusMultiChoice: StatusMultiEditor,
8502
+ statusSingleChoice: StatusSingleEditor,
8503
+ empty: null
8504
+ };
8505
+ function withInputVariables(WrappedComponent) {
8506
+ const WithInputVariables = (props) => {
8507
+ if (Array.isArray(props.value) || !props.bindable || props.disabled || props.readOnly) {
8508
+ return /* @__PURE__ */ jsx72(WrappedComponent, { ...props });
8509
+ }
8510
+ return /* @__PURE__ */ jsx72(
8511
+ InputVariables,
8512
+ {
8513
+ disableInlineMenu: true,
8514
+ showMenuPosition: "inline-right",
8515
+ onChange: (newValue) => props.onChange(newValue != null ? newValue : ""),
8516
+ value: props.value,
8517
+ disabled: props.disabled,
8518
+ inputWhenNoVariables: /* @__PURE__ */ jsx72(WrappedComponent, { ...props })
8519
+ }
8520
+ );
8521
+ };
8522
+ return WithInputVariables;
8523
+ }
8524
+ function withInputVariablesForMultiValue(WrappedComponent) {
8525
+ const WithInputVariables = (props) => {
8526
+ var _a;
7270
8527
  if (!props.bindable || props.disabled || props.readOnly) {
7271
- return /* @__PURE__ */ jsx69(WrappedComponent, { ...props });
8528
+ return /* @__PURE__ */ jsx72(WrappedComponent, { ...props });
8529
+ }
8530
+ return /* @__PURE__ */ jsx72(
8531
+ InputVariables,
8532
+ {
8533
+ disableInlineMenu: true,
8534
+ showMenuPosition: "inline-right",
8535
+ onChange: (newValue) => props.onChange(newValue ? [newValue] : []),
8536
+ value: (_a = props.value) == null ? void 0 : _a[0],
8537
+ inputWhenNoVariables: /* @__PURE__ */ jsx72(WrappedComponent, { ...props })
8538
+ }
8539
+ );
8540
+ };
8541
+ return WithInputVariables;
8542
+ }
8543
+ var bindableFiltersMapper = {
8544
+ ...filterMapper,
8545
+ multiChoice: withInputVariablesForMultiValue(FilterMultiChoiceEditor),
8546
+ singleChoice: withInputVariables(FilterSingleChoiceEditor),
8547
+ date: withInputVariables(DateEditor),
8548
+ text: withInputVariables(TextEditor),
8549
+ number: withInputVariables(NumberEditor)
8550
+ };
8551
+ var ErrorContainer = ({ errorMessage }) => {
8552
+ return /* @__PURE__ */ jsx72(
8553
+ "div",
8554
+ {
8555
+ css: {
8556
+ gridColumn: "span 6",
8557
+ order: 6
8558
+ },
8559
+ children: /* @__PURE__ */ jsx72(FieldMessage, { errorMessage })
8560
+ }
8561
+ );
8562
+ };
8563
+ var twoColumnGrid = {
8564
+ display: "grid",
8565
+ gridTemplateColumns: "1fr 1fr",
8566
+ gap: "var(--spacing-sm);"
8567
+ };
8568
+
8569
+ // src/components/SearchAndFilter/hooks/useSearchAndFilter.tsx
8570
+ import { jsx as jsx73 } from "@emotion/react/jsx-runtime";
8571
+ var SearchAndFilterContext = createContext7({
8572
+ searchTerm: "",
8573
+ setSearchTerm: () => {
8574
+ },
8575
+ filterVisibility: void 0,
8576
+ setFilterVisibility: () => {
8577
+ },
8578
+ filters: [],
8579
+ setFilters: () => {
8580
+ },
8581
+ handleAddFilter: () => {
8582
+ },
8583
+ handleResetFilters: () => {
8584
+ },
8585
+ handleDeleteFilter: () => {
8586
+ },
8587
+ filterOptions: [],
8588
+ validFilterQuery: [],
8589
+ filterMapper: {},
8590
+ totalResults: 0,
8591
+ allowBindingSearchTerm: false
8592
+ });
8593
+ var SearchAndFilterProvider = ({
8594
+ filters,
8595
+ filterOptions,
8596
+ filterVisible = false,
8597
+ defaultSearchTerm = "",
8598
+ onSearchChange,
8599
+ onChange,
8600
+ resetFilterValues = [{ field: "", operator: "", value: "" }],
8601
+ totalResults,
8602
+ filterMapper: filterMapper2 = filterMapper,
8603
+ children,
8604
+ allowBindingSearchTerm
8605
+ }) => {
8606
+ const [searchTerm, setSearchTerm] = useState20(defaultSearchTerm);
8607
+ const deferredSearchTerm = useDeferredValue3(searchTerm);
8608
+ const [filterVisibility, setFilterVisibility] = useState20(filterVisible);
8609
+ const handleSearchTerm = useCallback7(
8610
+ (term) => {
8611
+ setSearchTerm(term);
8612
+ onSearchChange == null ? void 0 : onSearchChange(term);
8613
+ },
8614
+ [setSearchTerm, onSearchChange]
8615
+ );
8616
+ const handleToggleFilterVisibility = useCallback7(
8617
+ (visible) => setFilterVisibility(visible),
8618
+ [setFilterVisibility]
8619
+ );
8620
+ const handleAddFilter = useCallback7(() => {
8621
+ onChange([...filters, { field: "", operator: "", value: "" }]);
8622
+ }, [filters, onChange]);
8623
+ const handleResetFilters = useCallback7(() => {
8624
+ onSearchChange == null ? void 0 : onSearchChange("");
8625
+ onChange(resetFilterValues);
8626
+ }, [onChange, resetFilterValues, onSearchChange]);
8627
+ const handleDeleteFilter = useCallback7(
8628
+ (index) => {
8629
+ const remainingFilters = filters.filter((_, i) => i !== index);
8630
+ onChange(remainingFilters);
8631
+ },
8632
+ [filters, onChange]
8633
+ );
8634
+ const validFilterQuery = useMemo18(() => {
8635
+ const hasValidFilters = filters.every((f) => f.field && f.operator && f.value);
8636
+ if (hasValidFilters) {
8637
+ return filters;
8638
+ }
8639
+ }, [filters]);
8640
+ useEffect22(() => {
8641
+ if (filterVisibility) {
8642
+ const handleEscKeyFilterClose = (e) => {
8643
+ if (e.key === "Escape") {
8644
+ setFilterVisibility(false);
8645
+ }
8646
+ };
8647
+ document.addEventListener("keydown", (e) => handleEscKeyFilterClose(e));
8648
+ return () => {
8649
+ document.removeEventListener("keydown", (e) => handleEscKeyFilterClose(e));
8650
+ };
8651
+ }
8652
+ }, [filterVisibility]);
8653
+ return /* @__PURE__ */ jsx73(
8654
+ SearchAndFilterContext.Provider,
8655
+ {
8656
+ value: {
8657
+ searchTerm: deferredSearchTerm,
8658
+ setSearchTerm: (e) => handleSearchTerm(e),
8659
+ filterVisibility,
8660
+ setFilterVisibility: (e) => handleToggleFilterVisibility(e),
8661
+ filters,
8662
+ setFilters: (e) => onChange(e),
8663
+ handleAddFilter,
8664
+ handleResetFilters,
8665
+ handleDeleteFilter,
8666
+ filterOptions,
8667
+ validFilterQuery,
8668
+ totalResults,
8669
+ filterMapper: filterMapper2,
8670
+ allowBindingSearchTerm
8671
+ },
8672
+ children: /* @__PURE__ */ jsx73(VerticalRhythm6, { children })
8673
+ }
8674
+ );
8675
+ };
8676
+ var useSearchAndFilter = () => {
8677
+ const value = useContext9(SearchAndFilterContext);
8678
+ return { ...value };
8679
+ };
8680
+
8681
+ // src/components/SearchAndFilter/FilterControls.tsx
8682
+ import { Fragment as Fragment16, jsx as jsx74, jsxs as jsxs44 } from "@emotion/react/jsx-runtime";
8683
+ var FilterControls = ({
8684
+ children,
8685
+ hideSearchInput
8686
+ }) => {
8687
+ const {
8688
+ setFilterVisibility,
8689
+ filterVisibility,
8690
+ setSearchTerm,
8691
+ validFilterQuery,
8692
+ searchTerm,
8693
+ allowBindingSearchTerm
8694
+ } = useSearchAndFilter();
8695
+ const editorRef = useRef18(null);
8696
+ const hasVariableInSearchTerm = hasReferencedVariables(searchTerm);
8697
+ const [idToResetInputVariables, setIdToResetInputVariables] = useState21("data-resource-search-term-input");
8698
+ const [localeSearchTerm, setLocaleSearchTerm] = useState21(searchTerm);
8699
+ useDebounce6(
8700
+ () => {
8701
+ setSearchTerm(localeSearchTerm);
8702
+ },
8703
+ 300,
8704
+ [localeSearchTerm]
8705
+ );
8706
+ useEffect23(() => {
8707
+ if (searchTerm === "") {
8708
+ setLocaleSearchTerm("");
8709
+ setIdToResetInputVariables(`data-resource-search-term-input-${v43()}`);
8710
+ }
8711
+ }, [searchTerm]);
8712
+ return /* @__PURE__ */ jsxs44(Fragment16, { children: [
8713
+ /* @__PURE__ */ jsx74(
8714
+ FilterButton2,
8715
+ {
8716
+ "aria-controls": "search-and-filter-options",
8717
+ "aria-label": "filter options",
8718
+ "aria-haspopup": "true",
8719
+ text: "Filter/Sort",
8720
+ "aria-expanded": filterVisibility === true,
8721
+ filterCount: validFilterQuery == null ? void 0 : validFilterQuery.length,
8722
+ onClick: () => setFilterVisibility(!filterVisibility),
8723
+ dataTestId: "filters-button"
8724
+ }
8725
+ ),
8726
+ hideSearchInput ? null : /* @__PURE__ */ jsxs44("div", { css: BindableKeywordSearchInputStyles, children: [
8727
+ /* @__PURE__ */ jsx74(
8728
+ InputVariables,
8729
+ {
8730
+ label: "",
8731
+ id: idToResetInputVariables,
8732
+ showMenuPosition: "inline-right",
8733
+ editorRef,
8734
+ value: localeSearchTerm,
8735
+ onChange: (value) => setLocaleSearchTerm(value != null ? value : ""),
8736
+ disableVariables: !allowBindingSearchTerm,
8737
+ inputWhenNoVariables: /* @__PURE__ */ jsx74(
8738
+ InputKeywordSearch2,
8739
+ {
8740
+ placeholder: "Search...",
8741
+ onSearchTextChanged: (e) => setLocaleSearchTerm(e),
8742
+ value: localeSearchTerm,
8743
+ compact: true,
8744
+ rounded: true,
8745
+ css: SearchInput
8746
+ }
8747
+ )
8748
+ }
8749
+ ),
8750
+ hasVariableInSearchTerm ? /* @__PURE__ */ jsx74("div", { css: ClearSearchButtonContainer, children: /* @__PURE__ */ jsx74(
8751
+ "button",
8752
+ {
8753
+ css: ClearSearchButtonStyles,
8754
+ onClick: () => {
8755
+ setLocaleSearchTerm("");
8756
+ if (editorRef.current) {
8757
+ if (editorRef.current.getRootElement() !== document.activeElement) {
8758
+ editorRef.current.dispatchCommand(CLEAR_EDITOR_COMMAND2, void 0);
8759
+ }
8760
+ }
8761
+ },
8762
+ type: "button",
8763
+ "data-testid": "keyword-search-clear-button",
8764
+ children: /* @__PURE__ */ jsx74(Icon7, { icon: CgClose5, iconColor: "red", size: "1rem" })
8765
+ }
8766
+ ) }) : null
8767
+ ] }),
8768
+ children
8769
+ ] });
8770
+ };
8771
+
8772
+ // src/components/SearchAndFilter/FilterItem.tsx
8773
+ import { Icon as Icon8, InputComboBox as InputComboBox2 } from "@uniformdev/design-system";
8774
+ import { useMemo as useMemo19 } from "react";
8775
+
8776
+ // src/components/SearchAndFilter/FilterMenu.tsx
8777
+ import { HorizontalRhythm as HorizontalRhythm8, VerticalRhythm as VerticalRhythm7 } from "@uniformdev/design-system";
8778
+ import React14, { useEffect as useEffect24 } from "react";
8779
+ import { jsx as jsx75, jsxs as jsxs45 } from "@emotion/react/jsx-runtime";
8780
+ var SearchAndFilterOptionsContainer2 = ({
8781
+ buttonRow,
8782
+ additionalFiltersContainer,
8783
+ children
8784
+ }) => {
8785
+ return /* @__PURE__ */ jsxs45("div", { css: SearchAndFilterOptionsContainer, children: [
8786
+ /* @__PURE__ */ jsx75("div", { css: SearchAndFilterOptionsInnerContainer, children }),
8787
+ buttonRow ? /* @__PURE__ */ jsx75(
8788
+ HorizontalRhythm8,
8789
+ {
8790
+ css: SearchAndFilterButtonGroup,
8791
+ gap: "sm",
8792
+ align: "center",
8793
+ justify: "space-between",
8794
+ children: buttonRow
8795
+ }
8796
+ ) : null,
8797
+ additionalFiltersContainer ? /* @__PURE__ */ jsx75("div", { children: additionalFiltersContainer }) : null
8798
+ ] });
8799
+ };
8800
+ var FilterMenu = ({
8801
+ id,
8802
+ filterTitle = "Show results",
8803
+ menuControls,
8804
+ additionalFiltersContainer,
8805
+ children,
8806
+ dataTestId,
8807
+ resetButtonText = "reset"
8808
+ }) => {
8809
+ const { filterVisibility, setFilterVisibility, handleResetFilters, filters } = useSearchAndFilter();
8810
+ const innerMenuRef = React14.useRef(null);
8811
+ useEffect24(() => {
8812
+ var _a;
8813
+ if (filterVisibility) {
8814
+ (_a = innerMenuRef.current) == null ? void 0 : _a.focus();
8815
+ }
8816
+ }, [filterVisibility]);
8817
+ return /* @__PURE__ */ jsx75(VerticalRhythm7, { gap: "sm", "aria-haspopup": "true", id, "data-testid": dataTestId, children: filterVisibility ? /* @__PURE__ */ jsxs45(
8818
+ SearchAndFilterOptionsContainer2,
8819
+ {
8820
+ buttonRow: menuControls,
8821
+ additionalFiltersContainer,
8822
+ children: [
8823
+ /* @__PURE__ */ jsxs45(HorizontalRhythm8, { gap: "sm", align: "center", justify: "space-between", children: [
8824
+ /* @__PURE__ */ jsx75("span", { css: Title, ref: innerMenuRef, tabIndex: 0, children: filterTitle }),
8825
+ (filters == null ? void 0 : filters.length) ? /* @__PURE__ */ jsx75(
8826
+ "button",
8827
+ {
8828
+ type: "button",
8829
+ css: ResetConditionsBtn,
8830
+ onClick: () => {
8831
+ handleResetFilters();
8832
+ setFilterVisibility(false);
8833
+ },
8834
+ "data-testid": "reset-filters",
8835
+ children: resetButtonText
8836
+ }
8837
+ ) : null
8838
+ ] }),
8839
+ children
8840
+ ]
8841
+ }
8842
+ ) : null });
8843
+ };
8844
+
8845
+ // src/components/SearchAndFilter/FilterItem.tsx
8846
+ import { jsx as jsx76, jsxs as jsxs46 } from "@emotion/react/jsx-runtime";
8847
+ var FilterItem = ({
8848
+ index,
8849
+ paramOptions,
8850
+ operatorOptions,
8851
+ valueOptions,
8852
+ onParamChange,
8853
+ onOperatorChange,
8854
+ onValueChange
8855
+ }) => {
8856
+ var _a, _b;
8857
+ const { filters, handleDeleteFilter, filterOptions } = useSearchAndFilter();
8858
+ const label = filters[index].field !== "" ? filters[index].field : "unknown filter field";
8859
+ const operatorLabel = filters[index].operator !== "" ? `operator ${filters[index].operator}` : "unknown operator";
8860
+ const metaDataLabel = filters[index].value !== "" ? `value ${filters[index].value}` : "unknown value";
8861
+ const metaDataPossibleOptions = (_b = (_a = operatorOptions.find((op) => filters[index].operator === op.value)) == null ? void 0 : _a.editorType) != null ? _b : "singleChoice";
8862
+ const { selectedFieldValue, selectedOperatorValue, selectedMetaValue, readOnly, bindable } = useMemo19(() => {
8863
+ var _a2;
8864
+ const currentSelectedFilter = filterOptions.find((item) => {
8865
+ var _a3;
8866
+ return (_a3 = item.options) == null ? void 0 : _a3.find((op) => op.value === filters[index].field);
8867
+ });
8868
+ const selectedFieldValue2 = (_a2 = currentSelectedFilter == null ? void 0 : currentSelectedFilter.options) == null ? void 0 : _a2.find((item) => {
8869
+ return filters[index].field === item.value;
8870
+ });
8871
+ const isCurrentFieldReadOnly = selectedFieldValue2 == null ? void 0 : selectedFieldValue2.readOnly;
8872
+ const selectedOperatorValue2 = operatorOptions == null ? void 0 : operatorOptions.find((item) => {
8873
+ return filters[index].operator === item.value;
8874
+ });
8875
+ return {
8876
+ selectedFieldValue: selectedFieldValue2,
8877
+ selectedOperatorValue: selectedOperatorValue2 != null ? selectedOperatorValue2 : void 0,
8878
+ selectedMetaValue: filters[index].value,
8879
+ readOnly: isCurrentFieldReadOnly,
8880
+ bindable: selectedFieldValue2 == null ? void 0 : selectedFieldValue2.bindable
8881
+ };
8882
+ }, [filters, filterOptions, index, operatorOptions]);
8883
+ const readOnlyProps = readOnly ? {
8884
+ "aria-readonly": true,
8885
+ isSearchable: false,
8886
+ menuIsOpen: false,
8887
+ isClearable: false
8888
+ } : {};
8889
+ return /* @__PURE__ */ jsxs46("div", { css: ConditionalFilterRow, "data-testid": "filter-item", children: [
8890
+ /* @__PURE__ */ jsx76("span", { children: index === 0 ? "Where" : "and" }),
8891
+ /* @__PURE__ */ jsxs46("div", { css: ConditionalInputRow, children: [
8892
+ /* @__PURE__ */ jsx76(
8893
+ InputComboBox2,
8894
+ {
8895
+ "aria-label": label,
8896
+ options: paramOptions,
8897
+ onChange: (e) => {
8898
+ var _a2;
8899
+ onParamChange((_a2 = e == null ? void 0 : e.value) != null ? _a2 : "");
8900
+ },
8901
+ isOptionDisabled: (option) => {
8902
+ var _a2;
8903
+ return (_a2 = option == null ? void 0 : option.disabled) != null ? _a2 : false;
8904
+ },
8905
+ styles: {
8906
+ menu(base) {
8907
+ return {
8908
+ ...base,
8909
+ minWidth: "max-content"
8910
+ };
8911
+ }
8912
+ },
8913
+ value: selectedFieldValue,
8914
+ ...readOnlyProps,
8915
+ id: "filter-field",
8916
+ name: `filter-field-${index}`
8917
+ }
8918
+ ),
8919
+ /* @__PURE__ */ jsx76(
8920
+ InputComboBox2,
8921
+ {
8922
+ "aria-label": operatorLabel,
8923
+ options: operatorOptions,
8924
+ onChange: (e) => {
8925
+ var _a2;
8926
+ return onOperatorChange((_a2 = e == null ? void 0 : e.value) != null ? _a2 : "");
8927
+ },
8928
+ isDisabled: !filters[index].field,
8929
+ value: selectedOperatorValue,
8930
+ styles: {
8931
+ menu(base) {
8932
+ return {
8933
+ ...base,
8934
+ minWidth: "max-content"
8935
+ };
8936
+ }
8937
+ },
8938
+ ...readOnlyProps,
8939
+ id: "filter-operator",
8940
+ name: `filter-operator-${index}`
8941
+ }
8942
+ ),
8943
+ /* @__PURE__ */ jsx76(
8944
+ FilterEditorRenderer,
8945
+ {
8946
+ "aria-label": metaDataLabel,
8947
+ editorType: metaDataPossibleOptions,
8948
+ options: valueOptions,
8949
+ onChange: (e) => onValueChange(e != null ? e : ""),
8950
+ readOnly,
8951
+ bindable,
8952
+ disabled: !filters[index].operator,
8953
+ value: selectedMetaValue,
8954
+ valueTestId: "filter-value"
8955
+ }
8956
+ ),
8957
+ readOnly || index === 0 ? null : /* @__PURE__ */ jsx76(
8958
+ "button",
8959
+ {
8960
+ type: "button",
8961
+ onClick: () => handleDeleteFilter(index),
8962
+ "aria-label": "delete filter",
8963
+ css: IconBtn,
8964
+ "data-testid": "delete-filter",
8965
+ children: /* @__PURE__ */ jsx76(Icon8, { icon: "trash", iconColor: "red", size: "1rem" })
8966
+ }
8967
+ )
8968
+ ] })
8969
+ ] });
8970
+ };
8971
+ var FilterItems = ({
8972
+ addButtonText = "add condition",
8973
+ additionalFiltersContainer
8974
+ }) => {
8975
+ const { filterOptions, filters, setFilters, handleAddFilter } = useSearchAndFilter();
8976
+ const handleUpdateFilter = (index, prop, value) => {
8977
+ var _a, _b, _c, _d, _e;
8978
+ const next = [...filters];
8979
+ next[index] = { ...next[index], [prop]: value };
8980
+ if (prop === "operator") {
8981
+ if (["eq", "neq", "lt", "gt"].includes(value) && Array.isArray(next[index].value)) {
8982
+ next[index].value = next[index].value[0];
8983
+ }
8984
+ if (filters[index].operator === "ndef" || filters[index].operator === "def") {
8985
+ next[index].value = "";
8986
+ }
8987
+ if (["between"].includes(value) && Array.isArray(next[index].value) === false) {
8988
+ next[index].value = [next[index].value, ""];
8989
+ }
8990
+ if (value === "def" || value === "true") {
8991
+ next[index].value = "true";
8992
+ }
8993
+ if (value === "ndef" || value === "false") {
8994
+ next[index].value = "false";
8995
+ }
8996
+ }
8997
+ if (prop === "field") {
8998
+ const firstOperatorInAvailableOperators = (_e = (_d = (_c = (_b = (_a = filterOptions.find((fo) => {
8999
+ var _a2;
9000
+ return (_a2 = fo.options) == null ? void 0 : _a2.find((op) => op.value === value);
9001
+ })) == null ? void 0 : _a.options) == null ? void 0 : _b.find((op) => op.value === next[index].field)) == null ? void 0 : _c.operatorOptions) == null ? void 0 : _d[0].value) != null ? _e : "eq";
9002
+ next[index].operator = firstOperatorInAvailableOperators;
9003
+ next[index].value = "";
9004
+ }
9005
+ setFilters(next);
9006
+ };
9007
+ return /* @__PURE__ */ jsx76(
9008
+ FilterMenu,
9009
+ {
9010
+ id: "search-and-filter-options",
9011
+ dataTestId: "search-and-filter-options",
9012
+ menuControls: /* @__PURE__ */ jsxs46(
9013
+ "button",
9014
+ {
9015
+ type: "button",
9016
+ css: AddConditionalBtn,
9017
+ onClick: handleAddFilter,
9018
+ "data-testid": "add-filter",
9019
+ children: [
9020
+ /* @__PURE__ */ jsx76(Icon8, { icon: "math-plus", iconColor: "currentColor", size: "1rem" }),
9021
+ addButtonText
9022
+ ]
9023
+ }
9024
+ ),
9025
+ additionalFiltersContainer,
9026
+ children: filters.map((item, i) => {
9027
+ var _a, _b, _c, _d, _e, _f;
9028
+ const availableTypeOptions = (_b = (_a = filterOptions.find((fo) => {
9029
+ var _a2;
9030
+ return (_a2 = fo.options) == null ? void 0 : _a2.find((op) => op.value === item.field);
9031
+ })) == null ? void 0 : _a.options) != null ? _b : [];
9032
+ const possibleValueOptions = (_d = (_c = availableTypeOptions == null ? void 0 : availableTypeOptions.find((op) => op.value === item.field)) == null ? void 0 : _c.valueOptions) != null ? _d : [];
9033
+ const possibleOperators = (_f = (_e = availableTypeOptions == null ? void 0 : availableTypeOptions.find((op) => op.value === item.field)) == null ? void 0 : _e.operatorOptions) != null ? _f : [];
9034
+ return /* @__PURE__ */ jsx76(
9035
+ FilterItem,
9036
+ {
9037
+ index: i,
9038
+ paramOptions: filterOptions,
9039
+ onParamChange: (e) => handleUpdateFilter(i, "field", e),
9040
+ operatorOptions: possibleOperators,
9041
+ onOperatorChange: (e) => handleUpdateFilter(i, "operator", e),
9042
+ onValueChange: (e) => handleUpdateFilter(i, "value", e),
9043
+ valueOptions: possibleValueOptions
9044
+ },
9045
+ i
9046
+ );
9047
+ })
7272
9048
  }
7273
- return /* @__PURE__ */ jsx69(
7274
- InputVariables,
7275
- {
7276
- disableInlineMenu: true,
7277
- showMenuPosition: "inline-right",
7278
- onChange: (newValue) => props.onChange(newValue ? [newValue] : []),
7279
- value: (_a = props.value) == null ? void 0 : _a[0],
7280
- inputWhenNoVariables: /* @__PURE__ */ jsx69(WrappedComponent, { ...props })
7281
- }
7282
- );
9049
+ );
9050
+ };
9051
+
9052
+ // src/components/SearchAndFilter/SearchAndFilter.tsx
9053
+ import { VerticalRhythm as VerticalRhythm8 } from "@uniformdev/design-system";
9054
+
9055
+ // src/components/SearchAndFilter/SearchAndFilterResultContainer.tsx
9056
+ import { Button as Button6, Callout as Callout7, HorizontalRhythm as HorizontalRhythm9, Paragraph } from "@uniformdev/design-system";
9057
+ import { Fragment as Fragment17, jsx as jsx77, jsxs as jsxs47 } from "@emotion/react/jsx-runtime";
9058
+ var SearchAndFilterResultContainer = ({
9059
+ buttonText,
9060
+ clearButtonLabel = "clear",
9061
+ calloutTitle,
9062
+ calloutText,
9063
+ onHandleClear,
9064
+ hideClearButton
9065
+ }) => {
9066
+ const { searchTerm, totalResults, filters, handleResetFilters, setSearchTerm } = useSearchAndFilter();
9067
+ const automateCalloutTitle = () => {
9068
+ if (searchTerm && !filters.length) {
9069
+ return "No search results found";
9070
+ }
9071
+ if (filters.length && !searchTerm) {
9072
+ return "No results match the selected filters";
9073
+ }
9074
+ return "No matching results found";
7283
9075
  };
7284
- return WithInputVariables;
7285
- }
7286
- var bindableFiltersMapper = {
7287
- ...filterMapper,
7288
- multiChoice: withInputVariablesForMultiValue(FilterMultiChoiceEditor),
7289
- singleChoice: withInputVariables(FilterSingleChoiceEditor),
7290
- date: withInputVariables(DateEditor),
7291
- text: withInputVariables(TextEditor),
7292
- number: withInputVariables(NumberEditor)
9076
+ if (totalResults && totalResults > 0) {
9077
+ return null;
9078
+ }
9079
+ const handleClearSearch = () => {
9080
+ setSearchTerm("");
9081
+ if (onHandleClear) {
9082
+ onHandleClear();
9083
+ } else {
9084
+ handleResetFilters();
9085
+ }
9086
+ };
9087
+ return /* @__PURE__ */ jsxs47(Fragment17, { children: [
9088
+ /* @__PURE__ */ jsxs47(HorizontalRhythm9, { children: [
9089
+ /* @__PURE__ */ jsxs47("span", { children: [
9090
+ totalResults,
9091
+ " results ",
9092
+ searchTerm ? `for "${searchTerm}"` : null
9093
+ ] }),
9094
+ !searchTerm || hideClearButton ? null : /* @__PURE__ */ jsx77(Button6, { buttonType: "ghostDestructive", size: "zero", onClick: handleClearSearch, children: clearButtonLabel })
9095
+ ] }),
9096
+ totalResults === 0 ? /* @__PURE__ */ jsxs47(Callout7, { title: calloutTitle != null ? calloutTitle : automateCalloutTitle(), type: "note", children: [
9097
+ calloutText ? /* @__PURE__ */ jsx77(Paragraph, { children: calloutText }) : null,
9098
+ hideClearButton ? null : /* @__PURE__ */ jsx77(Button6, { buttonType: "tertiaryOutline", size: "xs", onClick: handleClearSearch, children: buttonText != null ? buttonText : "Clear search" })
9099
+ ] }) : null
9100
+ ] });
7293
9101
  };
7294
9102
 
7295
- // src/utils/createLocationValidator.ts
7296
- function createLocationValidator(setValue, validate) {
7297
- return (dispatch) => setValue((previous) => {
7298
- const { newValue, options } = dispatch(previous);
7299
- return { newValue, options: validate(newValue, options) };
7300
- });
7301
- }
9103
+ // src/components/SearchAndFilter/SearchAndFilter.tsx
9104
+ import { jsx as jsx78, jsxs as jsxs48 } from "@emotion/react/jsx-runtime";
9105
+ var SearchAndFilter = ({
9106
+ filters,
9107
+ filterOptions,
9108
+ filterVisible,
9109
+ filterControls,
9110
+ viewSwitchControls,
9111
+ resultsContainerView = /* @__PURE__ */ jsx78(SearchAndFilterResultContainer, {}),
9112
+ filterMapper: filterMapper2 = filterMapper,
9113
+ additionalFiltersContainer,
9114
+ onChange,
9115
+ defaultSearchTerm,
9116
+ onSearchChange,
9117
+ totalResults,
9118
+ allowBindingSearchTerm = false,
9119
+ resetFilterValues = []
9120
+ }) => {
9121
+ return /* @__PURE__ */ jsx78(
9122
+ SearchAndFilterProvider,
9123
+ {
9124
+ filters,
9125
+ filterOptions,
9126
+ filterVisible,
9127
+ onChange,
9128
+ defaultSearchTerm,
9129
+ onSearchChange,
9130
+ totalResults,
9131
+ resetFilterValues,
9132
+ filterMapper: filterMapper2,
9133
+ allowBindingSearchTerm,
9134
+ children: /* @__PURE__ */ jsxs48(VerticalRhythm8, { "data-testid": "search-and-filter", children: [
9135
+ /* @__PURE__ */ jsxs48("div", { css: SearchAndFilterOutterControlWrapper(viewSwitchControls ? "1fr auto" : "1fr"), children: [
9136
+ /* @__PURE__ */ jsx78(
9137
+ "div",
9138
+ {
9139
+ css: SearchAndFilterControlsWrapper(viewSwitchControls ? "auto 1fr 0.05fr" : "auto 1fr"),
9140
+ children: !filterControls ? /* @__PURE__ */ jsx78(FilterControls, { hideSearchInput: !onSearchChange }) : filterControls
9141
+ }
9142
+ ),
9143
+ viewSwitchControls
9144
+ ] }),
9145
+ /* @__PURE__ */ jsx78(FilterItems, { additionalFiltersContainer }),
9146
+ resultsContainerView
9147
+ ] })
9148
+ }
9149
+ );
9150
+ };
7302
9151
 
7303
- // src/utils/useContentDataResourceLocaleInfo.ts
7304
- import { bindVariables as bindVariables2, createVariableReference as createVariableReference4, LOCALE_DYNAMIC_INPUT_NAME as LOCALE_DYNAMIC_INPUT_NAME2 } from "@uniformdev/canvas";
7305
- import { useEffect as useEffect18, useRef as useRef16 } from "react";
7306
- function useContentDataResourceLocaleInfo({
7307
- locale,
7308
- setLocale,
7309
- dynamicInputs
7310
- }) {
7311
- var _a;
7312
- const setLocaleRef = useRef16(setLocale);
7313
- setLocaleRef.current = setLocale;
7314
- const { flatVariables } = useVariables();
7315
- const effectiveLocale = locale != null ? locale : dynamicInputs[LOCALE_DYNAMIC_INPUT_NAME2] ? createVariableReference4(LOCALE_DYNAMIC_INPUT_NAME2) : "";
7316
- const boundLocale = (_a = bindVariables2({ variables: flatVariables, value: effectiveLocale }).result) != null ? _a : effectiveLocale;
7317
- useEffect18(() => {
7318
- if (locale === void 0 && effectiveLocale && setLocaleRef.current) {
7319
- setLocaleRef.current(createVariableReference4(LOCALE_DYNAMIC_INPUT_NAME2));
9152
+ // src/components/SearchAndFilter/SearchOnlyFilter.tsx
9153
+ import { InputKeywordSearch as InputKeywordSearch3 } from "@uniformdev/design-system";
9154
+ import { createContext as createContext8, useState as useState22 } from "react";
9155
+ import { useDebounce as useDebounce7 } from "react-use";
9156
+ import { jsx as jsx79 } from "@emotion/react/jsx-runtime";
9157
+ var SearchOnlyContext = createContext8({
9158
+ searchTerm: "",
9159
+ setSearchTerm: () => {
9160
+ }
9161
+ });
9162
+ var SearchOnlyFilter = ({ onSearchChange, maxWidth }) => {
9163
+ const { searchTerm, setSearchTerm } = useSearchAndFilter();
9164
+ const [localeSearchTerm, setLocaleSearchTerm] = useState22("");
9165
+ useDebounce7(
9166
+ () => {
9167
+ setSearchTerm(localeSearchTerm);
9168
+ onSearchChange == null ? void 0 : onSearchChange(localeSearchTerm);
9169
+ },
9170
+ 300,
9171
+ [localeSearchTerm]
9172
+ );
9173
+ return /* @__PURE__ */ jsx79(
9174
+ SearchOnlyContext.Provider,
9175
+ {
9176
+ value: {
9177
+ searchTerm,
9178
+ setSearchTerm: setLocaleSearchTerm
9179
+ },
9180
+ children: /* @__PURE__ */ jsx79("div", { css: { maxWidth: maxWidth != null ? maxWidth : "712px" }, children: /* @__PURE__ */ jsx79(
9181
+ InputKeywordSearch3,
9182
+ {
9183
+ placeholder: "Search...",
9184
+ onSearchTextChanged: (e) => setLocaleSearchTerm(e),
9185
+ value: localeSearchTerm,
9186
+ compact: true,
9187
+ rounded: true
9188
+ }
9189
+ ) })
7320
9190
  }
7321
- }, [locale, effectiveLocale]);
7322
- return { effectiveLocale, boundLocale: boundLocale ? boundLocale : void 0 };
7323
- }
9191
+ );
9192
+ };
9193
+
9194
+ // src/components/SearchAndFilter/SortItems.tsx
9195
+ import { InputComboBox as InputComboBox3, InputSelect as InputSelect8, SegmentedControl, VerticalRhythm as VerticalRhythm9 } from "@uniformdev/design-system";
9196
+
9197
+ // src/components/SearchAndFilter/styles/SortItems.styles.ts
9198
+ import { css as css39 } from "@emotion/react";
9199
+ import { cq as cq2, fadeInLtr as fadeInLtr2 } from "@uniformdev/design-system";
9200
+ var ConditionalFilterRow2 = css39`
9201
+ display: grid;
9202
+ grid-template-columns: 35px 1fr;
9203
+ gap: var(--spacing-sm);
9204
+ margin-left: var(--spacing-base);
9205
+
9206
+ ${cq2("380px")} {
9207
+ align-items: center;
9208
+
9209
+ &:after {
9210
+ content: '';
9211
+ display: block;
9212
+ height: 1px;
9213
+ background: var(--gray-300);
9214
+ width: calc(100% - var(--spacing-base));
9215
+ margin-left: var(--spacing-base);
9216
+ }
9217
+ &:last-of-type:after {
9218
+ display: none;
9219
+ }
9220
+ }
9221
+
9222
+ &:nth-of-type(2) {
9223
+ margin-left: 0;
9224
+ grid-template-columns: 50px 1fr;
9225
+ }
9226
+
9227
+ ${cq2("580px")} {
9228
+ &:after {
9229
+ display: none;
9230
+ }
9231
+ }
9232
+
9233
+ @media (prefers-reduced-motion: no-preference) {
9234
+ animation: ${fadeInLtr2} var(--duration-fast) var(--timing-ease-out);
9235
+ }
9236
+ `;
9237
+ var ConditionalInputRow2 = css39`
9238
+ display: flex;
9239
+ gap: var(--spacing-sm);
9240
+ flex-wrap: wrap;
9241
+
9242
+ ${cq2("380px")} {
9243
+ & > div:nth-child(-n + 2) {
9244
+ width: calc(50% - var(--spacing-sm));
9245
+ }
9246
+
9247
+ & > div:nth-child(n + 3) {
9248
+ width: calc(100% - 48px);
9249
+ }
9250
+ }
9251
+ ${cq2("580px")} {
9252
+ display: grid;
9253
+ grid-template-columns: 200px 160px 1fr 32px;
9254
+
9255
+ & > div:nth-child(n) {
9256
+ width: auto;
9257
+ }
9258
+ }
9259
+ `;
9260
+ var SearchInput2 = css39`
9261
+ max-height: 40px;
9262
+ min-height: unset;
9263
+ `;
9264
+ var FilterButton3 = css39`
9265
+ align-items: center;
9266
+ background: var(--white);
9267
+ border: 1px solid var(--gray-300);
9268
+ border-radius: var(--rounded-full);
9269
+ color: var(--typography-base);
9270
+ display: flex;
9271
+ font-size: var(--fs-sm);
9272
+ gap: var(--spacing-sm);
9273
+ padding: var(--spacing-sm) var(--spacing-base);
9274
+ max-height: 40px;
9275
+ transition: color var(--duration-fast) var(--timing-ease-out),
9276
+ background-color var(--duration-fast) var(--timing-ease-out),
9277
+ border-color var(--duration-fast) var(--timing-ease-out),
9278
+ box-shadow var(--duration-fast) var(--timing-ease-out);
9279
+
9280
+ svg {
9281
+ color: var(--gray-300);
9282
+ transition: color var(--duration-fast) var(--timing-ease-out);
9283
+ }
9284
+
9285
+ &:hover,
9286
+ :where([aria-expanded='true']) {
9287
+ outline: none;
9288
+ background: var(--gray-200);
9289
+ border-color: var(--gray-300);
9290
+
9291
+ svg {
9292
+ color: var(--typography-base);
9293
+ }
9294
+ }
9295
+
9296
+ &:disabled {
9297
+ opacity: var(--opacity-50);
9298
+ }
9299
+ `;
9300
+ var FilterButtonText2 = css39`
9301
+ overflow: hidden;
9302
+ text-overflow: ellipsis;
9303
+ white-space: nowrap;
9304
+ max-width: 14ch;
9305
+ `;
9306
+ var FilterButtonSelected2 = css39`
9307
+ background: var(--gray-100);
9308
+ border-color: var(--gray-300);
9309
+
9310
+ svg {
9311
+ color: var(--accent-dark);
9312
+ }
9313
+ `;
9314
+ var FilterButtonWithOptions2 = css39`
9315
+ :where([aria-expanded='true']) {
9316
+ background: var(--purple-rain-100);
9317
+ border-color: var(--accent-light);
9318
+ color: var(--typography-base);
9319
+ box-shadow: var(--elevation-100);
9320
+
9321
+ svg {
9322
+ color: var(--accent-dark);
9323
+ }
9324
+ }
9325
+ `;
9326
+ var SearchIcon2 = css39`
9327
+ color: var(--icon-color);
9328
+ position: absolute;
9329
+ inset: 0 var(--spacing-base) 0 auto;
9330
+ margin: auto;
9331
+ transition: color var(--duration-fast) var(--timing-ease-out);
9332
+ `;
9333
+ var AddConditionalBtn2 = css39`
9334
+ align-items: center;
9335
+ background: transparent;
9336
+ border: none;
9337
+ color: var(--primary-action-default);
9338
+ display: flex;
9339
+ gap: var(--spacing-sm);
9340
+ transition: color var(--duration-fast) var(--timing-ease-out);
9341
+ padding: 0;
9342
+
9343
+ &:hover,
9344
+ &:focus {
9345
+ color: var(--primary-action-hover);
9346
+ }
9347
+
9348
+ &:disabled {
9349
+ color: var(--gray-400);
9350
+ }
9351
+ `;
9352
+ var Title2 = css39`
9353
+ color: var(--typography-light);
9354
+
9355
+ &:focus {
9356
+ outline: none;
9357
+ }
9358
+ `;
9359
+ var ResetConditionsBtn2 = css39`
9360
+ background: transparent;
9361
+ border: none;
9362
+ color: var(--action-destructive-default);
9363
+ transition: color var(--duration-fast) var(--timing-ease-out);
9364
+ padding: 0;
9365
+
9366
+ &:hover,
9367
+ &:focus {
9368
+ color: var(--action-destructive-hover);
9369
+ }
9370
+ `;
9371
+ var IconBtn2 = css39`
9372
+ background: transparent;
9373
+ border: none;
9374
+ padding: var(--spacing-sm);
9375
+ `;
9376
+ var SearchAndFilterOptionsContainer3 = css39`
9377
+ background: var(--gray-50);
9378
+ border: 1px solid var(--gray-300);
9379
+ border-radius: var(--rounded-base);
9380
+ container-type: inline-size;
9381
+ display: flex;
9382
+ flex-direction: column;
9383
+ gap: var(--spacing-sm);
9384
+ padding: var(--spacing-md) 0 var(--spacing-base);
9385
+ will-change: height;
9386
+ position: relative;
9387
+ z-index: 1;
9388
+ `;
9389
+ var SearchAndFilterOptionsInnerContainer2 = css39`
9390
+ display: flex;
9391
+ flex-direction: column;
9392
+ gap: var(--spacing-sm);
9393
+ padding-inline: var(--spacing-md);
9394
+ `;
9395
+ var SearchAndFilterButtonGroup2 = css39`
9396
+ margin-top: var(--spacing-xs);
9397
+ margin-left: calc(56px + var(--spacing-md));
9398
+ `;
9399
+ var SortFilterWrapper = (hiddenLocaleInput) => css39`
9400
+ align-items: center;
9401
+ border-top: 1px solid var(--gray-300);
9402
+ display: flex;
9403
+ flex-wrap: wrap;
9404
+ gap: var(--spacing-base);
9405
+ padding: var(--spacing-base) var(--spacing-md) 0;
9406
+ position: relative;
9407
+ z-index: 0;
9408
+
9409
+ ${cq2("420px")} {
9410
+ display: grid;
9411
+ grid-template-columns: ${hiddenLocaleInput ? "1fr" : "1fr minmax(140px, 0.25fr)"};
9412
+ }
9413
+ `;
9414
+ var SortFilterInputRow = css39`
9415
+ align-items: center;
9416
+ display: grid;
9417
+ grid-template-columns: 1fr auto;
9418
+ gap: var(--spacing-base);
9419
+ `;
9420
+ var InputVariableWrapper = css39`
9421
+ flex-grow: 1;
9422
+
9423
+ // we need to override label styles nested within the input variable
9424
+ // as these are slightly different from the default label styles
9425
+ label > span {
9426
+ color: var(--typography-light);
9427
+ }
9428
+ `;
9429
+
9430
+ // src/components/SearchAndFilter/SortItems.tsx
9431
+ import { jsx as jsx80, jsxs as jsxs49 } from "@emotion/react/jsx-runtime";
9432
+ var SortItems = ({
9433
+ sortByLabel = "Sort by",
9434
+ localeLabel = "Show locale",
9435
+ sortOptions,
9436
+ sortByValue,
9437
+ onSortChange,
9438
+ localeValue,
9439
+ localeOptions,
9440
+ onLocaleChange,
9441
+ disableSortBinding
9442
+ }) => {
9443
+ var _a, _b;
9444
+ const hideLocaleOptions = !localeOptions || !onLocaleChange;
9445
+ const values = sortByValue == null ? void 0 : sortByValue.split("_");
9446
+ const sortDirection = values == null ? void 0 : values.pop();
9447
+ const sortField = values == null ? void 0 : values.join("_");
9448
+ const currentSelectedOption = (_b = (_a = sortOptions.find((item) => {
9449
+ var _a2;
9450
+ return (_a2 = item.options) == null ? void 0 : _a2.find((option) => option.value === sortField);
9451
+ })) == null ? void 0 : _a.options) == null ? void 0 : _b.find((nestedOption) => nestedOption.value === sortField);
9452
+ const localeLabelValue = sortOptions.length > 1 ? localeLabel : `${localeLabel}s`;
9453
+ return /* @__PURE__ */ jsxs49("div", { css: [SortFilterWrapper(hideLocaleOptions)], "data-testid": "sorting-options", children: [
9454
+ /* @__PURE__ */ jsxs49(VerticalRhythm9, { gap: "xs", children: [
9455
+ /* @__PURE__ */ jsx80("span", { css: Title2, children: sortByLabel }),
9456
+ /* @__PURE__ */ jsxs49("div", { css: SortFilterInputRow, children: [
9457
+ /* @__PURE__ */ jsx80(
9458
+ InputVariables,
9459
+ {
9460
+ disableInlineMenu: disableSortBinding,
9461
+ showMenuPosition: disableSortBinding ? void 0 : "inline-right",
9462
+ value: sortField,
9463
+ valueToResetTo: "created_at",
9464
+ onChange: (e) => onSortChange(`${e}_${sortDirection}`),
9465
+ inputWhenNoVariables: /* @__PURE__ */ jsx80(
9466
+ InputComboBox3,
9467
+ {
9468
+ id: "sort-by-field",
9469
+ "aria-label": "Sort by",
9470
+ options: sortOptions,
9471
+ onChange: (e) => {
9472
+ const fieldName = e == null ? void 0 : e.value;
9473
+ onSortChange(`${fieldName}_${sortDirection}`);
9474
+ },
9475
+ styles: {
9476
+ menu(base) {
9477
+ return {
9478
+ ...base,
9479
+ minWidth: "max-content"
9480
+ };
9481
+ }
9482
+ },
9483
+ value: currentSelectedOption
9484
+ }
9485
+ )
9486
+ }
9487
+ ),
9488
+ /* @__PURE__ */ jsx80(
9489
+ InputVariables,
9490
+ {
9491
+ disableInlineMenu: disableSortBinding,
9492
+ value: sortDirection,
9493
+ valueToResetTo: "DESC",
9494
+ showMenuPosition: disableSortBinding ? void 0 : "inline-right",
9495
+ onChange: (e) => onSortChange(`${sortField}_${e}`),
9496
+ inputWhenNoVariables: /* @__PURE__ */ jsx80(
9497
+ SegmentedControl,
9498
+ {
9499
+ noCheckmark: true,
9500
+ name: "sortBy",
9501
+ hideOptionText: true,
9502
+ iconSize: "1rem",
9503
+ size: "xl",
9504
+ options: [
9505
+ {
9506
+ label: "Ascending",
9507
+ icon: "arrow-up",
9508
+ value: `ASC`,
9509
+ tooltip: "Ascending (e.g. A-Z, oldest to newest)",
9510
+ "data-testid": "sort-ascending"
9511
+ },
9512
+ {
9513
+ label: "Descending",
9514
+ icon: "arrow-down",
9515
+ value: `DESC`,
9516
+ tooltip: "Descending (e.g. Z-A, newest to oldest)",
9517
+ "data-testid": "sort-descending"
9518
+ }
9519
+ ],
9520
+ onChange: (e) => onSortChange(`${sortField}_${e}`),
9521
+ value: sortDirection
9522
+ }
9523
+ )
9524
+ }
9525
+ )
9526
+ ] })
9527
+ ] }),
9528
+ hideLocaleOptions ? null : /* @__PURE__ */ jsx80(VerticalRhythm9, { gap: "xs", css: InputVariableWrapper, children: /* @__PURE__ */ jsx80(
9529
+ InputVariables,
9530
+ {
9531
+ label: localeLabelValue,
9532
+ value: localeValue,
9533
+ showMenuPosition: "inline-right",
9534
+ onChange: (e) => onLocaleChange(e != null ? e : ""),
9535
+ inputWhenNoVariables: /* @__PURE__ */ jsx80(
9536
+ InputSelect8,
9537
+ {
9538
+ name: "localeReturned",
9539
+ "aria-label": localeLabelValue,
9540
+ label: localeLabelValue,
9541
+ showLabel: false,
9542
+ "data-testid": "context-locale",
9543
+ onChange: (e) => {
9544
+ var _a2;
9545
+ return onLocaleChange((_a2 = e.currentTarget.value) != null ? _a2 : "");
9546
+ },
9547
+ options: localeOptions,
9548
+ value: localeValue
9549
+ }
9550
+ )
9551
+ }
9552
+ ) })
9553
+ ] });
9554
+ };
7324
9555
 
7325
9556
  // src/index.ts
7326
9557
  import {
7327
9558
  AddListButton as AddListButton2,
7328
- Button as Button6,
7329
- Callout as Callout6,
9559
+ Button as Button7,
9560
+ Callout as Callout8,
7330
9561
  DrawerContent,
7331
9562
  Heading,
7332
- Input as Input6,
7333
- InputComboBox,
7334
- InputKeywordSearch as InputKeywordSearch2,
7335
- InputSelect as InputSelect8,
7336
- InputToggle,
9563
+ Input as Input7,
9564
+ InputComboBox as InputComboBox4,
9565
+ InputKeywordSearch as InputKeywordSearch4,
9566
+ InputSelect as InputSelect9,
9567
+ InputToggle as InputToggle3,
7337
9568
  Label,
7338
9569
  LoadingIndicator as LoadingIndicator5,
7339
9570
  LoadingOverlay as LoadingOverlay2,
@@ -7357,37 +9588,52 @@ import {
7357
9588
  ScrollableListItem,
7358
9589
  Switch,
7359
9590
  Textarea,
7360
- Theme as Theme3
9591
+ Theme as Theme3,
9592
+ utilityColors
7361
9593
  } from "@uniformdev/design-system";
7362
9594
  export * from "@uniformdev/mesh-sdk";
7363
9595
  export {
7364
9596
  $createVariableNode,
7365
9597
  $isVariableNode,
7366
9598
  AddListButton2 as AddListButton,
7367
- Button6 as Button,
7368
- Callout6 as Callout,
9599
+ Button7 as Button,
9600
+ CHECKBOX_OPERATORS,
9601
+ Callout8 as Callout,
9602
+ ControlledObjectSearchProvider,
7369
9603
  ControlledValuePlugin,
9604
+ DATE_OPERATORS,
7370
9605
  DISCONNECT_VARIABLE_COMMAND,
7371
9606
  DamSelectedItem,
7372
9607
  DataRefreshButton,
7373
9608
  DataResourceDynamicInputProvider,
9609
+ DataResourceInputContext,
7374
9610
  DataResourceVariablesList,
7375
9611
  DataResourceVariablesListExplicit,
7376
9612
  DataSourceEditor,
7377
9613
  DataTypeEditor,
9614
+ DateEditor,
9615
+ DateRangeEditor,
7378
9616
  DefaultSearchRow,
7379
9617
  DefaultSelectedItem,
7380
9618
  DrawerContent,
7381
9619
  EDIT_VARIABLE_COMMAND,
7382
9620
  EntrySearch,
9621
+ FilterButton2 as FilterButton,
9622
+ FilterControls,
9623
+ FilterEditorRenderer,
9624
+ FilterItem,
9625
+ FilterItems,
9626
+ FilterMenu,
9627
+ FilterMultiChoiceEditor,
9628
+ FilterSingleChoiceEditor,
7383
9629
  Heading,
7384
9630
  INSERT_VARIABLE_COMMAND,
7385
9631
  icons_exports as Icons,
7386
- Input6 as Input,
7387
- InputComboBox,
7388
- InputKeywordSearch2 as InputKeywordSearch,
7389
- InputSelect8 as InputSelect,
7390
- InputToggle,
9632
+ Input7 as Input,
9633
+ InputComboBox4 as InputComboBox,
9634
+ InputKeywordSearch4 as InputKeywordSearch,
9635
+ InputSelect9 as InputSelect,
9636
+ InputToggle3 as InputToggle,
7391
9637
  InputVariables,
7392
9638
  Label,
7393
9639
  LinkButton,
@@ -7396,16 +9642,22 @@ export {
7396
9642
  Menu4 as Menu,
7397
9643
  MenuItem3 as MenuItem,
7398
9644
  MeshApp,
9645
+ NUMBER_OPERATORS,
9646
+ NumberEditor,
9647
+ NumberRangeEditor,
7399
9648
  OPEN_INSERT_VARIABLE_COMMAND,
7400
9649
  ObjectSearchContainer,
9650
+ ObjectSearchContext,
7401
9651
  ObjectSearchFilter,
7402
9652
  ObjectSearchFilterContainer2 as ObjectSearchFilterContainer,
7403
9653
  ObjectSearchListItem,
7404
9654
  ObjectSearchListItemLoadingSkeleton,
9655
+ ObjectSearchListOfSearchResults,
7405
9656
  ObjectSearchProvider,
7406
9657
  ObjectSearchResultItem,
7407
9658
  ObjectSearchResultItemButton,
7408
9659
  ObjectSearchResultList,
9660
+ PUBLISH_STATUS_FIELD_OPERATORS,
7409
9661
  ParamTypeDynamicDataProvider,
7410
9662
  ParameterConnectionIndicator,
7411
9663
  ParameterGroup,
@@ -7433,6 +9685,7 @@ export {
7433
9685
  ProductSearchRow,
7434
9686
  ProductSelectedItem,
7435
9687
  QueryFilter,
9688
+ RICHTEXT_OPERATORS,
7436
9689
  RequestBody,
7437
9690
  RequestHeaders,
7438
9691
  RequestMethodSelect,
@@ -7442,19 +9695,36 @@ export {
7442
9695
  RequestUrl,
7443
9696
  RequestUrlInput,
7444
9697
  ResolvableLoadingValue,
9698
+ SELECT_OPERATORS,
9699
+ SYSTEM_DATE_OPERATORS,
9700
+ SYSTEM_FIELD_OPERATORS,
7445
9701
  ScrollableList2 as ScrollableList,
7446
9702
  ScrollableListItem,
9703
+ SearchAndFilter,
9704
+ SearchAndFilterContext,
9705
+ SearchAndFilterOptionsContainer2 as SearchAndFilterOptionsContainer,
9706
+ SearchAndFilterProvider,
9707
+ SearchAndFilterResultContainer,
9708
+ SearchOnlyContext,
9709
+ SearchOnlyFilter,
7447
9710
  SelectionField,
9711
+ SortItems,
9712
+ StatusMultiEditor,
9713
+ StatusSingleEditor,
7448
9714
  Switch,
9715
+ TEXTBOX_OPERATORS,
9716
+ TextEditor,
7449
9717
  TextVariableRenderer,
7450
9718
  Textarea,
7451
9719
  Theme3 as Theme,
9720
+ USER_OPERATORS,
7452
9721
  VariableEditor,
7453
9722
  VariableNode,
7454
9723
  VariablesList,
7455
9724
  VariablesPlugin,
7456
9725
  VariablesProvider,
7457
9726
  badgeIcon,
9727
+ bindQuery,
7458
9728
  bindableFiltersMapper,
7459
9729
  convertConnectedDataToVariable,
7460
9730
  createLocationValidator,
@@ -7486,6 +9756,7 @@ export {
7486
9756
  entrySearchSelectInput,
7487
9757
  entrySearchSelectOption,
7488
9758
  entrySearchWrapper,
9759
+ filterMapper,
7489
9760
  hasReferencedVariables,
7490
9761
  prettifyBindExpression,
7491
9762
  productSearchRowActiveIcon,
@@ -7527,6 +9798,7 @@ export {
7527
9798
  urlEncodeRequestUrl,
7528
9799
  useConnectedDataAsVariables,
7529
9800
  useContentDataResourceLocaleInfo,
9801
+ useDataResourceDynamicInputs,
7530
9802
  useDynamicInputsAsVariables,
7531
9803
  useMeshLocation,
7532
9804
  useObjectSearchContext,
@@ -7536,10 +9808,12 @@ export {
7536
9808
  useRequest,
7537
9809
  useRequestHeader,
7538
9810
  useRequestParameter,
9811
+ useSearchAndFilter,
7539
9812
  useUniformMeshSdk,
7540
9813
  useVariableEditor,
7541
9814
  useVariables,
7542
9815
  useVariablesMenu,
9816
+ utilityColors,
7543
9817
  variableDefaultTextValue,
7544
9818
  variablePrefix,
7545
9819
  variableSuffix,