@layers-app/shared 0.1.5 → 0.2.1

package/dist/components/FilePicker/FilePickerLink.js

@@ -0,0 +1,48 @@
+import { jsxs as o, jsx as t } from "react/jsx-runtime";
+import { Stack as m, FocusTrap as d, TextInput as c, Flex as f, Button as p } from "@mantine/core";
+import { useForm as h } from "@mantine/form";
+import { isValidUrl as g, isImageUrl as k, isVideoUrl as v, isAudioUrl as x } from "../../helpers/validation.js";
+import F from "./FilePicker.module.css.js";
+const U = ({
+  locales: i,
+  onChange: u,
+  type: s,
+  isValidMediaUrl: a
+}) => {
+  const l = h({
+    initialValues: {
+      url: ""
+    },
+    validate: {
+      url: (r) => (r || "").trim().length > 0 && g(r) ? null : i.errors.invalidLink
+    }
+  }), n = async () => {
+    const { values: r } = l;
+    let e;
+    s === "image" ? e = await k(r.url) : s === "video" ? a && a(r.url) ? e = !0 : e = await v(r.url) : s === "audio" ? e = await x(r.url) : e = !0, e ? u?.(r.url) : l.setFieldError("url", i.errors.invalidLink);
+  };
+  return /* @__PURE__ */ o(m, { gap: "sm", children: [
+    /* @__PURE__ */ t(d, { active: !0, children: /* @__PURE__ */ t(
+      c,
+      {
+        maxLength: 500,
+        size: "sm",
+        placeholder: i.pasteLink,
+        "data-autofocus": !0,
+        ...l.getInputProps("url")
+      }
+    ) }),
+    /* @__PURE__ */ t(f, { justify: "flex-end", align: "center", children: /* @__PURE__ */ t(
+      p,
+      {
+        onClick: n,
+        className: F.button,
+        disabled: !l.values.url,
+        children: i.save
+      }
+    ) })
+  ] });
+};
+export {
+  U as FilePickerLink
+};

package/dist/components/FilePicker/FilePickerSkeletonLoader.d.ts

@@ -1 +1,2 @@
 export declare const FilePickerSkeletonLoader: () => import("react/jsx-runtime").JSX.Element;
+//# sourceMappingURL=FilePickerSkeletonLoader.d.ts.map

package/dist/components/FilePicker/FilePickerSkeletonLoader.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"FilePickerSkeletonLoader.d.ts","sourceRoot":"","sources":["../../../src/components/FilePicker/FilePickerSkeletonLoader.tsx"],"names":[],"mappings":"AAEA,eAAO,MAAM,wBAAwB,+CAcpC,CAAC"}

package/dist/components/FilePicker/FilePickerSkeletonLoader.js

@@ -0,0 +1,9 @@
+import { jsxs as t, jsx as e } from "react/jsx-runtime";
+import { Stack as o, SimpleGrid as c, AspectRatio as n, Skeleton as r } from "@mantine/core";
+const h = () => /* @__PURE__ */ t(o, { gap: 8, children: [
+  /* @__PURE__ */ e(c, { cols: 4, spacing: 8, children: [...new Array(12)].map((a, i) => /* @__PURE__ */ e(n, { ratio: 120 / 65, children: /* @__PURE__ */ e(r, { height: 80 }) }, i)) }),
+  /* @__PURE__ */ e(r, { height: 36 })
+] });
+export {
+  h as FilePickerSkeletonLoader
+};

package/dist/components/FilePicker/FilePickerUnsplash.d.ts

@@ -4,3 +4,4 @@ export declare const FilePickerUnsplash: ({ locales, onChange, clientId, }: {
     clientId?: string;
     onChange?: (v: string) => void;
 }) => import("react/jsx-runtime").JSX.Element;
+//# sourceMappingURL=FilePickerUnsplash.d.ts.map

package/dist/components/FilePicker/FilePickerUnsplash.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"FilePickerUnsplash.d.ts","sourceRoot":"","sources":["../../../src/components/FilePicker/FilePickerUnsplash.tsx"],"names":[],"mappings":"AA0BA,OAAO,EAAE,iBAAiB,EAAE,MAAM,SAAS,CAAC;AAU5C,eAAO,MAAM,kBAAkB,GAAI,kCAIhC;IACD,OAAO,EAAE,iBAAiB,CAAC;IAC3B,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,QAAQ,CAAC,EAAE,CAAC,CAAC,EAAE,MAAM,KAAK,IAAI,CAAC;CAChC,4CAwGA,CAAC"}

