@groupteknology/vuno 1.0.1 → 2.0.0

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

@@ -0,0 +1,196 @@
+<script setup>
+import { size as sizeMiddleware } from "@floating-ui/dom";
+import { computed, nextTick, onBeforeUnmount, onMounted, shallowRef, useId, useTemplateRef, watch } from "vue";
+import { useVunoAnchor } from "#vuno/composables/internal/useVunoAnchor";
+import { useVunoPortal } from "#vuno/composables/internal/useVunoPortal";
+import { useIcons, useMessages, useTheme } from "#vuno/composables/useTheme";
+import { toOptionKey } from "#vuno/components/FieldSelect/internal/Select/option";
+import { useVunoSelectState } from "#vuno/components/FieldSelect/internal/Select/useVunoSelectState";
+import Icon from "#vuno/components/Icon/Icon.vue";
+import ControlShell from "#vuno/components/internal/ControlShell/ControlShell.vue";
+defineOptions({ name: "VunoSelect", inheritAttrs: false });
+const props = defineProps({
+  name: { default: void 0, type: String },
+  disabled: Boolean,
+  items: { required: true, type: Array },
+  modelValue: {
+    default: void 0,
+    type: [String, Number, Boolean, Array, Object]
+  },
+  multiple: Boolean,
+  placeholder: { default: void 0, type: String },
+  portal: { default: void 0, type: [String, Boolean] },
+  radius: { default: void 0, type: String },
+  required: Boolean,
+  searchable: Boolean,
+  size: { default: void 0, type: String },
+  ui: { default: void 0, type: Object }
+});
+const emit = defineEmits(["update:modelValue"]);
+const model = computed({
+  get: () => props.modelValue,
+  set: (value) => emit("update:modelValue", value)
+});
+const icons = useIcons();
+const messages = useMessages();
+const portalTarget = useVunoPortal(() => props.portal);
+const uid = useId();
+const listId = `${uid}-list`;
+const boundary = shallowRef(void 0);
+const control = useTemplateRef("control");
+const input = useTemplateRef("input");
+const list = useTemplateRef("list");
+const mounted = shallowRef(false);
+const fieldSize = computed(() => props.size ?? "md");
+const ui = useTheme(
+  "select",
+  () => props.ui,
+  () => ({ size: fieldSize.value })
+);
+const optionId = (key) => `${uid}-${key.replace(/[^\w-]/g, "_")}`;
+const { onInput, onKeydown, activeKey, choose, close, highlighted, isSelected, open, openList, text, toggle, visibleItems } = useVunoSelectState({
+  model,
+  optionId,
+  disabled: () => props.disabled,
+  input: () => input.value ?? void 0,
+  items: () => props.items,
+  list: () => list.value ?? void 0,
+  multiple: () => props.multiple,
+  searchable: () => props.searchable
+});
+const { anchor, release } = useVunoAnchor({
+  boundary: () => boundary.value,
+  middleware: () => [
+    sizeMiddleware({
+      boundary: boundary.value,
+      padding: 8,
+      apply: ({ availableHeight, elements, rects }) => {
+        elements.floating.style.setProperty("--vuno-select-width", `${rects.reference.width}px`);
+        elements.floating.style.setProperty("--vuno-select-available-height", `${availableHeight}px`);
+      }
+    })
+  ]
+});
+function onPointerDownOutside(event) {
+  const target = event.target;
+  if (!target) return;
+  const inControl = control.value?.$el?.contains(target);
+  if (inControl || list.value?.contains(target)) return;
+  close();
+}
+function place() {
+  anchor(control.value?.$el, list.value ?? void 0);
+}
+watch(open, (isOpen) => {
+  if (!isOpen) {
+    release();
+    document.removeEventListener("pointerdown", onPointerDownOutside, true);
+    return;
+  }
+  boundary.value = control.value?.$el?.closest("dialog") ?? void 0;
+  void nextTick(() => {
+    place();
+    document.addEventListener("pointerdown", onPointerDownOutside, true);
+  });
+});
+onMounted(() => mounted.value = true);
+onBeforeUnmount(() => {
+  release();
+  document.removeEventListener("pointerdown", onPointerDownOutside, true);
+});
+</script>
+
+<template>
+    <ControlShell
+        ref="control"
+        :radius="props.radius"
+        :size="fieldSize"
+        :ui="props.ui"
+    >
+        <input
+            v-bind="$attrs"
+            ref="input"
+            :aria-activedescendant="open && activeKey ? optionId(activeKey) : void 0"
+            aria-autocomplete="list"
+            :aria-controls="listId"
+            :aria-expanded="open"
+            :aria-required="props.required || void 0"
+            autocomplete="off"
+            :class="[ui.input, { 'cursor-default': !props.searchable }]"
+            :disabled="props.disabled"
+            :name="props.name"
+            :placeholder="props.placeholder ?? messages.selectPlaceholder"
+            :readonly="!props.searchable"
+            role="combobox"
+            :value="text"
+            @input="onInput"
+            @keydown="onKeydown"
+            @pointerdown="!props.searchable && open ? close() : openList()"
+        />
+
+        <template #trailing>
+            <button
+                :aria-controls="listId"
+                :aria-expanded="open"
+                :aria-label="messages.selectToggle"
+                :class="ui.trigger"
+                :disabled="props.disabled"
+                tabindex="-1"
+                type="button"
+                @click="toggle"
+            >
+                <Icon
+                    :class="ui.triggerIcon"
+                    :name="icons.selectOpen"
+                />
+            </button>
+        </template>
+    </ControlShell>
+
+    <Teleport
+        v-if="mounted"
+        :to="portalTarget"
+    >
+        <ul
+            v-if="open"
+            :id="listId"
+            ref="list"
+            :class="ui.content"
+            role="listbox"
+            style="position: fixed; top: 0; left: 0"
+        >
+            <li
+                v-if="visibleItems.length === 0"
+                :class="ui.empty"
+            >
+                {{ messages.noMatches }}
+            </li>
+
+            <li
+                v-for="(item, index) in visibleItems"
+                :id="optionId(toOptionKey(item.value))"
+                :key="toOptionKey(item.value)"
+                :aria-disabled="item.disabled || void 0"
+                :aria-selected="isSelected(item)"
+                :class="ui.item"
+                :data-disabled="item.disabled || void 0"
+                :data-highlighted="index === highlighted || void 0"
+                role="option"
+                @click="choose(item)"
+                @pointermove="item.disabled ? void 0 : highlighted = index"
+            >
+                <span class="truncate">{{ item.label }}</span>
+
+                <span
+                    v-if="isSelected(item)"
+                    :class="ui.itemIndicator"
+                >
+                    <Icon
+                        :class="ui.itemIcon"
+                        :name="icons.selectSelected"
+                    />
+                </span>
+            </li>
+        </ul>
+    </Teleport>
+</template>

