@integration-app/react 2.0.3-beta.0 → 2.0.3-beta.2

package/dist/cjs/hooks/flows/useFlowInstances.cjs

@@ -0,0 +1,21 @@
+"use strict";
+/*
+ * Integration App React package
+ * {@link https://www.npmjs.com/package/@integration-app/react}
+ * v2.0.3-beta.2
+ */
+'use client';
+
+'use strict';
+
+var useElements = require('../useElements.cjs');
+
+function useFlowInstances(query) {
+  const { ...rest } = useElements.useElements("flow-instances", query);
+  return {
+    flowInstances: rest.items,
+    ...rest
+  };
+}
+
+exports.useFlowInstances = useFlowInstances;

package/dist/cjs/hooks/flows/useFlowRun.cjs

@@ -0,0 +1,35 @@
+"use strict";
+/*
+ * Integration App React package
+ * {@link https://www.npmjs.com/package/@integration-app/react}
+ * v2.0.3-beta.2
+ */
+'use client';
+
+'use strict';
+
+var sdk = require('@integration-app/sdk');
+var useElement = require('../useElement.cjs');
+
+function useFlowRun(id) {
+  const {
+    item: flowRun,
+    archive,
+    refresh,
+    error,
+    loading
+  } = useElement.useElement(
+    sdk.WorkspaceElementType.FlowRun,
+    id,
+    (integrationApp) => id ? integrationApp.flowRun(id) : void 0
+  );
+  return {
+    flowRun,
+    error,
+    loading,
+    refresh,
+    archive
+  };
+}
+
+exports.useFlowRun = useFlowRun;

package/dist/cjs/hooks/flows/useFlowRuns.cjs

@@ -0,0 +1,21 @@
+"use strict";
+/*
+ * Integration App React package
+ * {@link https://www.npmjs.com/package/@integration-app/react}
+ * v2.0.3-beta.2
+ */
+'use client';
+
+'use strict';
+
+var useElements = require('../useElements.cjs');
+
+function useFlowRuns(query) {
+  const { ...rest } = useElements.useElements("flow-runs", query);
+  return {
+    flowRuns: rest.items,
+    ...rest
+  };
+}
+
+exports.useFlowRuns = useFlowRuns;

package/dist/cjs/hooks/flows/useFlows.cjs

@@ -0,0 +1,21 @@
+"use strict";
+/*
+ * Integration App React package
+ * {@link https://www.npmjs.com/package/@integration-app/react}
+ * v2.0.3-beta.2
+ */
+'use client';
+
+'use strict';
+
+var useElements = require('../useElements.cjs');
+
+function useFlows(query) {
+  const { ...rest } = useElements.useElements("flows", query);
+  return {
+    flows: rest.items,
+    ...rest
+  };
+}
+
+exports.useFlows = useFlows;

package/dist/cjs/hooks/integrations/useConnection.cjs

@@ -0,0 +1,26 @@
+"use strict";
+/*
+ * Integration App React package
+ * {@link https://www.npmjs.com/package/@integration-app/react}
+ * v2.0.3-beta.2
+ */
+'use client';
+
+'use strict';
+
+var sdk = require('@integration-app/sdk');
+var useElement = require('../useElement.cjs');
+
+function useConnection(id) {
+  const { item: connection, ...rest } = useElement.useElement(
+    sdk.WorkspaceElementType.Connection,
+    id,
+    (integrationApp) => id ? integrationApp.connection(id) : void 0
+  );
+  return {
+    connection,
+    ...rest
+  };
+}
+
+exports.useConnection = useConnection;

package/dist/cjs/hooks/integrations/useConnections.cjs

@@ -0,0 +1,21 @@
+"use strict";
+/*
+ * Integration App React package
+ * {@link https://www.npmjs.com/package/@integration-app/react}
+ * v2.0.3-beta.2
+ */
+'use client';
+
+'use strict';
+
+var useElements = require('../useElements.cjs');
+
+function useConnections(query) {
+  const { ...rest } = useElements.useElements("connections", query);
+  return {
+    connections: rest.items,
+    ...rest
+  };
+}
+
+exports.useConnections = useConnections;

package/dist/cjs/hooks/integrations/useConnectorSpec.cjs