package/dist/components/FilePicker/FilePickerUnsplash.js

@@ -0,0 +1,95 @@
+import { jsxs as c, jsx as t } from "react/jsx-runtime";
+import { useState as l, useMemo as v, useEffect as f, useCallback as P } from "react";
+import { useTranslation as z } from "react-i18next";
+import { Search01Icon as L } from "@hugeicons/core-free-icons";
+import { HugeiconsIcon as T } from "@hugeicons/react";
+import { Stack as b, TextInput as j, Loader as D, Box as k, SimpleGrid as M, AspectRatio as q, Button as w } from "@mantine/core";
+import { useDebouncedValue as B, useDebouncedCallback as F } from "@mantine/hooks";
+import { NoData as N } from "../NoData/NoData.js";
+import { FilePickerSkeletonLoader as Q } from "./FilePickerSkeletonLoader.js";
+import { useUnsplashPhotos as U } from "./api/unsplashApi.js";
+import _ from "./FilePicker.module.css.js";
+const y = (r) => (r || []).reduce((s, a) => (s[a.id] = a, s), {}), W = ({
+  locales: r,
+  onChange: s,
+  clientId: a
+}) => {
+  const { t: C } = z(), [m, I] = l(""), [u] = B(m, 800), [x, p] = l(1), [d, h] = l({}), { data: o, isLoading: i } = U(
+    {
+      query: u,
+      page: x,
+      per_page: 24,
+      order_by: "popular"
+    },
+    a
+  ), n = v(
+    () => Object.values({ ...d, ...y(o?.items) }),
+    [d, o?.items]
+  ), g = F(() => {
+    setTimeout(() => {
+      h((e) => ({ ...e, ...y(o?.items) }));
+    }, 0);
+  }, 100);
+  f(() => {
+    g();
+  }, [o?.items, g]), f(() => {
+    h({});
+  }, [u]);
+  const S = P(
+    (e) => {
+      I(e.currentTarget.value), p(1);
+    },
+    []
+  );
+  return /* @__PURE__ */ c(b, { gap: "sm", children: [
+    /* @__PURE__ */ t(
+      j,
+      {
+        leftSection: i ? /* @__PURE__ */ t(D, { size: 16 }) : /* @__PURE__ */ t(T, { size: 16, icon: L }),
+        maxLength: 50,
+        placeholder: r.search,
+        "data-autofocus": !0,
+        value: m,
+        onChange: S
+      }
+    ),
+    /* @__PURE__ */ c(k, { mah: 300, w: "100%", style: { overflowY: "auto" }, children: [
+      !!n.length && /* @__PURE__ */ c(b, { gap: 8, children: [
+        /* @__PURE__ */ t(M, { cols: 4, spacing: 10, children: n.map((e) => /* @__PURE__ */ t(
+          q,
+          {
+            onClick: () => s?.(e.urls.regular),
+            ratio: 120 / 65,
+            className: _.itemImage,
+            style: {
+              backgroundImage: `url(${e.urls.small})`
+            }
+          },
+          e.id
+        )) }),
+        o?.hasMore && /* @__PURE__ */ t(
+          w,
+          {
+            variant: "subtle",
+            loading: i,
+            onClick: () => p((e) => e + 1),
+            children: C("loadMore")
+          }
+        )
+      ] }),
+      !n.length && !i && /* @__PURE__ */ t(k, { pb: 16, children: /* @__PURE__ */ t(
+        N,
+        {
+          size: 120,
+          illustration: "noImage",
+          description: r.noImages,
+          titleProps: { size: "xs", c: "dimmed" }
+        }
+      ) }),
+      !n.length && i && /* @__PURE__ */ t(Q, {})
+    ] })
+  ] });
+};
+export {
+  W as FilePickerUnsplash
+};

package/dist/components/FilePicker/FilePickerUpload.d.ts

@@ -1,8 +1,10 @@
 import { DropzoneProps, FileWithPath } from '@mantine/dropzone';
 import { FilePickerLocales } from './types';
