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

package/dist/cjs/ui-kit/avatar.cjs

@@ -0,0 +1,40 @@
+"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 jsxRuntime = require('react/jsx-runtime');
+var React = require('react');
+var avatar = require('./styled/avatar.cjs');
+
+const Avatar = React.forwardRef((props, ref) => {
+  const { name, src, ...rootProps } = props;
+  return /* @__PURE__ */ jsxRuntime.jsxs(avatar.Root, { ref, ...rootProps, children: [
+    /* @__PURE__ */ jsxRuntime.jsx(avatar.Fallback, { children: getInitials(name) || /* @__PURE__ */ jsxRuntime.jsx(UserIcon, {}) }),
+    /* @__PURE__ */ jsxRuntime.jsx(avatar.Image, { src, alt: name })
+  ] });
+});
+Avatar.displayName = "Avatar";
+const UserIcon = () => /* @__PURE__ */ jsxRuntime.jsxs(
+  "svg",
+  {
+    xmlns: "http://www.w3.org/2000/svg",
+    viewBox: "0 0 24 24",
+    fill: "none",
+    stroke: "currentColor",
+    strokeWidth: "2",
+    children: [
+      /* @__PURE__ */ jsxRuntime.jsx("title", { children: "User Icon" }),
+      /* @__PURE__ */ jsxRuntime.jsx("path", { d: "M19 21v-2a4 4 0 0 0-4-4H9a4 4 0 0 0-4 4v2" }),
+      /* @__PURE__ */ jsxRuntime.jsx("circle", { cx: "12", cy: "7", r: "4" })
+    ]
+  }
+);
+const getInitials = (name = "") => name.split(" ").map((part) => part[0]).splice(0, 2).join("").toUpperCase();
+
+exports.Avatar = Avatar;

package/dist/cjs/ui-kit/button.cjs

@@ -0,0 +1,44 @@
+"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 jsxRuntime = require('react/jsx-runtime');
+var React = require('react');
+var factory = require('../styled-system/jsx/factory.cjs');
+require('../styled-system/jsx/is-valid-prop.cjs');
+require('../styled-system/helpers.cjs');
+require('../styled-system/css/css.cjs');
+var center = require('../styled-system/jsx/center.cjs');
+var spinner = require('./spinner.cjs');
+var button = require('./styled/button.cjs');
+
+const Button = React.forwardRef(
+  (props, ref) => {
+    const { loading, disabled, loadingText, children, ...rest } = props;
+    const trulyDisabled = loading || disabled;
+    return /* @__PURE__ */ jsxRuntime.jsx(button.Button, { disabled: trulyDisabled, ref, ...rest, children: loading && !loadingText ? /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
+      /* @__PURE__ */ jsxRuntime.jsx(ButtonSpinner, {}),
+      /* @__PURE__ */ jsxRuntime.jsx(factory.styled.span, { opacity: 0, children })
+    ] }) : loadingText ? loadingText : children });
+  }
+);
+Button.displayName = "Button";
+const ButtonSpinner = () => /* @__PURE__ */ jsxRuntime.jsx(
+  center.Center,
+  {
+    inline: true,
+    position: "absolute",
+    transform: "translate(-50%, -50%)",
+    top: "50%",
+    insetStart: "50%",
+    children: /* @__PURE__ */ jsxRuntime.jsx(spinner.Spinner, { colorPalette: "gray" })
+  }
+);
+
+exports.Button = Button;

package/dist/cjs/ui-kit/spinner.cjs

@@ -0,0 +1,36 @@
+"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 jsxRuntime = require('react/jsx-runtime');
+var React = require('react');
+var factory = require('../styled-system/jsx/factory.cjs');
+require('../styled-system/jsx/is-valid-prop.cjs');
+require('../styled-system/helpers.cjs');
+require('../styled-system/css/css.cjs');
+var spinner = require('./styled/spinner.cjs');
+
+const Spinner = React.forwardRef(
+  (props, ref) => {
+    const { label = "Loading...", ...rest } = props;
+    return /* @__PURE__ */ jsxRuntime.jsx(
+      spinner.Spinner,
+      {
+        ref,
+        borderBottomColor: "transparent",
+        borderLeftColor: "transparent",
+        ...rest,
+        children: label && /* @__PURE__ */ jsxRuntime.jsx(factory.styled.span, { srOnly: true, children: label })
+      }
+    );
+  }
+);
+Spinner.displayName = "Spinner";
+
+exports.Spinner = Spinner;

