@layers-app/shared 0.1.5 → 0.2.1

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

@@ -3,34 +3,34 @@ export declare const useFormGlobalTheme: ({ innerId }: {
 }) => {
     customStyles: string;
     mantineTheme: {
-        focusRing?: "auto" | "always" | "never" | undefined;
+        focusRing?: "never" | "auto" | "always" | undefined;
         scale?: number | undefined;
         fontSmoothing?: boolean | undefined;
         white?: string | undefined;
         black?: string | undefined;
         colors?: {
-            [x: string & {}]: import('@mantine/core').MantineColorsTuple | undefined;
-            blue?: import('@mantine/core').MantineColorsTuple | undefined;
-            cyan?: import('@mantine/core').MantineColorsTuple | undefined;
-            gray?: import('@mantine/core').MantineColorsTuple | undefined;
-            green?: import('@mantine/core').MantineColorsTuple | undefined;
-            indigo?: import('@mantine/core').MantineColorsTuple | undefined;
-            lime?: import('@mantine/core').MantineColorsTuple | undefined;
-            orange?: import('@mantine/core').MantineColorsTuple | undefined;
-            pink?: import('@mantine/core').MantineColorsTuple | undefined;
-            red?: import('@mantine/core').MantineColorsTuple | undefined;
-            teal?: import('@mantine/core').MantineColorsTuple | undefined;
-            violet?: import('@mantine/core').MantineColorsTuple | undefined;
-            yellow?: import('@mantine/core').MantineColorsTuple | undefined;
-            dark?: import('@mantine/core').MantineColorsTuple | undefined;
-            grape?: import('@mantine/core').MantineColorsTuple | undefined;
+            [x: string & {}]: import("@mantine/core").MantineColorsTuple | undefined;
+            gray?: import("@mantine/core").MantineColorsTuple | undefined;
+            blue?: import("@mantine/core").MantineColorsTuple | undefined;
+            violet?: import("@mantine/core").MantineColorsTuple | undefined;
+            cyan?: import("@mantine/core").MantineColorsTuple | undefined;
+            green?: import("@mantine/core").MantineColorsTuple | undefined;
+            yellow?: import("@mantine/core").MantineColorsTuple | undefined;
+            red?: import("@mantine/core").MantineColorsTuple | undefined;
+            dark?: import("@mantine/core").MantineColorsTuple | undefined;
+            pink?: import("@mantine/core").MantineColorsTuple | undefined;
+            grape?: import("@mantine/core").MantineColorsTuple | undefined;
+            indigo?: import("@mantine/core").MantineColorsTuple | undefined;
+            lime?: import("@mantine/core").MantineColorsTuple | undefined;
+            orange?: import("@mantine/core").MantineColorsTuple | undefined;
+            teal?: import("@mantine/core").MantineColorsTuple | undefined;
         } | undefined;
-        primaryShade?: import('@mantine/core').MantineColorShade | {
-            light?: import('@mantine/core').MantineColorShade | undefined;
-            dark?: import('@mantine/core').MantineColorShade | undefined;
+        primaryShade?: import("@mantine/core").MantineColorShade | {
+            light?: import("@mantine/core").MantineColorShade | undefined;
+            dark?: import("@mantine/core").MantineColorShade | undefined;
         } | undefined;
         primaryColor?: string | undefined;
-        variantColorResolver?: import('@mantine/core').VariantColorsResolver | undefined;
+        variantColorResolver?: import("@mantine/core").VariantColorsResolver | undefined;
         autoContrast?: boolean | undefined;
         luminanceThreshold?: number | undefined;
         fontFamily?: string | undefined;
@@ -75,51 +75,51 @@ export declare const useFormGlobalTheme: ({ innerId }: {
         radius?: {
             [x: string & {}]: string | undefined;
             sm?: string | undefined;
-            xs?: string | undefined;
             md?: string | undefined;
             lg?: string | undefined;
+            xs?: string | undefined;
             xl?: string | undefined;
         } | undefined;
-        defaultRadius?: import('@mantine/core').MantineRadius | undefined;
+        defaultRadius?: import("@mantine/core").MantineRadius | undefined;
         spacing?: {
             [x: number]: string | undefined;
             [x: string & {}]: string | undefined;
             sm?: string | undefined;
-            xs?: string | undefined;
             md?: string | undefined;
             lg?: string | undefined;
+            xs?: string | undefined;
             xl?: string | undefined;
         } | undefined;
         fontSizes?: {
             [x: string & {}]: string | undefined;
             sm?: string | undefined;
-            xs?: string | undefined;
             md?: string | undefined;
             lg?: string | undefined;
+            xs?: string | undefined;
             xl?: string | undefined;
         } | undefined;
         lineHeights?: {
             [x: string & {}]: string | undefined;
             sm?: string | undefined;
-            xs?: string | undefined;
             md?: string | undefined;
             lg?: string | undefined;
+            xs?: string | undefined;
             xl?: string | undefined;
         } | undefined;
         breakpoints?: {
             [x: string & {}]: string | undefined;
             sm?: string | undefined;
-            xs?: string | undefined;
             md?: string | undefined;
             lg?: string | undefined;
+            xs?: string | undefined;
             xl?: string | undefined;
         } | undefined;
         shadows?: {
             [x: string & {}]: string | undefined;
             sm?: string | undefined;
-            xs?: string | undefined;
             md?: string | undefined;
             lg?: string | undefined;
+            xs?: string | undefined;
             xl?: string | undefined;
         } | undefined;
         respectReducedMotion?: boolean | undefined;
@@ -144,3 +144,4 @@ export declare const useFormGlobalTheme: ({ innerId }: {
         } | undefined;
     };
 };
+//# sourceMappingURL=useFormGlobalTheme.d.ts.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"useFormGlobalTheme.d.ts","sourceRoot":"","sources":["../../../../src/components/FormViewer/hooks/useFormGlobalTheme.tsx"],"names":[],"mappings":"AA0BA,eAAO,MAAM,kBAAkB,GAAI,aAAa;IAAE,OAAO,EAAE,MAAM,CAAA;CAAE;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAsIlE,CAAC"}

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

@@ -0,0 +1,132 @@
+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 { DateInput as y } from "@mantine/dates";
+import { scopeCustomCss as F } from "../helpers/cssScoping.js";
+import { useFormViewerStore as I } from "../store/formStore.js";
+import { themeReselect as S } from "../store/selectors.js";
+const B = ({ innerId: t }) => {
+  const { useStore: s } = I(), e = s(S), i = r(() => {
+    const n = a(e?.primaryColor || ""), o = "custom";
+    return d({
+      ...g,
+      fontFamily: `"${e.font?.fontFamily || "Roboto"}", sans-serif`,
+      // fontWeight: theme.font?.fontWeight,
+      headings: {
+        fontWeight: String(e.font?.fontWeight) || "700",
+        fontFamily: `"${e.font?.fontFamily || "Roboto"}", sans-serif`
+      },
+      primaryColor: "custom",
+      colors: {
+        custom: n
+      },
+      defaultRadius: e.borderRadius,
+      components: {
+        Title: T.extend({
+          defaultProps: {
+            style: {
+              fontFamily: e.title?.fontFamily,
+              fontWeight: e.title?.fontWeight
+            }
+          }
+        }),
+        Text: R.extend({
+          defaultProps: {
+            style: {
+              fontFamily: e.font?.fontFamily,
+              fontWeight: e.font?.fontWeight
+            }
+          }
+        }),
+        Button: h.extend({
+          defaultProps: {
+            color: o,
+            size: e.size,
+            fw: e.font?.fontWeight,
+            radius: e.borderRadius
+          }
+        }),
+        TextInput: P.extend({
+          defaultProps: {
+            radius: e.borderRadius,
+            color: o,
+            size: e.size
+          }
+        }),
+        DateInput: y.extend({
+          defaultProps: {
+            radius: e.borderRadius,
+            color: o,
+            size: e.size
+          }
+        }),
+        Textarea: b.extend({
+          defaultProps: {
+            radius: e.borderRadius,
+            color: o,
+            size: e.size
+          }
+        }),
+        NumberInput: z.extend({
+          defaultProps: {
+            radius: e.borderRadius,
+            color: o,
+            size: e.size
+          }
+        }),
+        Select: x.extend({
+          defaultProps: {
+            radius: e.borderRadius,
+            color: o,
+            size: e.size
+          }
+        }),
+        Progress: p.extend({
+          defaultProps: {
+            radius: e.borderRadius,
+            color: o,
+            size: e.size
+          }
+        }),
+        InputError: c.extend({
+          defaultProps: {
+            color: o,
+            size: e.size
+          }
+        }),
+        Card: f.extend({
+          defaultProps: {
+            radius: e.borderRadius
+          }
+        }),
+        ThemeIcon: m.extend({
+          defaultProps: {
+            radius: e.borderRadius,
+            color: o,
+            size: e.size
+          }
+        }),
+        ActionIcon: l.extend({
+          defaultProps: {
+            radius: e.borderRadius,
+            color: o,
+            size: e.size
+          }
+        }),
+        Flex: u.extend({
+          defaultProps: {
+            align: "center",
+            gap: 8
+          }
+        })
+      }
+    });
+  }, [e]);
+  return {
+    customStyles: r(() => F(e.customCSS || "", `#forms-provider-${t}`), [e.customCSS, t]),
+    mantineTheme: i
+  };
+};
+export {
+  B as useFormGlobalTheme
+};

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

@@ -1,4 +1,5 @@
 export declare const useFormMobile: () => {
-    ref: import('react').RefObject<any>;
+    ref: import("react").RefObject<any>;
     isMobile: boolean;
 };
+//# sourceMappingURL=useFormMobile.d.ts.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"useFormMobile.d.ts","sourceRoot":"","sources":["../../../../src/components/FormViewer/hooks/useFormMobile.tsx"],"names":[],"mappings":"AAMA,eAAO,MAAM,aAAa;;;CAazB,CAAC"}

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

@@ -0,0 +1,15 @@
+import { useEffect as i } from "react";
+import { useElementSize as s } from "@mantine/hooks";
+import { useFormViewerStore as m } from "../store/formStore.js";
+const p = () => {
+  const { api: o } = m(), { ref: r, width: t } = s(), e = t < 800;
+  return i(() => {
+    o.setIsMobile(e);
+  }, [o, e]), {
+    ref: r,
+    isMobile: e
+  };
+};
+export {
+  p as useFormMobile
+};

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

@@ -1,2 +1,3 @@
 export declare const useInterpolateText: (text?: string | null, disabled?: boolean) => string;
 export declare const useInterpolate: () => (text?: string | null) => string;
+//# sourceMappingURL=useInterpolateText.d.ts.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"useInterpolateText.d.ts","sourceRoot":"","sources":["../../../../src/components/FormViewer/hooks/useInterpolateText.tsx"],"names":[],"mappings":"AAQA,eAAO,MAAM,kBAAkB,GAAI,OAAO,MAAM,GAAG,IAAI,EAAE,kBAAgB,WAMxE,CAAC;AAEF,eAAO,MAAM,cAAc,gBAMf,MAAM,GAAG,IAAI,WA2DxB,CAAC"}

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

@@ -0,0 +1,57 @@
+import { useMemo as m, useCallback 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]);
+}, b = () => {
+  const { form: i } = g(), { useStore: o } = v(), a = o(h);
+  return d(
+    (u) => {
+      const p = a.reduce(
+        (t, e) => {
+          const n = "variableName" in e && e.variableName || e.id;
+          if (e.controlType === "dropdown") {
+            const r = e.options?.find(
+              (s) => s.id === i.values[e.id]
+            );
+            return t[n] = r?.label || "", t;
+          }
+          if (e.controlType === "choice") {
+            const r = e.options?.find(
+              (s) => s.id === i.values[e.id]
+            );
+            return t[n] = r?.label || "", t;
+          }
+          if (e.controlType === "multipleChoice") {
+            const r = e.options?.filter(
+              (s) => i.values[e.id]?.includes(s.id)
+            );
+            return t[n] = r?.map((s) => s.label).join(", ") || "", t;
+          }
+          if (e.controlType === "date") {
+            const r = new Date(i.values[e.id]);
+            return t[n] = f(r) ? r.toLocaleDateString() : "", t;
+          }
+          return t[n] = i.values[e.id], t;
+        },
+        {}
+      );
+      return (u || "").replace(
+        /(\{{2,})([a-zA-Z0-9_]+)(\}{2,})/g,
+        (t, e, n, r) => {
+          if (e.length < 2 || r.length < 2) return t;
+          const s = Math.max(0, e.length - 2), l = Math.max(0, r.length - 2);
+          return "{".repeat(s) + (p[n] ?? "") + "}".repeat(l);
+        }
+      );
+    },
+    [a, i.values]
+  );
+};
+export {
+  b as useInterpolate,
+  N as useInterpolateText
+};

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

@@ -6,3 +6,4 @@ export * from './store/formStoreApi';
 export * from './store/selectors';
 export * from './hooks';
 export * from './helpers';
+//# sourceMappingURL=index.d.ts.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/FormViewer/index.ts"],"names":[],"mappings":"AAAA,cAAc,cAAc,CAAC;AAC7B,cAAc,cAAc,CAAC;AAC7B,cAAc,iBAAiB,CAAC;AAChC,cAAc,mBAAmB,CAAC;AAClC,cAAc,sBAAsB,CAAC;AACrC,cAAc,mBAAmB,CAAC;AAClC,cAAc,SAAS,CAAC;AACxB,cAAc,WAAW,CAAC"}