package/dist/runtime/app/components/FieldSelect/internal/Select/Select.vue.d.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/{utils → components/FieldSelect/internal/Select}/option.d.ts

@@ -2,10 +2,9 @@ import type { VunoFieldOptionValue } from '#vuno/types/field';
 /**
  * Clave estable con la que un valor de opción viaja por dentro del combobox.
  *
- * Reka UI acepta como valor de un item `string | number | bigint | object |
- * null`, y además **prohíbe la cadena vacía**: la reserva para «sin selección»
- * y lanza si se la pasas. vuno sí admite booleanos y `''` en sus opciones, así
- * que los valores entran como clave y se devuelven tal cual estaban al salir.
+ * vuno admite `string | number | boolean | bigint | object | null`, incluida la
+ * cadena vacía, en sus opciones. Los valores entran como una clave interna no
+ * vacía y se devuelven tal cual estaban al salir.
  *
  * La clave lleva el tipo delante porque sin él `1` y `'1'`, o `true` y
  * `'true'`, compartirían clave: elegir una opción seleccionaría la otra, y no

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

@@ -0,0 +1,30 @@
+import { type Ref } from 'vue';
+import type { VunoFieldOption, VunoFieldOptionValue } from '#vuno/types/field';
+type SelectModel = undefined | VunoFieldOptionValue | VunoFieldOptionValue[];
+type VunoSelectStateOptions = {
+    model: Ref<SelectModel>;
+    disabled: () => boolean;
+    input: () => HTMLInputElement | undefined;
+    items: () => VunoFieldOption[];
+    list: () => HTMLElement | undefined;
+    multiple: () => boolean;
+    optionId: (key: string) => string;
+    searchable: () => boolean;
+};
+/** Estado e interacción del combobox, independiente de su disposición y portal. */
+export declare function useVunoSelectState(options: VunoSelectStateOptions): {
+    onInput: (event: Event) => void;
+    onKeydown: (event: KeyboardEvent) => void;
+    activeKey: import("vue").ComputedRef<string | undefined>;
+    choose: (item: VunoFieldOption) => void;
+    close: (refocus?: boolean) => void;
+    highlighted: Ref<number, number>;
+    isSelected: (item: VunoFieldOption) => boolean;
+    open: Ref<boolean, boolean>;
+    openList: (edge?: "first" | "last") => void;
+    query: Ref<string, string>;
+    text: import("vue").ComputedRef<string>;
+    toggle: () => void;
+    visibleItems: import("vue").ComputedRef<VunoFieldOption[]>;
+};
+export {};

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

