@groupteknology/vuno 1.0.1 → 2.0.0

package/dist/runtime/app/components/FieldCheckbox/internal/Checkbox/Checkbox.theme.d.ts

@@ -0,0 +1,30 @@
+/**
+ * Casilla nativa. El marcado se pinta con `accent-color`, así que toma el
+ * color del tema sin dibujar ningún SVG encima.
+ */
+export declare const checkboxTheme: Record<"checkbox", {
+    readonly slots: {
+        readonly base: "shrink-0 cursor-pointer rounded-sm border border-vuno-border-strong bg-vuno-surface accent-(--vuno-accent) focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-(--vuno-accent) disabled:cursor-not-allowed disabled:opacity-50";
+    };
+    readonly variants: {
+        readonly color: Record<import("../../../../types/base.js").VunoColor, Record<"base", string>>;
+        readonly radius: Record<import("../../../../types/base.js").VunoRadius, Record<"base", string>>;
+        readonly size: {
+            readonly xs: {
+                readonly base: "size-3.5";
+            };
+            readonly sm: {
+                readonly base: "size-4";
+            };
+            readonly md: {
+                readonly base: "size-4";
+            };
+            readonly lg: {
+                readonly base: "size-5";
+            };
+            readonly xl: {
+                readonly base: "size-5";
+            };
+        };
+    };
+}>;

package/dist/runtime/app/components/FieldCheckbox/internal/Checkbox/Checkbox.theme.js

@@ -0,0 +1,10 @@
+import { accentByColor, radiusByStep } from "#vuno/theme/shared";
+import { defineTheme } from "#vuno/utils/theme";
+export const checkboxTheme = defineTheme("checkbox", {
+  slots: { base: "shrink-0 cursor-pointer rounded-sm border border-vuno-border-strong bg-vuno-surface accent-(--vuno-accent) focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-(--vuno-accent) disabled:cursor-not-allowed disabled:opacity-50" },
+  variants: {
+    color: accentByColor("base"),
+    radius: radiusByStep("base"),
+    size: { xs: { base: "size-3.5" }, sm: { base: "size-4" }, md: { base: "size-4" }, lg: { base: "size-5" }, xl: { base: "size-5" } }
+  }
+});

package/dist/runtime/app/components/{forms → FieldCheckbox/internal/Checkbox}/Checkbox.vue

@@ -1,29 +1,32 @@
 <script setup>
 import { useTemplateRef, watchEffect } from "vue";
 import { useTheme } from "#vuno/composables/useTheme";
+defineOptions({ name: "VunoCheckbox" });
+const model = defineModel({ type: Boolean, skipCheck: true, ...{ default: void 0 } });
 const props = defineProps({
   color: { type: String, required: false, default: "primary" },
   indeterminate: { type: Boolean, required: false, default: false },
+  radius: { type: String, required: false, default: void 0 },
   size: { type: String, required: false, default: "md" },
   ui: { type: Object, required: false, default: void 0 }
 });
-const model = defineModel({ type: Boolean, skipCheck: true, ...{ default: void 0 } });
 const ui = useTheme(
   "checkbox",
   () => props.ui,
   () => ({
     color: props.color,
+    radius: props.radius,
     size: props.size
   })
 );
 const control = useTemplateRef("control");
+function onChange(event) {
+  model.value = event.target.checked;
+}
 watchEffect(() => {
   const el = control.value;
   if (el) el.indeterminate = props.indeterminate;
 });
-function onChange(event) {
-  model.value = event.target.checked;
-}
 </script>
 
 <template>

package/dist/runtime/app/components/{forms → FieldCheckbox/internal/Checkbox}/Checkbox.vue.d.ts

