@charpente-ui/vue 1.1.2 → 1.2.1

package/README.md

@@ -61,7 +61,7 @@ npm install @charpente-ui/vue
 These components are thin wrappers around native elements. They use `v-model` and automatically link with labels via
 `useId()`. Full attribute inheritance.
 
-2. **Selection Logic** _(CCheckbox, CRadio)_
+2. **Selection Logic** _(CCheckbox, CRadio, CSelect)_
 
 Managing checkbox arrays in Vue can be repetitive. **Charpente UI** simplifies this:
 
@@ -70,6 +70,21 @@ Managing checkbox arrays in Vue can be repetitive. **Charpente UI** simplifies t
 <CCheckbox v-model="tags" value="bar"/>
 ```
 
+`CCheckbox` also supports the `indeterminate` state for partial selections:
+
+```vue
+<CCheckbox v-model="allSelected" :indeterminate="someSelected"/>
+```
+
+`CSelect` supports multiple selection via the native `multiple` attribute:
+
+```vue
+<CSelect v-model="selectedItems" multiple>
+    <option value="foo">Foo</option>
+    <option value="bar">Bar</option>
+</CSelect>
+```
+
 3. **Polymorphic Elements** _(CButton)_
 
 The button can change its HTML tag while keeping its behavior.
@@ -84,10 +99,11 @@ The button can change its HTML tag while keeping its behavior.
 | Name     | Core Logic                                                                       | Tag         | Status |
 |----------|----------------------------------------------------------------------------------|-------------|--------|
 | Button   | **Polymorphic:** Switches tags _(a, button, etc...)_ while keeping logic.        | `CButton`   | Ready  |
-| Checkbox | **Smart Toggle:** Handles array state and booleans natively.                     | `CCheckbox` | Ready  |
+| Checkbox | **Smart Toggle:** Handles array state, booleans, and indeterminate natively.     | `CCheckbox` | Ready  |
+| File     | **File Input:** Reactive file selection with `v-model` support.                  | `CFile`     | Ready  |
 | Form     | **Auto-Submit:** Integrated `preventDefault` and event handling.                 | `CForm`     | Ready  |
 | Input    | **Auto-ID:** Auto-links to labels via `useId()` and full attributes inheritance. | `CInput`    | Ready  |
 | Label    | **Context-Aware:** Simple, accessible binding for any input.                     | `CLabel`    | Ready  |
 | Radio    | **Selection:** Minimalist wrapper for native radio input.                        | `CRadio`    | Ready  |
-| Select   | **Native Wrapper:** Easy option management without the boilerplate.              | `CSelect`   | Ready  |
+| Select   | **Native Wrapper:** Single and multiple selection support.                       | `CSelect`   | Ready  |
 | Textarea | **Flexible Binding:** Auto-ID and reactive model management.                     | `CTextarea` | Ready  |

package/dist/charpente.js

@@ -1,54 +1,81 @@
-import { defineComponent as d, openBlock as u, createBlock as V, resolveDynamicComponent as I, normalizeProps as B, guardReactiveProps as C, withCtx as b, renderSlot as $, useModel as f, useAttrs as c, useId as p, computed as _, withDirectives as v, createElementBlock as i, mergeProps as m, vModelCheckbox as M, mergeModels as h, withModifiers as A, vModelDynamic as g, vModelRadio as k, vModelSelect as x, vModelText as y } from "vue";
-const z = /* @__PURE__ */ d({
+import { defineComponent as u, openBlock as d, createBlock as B, resolveDynamicComponent as M, normalizeProps as g, guardReactiveProps as b, withCtx as A, renderSlot as h, useModel as _, useAttrs as c, useId as p, useTemplateRef as V, computed as f, watchEffect as k, withDirectives as $, createElementBlock as i, mergeProps as m, vModelCheckbox as x, mergeModels as C, watch as y, withModifiers as R, vModelDynamic as w, vModelRadio as S, vModelSelect as U, vModelText as F } from "vue";
+const H = /* @__PURE__ */ u({
   inheritAttrs: !1,
   __name: "BaseButton",
   props: {
     as: { default: "button" }
   },
   setup(t) {
-    return (e, o) => (u(), V(I(t.as), B(C(e.$attrs)), {
-      default: b(() => [
-        $(e.$slots, "default")
+    return (e, s) => (d(), B(M(t.as), g(b(e.$attrs)), {
+      default: A(() => [
+        h(e.$slots, "default")
       ]),
       _: 3
     }, 16));
   }
-}), S = ["id", "value"], E = /* @__PURE__ */ d({
+}), T = ["id", "value"], J = /* @__PURE__ */ u({
   inheritAttrs: !1,
   __name: "BaseCheckbox",
-  props: /* @__PURE__ */ h({
-    value: {}
+  props: /* @__PURE__ */ C({
+    value: {},
+    indeterminate: { type: Boolean }
   }, {
     modelValue: { type: [Boolean, Array] },
     modelModifiers: {}
   }),
   emits: ["update:modelValue"],
   setup(t) {
-    const e = f(t, "modelValue"), o = c(), r = p(), l = _(() => o.id || r);
-    return (n, s) => v((u(), i("input", m({ type: "checkbox" }, n.$attrs, {
-      "onUpdate:modelValue": s[0] || (s[0] = (a) => e.value = a),
-      id: l.value,
+    const e = t, s = _(t, "modelValue"), l = c(), r = p(), n = V("input"), a = f(() => l.id || r);
+    return k(() => {
+      n.value && (n.value.indeterminate = !!e.indeterminate);
+    }), (o, v) => $((d(), i("input", m({
+      ref: "input",
+      type: "checkbox"
+    }, o.$attrs, {
+      "onUpdate:modelValue": v[0] || (v[0] = (I) => s.value = I),
+      id: a.value,
       value: t.value
-    }), null, 16, S)), [
-      [M, e.value]
+    }), null, 16, T)), [
+      [x, s.value]
     ]);
   }
-}), U = ["id"], j = /* @__PURE__ */ d({
+}), D = ["id"], K = /* @__PURE__ */ u({
+  inheritAttrs: !1,
+  __name: "BaseFile",
+  props: {
+    modelValue: {},
+    modelModifiers: {}
+  },
+  emits: ["update:modelValue"],
+  setup(t) {
+    const e = _(t, "modelValue"), s = c(), l = p(), r = V("input"), n = f(() => s.id || l);
+    function a(o) {
+      e.value = o.target.files;
+    }
+    return y(e, (o) => {
+      !o && r.value && (r.value.value = "");
+    }), (o, v) => (d(), i("input", m({
+      type: "file",
+      ref: "input"
+    }, o.$attrs, {
+      id: n.value,
+      onChange: a
+    }), null, 16, D));
+  }
+}), P = ["id"], N = /* @__PURE__ */ u({
   inheritAttrs: !1,
   __name: "BaseForm",
   emits: ["submit"],
   setup(t, { emit: e }) {
-    const o = c(), r = p(), l = e, n = (a) => {
-      l("submit", a);
-    }, s = _(() => o.id || r);
-    return (a, F) => (u(), i("form", m(a.$attrs, {
-      id: s.value,
-      onSubmit: A(n, ["prevent"])
+    const s = c(), l = p(), r = e, n = f(() => s.id || l);
+    return (a, o) => (d(), i("form", m(a.$attrs, {
+      id: n.value,
+      onSubmit: o[0] || (o[0] = R((v) => r("submit", v), ["prevent"]))
     }), [
-      $(a.$slots, "default")
-    ], 16, U));
+      h(a.$slots, "default")
+    ], 16, P));
   }
-}), R = ["id"], q = /* @__PURE__ */ d({
+}), E = ["id"], O = /* @__PURE__ */ u({
   inheritAttrs: !1,
   __name: "BaseInput",
   props: {
@@ -57,15 +84,15 @@ const z = /* @__PURE__ */ d({
   },
   emits: ["update:modelValue"],
   setup(t) {
-    const e = f(t, "modelValue"), o = c(), r = p(), l = _(() => o.id || r);
-    return (n, s) => v((u(), i("input", m(n.$attrs, {
-      "onUpdate:modelValue": s[0] || (s[0] = (a) => e.value = a),
-      id: l.value
-    }), null, 16, R)), [
-      [g, e.value]
+    const e = _(t, "modelValue"), s = c(), l = p(), r = f(() => s.id || l);
+    return (n, a) => $((d(), i("input", m(n.$attrs, {
+      "onUpdate:modelValue": a[0] || (a[0] = (o) => e.value = o),
+      id: r.value
+    }), null, 16, E)), [
+      [w, e.value]
     ]);
   }
-}), w = ["for"], G = /* @__PURE__ */ d({
+}), L = ["for"], Q = /* @__PURE__ */ u({
   inheritAttrs: !1,
   __name: "BaseLabel",
   props: {
@@ -73,16 +100,16 @@ const z = /* @__PURE__ */ d({
   },
   setup(t) {
     const e = t;
-    return (o, r) => (u(), i("label", m(o.$attrs, {
+    return (s, l) => (d(), i("label", m(s.$attrs, {
       for: e.for
     }), [
-      $(o.$slots, "default")
-    ], 16, w));
+      h(s.$slots, "default")
+    ], 16, L));
   }
-}), D = ["id", "value"], H = /* @__PURE__ */ d({
+}), z = ["id", "value"], W = /* @__PURE__ */ u({
   inheritAttrs: !1,
   __name: "BaseRadio",
-  props: /* @__PURE__ */ h({
+  props: /* @__PURE__ */ C({
     value: {}
   }, {
     modelValue: {},
@@ -90,16 +117,16 @@ const z = /* @__PURE__ */ d({
   }),
   emits: ["update:modelValue"],
   setup(t) {
-    const e = f(t, "modelValue"), o = c(), r = p(), l = _(() => o.id || r);
-    return (n, s) => v((u(), i("input", m({ type: "radio" }, n.$attrs, {
-      "onUpdate:modelValue": s[0] || (s[0] = (a) => e.value = a),
-      id: l.value,
+    const e = _(t, "modelValue"), s = c(), l = p(), r = f(() => s.id || l);
+    return (n, a) => $((d(), i("input", m({ type: "radio" }, n.$attrs, {
+      "onUpdate:modelValue": a[0] || (a[0] = (o) => e.value = o),
+      id: r.value,
       value: t.value
-    }), null, 16, D)), [
-      [k, e.value]
+    }), null, 16, z)), [
+      [S, e.value]
     ]);
   }
-}), P = ["id"], J = /* @__PURE__ */ d({
+}), j = ["id"], X = /* @__PURE__ */ u({
   inheritAttrs: !1,
   __name: "BaseSelect",
   props: {
@@ -108,17 +135,17 @@ const z = /* @__PURE__ */ d({
   },
   emits: ["update:modelValue"],
   setup(t) {
-    const e = f(t, "modelValue"), o = c(), r = p(), l = _(() => o.id || r);
-    return (n, s) => v((u(), i("select", m(n.$attrs, {
-      "onUpdate:modelValue": s[0] || (s[0] = (a) => e.value = a),
-      id: l.value
+    const e = _(t, "modelValue"), s = c(), l = p(), r = f(() => s.id || l);
+    return (n, a) => $((d(), i("select", m(n.$attrs, {
+      "onUpdate:modelValue": a[0] || (a[0] = (o) => e.value = o),
+      id: r.value
     }), [
-      $(n.$slots, "default")
-    ], 16, P)), [
-      [x, e.value]
+      h(n.$slots, "default")
+    ], 16, j)), [
+      [U, e.value]
     ]);
   }
-}), T = ["id"], K = /* @__PURE__ */ d({
+}), q = ["id"], Y = /* @__PURE__ */ u({
   inheritAttrs: !1,
   __name: "BaseTextarea",
   props: {
@@ -127,22 +154,23 @@ const z = /* @__PURE__ */ d({
   },
   emits: ["update:modelValue"],
   setup(t) {
-    const e = f(t, "modelValue"), o = c(), r = p(), l = _(() => o.id || r);
-    return (n, s) => v((u(), i("textarea", m(n.$attrs, {
-      "onUpdate:modelValue": s[0] || (s[0] = (a) => e.value = a),
-      id: l.value
-    }), null, 16, T)), [
-      [y, e.value]
+    const e = _(t, "modelValue"), s = c(), l = p(), r = f(() => s.id || l);
+    return (n, a) => $((d(), i("textarea", m(n.$attrs, {
+      "onUpdate:modelValue": a[0] || (a[0] = (o) => e.value = o),
+      id: r.value
+    }), null, 16, q)), [
+      [F, e.value]
     ]);
   }
 });
 export {
-  z as CButton,
-  E as CCheckbox,
-  j as CForm,
-  q as CInput,
-  G as CLabel,
-  H as CRadio,
-  J as CSelect,
-  K as CTextarea
+  H as CButton,
+  J as CCheckbox,
+  K as CFile,
+  N as CForm,
+  O as CInput,
+  Q as CLabel,
+  W as CRadio,
+  X as CSelect,
+  Y as CTextarea
 };

package/dist/charpente.umd.cjs

@@ -1 +1 @@
-(function(r,e){typeof exports=="object"&&typeof module<"u"?e(exports,require("vue")):typeof define=="function"&&define.amd?define(["exports","vue"],e):(r=typeof globalThis<"u"?globalThis:r||self,e(r.Charpente={},r.Vue))})(this,(function(r,e){"use strict";const m=e.defineComponent({inheritAttrs:!1,__name:"BaseButton",props:{as:{default:"button"}},setup(o){return(t,s)=>(e.openBlock(),e.createBlock(e.resolveDynamicComponent(o.as),e.normalizeProps(e.guardReactiveProps(t.$attrs)),{default:e.withCtx(()=>[e.renderSlot(t.$slots,"default")]),_:3},16))}}),c=["id","value"],p=e.defineComponent({inheritAttrs:!1,__name:"BaseCheckbox",props:e.mergeModels({value:{}},{modelValue:{type:[Boolean,Array]},modelModifiers:{}}),emits:["update:modelValue"],setup(o){const t=e.useModel(o,"modelValue"),s=e.useAttrs(),d=e.useId(),i=e.computed(()=>s.id||d);return(a,n)=>e.withDirectives((e.openBlock(),e.createElementBlock("input",e.mergeProps({type:"checkbox"},a.$attrs,{"onUpdate:modelValue":n[0]||(n[0]=l=>t.value=l),id:i.value,value:o.value}),null,16,c)),[[e.vModelCheckbox,t.value]])}}),u=["id"],f=e.defineComponent({inheritAttrs:!1,__name:"BaseForm",emits:["submit"],setup(o,{emit:t}){const s=e.useAttrs(),d=e.useId(),i=t,a=l=>{i("submit",l)},n=e.computed(()=>s.id||d);return(l,b)=>(e.openBlock(),e.createElementBlock("form",e.mergeProps(l.$attrs,{id:n.value,onSubmit:e.withModifiers(a,["prevent"])}),[e.renderSlot(l.$slots,"default")],16,u))}}),_=["id"],h=e.defineComponent({inheritAttrs:!1,__name:"BaseInput",props:{modelValue:{},modelModifiers:{}},emits:["update:modelValue"],setup(o){const t=e.useModel(o,"modelValue"),s=e.useAttrs(),d=e.useId(),i=e.computed(()=>s.id||d);return(a,n)=>e.withDirectives((e.openBlock(),e.createElementBlock("input",e.mergeProps(a.$attrs,{"onUpdate:modelValue":n[0]||(n[0]=l=>t.value=l),id:i.value}),null,16,_)),[[e.vModelDynamic,t.value]])}}),B=["for"],$=e.defineComponent({inheritAttrs:!1,__name:"BaseLabel",props:{for:{}},setup(o){const t=o;return(s,d)=>(e.openBlock(),e.createElementBlock("label",e.mergeProps(s.$attrs,{for:t.for}),[e.renderSlot(s.$slots,"default")],16,B))}}),C=["id","value"],k=e.defineComponent({inheritAttrs:!1,__name:"BaseRadio",props:e.mergeModels({value:{}},{modelValue:{},modelModifiers:{}}),emits:["update:modelValue"],setup(o){const t=e.useModel(o,"modelValue"),s=e.useAttrs(),d=e.useId(),i=e.computed(()=>s.id||d);return(a,n)=>e.withDirectives((e.openBlock(),e.createElementBlock("input",e.mergeProps({type:"radio"},a.$attrs,{"onUpdate:modelValue":n[0]||(n[0]=l=>t.value=l),id:i.value,value:o.value}),null,16,C)),[[e.vModelRadio,t.value]])}}),V=["id"],I=e.defineComponent({inheritAttrs:!1,__name:"BaseSelect",props:{modelValue:{},modelModifiers:{}},emits:["update:modelValue"],setup(o){const t=e.useModel(o,"modelValue"),s=e.useAttrs(),d=e.useId(),i=e.computed(()=>s.id||d);return(a,n)=>e.withDirectives((e.openBlock(),e.createElementBlock("select",e.mergeProps(a.$attrs,{"onUpdate:modelValue":n[0]||(n[0]=l=>t.value=l),id:i.value}),[e.renderSlot(a.$slots,"default")],16,V)),[[e.vModelSelect,t.value]])}}),M=["id"],g=e.defineComponent({inheritAttrs:!1,__name:"BaseTextarea",props:{modelValue:{},modelModifiers:{}},emits:["update:modelValue"],setup(o){const t=e.useModel(o,"modelValue"),s=e.useAttrs(),d=e.useId(),i=e.computed(()=>s.id||d);return(a,n)=>e.withDirectives((e.openBlock(),e.createElementBlock("textarea",e.mergeProps(a.$attrs,{"onUpdate:modelValue":n[0]||(n[0]=l=>t.value=l),id:i.value}),null,16,M)),[[e.vModelText,t.value]])}});r.CButton=m,r.CCheckbox=p,r.CForm=f,r.CInput=h,r.CLabel=$,r.CRadio=k,r.CSelect=I,r.CTextarea=g,Object.defineProperty(r,Symbol.toStringTag,{value:"Module"})}));
+(function(r,e){typeof exports=="object"&&typeof module<"u"?e(exports,require("vue")):typeof define=="function"&&define.amd?define(["exports","vue"],e):(r=typeof globalThis<"u"?globalThis:r||self,e(r.Charpente={},r.Vue))})(this,(function(r,e){"use strict";const c=e.defineComponent({inheritAttrs:!1,__name:"BaseButton",props:{as:{default:"button"}},setup(o){return(t,n)=>(e.openBlock(),e.createBlock(e.resolveDynamicComponent(o.as),e.normalizeProps(e.guardReactiveProps(t.$attrs)),{default:e.withCtx(()=>[e.renderSlot(t.$slots,"default")]),_:3},16))}}),p=["id","value"],u=e.defineComponent({inheritAttrs:!1,__name:"BaseCheckbox",props:e.mergeModels({value:{},indeterminate:{type:Boolean}},{modelValue:{type:[Boolean,Array]},modelModifiers:{}}),emits:["update:modelValue"],setup(o){const t=o,n=e.useModel(o,"modelValue"),d=e.useAttrs(),i=e.useId(),a=e.useTemplateRef("input"),s=e.computed(()=>d.id||i);return e.watchEffect(()=>{a.value&&(a.value.indeterminate=!!t.indeterminate)}),(l,m)=>e.withDirectives((e.openBlock(),e.createElementBlock("input",e.mergeProps({ref:"input",type:"checkbox"},l.$attrs,{"onUpdate:modelValue":m[0]||(m[0]=P=>n.value=P),id:s.value,value:o.value}),null,16,p)),[[e.vModelCheckbox,n.value]])}}),f=["id"],_=e.defineComponent({inheritAttrs:!1,__name:"BaseFile",props:{modelValue:{},modelModifiers:{}},emits:["update:modelValue"],setup(o){const t=e.useModel(o,"modelValue"),n=e.useAttrs(),d=e.useId(),i=e.useTemplateRef("input"),a=e.computed(()=>n.id||d);function s(l){t.value=l.target.files}return e.watch(t,l=>{!l&&i.value&&(i.value.value="")}),(l,m)=>(e.openBlock(),e.createElementBlock("input",e.mergeProps({type:"file",ref:"input"},l.$attrs,{id:a.value,onChange:s}),null,16,f))}}),h=["id"],B=e.defineComponent({inheritAttrs:!1,__name:"BaseForm",emits:["submit"],setup(o,{emit:t}){const n=e.useAttrs(),d=e.useId(),i=t,a=e.computed(()=>n.id||d);return(s,l)=>(e.openBlock(),e.createElementBlock("form",e.mergeProps(s.$attrs,{id:a.value,onSubmit:l[0]||(l[0]=e.withModifiers(m=>i("submit",m),["prevent"]))}),[e.renderSlot(s.$slots,"default")],16,h))}}),$=["id"],C=e.defineComponent({inheritAttrs:!1,__name:"BaseInput",props:{modelValue:{},modelModifiers:{}},emits:["update:modelValue"],setup(o){const t=e.useModel(o,"modelValue"),n=e.useAttrs(),d=e.useId(),i=e.computed(()=>n.id||d);return(a,s)=>e.withDirectives((e.openBlock(),e.createElementBlock("input",e.mergeProps(a.$attrs,{"onUpdate:modelValue":s[0]||(s[0]=l=>t.value=l),id:i.value}),null,16,$)),[[e.vModelDynamic,t.value]])}}),V=["for"],k=e.defineComponent({inheritAttrs:!1,__name:"BaseLabel",props:{for:{}},setup(o){const t=o;return(n,d)=>(e.openBlock(),e.createElementBlock("label",e.mergeProps(n.$attrs,{for:t.for}),[e.renderSlot(n.$slots,"default")],16,V))}}),I=["id","value"],g=e.defineComponent({inheritAttrs:!1,__name:"BaseRadio",props:e.mergeModels({value:{}},{modelValue:{},modelModifiers:{}}),emits:["update:modelValue"],setup(o){const t=e.useModel(o,"modelValue"),n=e.useAttrs(),d=e.useId(),i=e.computed(()=>n.id||d);return(a,s)=>e.withDirectives((e.openBlock(),e.createElementBlock("input",e.mergeProps({type:"radio"},a.$attrs,{"onUpdate:modelValue":s[0]||(s[0]=l=>t.value=l),id:i.value,value:o.value}),null,16,I)),[[e.vModelRadio,t.value]])}}),M=["id"],A=e.defineComponent({inheritAttrs:!1,__name:"BaseSelect",props:{modelValue:{},modelModifiers:{}},emits:["update:modelValue"],setup(o){const t=e.useModel(o,"modelValue"),n=e.useAttrs(),d=e.useId(),i=e.computed(()=>n.id||d);return(a,s)=>e.withDirectives((e.openBlock(),e.createElementBlock("select",e.mergeProps(a.$attrs,{"onUpdate:modelValue":s[0]||(s[0]=l=>t.value=l),id:i.value}),[e.renderSlot(a.$slots,"default")],16,M)),[[e.vModelSelect,t.value]])}}),b=["id"],y=e.defineComponent({inheritAttrs:!1,__name:"BaseTextarea",props:{modelValue:{},modelModifiers:{}},emits:["update:modelValue"],setup(o){const t=e.useModel(o,"modelValue"),n=e.useAttrs(),d=e.useId(),i=e.computed(()=>n.id||d);return(a,s)=>e.withDirectives((e.openBlock(),e.createElementBlock("textarea",e.mergeProps(a.$attrs,{"onUpdate:modelValue":s[0]||(s[0]=l=>t.value=l),id:i.value}),null,16,b)),[[e.vModelText,t.value]])}});r.CButton=c,r.CCheckbox=u,r.CFile=_,r.CForm=B,r.CInput=C,r.CLabel=k,r.CRadio=g,r.CSelect=A,r.CTextarea=y,Object.defineProperty(r,Symbol.toStringTag,{value:"Module"})}));

package/dist/components/BaseButton.d.ts

@@ -1,6 +1,6 @@
 import { Component } from 'vue';
 type __VLS_Props = {
-    as?: Component;
+    as?: Component | string;
 };
 declare function __VLS_template(): {
     attrs: Partial<{}>;
@@ -12,7 +12,7 @@ declare function __VLS_template(): {
 };
 type __VLS_TemplateResult = ReturnType<typeof __VLS_template>;
 declare const __VLS_component: import('vue').DefineComponent<__VLS_Props, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<__VLS_Props> & Readonly<{}>, {
-    as: Component;
+    as: Component | string;
 }, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {}, any>;
 declare const _default: __VLS_WithTemplateSlots<typeof __VLS_component, __VLS_TemplateResult["slots"]>;
 export default _default;

package/dist/components/BaseCheckbox.d.ts

@@ -1,5 +1,6 @@
 type __VLS_Props = {
     value?: string | number;
+    indeterminate?: boolean;
 };
 type __VLS_PublicProps = {
     modelValue?: boolean | (string | number)[];
@@ -8,5 +9,7 @@ declare const _default: import('vue').DefineComponent<__VLS_PublicProps, {}, {},
     "update:modelValue": (value: boolean | (string | number)[]) => any;
 }, string, import('vue').PublicProps, Readonly<__VLS_PublicProps> & Readonly<{
     "onUpdate:modelValue"?: ((value: boolean | (string | number)[]) => any) | undefined;
-}>, {}, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {}, any>;
+}>, {}, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {
+    input: HTMLInputElement;
+}, any>;
 export default _default;

package/dist/components/BaseFile.d.ts

@@ -0,0 +1,11 @@
+type __VLS_PublicProps = {
+    modelValue?: FileList | null;
+};
+declare const _default: import('vue').DefineComponent<__VLS_PublicProps, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {
+    "update:modelValue": (value: FileList | null) => any;
+}, string, import('vue').PublicProps, Readonly<__VLS_PublicProps> & Readonly<{
+    "onUpdate:modelValue"?: ((value: FileList | null) => any) | undefined;
+}>, {}, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {
+    input: HTMLInputElement;
+}, any>;
+export default _default;

package/dist/components/BaseForm.d.ts

@@ -7,7 +7,7 @@ declare function __VLS_template(): {
     rootEl: any;
 };
 type __VLS_TemplateResult = ReturnType<typeof __VLS_template>;
-declare const __VLS_component: import('vue').DefineComponent<{}, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {} & {
+declare const __VLS_component: import('vue').DefineComponent<{}, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {
     submit: (event: Event) => any;
 }, string, import('vue').PublicProps, Readonly<{}> & Readonly<{
     onSubmit?: ((event: Event) => any) | undefined;

package/dist/components/BaseSelect.d.ts

@@ -1,5 +1,5 @@
 type __VLS_PublicProps = {
-    modelValue?: string | number;
+    modelValue?: string | number | (string | number)[];
 };
 declare function __VLS_template(): {
     attrs: Partial<{}>;
@@ -11,9 +11,9 @@ declare function __VLS_template(): {
 };
 type __VLS_TemplateResult = ReturnType<typeof __VLS_template>;
 declare const __VLS_component: import('vue').DefineComponent<__VLS_PublicProps, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {
-    "update:modelValue": (value: string | number) => any;
+    "update:modelValue": (value: string | number | (string | number)[]) => any;
 }, string, import('vue').PublicProps, Readonly<__VLS_PublicProps> & Readonly<{
-    "onUpdate:modelValue"?: ((value: string | number) => any) | undefined;
+    "onUpdate:modelValue"?: ((value: string | number | (string | number)[]) => any) | undefined;
 }>, {}, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {}, any>;
 declare const _default: __VLS_WithTemplateSlots<typeof __VLS_component, __VLS_TemplateResult["slots"]>;
 export default _default;

package/dist/components/__tests__/BaseFile.spec.d.ts

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

package/dist/index.d.ts

@@ -1,5 +1,6 @@
 export { default as CButton } from './components/BaseButton';
 export { default as CCheckbox } from './components/BaseCheckbox';
+export { default as CFile } from './components/BaseFile';
 export { default as CForm } from './components/BaseForm';
 export { default as CInput } from './components/BaseInput';
 export { default as CLabel } from './components/BaseLabel';

package/package.json

@@ -1,6 +1,6 @@
 {
     "name": "@charpente-ui/vue",
-    "version": "1.1.2",
+    "version": "1.2.1",
     "description": "Charpente UI is a headless CSS Vue component library.",
     "type": "module",
     "scripts": {