npm - @integration-app/react - Versions diffs - 2.20.0 → 2.22.0 - Mend

@integration-app/react 2.20.0 → 2.22.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (697) hide show

package/dist/esm/components/ComboBox/{Edit/OptionSelector.mjs → ComboboxTriggers/ComboboxTagTrigger.mjs} RENAMED Viewed

@@ -2,45 +2,81 @@
 /*
  * Integration App React package
  * {@link https://www.npmjs.com/package/@integration-app/react}
- * v2.20.0
+ * v2.22.0
  */
 'use client';
 import { jsx, jsxs, Fragment } from 'react/jsx-runtime';
-import { useRef, forwardRef } from 'react';
-import { clsx } from 'clsx';
+import { useRef } from 'react';
 import { DropdownCategoryType } from '../shared.mjs';
 import { getRefElement } from '../../../helpers/getRefElement.mjs';
-import classes from './OptionSelector.module.css.mjs';
+import '../../../styled-system/css/css.mjs';
+import '../../../styled-system/helpers.mjs';
+import { sva } from '../../../styled-system/css/sva.mjs';
+import { ComboboxContainer } from '../../ComboBoxElements/ComboboxContainer/index.mjs';
 import { isClickOnEditorComponent } from '../../ComboBoxElements/Editor/helpers/clicks.mjs';
-import { FieldWrapper } from '../../ComboBoxElements/FieldWrapper.mjs';
-import { ActionBar } from '../../DataBuilderUI/index.mjs';
+import '../../DataBuilderUI/FieldControlPanel/index.mjs';
+import { ActionBar } from '../../DataBuilderUI/ActionBar.mjs';
+import '../../DataBuilderUI/Cell.mjs';
+import 'clsx';
+import '../../DataBuilderUI/styles.module.css.mjs';
+import '../../DataBuilderUI/Row.mjs';
+import '../../DataBuilderUI/Title.mjs';
+import { ComboBoxValueBadge } from '../Badges/ComboBoxValueBadge.mjs';
+import { isDefinedValue } from '../Badges/isDefinedValue.mjs';
 import { useComboBox } from '../context/combobox-context.mjs';
 import { useComboBoxDropdownContext } from '../context/combobox-dropdown-context.mjs';
 import { Dropdown } from '../Dropdown/Dropdown.mjs';