@@ -1,4 +1,5 @@
-import type { VunoColor, VunoSize, VunoSlots } from '#vuno/types/base';
+import type { VunoColor, VunoRadius, VunoSize } from '#vuno/types/base';
+import type { VunoUi } from '#vuno/types/slots';
 /**
  * La casilla, nativa.
  *
@@ -7,16 +8,19 @@ import type { VunoColor, VunoSize, VunoSlots } from '#vuno/types/base';
  * `aria-*` del envoltorio de campo, el `name`, el `disabled`— cae en el
  * elemento correcto sin reenviarlo a mano.
  */
-type __VLS_Props = {
+type Props = {
     color?: VunoColor;
     /**
      * Ni marcada ni sin marcar: la selección de una tabla donde solo
      * hay algunas filas elegidas.
      */
     indeterminate?: boolean;
+    /** La curvatura. Sin valor, la que traiga el tema. */
+    radius?: VunoRadius;
     size?: VunoSize;
-    ui?: VunoSlots;
+    ui?: VunoUi<'checkbox' | 'fieldCheckbox'>;
 };
+type __VLS_Props = Props;
 type __VLS_ModelProps = {
     modelValue?: boolean | undefined;
 };
@@ -27,8 +31,9 @@ declare const __VLS_export: import("vue").DefineComponent<__VLS_PublicProps, {},
     "onUpdate:modelValue"?: ((value: boolean | undefined) => any) | undefined;
 }>, {
     color: VunoColor;
+    radius: VunoRadius;
     size: VunoSize;
-    ui: VunoSlots;
+    ui: VunoUi<"checkbox" | "fieldCheckbox">;
     indeterminate: boolean;
 }, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
 declare const _default: typeof __VLS_export;

package/dist/runtime/app/components/FieldColor/FieldColor.d.vue.ts

@@ -0,0 +1,13 @@
+import type { VunoFieldColor } from '#vuno/types/field';
+type __VLS_Props = Omit<VunoFieldColor, 'columns'>;
+type __VLS_ModelProps = {
+    modelValue?: string | undefined;
+};
+type __VLS_PublicProps = __VLS_Props & __VLS_ModelProps;
+declare const __VLS_export: import("vue").DefineComponent<__VLS_PublicProps, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
+    "update:modelValue": (value: string | undefined) => any;
+}, string, import("vue").PublicProps, Readonly<__VLS_PublicProps> & Readonly<{
+    "onUpdate:modelValue"?: ((value: string | undefined) => any) | undefined;
+}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
+declare const _default: typeof __VLS_export;
+export default _default;

package/dist/runtime/app/components/FieldColor/FieldColor.theme.d.ts

@@ -0,0 +1,27 @@
+export declare const fieldColorTheme: Record<"fieldColor", {
+    readonly slots: {
+        readonly root: "flex w-full items-center gap-2";
+        readonly swatch: "relative flex shrink-0 cursor-pointer items-center justify-center rounded-sm border border-vuno-border-strong bg-vuno-surface p-1 transition-colors [--vuno-accent:var(--color-vuno-primary)] focus-within:outline-2 focus-within:outline-offset-2 focus-within:outline-(--vuno-accent) has-disabled:cursor-not-allowed has-disabled:opacity-50";
+        readonly swatchColor: "size-full rounded-sm";
+        readonly swatchInput: "absolute inset-0 cursor-pointer opacity-0";
+    };
+    readonly variants: {
+        readonly size: {
+            readonly xs: {
+                readonly swatch: "size-6";
+            };
+            readonly sm: {
+                readonly swatch: "size-7";
+            };
+            readonly md: {
+                readonly swatch: "size-8";
+            };
+            readonly lg: {
+                readonly swatch: "size-9";
+            };
+            readonly xl: {
+                readonly swatch: "size-10";
+            };
+        };
+    };
+}>;

package/dist/runtime/app/components/FieldColor/FieldColor.theme.js