package/dist/cjs/ui-kit/styled/avatar.cjs

@@ -0,0 +1,31 @@
+"use strict";
+"use client";
+/*
+ * Integration App React package
+ * {@link https://www.npmjs.com/package/@integration-app/react}
+ * v2.0.3-beta.2
+ */
+'use client';
+
+'use strict';
+
+var avatar = require('@ark-ui/react/avatar');
+require('../../styled-system/helpers.cjs');
+require('../../styled-system/css/conditions.cjs');
+require('../../styled-system/css/css.cjs');
+var avatar$1 = require('../../styled-system/recipes/avatar.cjs');
+var createStyleContext = require('./utils/create-style-context.cjs');
+
+const { withProvider, withContext } = createStyleContext.createStyleContext(avatar$1.avatar);
+withProvider(avatar.Avatar.RootProvider, "root");
+const Root = withProvider(avatar.Avatar.Root, "root");
+const Fallback = withContext(avatar.Avatar.Fallback, "fallback");
+const Image = withContext(avatar.Avatar.Image, "image");
+
+Object.defineProperty(exports, "Context", {
+  enumerable: true,
+  get: function () { return avatar.AvatarContext; }
+});
+exports.Fallback = Fallback;
+exports.Image = Image;
+exports.Root = Root;

package/dist/cjs/ui-kit/styled/button.cjs

@@ -0,0 +1,22 @@
+"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('@ark-ui/react');
+var factory = require('../../styled-system/jsx/factory.cjs');
+require('../../styled-system/jsx/is-valid-prop.cjs');
+require('react');
+require('../../styled-system/helpers.cjs');
+require('../../styled-system/css/css.cjs');
+require('../../styled-system/css/conditions.cjs');
+var button = require('../../styled-system/recipes/button.cjs');
+
+const Button = factory.styled(react.ark.button, button.button);
+
+exports.Button = Button;

package/dist/cjs/ui-kit/styled/icon.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';
+
+var factory$1 = require('@ark-ui/react/factory');
+var factory = require('../../styled-system/jsx/factory.cjs');
+require('../../styled-system/jsx/is-valid-prop.cjs');
+require('react');
+require('../../styled-system/helpers.cjs');
+require('../../styled-system/css/css.cjs');
+require('../../styled-system/css/conditions.cjs');
+var icon = require('../../styled-system/recipes/icon.cjs');
+
+const Icon = factory.styled(factory$1.ark.svg, icon.icon, {
+  defaultProps: { asChild: true }
+});
+
+exports.Icon = Icon;

package/dist/cjs/ui-kit/styled/menu.cjs