@@ -0,0 +1,142 @@
+import { computed, nextTick, ref } from "vue";
+import { fromOptionKey, toOptionKey } from "./option.js";
+export function useVunoSelectState(options) {
+  const open = ref(false);
+  const query = ref("");
+  const highlighted = ref(-1);
+  const selectedKeys = computed(() => {
+    if (options.multiple()) return (Array.isArray(options.model.value) ? options.model.value : []).map(toOptionKey);
+    return options.model.value === void 0 ? [] : [toOptionKey(options.model.value)];
+  });
+  const isSelected = (item) => selectedKeys.value.includes(toOptionKey(item.value));
+  const displayValue = computed(() => {
+    const labelByKey = new Map(options.items().map((item) => [toOptionKey(item.value), item.label]));
+    return selectedKeys.value.map((key) => labelByKey.get(key) ?? fromOptionKey(key)).filter((label) => label !== "").join(", ");
+  });
+  const text = computed(() => open.value && options.searchable() ? query.value : displayValue.value);
+  const visibleItems = computed(() => {
+    if (!options.searchable() || query.value.trim() === "") return options.items();
+    const needle = normalize(query.value);
+    return options.items().filter((item) => normalize(item.label).includes(needle));
+  });
+  const selectableIndexes = computed(() => visibleItems.value.map((item, index) => item.disabled ? -1 : index).filter((index) => index >= 0));
+  const activeKey = computed(() => {
+    const item = visibleItems.value[highlighted.value];
+    return item ? toOptionKey(item.value) : void 0;
+  });
+  function scrollHighlightIntoView() {
+    void nextTick(() => {
+      const key = activeKey.value;
+      if (!key) return;
+      options.list()?.querySelector(`#${CSS.escape(options.optionId(key))}`)?.scrollIntoView({ block: "nearest" });
+    });
+  }
+  function moveHighlight(step) {
+    const candidates = selectableIndexes.value;
+    if (candidates.length === 0) return;
+    const current = candidates.indexOf(highlighted.value);
+    const entry = step === 1 ? 0 : candidates.length - 1;
+    const next = current === -1 ? entry : (current + step + candidates.length) % candidates.length;
+    highlighted.value = candidates[next] ?? -1;
+    scrollHighlightIntoView();
+  }
+  function highlightEdge(edge) {
+    const candidates = selectableIndexes.value;
+    highlighted.value = (edge === "first" ? candidates[0] : candidates[candidates.length - 1]) ?? -1;
+    scrollHighlightIntoView();
+  }
+  function close(refocus = false) {
+    if (!open.value) return;
+    open.value = false;
+    query.value = "";
+    highlighted.value = -1;
+    if (refocus) options.input()?.focus();
+  }
+  function choose(item) {
+    if (item.disabled) return;
+    if (!options.multiple()) {
+      options.model.value = item.value;
+      close();
+      return;
+    }
+    const key = toOptionKey(item.value);
+    const current = Array.isArray(options.model.value) ? options.model.value : [];
+    options.model.value = current.some((value) => toOptionKey(value) === key) ? current.filter((value) => toOptionKey(value) !== key) : [...current, item.value];
+  }
+  function openList(edge) {
+    if (options.disabled() || open.value) return;
+    open.value = true;
+    query.value = "";
+    const selected = visibleItems.value.findIndex(isSelected);
+    if (edge) highlightEdge(edge);
+    else highlighted.value = selected;
+    void nextTick(scrollHighlightIntoView);
+  }
+  function toggle() {
+    if (open.value) close(true);
+    else {
+      options.input()?.focus();
+      openList();
+    }
+  }
+  function onNavigationKey(event) {
+    switch (event.key) {
+      case "ArrowDown":
+        event.preventDefault();
+        if (open.value) moveHighlight(1);
+        else openList("first");
+        return true;
+      case "ArrowUp":
+        event.preventDefault();
+        if (open.value) moveHighlight(-1);
+        else openList("last");
+        return true;
+      case "End":
+      case "Home":
+        if (!open.value) return true;
+        event.preventDefault();
+        highlightEdge(event.key === "Home" ? "first" : "last");
+        return true;
+      default:
+        return false;
+    }
+  }
+  function onCommitKey(event) {
+    if (event.key === " " && options.searchable()) return false;
+    if (event.key !== "Enter" && event.key !== " ") return false;
+    if (!open.value) {
+      if (event.key === "Enter") return true;
+      event.preventDefault();
+      openList();
+      return true;
+    }
+    const item = visibleItems.value[highlighted.value];
+    if (!item && event.key === " ") return true;
+    event.preventDefault();
+    if (item) choose(item);
+    else close();
+    return true;
+  }
+  function onKeydown(event) {
+    if (options.disabled()) return;
+    if (onNavigationKey(event)) return;
+    if (onCommitKey(event)) return;
+    if (event.key === "Escape") {
+      if (!open.value) return;
+      event.preventDefault();
+      close(true);
+      return;
+    }
+    if (event.key === "Tab") close();
+  }
+  function onInput(event) {
+    if (!options.searchable()) return;
+    query.value = event.target.value;
+    highlighted.value = selectableIndexes.value[0] ?? -1;
+    if (!open.value) open.value = true;
+  }
+  return { onInput, onKeydown, activeKey, choose, close, highlighted, isSelected, open, openList, query, text, toggle, visibleItems };
+}
+function normalize(value) {
+  return value.normalize("NFD").replace(/[\u0300-\u036f]/g, "").toLowerCase();
+}

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