@@ -0,0 +1,18 @@
+import { defineTheme } from "#vuno/utils/theme";
+export const fieldColorTheme = defineTheme("fieldColor", {
+  slots: {
+    root: "flex w-full items-center gap-2",
+    swatch: "relative flex shrink-0 cursor-pointer items-center justify-center rounded-sm border border-vuno-border-strong bg-vuno-surface p-1 transition-colors [--vuno-accent:var(--color-vuno-primary)] focus-within:outline-2 focus-within:outline-offset-2 focus-within:outline-(--vuno-accent) has-disabled:cursor-not-allowed has-disabled:opacity-50",
+    swatchColor: "size-full rounded-sm",
+    swatchInput: "absolute inset-0 cursor-pointer opacity-0"
+  },
+  variants: {
+    size: {
+      xs: { swatch: "size-6" },
+      sm: { swatch: "size-7" },
+      md: { swatch: "size-8" },
+      lg: { swatch: "size-9" },
+      xl: { swatch: "size-10" }
+    }
+  }
+});

package/dist/runtime/app/components/{forms/fields → FieldColor}/FieldColor.vue

@@ -1,23 +1,28 @@
 <script setup>
 import { computed } from "vue";
-import Input from "#vuno/components/forms/Input.vue";
 import { useField } from "#vuno/composables/useField";
 import { useMessages, useTheme } from "#vuno/composables/useTheme";
 import { toHexColor } from "#vuno/utils/format";
-defineOptions({ inheritAttrs: false });
+import FieldShell from "#vuno/components/internal/FieldShell/FieldShell.vue";
+import Input from "#vuno/components/internal/Input/Input.vue";
+defineOptions({ name: "VunoFieldColor", inheritAttrs: false });
+const model = defineModel({ type: null, ...{ default: void 0 } });
 const props = defineProps({
-  name: { type: String, required: true },
+  name: { type: String, required: false },
+  class: { type: String, required: false },
   description: { type: String, required: false },
   disabled: { type: Boolean, required: false },
+  error: { type: String, required: false },
   help: { type: String, required: false },
   hint: { type: String, required: false },
   label: { type: String, required: false },
+  orientation: { type: String, required: false },
   required: { type: Boolean, required: false },
   size: { type: String, required: false },
   ui: { type: Object, required: false },
   placeholder: { type: String, required: false }
 });
