@groupteknology/vuno 3.0.0 → 4.0.0

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

@@ -0,0 +1,137 @@
+<script setup>
+import { computed, nextTick, onBeforeUnmount, onMounted, useId, useTemplateRef } from "vue";
+import { useIcons, useTheme } from "#vuno/composables/useTheme";
+import Button from "#vuno/components/Button/Button.vue";
+import { interactiveChildren, notificationIcons } from "#vuno/components/InlineNotification/notification";
+import Icon from "#vuno/primitives/PrimitiveIcon/PrimitiveIcon.vue";
+defineOptions({ name: "ActionableNotification" });
+const props = defineProps({
+  closeButtonLabel: { type: String, required: false, default: "Cerrar notificaci\xF3n" },
+  hideCloseButton: { type: Boolean, required: false, default: false },
+  kind: { type: String, required: false, default: "error" },
+  lowContrast: { type: Boolean, required: false, default: false },
+  statusIconDescription: { type: String, required: false, default: void 0 },
+  subtitle: { type: String, required: false, default: void 0 },
+  title: { type: String, required: false, default: void 0 },
+  ui: { type: Object, required: false, default: void 0 },
+  actionButtonLabel: { type: String, required: false, default: void 0 },
+  caption: { type: String, required: false, default: void 0 },
+  closeOnEscape: { type: Boolean, required: false, default: true },
+  inline: { type: Boolean, required: false, default: false },
+  role: { type: String, required: false, default: "alertdialog" }
+});
+const emit = defineEmits(["action", "close"]);
+defineSlots();
+const icons = useIcons();
+const root = useTemplateRef("root");
+const titleId = useId();
+const subtitleId = useId();
+let previous = null;
+const modal = computed(() => props.role === "alertdialog");
+const ui = useTheme(
+  "inlineNotification",
+  () => props.ui,
+  () => ({ hideCloseButton: props.hideCloseButton ? "true" : "false", kind: props.kind, lowContrast: props.lowContrast ? "true" : "false", variant: props.inline ? "actionable" : "actionableToast" })
+);
+function onKeydown(event) {
+  if (event.key === "Escape" && props.closeOnEscape) {
+    event.preventDefault();
+    emit("close");
+    return;
+  }
+  if (event.key !== "Tab" || !modal.value) return;
+  const focusable = interactiveChildren(root.value);
+  if (focusable.length === 0) return;
+  const first = focusable[0];
+  const last = focusable.at(-1);
+  const target = event.shiftKey && document.activeElement === first ? last : !event.shiftKey && document.activeElement === last ? first : void 0;
+  if (!target) return;
+  event.preventDefault();
+  target.focus();
+}
+onMounted(() => {
+  if (!modal.value) return;
+  previous = document.activeElement instanceof HTMLElement ? document.activeElement : null;
+  void nextTick(() => {
+    const action = root.value?.querySelector("[data-notification-action]");
+    const target = action ?? interactiveChildren(root.value)[0];
+    target?.focus();
+  });
+});
+onBeforeUnmount(() => {
+  if (!modal.value || !root.value?.contains(document.activeElement)) return;
+  previous?.focus();
+});
+</script>
+
+<template>
+    <div
+        ref="root"
+        :aria-labelledby="props.title ? titleId : props.subtitle ? subtitleId : void 0"
+        :class="ui.root"
+        :role="props.role"
+        @keydown="onKeydown"
+    >
+        <div :class="ui.details">
+            <Icon
+                :class="ui.icon"
+                :name="notificationIcons[props.kind]"
+            />
+            <span
+                v-if="props.statusIconDescription"
+                :class="ui.assistive"
+            >
+                {{ props.statusIconDescription }}
+            </span>
+            <div :class="ui.textWrapper">
+                <div :class="ui.content">
+                    <div
+                        v-if="props.title"
+                        :id="titleId"
+                        :class="ui.title"
+                    >
+                        {{ props.title }}
+                    </div>
+                    <div
+                        v-if="props.subtitle"
+                        :id="subtitleId"
+                        :class="ui.subtitle"
+                    >
+                        {{ props.subtitle }}
+                    </div>
+                    <div
+                        v-if="props.caption"
+                        :class="ui.caption"
+                    >
+                        {{ props.caption }}
+                    </div>
+                    <slot />
+                </div>
+            </div>
+        </div>
+        <div :class="ui.actions">
+            <Button
+                v-if="props.actionButtonLabel"
+                data-notification-action
+                :kind="props.inline ? 'ghost' : 'tertiary'"
+                :label="props.actionButtonLabel"
+                size="sm"
+                :ui="{ base: ui.action }"
+                @click="emit('action')"
+            />
+            <button
+                v-if="!props.hideCloseButton"
+                :aria-label="props.closeButtonLabel"
+                :class="ui.close"
+                :title="props.closeButtonLabel"
+                type="button"
+                @click="emit('close')"
+            >
+                <Icon
+                    :class="ui.closeIcon"
+                    :name="icons.close"
+                />
+            </button>
+        </div>
+    </div>
+</template>

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