@@ -0,0 +1,53 @@
+"use strict";
+"use client";
+/*
+ * 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('@ark-ui/react');
+require('../../styled-system/helpers.cjs');
+require('../../styled-system/css/conditions.cjs');
+require('../../styled-system/css/css.cjs');
+var menu$1 = require('../../styled-system/recipes/menu.cjs');
+var createStyleContext = require('./utils/create-style-context.cjs');
+var menu = require('@ark-ui/react/menu');
+
+const { withRootProvider, withContext } = createStyleContext.createStyleContext(menu$1.menu);
+withRootProvider(react.Menu.RootProvider);
+const Root = withRootProvider(
+  react.Menu.Root
+);
+withContext(react.Menu.Arrow, "arrow");
+withContext(react.Menu.ArrowTip, "arrowTip");
+withContext(react.Menu.CheckboxItem, "item");
+const Content = withContext(react.Menu.Content, "content");
+withContext(react.Menu.ContextTrigger, "contextTrigger");
+withContext(react.Menu.Indicator, "indicator");
+const ItemGroupLabel = withContext(react.Menu.ItemGroupLabel, "itemGroupLabel");
+const ItemGroup = withContext(react.Menu.ItemGroup, "itemGroup");
+withContext(react.Menu.ItemIndicator, "itemIndicator");
+const Item = withContext(react.Menu.Item, "item");
+withContext(react.Menu.ItemText, "itemText");
+const Positioner = withContext(react.Menu.Positioner, "positioner");
+withContext(react.Menu.RadioItemGroup, "itemGroup");
+withContext(react.Menu.RadioItem, "item");
+withContext(react.Menu.Separator, "separator");
+withContext(react.Menu.TriggerItem, "triggerItem");
+const Trigger = withContext(react.Menu.Trigger, "trigger");
+
+Object.defineProperty(exports, "Context", {
+  enumerable: true,
+  get: function () { return menu.MenuContext; }
+});
+exports.Content = Content;
+exports.Item = Item;
+exports.ItemGroup = ItemGroup;
+exports.ItemGroupLabel = ItemGroupLabel;
+exports.Positioner = Positioner;
+exports.Root = Root;
+exports.Trigger = Trigger;

package/dist/cjs/ui-kit/styled/popover.cjs

@@ -0,0 +1,40 @@
+"use strict";
+"use client";
+/*
+ * Integration App React package
+ * {@link https://www.npmjs.com/package/@integration-app/react}
+ * v2.0.3-beta.2
+ */
+'use client';
+
+'use strict';
+
+var popover = require('@ark-ui/react/popover');
+require('../../styled-system/helpers.cjs');
+require('../../styled-system/css/conditions.cjs');
+require('../../styled-system/css/css.cjs');
+var popover$1 = require('../../styled-system/recipes/popover.cjs');
+var createStyleContext = require('./utils/create-style-context.cjs');
+
+const { withRootProvider, withContext } = createStyleContext.createStyleContext(popover$1.popover);
+withRootProvider(popover.Popover.RootProvider);
+const Root = withRootProvider(popover.Popover.Root);
+withContext(popover.Popover.Anchor, "anchor");
+withContext(popover.Popover.Arrow, "arrow");
+withContext(popover.Popover.ArrowTip, "arrowTip");
+withContext(popover.Popover.CloseTrigger, "closeTrigger");
+const Content = withContext(popover.Popover.Content, "content");
+withContext(popover.Popover.Description, "description");
+withContext(popover.Popover.Indicator, "indicator");
+const Positioner = withContext(popover.Popover.Positioner, "positioner");
+withContext(popover.Popover.Title, "title");
+const Trigger = withContext(popover.Popover.Trigger, "trigger");
+
+Object.defineProperty(exports, "Context", {
+  enumerable: true,
+  get: function () { return popover.PopoverContext; }
+});
+exports.Content = Content;
+exports.Positioner = Positioner;
+exports.Root = Root;
+exports.Trigger = Trigger;

package/dist/cjs/ui-kit/styled/skeleton.cjs

@@ -0,0 +1,34 @@
+"use strict";
+"use client";
+/*
+ * Integration App React package
+ * {@link https://www.npmjs.com/package/@integration-app/react}
+ * v2.0.3-beta.2
+ */
+'use client';
+
+'use strict';
+
+var jsxRuntime = require('react/jsx-runtime');
+var factory$1 = require('@ark-ui/react/factory');
+var React = require('react');
+var factory = require('../../styled-system/jsx/factory.cjs');
+require('../../styled-system/jsx/is-valid-prop.cjs');
+require('../../styled-system/helpers.cjs');
+require('../../styled-system/css/css.cjs');
+require('../../styled-system/css/conditions.cjs');
+var skeleton = require('../../styled-system/recipes/skeleton.cjs');
+
+const StyledSkeleton = factory.styled(factory$1.ark.div, skeleton.skeleton);
+const Skeleton = React.forwardRef(
+  (props, ref) => {
+    const { isLoaded, ...otherProps } = props;
+    if (isLoaded) {
+      return /* @__PURE__ */ jsxRuntime.jsx(factory.styled.div, { animation: "fade-in", ref, ...otherProps });
+    }
+    return /* @__PURE__ */ jsxRuntime.jsx(StyledSkeleton, { ref, ...otherProps });
+  }
+);
+Skeleton.displayName = "Skeleton";
+
+exports.Skeleton = Skeleton;