-const { value } = useField(() => props.name);
+const { value } = useField(() => props.name, model);
 const messages = useMessages();
 const ui = useTheme(
   "fieldColor",
@@ -31,8 +36,10 @@ function onPick(event) {
 </script>
 
 <template>
-    <div :class="ui.root">
-        <!--
+    <FieldShell v-bind="props">
+        <template #default="control">
+            <div :class="ui.root">
+                <!--
             El selector es el del sistema: trae su lupa para tomar un color de
             la pantalla, su historial y su teclado, y en el móvil el de siempre.
             Nada de eso lo íbamos a escribir mejor.
@@ -44,38 +51,38 @@ function onPick(event) {
             foco se pinta sobre la caja con `focus-within`, no sobre algo que no
             se ve.
         -->
-        <label :class="ui.swatch">
-            <span
-                :class="ui.swatchColor"
-                :style="{ backgroundColor: value || 'transparent' }"
-            />
+                <label :class="ui.swatch">
+                    <span
+                        :class="ui.swatchColor"
+                        :style="{ backgroundColor: value || 'transparent' }"
+                    />
 
-            <!--
+                    <!--
                 El nombre lleva de qué control se trata porque el campo son
                 **dos** paradas con el mismo rótulo: la muestra abre el selector
                 del sistema y el hexadecimal de al lado escribe el valor. Sin
                 distinguirlos, quien no ve la pantalla oye dos veces «Color de
                 marca» y no sabe en cuál está.
             -->
-            <input
-                :aria-label="props.label ? `${props.label}: ${messages.colorPicker}` : messages.colorPicker"
-                :class="ui.swatchInput"
-                :disabled="props.disabled"
-                type="color"
-                :value="picked"
-                @input="onPick"
-            />
-        </label>
+                    <input
+                        :aria-label="props.label ? `${props.label}: ${messages.colorPicker}` : messages.colorPicker"
+                        :class="ui.swatchInput"
+                        :disabled="props.disabled"
+                        type="color"
+                        :value="picked"
+                        @input="onPick"
+                    />
+                </label>
 
-        <Input
-            v-bind="$attrs"
-            v-model="value"
-            class="font-mono"
-            :disabled="props.disabled"
-            :name="props.name"
-            :placeholder="props.placeholder ?? '#000000'"
-            :size="props.size"
-            :ui="{ root: 'w-full' }"
-        />
-    </div>
+                <Input
+                    v-bind="control"
+                    v-model="value"
+                    class="font-mono"
+                    :disabled="props.disabled"
+                    :placeholder="props.placeholder ?? '#000000'"
+                    :ui="{ root: 'w-full' }"
+                />
+            </div>
+        </template>
+    </FieldShell>
 </template>

package/dist/runtime/app/components/FieldColor/FieldColor.vue.d.ts

@@ -0,0 +1,13 @@
+import type { VunoFieldColor } from '#vuno/types/field';
+type __VLS_Props = Omit<VunoFieldColor, 'columns'>;
+type __VLS_ModelProps = {
+    modelValue?: string | undefined;
+};
+type __VLS_PublicProps = __VLS_Props & __VLS_ModelProps;
+declare const __VLS_export: import("vue").DefineComponent<__VLS_PublicProps, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
+    "update:modelValue": (value: string | undefined) => any;
+}, string, import("vue").PublicProps, Readonly<__VLS_PublicProps> & Readonly<{
+    "onUpdate:modelValue"?: ((value: string | undefined) => any) | undefined;
+}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
+declare const _default: typeof __VLS_export;
+export default _default;

package/dist/runtime/app/components/FieldCurrency/FieldCurrency.d.vue.ts

@@ -0,0 +1,13 @@
+import type { VunoFieldCurrency } from '#vuno/types/field';
+type __VLS_Props = Omit<VunoFieldCurrency, 'columns'>;
+type __VLS_ModelProps = {
+    modelValue?: number | undefined;
+};
+type __VLS_PublicProps = __VLS_Props & __VLS_ModelProps;
+declare const __VLS_export: import("vue").DefineComponent<__VLS_PublicProps, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
+    "update:modelValue": (value: number | undefined) => any;
+}, string, import("vue").PublicProps, Readonly<__VLS_PublicProps> & Readonly<{
+    "onUpdate:modelValue"?: ((value: number | undefined) => any) | undefined;
+}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
+declare const _default: typeof __VLS_export;
+export default _default;

package/dist/runtime/app/components/FieldCurrency/FieldCurrency.theme.d.ts

@@ -0,0 +1,5 @@
+export declare const fieldCurrencyTheme: Record<"fieldCurrency", {
+    readonly slots: {
+        readonly root: "w-full";
+    };
+}>;

package/dist/runtime/app/components/FieldCurrency/FieldCurrency.theme.js

@@ -0,0 +1,2 @@
+import { defineTheme } from "#vuno/utils/theme";
+export const fieldCurrencyTheme = defineTheme("fieldCurrency", { slots: { root: "w-full" } });

package/dist/runtime/app/components/FieldCurrency/FieldCurrency.vue

@@ -0,0 +1,51 @@
+<script setup>
+import { useField } from "#vuno/composables/useField";
+import { useTheme } from "#vuno/composables/useTheme";
+import FieldShell from "#vuno/components/internal/FieldShell/FieldShell.vue";
+import NumberInput from "#vuno/components/internal/NumberInput/NumberInput.vue";
+defineOptions({ name: "VunoFieldCurrency" });
+const model = defineModel({ type: null, ...{ default: void 0 } });
+const props = defineProps({
+  name: { type: String, required: false },
+  class: { type: String, required: false },
+  description: { type: String, required: false },
+  disabled: { type: Boolean, required: false },
+  error: { type: String, required: false },
+  help: { type: String, required: false },
+  hint: { type: String, required: false },
+  label: { type: String, required: false },
+  orientation: { type: String, required: false },
+  required: { type: Boolean, required: false },
+  size: { type: String, required: false },
+  ui: { type: Object, required: false },
+  controlsOrientation: { type: String, required: false },
+  currency: { type: String, required: true },
+  decimals: { type: Number, required: false },
+  max: { type: Number, required: false },
+  min: { type: Number, required: false },
+  placeholder: { type: String, required: false },
+  step: { type: Number, required: false }
+});
+const { value } = useField(() => props.name, model);
+const ui = useTheme("fieldCurrency", () => props.ui);
+</script>
+
+<template>
+    <FieldShell v-bind="props">
+        <template #default="control">
+            <NumberInput
+                v-bind="control"
+                v-model="value"
+                :currency="props.currency"
+                :decimals="props.decimals"
+                :disabled="props.disabled"
+                :max="props.max"
+                :min="props.min"
+                :orientation="props.controlsOrientation ?? 'horizontal'"
+                :placeholder="props.placeholder"
+                :step="props.step"
+                :ui="ui"
+            />
+        </template>
+    </FieldShell>
+</template>

package/dist/runtime/app/components/FieldCurrency/FieldCurrency.vue.d.ts

@@ -0,0 +1,13 @@
+import type { VunoFieldCurrency } from '#vuno/types/field';
+type __VLS_Props = Omit<VunoFieldCurrency, 'columns'>;
+type __VLS_ModelProps = {
+    modelValue?: number | undefined;
+};
+type __VLS_PublicProps = __VLS_Props & __VLS_ModelProps;
+declare const __VLS_export: import("vue").DefineComponent<__VLS_PublicProps, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
+    "update:modelValue": (value: number | undefined) => any;
+}, string, import("vue").PublicProps, Readonly<__VLS_PublicProps> & Readonly<{
+    "onUpdate:modelValue"?: ((value: number | undefined) => any) | undefined;
+}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
+declare const _default: typeof __VLS_export;
+export default _default;