@@ -0,0 +1,23 @@
+"use strict";
+/*
+ * Integration App React package
+ * {@link https://www.npmjs.com/package/@integration-app/react}
+ * v2.0.3-beta.2
+ */
+'use client';
+
+'use strict';
+
+var useSWR = require('swr');
+var integrationAppContext = require('../../contexts/integration-app-context.cjs');
+
+function useConnectorSpec(integrationIdOrKey) {
+  const integrationApp = integrationAppContext.useIntegrationApp();
+  const { data, isLoading, error } = useSWR(
+    integrationIdOrKey ? `/integrations/${integrationIdOrKey}/connector-spec` : void 0,
+    () => integrationApp.integration(integrationIdOrKey).getConnectorSpec()
+  );
+  return { data, loading: isLoading, error };
+}
+
+exports.useConnectorSpec = useConnectorSpec;

package/dist/cjs/hooks/integrations/useIntegration.cjs

@@ -0,0 +1,23 @@
+"use strict";
+/*
+ * Integration App React package
+ * {@link https://www.npmjs.com/package/@integration-app/react}
+ * v2.0.3-beta.2
+ */
+'use client';
+
+'use strict';
+
+var sdk = require('@integration-app/sdk');
+var useElement = require('../useElement.cjs');
+
+function useIntegration(idOrKey) {
+  const { item: integration, ...rest } = useElement.useElement(
+    sdk.WorkspaceElementType.Integration,
+    idOrKey,
+    (integrationApp) => idOrKey ? integrationApp.integration(idOrKey) : void 0
+  );
+  return { integration, ...rest };
+}
+
+exports.useIntegration = useIntegration;

package/dist/cjs/hooks/integrations/useIntegrations.cjs

@@ -0,0 +1,21 @@
+"use strict";
+/*
+ * Integration App React package
+ * {@link https://www.npmjs.com/package/@integration-app/react}
+ * v2.0.3-beta.2
+ */
+'use client';
+
+'use strict';
+
+var useElements = require('../useElements.cjs');
+
+function useIntegrations(query) {
+  const { ...rest } = useElements.useElements("integrations", query);
+  return {
+    integrations: rest.items,
+    ...rest
+  };
+}
+
+exports.useIntegrations = useIntegrations;

package/dist/cjs/hooks/keyboard-events.cjs

@@ -0,0 +1,86 @@
+"use strict";
+/*
+ * Integration App React package
+ * {@link https://www.npmjs.com/package/@integration-app/react}
+ * v2.0.3-beta.2
+ */
+'use client';
+
+'use strict';
+
+var React = require('react');
+
+var EVENT_TYPE = /* @__PURE__ */ ((EVENT_TYPE2) => {
+  EVENT_TYPE2["OPTION_DOWN"] = "option_down";
+  EVENT_TYPE2["OPTION_UP"] = "option_up";
+  EVENT_TYPE2["OPTION_SELECT"] = "option_select";
+  EVENT_TYPE2["FORM_SUBMIT"] = "form_submit";
+  return EVENT_TYPE2;
+})(EVENT_TYPE || {});
+const eventEmitter = {
+  _events: {},
+  _isExist(event) {
+    return !!this?._events?.[event];
+  },
+  dispatch(event) {
+    if (!this._isExist(event)) return;
+    this._events[event].forEach(
+      (callback) => callback()
+    );
+  },
+  subscribe(event, callback) {
+    if (!this._isExist(event)) this._events[event] = [];
+    callback && this._events[event].push(callback);
+  },
+  unsubscribe(event, callback) {
+    if (!this._isExist(event)) return;
+    callback && (this._events[event] = this._events[event].filter((cb) => cb !== callback));
+  }
+};
+function useOptionListKeyNavDispatch(ref) {
+  return useKeyPressDispatch(ref, handleOptionListKeyNavigation);
+}
+function useKeyPressDispatch(ref, handler) {
+  const savedHandler = React.useRef(handler);
+  const targetElement = ref instanceof Element ? ref : ref?.current;
+  return React.useEffect(() => {
+    if (!targetElement || !targetElement?.addEventListener) {
+      return () => {
+      };
+    }
+    targetElement.addEventListener("keydown", savedHandler.current);
+    return () => {
+      targetElement.removeEventListener("keydown", savedHandler.current);
+    };
+  }, [targetElement, savedHandler]);
+}
+function useKeyboardEventSubscribe(event, callback) {
+  return React.useEffect(() => {
+    eventEmitter.subscribe(event, callback);
+    return () => {
+      eventEmitter.unsubscribe(event, callback);
+    };
+  }, [event, callback]);
+}
+const dispatch = (event) => eventEmitter.dispatch(event);
+const handleOptionListKeyNavigation = (e) => {
+  switch (e.key) {
+    case "Enter":
+      if (!e.shiftKey) {
+        dispatch("option_select" /* OPTION_SELECT */);
+        e.preventDefault();
+        e.stopPropagation();
+      }
+      break;
+    case "ArrowUp":
+      dispatch("option_down" /* OPTION_DOWN */);
+      break;
+    case "ArrowDown":
+      dispatch("option_up" /* OPTION_UP */);
+      break;
+  }
+};
+
+exports.EVENT_TYPE = EVENT_TYPE;
+exports.useKeyboardEventSubscribe = useKeyboardEventSubscribe;
+exports.useOptionListKeyNavDispatch = useOptionListKeyNavDispatch;

