@layers-app/shared 0.2.5 → 0.2.7

package/dist/components/FilePicker/FilePickerUnsplash.js

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

package/dist/components/FormViewer/components/OneSlideLayput.js

@@ -1,26 +1,26 @@
-import { jsx as e, jsxs as s, Fragment as c } from "react/jsx-runtime";
-import { memo as d } from "react";
-import { createPortal as h } from "react-dom";
-import { Stack as u, Flex as b } from "@mantine/core";
-import { AnimatePresence as y, motion as k } from "framer-motion";
+import { jsx as e, jsxs as s, Fragment as p } from "react/jsx-runtime";
+import { memo as h } from "react";
+import { createPortal as u } from "react-dom";
+import { Stack as b, Flex as y } from "@mantine/core";
+import { AnimatePresence as v, motion as k } from "framer-motion";
 import { Copyright as S } from "../../Copyright/index.js";
 import { animations as w } from "../helpers/slides.js";
-import { useFormViewerStore as p } from "../store/formStore.js";
-import { startStepReselect as v, themeReselect as F } from "../store/selectors.js";
-import { Navigation as x } from "./Navigation/Navigation.js";
-import { getImageFilter as $, Step as R } from "./Step.js";
+import { useFormViewerStore as d } from "../store/formStore.js";
+import { startStepReselect as x, themeReselect as F } from "../store/selectors.js";
+import { Navigation as $ } from "./Navigation/Navigation.js";
+import { getImageFilter as R, Step as j } from "./Step.js";
 import { ProgressLine as A } from "./fields/ProgressLine.js";
 import g from "../FormViewer.module.css.js";
 import { useSteps as C } from "../hooks/useCreateFormContext.js";
-import { useFormMobile as j } from "../hooks/useFormMobile.js";
+import { useFormMobile as M } from "../hooks/useFormMobile.js";
 import { useActiveStep as N } from "../hooks/useActiveStep.js";
