@indielayer/ui 1.2.0 → 1.4.0

package/lib/components/drawer/Drawer.vue.js

@@ -1,8 +1,7 @@
-import { defineComponent as P, ref as a, watchEffect as X, watch as j, computed as v, onMounted as K, openBlock as y, createBlock as M, Teleport as O, createVNode as w, Transition as q, withCtx as g, withDirectives as F, createElementVNode as k, normalizeClass as $, unref as n, createElementBlock as G, createCommentVNode as x, normalizeStyle as H, renderSlot as f, vShow as I } from "vue";
-import { useBreakpoints as J, breakpointsTailwind as Q, useEventListener as S, useSwipe as U } from "../../node_modules/.pnpm/@vueuse_core@10.2.0_vue@3.3.4/node_modules/@vueuse/core/index.js";
-import { useTheme as W } from "../../composables/theme.js";
-import Y from "../scroll/Scroll.vue.js";
-import Z from "./Drawer.theme.js";
+import { defineComponent as X, ref as a, watchEffect as j, watch as K, computed as v, onMounted as M, openBlock as y, createBlock as O, Teleport as q, createVNode as w, Transition as F, withCtx as g, withDirectives as G, createElementVNode as k, normalizeClass as $, unref as n, createElementBlock as H, createCommentVNode as x, normalizeStyle as I, renderSlot as f, vShow as J } from "vue";
+import { useBreakpoints as Q, breakpointsTailwind as U, useEventListener as S, useSwipe as W } from "../../node_modules/.pnpm/@vueuse_core@10.2.0_vue@3.3.9/node_modules/@vueuse/core/index.js";
+import { useTheme as Y } from "../../composables/useTheme.js";
+import Z from "../scroll/Scroll.vue.js";
 const ee = {
   key: 0,
   ref: "swipeRef",
@@ -36,21 +35,21 @@ const ee = {
   validators: {
     position: te
   }
-}, fe = /* @__PURE__ */ P({
+}, pe = /* @__PURE__ */ X({
   ...ie,
   props: oe,
   emits: ["update:modelValue"],
-  setup(E, { expose: L, emit: u }) {
-    const t = E, i = a(!0), s = a(t.modelValue), r = a(null), d = a(null), c = a(!1), h = typeof t.breakpoint == "string", p = J(h ? Q : { md: t.breakpoint || 768 }).smaller(h ? t.breakpoint : "md");
-    X(() => {
+  setup(E, { expose: L, emit: B }) {
+    const t = E, u = B, i = a(!0), s = a(t.modelValue), r = a(null), d = a(null), c = a(!1), h = typeof t.breakpoint == "string", p = Q(h ? U : { md: t.breakpoint || 768 }).smaller(h ? t.breakpoint : "md");
+    j(() => {
       t.breakpoint && (p.value ? (i.value = !0, l()) : (i.value = !1, m()));
-    }), S(r, "pointerdown", l), j(() => t.modelValue, (e) => {
+    }), S(r, "pointerdown", l), K(() => t.modelValue, (e) => {
       s.value = e;
-    }), typeof window < "u" && S(document, "keydown", B);
-    function B(e) {
+    }), typeof window < "u" && S(document, "keydown", T);
+    function T(e) {
       e.key === "Escape" && s.value && l();
     }
-    U(d, {
+    W(d, {
       // passive: false,
       // onSwipe(e: TouchEvent) {
       //   if (lengthX.value < 0) {
@@ -71,17 +70,17 @@ const ee = {
         i.value && (t.position === "left" && o === "left" || t.position === "right" && o === "right" || t.position === "top" && o === "up" || t.position === "bottom" && o === "down") && l();
       }
     });
-    const T = v(() => {
+    const V = v(() => {
       const e = {};
       return t.position === "left" || t.position === "right" ? e.width = `${t.width}px` : (t.position === "top" || t.position === "bottom") && (e.height = `${t.height}px`), e;
-    }), V = v(() => {
+    }), N = v(() => {
       const e = [];
       return i.value && (e.push("absolute shadow-lg"), t.position === "top" ? e.push("top-0 inset-x-0") : t.position === "bottom" ? e.push("bottom-0 inset-x-0") : t.position === "left" ? e.push("left-0 inset-y-0") : t.position === "right" && e.push("right-0 inset-y-0")), e;
     });
-    function N(e) {
+    function _(e) {
       e.classList.add("inset-0"), t.position === "top" ? e.style.top = `-${t.height}px` : t.position === "bottom" ? e.style.bottom = `-${t.height}px` : t.position === "left" ? e.style.left = `-${t.width}px` : t.position === "right" && (e.style.right = `-${t.width}px`);
     }
-    function _(e, o) {
+    function C(e, o) {
       if (!i.value) {
         o();
         return;
@@ -90,9 +89,9 @@ const ee = {
         t.backdrop && e.classList.add("bg-gray-500/30"), t.position === "top" ? e.style.top = "0" : t.position === "bottom" ? e.style.bottom = "0" : t.position === "left" ? e.style.left = "0" : t.position === "right" && (e.style.right = "0");
       }, 1);
     }
-    function C(e) {
+    function R(e) {
     }
-    function R(e, o) {
+    function D(e, o) {
       e.addEventListener("transitionend", o), setTimeout(() => {
         t.backdrop && e.classList.remove("bg-gray-500/30"), t.position === "top" ? e.style.top = `-${t.height}px` : t.position === "bottom" ? e.style.bottom = `-${t.height}px` : t.position === "left" ? e.style.left = `-${t.width}px` : t.position === "right" && (e.style.right = `-${t.width}px`);
       }, 1);
@@ -106,25 +105,25 @@ const ee = {
     function m() {
       s.value = !0, u("update:modelValue", !0);
     }
-    K(() => {
+    M(() => {
       c.value = !0;
     });
-    const { styles: D, classes: b, className: A } = W("drawer", Z, t);
-    return L({ open: m, close: l }), (e, o) => c.value ? (y(), M(O, {
+    const { styles: A, classes: b, className: P } = Y("Drawer", {}, t);
+    return L({ open: m, close: l }), (e, o) => c.value ? (y(), O(q, {
       key: 0,
       to: e.teleportTo,
       disabled: !i.value
     }, [
-      w(q, {
+      w(F, {
         css: !1,
-        onBeforeEnter: N,
-        onEnter: _,
-        onBeforeLeave: C,
-        onLeave: R,
+        onBeforeEnter: _,
+        onEnter: C,
+        onBeforeLeave: R,
+        onLeave: D,
         onAfterLeave: z
       }, {
         default: g(() => [
-          F(k("div", {
+          G(k("div", {
             ref_key: "backdropRef",
             ref: r,
             class: $([
@@ -133,19 +132,19 @@ const ee = {
               i.value || !e.breakpoint ? "absolute z-40" : ""
             ])
           }, [
-            i.value && s.value ? (y(), G("div", ee, null, 512)) : x("", !0),
+            i.value && s.value ? (y(), H("div", ee, null, 512)) : x("", !0),
             k("div", {
               ref_key: "drawerRef",
               ref: d,
               class: $([
-                n(A),
-                V.value,
+                n(P),
+                N.value,
                 n(b).wrapper
               ]),
-              style: H([T.value, n(D)])
+              style: I([V.value, n(A)])
             }, [
               f(e.$slots, "header"),
-              w(Y, {
+              w(Z, {
                 scrollbar: !1,
                 vertical: "",
                 class: "flex-1"
@@ -158,7 +157,7 @@ const ee = {
               f(e.$slots, "footer")
             ], 6)
           ], 2), [
-            [I, e.breakpoint ? s.value && n(p) || !n(p) : s.value]
+            [J, e.breakpoint ? s.value && n(p) || !n(p) : s.value]
           ])
         ]),
         _: 3
@@ -167,5 +166,5 @@ const ee = {
   }
 });
 export {
-  fe as default
+  pe as default
 };

package/lib/components/drawer/index.d.ts

@@ -1,3 +1,2 @@
 export { default as XDrawer } from './Drawer.vue';
-export type { DrawerProps, DrawerPosition } from './Drawer.vue';
-export type { DrawerTheme } from './Drawer.theme';
+export type { DrawerProps, DrawerPosition, DrawerTheme } from './Drawer.vue';

package/lib/components/drawer/theme/Drawer.base.theme.d.ts

@@ -0,0 +1,3 @@
+import type { DrawerTheme } from '../Drawer.vue';
+declare const theme: DrawerTheme;
+export default theme;

package/lib/components/drawer/theme/Drawer.carbon.theme.d.ts

@@ -0,0 +1,3 @@
+import type { DrawerTheme } from '../Drawer.vue';
+declare const theme: DrawerTheme;
+export default theme;

package/lib/components/drawer/theme/Drawer.carbon.theme.js

@@ -0,0 +1,5 @@
+import e from "./Drawer.base.theme.js";
+const t = e, o = t;
+export {
+  o as default
+};

package/lib/components/form/Form.vue.d.ts

@@ -1,4 +1,5 @@
 import { type PropType, type ExtractPublicPropTypes } from 'vue';
+import { type ThemeComponent } from '../../composables/useTheme';
 declare const formProps: {
     autoValidate: {
         type: BooleanConstructor;
@@ -13,6 +14,12 @@ declare const formProps: {
         type: PropType<[FormError[], FormError]>;
         default: () => never[];
     };
+    title: StringConstructor;
+    description: StringConstructor;
+    hasFooter: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
 };
 export type FormProps = ExtractPublicPropTypes<typeof formProps>;
 export type FormInjection = {
@@ -30,6 +37,9 @@ export type FormInput = {
     validate: (val?: any) => boolean;
     setError: (val: string) => void;
 };
+type InternalClasses = 'wrapper' | 'content' | 'title' | 'description' | 'footer';
+export interface FormTheme extends ThemeComponent<FormProps, InternalClasses> {
+}
 declare const _default: __VLS_WithTemplateSlots<import("vue").DefineComponent<{
     autoValidate: {
         type: BooleanConstructor;
@@ -44,6 +54,12 @@ declare const _default: __VLS_WithTemplateSlots<import("vue").DefineComponent<{
         type: PropType<[FormError[], FormError]>;
         default: () => never[];
     };
+    title: StringConstructor;
+    description: StringConstructor;
+    hasFooter: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
 }, {}, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, "submit"[], "submit", import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<import("vue").ExtractPropTypes<{
     autoValidate: {
         type: BooleanConstructor;
@@ -58,6 +74,12 @@ declare const _default: __VLS_WithTemplateSlots<import("vue").DefineComponent<{
         type: PropType<[FormError[], FormError]>;
         default: () => never[];
     };
+    title: StringConstructor;
+    description: StringConstructor;
+    hasFooter: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
 }>> & {
     onSubmit?: ((...args: any[]) => any) | undefined;
 }, {
@@ -65,8 +87,13 @@ declare const _default: __VLS_WithTemplateSlots<import("vue").DefineComponent<{
     autoFocus: boolean;
     disabled: boolean;
     errors: [FormError[], FormError];
+    hasFooter: boolean;
 }, {}>, {
+    header?(_: {}): any;
     default?(_: {}): any;
+    footer?(_: {}): any;
+    "primary-action"?(_: {}): any;
+    "secondary-action"?(_: {}): any;
 }>;
 export default _default;
 type __VLS_WithTemplateSlots<T, S> = T & {

package/lib/components/form/Form.vue.js

@@ -1,8 +1,10 @@
-import { defineComponent as y, provide as b, onMounted as _, watch as F, nextTick as V, openBlock as g, createElementBlock as E, normalizeStyle as I, unref as r, normalizeClass as v, createElementVNode as B, renderSlot as x } from "vue";
-import { injectFormKey as A } from "../../composables/keys.js";
-import { useTheme as k } from "../../composables/theme.js";
-import S from "./Form.theme.js";
-const j = ["disabled"], w = {
+import { defineComponent as E, provide as I, onMounted as S, watch as $, nextTick as A, openBlock as c, createElementBlock as m, normalizeStyle as C, unref as i, normalizeClass as n, renderSlot as r, toDisplayString as p, createCommentVNode as f, createElementVNode as y } from "vue";
+import { injectFormKey as N } from "../../composables/keys.js";
+import { useTheme as T } from "../../composables/useTheme.js";
+const j = {
+  key: 0,
+  class: "mb-10"
+}, w = ["disabled"], z = {
   autoValidate: {
     type: Boolean,
     default: !0
@@ -15,33 +17,38 @@ const j = ["disabled"], w = {
   errors: {
     type: [Array, Object],
     default: () => []
+  },
+  title: String,
+  description: String,
+  hasFooter: {
+    type: Boolean,
+    default: !0
   }
-}, z = {
-  name: "XForm",
-  inheritAttrs: !1
-}, D = /* @__PURE__ */ y({
-  ...z,
-  props: w,
+}, D = {
+  name: "XForm"
+}, O = /* @__PURE__ */ E({
+  ...D,
+  props: z,
   emits: ["submit"],
-  setup(l, { emit: d }) {
-    const i = l, s = [];
-    b(A, {
-      registerInput: (e, t, o, a) => {
-        const n = s.find((h) => h.name === e);
-        n ? (n.focus = t, n.validate = o, n.setError = a) : s.push({ name: e, focus: t, validate: o, setError: a });
+  setup(h, { emit: b }) {
+    const l = h, F = b, s = [];
+    I(N, {
+      registerInput: (e, t, o, d) => {
+        const u = s.find((B) => B.name === e);
+        u ? (u.focus = t, u.validate = o, u.setError = d) : s.push({ name: e, focus: t, validate: o, setError: d });
       },
       unregisterInput: (e) => {
         const t = s.findIndex((o) => o.name === e);
         s.splice(t, 1);
       },
       isInsideForm: !0
-    }), _(() => {
-      i.autoFocus && s && s.length > 0 && s[0].focus();
-    }), F(() => i.errors, (e) => {
-      e && V(() => {
+    }), S(async () => {
+      l.autoFocus && s && s.length > 0 && setTimeout(s[0].focus, 50);
+    }), $(() => l.errors, (e) => {
+      e && A(() => {
         if (Array.isArray(e))
           e.forEach((t) => {
-            const o = s.find((a) => a.name === t.field);
+            const o = s.find((d) => d.name === t.field);
             o && o.setError(t.msg);
           });
         else {
@@ -50,30 +57,53 @@ const j = ["disabled"], w = {
         }
       });
     });
-    const f = () => {
+    const g = () => {
       let e = !0;
       return s.forEach((t) => {
         !t.validate() && e && (e = !1, t.focus && t.focus());
       }), e;
-    }, u = (e) => {
+    }, V = (e) => {
       e.preventDefault(), e.stopPropagation();
-      const t = i.autoValidate ? f() : !0;
-      d("submit", t);
-    }, { styles: c, classes: m, className: p } = k("form", S, i);
-    return (e, t) => (g(), E("form", {
-      style: I(r(c)),
-      class: v([
-        r(p),
-        r(m).wrapper
+      const t = l.autoValidate ? g() : !0;
+      F("submit", t);
+    }, { styles: k, classes: a, className: v } = T("Form", {}, l);
+    return (e, t) => (c(), m("form", {
+      style: C(i(k)),
+      class: n([
+        i(v),
+        i(a).wrapper
       ]),
-      onSubmit: u
+      onSubmit: V
     }, [
-      B("fieldset", { disabled: e.disabled }, [
-        x(e.$slots, "default")
-      ], 8, j)
+      r(e.$slots, "header", {}, () => [
+        e.title || e.description ? (c(), m("div", j, [
+          e.title ? (c(), m("p", {
+            key: 0,
+            class: n(i(a).title)
+          }, p(e.title), 3)) : f("", !0),
+          e.description ? (c(), m("p", {
+            key: 1,
+            class: n(i(a).description)
+          }, p(e.description), 3)) : f("", !0)
+        ])) : f("", !0)
+      ]),
+      y("fieldset", {
+        disabled: e.disabled,
+        class: n(i(a).content)
+      }, [
+        r(e.$slots, "default")
+      ], 10, w),
+      e.hasFooter ? r(e.$slots, "footer", { key: 0 }, () => [
+        y("div", {
+          class: n(i(a).footer)
+        }, [
+          r(e.$slots, "primary-action"),
+          r(e.$slots, "secondary-action")
+        ], 2)
+      ]) : f("", !0)
     ], 38));
   }
 });
 export {
-  D as default
+  O as default
 };

package/lib/components/form/index.d.ts

@@ -1,3 +1,2 @@
 export { default as XForm } from './Form.vue';
-export type { FormProps, FormError, FormInjection, FormInput } from './Form.vue';
-export type { FormTheme } from './Form.theme';
+export type { FormProps, FormError, FormInjection, FormInput, FormTheme } from './Form.vue';

package/lib/components/form/theme/Form.base.theme.d.ts

@@ -0,0 +1,3 @@
+import type { FormTheme } from '../Form.vue';
+declare const theme: FormTheme;
+export default theme;

package/lib/components/form/theme/Form.base.theme.js

@@ -0,0 +1,12 @@
+const t = {
+  classes: {
+    wrapper: "relative",
+    content: "",
+    title: "text-xl mb-1",
+    description: "text-gray-500",
+    footer: "space-x-4 mt-4"
+  }
+}, e = t;
+export {
+  e as default
+};

package/lib/components/form/theme/Form.carbon.theme.d.ts

@@ -0,0 +1,3 @@
+import type { FormTheme } from '../Form.vue';
+declare const theme: FormTheme;
+export default theme;

package/lib/components/form/theme/Form.carbon.theme.js

@@ -0,0 +1,12 @@
+const t = {
+  classes: {
+    wrapper: "relative",
+    content: "grid",
+    title: "text-xl mb-1",
+    description: "text-gray-500",
+    footer: "grid grid-cols-2 gap-4 lg:flex mt-8"
+  }
+}, e = t;
+export {
+  e as default
+};

package/lib/components/formGroup/FormGroup.vue.d.ts

@@ -0,0 +1,132 @@
+import { type ExtractPublicPropTypes, type MaybeRef } from 'vue';
+import { type ThemeComponent } from '../../composables/useTheme';
+declare const formGroupProps: {
+    vertical: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    modelValue: import("vue").PropType<string | number | boolean | object | any[] | undefined>;
+    id: StringConstructor;
+    name: StringConstructor;
+    readonly: BooleanConstructor;
+    required: BooleanConstructor;
+    validateOnInput: {
+        readonly type: BooleanConstructor;
+        readonly default: true;
+    };
+    label: StringConstructor;
+    helper: StringConstructor;
+    error: StringConstructor;
+    hideFooter: BooleanConstructor;
+    rules: {
+        readonly type: ArrayConstructor;
+        readonly default: () => never[];
+    };
+    disabled: BooleanConstructor;
+    loading: BooleanConstructor;
+    loadingLabel: StringConstructor;
+    loadingStatus: {
+        readonly type: import("vue").PropType<import("../loader/Loader.vue").LoaderStatus>;
+        readonly default: "active";
+    };
+};
+export type FormGroupProps = ExtractPublicPropTypes<typeof formGroupProps>;
+export type FormGroupInjection = {
+    registerInputGroup: (name: string, focus: () => void) => void;
+    unregisterInputGroup: (name: string) => void;
+    setValue: (val: string | number | string[] | number[]) => void;
+    value: MaybeRef<string | number | string[] | number[] | null | undefined>;
+    isInsideFormGroup: boolean;
+};
+export type FormGroupInput = {
+    name: string;
+    focus: () => void;
+};
+type InternalClasses = 'wrapper';
+export interface FormGroupTheme extends ThemeComponent<FormGroupProps, InternalClasses> {
+}
+declare const _default: __VLS_WithTemplateSlots<import("vue").DefineComponent<{
+    vertical: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    modelValue: import("vue").PropType<string | number | boolean | object | any[] | undefined>;
+    id: StringConstructor;
+    name: StringConstructor;
+    readonly: BooleanConstructor;
+    required: BooleanConstructor;
+    validateOnInput: {
+        readonly type: BooleanConstructor;
+        readonly default: true;
+    };
+    label: StringConstructor;
+    helper: StringConstructor;
+    error: StringConstructor;
+    hideFooter: BooleanConstructor;
+    rules: {
+        readonly type: ArrayConstructor;
+        readonly default: () => never[];
+    };
+    disabled: BooleanConstructor;
+    loading: BooleanConstructor;
+    loadingLabel: StringConstructor;
+    loadingStatus: {
+        readonly type: import("vue").PropType<import("../loader/Loader.vue").LoaderStatus>;
+        readonly default: "active";
+    };
+}, {
+    focus: () => void;
+    blur: typeof blur;
+    reset: () => void;
+    validate: (val?: any) => boolean;
+    setError: (val: string) => void;
+}, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, string[], string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<import("vue").ExtractPropTypes<{
+    vertical: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    modelValue: import("vue").PropType<string | number | boolean | object | any[] | undefined>;
+    id: StringConstructor;
+    name: StringConstructor;
+    readonly: BooleanConstructor;
+    required: BooleanConstructor;
+    validateOnInput: {
+        readonly type: BooleanConstructor;
+        readonly default: true;
+    };
+    label: StringConstructor;
+    helper: StringConstructor;
+    error: StringConstructor;
+    hideFooter: BooleanConstructor;
+    rules: {
+        readonly type: ArrayConstructor;
+        readonly default: () => never[];
+    };
+    disabled: BooleanConstructor;
+    loading: BooleanConstructor;
+    loadingLabel: StringConstructor;
+    loadingStatus: {
+        readonly type: import("vue").PropType<import("../loader/Loader.vue").LoaderStatus>;
+        readonly default: "active";
+    };
+}>> & {
+    [x: `on${Capitalize<string>}`]: ((...args: any[]) => any) | undefined;
+}, {
+    disabled: boolean;
+    loading: boolean;
+    loadingStatus: import("../loader/Loader.vue").LoaderStatus;
+    readonly: boolean;
+    required: boolean;
+    validateOnInput: boolean;
+    hideFooter: boolean;
+    rules: unknown[];
+    vertical: boolean;
+}, {}>, {
+    default?(_: {}): any;
+}>;
+export default _default;
+type __VLS_WithTemplateSlots<T, S> = T & {
+    new (): {
+        $slots: S;
+    };
+};

package/lib/components/formGroup/FormGroup.vue.js

@@ -0,0 +1,82 @@
+import { defineComponent as C, computed as k, provide as q, openBlock as m, createBlock as p, mergeProps as B, unref as o, toHandlers as N, withCtx as $, createElementVNode as w, normalizeClass as A, renderSlot as E, createCommentVNode as P } from "vue";
+import { useTheme as j } from "../../composables/useTheme.js";
+import { useInteractive as z } from "../../composables/useInteractive.js";
+import { useInputtable as l } from "../../composables/useInputtable.js";
+import { injectFormGroupKey as H } from "../../composables/keys.js";
+import K from "../label/Label.vue.js";
+import O from "../inputFooter/InputFooter.vue.js";
+const S = {
+  ...z.props(),
+  ...l.props(),
+  vertical: {
+    type: Boolean,
+    default: !1
+  }
+}, T = {
+  name: "XFormGroup"
+}, R = /* @__PURE__ */ C({
+  ...T,
+  props: S,
+  emits: l.emits(),
+  setup(d, { expose: f, emit: c }) {
+    const r = d, s = [], V = k(() => typeof r.modelValue == "string" || typeof r.modelValue == "number" || Array.isArray(r.modelValue) ? r.modelValue : "");
+    q(H, {
+      registerInputGroup: (e, t) => {
+        s.push({ name: e, focus: t });
+      },
+      unregisterInputGroup: (e) => {
+        const t = s.findIndex((g) => g.name === e);
+        s.splice(t, 1);
+      },
+      setValue: (e) => {
+        n("update:modelValue", e);
+      },
+      isInsideFormGroup: !0,
+      value: V
+    });
+    function i() {
+      var e;
+      (e = s[0]) == null || e.focus();
+    }
+    const n = c, {
+      errorInternal: a,
+      isInsideForm: y,
+      isFirstValidation: b,
+      reset: h,
+      validate: u,
+      setError: v
+    } = l(r, { focus: i, emit: n }), I = {
+      change: (e) => {
+        r.validateOnInput && !b.value && u(r.modelValue);
+      }
+    }, { styles: F, classes: G, className: _ } = j("FormGroup", {}, r, { errorInternal: a });
+    return f({ focus: i, blur, reset: h, validate: u, setError: v }), (e, t) => (m(), p(K, B({
+      tag: "fieldset",
+      style: o(F),
+      disabled: e.disabled,
+      required: e.required,
+      "is-inside-form": o(y),
+      label: e.label,
+      class: [
+        o(_)
+      ]
+    }, N(I)), {
+      default: $(() => [
+        w("div", {
+          class: A(o(G).wrapper)
+        }, [
+          E(e.$slots, "default")
+        ], 2),
+        e.hideFooter ? P("", !0) : (m(), p(O, {
+          key: 0,
+          error: o(a),
+          helper: e.helper
+        }, null, 8, ["error", "helper"]))
+      ]),
+      _: 3
+    }, 16, ["style", "disabled", "required", "is-inside-form", "label", "class"]));
+  }
+});
+export {
+  R as default
+};

package/lib/components/formGroup/FormGroup.vue2.js

@@ -0,0 +1,4 @@
+import f from "./FormGroup.vue.js";
+export {
+  f as default
+};

package/lib/components/formGroup/__tests__/FormGroup.spec.d.ts

@@ -0,0 +1 @@
+export {};

package/lib/components/formGroup/index.d.ts

@@ -0,0 +1,2 @@
+export { default as XFormGroup } from './FormGroup.vue';
+export type { FormGroupProps, FormGroupInjection, FormGroupInput, FormGroupTheme } from './FormGroup.vue';

package/lib/components/formGroup/theme/FormGroup.base.theme.d.ts

@@ -0,0 +1,3 @@
+import type { FormGroupTheme } from '../FormGroup.vue';
+declare const theme: FormGroupTheme;
+export default theme;