@@ -0,0 +1,13 @@
+import type { VunoFieldSlug } from '#vuno/types/field';
+type __VLS_Props = Omit<VunoFieldSlug, '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/FieldSlug/FieldSlug.theme.d.ts

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

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

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

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

@@ -1,46 +1,40 @@
 <script setup>
-import { nextTick, ref, useTemplateRef, watch } from "vue";
-import Button from "#vuno/components/actions/Button.vue";
-import Input from "#vuno/components/forms/Input.vue";
+import { computed, nextTick, ref, useTemplateRef, watch } from "vue";
 import { useField } from "#vuno/composables/useField";
+import { useForm } from "#vuno/composables/useForm";
 import { useIcons, useMessages, useTheme } from "#vuno/composables/useTheme";
 import { formatSlug } from "#vuno/utils/format";
+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: "VunoFieldSlug" });
+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 },
-  source: { type: String, required: true }
+  source: { type: String, required: true },
+  sourceValue: { type: String, required: false }
 });
-const { value } = useField(() => props.name);
-const { value: sourceValue } = useField(() => props.source);
+const form = useForm({ optional: true });
+const { value } = useField(() => props.name, model);
+const sourceValue = computed(() => form ? form.getValue(props.source) : props.sourceValue);
 const icons = useIcons();
 const messages = useMessages();
 const ui = useTheme("fieldSlug", () => props.ui);
 const input = useTemplateRef("input");
 const isManual = ref(false);
 let initialised = false;
