@groupteknology/vuno 1.0.1 → 2.0.0

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

@@ -0,0 +1,41 @@
+<script setup>
+import { useField } from "#vuno/composables/useField";
+import { useTheme } from "#vuno/composables/useTheme";
+import RadioGroup from "#vuno/components/FieldRadio/internal/RadioGroup/RadioGroup.vue";
+import FieldShell from "#vuno/components/internal/FieldShell/FieldShell.vue";
+defineOptions({ name: "VunoFieldRadio" });
+const model = defineModel({ type: [Boolean, null, Number, String], skipCheck: true, ...{ 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 },
+  items: { type: Array, required: true },
+  itemsOrientation: { type: String, required: false }
+});
+const { value } = useField(() => props.name, model);
+const ui = useTheme("fieldRadio", () => props.ui);
+</script>
+
+<template>
+    <FieldShell v-bind="props">
+        <template #default="control">
+            <RadioGroup
+                v-bind="control"
+                v-model="value"
+                :disabled="props.disabled"
+                :items="props.items"
+                :orientation="props.itemsOrientation ?? 'vertical'"
+                :ui="ui"
+            />
+        </template>
+    </FieldShell>
+</template>

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

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

package/dist/runtime/app/components/{forms → FieldRadio/internal/RadioGroup}/RadioGroup.d.vue.ts