-const T = ({
+const U = ({
   NoStepSlot: m,
   copyright: l
 }) => {
-  const { useStore: a } = p();
-  return a(v) ? /* @__PURE__ */ e(P, { copyright: l }) : /* @__PURE__ */ e(
-    u,
+  const { useStore: a } = d();
+  return a(x) ? /* @__PURE__ */ e(P, { copyright: l }) : /* @__PURE__ */ e(
+    b,
     {
       align: "center",
       justify: "center",
@@ -31,11 +31,11 @@ const T = ({
       children: /* @__PURE__ */ e(m, {})
     }
   );
-}, P = d(({ copyright: m }) => {
-  const { anim: l } = C(), { ref: a } = j(), { useStore: n } = p(), i = n((r) => r.config.settings), f = n((r) => r.editing), t = n(F), o = N();
-  return /* @__PURE__ */ s(c, { children: [
-    h(
-      /* @__PURE__ */ s(c, { children: [
+}, P = h(({ copyright: m }) => {
+  const { anim: l } = C(), { ref: a, isMobile: o } = M(), { useStore: c } = d(), r = c((n) => n.config.settings), f = c((n) => n.editing), t = c(F), i = N();
+  return /* @__PURE__ */ s(p, { children: [
+    u(
+      /* @__PURE__ */ s(p, { children: [
         /* @__PURE__ */ e(
           "link",
           {
@@ -70,7 +70,7 @@ const T = ({
             "--bg-fit": t.background?.fit || "cover",
             "--bg-image": t.background?.image ? `url(${t.background.image})` : "none",
             "--bg-color": t.background?.color || "none",
-            "--bg-image-filter": $({
+            "--bg-image-filter": R({
               brightness: t.background?.brightness || 100,
               blur: t.background?.blur,
               layout: "background"
@@ -78,7 +78,7 @@ const T = ({
           }
         }
       ),
-      /* @__PURE__ */ e(y, { mode: "wait", children: o && /* @__PURE__ */ e(
+      /* @__PURE__ */ e(v, { mode: "wait", children: i && /* @__PURE__ */ e(
         k.div,
         {
           style: {
@@ -91,43 +91,45 @@ const T = ({
           transition: {
             duration: 0.25
           },
-          ...w[i.slideAnimation][l],
+          ...w[r.slideAnimation][l],
           animate: { opacity: 1, y: 0, x: 0 },
           children: /* @__PURE__ */ e(
-            R,
+            j,
             {
-              step: o,
-              theme: o.theme
+              step: i,
+              theme: i.theme
             },
-            o.id
+            i.id
           )
         },
-        o.id
+        i.id
       ) })
     ] }),
     /* @__PURE__ */ s(
-      b,
+      y,
       {
-        pos: "absolute",
-        bottom: 24,
-        right: 24,
-        onClick: f ? (r) => r.preventDefault() : void 0,
+        pos: o ? "relative" : "absolute",
+        bottom: o ? void 0 : 24,
+        right: o ? void 0 : 24,
+        justify: o ? "flex-end" : void 0,
+        p: o ? "8px 12px" : void 0,
+        onClick: f ? (n) => n.preventDefault() : void 0,
         children: [
-          i.copyright && /* @__PURE__ */ e(
+          r.copyright && /* @__PURE__ */ e(
             S,
             {
               size: "sm",
-              color: o?.theme?.primaryColor,
+              color: i?.theme?.primaryColor,
               title: m
             }
           ),
-          i.navArrows && i.layout === "slides" && /* @__PURE__ */ e(x, {})
+          r.navArrows && r.layout === "slides" && /* @__PURE__ */ e($, {})
         ]
       }
     ),
-    i.progressBar && /* @__PURE__ */ e(A, {})
+    r.progressBar && /* @__PURE__ */ e(A, {})
   ] });
 });
 export {
-  T as OneSlideLayout
+  U as OneSlideLayout
 };

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

@@ -1 +1 @@
-{"version":3,"file":"useCreateFormContext.d.ts","sourceRoot":"","sources":["../../../../src/components/FormViewer/hooks/useCreateFormContext.tsx"],"names":[],"mappings":"AAAA,OAAO,EACL,iBAAiB,EAKlB,MAAM,OAAO,CAAC;AAEf,OAAO,EAAE,iBAAiB,EAAW,MAAM,eAAe,CAAC;AAO3D,OAAO,EAAE,SAAS,EAAE,MAAM,eAAe,CAAC;AAG1C,KAAK,YAAY,GAAG;IAClB,UAAU,EAAE,MAAM,IAAI,CAAC;IACvB,UAAU,EAAE,MAAM,IAAI,CAAC;IACvB,IAAI,EAAE,SAAS,CAAC;IAChB,IAAI,EAAE,iBAAiB,CAAC,eAAe,CAAC,CAAC;IACzC,QAAQ,EAAE,CAAC,SAAS,EAAE,MAAM,EAAE,KAAK,EAAE,GAAG,EAAE,OAAO,CAAC,EAAE,MAAM,KAAK,IAAI,CAAC;CACrE,CAAC;AAEF,eAAO,MAAM,YAAY,uCAExB,CAAC;AAEF,eAAO,MAAM,QAAQ,oBAAiC,CAAC;AAEvD,MAAM,MAAM,eAAe,GAAG,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC,GAAG;IAClD,YAAY,EAAE,MAAM,CAAC;CACtB,CAAC;AAEF,KAAK,yBAAyB,GAAG;IAC/B,QAAQ,CAAC,EAAE,CAAC,MAAM,EAAE,eAAe,KAAK,IAAI,CAAC;IAC7C,cAAc,CAAC,EAAE,CAAC,MAAM,EAAE,eAAe,KAAK,IAAI,CAAC;CACpD,CAAC;AAyGF,kEAAkE;AAClE,eAAO,MAAM,mBAAmB,GAAI,wBAGjC,iBAAiB,CAAC,yBAAyB,CAAC,4CAK9C,CAAC"}
+{"version":3,"file":"useCreateFormContext.d.ts","sourceRoot":"","sources":["../../../../src/components/FormViewer/hooks/useCreateFormContext.tsx"],"names":[],"mappings":"AAAA,OAAO,EACL,iBAAiB,EAKlB,MAAM,OAAO,CAAC;AAEf,OAAO,EAAE,iBAAiB,EAAW,MAAM,eAAe,CAAC;AAO3D,OAAO,EAAE,SAAS,EAAE,MAAM,eAAe,CAAC;AAG1C,KAAK,YAAY,GAAG;IAClB,UAAU,EAAE,MAAM,IAAI,CAAC;IACvB,UAAU,EAAE,MAAM,IAAI,CAAC;IACvB,IAAI,EAAE,SAAS,CAAC;IAChB,IAAI,EAAE,iBAAiB,CAAC,eAAe,CAAC,CAAC;IACzC,QAAQ,EAAE,CAAC,SAAS,EAAE,MAAM,EAAE,KAAK,EAAE,GAAG,EAAE,OAAO,CAAC,EAAE,MAAM,KAAK,IAAI,CAAC;CACrE,CAAC;AAEF,eAAO,MAAM,YAAY,uCAExB,CAAC;AAEF,eAAO,MAAM,QAAQ,oBAAiC,CAAC;AAEvD,MAAM,MAAM,eAAe,GAAG,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC,GAAG;IAClD,YAAY,EAAE,MAAM,CAAC;CACtB,CAAC;AAEF,KAAK,yBAAyB,GAAG;IAC/B,QAAQ,CAAC,EAAE,CAAC,MAAM,EAAE,eAAe,KAAK,IAAI,CAAC;IAC7C,cAAc,CAAC,EAAE,CAAC,MAAM,EAAE,eAAe,KAAK,IAAI,CAAC;CACpD,CAAC;AA2GF,kEAAkE;AAClE,eAAO,MAAM,mBAAmB,GAAI,wBAGjC,iBAAiB,CAAC,yBAAyB,CAAC,4CAK9C,CAAC"}

package/dist/components/FormViewer/hooks/useCreateFormContext.js

@@ -34,26 +34,26 @@ const d = h(
 }) => {
   const { useStore: a, api: i } = A(), { currentSteps: l } = a(T), n = j(), [f, p] = b("next"), { getValidation: x } = y(), r = E({
     initialValues: l?.reduce(
-      (e, o) => (o.controls?.forEach((t) => {
-        e[t.id] = w[t.controlType];
-      }), e),
+      (o, e) => (e.controls?.forEach((t) => {
+        o[t.id] = w[t.controlType];
+      }), o),
       {
         submissionId: crypto.randomUUID()
       }
     ),
-    validate: l?.reduce((e, o) => (o.controls?.forEach((t) => e[t.id] = x(t)), e), {}),
+    validate: l?.reduce((o, e) => (e.controls?.forEach((t) => o[t.id] = x(t)), o), {}),
     onValuesChange: u
   }), c = m(() => {
     if (!n || (n.controls || []).map((t) => r.validateField(t.id)).some((t) => t.hasError)) return;
-    const o = g(n, l, r);
-    p("next"), setTimeout(() => {
-      i.setActiveStepId(o?.id || "");
-    }, 0), o?.isEnd && (s?.(r.getValues()), new F().addConfetti());
+    const e = g(n, l, r);
+    p("next"), e && setTimeout(() => {
+      i.setActiveStepId(e.id);
+    }, 0), e?.isEnd && (s?.(r.getValues()), new F().addConfetti());
   }, [n, i, l, r, s]), S = m(() => {
     p("prev"), setTimeout(() => i.backActiveStep(), 0);
   }, [i]), v = m(
-    (e, o) => {
-      r.setFieldValue(e, o), n?.autoSubmit && c();
+    (o, e) => {
+      r.setFieldValue(o, e), n?.autoSubmit && c();
     },
     [n?.autoSubmit, r, c]
   );

package/dist/components/FormViewer/hooks/useFormGlobalTheme.js

@@ -1,6 +1,6 @@
 import { useMemo as r } from "react";
 import { generateColors as a } from "@mantine/colors-generator";
-import { createTheme as d, Flex as u, ActionIcon as l, ThemeIcon as m, Card as f, InputError as c, Progress as p, Select as x, NumberInput as z, Textarea as b, TextInput as P, Button as h, Text as R, Title as T, DEFAULT_THEME as g } from "@mantine/core";
+import { createTheme as d, DEFAULT_THEME as u, Flex as l, ActionIcon as m, ThemeIcon as f, Card as c, InputError as p, Progress as x, Select as z, NumberInput as b, Textarea as P, TextInput as h, Button as R, Text as T, Title as g } from "@mantine/core";
 import { DateInput as y } from "@mantine/dates";
 import { scopeCustomCss as F } from "../helpers/cssScoping.js";
 import { useFormViewerStore as I } from "../store/formStore.js";
@@ -9,7 +9,7 @@ const B = ({ innerId: t }) => {
   const { useStore: s } = I(), e = s(S), i = r(() => {
     const n = a(e?.primaryColor || ""), o = "custom";
     return d({
-      ...g,
+      ...u,
       fontFamily: `"${e.font?.fontFamily || "Roboto"}", sans-serif`,
       // fontWeight: theme.font?.fontWeight,
       headings: {
@@ -22,7 +22,7 @@ const B = ({ innerId: t }) => {
       },
       defaultRadius: e.borderRadius,
       components: {
-        Title: T.extend({
+        Title: g.extend({
           defaultProps: {
             style: {
               fontFamily: e.title?.fontFamily,
@@ -30,7 +30,7 @@ const B = ({ innerId: t }) => {
             }
           }
         }),
-        Text: R.extend({
+        Text: T.extend({
           defaultProps: {
             style: {
               fontFamily: e.font?.fontFamily,
@@ -38,7 +38,7 @@ const B = ({ innerId: t }) => {
             }
           }
         }),
-        Button: h.extend({
+        Button: R.extend({
           defaultProps: {
             color: o,
             size: e.size,
@@ -46,7 +46,7 @@ const B = ({ innerId: t }) => {
             radius: e.borderRadius
           }
         }),
-        TextInput: P.extend({
+        TextInput: h.extend({
           defaultProps: {
             radius: e.borderRadius,
             color: o,
@@ -60,60 +60,60 @@ const B = ({ innerId: t }) => {
             size: e.size
           }
         }),
-        Textarea: b.extend({
+        Textarea: P.extend({
           defaultProps: {
             radius: e.borderRadius,
             color: o,
             size: e.size
           }
         }),
-        NumberInput: z.extend({
+        NumberInput: b.extend({
           defaultProps: {
             radius: e.borderRadius,
             color: o,
             size: e.size
           }
         }),
-        Select: x.extend({
+        Select: z.extend({
           defaultProps: {
             radius: e.borderRadius,
             color: o,
             size: e.size
           }
         }),
-        Progress: p.extend({
+        Progress: x.extend({
           defaultProps: {
             radius: e.borderRadius,
             color: o,
             size: e.size
           }
         }),
-        InputError: c.extend({
+        InputError: p.extend({
           defaultProps: {
             color: o,
             size: e.size
           }
         }),
-        Card: f.extend({
+        Card: c.extend({
           defaultProps: {
             radius: e.borderRadius
           }
         }),
-        ThemeIcon: m.extend({
+        ThemeIcon: f.extend({
           defaultProps: {
             radius: e.borderRadius,
             color: o,
             size: e.size
           }
         }),
-        ActionIcon: l.extend({
+        ActionIcon: m.extend({
           defaultProps: {
             radius: e.borderRadius,
             color: o,
             size: e.size
           }
         }),
-        Flex: u.extend({
+        Flex: l.extend({
           defaultProps: {
             align: "center",
             gap: 8

package/dist/components/FormViewer/hooks/useInterpolateText.js

@@ -1,14 +1,14 @@
-import { useMemo as m, useCallback as d } from "react";
+import { useCallback as m, useMemo as d } from "react";
 import { isValid as f } from "date-fns";
 import { useFormViewerStore as v } from "../store/formStore.js";
 import { controlsReselect as h } from "../store/selectors.js";
 import { useSteps as g } from "./useCreateFormContext.js";
 const N = (i, o = !1) => {
   const a = b();
-  return m(() => o ? i || "" : a(i), [o, a, i]);
+  return d(() => o ? i || "" : a(i), [o, a, i]);
 }, b = () => {
   const { form: i } = g(), { useStore: o } = v(), a = o(h);
-  return d(
+  return m(
     (u) => {
       const p = a.reduce(
         (t, e) => {

package/dist/components/FormViewer/store/formStore.js

@@ -1,5 +1,5 @@
 import { jsx as p } from "react/jsx-runtime";
-import { useState as a, useLayoutEffect as d, createContext as S, useContext as v } from "react";
+import { useState as a, useLayoutEffect as d, useContext as S, createContext as v } from "react";
 import { create as w } from "zustand";
 import { createFormStoreApi as x } from "./formStoreApi.js";
 const b = () => {
@@ -40,7 +40,7 @@ const b = () => {
     useStore: e,
     api: x(e)
   };
-}, u = S(null), P = ({
+}, u = v(null), P = ({
   children: e,
   editing: t = !1,
   preview: o = !1,
@@ -70,7 +70,7 @@ const b = () => {
     r.api
   ]), /* @__PURE__ */ p(u.Provider, { value: r, children: m ? e : null });
 }, A = () => {
-  const t = v(u) || window.globalFormStore;
+  const t = S(u) || window.globalFormStore;
   if (!t)
     throw new Error(
       "useFormViewerStore must be used within a FormStoreProvider"

package/dist/components/FormViewer/store/formStoreApi.js

@@ -6,11 +6,11 @@ const O = (e) => {
       ...t,
       ...n
     }));
-  }, m = () => e.getState().config, s = () => {
-    e.getState().onConfigChange?.(m());
+  }, l = () => e.getState().config, s = () => {
+    e.getState().onConfigChange?.(l());
   }, u = (n) => {
     e.setState({ layout: n });
-  }, S = (n) => {
+  }, m = (n) => {
     e.setState((t) => ({
       ...t,
       config: {
@@ -122,7 +122,7 @@ const O = (e) => {
           steps: o
         }
       };
-    }), h(n.id), s();
+    }), S(n.id), s();
   }, A = (n) => {
     e.setState((i) => ({
       ...i,
@@ -130,7 +130,7 @@ const O = (e) => {
         ...i.config,
         steps: i.config.steps.filter((o) => o.id !== n) || []
       }
-    })), E(e.getState()) === n && l(), s();
+    })), E(e.getState()) === n && h(), s();
   }, F = (n, t) => {
     n === "list" ? e.setState((i) => ({
       ...i,
@@ -291,7 +291,7 @@ const O = (e) => {
       ...o,
       initialConfigSnapshot: n
     })), t || s();
-  }, h = (n) => {
+  }, S = (n) => {
     e.setState((t) => {
       const i = [
         ...t.activeStep.history.slice(0, t.activeStep.current + 1),
@@ -324,10 +324,10 @@ const O = (e) => {
         )
       }
     }));
-  }, l = () => {
+  }, h = () => {
     e.setState({
       activeStep: {
-        history: [],
+        history: [null],
         current: 0
       }
     });
@@ -343,7 +343,7 @@ const O = (e) => {
       })), s();
     },
     setLayout: u,
-    patchSettingsData: S,
+    patchSettingsData: m,
     patchThemeData: C,
     patchContainerTheme: y,
     patchTitleProperties: b,
@@ -363,19 +363,19 @@ const O = (e) => {
     removeCondition: V,
     setIsMobile: _,
     setConfig: $,
-    setActiveStepId: h,
+    setActiveStepId: S,
     setFormLayout: (n) => {
-      S({ layout: n }), s();
+      m({ layout: n }), s();
     },
     scrollToControl: (n) => {
       const t = document.querySelector(`[data-control-id='${n}']`);
       t && t.scrollIntoView({ behavior: "smooth", block: "center" });
     },
-    getConfig: m,
+    getConfig: l,
     setProps: r,
     forwardActiveStep: z,
     backActiveStep: j,
-    resetActiveStep: l
+    resetActiveStep: h
   };
 };
 export {

package/dist/components/FormViewer/store/selectors.js

@@ -1,7 +1,7 @@
 import { createSelector as s } from "@reduxjs/toolkit";
 import { isEqual as y } from "lodash-es";
 import { DEFAULT_THEME as v } from "../constants/defaultTheme.js";
-import { mergeTheme as d, sortSteps as g } from "../helpers/helpers.js";
+import { sortSteps as g, mergeTheme as d } from "../helpers/helpers.js";
 import { getFirstStep as B } from "../helpers/steps.js";
 const D = v, M = s(
   [(t) => t.config.theme],

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

@@ -4,6 +4,7 @@ export interface GroupAvatarProps extends Omit<AvatarProps, 'src'>, Omit<React.C
     groupId?: string;
     groupName?: string;
     size?: number | string;
+    textSize?: number | string;
 }
 export declare const GroupAvatar: import("react").ForwardRefExoticComponent<GroupAvatarProps & import("react").RefAttributes<HTMLDivElement>>;
 //# sourceMappingURL=index.d.ts.map

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

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/GroupAvatar/index.tsx"],"names":[],"mappings":"AAEA,OAAO,EAAE,WAAW,EAAE,MAAM,eAAe,CAAC;AAK5C,MAAM,WAAW,gBACf,SAAQ,IAAI,CAAC,WAAW,EAAE,KAAK,CAAC,EAC9B,IAAI,CAAC,KAAK,CAAC,wBAAwB,CAAC,KAAK,CAAC,EAAE,MAAM,WAAW,CAAC;IAChE,SAAS,CAAC,EAAE,MAAM,GAAG,IAAI,CAAC;IAC1B,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,IAAI,CAAC,EAAE,MAAM,GAAG,MAAM,CAAC;CACxB;AAED,eAAO,MAAM,WAAW,6GAgBvB,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/GroupAvatar/index.tsx"],"names":[],"mappings":"AAEA,OAAO,EAAE,WAAW,EAAE,MAAM,eAAe,CAAC;AAK5C,MAAM,WAAW,gBACf,SAAQ,IAAI,CAAC,WAAW,EAAE,KAAK,CAAC,EAC9B,IAAI,CAAC,KAAK,CAAC,wBAAwB,CAAC,KAAK,CAAC,EAAE,MAAM,WAAW,CAAC;IAChE,SAAS,CAAC,EAAE,MAAM,GAAG,IAAI,CAAC;IAC1B,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,IAAI,CAAC,EAAE,MAAM,GAAG,MAAM,CAAC;IACvB,QAAQ,CAAC,EAAE,MAAM,GAAG,MAAM,CAAC;CAC5B;AAED,eAAO,MAAM,WAAW,6GAiBvB,CAAC"}

package/dist/components/GroupAvatar/index.js

@@ -1,14 +1,15 @@
-import { jsx as p } from "react/jsx-runtime";
-import { forwardRef as f } from "react";
-import i from "../../assets/svg/group_default_icon.svg.js";
+import { jsx as i } from "react/jsx-runtime";
+import { forwardRef as p } from "react";
+import f from "../../assets/svg/group_default_icon.svg.js";
 import { UserAvatar as u } from "../UserAvatar/index.js";
-const s = f(
-  ({ groupIcon: r, groupId: a, groupName: o, size: t = 24, ...m }, e) => /* @__PURE__ */ p(
+const n = p(
+  ({ groupIcon: r, groupId: a, groupName: o, size: t = 24, ...m }, e) => /* @__PURE__ */ i(
     u,
     {
       ref: e,
+      variant: "light",
       user: {
-        avatar: r || i,
+        avatar: r || f,
         id: a || "",
         name: o,
         email: ""
@@ -18,7 +19,7 @@ const s = f(
     }
   )
 );
-s.displayName = "GroupAvatar";
+n.displayName = "GroupAvatar";
 export {
-  s as GroupAvatar
+  n as GroupAvatar
 };