-watch(
-  sourceValue,
-  (source) => {
-    if (!initialised) {
-      initialised = true;
-      if (value.value) {
-        isManual.value = true;
-        return;
-      }
-    }
-    if (isManual.value) return;
-    value.value = formatSlug(source);
-  },
-  { immediate: true }
-);
 const onUpdate = (next) => {
   const text = next === void 0 ? "" : String(next);
   const formatted = formatSlug(text);
@@ -59,6 +53,21 @@ const resetToSource = () => {
   isManual.value = false;
   value.value = formatSlug(sourceValue.value);
 };
+watch(
+  sourceValue,
+  (source) => {
+    if (!initialised) {
+      initialised = true;
+      if (value.value) {
+        isManual.value = true;
+        return;
+      }
+    }
+    if (isManual.value) return;
+    value.value = formatSlug(source);
+  },
+  { immediate: true }
+);
 </script>
 
 <template>
@@ -72,31 +81,33 @@ const resetToSource = () => {
         proteger, así que el campo se queda escribible en vez de pedir permiso
         otra vez cada vez que vuelves a él.
     -->
-    <Input
-        ref="input"
-        :disabled="props.disabled"
-        :modelValue="value"
-        :name="props.name"
-        :placeholder="props.placeholder"
-        :readonly="!isManual"
-        :required="props.required"
-        :size="props.size"
-        :ui="ui"
-        @blur="normalise"
-        @update:model-value="onUpdate"
-    >
-        <template #trailing>
-            <Button
-                :aria-label="isManual ? messages.slugReset : messages.slugEdit"
-                color="neutral"
+    <FieldShell v-bind="props">
+        <template #default="control">
+            <Input
+                v-bind="control"
+                ref="input"
                 :disabled="props.disabled"
-                :icon="isManual ? icons.slugReset : icons.slugEdit"
-                size="sm"
-                tabindex="-1"
-                variant="link"
-                @click="isManual ? resetToSource() : takeControl()"
-                @mousedown.prevent
-            />
+                :modelValue="value"
+                :placeholder="props.placeholder"
+                :readonly="!isManual"
+                :ui="ui"
+                @blur="normalise"
+                @update:model-value="onUpdate"
+            >
+                <template #trailing>
+                    <Button
+                        :aria-label="isManual ? messages.slugReset : messages.slugEdit"
+                        color="neutral"
+                        :disabled="props.disabled"
+                        :icon="isManual ? icons.slugReset : icons.slugEdit"
+                        size="sm"
+                        tabindex="-1"
+                        variant="link"
+                        @click="isManual ? resetToSource() : takeControl()"
+                        @mousedown.prevent
+                    />
+                </template>
+            </Input>
         </template>
-    </Input>
+    </FieldShell>
 </template>

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

@@ -0,0 +1,13 @@
+import type { VunoFieldSlug } from '#vuno/types/field';
+type __VLS_Props = Omit<VunoFieldSlug, '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/FieldSwitch/FieldSwitch.d.vue.ts

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