package/dist/cjs/ui-kit/styled/spinner.cjs

@@ -0,0 +1,22 @@
+"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('@ark-ui/react');
+var factory = require('../../styled-system/jsx/factory.cjs');
+require('../../styled-system/jsx/is-valid-prop.cjs');
+require('react');
+require('../../styled-system/helpers.cjs');
+require('../../styled-system/css/css.cjs');
+require('../../styled-system/css/conditions.cjs');
+var spinner = require('../../styled-system/recipes/spinner.cjs');
+
+const Spinner = factory.styled(react.ark.div, spinner.spinner);
+
+exports.Spinner = Spinner;

package/dist/cjs/ui-kit/styled/text.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 factory = require('../../styled-system/jsx/factory.cjs');
+require('../../styled-system/jsx/is-valid-prop.cjs');
+require('react');
+require('../../styled-system/helpers.cjs');
+require('../../styled-system/css/css.cjs');
+require('../../styled-system/css/conditions.cjs');
+var text = require('../../styled-system/recipes/text.cjs');
+
+const Text = factory.styled("p", text.text);
+
+exports.Text = Text;

package/dist/cjs/ui-kit/styled/tooltip.cjs

@@ -0,0 +1,37 @@
+"use strict";
+"use client";
+/*
+ * Integration App React package
+ * {@link https://www.npmjs.com/package/@integration-app/react}
+ * v2.0.3-beta.2
+ */
+'use client';
+
+'use strict';
+
+var tooltip = require('@ark-ui/react/tooltip');
+require('../../styled-system/helpers.cjs');
+require('../../styled-system/css/conditions.cjs');
+require('../../styled-system/css/css.cjs');
+var tooltip$1 = require('../../styled-system/recipes/tooltip.cjs');
+var createStyleContext = require('./utils/create-style-context.cjs');
+
+const { withRootProvider, withContext } = createStyleContext.createStyleContext(tooltip$1.tooltip);
+withRootProvider(tooltip.Tooltip.RootProvider);
+const Root = withRootProvider(tooltip.Tooltip.Root);
+const Arrow = withContext(tooltip.Tooltip.Arrow, "arrow");
+const ArrowTip = withContext(tooltip.Tooltip.ArrowTip, "arrowTip");
+const Content = withContext(tooltip.Tooltip.Content, "content");
+const Positioner = withContext(tooltip.Tooltip.Positioner, "positioner");
+const Trigger = withContext(tooltip.Tooltip.Trigger, "trigger");
+
+Object.defineProperty(exports, "Context", {
+  enumerable: true,
+  get: function () { return tooltip.TooltipContext; }
+});
+exports.Arrow = Arrow;
+exports.ArrowTip = ArrowTip;
+exports.Content = Content;
+exports.Positioner = Positioner;
+exports.Root = Root;
+exports.Trigger = Trigger;