@@ -1,15 +1,17 @@
-import type { VunoFieldOption, VunoFieldOptionValue, VunoFieldOrientation } from '#vuno/types/field';
-import type { VunoColor, VunoSize, VunoSlots } from '#vuno/types/base';
-type __VLS_Props = {
+import type { VunoColor, VunoSize } from '#vuno/types/base';
+import type { VunoControlOrientation, VunoFieldOption, VunoFieldOptionValue } from '#vuno/types/field';
+import type { VunoUi } from '#vuno/types/slots';
+type __VLS_Props = Props;
+type Props = {
     /** El que agrupa: todas las opciones comparten el mismo. */
     name?: string;
     color?: VunoColor;
     disabled?: boolean;
     items: VunoFieldOption[];
-    orientation?: VunoFieldOrientation;
+    orientation?: VunoControlOrientation;
     required?: boolean;
     size?: VunoSize;
-    ui?: VunoSlots;
+    ui?: VunoUi<'fieldRadio' | 'radioGroup'>;
 };
 type __VLS_ModelProps = {
     modelValue?: undefined | VunoFieldOptionValue;
@@ -21,10 +23,10 @@ declare const __VLS_export: import("vue").DefineComponent<__VLS_PublicProps, {},
     "onUpdate:modelValue"?: ((value: VunoFieldOptionValue | undefined) => any) | undefined;
 }>, {
     color: VunoColor;
-    name: string;
     size: VunoSize;
-    orientation: VunoFieldOrientation;
-    ui: VunoSlots;
+    orientation: VunoControlOrientation;
+    name: string;
+    ui: VunoUi<"fieldRadio" | "radioGroup">;
 }, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
 declare const _default: typeof __VLS_export;
 export default _default;

package/dist/runtime/app/components/FieldRadio/internal/RadioGroup/RadioGroup.theme.d.ts

@@ -0,0 +1,54 @@
+/**
+ * El grupo de radios. El control es nativo, así que el círculo de dentro lo
+ * pinta el navegador con `accent-color` en vez de dibujarlo aquí: es lo
+ * mismo que hace la casilla, y evita tener que reproducir a mano el estado
+ * marcado, el foco y el deshabilitado.
+ */
+export declare const radioGroupTheme: Record<"radioGroup", {
+    readonly slots: {
+        readonly control: "mt-0.5 shrink-0 cursor-pointer 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 description: "text-vuno-muted";
+        readonly item: "flex items-start gap-2";
+        readonly label: "cursor-pointer text-vuno-body";
+        readonly root: "flex w-full";
+        readonly texts: "flex min-w-0 flex-col";
+    };
+    readonly variants: {
+        readonly color: Record<import("../../../../types/base.js").VunoColor, Record<"control", string>>;
+        readonly orientation: {
+            readonly horizontal: {
+                readonly root: "flex-row flex-wrap gap-x-4 gap-y-1";
+            };
+            readonly vertical: {
+                readonly root: "flex-col gap-1";
+            };
+        };
+        readonly size: {
+            readonly xs: {
+                readonly control: "size-3.5";
+                readonly description: "text-xs";
+                readonly label: "text-xs";
+            };
+            readonly sm: {
+                readonly control: "size-4";
+                readonly description: "text-xs";
+                readonly label: "text-sm";
+            };
+            readonly md: {
+                readonly control: "size-4";
+                readonly description: "text-xs";
+                readonly label: "text-sm";
+            };
+            readonly lg: {
+                readonly control: "size-5";
+                readonly description: "text-sm";
+                readonly label: "text-base";
+            };
+            readonly xl: {
+                readonly control: "size-5";
+                readonly description: "text-sm";
+                readonly label: "text-base";
+            };
+        };
+    };
+}>;

package/dist/runtime/app/components/FieldRadio/internal/RadioGroup/RadioGroup.theme.js

@@ -0,0 +1,31 @@
+import { accentByColor } from "#vuno/theme/shared";
+import { defineTheme } from "#vuno/utils/theme";
+export const radioGroupTheme = defineTheme("radioGroup", {
+  slots: {
+    control: "mt-0.5 shrink-0 cursor-pointer 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",
+    description: "text-vuno-muted",
+    item: "flex items-start gap-2",
+    label: "cursor-pointer text-vuno-body",
+    root: "flex w-full",
+    texts: "flex min-w-0 flex-col"
+  },
+  variants: {
+    /*
+     * En `control`, que es quien la consume, y no en `base`: esta clave
+     * no tiene slot `base`, así que el acento se asignaba en un sitio
+     * que no se pinta nunca y los siete colores salían iguales.
+     */
+    color: accentByColor("control"),
+    orientation: {
+      horizontal: { root: "flex-row flex-wrap gap-x-4 gap-y-1" },
+      vertical: { root: "flex-col gap-1" }
+    },
+    size: {
+      xs: { control: "size-3.5", description: "text-xs", label: "text-xs" },
+      sm: { control: "size-4", description: "text-xs", label: "text-sm" },
+      md: { control: "size-4", description: "text-xs", label: "text-sm" },
+      lg: { control: "size-5", description: "text-sm", label: "text-base" },
+      xl: { control: "size-5", description: "text-sm", label: "text-base" }
+    }
+  }
+});

package/dist/runtime/app/components/{forms → FieldRadio/internal/RadioGroup}/RadioGroup.vue

@@ -1,7 +1,8 @@
 <script setup>
 import { computed, useId } from "vue";
 import { useTheme } from "#vuno/composables/useTheme";
-defineOptions({ inheritAttrs: false });
+defineOptions({ name: "VunoRadioGroup", inheritAttrs: false });
+const model = defineModel({ type: [Boolean, null, Number, String], skipCheck: true, ...{ default: void 0 } });
 const props = defineProps({
   name: { type: String, required: false, default: void 0 },
   color: { type: String, required: false, default: "primary" },
@@ -12,7 +13,6 @@ const props = defineProps({
   size: { type: String, required: false, default: "md" },
   ui: { type: Object, required: false, default: void 0 }
 });
-const model = defineModel({ type: [Boolean, null, Number, String], skipCheck: true, ...{ default: void 0 } });
 const ui = useTheme(
   "radioGroup",
   () => props.ui,
@@ -64,13 +64,16 @@ function onChange(option) {
                 <label
                     :class="ui.label"
                     :for="optionId(index)"
-                >{{ item.label }}</label>
+                    >{{ item.label }}</label
+                >
 
                 <p
                     v-if="item.description"
                     :id="descriptionId(index)"
                     :class="ui.description"
-                >{{ item.description }}</p>
+                >
+                    {{ item.description }}
+                </p>
             </div>
         </div>
     </div>

package/dist/runtime/app/components/{forms → FieldRadio/internal/RadioGroup}/RadioGroup.vue.d.ts

@@ -1,15 +1,17 @@
-import type { VunoFieldOption, VunoFieldOptionValue, VunoFieldOrientation } from '#vuno/types/field';
-import type { VunoColor, VunoSize, VunoSlots } from '#vuno/types/base';
-type __VLS_Props = {
+import type { VunoColor, VunoSize } from '#vuno/types/base';
+import type { VunoControlOrientation, VunoFieldOption, VunoFieldOptionValue } from '#vuno/types/field';
+import type { VunoUi } from '#vuno/types/slots';
+type __VLS_Props = Props;
+type Props = {
     /** El que agrupa: todas las opciones comparten el mismo. */
     name?: string;
     color?: VunoColor;
     disabled?: boolean;
     items: VunoFieldOption[];
-    orientation?: VunoFieldOrientation;
+    orientation?: VunoControlOrientation;
     required?: boolean;
     size?: VunoSize;
-    ui?: VunoSlots;
+    ui?: VunoUi<'fieldRadio' | 'radioGroup'>;
 };
 type __VLS_ModelProps = {
     modelValue?: undefined | VunoFieldOptionValue;
@@ -21,10 +23,10 @@ declare const __VLS_export: import("vue").DefineComponent<__VLS_PublicProps, {},
     "onUpdate:modelValue"?: ((value: VunoFieldOptionValue | undefined) => any) | undefined;
 }>, {
     color: VunoColor;
-    name: string;
     size: VunoSize;
-    orientation: VunoFieldOrientation;
-    ui: VunoSlots;
+    orientation: VunoControlOrientation;
+    name: string;
+    ui: VunoUi<"fieldRadio" | "radioGroup">;
 }, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
 declare const _default: typeof __VLS_export;
 export default _default;

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

@@ -0,0 +1,17 @@
+import type { VunoFieldSearch } from '#vuno/types/field';
+type __VLS_Props = Omit<VunoFieldSearch, 'columns'>;
+/** Permite que composiciones como VTable devuelvan el foco al buscador. */
+declare function focus(): void;
+type __VLS_ModelProps = {
+    modelValue?: string | undefined;
+};
+type __VLS_PublicProps = __VLS_Props & __VLS_ModelProps;
+declare const __VLS_export: import("vue").DefineComponent<__VLS_PublicProps, {
+    focus: typeof focus;
+}, {}, {}, {}, 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/FieldSearch/FieldSearch.theme.d.ts

@@ -0,0 +1,6 @@
+export declare const fieldSearchTheme: Record<"fieldSearch", {
+    readonly slots: {
+        readonly base: "[&::-webkit-search-cancel-button]:appearance-none";
+        readonly root: "w-full";
+    };
+}>;

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

@@ -0,0 +1,7 @@
+import { defineTheme } from "#vuno/utils/theme";
+export const fieldSearchTheme = defineTheme("fieldSearch", {
+  slots: {
+    base: "[&::-webkit-search-cancel-button]:appearance-none",
+    root: "w-full"
+  }
+});

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

@@ -0,0 +1,74 @@
+<script setup>
+import { useTemplateRef } 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 FieldShell from "#vuno/components/internal/FieldShell/FieldShell.vue";
+import Input from "#vuno/components/internal/Input/Input.vue";
+defineOptions({ name: "VunoFieldSearch" });
+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 },
+  autocomplete: { type: String, required: false },
+  autofocus: { type: Boolean, required: false },
+  placeholder: { type: String, required: false }
+});
+const { value } = useField(() => props.name, model);
+const icons = useIcons();
+const messages = useMessages();
+const ui = useTheme("fieldSearch", () => props.ui);
+const input = useTemplateRef("input");
+function focus() {
+  input.value?.inputRef?.focus();
+}
+function clear() {
+  value.value = "";
+  focus();
+}
+defineExpose({ focus });
+</script>
+
+<template>
+    <FieldShell v-bind="props">
+        <template #default="control">
+            <Input
+                v-bind="control"
+                ref="input"
+                v-model="value"
+                :autocomplete="props.autocomplete"
+                :autofocus="props.autofocus"
+                :disabled="props.disabled"
+                :icon="icons.search"
+                :placeholder="props.placeholder ?? messages.searchPlaceholder"
+                type="search"
+                :ui="ui"
+            >
+                <template
+                    v-if="value"
+                    #trailing
+                >
+                    <Button
+                        :aria-label="messages.clearSearch"
+                        color="neutral"
+                        :disabled="props.disabled"
+                        :icon="icons.clearSearch"
+                        size="sm"
+                        variant="link"
+                        @click="clear"
+                    />
+                </template>
+            </Input>
+        </template>
+    </FieldShell>
+</template>

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

@@ -0,0 +1,17 @@
+import type { VunoFieldSearch } from '#vuno/types/field';
+type __VLS_Props = Omit<VunoFieldSearch, 'columns'>;
+/** Permite que composiciones como VTable devuelvan el foco al buscador. */
+declare function focus(): void;
+type __VLS_ModelProps = {
+    modelValue?: string | undefined;
+};
+type __VLS_PublicProps = __VLS_Props & __VLS_ModelProps;
+declare const __VLS_export: import("vue").DefineComponent<__VLS_PublicProps, {
+    focus: typeof focus;
+}, {}, {}, {}, 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/FieldSelect/FieldSelect.d.vue.ts

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

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

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

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

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

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

@@ -0,0 +1,45 @@
+<script setup>
+import { useField } from "#vuno/composables/useField";
+import { useTheme } from "#vuno/composables/useTheme";
+import Select from "#vuno/components/FieldSelect/internal/Select/Select.vue";
+import FieldShell from "#vuno/components/internal/FieldShell/FieldShell.vue";
+defineOptions({ name: "VunoFieldSelect" });
+const model = defineModel({ type: [Boolean, null, Number, String, Array], skipCheck: true, ...{ 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 },
+  items: { type: Array, required: true },
+  multiple: { type: Boolean, required: false },
+  placeholder: { type: String, required: false },
+  searchable: { type: Boolean, required: false }
+});
+const { value } = useField(() => props.name, model);
+const ui = useTheme("fieldSelect", () => props.ui);
+</script>
+
+<template>
+    <FieldShell v-bind="props">
+        <template #default="control">
+            <Select
+                v-bind="control"
+                v-model="value"
+                :disabled="props.disabled"
+                :items="props.items"
+                :multiple="props.multiple"
+                :placeholder="props.placeholder"
+                :searchable="props.searchable"
+                :ui="ui"
+            />
+        </template>
+    </FieldShell>
+</template>

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

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

package/dist/runtime/app/components/FieldSelect/internal/Select/Select.d.vue.ts

@@ -0,0 +1,97 @@
+import { type PropType } from 'vue';
+import type { VunoPortalTarget, VunoRadius, VunoSize } from '#vuno/types/base';
+import type { VunoFieldOption, VunoFieldOptionValue } from '#vuno/types/field';
+import type { VunoUi } from '#vuno/types/slots';
+declare const __VLS_export: import("vue").DefineComponent<import("vue").ExtractPropTypes<{
+    name: {
+        default: undefined;
+        type: StringConstructor;
+    };
+    disabled: BooleanConstructor;
+    items: {
+        required: true;
+        type: PropType<VunoFieldOption[]>;
+    };
+    modelValue: {
+        default: undefined;
+        type: PropType<undefined | VunoFieldOptionValue | VunoFieldOptionValue[]>;
+    };
+    multiple: BooleanConstructor;
+    placeholder: {
+        default: undefined;
+        type: StringConstructor;
+    };
+    portal: {
+        default: undefined;
+        type: PropType<VunoPortalTarget>;
+    };
+    radius: {
+        default: undefined;
+        type: PropType<VunoRadius>;
+    };
+    required: BooleanConstructor;
+    searchable: BooleanConstructor;
+    size: {
+        default: undefined;
+        type: PropType<VunoSize>;
+    };
+    ui: {
+        default: undefined;
+        type: PropType<VunoUi<"control" | "select">>;
+    };
+}>, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
+    "update:modelValue": (value: VunoFieldOptionValue | VunoFieldOptionValue[] | undefined) => any;
+}, string, import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<{
+    name: {
+        default: undefined;
+        type: StringConstructor;
+    };
+    disabled: BooleanConstructor;
+    items: {
+        required: true;
+        type: PropType<VunoFieldOption[]>;
+    };
+    modelValue: {
+        default: undefined;
+        type: PropType<undefined | VunoFieldOptionValue | VunoFieldOptionValue[]>;
+    };
+    multiple: BooleanConstructor;
+    placeholder: {
+        default: undefined;
+        type: StringConstructor;
+    };
+    portal: {
+        default: undefined;
+        type: PropType<VunoPortalTarget>;
+    };
+    radius: {
+        default: undefined;
+        type: PropType<VunoRadius>;
+    };
+    required: BooleanConstructor;
+    searchable: BooleanConstructor;
+    size: {
+        default: undefined;
+        type: PropType<VunoSize>;
+    };
+    ui: {
+        default: undefined;
+        type: PropType<VunoUi<"control" | "select">>;
+    };
+}>> & Readonly<{
+    "onUpdate:modelValue"?: ((value: VunoFieldOptionValue | VunoFieldOptionValue[] | undefined) => any) | undefined;
+}>, {
+    radius: VunoRadius;
+    size: VunoSize;
+    name: string;
+    required: boolean;
+    ui: Partial<Record<"root" | ("input" | "item" | "content" | "empty" | "itemIcon" | "itemIndicator" | "trigger" | "triggerIcon"), string | string[] | undefined>>;
+    disabled: boolean;
+    modelValue: VunoFieldOptionValue | VunoFieldOptionValue[] | undefined;
+    placeholder: string;
+    multiple: boolean;
+    portal: VunoPortalTarget;
+    searchable: boolean;
+}, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
+declare const _default: typeof __VLS_export;
+export default _default;

package/dist/runtime/app/components/FieldSelect/internal/Select/Select.theme.d.ts

@@ -0,0 +1,36 @@
+export declare const selectTheme: Record<"select", {
+    readonly slots: {
+        readonly content: "z-50 max-h-[min(18rem,var(--vuno-select-available-height,18rem))] w-(--vuno-select-width,16rem) overflow-y-auto rounded-sm border border-vuno-border bg-vuno-surface-1 p-1 shadow-lg";
+        readonly empty: "px-2 py-3 text-center text-sm text-vuno-muted";
+        readonly input: "w-full min-w-0 bg-transparent py-1 outline-none placeholder:text-vuno-subtle disabled:cursor-not-allowed";
+        readonly item: "flex cursor-default items-center justify-between gap-2 rounded-sm px-2 py-1.5 text-vuno-body outline-none data-disabled:cursor-not-allowed data-disabled:opacity-50 data-highlighted:bg-vuno-surface-2 data-highlighted:text-vuno-strong";
+        readonly itemIcon: "size-4";
+        readonly itemIndicator: "shrink-0 text-vuno-primary";
+        readonly trigger: "ms-auto inline-flex shrink-0 items-center self-stretch text-vuno-muted transition-colors hover:text-vuno-body disabled:cursor-not-allowed";
+        readonly triggerIcon: "size-4";
+    };
+    readonly variants: {
+        readonly size: {
+            readonly xs: {
+                readonly item: "text-xs";
+                readonly trigger: "me-2";
+            };
+            readonly sm: {
+                readonly item: "text-sm";
+                readonly trigger: "me-2.5";
+            };
+            readonly md: {
+                readonly item: "text-sm";
+                readonly trigger: "me-3";
+            };
+            readonly lg: {
+                readonly item: "text-base";
+                readonly trigger: "me-3.5";
+            };
+            readonly xl: {
+                readonly item: "text-base";
+                readonly trigger: "me-4";
+            };
+        };
+    };
+}>;

package/dist/runtime/app/components/FieldSelect/internal/Select/Select.theme.js

@@ -0,0 +1,49 @@
+import { defineTheme } from "#vuno/utils/theme";
+export const selectTheme = defineTheme("select", {
+  slots: {
+    /*
+     * La lista es a la vez la caja y lo que se desplaza: ya no hay un
+     * viewport dentro, así que el alto máximo y el `overflow` van en el
+     * mismo elemento y no hay dos cajas que sumar.
+     *
+     * Las dos medidas las publica el componente al colocarla:
+     * `--vuno-select-width` es el ancho del campo, para que la lista
+     * mida lo mismo, y `--vuno-select-available-height` es el hueco que
+     * queda hasta el borde —la ventana, o el diálogo si lo hay—. El
+     * respaldo de las dos importa: se leen antes del primer cálculo, y
+     * sin él la lista aparecería sin ancho durante un fotograma.
+     */
+    content: "z-50 max-h-[min(18rem,var(--vuno-select-available-height,18rem))] w-(--vuno-select-width,16rem) overflow-y-auto rounded-sm border border-vuno-border bg-vuno-surface-1 p-1 shadow-lg",
+    empty: "px-2 py-3 text-center text-sm text-vuno-muted",
+    /*
+     * El control y su disparador. Estaban escritos en la plantilla, de
+     * modo que el color del texto de sugerencia y el relleno del campo
+     * donde se teclea no se podían tocar desde el proyecto.
+     *
+     * Es casi lo mismo que `input.base` —solo añade el relleno
+     * vertical—, y esa cercanía es a propósito: un combobox tiene que
+     * parecerse a un input hasta en el detalle. Si divergen, se unifican.
+     */
+    input: "w-full min-w-0 bg-transparent py-1 outline-none placeholder:text-vuno-subtle disabled:cursor-not-allowed",
+    item: "flex cursor-default items-center justify-between gap-2 rounded-sm px-2 py-1.5 text-vuno-body outline-none data-disabled:cursor-not-allowed data-disabled:opacity-50 data-highlighted:bg-vuno-surface-2 data-highlighted:text-vuno-strong",
+    itemIcon: "size-4",
+    itemIndicator: "shrink-0 text-vuno-primary",
+    trigger: "ms-auto inline-flex shrink-0 items-center self-stretch text-vuno-muted transition-colors hover:text-vuno-body disabled:cursor-not-allowed",
+    triggerIcon: "size-4"
+  },
+  /*
+   * La opción y el margen del disparador siguen al tamaño del campo: con
+   * un texto fijo, un select `xs` abriría una lista con la letra más
+   * grande que su propio disparador; con un margen fijo, la flecha no
+   * conservaría la misma proporción respecto a la caja.
+   */
+  variants: {
+    size: {
+      xs: { item: "text-xs", trigger: "me-2" },
+      sm: { item: "text-sm", trigger: "me-2.5" },
+      md: { item: "text-sm", trigger: "me-3" },
+      lg: { item: "text-base", trigger: "me-3.5" },
+      xl: { item: "text-base", trigger: "me-4" }
+    }
+  }
+});