@chaibuilder/sdk 1.3.0-beta.8 → 1.3.0

package/dist/UnsplashImages-CjJ5szAy.cjs

@@ -1,215 +0,0 @@
-"use strict";
-Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
-const jsxRuntime = require("./jsx-runtime-B6vEU3CM.cjs");
-const React = require("react");
-const lodashEs = require("lodash-es");
-const unsplashJs = require("unsplash-js");
-const contextMenu = require("./context-menu-BLbuduri.cjs");
-const reactI18next = require("react-i18next");
-const core = require("./index-Bjw2sUN2.cjs");
-const web = require("@react-hookz/web");
-const lucideReact = require("lucide-react");
-const fetchImage = async (payload, accessKey) => new Promise((resolve, reject) => {
-  const unsplash = unsplashJs.createApi({ accessKey });
-  unsplash.search.getPhotos(payload).then((result) => {
-    resolve(result);
-  }).catch((error) => reject(error));
-});
-const UnsplashImages = ({ isModalView, onSelect }) => {
-  const unsplashAccessKey = core.useBuilderProp("unsplashAccessKey", "");
-  const [images, setImages] = React.useState([]);
-  const [page, setPage] = React.useState(0);
-  const [orientation, setOrientation] = React.useState();
-  const [color, setColor] = React.useState();
-  const [totalPages, setTotalPages] = React.useState(0);
-  const [debouncedQuery, setDebouncedQuery] = web.useDebouncedState("", 1e3);
-  const [isFetching, setIsFetching] = React.useState(false);
-  const { t } = reactI18next.useTranslation();
-  const searchPhotos = async (event) => {
-    if (lodashEs.isEmpty(debouncedQuery)) return;
-    let currentPage = page + 1;
-    setIsFetching(true);
-    setPage(currentPage);
-    const payload = { query: debouncedQuery, page: currentPage };
-    if (orientation) payload.orientation = orientation;
-    if (color) payload.color = color;
-    fetchImage(payload, unsplashAccessKey).then((result) => {
-      var _a, _b, _c;
-      if (currentPage === 1) setImages(((_a = result == null ? void 0 : result.response) == null ? void 0 : _a.results) || []);
-      else setImages([...images, ...((_b = result == null ? void 0 : result.response) == null ? void 0 : _b.results) || []]);
-      setTotalPages((_c = result == null ? void 0 : result.response) == null ? void 0 : _c.total_pages);
-      setIsFetching(false);
-    }).catch(() => {
-      setIsFetching(false);
-    });
-  };
-  React.useEffect(() => {
-    if (!lodashEs.isEmpty(debouncedQuery) && unsplashAccessKey) {
-      setIsFetching(true);
-      const payload = { query: debouncedQuery, page: 1 };
-      if (orientation) payload.orientation = orientation;
-      if (color) payload.color = color;
-      setPage(1);
-      fetchImage(payload, unsplashAccessKey).then((result) => {
-        var _a, _b;
-        setImages(((_a = result == null ? void 0 : result.response) == null ? void 0 : _a.results) || []);
-        setTotalPages((_b = result == null ? void 0 : result.response) == null ? void 0 : _b.total_pages);
-        setIsFetching(false);
-      }).catch(() => {
-        setIsFetching(false);
-      });
-    }
-  }, [orientation, color, debouncedQuery, unsplashAccessKey]);
-  if (lodashEs.isEmpty(unsplashAccessKey)) {
-    return /* @__PURE__ */ jsxRuntime.jsxRuntimeExports.jsx("div", { className: "flex h-full flex-col items-center justify-center", children: /* @__PURE__ */ jsxRuntime.jsxRuntimeExports.jsxs("p", { className: "max-w-3xl text-center text-gray-500", children: [
-      "To enable Unsplash, kindly provide your",
-      /* @__PURE__ */ jsxRuntime.jsxRuntimeExports.jsx(
-        "a",
-        {
-          href: "https://unsplash.com/documentation#public-authentication",
-          className: "px-1 underline hover:text-blue-400",
-          target: "_blank",
-          rel: "noopener noreferrer",
-          children: "Unsplash Access Key"
-        }
-      )
-    ] }) });
-  }
-  return /* @__PURE__ */ jsxRuntime.jsxRuntimeExports.jsxs(jsxRuntime.jsxRuntimeExports.Fragment, { children: [
-    /* @__PURE__ */ jsxRuntime.jsxRuntimeExports.jsxs("form", { className: "flex items-center gap-x-2 rounded-md border border-border bg-background p-px", children: [
-      /* @__PURE__ */ jsxRuntime.jsxRuntimeExports.jsx(
-        contextMenu.Input,
-        {
-          type: "text",
-          name: "query",
-          className: "text-foreground",
-          placeholder: `Try "dog" or "apple"`,
-          onChange: (e) => setDebouncedQuery(e.target.value)
-        }
-      ),
-      /* @__PURE__ */ jsxRuntime.jsxRuntimeExports.jsx("div", { children: /* @__PURE__ */ jsxRuntime.jsxRuntimeExports.jsx(
-        core.ChaiSelect,
-        {
-          className: "w-40",
-          placeholder: t("Orientation"),
-          options: [
-            {
-              value: "",
-              label: "All"
-            },
-            {
-              value: "landscape",
-              label: "Landscape"
-            },
-            {
-              value: "portrait",
-              label: "Portrait"
-            },
-            {
-              value: "squarish",
-              label: "Square"
-            }
-          ],
-          defaultValue: orientation,
-          onValueChange: (_v) => setOrientation(_v)
-        }
-      ) }),
-      /* @__PURE__ */ jsxRuntime.jsxRuntimeExports.jsx("div", { children: /* @__PURE__ */ jsxRuntime.jsxRuntimeExports.jsx(
-        core.ChaiSelect,
-        {
-          placeholder: t("Color"),
-          options: [
-            {
-              value: "",
-              label: "All"
-            },
-            {
-              value: "black_and_white",
-              label: "Black and White"
-            },
-            {
-              value: "black",
-              label: "Black"
-            },
-            {
-              value: "white",
-              label: "White"
-            },
-            {
-              value: "night",
-              label: "Night"
-            },
-            {
-              value: "warm",
-              label: "Warm"
-            },
-            {
-              value: "cool",
-              label: "Cool"
-            },
-            {
-              value: "sepia",
-              label: "Sepia"
-            }
-          ],
-          defaultValue: color,
-          onValueChange: (_v) => setColor(_v)
-        }
-      ) })
-    ] }),
-    /* @__PURE__ */ jsxRuntime.jsxRuntimeExports.jsxs(
-      contextMenu.ScrollArea,
-      {
-        className: `h-full ${isModalView && !lodashEs.isEmpty(images) ? "-mx-2 flex flex-wrap px-2" : "-mx-2 flex flex-col pb-8 pt-2"}`,
-        children: [
-          lodashEs.isEmpty(images) && !isFetching && /* @__PURE__ */ jsxRuntime.jsxRuntimeExports.jsxs("div", { className: "flex flex-col items-center justify-center py-6", children: [
-            /* @__PURE__ */ jsxRuntime.jsxRuntimeExports.jsx("div", { className: "font-medium", children: "No Data" }),
-            /* @__PURE__ */ jsxRuntime.jsxRuntimeExports.jsx("div", { className: "text-sm text-gray-500", children: "Enter query and press enter" })
-          ] }),
-          isModalView ? /* @__PURE__ */ jsxRuntime.jsxRuntimeExports.jsx("div", { className: "h-full columns-5 py-2", children: images.map((pic) => /* @__PURE__ */ jsxRuntime.jsxRuntimeExports.jsx(
-            "div",
-            {
-              role: "button",
-              tabIndex: 0,
-              className: "my-1 flex",
-              onClick: () => onSelect(pic.urls.regular),
-              children: /* @__PURE__ */ jsxRuntime.jsxRuntimeExports.jsx("div", { className: "relative overflow-hidden rounded-md bg-cover bg-no-repeat", children: /* @__PURE__ */ jsxRuntime.jsxRuntimeExports.jsx(
-                "img",
-                {
-                  className: "h-auto flex-1 cursor-pointer rounded-md transition duration-300 ease-in-out hover:scale-105",
-                  alt: pic.alt_description,
-                  src: pic.urls.small
-                }
-              ) })
-            },
-            pic.id
-          )) }) : images.map((pic) => /* @__PURE__ */ jsxRuntime.jsxRuntimeExports.jsx("div", { className: "w-full px-2 py-1", children: /* @__PURE__ */ jsxRuntime.jsxRuntimeExports.jsx("div", { className: "relative overflow-hidden rounded-md bg-cover bg-no-repeat", children: /* @__PURE__ */ jsxRuntime.jsxRuntimeExports.jsx(
-            "img",
-            {
-              className: "h-auto cursor-pointer transition duration-300 ease-in-out hover:scale-105",
-              alt: pic.alt_description,
-              src: pic.urls.small
-            }
-          ) }) }, pic.id)),
-          isFetching && /* @__PURE__ */ jsxRuntime.jsxRuntimeExports.jsxs("div", { className: "flex items-center justify-center py-8", children: [
-            /* @__PURE__ */ jsxRuntime.jsxRuntimeExports.jsx(lucideReact.Loader, { className: "h-6 w-6 animate-spin" }),
-            "  Loading..."
-          ] }),
-          !lodashEs.isEmpty(images) && page < totalPages && !isFetching && /* @__PURE__ */ jsxRuntime.jsxRuntimeExports.jsx(
-            contextMenu.Button,
-            {
-              size: "sm",
-              variant: "link",
-              className: "w-full",
-              onClick: () => searchPhotos(),
-              disabled: isFetching,
-              children: isFetching ? "" : "Load More"
-            }
-          )
-        ]
-      }
-    )
-  ] });
-};
-exports.default = UnsplashImages;
-exports.fetchImage = fetchImage;