@@ -0,0 +1,33 @@
+import type { ActionableNotificationProps } from './ActionableNotification.types.js';
+type __VLS_Slots = {
+    default?: () => unknown;
+};
+declare const __VLS_base: import("vue").DefineComponent<ActionableNotificationProps, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
+    action: () => any;
+    close: () => any;
+}, string, import("vue").PublicProps, Readonly<ActionableNotificationProps> & Readonly<{
+    onAction?: (() => any) | undefined;
+    onClose?: (() => any) | undefined;
+}>, {
+    title: string;
+    inline: boolean;
+    kind: import("../InlineNotification/InlineNotification.types.js").NotificationKind;
+    lowContrast: boolean;
+    hideCloseButton: boolean;
+    caption: string;
+    subtitle: string;
+    ui: import("../../types/slots.js").ComponentUi<"inlineNotification">;
+    closeButtonLabel: string;
+    statusIconDescription: string;
+    actionButtonLabel: string;
+    closeOnEscape: boolean;
+    role: "alertdialog" | import("../InlineNotification/InlineNotification.types.js").NotificationRole;
+}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
+declare const __VLS_export: __VLS_WithSlots<typeof __VLS_base, __VLS_Slots>;
+declare const _default: typeof __VLS_export;
+export default _default;
+type __VLS_WithSlots<T, S> = T & {
+    new (): {
+        $slots: S;
+    };
+};

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

@@ -0,0 +1,16 @@
+import type { AspectRatioProps } from './AspectRatio.types.js';
+type __VLS_Slots = {
+    default?: () => unknown;
+};
+declare const __VLS_base: import("vue").DefineComponent<AspectRatioProps, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<AspectRatioProps> & Readonly<{}>, {
+    as: import("vue").Component | string;
+    ratio: import("./AspectRatio.types.js").AspectRatioValue;
+}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
+declare const __VLS_export: __VLS_WithSlots<typeof __VLS_base, __VLS_Slots>;
+declare const _default: typeof __VLS_export;
+export default _default;
+type __VLS_WithSlots<T, S> = T & {
+    new (): {
+        $slots: S;
+    };
+};

package/dist/runtime/app/components/AspectRatio/AspectRatio.types.d.ts

@@ -0,0 +1,31 @@
+import type { Component } from 'vue';
+/**
+ * Las nueve proporciones que publica el sistema de origen, en su orden: cada
+ * pareja apaisada va seguida de su vertical.
+ *
+ * Su guía de retícula recomienda seis —1:1, 2:1, 2:3, 3:2, 4:3 y 16:9— y su
+ * hoja de estilos genera además las verticales que faltan para completar las
+ * parejas: `9x16`, `1x2` y `3x4`. Se conservan las nueve porque la clase
+ * existe en origen y porque una vertical sin su apaisada obligaría a escribir
+ * la razón a mano justo donde el componente debería servir.
+ */
+export declare const aspectRatios: readonly ["16x9", "9x16", "2x1", "1x2", "4x3", "3x4", "3x2", "2x3", "1x1"];
+export type AspectRatioValue = (typeof aspectRatios)[number];
+export type AspectRatioProps = {
+    /**
+     * Raíz alternativa. Una caja con proporción suele ser la figura, el
+     * artículo o el elemento de lista que ya existía en el marcado, y forzar un
+     * `div` obligaría a envolverla solo para recuperar la semántica.
+     *
+     * Debe ser un elemento de bloque: `aspect-ratio` no llega a aplicarse sobre
+     * una caja en línea, así que un `span` no cambiaría de alto.
+     */
+    as?: Component | string;
+    /**
+     * Proporción entre ancho y alto. El ancho lo decide el contenedor —la caja
+     * ocupa el espacio disponible— y de él sale el alto.
+     *
+     * `1x1` de serie, como en el sistema de origen.
+     */
+    ratio?: AspectRatioValue;
+};

package/dist/runtime/app/components/AspectRatio/AspectRatio.types.js