+import '@mantine/dropzone/styles.css';
 export declare const FilePickerUpload: ({ locales, uploading, dropZoneProps, onUpload, }: {
     locales: FilePickerLocales;
     uploading: boolean;
     dropZoneProps?: Omit<DropzoneProps, "onDrop">;
     onUpload: (files: FileWithPath[]) => void;
 }) => import("react/jsx-runtime").JSX.Element;
+//# sourceMappingURL=FilePickerUpload.d.ts.map

package/dist/components/FilePicker/FilePickerUpload.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"FilePickerUpload.d.ts","sourceRoot":"","sources":["../../../src/components/FilePicker/FilePickerUpload.tsx"],"names":[],"mappings":"AAKA,OAAO,EAEL,aAAa,EAEb,YAAY,EAEb,MAAM,mBAAmB,CAAC;AAI3B,OAAO,EAAE,iBAAiB,EAAE,MAAM,SAAS,CAAC;AAE5C,OAAO,8BAA8B,CAAC;AAEtC,eAAO,MAAM,gBAAgB,GAAI,kDAK9B;IACD,OAAO,EAAE,iBAAiB,CAAC;IAC3B,SAAS,EAAE,OAAO,CAAC;IACnB,aAAa,CAAC,EAAE,IAAI,CAAC,aAAa,EAAE,QAAQ,CAAC,CAAC;IAC9C,QAAQ,EAAE,CAAC,KAAK,EAAE,YAAY,EAAE,KAAK,IAAI,CAAC;CAC3C,4CA6EA,CAAC"}

package/dist/components/FilePicker/FilePickerUpload.js

@@ -0,0 +1,86 @@
+import { jsx as i, jsxs as m } from "react/jsx-runtime";
+import { useCallback as l } from "react";
+import { Image02Icon as g } from "@hugeicons/core-free-icons";
+import { HugeiconsIcon as x } from "@hugeicons/react";
+import { Stack as c, Text as a } from "@mantine/core";
+import { Dropzone as u, IMAGE_MIME_TYPE as F } from "@mantine/dropzone";
+import { showNotification as f } from "@mantine/notifications";
+import { showErrorNotification as y } from "../../helpers/showNotifications.js";
+import "@mantine/dropzone/styles.css";
+const C = ({
+  locales: e,
+  uploading: d,
+  dropZoneProps: n,
+  onUpload: s
+}) => {
+  const p = l(
+    (t) => {
+      if (t.filter(
+        (r) => r.errors.some((o) => o.code === "file-invalid-type")
+      ).length > 0) {
+        f({
+          color: "blue",
+          message: e.errors.typeIsNotAllowed
+        });
+        return;
+      }
+      if (t.some((r) => r.errors.some((o) => o.code === "file-too-large"))) {
+        y({
+          title: e.error,
+          message: e.errors.shouldNotExceed
+        });
+        return;
+      }
+      if (t.filter(
+        (r) => r.errors.some((o) => o.code === "too-many-files")
+      ).length > 0) {
+        f({
+          color: "blue",
+          message: e.errors.doNotUploadMoreThanSingleFile
+        });
+        return;
+      }
+    },
+    [e]
+  ), h = l(s, [s]);
+  return /* @__PURE__ */ i(
+    u,
+    {
+      loading: d,
+      onDrop: h,
+      onReject: p,
+      maxFiles: n?.maxFiles || 1,
+      accept: F,
+      px: 60,
+      py: "xl",
+      ...n || {},
+      children: /* @__PURE__ */ m(
+        c,
+        {
+          justify: "center",
+          gap: "var(--mantine-font-size-xs",
+          align: "center",
+          mih: 89,
+          style: { pointerEvents: "none" },
+          children: [
+            /* @__PURE__ */ i(
+              x,
+              {
+                size: 32,
+                color: "var(--mantine-color-bright)",
+                icon: g
+              }
+            ),
+            /* @__PURE__ */ m(c, { gap: 8, align: "center", children: [
+              /* @__PURE__ */ i(a, { fw: 500, fz: "sm", c: "bright", lh: "sm", ta: "center", children: e.dragOrClickToChoose }),
+              /* @__PURE__ */ i(a, { fz: "xs", fw: 400, lh: "140%", c: "dimmed", ta: "center", children: e.maxFileSize })
+            ] })
+          ]
+        }
+      )
+    }
+  );
+};
+export {
+  C as FilePickerUpload
+};