-import '../Value/Formula.mjs';
-import '../Value/Schema.mjs';
-import { ComboBoxValue } from '../Value/ComboBoxValue.mjs';
-import { isDefinedValue } from '../Value/isDefinedValue.mjs';
-function OptionSelector({
+const badgeWrapperRecipe = sva({
+  className: "badge-wrapper",
+  slots: ["root", "action-bar"],
+  base: {
+    root: {
+      position: "relative",
+      display: "inline-flex",
+      maxW: "full",
+      w: "fit-content"
+    },
+    "action-bar": {
+      display: "none"
+    }
+  },
+  variants: {
+    expanded: {
+      true: {
+        "action-bar": {
+          position: "absolute",
+          top: "0",
+          left: "full",
+          bottom: "0",
+          mr: "0",
+          w: "0",
+          zIndex: "1"
+        }
+      },
+      false: {}
+    }
+  }
+});
+function ComboboxTagTrigger({
   placeholder,
   className,
   onChange,
   disabled,
-  required,
-  valueComponent
+  valueComponent,
+  ...rest
 }) {
   const valueRef = useRef(null);
   const fieldValueRef = useRef(null);
   const {
-    value,
     refsToIgnoreClick,
     // Dropdown related
     isDropdownOpen,
     openDropdown,
     closeDropdown,
-    topDropdownPanelComponent
+    topDropdownPanelComponent,
+    value
   } = useComboBox();
   const { activeCategory } = useComboBoxDropdownContext();
   function handleOpenDropdown() {
@@ -66,58 +102,40 @@ function OptionSelector({
     onChange(void 0);
     closeDropdown();
   };
-  const requiredAndEmptyField = required && isDefinedValue(value);
+  const styles = badgeWrapperRecipe({ expanded: isDropdownOpen });
   return /* @__PURE__ */ jsx(
-    FieldWrapper,
+    ComboboxContainer,
     {
-      role: "combobox",
       ref: fieldValueRef,
       "aria-expanded": isDropdownOpen,
+      "data-tag-dropdown-open": isDropdownOpen,
+      "data-selected": rest["data-selected"],
       onClick: handleClick,
       disabled,
-      requiredAndEmptyField,
+      level: "tag",
       children: /* @__PURE__ */ jsx(
         Dropdown,
         {
           topDropdownPanelComponent,
           autoFocusOnSearch: true,
           onOptionSelect: handleOptionSelect,
-          children: /* @__PURE__ */ jsx(
-            Value,
+          children: /* @__PURE__ */ jsx("span", { className: styles.root, ref: valueRef, children: valueComponent ? /* @__PURE__ */ jsxs(Fragment, { children: [
+            valueComponent,
+            isDefinedValue(value) && /* @__PURE__ */ jsx(ActionBar, { className: styles["action-bar"], children: /* @__PURE__ */ jsx(ActionBar.DeleteButton, { onClick: handleOnDelete }) })
+          ] }) : /* @__PURE__ */ jsx(
+            ComboBoxValueBadge,
             {
-              ref: valueRef,
-              valueComponent,
+              className,
               placeholder,
               disabled,
-              className,
-              onChange,
-              onDelete: handleOnDelete,
-              isEdited: isDropdownOpen
+              isDropdownOpen,
+              onDelete: handleOnDelete
             }
-          )
+          ) })
         }
       )
     }
   );
 }
-const Value = forwardRef(
-  ({ className, valueComponent, placeholder, onClick, onChange, onDelete, disabled, isEdited }, ref) => {
-    const { value } = useComboBox();
-    return /* @__PURE__ */ jsxs("span", { className: classes.valueWrapper, ref, children: [
-      !!valueComponent ? /* @__PURE__ */ jsx(Fragment, { children: valueComponent }) : /* @__PURE__ */ jsx(
-        ComboBoxValue,
-        {
-          className,
-          placeholder,
-          onClick,
-          onChange,
-          disabled,
-          isEdited
-        }
-      ),
-      isDefinedValue(value) && onDelete && /* @__PURE__ */ jsx(ActionBar, { className: clsx(classes.actionBar, isEdited && classes.actionBar__visible), children: /* @__PURE__ */ jsx(ActionBar.DeleteButton, { onClick: onDelete }) })
-    ] });
-  }
-);
-export { OptionSelector };
+export { ComboboxTagTrigger };

package/dist/esm/components/ComboBox/Dropdown/ActiveCategoryContent.mjs CHANGED Viewed

@@ -2,7 +2,7 @@
 /*
  * Integration App React package
  * {@link https://www.npmjs.com/package/@integration-app/react}
- * v2.20.0
+ * v2.22.0
  */
 'use client';

package/dist/esm/components/ComboBox/Dropdown/Categories/CustomValue.mjs CHANGED Viewed

@@ -2,7 +2,7 @@
 /*
  * Integration App React package
  * {@link https://www.npmjs.com/package/@integration-app/react}
- * v2.20.0
+ * v2.22.0
  */
 'use client';

package/dist/esm/components/ComboBox/Dropdown/Categories/Formulas/DropdownPanelFormulaConfig.mjs CHANGED Viewed

@@ -2,7 +2,7 @@
 /*
  * Integration App React package
  * {@link https://www.npmjs.com/package/@integration-app/react}
- * v2.20.0
+ * v2.22.0
  */
 'use client';

package/dist/esm/components/ComboBox/Dropdown/Categories/Formulas/index.mjs CHANGED Viewed

@@ -2,7 +2,7 @@
 /*
  * Integration App React package
  * {@link https://www.npmjs.com/package/@integration-app/react}
- * v2.20.0
+ * v2.22.0
  */
 'use client';

package/dist/esm/components/ComboBox/Dropdown/Categories/Lookup.mjs CHANGED Viewed

@@ -2,7 +2,7 @@
 /*
  * Integration App React package
  * {@link https://www.npmjs.com/package/@integration-app/react}
- * v2.20.0
+ * v2.22.0
  */
 'use client';

package/dist/esm/components/ComboBox/Dropdown/Categories/LookupOptions/ParametersPanel.mjs CHANGED Viewed

@@ -2,7 +2,7 @@
 /*
  * Integration App React package
  * {@link https://www.npmjs.com/package/@integration-app/react}
- * v2.20.0
+ * v2.22.0
  */
 'use client';

package/dist/esm/components/ComboBox/Dropdown/Categories/LookupOptions/UiComponents.mjs CHANGED Viewed

@@ -2,7 +2,7 @@
 /*
  * Integration App React package
  * {@link https://www.npmjs.com/package/@integration-app/react}
- * v2.20.0
+ * v2.22.0
  */
 'use client';

package/dist/esm/components/ComboBox/Dropdown/Categories/LookupOptions/index.mjs CHANGED Viewed

@@ -2,7 +2,7 @@
 /*
  * Integration App React package
  * {@link https://www.npmjs.com/package/@integration-app/react}
- * v2.20.0
+ * v2.22.0
  */
 'use client';

package/dist/esm/components/ComboBox/Dropdown/Categories/Options.mjs CHANGED Viewed

@@ -2,7 +2,7 @@
 /*
  * Integration App React package
  * {@link https://www.npmjs.com/package/@integration-app/react}
- * v2.20.0
+ * v2.22.0
  */
 'use client';

package/dist/esm/components/ComboBox/Dropdown/Categories/Root.mjs CHANGED Viewed

@@ -2,7 +2,7 @@
 /*
  * Integration App React package
  * {@link https://www.npmjs.com/package/@integration-app/react}
- * v2.20.0
+ * v2.22.0
  */
 'use client';

package/dist/esm/components/ComboBox/Dropdown/Categories/Variables.mjs CHANGED Viewed

@@ -2,7 +2,7 @@
 /*
  * Integration App React package
  * {@link https://www.npmjs.com/package/@integration-app/react}
- * v2.20.0
+ * v2.22.0
  */
 'use client';

package/dist/esm/components/ComboBox/Dropdown/Categories/getLookupCollection.mjs CHANGED Viewed

@@ -2,7 +2,7 @@
 /*
  * Integration App React package
  * {@link https://www.npmjs.com/package/@integration-app/react}
- * v2.20.0
+ * v2.22.0
  */
 'use client';

package/dist/esm/components/ComboBox/Dropdown/DrillUpButton.mjs CHANGED Viewed

@@ -2,7 +2,7 @@
 /*
  * Integration App React package
  * {@link https://www.npmjs.com/package/@integration-app/react}
- * v2.20.0
+ * v2.22.0
  */
 'use client';

package/dist/esm/components/ComboBox/Dropdown/Dropdown.mjs CHANGED Viewed

@@ -2,7 +2,7 @@
 /*
  * Integration App React package
  * {@link https://www.npmjs.com/package/@integration-app/react}
- * v2.20.0
+ * v2.22.0
  */
 'use client';
@@ -25,8 +25,15 @@ function Dropdown({
   children
 }) {
   const { availableCategories } = useComboBoxDropdownContext();
-  if (availableCategories === null) {
-    return children;
+  if (!availableCategories) {
+    return /* @__PURE__ */ jsx(DropdownStackContextProvider, { editorRef, children: /* @__PURE__ */ jsxs(DropdownPopoverProvider, { disabled: true, children: [
+      /* @__PURE__ */ jsx(DropdownAnchor, { children }),
+      /* @__PURE__ */ jsx(DropdownPopoverContent, { children: /* @__PURE__ */ jsxs(DropdownUI.List, { children: [
+        /* @__PURE__ */ jsx(DropdownUI.LoadingItem, {}),
+        /* @__PURE__ */ jsx(DropdownUI.LoadingItem, {}),
+        /* @__PURE__ */ jsx(DropdownUI.LoadingItem, {})
+      ] }) })
+    ] }) });
   }
   if (availableCategories?.length < 1) {
     return /* @__PURE__ */ jsx(DropdownStackContextProvider, { editorRef, children: /* @__PURE__ */ jsxs(DropdownPopoverProvider, { children: [

package/dist/esm/components/ComboBox/Dropdown/KeyboardNavigation/NavigationContext.mjs CHANGED Viewed

@@ -2,7 +2,7 @@
 /*
  * Integration App React package
  * {@link https://www.npmjs.com/package/@integration-app/react}
- * v2.20.0
+ * v2.22.0
  */
 'use client';

package/dist/esm/components/ComboBox/Dropdown/KeyboardNavigation/useKeyboardBinding.mjs CHANGED Viewed

@@ -2,7 +2,7 @@
 /*
  * Integration App React package
  * {@link https://www.npmjs.com/package/@integration-app/react}
- * v2.20.0
+ * v2.22.0
  */
 'use client';

package/dist/esm/components/ComboBox/Dropdown/Option.mjs CHANGED Viewed

@@ -2,7 +2,7 @@
 /*
  * Integration App React package
  * {@link https://www.npmjs.com/package/@integration-app/react}
- * v2.20.0
+ * v2.22.0
  */
 'use client';

package/dist/esm/components/ComboBox/Dropdown/OptionsList.mjs CHANGED Viewed

@@ -2,7 +2,7 @@
 /*
  * Integration App React package
  * {@link https://www.npmjs.com/package/@integration-app/react}
- * v2.20.0
+ * v2.22.0
  */
 'use client';

package/dist/esm/components/ComboBox/Dropdown/SearchInput.mjs CHANGED Viewed

@@ -2,7 +2,7 @@
 /*
  * Integration App React package
  * {@link https://www.npmjs.com/package/@integration-app/react}
- * v2.20.0
+ * v2.22.0
  */
 'use client';

package/dist/esm/components/ComboBox/Dropdown/categoryContentMapping.mjs CHANGED Viewed

@@ -2,7 +2,7 @@
 /*
  * Integration App React package
  * {@link https://www.npmjs.com/package/@integration-app/react}
- * v2.20.0
+ * v2.22.0
  */
 'use client';

package/dist/esm/components/ComboBox/DropdownPopover/DropdownPositioner.mjs CHANGED Viewed

@@ -2,7 +2,7 @@
 /*
  * Integration App React package
  * {@link https://www.npmjs.com/package/@integration-app/react}
- * v2.20.0
+ * v2.22.0
  */
 'use client';

package/dist/esm/components/ComboBox/DropdownPopover/index.mjs CHANGED Viewed

@@ -2,7 +2,7 @@
 /*
  * Integration App React package
  * {@link https://www.npmjs.com/package/@integration-app/react}
- * v2.20.0
+ * v2.22.0
  */
 'use client';
@@ -12,6 +12,8 @@ import { DropdownUI } from '../../DropdownUI/index.mjs';
 import { DROPDOWN_NAVIGATOR_ID } from '../../DropdownUI/constants.mjs';
 import { useOptionListKeyNavDispatch } from '../../../helpers/hooks/keyboard-events.mjs';
 import { useWindowEvent } from '../../../helpers/hooks/useWindowEvent.mjs';
+import { css } from '../../../styled-system/css/css.mjs';
+import '../../../styled-system/helpers.mjs';
 import { Root, Anchor, Content as Content$1, Title } from '../../../ui-kit/styled/popover.mjs';
 import { useComboBox } from '../context/combobox-context.mjs';
 import '../context/combobox-dropdown-context.mjs';
@@ -30,12 +32,12 @@ const POSITIONING = {
   slide: true,
   fitViewport: true
 };
-function DropdownPopoverProvider({ children }) {
+function DropdownPopoverProvider({ children, disabled }) {
   const { isDropdownOpen, closeDropdown } = useComboBox();
   return /* @__PURE__ */ jsx(
     Root,
     {
-      open: isDropdownOpen,
+      open: disabled ? false : isDropdownOpen,
       onEscapeKeyDown: closeDropdown,
       closeOnInteractOutside: false,
       unmountOnExit: true,
@@ -43,7 +45,23 @@ function DropdownPopoverProvider({ children }) {
       portalled: true,
       autoFocus: false,
       positioning: POSITIONING,
-      children: /* @__PURE__ */ jsx(DropdownFocusTrap, { children })
+      children: /* @__PURE__ */ jsx(
+        DropdownFocusTrap,
+        {
+          className: css({
+            w: "full",
+            ':not([contenteditable="true"]):not(:has([contenteditable="true"])) &': {
+              display: "flex",
+              alignItems: "center"
+            },
+            '[data-formula="condition"] &': {
+              p: "1.5",
+              alignItems: "flex-start!"
+            }
+          }),
+          children
+        }
+      )
     }
   );
 }
@@ -51,7 +69,20 @@ function DropdownPopoverContent({ children }) {
   return /* @__PURE__ */ jsx(BoundedPortal, { children: /* @__PURE__ */ jsx(DropdownPositioner, { children: /* @__PURE__ */ jsx(DropdownFocusTrap, { children: /* @__PURE__ */ jsx(Content, { children }) }) }) });
 }
 function DropdownAnchor({ children }) {
-  return /* @__PURE__ */ jsx(Anchor, { display: "inline", children });
+  return /* @__PURE__ */ jsx(
+    Anchor,
+    {
+      className: css({
+        display: "inline",
+        maxW: "full",
+        ':not([contenteditable="true"]):not(:has([contenteditable="true"])) &': {
+          display: "inline-flex",
+          alignItems: "center"
+        }
+      }),
+      children
+    }
+  );
 }
 function Content({ children }) {
   const id = useId();

package/dist/esm/components/ComboBox/FocusTrap/index.mjs CHANGED Viewed

@@ -2,7 +2,7 @@
 /*
  * Integration App React package
  * {@link https://www.npmjs.com/package/@integration-app/react}
- * v2.20.0
+ * v2.22.0
  */
 'use client';
@@ -11,9 +11,19 @@ import FocusLock from 'react-focus-lock';
 import { useComboBox } from '../context/combobox-context.mjs';
 const TRAP_GROUP = "combobox-dropdown";
-function DropdownFocusTrap({ children }) {
+function DropdownFocusTrap({ children, className }) {
   const { isDropdownOpen, scopedComboboxId } = useComboBox();
-  return /* @__PURE__ */ jsx(FocusLock, { group: TRAP_GROUP + scopedComboboxId, disabled: !isDropdownOpen, returnFocus: true, autoFocus: false, as: "span", children });
+  return /* @__PURE__ */ jsx(
+    FocusLock,
+    {
+      group: TRAP_GROUP + scopedComboboxId,
+      disabled: !isDropdownOpen,
+      returnFocus: true,
+      autoFocus: false,
+      className,
+      children
+    }
+  );
 }
 export { DropdownFocusTrap };

package/dist/esm/components/ComboBox/context/combobox-context.mjs CHANGED Viewed

@@ -2,7 +2,7 @@
 /*
  * Integration App React package
  * {@link https://www.npmjs.com/package/@integration-app/react}
- * v2.20.0
+ * v2.22.0
  */
 'use client';

package/dist/esm/components/ComboBox/context/combobox-dropdown-context.mjs CHANGED Viewed

@@ -2,7 +2,7 @@
 /*
  * Integration App React package
  * {@link https://www.npmjs.com/package/@integration-app/react}
- * v2.20.0
+ * v2.22.0
  */
 'use client';
@@ -24,8 +24,7 @@ import 'fuse';
 import { EnumOptionFactory } from '../options-factories/enum.mjs';
 import '../options-factories/formula/config-mapping.mjs';
 import 'js-convert-case';
-import '../../SvgIcon/index.mjs';
-import '../../Tag/styles.module.css.mjs';
+import '../Badges/EditorTagBadge/NestedBadgeValue.mjs';
 import { ReferenceRecordsOptionsFactory } from '../options-factories/reference-records.mjs';
 import { RootOptionFactory } from '../options-factories/root.mjs';
 import { getAvailableRootCategories, getCurrentPath, getStackForPath } from './helpers.mjs';

package/dist/esm/components/ComboBox/context/combobox-dropdown-search.mjs CHANGED Viewed

@@ -2,7 +2,7 @@
 /*
  * Integration App React package
  * {@link https://www.npmjs.com/package/@integration-app/react}
- * v2.20.0
+ * v2.22.0
  */
 'use client';

package/dist/esm/components/ComboBox/context/combobox-dropdown-stack.mjs CHANGED Viewed

@@ -2,7 +2,7 @@
 /*
  * Integration App React package
  * {@link https://www.npmjs.com/package/@integration-app/react}
- * v2.20.0
+ * v2.22.0
  */
 'use client';

package/dist/esm/components/ComboBox/context/helpers.mjs CHANGED Viewed

@@ -2,7 +2,7 @@
 /*
  * Integration App React package
  * {@link https://www.npmjs.com/package/@integration-app/react}
- * v2.20.0
+ * v2.22.0
  */
 'use client';

package/dist/esm/components/ComboBox/options-factories/boolean.mjs CHANGED Viewed

@@ -2,7 +2,7 @@
 /*
  * Integration App React package
  * {@link https://www.npmjs.com/package/@integration-app/react}
- * v2.20.0
+ * v2.22.0
  */
 'use client';

package/dist/esm/components/ComboBox/options-factories/constant.mjs CHANGED Viewed

@@ -2,7 +2,7 @@
 /*
  * Integration App React package
  * {@link https://www.npmjs.com/package/@integration-app/react}
- * v2.20.0
+ * v2.22.0
  */
 'use client';

package/dist/esm/components/ComboBox/options-factories/custom-field/constants.mjs CHANGED Viewed

@@ -2,7 +2,7 @@
 /*
  * Integration App React package
  * {@link https://www.npmjs.com/package/@integration-app/react}
- * v2.20.0
+ * v2.22.0
  */
 'use client';

package/dist/esm/components/ComboBox/options-factories/custom-field/index.mjs CHANGED Viewed

@@ -2,7 +2,7 @@
 /*
  * Integration App React package
  * {@link https://www.npmjs.com/package/@integration-app/react}
- * v2.20.0
+ * v2.22.0
  */
 'use client';

package/dist/esm/components/ComboBox/options-factories/enum.mjs CHANGED Viewed

@@ -2,7 +2,7 @@
 /*
  * Integration App React package
  * {@link https://www.npmjs.com/package/@integration-app/react}
- * v2.20.0
+ * v2.22.0
  */
 'use client';

package/dist/esm/components/ComboBox/options-factories/formula/config-mapping.mjs CHANGED Viewed

@@ -2,7 +2,7 @@
 /*
  * Integration App React package
  * {@link https://www.npmjs.com/package/@integration-app/react}
- * v2.20.0
+ * v2.22.0
  */
 'use client';

package/dist/esm/components/ComboBox/options-factories/formula/index.mjs CHANGED Viewed

@@ -2,7 +2,7 @@
 /*
  * Integration App React package
  * {@link https://www.npmjs.com/package/@integration-app/react}
- * v2.20.0
+ * v2.22.0
  */
 'use client';