package/dist/UnsplashImages-Ck9qpKR0.js

@@ -1,215 +0,0 @@
-import { j as jsxRuntimeExports } from "./jsx-runtime-ClFauRgV.js";
-import { useState, useEffect } from "react";
-import { isEmpty } from "lodash-es";
-import { createApi } from "unsplash-js";
-import { I as Input, S as ScrollArea, B as Button } from "./context-menu-BgtRnByf.js";
-import { useTranslation } from "react-i18next";
-import { d as useBuilderProp, C as ChaiSelect } from "./index-D8_rAW8B.js";
-import { useDebouncedState } from "@react-hookz/web";
-import { Loader } from "lucide-react";
-const fetchImage = async (payload, accessKey) => new Promise((resolve, reject) => {
-  const unsplash = createApi({ accessKey });
-  unsplash.search.getPhotos(payload).then((result) => {
-    resolve(result);
-  }).catch((error) => reject(error));
-});
-const UnsplashImages = ({ isModalView, onSelect }) => {
-  const unsplashAccessKey = useBuilderProp("unsplashAccessKey", "");
-  const [images, setImages] = useState([]);
-  const [page, setPage] = useState(0);
-  const [orientation, setOrientation] = useState();
-  const [color, setColor] = useState();
-  const [totalPages, setTotalPages] = useState(0);
-  const [debouncedQuery, setDebouncedQuery] = useDebouncedState("", 1e3);
-  const [isFetching, setIsFetching] = useState(false);
-  const { t } = useTranslation();
-  const searchPhotos = async (event) => {
-    if (isEmpty(debouncedQuery)) return;
-    let currentPage = page + 1;
-    setIsFetching(true);
-    setPage(currentPage);
-    const payload = { query: debouncedQuery, page: currentPage };
-    if (orientation) payload.orientation = orientation;
-    if (color) payload.color = color;
-    fetchImage(payload, unsplashAccessKey).then((result) => {
-      var _a, _b, _c;
-      if (currentPage === 1) setImages(((_a = result == null ? void 0 : result.response) == null ? void 0 : _a.results) || []);
-      else setImages([...images, ...((_b = result == null ? void 0 : result.response) == null ? void 0 : _b.results) || []]);
-      setTotalPages((_c = result == null ? void 0 : result.response) == null ? void 0 : _c.total_pages);
-      setIsFetching(false);
-    }).catch(() => {
-      setIsFetching(false);
-    });
-  };
-  useEffect(() => {
-    if (!isEmpty(debouncedQuery) && unsplashAccessKey) {
-      setIsFetching(true);
-      const payload = { query: debouncedQuery, page: 1 };
-      if (orientation) payload.orientation = orientation;
-      if (color) payload.color = color;
-      setPage(1);
-      fetchImage(payload, unsplashAccessKey).then((result) => {
-        var _a, _b;
-        setImages(((_a = result == null ? void 0 : result.response) == null ? void 0 : _a.results) || []);
-        setTotalPages((_b = result == null ? void 0 : result.response) == null ? void 0 : _b.total_pages);
-        setIsFetching(false);
-      }).catch(() => {
-        setIsFetching(false);
-      });
-    }
-  }, [orientation, color, debouncedQuery, unsplashAccessKey]);
-  if (isEmpty(unsplashAccessKey)) {
-    return /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "flex h-full flex-col items-center justify-center", children: /* @__PURE__ */ jsxRuntimeExports.jsxs("p", { className: "max-w-3xl text-center text-gray-500", children: [
-      "To enable Unsplash, kindly provide your",
-      /* @__PURE__ */ jsxRuntimeExports.jsx(
-        "a",
-        {
-          href: "https://unsplash.com/documentation#public-authentication",
-          className: "px-1 underline hover:text-blue-400",
-          target: "_blank",
-          rel: "noopener noreferrer",
-          children: "Unsplash Access Key"
-        }
-      )
-    ] }) });
-  }
-  return /* @__PURE__ */ jsxRuntimeExports.jsxs(jsxRuntimeExports.Fragment, { children: [
-    /* @__PURE__ */ jsxRuntimeExports.jsxs("form", { className: "flex items-center gap-x-2 rounded-md border border-border bg-background p-px", children: [
-      /* @__PURE__ */ jsxRuntimeExports.jsx(
-        Input,
-        {
-          type: "text",
-          name: "query",
-          className: "text-foreground",
-          placeholder: `Try "dog" or "apple"`,
-          onChange: (e) => setDebouncedQuery(e.target.value)
-        }
-      ),
-      /* @__PURE__ */ jsxRuntimeExports.jsx("div", { children: /* @__PURE__ */ jsxRuntimeExports.jsx(
-        ChaiSelect,
-        {
-          className: "w-40",
-          placeholder: t("Orientation"),
-          options: [
-            {
-              value: "",
-              label: "All"
-            },
-            {
-              value: "landscape",
-              label: "Landscape"
-            },
-            {
-              value: "portrait",
-              label: "Portrait"
-            },
-            {
-              value: "squarish",
-              label: "Square"
-            }
-          ],
-          defaultValue: orientation,
-          onValueChange: (_v) => setOrientation(_v)
-        }
-      ) }),
-      /* @__PURE__ */ jsxRuntimeExports.jsx("div", { children: /* @__PURE__ */ jsxRuntimeExports.jsx(
-        ChaiSelect,
-        {
-          placeholder: t("Color"),
-          options: [
-            {
-              value: "",
-              label: "All"
-            },
-            {
-              value: "black_and_white",
-              label: "Black and White"
-            },
-            {
-              value: "black",
-              label: "Black"
-            },
-            {
-              value: "white",
-              label: "White"
-            },
-            {
-              value: "night",
-              label: "Night"
-            },
-            {
-              value: "warm",
-              label: "Warm"
-            },
-            {
-              value: "cool",
-              label: "Cool"
-            },
-            {
-              value: "sepia",
-              label: "Sepia"
-            }
-          ],
-          defaultValue: color,
-          onValueChange: (_v) => setColor(_v)
-        }
-      ) })
-    ] }),
-    /* @__PURE__ */ jsxRuntimeExports.jsxs(
-      ScrollArea,
-      {
-        className: `h-full ${isModalView && !isEmpty(images) ? "-mx-2 flex flex-wrap px-2" : "-mx-2 flex flex-col pb-8 pt-2"}`,
-        children: [
-          isEmpty(images) && !isFetching && /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "flex flex-col items-center justify-center py-6", children: [
-            /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "font-medium", children: "No Data" }),
-            /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "text-sm text-gray-500", children: "Enter query and press enter" })
-          ] }),
-          isModalView ? /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "h-full columns-5 py-2", children: images.map((pic) => /* @__PURE__ */ jsxRuntimeExports.jsx(
-            "div",
-            {
-              role: "button",
-              tabIndex: 0,
-              className: "my-1 flex",
-              onClick: () => onSelect(pic.urls.regular),
-              children: /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "relative overflow-hidden rounded-md bg-cover bg-no-repeat", children: /* @__PURE__ */ jsxRuntimeExports.jsx(
-                "img",
-                {
-                  className: "h-auto flex-1 cursor-pointer rounded-md transition duration-300 ease-in-out hover:scale-105",
-                  alt: pic.alt_description,
-                  src: pic.urls.small
-                }
-              ) })
-            },
-            pic.id
-          )) }) : images.map((pic) => /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "w-full px-2 py-1", children: /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "relative overflow-hidden rounded-md bg-cover bg-no-repeat", children: /* @__PURE__ */ jsxRuntimeExports.jsx(
-            "img",
-            {
-              className: "h-auto cursor-pointer transition duration-300 ease-in-out hover:scale-105",
-              alt: pic.alt_description,
-              src: pic.urls.small
-            }
-          ) }) }, pic.id)),
-          isFetching && /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "flex items-center justify-center py-8", children: [
-            /* @__PURE__ */ jsxRuntimeExports.jsx(Loader, { className: "h-6 w-6 animate-spin" }),
-            "  Loading..."
-          ] }),
-          !isEmpty(images) && page < totalPages && !isFetching && /* @__PURE__ */ jsxRuntimeExports.jsx(
-            Button,
-            {
-              size: "sm",
-              variant: "link",
-              className: "w-full",
-              onClick: () => searchPhotos(),
-              disabled: isFetching,
-              children: isFetching ? "" : "Load More"
-            }
-          )
-        ]
-      }
-    )
-  ] });
-};
-export {
-  UnsplashImages as default,
-  fetchImage
-};

