@witchcraft/ui 0.2.1-beta.3 → 0.2.2

package/dist/runtime/components/LibDarkModeSwitcher/LibDarkModeSwitcher.vue

@@ -20,7 +20,10 @@
 			<component :is="darkModeState === 'dark' ? IFaSolidMoon : darkModeState === 'light' ? IPhSunBold : IFa6SolidCircleHalfStroke"/>
 		</icon>
 	</template>
-	<template #default v-if="showLabel">
+	<template
+		#default
+		v-if="showLabel"
+	>
 		<div class="dark-mode-switcher--label pr-[2px]">
 			{{ t(`dark-mode-switcher.${darkModeState}`) }}
 		</div>
@@ -58,6 +61,6 @@ onMounted(() => {
 
 <script>
 export default {
-  name: "lib-dark-mode-switcher"
+  name: "LibDarkModeSwitcher"
 };
 </script>

package/dist/runtime/components/LibDarkModeSwitcher/LibDarkModeSwitcher.vue.d.ts

@@ -1,6 +1,6 @@
 import { type ButtonHTMLAttributes } from "vue";
 import type { TailwindClassProp } from "../shared/props.js.js";
-declare const _default: import("vue").DefineComponent<Props, void, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {} & {
+declare const _default: import("vue").DefineComponent<Props, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {} & {
     "update:darkMode": (value: boolean) => any;
     "update:darkModeState": (value: "system" | "dark" | "light") => any;
 }, string, import("vue").PublicProps, Readonly<Props> & Readonly<{

package/dist/runtime/components/LibDatePicker/LibDatePicker.d.vue.ts

@@ -0,0 +1,40 @@
+import type { RangeDate, SingleDate } from "../../types/index.js.js";
+type __VLS_Props = {
+    showTime?: boolean;
+    id?: string;
+    /** The fallback suggested date when the modelValue is undefined (it will not update modelValue, it only serves as a suggestions and is used internally in the temporary value). If ignoring the time element, you should probably use the {@link createNoonTodayUtc} function (`createNonTodayUtc().toDate(())`) in the helpers, otherwise `new Date()` (the default) will do. */
+    fallbackDate?: Date;
+    /** The local user's timezone, defaults to @internationalized/date's getLocalTimeZone(). */
+    timeZone?: string;
+};
+type __VLS_PublicProps = __VLS_Props & {
+    /**
+     * modelValue can be undefined or an object with start/end undefined, but it must be passed, otherwise we can't tell the difference between a single date and a range date.
+     *
+     * In the case of an undefined date, the current date at NOON UTC will be used to avoid the date changing.
+     *
+     * The @internationalized/date library's fromDate function is used internally to convert the date given (should be UTC) to the local time zone. It's converted back via it's toDate function.
+     */
+    modelValue: SingleDate | RangeDate;
+};
+declare var __VLS_8: any;
+type __VLS_Slots = {} & {
+    default?: (props: typeof __VLS_8) => any;
+};
+declare const __VLS_component: import("vue").DefineComponent<__VLS_PublicProps, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
+    "update:modelValue": (value: SingleDate | RangeDate) => any;
+}, string, import("vue").PublicProps, Readonly<__VLS_PublicProps> & Readonly<{
+    "onUpdate:modelValue"?: ((value: SingleDate | RangeDate) => any) | undefined;
+}>, {
+    id: string;
+    fallbackDate: Date;
+    timeZone: string;
+    showTime: boolean;
+}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
+declare const _default: __VLS_WithSlots<typeof __VLS_component, __VLS_Slots>;
+export default _default;
+type __VLS_WithSlots<T, S> = T & {
+    new (): {
+        $slots: S;
+    };
+};

package/dist/runtime/components/LibDatePicker/LibDatePicker.vue.d.ts

@@ -21,7 +21,7 @@ declare var __VLS_8: any;
 type __VLS_Slots = {} & {
     default?: (props: typeof __VLS_8) => any;
 };
-declare const __VLS_component: import("vue").DefineComponent<__VLS_PublicProps, void, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
+declare const __VLS_component: import("vue").DefineComponent<__VLS_PublicProps, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
     "update:modelValue": (value: SingleDate | RangeDate) => any;
 }, string, import("vue").PublicProps, Readonly<__VLS_PublicProps> & Readonly<{
     "onUpdate:modelValue"?: ((value: SingleDate | RangeDate) => any) | undefined;

package/dist/runtime/components/LibDatePicker/LibRangeDatePicker.d.vue.ts

@@ -0,0 +1,34 @@
+import type { RangeDate } from "../../types/index.js.js";
+type __VLS_Props = {
+    useTime?: boolean;
+    id: string;
+    fallbackDate?: Date;
+    timeZone?: string;
+    updateInterval?: number;
+};
+type __VLS_PublicProps = __VLS_Props & {
+    modelValue: RangeDate;
+};
+declare var __VLS_167: {
+    tempValue: any;
+};
+type __VLS_Slots = {} & {
+    default?: (props: typeof __VLS_167) => any;
+};
+declare const __VLS_component: import("vue").DefineComponent<__VLS_PublicProps, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
+    "update:modelValue": (value: RangeDate) => any;
+}, string, import("vue").PublicProps, Readonly<__VLS_PublicProps> & Readonly<{
+    "onUpdate:modelValue"?: ((value: RangeDate) => any) | undefined;
+}>, {
+    fallbackDate: Date;
+    timeZone: string;
+    useTime: boolean;
+    updateInterval: number;
+}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
+declare const _default: __VLS_WithSlots<typeof __VLS_component, __VLS_Slots>;
+export default _default;
+type __VLS_WithSlots<T, S> = T & {
+    new (): {
+        $slots: S;
+    };
+};

package/dist/runtime/components/LibDatePicker/LibRangeDatePicker.vue

@@ -1,5 +1,5 @@
 <script setup>
-import { CalendarDate, getLocalTimeZone, ZonedDateTime } from "@internationalized/date";
+import { getLocalTimeZone } from "@internationalized/date";
 import { DateRangePickerArrow, DateRangePickerCalendar, DateRangePickerCell, DateRangePickerCellTrigger, DateRangePickerContent, DateRangePickerField, DateRangePickerGrid, DateRangePickerGridBody, DateRangePickerGridHead, DateRangePickerGridRow, DateRangePickerHeadCell, DateRangePickerHeader, DateRangePickerHeading, DateRangePickerInput, DateRangePickerNext, DateRangePickerPrev, DateRangePickerRoot, DateRangePickerTrigger } from "reka-ui";
 import { onBeforeUnmount, ref, toRaw, useAttrs, watch } from "vue";
 import { convertDateWithFallback, getNow, toEmittableDate } from "./helpers.js";
@@ -76,7 +76,8 @@ const locale = useInjectedLocale().timeLocale;
 		`, attrs.class)"
 	>
 		<div class="date-range-picker--segments-input flex items-center flex-1 overflow-scroll scrollbar-hidden whitespace-nowrap">
-			<div :class="twMerge(`
+			<div
+				:class="twMerge(`
 				date-range-picker--start-segment
 				flex
 				items-center
@@ -123,7 +124,8 @@ const locale = useInjectedLocale().timeLocale;
 			<div class="date-range-picker--range-separator text-center px-1">
 				–
 			</div>
-			<div :class="twMerge(`
+			<div
+				:class="twMerge(`
 				date-range-picker--end-segment
 				flex
 				items-center
@@ -189,13 +191,12 @@ const locale = useInjectedLocale().timeLocale;
 	</DateRangePickerField>
 
 	<!-- side=bottom makes months easier to click through -->
-	<!-- @vue-expect-error to exists-->
 	<DateRangePickerContent
 		:side-offset="4"
 		:avoid-collisions="true"
 		:prioritize-position="true"
 		side="bottom"
-		to="#root"
+		:portal="{ to: '#root' }"
 		class="
 			date-range-picker--content
 			z-100
@@ -313,7 +314,8 @@ const locale = useInjectedLocale().timeLocale;
 					:key="month.value.toString()"
 				>
 					<DateRangePickerGridHead class="date-range-picker--grid-head">
-						<DateRangePickerGridRow class="
+						<DateRangePickerGridRow
+							class="
 							date-range-picker--grid-row
 							mb-1
 							flex

package/dist/runtime/components/LibDatePicker/LibRangeDatePicker.vue.d.ts

@@ -15,7 +15,7 @@ declare var __VLS_167: {
 type __VLS_Slots = {} & {
     default?: (props: typeof __VLS_167) => any;
 };
-declare const __VLS_component: import("vue").DefineComponent<__VLS_PublicProps, void, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
+declare const __VLS_component: import("vue").DefineComponent<__VLS_PublicProps, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
     "update:modelValue": (value: RangeDate) => any;
 }, string, import("vue").PublicProps, Readonly<__VLS_PublicProps> & Readonly<{
     "onUpdate:modelValue"?: ((value: RangeDate) => any) | undefined;

package/dist/runtime/components/LibDatePicker/LibSingleDatePicker.d.vue.ts

@@ -0,0 +1,34 @@
+import type { SingleDate } from "../../types/index.js.js";
+type __VLS_Props = {
+    useTime?: boolean;
+    id: string;
+    fallbackDate?: Date;
+    timeZone?: string;
+    updateInterval?: number;
+};
+type __VLS_PublicProps = __VLS_Props & {
+    modelValue: SingleDate;
+};
+declare var __VLS_157: {
+    tempValue: any;
+};
+type __VLS_Slots = {} & {
+    default?: (props: typeof __VLS_157) => any;
+};
+declare const __VLS_component: import("vue").DefineComponent<__VLS_PublicProps, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
+    "update:modelValue": (value: SingleDate) => any;
+}, string, import("vue").PublicProps, Readonly<__VLS_PublicProps> & Readonly<{
+    "onUpdate:modelValue"?: ((value: SingleDate) => any) | undefined;
+}>, {
+    fallbackDate: Date;
+    timeZone: string;
+    useTime: boolean;
+    updateInterval: number;
+}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
+declare const _default: __VLS_WithSlots<typeof __VLS_component, __VLS_Slots>;
+export default _default;
+type __VLS_WithSlots<T, S> = T & {
+    new (): {
+        $slots: S;
+    };
+};

package/dist/runtime/components/LibDatePicker/LibSingleDatePicker.vue

@@ -74,7 +74,8 @@ onBeforeUnmount(() => {
   )
 "
 	>
-		<div :class="twMerge(`
+		<div
+			:class="twMerge(`
 			date-picker--segment
 			flex
 			items-center
@@ -139,13 +140,12 @@ onBeforeUnmount(() => {
 			</Icon>
 		</DatePickerTrigger>
 	</DatePickerField>
-	<!-- @vue-expect-error to exists-->
 	<DatePickerContent
 		:side-offset="4"
 		:avoid-collisions="true"
 		:prioritize-position="true"
 		side="bottom"
-		to="#root"
+		:portal="{ to: '#root' }"
 		class="
 			date-picker--content
 			z-100
@@ -178,7 +178,8 @@ onBeforeUnmount(() => {
 				max-w-[calc(1.2em*4+var(--spacing)*8+14ch)]
 			"
 		>
-			<DatePickerHeader class="
+			<DatePickerHeader
+				class="
 				date-picker--header
 				flex
 				items-center
@@ -276,7 +277,8 @@ onBeforeUnmount(() => {
 					:key="month.value.toString()"
 				>
 					<DatePickerGridHead class="date-picker--grid-head">
-						<DatePickerGridRow class="
+						<DatePickerGridRow
+							class="
 							date-picker--grid-row
 							mb-1
 							flex

package/dist/runtime/components/LibDatePicker/LibSingleDatePicker.vue.d.ts

@@ -15,7 +15,7 @@ declare var __VLS_157: {
 type __VLS_Slots = {} & {
     default?: (props: typeof __VLS_157) => any;
 };
-declare const __VLS_component: import("vue").DefineComponent<__VLS_PublicProps, void, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
+declare const __VLS_component: import("vue").DefineComponent<__VLS_PublicProps, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
     "update:modelValue": (value: SingleDate) => any;
 }, string, import("vue").PublicProps, Readonly<__VLS_PublicProps> & Readonly<{
     "onUpdate:modelValue"?: ((value: SingleDate) => any) | undefined;

package/dist/runtime/components/LibDatePicker/LibTimeZonePicker.d.vue.ts

@@ -0,0 +1,22 @@
+type __VLS_PublicProps = {
+    modelValue?: string;
+    "label"?: string;
+};
+declare var __VLS_7: {};
+type __VLS_Slots = {} & {
+    default?: (props: typeof __VLS_7) => any;
+};
+declare const __VLS_component: import("vue").DefineComponent<__VLS_PublicProps, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
+    "update:modelValue": (value: string) => any;
+    "update:label": (value: string) => any;
+}, string, import("vue").PublicProps, Readonly<__VLS_PublicProps> & Readonly<{
+    "onUpdate:modelValue"?: ((value: string) => any) | undefined;
+    "onUpdate:label"?: ((value: string) => any) | undefined;
+}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
+declare const _default: __VLS_WithSlots<typeof __VLS_component, __VLS_Slots>;
+export default _default;
+type __VLS_WithSlots<T, S> = T & {
+    new (): {
+        $slots: S;
+    };
+};

package/dist/runtime/components/LibDatePicker/LibTimeZonePicker.vue.d.ts

@@ -6,7 +6,7 @@ declare var __VLS_7: {};
 type __VLS_Slots = {} & {
     default?: (props: typeof __VLS_7) => any;
 };
-declare const __VLS_component: import("vue").DefineComponent<__VLS_PublicProps, void, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
+declare const __VLS_component: import("vue").DefineComponent<__VLS_PublicProps, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
     "update:modelValue": (value: string) => any;
     "update:label": (value: string) => any;
 }, string, import("vue").PublicProps, Readonly<__VLS_PublicProps> & Readonly<{

package/dist/runtime/components/LibDebug/LibDebug.d.vue.ts

@@ -0,0 +1,32 @@
+/**
+ * Simple debug component for displaying objects and strings with whitespace.
+ *
+ * In the case of objects, it JSON.stringifies them with a tab character. The tab width can be controlled with the `tab` prop, which will set the `tab-size` css property on the element.
+ *
+ * The value can be undefined, it will just display undefined.
+ */
+declare const _default: __VLS_WithSlots<import("vue").DefineComponent<{
+    /** The value to debug, can be anything. */
+    value?: any;
+    /** Sets the tab size in css. Defaults to 3. */
+    tab?: number;
+    title?: string;
+}, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<{
+    /** The value to debug, can be anything. */
+    value?: any;
+    /** Sets the tab size in css. Defaults to 3. */
+    tab?: number;
+    title?: string;
+}> & Readonly<{}>, {
+    value: any;
+    title: string;
+    tab: number;
+}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>, {
+    default?: (props: {}) => any;
+}>;
+export default _default;
+type __VLS_WithSlots<T, S> = T & {
+    new (): {
+        $slots: S;
+    };
+};

package/dist/runtime/components/LibDebug/LibDebug.vue

@@ -1,5 +1,6 @@
 <template>
-<div class="debug--wrapper
+<div
+	class="debug--wrapper
 		text-fg
 		dark:text-bg
 		flex
@@ -13,11 +14,15 @@
 >
 	<div class="debug--header flex justify-between">
 		<span class="debug--title font-bold">{{ title }}</span>
-		<LibButton class="debug--copy-button w-min-content" @click="copy()">
+		<LibButton
+			class="debug--copy-button w-min-content"
+			@click="copy()"
+		>
 			<icon><i-fa6-regular-copy/></icon>
 		</LibButton>
 	</div>
-	<pre v-if="value"
+	<pre
+		v-if="value"
 		:class="
   `
 			debug--value
@@ -68,7 +73,7 @@ const copy = () => {
 
 <script>
 export default {
-  name: "lib-debug"
+  name: "LibDebug"
   // https://v3.vuejs.org/guide/typescript-support.html#annotating-props
 };
 </script>

package/dist/runtime/components/LibDebug/LibDebug.vue.d.ts

@@ -11,7 +11,7 @@ declare const _default: __VLS_WithSlots<import("vue").DefineComponent<{
     /** Sets the tab size in css. Defaults to 3. */
     tab?: number;
     title?: string;
-}, void, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<{
+}, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<{
     /** The value to debug, can be anything. */
     value?: any;
     /** Sets the tab size in css. Defaults to 3. */

package/dist/runtime/components/LibDevOnly/LibDevOnly.d.vue.ts

@@ -0,0 +1,25 @@
+export interface Props {
+    show?: boolean;
+}
+declare module "vue" {
+    interface GlobalComponents {
+        DevOnly: any;
+    }
+}
+declare const _default: __VLS_WithSlots<import("vue").DefineComponent<{
+    show?: boolean;
+}, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<{
+    show?: boolean;
+}> & Readonly<{}>, {
+    show: boolean;
+}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>, {
+    default?: (props: {}) => any;
+} & {
+    default?: (props: {}) => any;
+}>;
+export default _default;
+type __VLS_WithSlots<T, S> = T & {
+    new (): {
+        $slots: S;
+    };
+};

package/dist/runtime/components/LibDevOnly/LibDevOnly.vue

@@ -1,7 +1,8 @@
 <template>
 <DevOnly>
 	<slot v-if="doShow && $attrs?.['as-child'] !== void 0"/>
-	<div v-else-if="doShow"
+	<div
+		v-else-if="doShow"
 		:class="twMerge(
   `
 			dev-only

package/dist/runtime/components/LibDevOnly/LibDevOnly.vue.d.ts

@@ -1,3 +1,6 @@
+export interface Props {
+    show?: boolean;
+}
 declare module "vue" {
     interface GlobalComponents {
         DevOnly: any;
@@ -5,7 +8,7 @@ declare module "vue" {
 }
 declare const _default: __VLS_WithSlots<import("vue").DefineComponent<{
     show?: boolean;
-}, void, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<{
+}, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<{
     show?: boolean;
 }> & Readonly<{}>, {
     show: boolean;

package/dist/runtime/components/LibFileInput/LibFileInput.d.vue.ts

@@ -0,0 +1,43 @@
+import { type HTMLAttributes, type InputHTMLAttributes } from "vue";
+import type { FileInputError } from "../../types/index.js.js";
+import { type LinkableByIdProps, type TailwindClassProp, type WrapperProps } from "../shared/props.js.js";
+declare const _default: __VLS_WithSlots<import("vue").DefineComponent<Props, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {} & {
+    input: (val: File[]) => any;
+    errors: (val: FileInputError[]) => any;
+}, string, import("vue").PublicProps, Readonly<Props> & Readonly<{
+    onInput?: ((val: File[]) => any) | undefined;
+    onErrors?: ((val: FileInputError[]) => any) | undefined;
+}>, {
+    multiple: boolean;
+    formats: string[];
+    compact: boolean;
+}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>, {
+    icon?: (props: {}) => any;
+} & {
+    label?: (props: {}) => any;
+} & {
+    formats?: (props: {}) => any;
+}>;
+export default _default;
+type WrapperTypes = WrapperProps<"input", InputHTMLAttributes> & WrapperProps<"wrapper", HTMLAttributes> & WrapperProps<"previews", HTMLAttributes>;
+type RealProps = LinkableByIdProps & {
+    multiple?: boolean;
+    /**
+     * A list of extensions or mime types to add to the input's accept. Basic validations are done so that files match an extension and mimeType, but note that a file could still be lying, all files should be validated server side.
+     *
+     * Pass an empty array to allow any filetype.
+     */
+    formats?: string[];
+    compact?: boolean;
+};
+interface Props extends 
+/** @vue-ignore */
+Partial<Omit<InputHTMLAttributes, "class" | "multiple" | "formats" | "compact"> & TailwindClassProp>, 
+/** @vue-ignore */
+Partial<WrapperTypes>, RealProps {
+}
+type __VLS_WithSlots<T, S> = T & {
+    new (): {
+        $slots: S;
+    };
+};

package/dist/runtime/components/LibFileInput/LibFileInput.vue

@@ -1,6 +1,7 @@
 <template>
 <!-- todo aria errors -->
-<div :class="twMerge(
+<div
+	:class="twMerge(
   `file-input
 		justify-center
 		border-2
@@ -16,7 +17,8 @@
 )"
 	v-bind="{ ...$.wrapperAttrs, class: void 0 }"
 >
-	<div :class="twMerge(
+	<div
+		:class="twMerge(
   `
 		file-input--wrapper
 		relative justify-center`,
@@ -37,7 +39,10 @@
 				whitespace-nowrap
 			`)"
 		>
-			<slot v-if="compact || multiple || files.length === 0" name="icon">
+			<slot
+				v-if="compact || multiple || files.length === 0"
+				name="icon"
+			>
 				<icon><i-fa6-solid-arrow-up-from-bracket/></icon>
 			</slot>
 			<slot name="label">
@@ -52,7 +57,10 @@
 				{{ ` (${files.length})` }}
 			</span>
 		</label>
-		<label v-if="!compact && formats?.length > 0" class="file-input--formats-label flex flex-col items-center text-sm">
+		<label
+			v-if="!compact && formats?.length > 0"
+			class="file-input--formats-label flex flex-col items-center text-sm"
+		>
 			<slot name="formats">{{ t("file-input.accepted-formats") }}: </slot>
 			<div class="file-input--formats-list">
 				{{ extensions.join(", ") }}
@@ -82,7 +90,8 @@
 		>
 		<!--  click event allows event to fire even if the user picks the same file -->
 	</div>
-	<div v-if="!compact && files.length > 0"
+	<div
+		v-if="!compact && files.length > 0"
 		:class="twMerge(
   `file-input--previews
 			flex items-stretch justify-center gap-2 flex-wrap
@@ -94,7 +103,8 @@
 )"
 	>
 		<div class="file-input--preview-spacer flex-1"/>
-		<div class="file-input--preview-wrapper
+		<div
+			class="file-input--preview-wrapper
 				z-1
 				relative
 				flex
@@ -121,16 +131,21 @@
 			</div>
 
 			<div class="file-input--preview flex flex-initial basis-full justify-center">
-				<div v-if="entry.isImg"
+				<div
+					v-if="entry.isImg"
 					class="file-input--preview-image
 					bg-transparency-squares flex
 					h-[80px]   flex-wrap items-center
 					justify-center
 				"
 				>
-					<img class="max-h-full w-auto" :src="getSrc(entry.file)">
+					<img
+						class="max-h-full w-auto"
+						:src="getSrc(entry.file)"
+					>
 				</div>
-				<div v-if="!entry.isImg"
+				<div
+					v-if="!entry.isImg"
 					class="file-input--preview-no-image
 					flex h-[80px]
 					flex-1 basis-full flex-wrap items-center justify-center
@@ -139,7 +154,8 @@
 					<icon><i-fa6-regular-file class="text-4xl opacity-50"/></icon>
 				</div>
 			</div>
-			<div class="
+			<div
+				class="
 				file-input--preview-filename
 				min-w-0
 				flex-1
@@ -168,7 +184,6 @@ import IFa6SolidArrowUpFromBracket from "~icons/fa6-solid/arrow-up-from-bracket"
 import IFa6SolidXmark from "~icons/fa6-solid/xmark";
 import { useDivideAttrs } from "../../composables/useDivideAttrs.js";
 import { useInjectedI18n } from "../../composables/useInjectedI18n.js";
-import {} from "../../types/index.js";
 import { twMerge } from "../../utils/twMerge.js";
 import Icon from "../Icon/Icon.vue";
 import LibButton from "../LibButton/LibButton.vue";
@@ -191,7 +206,7 @@ watch(errors, () => {
   }
 });
 defineOptions({
-  name: "lib-file-input",
+  name: "LibFileInput",
   inheritAttrs: false
 });
 const $ = useDivideAttrs(["wrapper", "input", "previews"]);
@@ -250,9 +265,10 @@ const inputFile = async (e) => {
       errors.splice(0, errors.length);
     }
   }
+  return void 0;
 };
 </script>
 
 <script>
-export default { name: "lib-file-input" };
+export default { name: "LibFileInput" };
 </script>

package/dist/runtime/components/LibFileInput/LibFileInput.vue.d.ts

@@ -1,7 +1,7 @@
 import { type HTMLAttributes, type InputHTMLAttributes } from "vue";
-import { type FileInputError } from "../../types/index.js.js";
+import type { FileInputError } from "../../types/index.js.js";
 import { type LinkableByIdProps, type TailwindClassProp, type WrapperProps } from "../shared/props.js.js";
-declare const _default: __VLS_WithSlots<import("vue").DefineComponent<Props, void, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {} & {
+declare const _default: __VLS_WithSlots<import("vue").DefineComponent<Props, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {} & {
     input: (val: File[]) => any;
     errors: (val: FileInputError[]) => any;
 }, string, import("vue").PublicProps, Readonly<Props> & Readonly<{