@groupteknology/vuno 1.0.0 → 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/FieldRadio/internal/RadioGroup/RadioGroup.d.vue.ts

@@ -0,0 +1,32 @@
+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?: VunoControlOrientation;
+    required?: boolean;
+    size?: VunoSize;
+    ui?: VunoUi<'fieldRadio' | 'radioGroup'>;
+};
+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;
+}>, {
+    color: VunoColor;
+    size: VunoSize;
+    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/FieldRadio/internal/RadioGroup/RadioGroup.vue

@@ -0,0 +1,80 @@
+<script setup>
+import { computed, useId } from "vue";
+import { useTheme } from "#vuno/composables/useTheme";
+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" },
+  disabled: { type: Boolean, required: false },
+  items: { type: Array, required: true },
+  orientation: { type: String, required: false, default: "vertical" },
+  required: { type: Boolean, required: false },
+  size: { type: String, required: false, default: "md" },
+  ui: { type: Object, required: false, default: void 0 }
+});
+const ui = useTheme(
+  "radioGroup",
+  () => props.ui,
+  () => ({
+    color: props.color,
+    orientation: props.orientation,
+    size: props.size
+  })
+);
+const uid = useId();
+const groupName = computed(() => props.name ?? uid);
+const optionId = (index) => `${uid}-${index}`;
+const descriptionId = (index) => `${uid}-${index}-description`;
+function onChange(option) {
+  model.value = option.value;
+}
+</script>
+
+<template>
+    <!--
+        Los `aria-*` y el `id` del envoltorio de campo se quedan aquí a
+        propósito: describen al grupo, que es lo que el lector anuncia como una
+        unidad, y no a una de las opciones.
+    -->
+    <div
+        v-bind="$attrs"
+        :class="ui.root"
+        role="radiogroup"
+    >
+        <div
+            v-for="(item, index) in props.items"
+            :key="String(item.value)"
+            :class="ui.item"
+        >
+            <input
+                :id="optionId(index)"
+                :aria-describedby="item.description ? descriptionId(index) : void 0"
+                :checked="model === item.value"
+                :class="ui.control"
+                :disabled="props.disabled || item.disabled"
+                :name="groupName"
+                :required="props.required"
+                type="radio"
+                :value="String(item.value)"
+                @change="onChange(item)"
+            />
+
+            <div :class="ui.texts">
+                <label
+                    :class="ui.label"
+                    :for="optionId(index)"
+                    >{{ item.label }}</label
+                >
+
+                <p
+                    v-if="item.description"
+                    :id="descriptionId(index)"
+                    :class="ui.description"
+                >
+                    {{ item.description }}
+                </p>
+            </div>
+        </div>
+    </div>
+</template>

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

@@ -0,0 +1,32 @@
+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?: VunoControlOrientation;
+    required?: boolean;
+    size?: VunoSize;
+    ui?: VunoUi<'fieldRadio' | 'radioGroup'>;
+};
+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;
+}>, {
+    color: VunoColor;
+    size: VunoSize;
+    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";
+            };
+        };
+    };
+}>;