package/dist/UploadImages-DW1mj4MB.cjs

@@ -1,117 +0,0 @@
-"use strict";
-Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
-const jsxRuntime = require("./jsx-runtime-B6vEU3CM.cjs");
-const React = require("react");
-const lodashEs = require("lodash-es");
-const jotai = require("jotai");
-const contextMenu = require("./context-menu-BLbuduri.cjs");
-const reactI18next = require("react-i18next");
-const core = require("./index-Bjw2sUN2.cjs");
-const lucideReact = require("lucide-react");
-const uploadedMediaAtom = jotai.atom([]);
-const UploadImages = ({ isModalView, onSelect }) => {
-  const { t } = reactI18next.useTranslation();
-  const uploadImage = core.useBuilderProp("uploadMediaCallback");
-  const fetchImages = core.useBuilderProp("fetchMediaCallback");
-  const [images, setImages] = jotai.useAtom(uploadedMediaAtom);
-  const [isUploading, setIsUploading] = React.useState(false);
-  const [isFetching, setIsFetching] = React.useState(false);
-  const [, setFile] = React.useState();
-  const [error, setError] = React.useState("");
-  React.useEffect(() => {
-    (async () => {
-      if (!fetchImages) return;
-      setIsFetching(true);
-      const uploadedImages = await fetchImages();
-      setImages(uploadedImages || []);
-      setIsFetching(false);
-    })();
-  }, []);
-  const onChange = (e) => {
-    var _a, _b;
-    setError("");
-    if (e && ((_b = (_a = e == null ? void 0 : e.target) == null ? void 0 : _a.files) == null ? void 0 : _b.length) > 0) {
-      const file = e.target.files[0];
-      if (file.type.startsWith("image")) {
-        onUpload(file);
-      } else {
-        setError(t("Please select an image"));
-      }
-    }
-  };
-  const onUpload = async (file) => {
-    if (!uploadImage) return;
-    setIsUploading(true);
-    try {
-      const { url } = await uploadImage(file);
-      onSelect(url);
-      setFile(void 0);
-      const uploadedImages = await fetchImages();
-      setImages(uploadedImages);
-    } catch (err) {
-      setImages([]);
-      setError((err == null ? void 0 : err.message) || "Something went wrong.");
-    }
-    setIsUploading(false);
-  };
-  return /* @__PURE__ */ jsxRuntime.jsxRuntimeExports.jsxs("div", { children: [
-    /* @__PURE__ */ jsxRuntime.jsxRuntimeExports.jsxs("label", { htmlFor: isModalView ? "upload-in-modal" : "upload-in-panel", children: [
-      /* @__PURE__ */ jsxRuntime.jsxRuntimeExports.jsx("div", { className: "flex flex-col items-center rounded-lg", children: /* @__PURE__ */ jsxRuntime.jsxRuntimeExports.jsxs(
-        "label",
-        {
-          htmlFor: "image-upload",
-          className: "flex w-full cursor-pointer flex-col items-center justify-center rounded-lg border-2 border-dashed border-border",
-          children: [
-            /* @__PURE__ */ jsxRuntime.jsxRuntimeExports.jsxs("div", { className: "flex flex-col items-center justify-center pb-6 pt-5", children: [
-              /* @__PURE__ */ jsxRuntime.jsxRuntimeExports.jsx(lucideReact.Upload, { className: "mb-3 h-10 w-10 text-gray-400" }),
-              /* @__PURE__ */ jsxRuntime.jsxRuntimeExports.jsx("p", { className: "mb-2 text-sm text-gray-500 dark:text-gray-400", children: /* @__PURE__ */ jsxRuntime.jsxRuntimeExports.jsx("span", { className: "font-semibold", children: t("Click to upload") }) }),
-              /* @__PURE__ */ jsxRuntime.jsxRuntimeExports.jsx("p", { className: "text-xs text-gray-500 dark:text-gray-400", children: t("SVG, PNG, JPG or GIF (Max. 2mb)") })
-            ] }),
-            isUploading ? /* @__PURE__ */ jsxRuntime.jsxRuntimeExports.jsxs("div", { className: "flex h-full w-full items-center justify-center", children: [
-              /* @__PURE__ */ jsxRuntime.jsxRuntimeExports.jsx(lucideReact.Loader, { className: "h-6 w-6 animate-spin" }),
-              /* @__PURE__ */ jsxRuntime.jsxRuntimeExports.jsx("span", { className: "ml-2 text-sm text-gray-500", children: t("Uploading...") })
-            ] }) : null,
-            error && /* @__PURE__ */ jsxRuntime.jsxRuntimeExports.jsx("p", { className: "pb-2 text-xs text-red-500", children: error || t("Something went wrong") })
-          ]
-        }
-      ) }),
-      /* @__PURE__ */ jsxRuntime.jsxRuntimeExports.jsx(
-        "input",
-        {
-          type: "file",
-          id: isModalView ? "image-upload" : "image-upload",
-          accept: "image/*",
-          hidden: true,
-          onChange
-        }
-      )
-    ] }),
-    /* @__PURE__ */ jsxRuntime.jsxRuntimeExports.jsxs(contextMenu.ScrollArea, { className: `-mx-2 flex h-full flex-col pb-8 pt-2 ${isModalView ? "px-2" : ""} pt-2`, children: [
-      lodashEs.isEmpty(images) && isFetching && /* @__PURE__ */ jsxRuntime.jsxRuntimeExports.jsx("div", { className: "flex flex-col items-center justify-center py-6", children: /* @__PURE__ */ jsxRuntime.jsxRuntimeExports.jsx("div", { className: "animate-pulse font-medium", children: t("Fetching...") }) }),
-      lodashEs.isEmpty(images) && !isFetching && /* @__PURE__ */ jsxRuntime.jsxRuntimeExports.jsxs("div", { className: "flex h-full flex-col items-center justify-center text-center", children: [
-        /* @__PURE__ */ jsxRuntime.jsxRuntimeExports.jsx("div", { className: "mb-4 h-12 rounded-full p-6" }),
-        /* @__PURE__ */ jsxRuntime.jsxRuntimeExports.jsx("h3", { className: "mb-2 text-sm font-semibold", children: t("No images found") }),
-        /* @__PURE__ */ jsxRuntime.jsxRuntimeExports.jsx("p", { className: "mb-4 max-w-sm text-muted-foreground", children: t("It looks like you haven't uploaded any images yet. Start by clicking the upload button above.") })
-      ] }),
-      isModalView ? /* @__PURE__ */ jsxRuntime.jsxRuntimeExports.jsx("div", { className: "h-full columns-5 py-2", children: lodashEs.map(images, (pic) => /* @__PURE__ */ jsxRuntime.jsxRuntimeExports.jsx("div", { role: "button", tabIndex: 0, className: "my-1 flex", onClick: () => onSelect(pic.url), children: /* @__PURE__ */ jsxRuntime.jsxRuntimeExports.jsx("div", { className: "relative overflow-hidden rounded-md bg-cover bg-no-repeat", children: /* @__PURE__ */ jsxRuntime.jsxRuntimeExports.jsx(
-        "img",
-        {
-          className: "h-auto flex-1 cursor-pointer rounded-md transition duration-300 ease-in-out hover:scale-105",
-          alt: pic.name,
-          src: pic.thumbUrl
-        }
-      ) }) }, pic.id)) }) : lodashEs.map(images, (pic) => (
-        // TODO: Drag and Drop Image to Canvas from Here use `pic.url` for image quality
-        /* @__PURE__ */ jsxRuntime.jsxRuntimeExports.jsx("div", { role: "button", tabIndex: 0, className: "px-2 py-1", onClick: () => onSelect(pic.url), children: /* @__PURE__ */ jsxRuntime.jsxRuntimeExports.jsx("div", { className: "relative overflow-hidden rounded-md bg-cover bg-no-repeat", children: /* @__PURE__ */ jsxRuntime.jsxRuntimeExports.jsx(
-          "img",
-          {
-            className: "h-auto w-full cursor-pointer transition duration-300 ease-in-out hover:scale-105",
-            alt: pic.name,
-            src: pic.url
-          }
-        ) }) }, pic.id)
-      ))
-    ] })
-  ] });
-};
-exports.default = UploadImages;