package/dist/runtime/app/components/{forms/fields → FieldFile}/FieldFile.d.vue.ts

@@ -8,8 +8,16 @@ import type { VunoFieldFile } from '#vuno/types/field';
  * escriba `multiple: true`. Lo mismo hacía que `dropzone` llegara en
  * `false` al control, pisando el `true` que este sí traía por defecto.
  */
-type __VLS_Props = Omit<VunoFieldFile, 'class' | 'columns'>;
-declare const __VLS_export: import("vue").DefineComponent<__VLS_Props, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<__VLS_Props> & Readonly<{}>, {
+type __VLS_Props = Omit<VunoFieldFile, 'columns'>;
+type __VLS_ModelProps = {
+    modelValue?: File[] | null | undefined;
+};
+type __VLS_PublicProps = __VLS_Props & __VLS_ModelProps;
+declare const __VLS_export: import("vue").DefineComponent<__VLS_PublicProps, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
+    "update:modelValue": (value: File[] | null | undefined) => any;
+}, string, import("vue").PublicProps, Readonly<__VLS_PublicProps> & Readonly<{
+    "onUpdate:modelValue"?: ((value: File[] | null | undefined) => any) | undefined;
+}>, {
     dropzone: boolean;
     multiple: boolean;
     reorderable: boolean;

package/dist/runtime/app/components/FieldFile/FieldFile.theme.d.ts

@@ -0,0 +1,5 @@
+export declare const fieldFileTheme: Record<"fieldFile", {
+    readonly slots: {
+        readonly root: "w-full";
+    };
+}>;

package/dist/runtime/app/components/FieldFile/FieldFile.theme.js

@@ -0,0 +1,2 @@
+import { defineTheme } from "#vuno/utils/theme";
+export const fieldFileTheme = defineTheme("fieldFile", { slots: { root: "w-full" } });

package/dist/runtime/app/components/FieldFile/FieldFile.vue

@@ -0,0 +1,99 @@
+<script setup>
+import { computed } from "vue";
+import { useField } from "#vuno/composables/useField";
+import { useIcons, useMessages, useTheme } from "#vuno/composables/useTheme";
+import Button from "#vuno/components/Button/Button.vue";
+import FileUpload from "#vuno/components/FieldFile/internal/FileUpload/FileUpload.vue";
+import FieldShell from "#vuno/components/internal/FieldShell/FieldShell.vue";
+import Tooltip from "#vuno/components/Tooltip/Tooltip.vue";
+defineOptions({ name: "VunoFieldFile" });
+const model = defineModel({ type: null, ...{ default: void 0 } });
+const props = defineProps({
+  name: { type: String, required: false },
+  class: { type: String, required: false },
+  description: { type: String, required: false },
+  disabled: { type: Boolean, required: false },
+  error: { type: String, required: false },
+  help: { type: String, required: false },
+  hint: { type: String, required: false },
+  label: { type: String, required: false },
+  orientation: { type: String, required: false },
+  required: { type: Boolean, required: false },
+  size: { type: String, required: false },
+  ui: { type: Object, required: false },
+  accept: { type: String, required: false },
+  dropzone: { type: Boolean, required: false, default: true },
+  layout: { type: String, required: false },
+  multiple: { type: Boolean, required: false, default: true },
+  reorderable: { type: Boolean, required: false, default: true }
+});
+const { value } = useField(() => props.name, model);
+const icons = useIcons();
+const messages = useMessages();
+const ui = useTheme("fieldFile", () => props.ui);
+const isReorderable = computed(() => props.reorderable && props.multiple);
+const files = computed(() => value.value ?? []);
+function move(index, offset) {
+  const next = [...files.value];
+  const target = index + offset;
+  if (target < 0 || target >= next.length) return;
+  const [moved] = next.splice(index, 1);
+  if (!moved) return;
+  next.splice(target, 0, moved);
+  value.value = next;
+}
+</script>
+
+<template>
+    <FieldShell v-bind="props">
+        <template #default="control">
+            <FileUpload
+                v-bind="control"
+                v-model="value"
+                :accept="props.accept"
+                :disabled="props.disabled"
+                :dropzone="props.dropzone"
+                :layout="props.layout ?? 'list'"
+                :multiple="props.multiple"
+                :ui="ui"
+            >
+                <!--
+            Solo las flechas: el botón de quitar lo pone el control, que es
+            quien sabe cómo se borra de su lista. Aquí se añade lo que es propio
+            del campo, que es poder reordenar.
+        -->
+                <template #fileTrailing="{ actionClass, file, index }">
+                    <Tooltip
+                        v-if="isReorderable && index > 0"
+                        :text="messages.fileMoveUp"
+                    >
+                        <Button
+                            :aria-label="`${messages.fileMoveUp} ${file.name}`"
+                            color="neutral"
+                            :icon="icons.fileMoveUp"
+                            size="xs"
+                            :ui="{ base: actionClass }"
+                            variant="soft"
+                            @click="move(index, -1)"
+                        />
+                    </Tooltip>
+
+                    <Tooltip
+                        v-if="isReorderable && index < files.length - 1"
+                        :text="messages.fileMoveDown"
+                    >
+                        <Button
+                            :aria-label="`${messages.fileMoveDown} ${file.name}`"
+                            color="neutral"
+                            :icon="icons.fileMoveDown"
+                            size="xs"
+                            :ui="{ base: actionClass }"
+                            variant="soft"
+                            @click="move(index, 1)"
+                        />
+                    </Tooltip>
+                </template>
+            </FileUpload>
+        </template>
+    </FieldShell>
+</template>

package/dist/runtime/app/components/{forms/fields → FieldFile}/FieldFile.vue.d.ts

@@ -8,8 +8,16 @@ import type { VunoFieldFile } from '#vuno/types/field';
  * escriba `multiple: true`. Lo mismo hacía que `dropzone` llegara en
  * `false` al control, pisando el `true` que este sí traía por defecto.
  */
-type __VLS_Props = Omit<VunoFieldFile, 'class' | 'columns'>;
-declare const __VLS_export: import("vue").DefineComponent<__VLS_Props, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<__VLS_Props> & Readonly<{}>, {
+type __VLS_Props = Omit<VunoFieldFile, 'columns'>;
+type __VLS_ModelProps = {
+    modelValue?: File[] | null | undefined;
+};
+type __VLS_PublicProps = __VLS_Props & __VLS_ModelProps;
+declare const __VLS_export: import("vue").DefineComponent<__VLS_PublicProps, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
+    "update:modelValue": (value: File[] | null | undefined) => any;
+}, string, import("vue").PublicProps, Readonly<__VLS_PublicProps> & Readonly<{
+    "onUpdate:modelValue"?: ((value: File[] | null | undefined) => any) | undefined;
+}>, {
     dropzone: boolean;
     multiple: boolean;
     reorderable: boolean;

package/dist/runtime/app/components/{forms → FieldFile/internal/FileUpload}/FileUpload.d.vue.ts

@@ -1,20 +1,6 @@
-import type { VunoSize, VunoSlots } from '#vuno/types/base';
-type __VLS_Props = {
-    name?: string;
-    /** Filtro del selector nativo: `image/*`, `.pdf`, ... */
-    accept?: string;
-    disabled?: boolean;
-    /** Admite soltar archivos encima, además del clic. */
-    dropzone?: boolean;
-    /** Texto de la zona de caída. Sin él solo se ve el icono. */
-    hint?: string;
-    /** En rejilla se ve la miniatura; en lista, el nombre y el tamaño. */
-    layout?: 'grid' | 'list';
-    multiple?: boolean;
-    required?: boolean;
-    size?: VunoSize;
-    ui?: VunoSlots;
-};
+import type { VunoRadius, VunoSize } from '#vuno/types/base';
+import type { VunoUi } from '#vuno/types/slots';
+type __VLS_Props = Props;
 type __VLS_Slots = {
     /**
      * Acciones extra por archivo: reordenar, previsualizar.
@@ -31,6 +17,24 @@ type __VLS_Slots = {
         removeFile: (index: number) => void;
     }) => unknown;
 };
+type Props = {
+    name?: string;
+    /** Filtro del selector nativo: `image/*`, `.pdf`, ... */
+    accept?: string;
+    disabled?: boolean;
+    /** Admite soltar archivos encima, además del clic. */
+    dropzone?: boolean;
+    /** Texto de la zona de caída. Sin él solo se ve el icono. */
+    hint?: string;
+    /** En rejilla se ve la miniatura; en lista, el nombre y el tamaño. */
+    layout?: 'grid' | 'list';
+    multiple?: boolean;
+    /** La curvatura. Sin valor, la que traiga el tema. */
+    radius?: VunoRadius;
+    required?: boolean;
+    size?: VunoSize;
+    ui?: VunoUi<'fieldFile' | 'fileUpload'>;
+};
 type __VLS_ModelProps = {
     modelValue?: File[] | null | undefined;
 };
@@ -42,12 +46,13 @@ declare const __VLS_base: import("vue").DefineComponent<__VLS_PublicProps, {
 }, string, import("vue").PublicProps, Readonly<__VLS_PublicProps> & Readonly<{
     "onUpdate:modelValue"?: ((value: File[] | null | undefined) => any) | undefined;
 }>, {
-    name: string;
-    hint: string;
+    radius: VunoRadius;
     size: VunoSize;
+    name: string;
     dropzone: boolean;
+    hint: string;
     layout: "grid" | "list";
-    ui: VunoSlots;
+    ui: VunoUi<"fieldFile" | "fileUpload">;
     accept: string;
     multiple: boolean;
 }, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;