package/dist/cjs/ui-kit/styled/utils/create-style-context.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 jsxRuntime = require('react/jsx-runtime');
+var React = require('react');
+require('../../../styled-system/css/css.cjs');
+var cx = require('../../../styled-system/css/cx.cjs');
+require('../../../styled-system/helpers.cjs');
+var factory = require('../../../styled-system/jsx/factory.cjs');
+var isValidProp = require('../../../styled-system/jsx/is-valid-prop.cjs');
+
+const shouldForwardProp = (prop, variantKeys, options = {}) => options.forwardProps?.includes(prop) || !variantKeys.includes(prop) && !isValidProp.isCssProperty(prop);
+const createStyleContext = (recipe) => {
+  const StyleContext = React.createContext(null);
+  const withRootProvider = (Component) => {
+    const StyledComponent = (props) => {
+      const [variantProps, otherProps] = recipe.splitVariantProps(props);
+      const slotStyles = recipe(variantProps);
+      return /* @__PURE__ */ jsxRuntime.jsx(StyleContext.Provider, { value: slotStyles, children: /* @__PURE__ */ jsxRuntime.jsx(Component, { ...otherProps }) });
+    };
+    return StyledComponent;
+  };
+  const withProvider = (Component, slot, options) => {
+    const StyledComponent = factory.styled(
+      Component,
+      {},
+      {
+        shouldForwardProp: (prop, variantKeys) => shouldForwardProp(prop, variantKeys, options)
+      }
+    );
+    const StyledSlotProvider = React.forwardRef((props, ref) => {
+      const [variantProps, otherProps] = recipe.splitVariantProps(props);
+      const slotStyles = recipe(variantProps);
+      return /* @__PURE__ */ jsxRuntime.jsx(StyleContext.Provider, { value: slotStyles, children: /* @__PURE__ */ jsxRuntime.jsx(
+        StyledComponent,
+        {
+          ...otherProps,
+          ref,
+          className: cx.cx(slotStyles?.[slot], props.className)
+        }
+      ) });
+    });
+    StyledSlotProvider.displayName = Component.displayName || Component.name;
+    return StyledSlotProvider;
+  };
+  const withContext = (Component, slot) => {
+    const StyledComponent = factory.styled(Component);
+    const StyledSlotComponent = React.forwardRef((props, ref) => {
+      const slotStyles = React.useContext(StyleContext);
+      return /* @__PURE__ */ jsxRuntime.jsx(
+        StyledComponent,
+        {
+          ...props,
+          ref,
+          className: cx.cx(slotStyles?.[slot], props.className)
+        }
+      );
+    });
+    StyledSlotComponent.displayName = Component.displayName || Component.name;
+    return StyledSlotComponent;
+  };
+  return {
+    withRootProvider,
+    withProvider,
+    withContext
+  };
+};
+
+exports.createStyleContext = createStyleContext;

package/dist/esm/_modules/awesome-debounce-promise.mjs

@@ -0,0 +1,16 @@
+"use strict";
+/*
+ * Integration App React package
+ * {@link https://www.npmjs.com/package/@integration-app/react}
+ * v2.0.3-beta.2
+ */
+'use client';
+
+import AwesomeDebouncePromiseImport from 'awesome-debounce-promise';
+
+const AwesomeDebouncePromise = (
+  // @ts-ignore
+  AwesomeDebouncePromiseImport?.default ?? AwesomeDebouncePromiseImport
+);
+
+export { AwesomeDebouncePromise as default };

package/dist/esm/_modules/react-use-promise.mjs

@@ -0,0 +1,13 @@
+"use strict";
+/*
+ * Integration App React package
+ * {@link https://www.npmjs.com/package/@integration-app/react}
+ * v2.0.3-beta.2
+ */
+'use client';
+
+import usePromiseImport from 'react-use-promise';
+
+const usePromise = usePromiseImport?.default ?? usePromiseImport;
+
+export { usePromise as default };

package/dist/esm/components/AdvancedOptions.mjs

@@ -0,0 +1,47 @@
+"use strict";
+/*
+ * Integration App React package
+ * {@link https://www.npmjs.com/package/@integration-app/react}
+ * v2.0.3-beta.2
+ */
+'use client';
+
+import { jsxs, Fragment, jsx } from 'react/jsx-runtime';
+import { Button } from './Button/Button.mjs';
+import { useState } from 'react';
+
+function AdvancedOptions({
+  title = "advanced options",
+  openByDefault = false,
+  children
+}) {
+  const [showAdvancedOptions, setShowAdvancedOptions] = useState(openByDefault);
+  return showAdvancedOptions ? /* @__PURE__ */ jsxs(Fragment, { children: [
+    /* @__PURE__ */ jsxs(
+      Button,
+      {
+        variant: "ajax",
+        onClick: () => setShowAdvancedOptions(false),
+        className: "-ml-6 self-start",
+        children: [
+          "Hide ",
+          title
+        ]
+      }
+    ),
+    /* @__PURE__ */ jsx("div", { className: "flex flex-col gap-2", children })
+  ] }) : /* @__PURE__ */ jsxs(
+    Button,
+    {
+      variant: "ajax",
+      onClick: () => setShowAdvancedOptions(true),
+      className: "-ml-6 self-start",
+      children: [
+        "Show ",
+        title
+      ]
+    }
+  );
+}
+
+export { AdvancedOptions };