package/dist/components/FilePicker/api/giphyApi.d.ts

@@ -6,5 +6,6 @@ type Data = {
     hasMore: boolean;
 };
 export declare const fetchGiphyPhotos: (params: ApiGiphy.Request, page?: number, token?: string) => Promise<Data>;
-export declare const useGiphyPhotos: (params: ApiGiphy.Request, page: number, token?: string) => import('@tanstack/react-query').UseQueryResult<Data, Error>;
+export declare const useGiphyPhotos: (params: ApiGiphy.Request, page: number, token?: string) => import("@tanstack/react-query").UseQueryResult<Data, Error>;
 export {};
+//# sourceMappingURL=giphyApi.d.ts.map

package/dist/components/FilePicker/api/giphyApi.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"giphyApi.d.ts","sourceRoot":"","sources":["../../../../src/components/FilePicker/api/giphyApi.ts"],"names":[],"mappings":"AAGA,OAAO,EAAE,QAAQ,EAAE,MAAM,oBAAoB,CAAC;AAI9C,KAAK,IAAI,GAAG;IACV,KAAK,EAAE,QAAQ,CAAC,KAAK,EAAE,CAAC;IACxB,IAAI,EAAE,MAAM,CAAC;IACb,UAAU,EAAE,MAAM,CAAC;IACnB,OAAO,EAAE,OAAO,CAAC;CAClB,CAAC;AAEF,eAAO,MAAM,gBAAgB,GAC3B,QAAQ,QAAQ,CAAC,OAAO,EACxB,aAAQ,EACR,QAAQ,MAAM,KACb,OAAO,CAAC,IAAI,CA8Bd,CAAC;AAEF,eAAO,MAAM,cAAc,GACzB,QAAQ,QAAQ,CAAC,OAAO,EACxB,MAAM,MAAM,EACZ,QAAQ,MAAM,gEAMf,CAAC"}

package/dist/components/FilePicker/api/giphyApi.js

@@ -0,0 +1,26 @@
+import { useQuery as h } from "@tanstack/react-query";
+import p from "query-string";
+const y = "TBp2lqNzl0orFQtaXgwymH4UDM0kbAVe", g = async (o, n = 1, i) => {
+  const s = o.q ? "/gifs/search" : "/gifs/trending", a = await fetch(
+    `https://api.giphy.com/v1${s}?${p.stringify({
+      ...o,
+      api_key: i || y
+    })}`
+  );
+  if (!a.ok)
+    throw new Error("Failed to fetch Giphy photos");
+  const t = await a.json(), e = t.data, r = Math.ceil(t.pagination.total_count / 12), c = t.pagination.total_count % 12 === 0 || t.pagination.total_count > t.pagination.count + t.pagination.offset;
+  return {
+    items: e,
+    page: n,
+    totalPages: r,
+    hasMore: c
+  };
+}, d = (o, n, i) => h({
+  queryKey: ["giphyPhotos", o, n],
+  queryFn: () => g(o, n, i)
+});
+export {
+  g as fetchGiphyPhotos,
+  d as useGiphyPhotos
+};

package/dist/components/FilePicker/api/unsplashApi.d.ts

@@ -6,5 +6,6 @@ type Data = {
     hasMore: boolean;
 };
 export declare const fetchUnsplashPhotos: (params: ApiUnsplash.Request, clientId?: string, previousData?: Data) => Promise<Data>;
-export declare const useUnsplashPhotos: (params: ApiUnsplash.Request, clientId?: string, rest?: any) => import('@tanstack/react-query').DefinedUseQueryResult<Data, Error>;
+export declare const useUnsplashPhotos: (params: ApiUnsplash.Request, clientId?: string, rest?: any) => import("@tanstack/react-query").DefinedUseQueryResult<Data, Error>;
 export {};
+//# sourceMappingURL=unsplashApi.d.ts.map