@@ -0,0 +1 @@
+export const aspectRatios = ["16x9", "9x16", "2x1", "1x2", "4x3", "3x4", "3x2", "2x3", "1x1"];

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

@@ -0,0 +1,24 @@
+<script setup>
+import { computed } from "vue";
+defineOptions({ name: "AspectRatio" });
+const props = defineProps({
+  as: { type: null, required: false, default: "div" },
+  ratio: { type: null, required: false, default: "1x1" }
+});
+defineSlots();
+const style = computed(() => ({ "--vuno-aspect-ratio": props.ratio.replace("x", " / ") }));
+</script>
+
+<template>
+    <component
+        :is="props.as"
+        data-vuno-aspect-ratio
+        :style="style"
+    >
+        <slot />
+    </component>
+</template>
+
+<style scoped>
+[data-vuno-aspect-ratio]{aspect-ratio:var(--vuno-aspect-ratio,1/1);position:relative}
+</style>

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

@@ -0,0 +1,16 @@
+import type { AspectRatioProps } from './AspectRatio.types.js';
+type __VLS_Slots = {
+    default?: () => unknown;
+};
+declare const __VLS_base: import("vue").DefineComponent<AspectRatioProps, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<AspectRatioProps> & Readonly<{}>, {
+    as: import("vue").Component | string;
+    ratio: import("./AspectRatio.types.js").AspectRatioValue;
+}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
+declare const __VLS_export: __VLS_WithSlots<typeof __VLS_base, __VLS_Slots>;
+declare const _default: typeof __VLS_export;
+export default _default;
+type __VLS_WithSlots<T, S> = T & {
+    new (): {
+        $slots: S;
+    };
+};

package/dist/runtime/app/components/Breadcrumb/Breadcrumb.context.d.ts

@@ -0,0 +1,13 @@
+import type { InjectionKey, Ref } from 'vue';
+import type { BreadcrumbSize } from './Breadcrumb.types.js';
+/**
+ * Lo que decide el contenedor y cada elemento necesita para pintarse. El sistema de origen lo
+ * resuelve con clases en el `ol` —los modificadores de tamaño y de barra
+ * final— y selectores de descendencia; aquí cada
+ * `BreadcrumbItem` resuelve su propio tema, así que lo recibe por inyección.
+ */
+export type BreadcrumbContext = {
+    noTrailingSlash: Ref<boolean>;
+    size: Ref<BreadcrumbSize>;
+};
+export declare const breadcrumbKey: InjectionKey<BreadcrumbContext>;

package/dist/runtime/app/components/Breadcrumb/Breadcrumb.context.js

@@ -0,0 +1 @@
+export const breadcrumbKey = Symbol("breadcrumb");

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