package/dist/cjs/hooks/scenarios/useScenario.cjs

@@ -0,0 +1,23 @@
+"use strict";
+/*
+ * Integration App React package
+ * {@link https://www.npmjs.com/package/@integration-app/react}
+ * v2.0.3-beta.2
+ */
+'use client';
+
+'use strict';
+
+var sdk = require('@integration-app/sdk');
+var useElement = require('../useElement.cjs');
+
+function useScenario(selector) {
+  const { item: scenario, ...rest } = useElement.useElement(
+    sdk.WorkspaceElementType.Scenario,
+    selector,
+    (integrationApp) => selector ? integrationApp.scenario(selector) : void 0
+  );
+  return { scenario, ...rest };
+}
+
+exports.useScenario = useScenario;

package/dist/cjs/hooks/scenarios/useScenarios.cjs

@@ -0,0 +1,21 @@
+"use strict";
+/*
+ * Integration App React package
+ * {@link https://www.npmjs.com/package/@integration-app/react}
+ * v2.0.3-beta.2
+ */
+'use client';
+
+'use strict';
+
+var useElements = require('../useElements.cjs');
+
+function useScenarios(query) {
+  const { ...rest } = useElements.useElements("scenarios", query);
+  return {
+    scenarios: rest.items,
+    ...rest
+  };
+}
+
+exports.useScenarios = useScenarios;

package/dist/cjs/hooks/screens/useScreen.cjs

@@ -0,0 +1,23 @@
+"use strict";
+/*
+ * Integration App React package
+ * {@link https://www.npmjs.com/package/@integration-app/react}
+ * v2.0.3-beta.2
+ */
+'use client';
+
+'use strict';
+
+var sdk = require('@integration-app/sdk');
+var useElement = require('../useElement.cjs');
+
+function useScreen(selector) {
+  const { item: screen, ...rest } = useElement.useElement(
+    sdk.WorkspaceElementType.Screen,
+    selector,
+    (integrationApp) => selector ? integrationApp.screen(selector) : void 0
+  );
+  return { screen, ...rest };
+}
+
+exports.useScreen = useScreen;

package/dist/cjs/hooks/useAutofocus.cjs

@@ -0,0 +1,21 @@
+"use strict";
+/*
+ * Integration App React package
+ * {@link https://www.npmjs.com/package/@integration-app/react}
+ * v2.0.3-beta.2
+ */
+'use client';
+
+'use strict';
+
+var React = require('react');
+
+function useAutofocus(elementRef, autoFocus) {
+  React.useLayoutEffect(() => {
+    if (autoFocus) {
+      elementRef.current.focus({ preventScroll: true });
+    }
+  }, [autoFocus]);
+}
+
+exports.useAutofocus = useAutofocus;

package/dist/cjs/hooks/useDeepEffect.cjs