package/dist/components/FilePicker/api/unsplashApi.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"unsplashApi.d.ts","sourceRoot":"","sources":["../../../../src/components/FilePicker/api/unsplashApi.ts"],"names":[],"mappings":"AAGA,OAAO,EAAE,WAAW,EAAE,MAAM,uBAAuB,CAAC;AAIpD,KAAK,IAAI,GAAG;IACV,KAAK,EAAE,WAAW,CAAC,KAAK,EAAE,CAAC;IAC3B,IAAI,EAAE,MAAM,CAAC;IACb,UAAU,EAAE,MAAM,CAAC;IACnB,OAAO,EAAE,OAAO,CAAC;CAClB,CAAC;AAEF,eAAO,MAAM,mBAAmB,GAC9B,QAAQ,WAAW,CAAC,OAAO,EAC3B,WAAW,MAAM,EACjB,eAAe,IAAI,KAClB,OAAO,CAAC,IAAI,CA4Bd,CAAC;AAEF,eAAO,MAAM,iBAAiB,GAC5B,QAAQ,WAAW,CAAC,OAAO,EAC3B,WAAW,MAAM,EACjB,OAAO,GAAG,uEAOX,CAAC"}

package/dist/components/FilePicker/api/unsplashApi.js

@@ -0,0 +1,29 @@
+import { useQuery as i } from "@tanstack/react-query";
+import p from "query-string";
+const u = "a2SNktIFgNCvXITBZgpup1T8mtSdJIM6TIZlndbRuRg", c = async (t, e, o) => {
+  const h = t.query ? "/search/photos" : "/photos", n = await fetch(
+    `https://api.unsplash.com${h}?${p.stringify(t)}`,
+    {
+      headers: {
+        Authorization: `Client-ID ${e || u}`
+      }
+    }
+  );
+  if (!n.ok)
+    throw new Error("Failed to fetch Unsplash photos");
+  const s = await n.json(), r = s && "results" in s ? s.results : s, a = s && "total_pages" in s ? s.total_pages : 999;
+  return {
+    items: o ? [...o.items, ...r] : r,
+    page: t.page || 1,
+    totalPages: a,
+    hasMore: a > (t.page || 1)
+  };
+}, f = (t, e, o) => i({
+  queryKey: ["unsplashPhotos", t],
+  queryFn: () => c(t, e),
+  ...o
+});
+export {
+  c as fetchUnsplashPhotos,
+  f as useUnsplashPhotos
+};

package/dist/components/FilePicker/index.d.ts

@@ -1 +1,2 @@
 export * from './FilePicker';
+//# sourceMappingURL=index.d.ts.map

package/dist/components/FilePicker/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/FilePicker/index.tsx"],"names":[],"mappings":"AAAA,cAAc,cAAc,CAAC"}

package/dist/components/FilePicker/types.d.ts

@@ -10,10 +10,12 @@ export type FilePickerLocales = {
     link?: string;
     error?: string;
     search?: string;
+    searchImages?: string;
     upload?: string;
     uploadFile?: string;
     change?: string;
     remove?: string;
+    save?: string;
     dragOrClickToChoose?: string;
     maxFileSize?: string;
     pasteLink?: string;
@@ -28,3 +30,4 @@ export type FilePickerLocales = {
     };
 };
 export type FileType = 'file' | 'image' | 'audio' | 'video';
+//# sourceMappingURL=types.d.ts.map

package/dist/components/FilePicker/types.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../src/components/FilePicker/types.ts"],"names":[],"mappings":"AAAA,MAAM,MAAM,4BAA4B,GAAG;IACzC,KAAK,EAAE,MAAM,CAAC;IACd,IAAI,EAAE,MAAM,CAAC;IACb,EAAE,EAAE,MAAM,CAAC;IACX,GAAG,EAAE,MAAM,CAAC;IACZ,KAAK,EAAE,MAAM,EAAE,CAAC;CACjB,CAAC;AAEF,MAAM,MAAM,iBAAiB,GAAG;IAC9B,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,KAAK,CAAC,EAAE,MAAM,CAAC;IAEf,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB,IAAI,CAAC,EAAE,MAAM,CAAC;IAEd,mBAAmB,CAAC,EAAE,MAAM,CAAC;IAC7B,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,UAAU,CAAC,EAAE,MAAM,CAAC;IAEpB,iBAAiB,CAAC,EAAE,MAAM,CAAC;IAC3B,QAAQ,CAAC,EAAE,MAAM,CAAC;IAElB,MAAM,EAAE;QACN,gBAAgB,CAAC,EAAE,MAAM,CAAC;QAC1B,eAAe,CAAC,EAAE,MAAM,CAAC;QACzB,6BAA6B,CAAC,EAAE,MAAM,CAAC;QACvC,WAAW,CAAC,EAAE,MAAM,CAAC;KACtB,CAAC;CACH,CAAC;AAEF,MAAM,MAAM,QAAQ,GAAG,MAAM,GAAG,OAAO,GAAG,OAAO,GAAG,OAAO,CAAC"}