package/dist/UploadImages-DgAMZ8GR.js

@@ -1,117 +0,0 @@
-import { j as jsxRuntimeExports } from "./jsx-runtime-ClFauRgV.js";
-import { useState, useEffect } from "react";
-import { isEmpty, map } from "lodash-es";
-import { atom, useAtom } from "jotai";
-import { S as ScrollArea } from "./context-menu-BgtRnByf.js";
-import { useTranslation } from "react-i18next";
-import { d as useBuilderProp } from "./index-D8_rAW8B.js";
-import { Upload, Loader } from "lucide-react";
-const uploadedMediaAtom = atom([]);
-const UploadImages = ({ isModalView, onSelect }) => {
-  const { t } = useTranslation();
-  const uploadImage = useBuilderProp("uploadMediaCallback");
-  const fetchImages = useBuilderProp("fetchMediaCallback");
-  const [images, setImages] = useAtom(uploadedMediaAtom);
-  const [isUploading, setIsUploading] = useState(false);
-  const [isFetching, setIsFetching] = useState(false);
-  const [, setFile] = useState();
-  const [error, setError] = useState("");
-  useEffect(() => {
-    (async () => {
-      if (!fetchImages) return;
-      setIsFetching(true);
-      const uploadedImages = await fetchImages();
-      setImages(uploadedImages || []);
-      setIsFetching(false);
-    })();
-  }, []);
-  const onChange = (e) => {
-    var _a, _b;
-    setError("");
-    if (e && ((_b = (_a = e == null ? void 0 : e.target) == null ? void 0 : _a.files) == null ? void 0 : _b.length) > 0) {
-      const file = e.target.files[0];
-      if (file.type.startsWith("image")) {
-        onUpload(file);
-      } else {
-        setError(t("Please select an image"));
-      }
-    }
-  };
-  const onUpload = async (file) => {
-    if (!uploadImage) return;
-    setIsUploading(true);
-    try {
-      const { url } = await uploadImage(file);
-      onSelect(url);
-      setFile(void 0);
-      const uploadedImages = await fetchImages();
-      setImages(uploadedImages);
-    } catch (err) {
-      setImages([]);
-      setError((err == null ? void 0 : err.message) || "Something went wrong.");
-    }
-    setIsUploading(false);
-  };
-  return /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { children: [
-    /* @__PURE__ */ jsxRuntimeExports.jsxs("label", { htmlFor: isModalView ? "upload-in-modal" : "upload-in-panel", children: [
-      /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "flex flex-col items-center rounded-lg", children: /* @__PURE__ */ jsxRuntimeExports.jsxs(
-        "label",
-        {
-          htmlFor: "image-upload",
-          className: "flex w-full cursor-pointer flex-col items-center justify-center rounded-lg border-2 border-dashed border-border",
-          children: [
-            /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "flex flex-col items-center justify-center pb-6 pt-5", children: [
-              /* @__PURE__ */ jsxRuntimeExports.jsx(Upload, { className: "mb-3 h-10 w-10 text-gray-400" }),
-              /* @__PURE__ */ jsxRuntimeExports.jsx("p", { className: "mb-2 text-sm text-gray-500 dark:text-gray-400", children: /* @__PURE__ */ jsxRuntimeExports.jsx("span", { className: "font-semibold", children: t("Click to upload") }) }),
-              /* @__PURE__ */ jsxRuntimeExports.jsx("p", { className: "text-xs text-gray-500 dark:text-gray-400", children: t("SVG, PNG, JPG or GIF (Max. 2mb)") })
-            ] }),
-            isUploading ? /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "flex h-full w-full items-center justify-center", children: [
-              /* @__PURE__ */ jsxRuntimeExports.jsx(Loader, { className: "h-6 w-6 animate-spin" }),
-              /* @__PURE__ */ jsxRuntimeExports.jsx("span", { className: "ml-2 text-sm text-gray-500", children: t("Uploading...") })
-            ] }) : null,
-            error && /* @__PURE__ */ jsxRuntimeExports.jsx("p", { className: "pb-2 text-xs text-red-500", children: error || t("Something went wrong") })
-          ]
-        }
-      ) }),
-      /* @__PURE__ */ jsxRuntimeExports.jsx(
-        "input",
-        {
-          type: "file",
-          id: isModalView ? "image-upload" : "image-upload",
-          accept: "image/*",
-          hidden: true,
-          onChange
-        }
-      )
-    ] }),
-    /* @__PURE__ */ jsxRuntimeExports.jsxs(ScrollArea, { className: `-mx-2 flex h-full flex-col pb-8 pt-2 ${isModalView ? "px-2" : ""} pt-2`, children: [
-      isEmpty(images) && isFetching && /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "flex flex-col items-center justify-center py-6", children: /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "animate-pulse font-medium", children: t("Fetching...") }) }),
-      isEmpty(images) && !isFetching && /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "flex h-full flex-col items-center justify-center text-center", children: [
-        /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "mb-4 h-12 rounded-full p-6" }),
-        /* @__PURE__ */ jsxRuntimeExports.jsx("h3", { className: "mb-2 text-sm font-semibold", children: t("No images found") }),
-        /* @__PURE__ */ jsxRuntimeExports.jsx("p", { className: "mb-4 max-w-sm text-muted-foreground", children: t("It looks like you haven't uploaded any images yet. Start by clicking the upload button above.") })
-      ] }),
-      isModalView ? /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "h-full columns-5 py-2", children: map(images, (pic) => /* @__PURE__ */ jsxRuntimeExports.jsx("div", { role: "button", tabIndex: 0, className: "my-1 flex", onClick: () => onSelect(pic.url), children: /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "relative overflow-hidden rounded-md bg-cover bg-no-repeat", children: /* @__PURE__ */ jsxRuntimeExports.jsx(
-        "img",
-        {
-          className: "h-auto flex-1 cursor-pointer rounded-md transition duration-300 ease-in-out hover:scale-105",
-          alt: pic.name,
-          src: pic.thumbUrl
-        }
-      ) }) }, pic.id)) }) : map(images, (pic) => (
-        // TODO: Drag and Drop Image to Canvas from Here use `pic.url` for image quality
-        /* @__PURE__ */ jsxRuntimeExports.jsx("div", { role: "button", tabIndex: 0, className: "px-2 py-1", onClick: () => onSelect(pic.url), children: /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "relative overflow-hidden rounded-md bg-cover bg-no-repeat", children: /* @__PURE__ */ jsxRuntimeExports.jsx(
-          "img",
-          {
-            className: "h-auto w-full cursor-pointer transition duration-300 ease-in-out hover:scale-105",
-            alt: pic.name,
-            src: pic.url
-          }
-        ) }) }, pic.id)
-      ))
-    ] })
-  ] });
-};
-export {
-  UploadImages as default
-};