@@ -0,0 +1,49 @@
+"use strict";
+/*
+ * Integration App React package
+ * {@link https://www.npmjs.com/package/@integration-app/react}
+ * v2.0.3-beta.2
+ */
+'use client';
+
+'use strict';
+
+var React = require('react');
+var deepEqual = require('fast-deep-equal');
+
+const isPrimitive = (value) => ["number", "string", "boolean"].includes(typeof value);
+const warnDeps = (dependencies) => {
+  if (dependencies.length === 0) {
+    console.warn(
+      "useDeepEffect should not be used with no dependencies. Use useEffect instead."
+    );
+  }
+  if (dependencies.every(isPrimitive)) {
+    console.warn(
+      "useDeepEffect should not be used with primitive values. Use useEffect instead."
+    );
+  }
+};
+const getTriggerDeps = (dependencies, comparisonFn) => {
+  const ref = React.useRef();
+  const triggerDeps = React.useRef(0);
+  if (!comparisonFn(dependencies, ref.current)) {
+    ref.current = dependencies;
+    triggerDeps.current = Math.random();
+  }
+  return [triggerDeps.current];
+};
+const useDeepEffect = (fn, dependencies = [], comparisonFn = deepEqual) => {
+  warnDeps(dependencies);
+  return React.useEffect(fn, getTriggerDeps(dependencies, comparisonFn));
+};
+const useDeepMemo = (memoFn, key) => {
+  const ref = React.useRef();
+  if (!ref.current || !deepEqual(key, ref.current.key)) {
+    ref.current = { key, value: memoFn() };
+  }
+  return ref.current.value;
+};
+
+exports.useDeepEffect = useDeepEffect;
+exports.useDeepMemo = useDeepMemo;

package/dist/cjs/hooks/useElement.cjs

@@ -0,0 +1,124 @@
+"use strict";
+/*
+ * Integration App React package
+ * {@link https://www.npmjs.com/package/@integration-app/react}
+ * v2.0.3-beta.2
+ */
+'use client';
+
+'use strict';
+
+var awesomeDebouncePromise = require('../_modules/awesome-debounce-promise.cjs');
+var integrationAppContext = require('../contexts/integration-app-context.cjs');
+var useSWR = require('swr');
+
+const elementStateCache = /* @__PURE__ */ new Map();
+function useElement(type, selector, accessorGenerator) {
+  const integrationApp = integrationAppContext.useIntegrationApp();
+  const elementKeyData = {
+    type,
+    token: integrationApp?.token,
+    selector
+  };
+  const elementKey = JSON.stringify(elementKeyData);
+  const elementState = elementStateCache.get(elementKey) ?? {
+    updatedLocally: false,
+    savingToServer: false,
+    currentPutRequests: [],
+    // Save current put requests to not update local state until all of them are done
+    debouncedPut: awesomeDebouncePromise.default(async (data) => {
+      const requestId = Math.random();
+      elementState.currentPutRequests.push(requestId);
+      elementState.updatedLocally = false;
+      elementState.savingToServer = true;
+      try {
+        const result = await accessor?.put(data);
+        elementState.currentPutRequests = elementState.currentPutRequests.filter((id) => id !== requestId);
+        if (!elementState.updatedLocally && elementState.currentPutRequests.length === 0) {
+          elementState.savingToServer = false;
+          await mutate(result, false);
+        }
+      } catch (e) {
+        elementState.updatedLocally = true;
+        throw e;
+      } finally {
+        elementState.savingToServer = false;
+      }
+    }, 500)
+  };
+  if (!elementStateCache.has(elementKey)) {
+    elementStateCache.set(elementKey, elementState);
+  }
+  const accessor = integrationApp ? accessorGenerator(integrationApp) : void 0;
+  const swrKey = accessor && selector ? `element:${elementKey}` : void 0;
+  const {
+    data: item,
+    mutate,
+    error,
+    isLoading,
+    isValidating
+  } = useSWR(swrKey, () => accessor?.get(), {
+    // pause revalidation if update is in progress to not overwrite local changes
+    isPaused: () => elementState.updatedLocally || elementState.savingToServer
+  });
+  const loading = isLoading;
+  const refreshing = isValidating;
+  async function refresh() {
+    return await mutate();
+  }
+  async function put(data) {
+    if (!accessor?.put) {
+      throw new Error(
+        /* FIXME: strictNullCheck temporary fix */
+        // @ts-expect-error TS(2531): Object is possibly 'null'.
+        `"put method is not supported for accessor ${accessor.constructor.name}`
+      );
+    }
+    elementState.updatedLocally = true;
+    const newLocalData = {
+      ...item,
+      ...data
+    };
+    await mutate(newLocalData, false);
+    await elementState.debouncedPut(data);
+  }
+  async function patch(data) {
+    const newData = {
+      ...item,
+      ...data
+    };
+    return put(newData);
+  }
+  async function archive() {
+    if (!accessor?.archive) {
+      return;
+    }
+    await mutate({ ...item, archivedAt: (/* @__PURE__ */ new Date()).toISOString() }, false);
+    await accessor?.archive();
+    await mutate();
+  }
+  async function create(data) {
+    if (!accessor?.create) {
+      throw new Error(
+        `"create method is not supported for accessor ${accessor?.constructor.name}`
+      );
+    }
+    const result = await accessor?.create(data);
+    return await mutate(result);
+  }
+  return {
+    accessor,
+    item,
+    loading,
+    saving: elementState.updatedLocally || elementState.savingToServer,
+    error,
+    refresh,
+    refreshing,
+    create,
+    patch,
+    put,
+    archive
+  };
+}
+
+exports.useElement = useElement;