@@ -1,7 +1,19 @@
-import type { VunoBreadcrumbProps } from './Breadcrumb.types.js';
-declare const __VLS_export: import("vue").DefineComponent<VunoBreadcrumbProps, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<VunoBreadcrumbProps> & Readonly<{}>, {
-    ui: import("../../types/slots.js").VunoUi<"breadcrumb">;
-    loading: boolean;
+import type { BreadcrumbProps } from './Breadcrumb.types.js';
+declare var __VLS_1: {};
+type __VLS_Slots = {} & {
+    default?: (props: typeof __VLS_1) => any;
+};
+declare const __VLS_base: import("vue").DefineComponent<BreadcrumbProps, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<BreadcrumbProps> & Readonly<{}>, {
+    size: import("./Breadcrumb.types.js").BreadcrumbSize;
+    noTrailingSlash: boolean;
+    ui: import("../../types/slots.js").ComponentUi<"breadcrumb">;
+    ariaLabel: string;
 }, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
+declare const __VLS_export: __VLS_WithSlots<typeof __VLS_base, __VLS_Slots>;
 declare const _default: typeof __VLS_export;
 export default _default;
+type __VLS_WithSlots<T, S> = T & {
+    new (): {
+        $slots: S;
+    };
+};

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

@@ -1,15 +1,32 @@
 export declare const breadcrumbTheme: Record<"breadcrumb", {
     readonly slots: {
-        readonly collapsedItem: "hidden sm:flex";
-        readonly collapseIndicator: "shrink-0 text-sm font-medium text-vuno-muted sm:hidden";
-        readonly current: "flex min-w-0 items-center gap-1.5 truncate text-sm font-semibold text-vuno-strong";
+        readonly current: "flex items-center gap-1.5 text-(--vuno-text-primary)";
         readonly icon: "size-4 shrink-0";
-        readonly item: "flex min-w-0 items-center gap-1.5";
-        readonly link: "flex min-w-0 items-center gap-1.5 truncate rounded-sm text-sm font-medium text-vuno-muted transition-colors [--vuno-accent:var(--color-vuno-primary)] hover:text-vuno-body focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-(--vuno-accent)";
-        readonly list: "flex min-w-0 items-center gap-1.5 whitespace-nowrap";
+        readonly item: "relative flex items-center last:me-0";
+        readonly link: "whitespace-nowrap active:text-(--vuno-text-primary) active:decoration-current focus-visible:decoration-current aria-[current=page]:cursor-auto aria-[current=page]:text-(--vuno-text-primary) aria-[current=page]:hover:text-(--vuno-text-primary) aria-[current=page]:hover:no-underline";
+        readonly list: "m-0 flex list-none flex-wrap items-center p-0";
         readonly root: "min-w-0";
-        readonly separator: "size-4 shrink-0 text-vuno-subtle rtl:rotate-180";
-        readonly skeleton: "h-4 w-24 max-w-[35vw] animate-pulse rounded-full bg-vuno-surface-2 motion-reduce:animate-none";
-        readonly text: "flex min-w-0 items-center gap-1.5 truncate text-sm font-medium text-vuno-muted";
+        readonly separator: "after:text-(--vuno-text-primary) after:content-['/']";
+        readonly text: "flex items-center gap-1.5 text-(--vuno-link-primary)";
+    };
+    readonly variants: {
+        readonly noTrailingSlash: {
+            readonly false: {};
+            readonly true: {
+                readonly separator: "last:after:content-['']";
+            };
+        };
+        readonly size: {
+            readonly sm: {
+                readonly item: "me-1 text-xs";
+                readonly link: "min-w-3 justify-center text-xs";
+                readonly separator: "after:ms-1";
+            };
+            readonly md: {
+                readonly item: "me-2 text-sm/[1.125rem]";
+                readonly link: "text-sm/[1.125rem]";
+                readonly separator: "after:ms-2";
+            };
+        };
     };
 }>;

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

@@ -1,16 +1,36 @@
 import { defineTheme } from "#vuno/utils/theme";
 export const breadcrumbTheme = defineTheme("breadcrumb", {
   slots: {
-    collapsedItem: "hidden sm:flex",
-    collapseIndicator: "shrink-0 text-sm font-medium text-vuno-muted sm:hidden",
-    current: "flex min-w-0 items-center gap-1.5 truncate text-sm font-semibold text-vuno-strong",
+    current: "flex items-center gap-1.5 text-(--vuno-text-primary)",
     icon: "size-4 shrink-0",
-    item: "flex min-w-0 items-center gap-1.5",
-    link: "flex min-w-0 items-center gap-1.5 truncate rounded-sm text-sm font-medium text-vuno-muted transition-colors [--vuno-accent:var(--color-vuno-primary)] hover:text-vuno-body focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-(--vuno-accent)",
-    list: "flex min-w-0 items-center gap-1.5 whitespace-nowrap",
+    item: "relative flex items-center last:me-0",
+    /*
+     * La página actual sigue siendo un enlace cuando trae destino: lo que
+     * la neutraliza es el estilo, no la falta de ancla, y así la ruta
+     * conserva todas sus paradas de teclado.
+     */
+    link: "whitespace-nowrap active:text-(--vuno-text-primary) active:decoration-current focus-visible:decoration-current aria-[current=page]:cursor-auto aria-[current=page]:text-(--vuno-text-primary) aria-[current=page]:hover:text-(--vuno-text-primary) aria-[current=page]:hover:no-underline",
+    list: "m-0 flex list-none flex-wrap items-center p-0",
     root: "min-w-0",
-    separator: "size-4 shrink-0 text-vuno-subtle rtl:rotate-180",
-    skeleton: "h-4 w-24 max-w-[35vw] animate-pulse rounded-full bg-vuno-surface-2 motion-reduce:animate-none",
-    text: "flex min-w-0 items-center gap-1.5 truncate text-sm font-medium text-vuno-muted"
+    separator: "after:text-(--vuno-text-primary) after:content-['/']",
+    /* Un tramo sin destino que tampoco es la página actual se pinta como enlace. */
+    text: "flex items-center gap-1.5 text-(--vuno-link-primary)"
+  },
+  variants: {
+    noTrailingSlash: {
+      false: {},
+      true: { separator: "last:after:content-['']" }
+    },
+    size: {
+      /*
+       * El tipo se declara en el `li` —de donde lo heredan la barra y el
+       * texto actual— y otra vez en el enlace, porque `Link` trae el suyo
+       * y Vuno lo neutraliza con `font: inherit`. El interletrado no se
+       * declara aquí: el paso de cada tamaño con Inter se decide en un
+       * solo sitio y el breadcrumb lo hereda como cualquier otro.
+       */
+      sm: { item: "me-1 text-xs", link: "min-w-3 justify-center text-xs", separator: "after:ms-1" },
+      md: { item: "me-2 text-sm/[1.125rem]", link: "text-sm/[1.125rem]", separator: "after:ms-2" }
+    }
   }
 });

package/dist/runtime/app/components/Breadcrumb/Breadcrumb.types.d.ts

@@ -1,7 +1,12 @@
-import type { VunoBreadcrumbItem } from '#vuno/types/page';
-import type { VunoUi } from '#vuno/types/slots';
-export type VunoBreadcrumbProps = {
-    items: VunoBreadcrumbItem[];
-    loading?: boolean;
-    ui?: VunoUi<'breadcrumb'>;
+import type { ComponentUi } from '#vuno/types/slots';
+/**
+ * Los dos tamaños de Vuno: `sm` usa el token de tipo `label-01` —12 px sobre
+ * 16— y `md`, el predeterminado, usa `body-compact-01` —14 px sobre 18—.
+ */
+export type BreadcrumbSize = 'md' | 'sm';
+export type BreadcrumbProps = {
+    ariaLabel?: string;
+    noTrailingSlash?: boolean;
+    size?: BreadcrumbSize;
+    ui?: ComponentUi<'breadcrumb'>;
 };

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

@@ -1,109 +1,30 @@
 <script setup>
-import { useIcons, useMessages, useTheme } from "#vuno/composables/useTheme";
-import Icon from "#vuno/components/Icon/Icon.vue";
-import Text from "#vuno/components/Text/Text.vue";
-defineOptions({ name: "VunoBreadcrumb" });
+import { provide, toRef } from "vue";
+import { useMessages, useTheme } from "#vuno/composables/useTheme";
+import { breadcrumbKey } from "./Breadcrumb.context";
+defineOptions({ name: "Breadcrumb" });
 const props = defineProps({
-  items: { type: Array, required: true },
-  loading: { type: Boolean, required: false, default: false },
+  ariaLabel: { type: String, required: false, default: void 0 },
+  noTrailingSlash: { type: Boolean, required: false, default: false },
+  size: { type: String, required: false, default: "md" },
   ui: { type: Object, required: false, default: void 0 }
 });
-const icons = useIcons();
 const messages = useMessages();
-const ui = useTheme("breadcrumb", () => props.ui);
-function isCollapsedItem(index) {
-  return props.items.length > 3 && index < props.items.length - 2;
-}
+provide(breadcrumbKey, { noTrailingSlash: toRef(props, "noTrailingSlash"), size: toRef(props, "size") });
+const ui = useTheme(
+  "breadcrumb",
+  () => props.ui,
+  () => ({ noTrailingSlash: String(props.noTrailingSlash), size: props.size })
+);
 </script>
 
 <template>
     <nav
-        v-if="props.items.length"
-        :aria-busy="props.loading ? 'true' : void 0"
-        :aria-label="messages.breadcrumb"
+        :aria-label="props.ariaLabel ?? messages.breadcrumb"
         :class="ui.root"
     >
         <ol :class="ui.list">
-            <li
-                v-if="props.items.length > 3"
-                aria-hidden="true"
-                :class="[ui.item, ui.collapseIndicator]"
-            >
-                …
-            </li>
-
-            <li
-                v-for="(item, index) in props.items"
-                :key="`${index}:${item.to ?? ''}:${item.label}`"
-                :class="[ui.item, isCollapsedItem(index) ? ui.collapsedItem : void 0]"
-            >
-                <Icon
-                    v-if="index > 0"
-                    aria-hidden="true"
-                    :class="ui.separator"
-                    :name="icons.breadcrumbSeparator"
-                />
-
-                <Text
-                    v-if="index === props.items.length - 1"
-                    :aria-busy="props.loading ? 'true' : void 0"
-                    aria-current="page"
-                    :aria-label="props.loading ? item.label : void 0"
-                    :class="ui.current"
-                    tag="span"
-                    tone="inherit"
-                    variant="inherit"
-                >
-                    <Text
-                        v-if="props.loading"
-                        aria-hidden="true"
-                        :class="ui.skeleton"
-                        tag="span"
-                        tone="inherit"
-                        variant="inherit"
-                    />
-
-                    <template v-else>
-                        <Icon
-                            v-if="item.icon"
-                            aria-hidden="true"
-                            :class="ui.icon"
-                            :name="item.icon"
-                        />
-                        {{ item.label }}
-                    </template>
-                </Text>
-
-                <NuxtLink
-                    v-else-if="item.to"
-                    :class="ui.link"
-                    :to="item.to"
-                >
-                    <Icon
-                        v-if="item.icon"
-                        aria-hidden="true"
-                        :class="ui.icon"
-                        :name="item.icon"
-                    />
-                    {{ item.label }}
-                </NuxtLink>
-
-                <Text
-                    v-else
-                    :class="ui.text"
-                    tag="span"
-                    tone="inherit"
-                    variant="inherit"
-                >
-                    <Icon
-                        v-if="item.icon"
-                        aria-hidden="true"
-                        :class="ui.icon"
-                        :name="item.icon"
-                    />
-                    {{ item.label }}
-                </Text>
-            </li>
+            <slot />
         </ol>
     </nav>
 </template>

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

@@ -1,7 +1,19 @@
-import type { VunoBreadcrumbProps } from './Breadcrumb.types.js';
-declare const __VLS_export: import("vue").DefineComponent<VunoBreadcrumbProps, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<VunoBreadcrumbProps> & Readonly<{}>, {
-    ui: import("../../types/slots.js").VunoUi<"breadcrumb">;
-    loading: boolean;
+import type { BreadcrumbProps } from './Breadcrumb.types.js';
+declare var __VLS_1: {};
+type __VLS_Slots = {} & {
+    default?: (props: typeof __VLS_1) => any;
+};
+declare const __VLS_base: import("vue").DefineComponent<BreadcrumbProps, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<BreadcrumbProps> & Readonly<{}>, {
+    size: import("./Breadcrumb.types.js").BreadcrumbSize;
+    noTrailingSlash: boolean;
+    ui: import("../../types/slots.js").ComponentUi<"breadcrumb">;
+    ariaLabel: string;
 }, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
+declare const __VLS_export: __VLS_WithSlots<typeof __VLS_base, __VLS_Slots>;
 declare const _default: typeof __VLS_export;
 export default _default;
+type __VLS_WithSlots<T, S> = T & {
+    new (): {
+        $slots: S;
+    };
+};

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

@@ -0,0 +1,27 @@
+import type { BreadcrumbItemProps } from './BreadcrumbItem.types.js';
+declare var __VLS_1: {}, __VLS_14: {}, __VLS_21: {};
+type __VLS_Slots = {} & {
+    default?: (props: typeof __VLS_1) => any;
+} & {
+    default?: (props: typeof __VLS_14) => any;
+} & {
+    default?: (props: typeof __VLS_21) => any;
+};
+declare const __VLS_base: import("vue").DefineComponent<BreadcrumbItemProps, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<BreadcrumbItemProps> & Readonly<{}>, {
+    disabled: boolean;
+    icon: string;
+    overflow: boolean;
+    to: string;
+    ui: import("../../types/slots.js").ComponentUi<"breadcrumb">;
+    href: string;
+    ariaCurrent: import("./BreadcrumbItem.types.js").BreadcrumbItemCurrent;
+    isCurrentPage: boolean;
+}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
+declare const __VLS_export: __VLS_WithSlots<typeof __VLS_base, __VLS_Slots>;
+declare const _default: typeof __VLS_export;
+export default _default;
+type __VLS_WithSlots<T, S> = T & {
+    new (): {
+        $slots: S;
+    };
+};

package/dist/runtime/app/components/BreadcrumbItem/BreadcrumbItem.types.d.ts

@@ -0,0 +1,13 @@
+import type { ComponentUi } from '#vuno/types/slots';
+/** Valores de `aria-current` que Vuno admite en un elemento de la ruta. */
+export type BreadcrumbItemCurrent = 'date' | 'location' | 'page' | 'step' | 'time';
+export type BreadcrumbItemProps = {
+    ariaCurrent?: BreadcrumbItemCurrent;
+    disabled?: boolean;
+    href?: string;
+    icon?: string;
+    isCurrentPage?: boolean;
+    overflow?: boolean;
+    to?: string;
+    ui?: ComponentUi<'breadcrumb'>;
+};