package/dist/components/FormViewer/FormViewer.d.ts

@@ -6,3 +6,4 @@ type FormViewerProps = {
 /** Основной компонент для отображения формы */
 export declare const FormViewer: ({ NoStepSlot, copyright, }: FormViewerProps) => import("react/jsx-runtime").JSX.Element;
 export {};
+//# sourceMappingURL=FormViewer.d.ts.map

package/dist/components/FormViewer/FormViewer.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"FormViewer.d.ts","sourceRoot":"","sources":["../../../src/components/FormViewer/FormViewer.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,EAAE,EAAoB,MAAM,OAAO,CAAC;AAY7C,KAAK,eAAe,GAAG;IACrB,UAAU,CAAC,EAAE,EAAE,CAAC;IAChB,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB,CAAC;AAEF,+CAA+C;AAC/C,eAAO,MAAM,UAAU,GAAI,4BAGxB,eAAe,4CAoCjB,CAAC"}

package/dist/components/FormViewer/FormViewer.js

@@ -0,0 +1,42 @@
+import { jsxs as d, jsx as e } from "react/jsx-runtime";
+import { useState as u, useRef as f } from "react";
+import { useMantineColorScheme as h, MantineProvider as p } from "@mantine/core";
+import { AllSlidesLayout as S } from "./components/AllSlidesLayout.js";
+import { OneSlideLayout as y } from "./components/OneSlideLayput.js";
+import { getRandomId as v } from "./helpers/steps.js";
+import { useFormGlobalTheme as w } from "./hooks/useFormGlobalTheme.js";
+import { useFormViewerStore as x } from "./store/formStore.js";
+import C from "./FormViewer.module.css.js";
+const V = ({
+  NoStepSlot: r = () => null,
+  copyright: m
+}) => {
+  const [o] = u(() => v()), { colorScheme: t } = h(), { useStore: i } = x(), s = i((c) => c.layout), { mantineTheme: n, customStyles: a } = w({ innerId: o }), l = f(null);
+  return /* @__PURE__ */ d(
+    p,
+    {
+      theme: n,
+      getRootElement: () => l.current ?? void 0,
+      forceColorScheme: t === "auto" ? void 0 : t,
+      classNamesPrefix: "layers",
+      withGlobalClasses: !1,
+      withStaticClasses: !0,
+      cssVariablesSelector: `#forms-provider-${o}`,
+      children: [
+        /* @__PURE__ */ e("style", { dangerouslySetInnerHTML: { __html: a } }),
+        /* @__PURE__ */ e(
+          "div",
+          {
+            ref: l,
+            id: `forms-provider-${o}`,
+            className: C.themeProvider,
+            children: s === "one-slide" ? /* @__PURE__ */ e(y, { NoStepSlot: r, copyright: m }) : s === "all-slides" ? /* @__PURE__ */ e(S, { NoStepSlot: r }) : null
+          }
+        )
+      ]
+    }
+  );
+};
+export {
+  V as FormViewer
+};

package/dist/components/FormViewer/FormViewer.module.css.js

@@ -0,0 +1,37 @@
+const t = "_themeProvider_13pry_1", o = "_root_13pry_7", e = "_container_13pry_36", n = "_media_13pry_42", _ = "_background_13pry_46", r = "_stepRoot_13pry_59", s = "_content_13pry_104", c = "_mediaInner_13pry_169", p = "_stepTitle_13pry_332", i = "_stepDescription_13pry_355", a = "_stepIndicator_13pry_369", d = "_stepIndicatorIcon_13pry_386", l = "_focusBox_13pry_405", y = "_dropzone_13pry_414", u = "_allSlidesLayout_13pry_432", I = "_allSlidesLayoutStep_13pry_438", m = {
+  themeProvider: t,
+  root: o,
+  container: e,
+  media: n,
+  background: _,
+  stepRoot: r,
+  content: s,
+  mediaInner: c,
+  stepTitle: p,
+  stepDescription: i,
+  stepIndicator: a,
+  stepIndicatorIcon: d,
+  focusBox: l,
+  dropzone: y,
+  allSlidesLayout: u,
+  allSlidesLayoutStep: I
+};
+export {
+  u as allSlidesLayout,
+  I as allSlidesLayoutStep,
+  _ as background,
+  e as container,
+  s as content,
+  m as default,
+  y as dropzone,
+  l as focusBox,
+  n as media,
+  c as mediaInner,
+  o as root,
+  i as stepDescription,
+  a as stepIndicator,
+  d as stepIndicatorIcon,
+  r as stepRoot,
+  p as stepTitle,
+  t as themeProvider
+};

package/dist/components/FormViewer/KeyboardNavigation.d.ts

@@ -3,3 +3,4 @@ import { ReactNode } from 'react';
 export declare const KeyboardNavigation: ({ children }: {
     children?: ReactNode;
 }) => import("react/jsx-runtime").JSX.Element;
+//# sourceMappingURL=KeyboardNavigation.d.ts.map

package/dist/components/FormViewer/KeyboardNavigation.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"KeyboardNavigation.d.ts","sourceRoot":"","sources":["../../../src/components/FormViewer/KeyboardNavigation.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAa,MAAM,OAAO,CAAC;AAM7C,oGAAoG;AACpG,eAAO,MAAM,kBAAkB,GAAI,cAAc;IAAE,QAAQ,CAAC,EAAE,SAAS,CAAA;CAAE,4CAyBxE,CAAC"}

package/dist/components/FormViewer/components/AllSlidesLayout.d.ts

@@ -5,3 +5,4 @@ type AllSlidesLayoutProps = {
 };
 export declare const AllSlidesLayout: ({ NoStepSlot }: AllSlidesLayoutProps) => import("react/jsx-runtime").JSX.Element;
 export {};
+//# sourceMappingURL=AllSlidesLayout.d.ts.map

package/dist/components/FormViewer/components/AllSlidesLayout.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"AllSlidesLayout.d.ts","sourceRoot":"","sources":["../../../../src/components/FormViewer/components/AllSlidesLayout.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,EAAE,EAAE,MAAM,OAAO,CAAC;AAU3B,KAAK,oBAAoB,GAAG;IAC1B,UAAU,EAAE,EAAE,CAAC;IACf,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB,CAAC;AAEF,eAAO,MAAM,eAAe,GAAI,gBAAgB,oBAAoB,4CA+BnE,CAAC"}

package/dist/components/FormViewer/components/AllSlidesLayout.js

@@ -0,0 +1,24 @@
+import { jsx as t } from "react/jsx-runtime";
+import { Stack as l } from "@mantine/core";
+import { useFormViewerStore as m } from "../store/formStore.js";
+import { stepsReselect as p, startStepReselect as c } from "../store/selectors.js";
+import { Step as n } from "./Step.js";
+import i from "../FormViewer.module.css.js";
+const L = ({ NoStepSlot: o }) => {
+  const { useStore: e } = m(), { currentSteps: s } = e(p);
+  return e(c) ? /* @__PURE__ */ t("div", { className: i.allSlidesLayout, children: s.map((r) => /* @__PURE__ */ t("div", { className: i.allSlidesLayoutStep, children: /* @__PURE__ */ t(n, { step: r }, r.id) })) }) : /* @__PURE__ */ t(
+    l,
+    {
+      align: "center",
+      justify: "center",
+      gap: 4,
+      w: "100%",
+      h: "100%",
+      p: 16,
+      children: /* @__PURE__ */ t(o, {})
+    }
+  );
+};
+export {
+  L as AllSlidesLayout
+};

package/dist/components/FormViewer/components/Container.d.ts

@@ -1,5 +1,6 @@
 import { ThemeData } from '../types/form';
-export declare const Container: import('react').MemoExoticComponent<({ children, theme }: {
+export declare const Container: import("react").MemoExoticComponent<({ children, theme }: {
     children: React.ReactNode;
     theme?: ThemeData;
 }) => import("react/jsx-runtime").JSX.Element>;
+//# sourceMappingURL=Container.d.ts.map

package/dist/components/FormViewer/components/Container.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"Container.d.ts","sourceRoot":"","sources":["../../../../src/components/FormViewer/components/Container.tsx"],"names":[],"mappings":"AAGA,OAAO,EAAE,SAAS,EAAE,MAAM,eAAe,CAAC;AAI1C,eAAO,MAAM,SAAS,4DACE;IAAE,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAC;IAAC,KAAK,CAAC,EAAE,SAAS,CAAA;CAAE,6CAuBvE,CAAC"}

package/dist/components/FormViewer/components/Container.js

@@ -0,0 +1,27 @@
+import { jsx as n } from "react/jsx-runtime";
+import { memo as t } from "react";
+import { useFormViewerStore as e } from "../store/formStore.js";
+import c from "../FormViewer.module.css.js";
+const u = t(
+  ({ children: r, theme: o }) => {
+    const { useStore: i } = e(), a = i((s) => s.isMobile);
+    return /* @__PURE__ */ n(
+      "div",
+      {
+        className: c.container,
+        "data-size": o?.size,
+        "data-mobile": a,
+        style: {
+          "--border-radius": `var(--mantine-radius-${o?.borderRadius})`,
+          "--blur": `${o?.container?.blur ?? 0}px`,
+          "--color": o?.container?.color,
+          "--shadow": `0 0 ${o?.container?.shadowSize || 0}px ${o?.container?.shadowColor || "transparent"}`
+        },
+        children: r
+      }
+    );
+  }
+);
+export {
+  u as Container
+};

package/dist/components/FormViewer/components/ListFocusBox.d.ts

@@ -2,3 +2,4 @@ export declare const ListFocusBox: ({ controlId, children, }: {
     controlId: string;
     children: React.ReactNode;
 }) => import("react/jsx-runtime").JSX.Element;
+//# sourceMappingURL=ListFocusBox.d.ts.map

package/dist/components/FormViewer/components/ListFocusBox.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"ListFocusBox.d.ts","sourceRoot":"","sources":["../../../../src/components/FormViewer/components/ListFocusBox.tsx"],"names":[],"mappings":"AAMA,eAAO,MAAM,YAAY,GAAI,0BAG1B;IACD,SAAS,EAAE,MAAM,CAAC;IAClB,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAC;CAC3B,4CAoBA,CAAC"}

package/dist/components/FormViewer/components/ListFocusBox.js

@@ -0,0 +1,22 @@
+import { jsx as o, Fragment as i } from "react/jsx-runtime";
+import { useActiveControl as u } from "../hooks/useActiveControl.js";
+import { useActiveStep as a } from "../hooks/useActiveStep.js";
+import { useFormViewerStore as f } from "../store/formStore.js";
+import p from "../FormViewer.module.css.js";
+const l = ({
+  controlId: r,
+  children: t
+}) => {
+  const { useStore: s } = f(), m = s((n) => n.editing), e = a(), c = u();
+  return !m || e?.id !== "list" ? /* @__PURE__ */ o(i, { children: t }) : c?.id === r ? /* @__PURE__ */ o(
+    "div",
+    {
+      className: p.focusBox,
+      "data-radius": e?.theme?.borderRadius,
+      children: t
+    }
+  ) : /* @__PURE__ */ o(i, { children: t });
+};
+export {
+  l as ListFocusBox
+};

package/dist/components/FormViewer/components/NavControls.d.ts

@@ -2,3 +2,4 @@ import { StepData } from '../types/form';
 export declare const NavControls: ({ data }: {
     data: StepData;
 }) => import("react/jsx-runtime").JSX.Element | null;
+//# sourceMappingURL=NavControls.d.ts.map

package/dist/components/FormViewer/components/NavControls.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"NavControls.d.ts","sourceRoot":"","sources":["../../../../src/components/FormViewer/components/NavControls.tsx"],"names":[],"mappings":"AAWA,OAAO,EAAE,QAAQ,EAAE,MAAM,eAAe,CAAC;AAGzC,eAAO,MAAM,WAAW,GAAI,UAAU;IAAE,IAAI,EAAE,QAAQ,CAAA;CAAE,mDA4DvD,CAAC"}