package/dist/cjs/hooks/useElements.cjs

@@ -0,0 +1,76 @@
+"use strict";
+/*
+ * Integration App React package
+ * {@link https://www.npmjs.com/package/@integration-app/react}
+ * v2.0.3-beta.2
+ */
+'use client';
+
+'use strict';
+
+var integrationAppContext = require('../contexts/integration-app-context.cjs');
+var React = require('react');
+var useSWRInfinite = require('swr/infinite');
+var qs = require('query-string');
+
+function useElements(route, query = {}) {
+  const integrationApp = integrationAppContext.useIntegrationApp();
+  const limit = query.limit ?? 25;
+  const tokenHash = hashCode(integrationApp.token);
+  function getKey(page, previousPageData) {
+    if (page === 0)
+      return `/${route}?${qs.stringify({
+        ...query,
+        limit,
+        hash: tokenHash
+      })}`;
+    if (previousPageData.items?.length < limit) return null;
+    return `/${route}?${qs.stringify({
+      ...query,
+      limit,
+      /* FIXME: strictNullCheck temporary fix */
+      // @ts-expect-error TS(2531): Object is possibly 'null'.
+      cursor: previousPageData.cursor,
+      hash: tokenHash
+    })}`;
+  }
+  const [loadingMore, setIsLoadingMore] = React.useState(false);
+  const { data, size, setSize, isLoading, error, mutate, isValidating } = useSWRInfinite(
+    getKey,
+    (url) => integrationApp.get(url)
+  );
+  const items = data ? data.map((page) => page.items).flat() : [];
+  const loading = isLoading;
+  const refreshing = isValidating;
+  async function loadMore() {
+    const hasMoreToLoad = data[size - 1]?.items?.length === limit;
+    if (hasMoreToLoad) {
+      setIsLoadingMore(true);
+      await setSize(size + 1);
+      setIsLoadingMore(false);
+    }
+  }
+  async function refresh() {
+    await mutate();
+  }
+  return {
+    items,
+    refresh,
+    refreshing,
+    loadMore,
+    loadingMore,
+    loading,
+    error
+  };
+}
+function hashCode(s) {
+  if (!s) {
+    return 0;
+  }
+  const l = s.length;
+  let h = 0, i = 0;
+  if (l > 0) while (i < l) h = (h << 5) - h + s.charCodeAt(i++) | 0;
+  return h;
+}
+
+exports.useElements = useElements;

package/dist/cjs/hooks/useEventStopPropagation.cjs

@@ -0,0 +1,24 @@
+"use strict";
+/*
+ * Integration App React package
+ * {@link https://www.npmjs.com/package/@integration-app/react}
+ * v2.0.3-beta.2
+ */
+'use client';
+
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+function useEventStopPropagation(fn) {
+  if (!fn) return void 0;
+  return function(event) {
+    const isClickOnLink = !!event.target.closest("a");
+    !isClickOnLink && event?.preventDefault?.();
+    event?.stopPropagation?.();
+    event?.nativeEvent?.stopImmediatePropagation?.();
+    if (typeof fn === "function") fn?.(event);
+  };
+}
+
+exports.default = useEventStopPropagation;