@groupteknology/vuno 3.0.0 → 4.0.0

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

@@ -1,51 +0,0 @@
-<script setup>
-import { useTheme } from "#vuno/composables/useTheme";
-import { filled } from "#vuno/utils/slots";
-defineOptions({ name: "VunoCard" });
-const props = defineProps({
-  color: { type: String, required: false, default: "neutral" },
-  radius: { type: String, required: false, default: void 0 },
-  tag: { type: null, required: false, default: "div" },
-  ui: { type: Object, required: false, default: void 0 },
-  variant: { type: String, required: false, default: "outline" }
-});
-const slots = defineSlots();
-const ui = useTheme(
-  "card",
-  () => props.ui,
-  () => ({ color: props.color, radius: props.radius, variant: props.variant })
-);
-</script>
-
-<template>
-    <component
-        :is="props.tag"
-        :class="ui.root"
-    >
-        <div
-            v-if="filled(slots.header)"
-            :class="ui.header"
-        >
-            <slot name="header" />
-        </div>
-
-        <div
-            v-if="filled(slots.default) || filled(slots.footer)"
-            :class="ui.primary"
-        >
-            <div
-                v-if="filled(slots.default)"
-                :class="ui.body"
-            >
-                <slot />
-            </div>
-
-            <div
-                v-if="filled(slots.footer)"
-                :class="ui.footer"
-            >
-                <slot name="footer" />
-            </div>
-        </div>
-    </component>
-</template>

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

@@ -1,32 +0,0 @@
-import type { VunoCardProps } from './Card.types.js';
-/**
- * Las tres regiones se pintan solo si se rellenan.
- *
- * Sin esto, una tarjeta con solo cuerpo arrastraría una cabecera vacía con su
- * relleno y su línea divisoria: un hueco y una raya que no separan nada. Se
- * ve raro y no falla, que es el peor modo de fallar.
- *
- * «Rellenada» es que produzca algo y no que esté declarada; lo decide
- * `filled`, que vive en `internal/` porque los layouts necesitan la misma
- * regla y dos copias de una regla divergen.
- */
-type __VLS_Slots = {
-    default?: () => unknown;
-    footer?: () => unknown;
-    header?: () => unknown;
-};
-declare const __VLS_base: import("vue").DefineComponent<VunoCardProps, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<VunoCardProps> & Readonly<{}>, {
-    color: import("../../types/base.js").VunoColor;
-    radius: import("./Card.types.js").VunoCardRadius;
-    variant: "outline" | "soft";
-    tag: import("vue").Component | string;
-    ui: import("../../types/slots.js").VunoUi<"card">;
-}, {}, {}, {}, 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/Code/Code.d.vue.ts

@@ -1,9 +0,0 @@
-import type { VunoCodeProps } from './Code.types.js';
-declare const __VLS_export: import("vue").DefineComponent<VunoCodeProps, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<VunoCodeProps> & Readonly<{}>, {
-    label: string;
-    ui: import("../../types/slots.js").VunoUi<"code">;
-    highlighted: string;
-    language: string;
-}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
-declare const _default: typeof __VLS_export;
-export default _default;

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

@@ -1,11 +0,0 @@
-export declare const codeTheme: Record<"code", {
-    readonly slots: {
-        readonly copy: "!absolute inset-e-2 top-1 opacity-0 transition-opacity group-hover:opacity-100 focus-visible:opacity-100 max-sm:top-0 max-sm:size-11 max-sm:opacity-100 pointer-coarse:top-0 pointer-coarse:size-11 pointer-coarse:opacity-100";
-        readonly copyError: "border-t border-vuno-error/25 bg-vuno-error/10 px-4 py-2 text-xs text-vuno-error";
-        readonly fallback: "text-vuno-body";
-        readonly header: "flex items-center gap-2 border-b border-vuno-border/70 px-4 py-2 font-mono text-xs text-vuno-muted";
-        readonly live: "sr-only";
-        readonly root: "group relative border-t border-vuno-border";
-        readonly scroller: "overflow-x-auto text-sm/relaxed [&_pre]:px-4 [&_pre]:py-3.5";
-    };
-}>;

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

@@ -1,12 +0,0 @@
-import { defineTheme } from "#vuno/utils/theme";
-export const codeTheme = defineTheme("code", {
-  slots: {
-    copy: "!absolute inset-e-2 top-1 opacity-0 transition-opacity group-hover:opacity-100 focus-visible:opacity-100 max-sm:top-0 max-sm:size-11 max-sm:opacity-100 pointer-coarse:top-0 pointer-coarse:size-11 pointer-coarse:opacity-100",
-    copyError: "border-t border-vuno-error/25 bg-vuno-error/10 px-4 py-2 text-xs text-vuno-error",
-    fallback: "text-vuno-body",
-    header: "flex items-center gap-2 border-b border-vuno-border/70 px-4 py-2 font-mono text-xs text-vuno-muted",
-    live: "sr-only",
-    root: "group relative border-t border-vuno-border",
-    scroller: "overflow-x-auto text-sm/relaxed [&_pre]:px-4 [&_pre]:py-3.5"
-  }
-});

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

@@ -1,8 +0,0 @@
-import type { VunoUi } from '#vuno/types/slots';
-export type VunoCodeProps = {
-    code: string;
-    highlighted?: string;
-    label?: string;
-    language?: string;
-    ui?: VunoUi<'code'>;
-};

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

@@ -1,116 +0,0 @@
-<script setup>
-import { computed, nextTick, onBeforeUnmount, onMounted, ref, useTemplateRef, watch } from "vue";
-import { useIcons, useMessages, useTheme } from "#vuno/composables/useTheme";
-import Button from "#vuno/components/Button/Button.vue";
-import Text from "#vuno/components/Text/Text.vue";
-defineOptions({ name: "VunoCode" });
-const props = defineProps({
-  code: { type: String, required: true },
-  highlighted: { type: String, required: false, default: void 0 },
-  label: { type: String, required: false, default: void 0 },
-  language: { type: String, required: false, default: "text" },
-  ui: { type: Object, required: false, default: void 0 }
-});
-const icons = useIcons();
-const messages = useMessages();
-const ui = useTheme("code", () => props.ui);
-const copied = ref(false);
-const copyFailed = ref(false);
-const overflows = ref(false);
-const scroller = useTemplateRef("scroller");
-const copyLabel = computed(() => {
-  const action = copied.value ? messages.value.codeCopied : messages.value.codeCopy;
-  return props.label ? `${action}: ${props.label}` : action;
-});
-let observer;
-let timer;
-function syncOverflow() {
-  const element = scroller.value;
-  overflows.value = !!element && element.scrollWidth > element.clientWidth + 1;
-}
-async function copy() {
-  copyFailed.value = false;
-  try {
-    await navigator.clipboard.writeText(props.code);
-  } catch {
-    copied.value = false;
-    copyFailed.value = true;
-    clearTimeout(timer);
-    return;
-  }
-  copied.value = true;
-  clearTimeout(timer);
-  timer = setTimeout(() => copied.value = false, 2e3);
-}
-watch(
-  () => [props.code, props.highlighted],
-  () => void nextTick(syncOverflow)
-);
-onMounted(() => {
-  syncOverflow();
-  observer = new ResizeObserver(syncOverflow);
-  if (scroller.value) observer.observe(scroller.value);
-});
-onBeforeUnmount(() => {
-  observer?.disconnect();
-  clearTimeout(timer);
-});
-</script>
-
-<template>
-    <div :class="ui.root">
-        <div :class="ui.header">{{ props.language }}</div>
-
-        <Button
-            :aria-label="copyLabel"
-            :class="ui.copy"
-            color="neutral"
-            :icon="copied ? icons.codeCopied : icons.codeCopy"
-            size="xs"
-            variant="soft"
-            @click="copy"
-        />
-
-        <div
-            ref="scroller"
-            :aria-label="overflows ? props.label ?? messages.codeRegion : void 0"
-            :class="ui.scroller"
-            :role="overflows ? 'region' : void 0"
-            :tabindex="overflows ? 0 : void 0"
-        >
-            <!-- El HTML viene de un resaltador elegido por quien consume el componente. -->
-            <!-- eslint-disable vue/no-v-html -->
-            <!-- nosemgrep: javascript.vue.security.audit.xss.templates.avoid-v-html.avoid-v-html -->
-            <div
-                v-if="props.highlighted"
-                v-html="props.highlighted"
-            />
-            <!-- eslint-enable vue/no-v-html -->
-
-            <pre
-                v-else
-                :class="ui.fallback"
-            ><Text tag="code" tone="inherit" variant="inherit">{{ props.code }}</Text></pre>
-        </div>
-
-        <Text
-            v-if="copyFailed"
-            :class="ui.copyError"
-            role="alert"
-            tag="p"
-            tone="inherit"
-            variant="inherit"
-        >
-            {{ messages.codeCopyFailed }}
-        </Text>
-
-        <Text
-            aria-live="polite"
-            :class="ui.live"
-            tag="span"
-            tone="inherit"
-            variant="inherit"
-            >{{ copied ? messages.codeCopiedAnnouncement : "" }}</Text
-        >
-    </div>
-</template>

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

@@ -1,9 +0,0 @@
-import type { VunoCodeProps } from './Code.types.js';
-declare const __VLS_export: import("vue").DefineComponent<VunoCodeProps, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<VunoCodeProps> & Readonly<{}>, {
-    label: string;
-    ui: import("../../types/slots.js").VunoUi<"code">;
-    highlighted: string;
-    language: string;
-}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
-declare const _default: typeof __VLS_export;
-export default _default;

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

@@ -1,31 +0,0 @@
-import type { VunoCollapsibleProps } from './Collapsible.types.js';
-type __VLS_Props = VunoCollapsibleProps;
-type __VLS_Slots = {
-    /** Contenido que permanece montado mientras está oculto. */
-    content?: (props: {
-        open: boolean;
-    }) => unknown;
-    /** Control interactivo que abre o cierra el contenido. */
-    default?: (props: {
-        open: boolean;
-    }) => unknown;
-};
-type __VLS_ModelProps = {
-    'open'?: boolean;
-};
-type __VLS_PublicProps = __VLS_Props & __VLS_ModelProps;
-declare const __VLS_base: import("vue").DefineComponent<__VLS_PublicProps, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
-    "update:open": (value: boolean) => any;
-}, string, import("vue").PublicProps, Readonly<__VLS_PublicProps> & Readonly<{
-    "onUpdate:open"?: ((value: boolean) => any) | undefined;
-}>, {
-    ui: import("../../types/slots.js").VunoUi<"collapsible">;
-}, {}, {}, {}, 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/Collapsible/Collapsible.theme.d.ts

@@ -1,6 +0,0 @@
-export declare const collapsibleTheme: Record<"collapsible", {
-    readonly slots: {
-        readonly content: "min-w-0";
-        readonly root: "relative";
-    };
-}>;

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

@@ -1,7 +0,0 @@
-import { defineTheme } from "#vuno/utils/theme";
-export const collapsibleTheme = defineTheme("collapsible", {
-  slots: {
-    content: "min-w-0",
-    root: "relative"
-  }
-});

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

@@ -1,4 +0,0 @@
-import type { VunoUi } from '#vuno/types/slots';
-export type VunoCollapsibleProps = {
-    ui?: VunoUi<'collapsible'>;
-};

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

@@ -1,72 +0,0 @@
-<script setup>
-import { gsap } from "gsap";
-import { cloneVNode, useId } from "vue";
-import { useTheme } from "#vuno/composables/useTheme";
-import { firstElement } from "#vuno/utils/slots";
-defineOptions({ name: "VunoCollapsible" });
-const open = defineModel("open", { type: Boolean, ...{ default: false } });
-const props = defineProps({
-  ui: { type: Object, required: false, default: void 0 }
-});
-const slots = defineSlots();
-const contentId = useId();
-const ui = useTheme("collapsible", () => props.ui);
-const Trigger = () => {
-  const node = firstElement(slots.default?.({ open: open.value }));
-  if (!node) return null;
-  return cloneVNode(node, {
-    onClick: () => open.value = !open.value,
-    "aria-controls": contentId,
-    "aria-expanded": open.value ? "true" : "false"
-  });
-};
-const onEnter = (el, done) => {
-  gsap.fromTo(
-    el,
-    {
-      height: 0,
-      opacity: 0
-    },
-    {
-      onComplete: done,
-      duration: 0.3,
-      ease: "power2.out",
-      height: "auto",
-      opacity: 1
-    }
-  );
-};
-const onLeave = (el, done) => {
-  gsap.to(el, {
-    onComplete: done,
-    duration: 0.25,
-    ease: "power2.in",
-    height: 0,
-    opacity: 0
-  });
-};
-</script>
-
-<template>
-    <div :class="ui.root">
-        <Trigger />
-
-        <Transition
-            :css="false"
-            @enter="onEnter"
-            @leave="onLeave"
-        >
-            <div
-                v-show="open"
-                :id="contentId"
-                :class="ui.content"
-                :hidden="!open"
-            >
-                <slot
-                    name="content"
-                    :open="open"
-                />
-            </div>
-        </Transition>
-    </div>
-</template>

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

@@ -1,31 +0,0 @@
-import type { VunoCollapsibleProps } from './Collapsible.types.js';
-type __VLS_Props = VunoCollapsibleProps;
-type __VLS_Slots = {
-    /** Contenido que permanece montado mientras está oculto. */
-    content?: (props: {
-        open: boolean;
-    }) => unknown;
-    /** Control interactivo que abre o cierra el contenido. */
-    default?: (props: {
-        open: boolean;
-    }) => unknown;
-};
-type __VLS_ModelProps = {
-    'open'?: boolean;
-};
-type __VLS_PublicProps = __VLS_Props & __VLS_ModelProps;
-declare const __VLS_base: import("vue").DefineComponent<__VLS_PublicProps, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
-    "update:open": (value: boolean) => any;
-}, string, import("vue").PublicProps, Readonly<__VLS_PublicProps> & Readonly<{
-    "onUpdate:open"?: ((value: boolean) => any) | undefined;
-}>, {
-    ui: import("../../types/slots.js").VunoUi<"collapsible">;
-}, {}, {}, {}, 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/ColorModeButton/ColorModeButton.d.vue.ts

@@ -1,12 +0,0 @@
-import type { VunoColorModeButtonProps } from './ColorModeButton.types.js';
-declare const __VLS_export: import("vue").DefineComponent<VunoColorModeButtonProps, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<VunoColorModeButtonProps> & Readonly<{}>, {
-    radius: import("../../types/base.js").VunoRadius;
-    size: import("./ColorModeButton.types.js").VunoColorModeButtonSize;
-    ui: import("../../types/slots.js").VunoUi<"button">;
-    darkIcon: string;
-    darkLabel: string;
-    lightIcon: string;
-    lightLabel: string;
-}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
-declare const _default: typeof __VLS_export;
-export default _default;

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

@@ -1,13 +0,0 @@
-import type { VunoRadius, VunoSize } from '#vuno/types/base';
-import type { VunoUi } from '#vuno/types/slots';
-export type VunoColorModeButtonSize = Extract<VunoSize, 'lg' | 'md' | 'sm' | 'xl' | 'xs'>;
-export type VunoColorModeButtonProps = {
-    darkIcon?: string;
-    darkLabel?: string;
-    disabled?: boolean;
-    lightIcon?: string;
-    lightLabel?: string;
-    radius?: VunoRadius;
-    size?: VunoColorModeButtonSize;
-    ui?: VunoUi<'button'>;
-};

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

@@ -1,55 +0,0 @@
-<script setup>
-import { computed } from "vue";
-import { useColorMode } from "#imports";
-import Button from "#vuno/components/Button/Button.vue";
-import Icon from "#vuno/components/Icon/Icon.vue";
-defineOptions({ name: "VunoColorModeButton" });
-const props = defineProps({
-  darkIcon: { type: String, required: false, default: "lucide:moon" },
-  darkLabel: { type: String, required: false, default: "Usar tema oscuro" },
-  disabled: { type: Boolean, required: false },
-  lightIcon: { type: String, required: false, default: "lucide:sun" },
-  lightLabel: { type: String, required: false, default: "Usar tema claro" },
-  radius: { type: String, required: false, default: void 0 },
-  size: { type: String, required: false, default: void 0 },
-  ui: { type: Object, required: false, default: void 0 }
-});
-const colorMode = useColorMode();
-const isDark = computed(() => colorMode.value === "dark");
-const iconClass = computed(() => ({ xs: "size-3", sm: "size-3.5", md: "size-4", lg: "size-4.5", xl: "size-5" })[props.size ?? "md"]);
-function toggleColorMode() {
-  colorMode.preference = isDark.value ? "light" : "dark";
-}
-</script>
-
-<template>
-    <Button
-        :aria-label="isDark ? props.lightLabel : props.darkLabel"
-        :aria-pressed="isDark"
-        :disabled="props.disabled"
-        :radius="props.radius"
-        shape="square"
-        :size="props.size"
-        :ui="props.ui"
-        variant="ghost"
-        @click="toggleColorMode"
-    >
-        <!--
-            Los dos iconos forman parte del HTML de SSR. La clase `dark`, que
-            `@nuxtjs/color-mode` resuelve antes de pintar, elige cuál se ve sin
-            esperar a que Vue hidrate y exponga el modo detectado.
-        -->
-        <span :class="[iconClass, 'dark:hidden']">
-            <Icon
-                class="size-full"
-                :name="props.darkIcon"
-            />
-        </span>
-        <span :class="[iconClass, 'hidden dark:block']">
-            <Icon
-                class="size-full"
-                :name="props.lightIcon"
-            />
-        </span>
-    </Button>
-</template>

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

@@ -1,12 +0,0 @@
-import type { VunoColorModeButtonProps } from './ColorModeButton.types.js';
-declare const __VLS_export: import("vue").DefineComponent<VunoColorModeButtonProps, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<VunoColorModeButtonProps> & Readonly<{}>, {
-    radius: import("../../types/base.js").VunoRadius;
-    size: import("./ColorModeButton.types.js").VunoColorModeButtonSize;
-    ui: import("../../types/slots.js").VunoUi<"button">;
-    darkIcon: string;
-    darkLabel: string;
-    lightIcon: string;
-    lightLabel: string;
-}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
-declare const _default: typeof __VLS_export;
-export default _default;

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

@@ -1,31 +0,0 @@
-import type { VunoConfirmProps } from './Confirm.types.js';
-type __VLS_Props = VunoConfirmProps;
-type __VLS_Slots = {
-    /**
-     * Sustituye a `description`. Para cuando el aviso es información que
-     * cambia la decisión —cuántos hijos quedan huérfanos, qué se pierde—
-     * y aplanarlo a una frase la escondería.
-     */
-    default?: () => unknown;
-};
-type __VLS_ModelProps = {
-    'open'?: boolean;
-};
-type __VLS_PublicProps = __VLS_Props & __VLS_ModelProps;
-declare const __VLS_base: import("vue").DefineComponent<__VLS_PublicProps, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
-    confirm: () => any;
-    cancel: () => any;
-    "update:open": (value: boolean) => any;
-}, string, import("vue").PublicProps, Readonly<__VLS_PublicProps> & Readonly<{
-    onConfirm?: (() => any) | undefined;
-    onCancel?: (() => any) | undefined;
-    "onUpdate:open"?: ((value: boolean) => any) | undefined;
-}>, {}, {}, {}, {}, 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/Confirm/Confirm.theme.d.ts

@@ -1,12 +0,0 @@
-export declare const confirmTheme: Record<"confirm", {
-    readonly slots: {
-        readonly body: "flex items-start gap-3";
-        readonly content: "";
-        readonly description: "min-w-0 space-y-1";
-        readonly footer: "justify-end";
-        readonly icon: "size-5 shrink-0 text-(--vuno-accent)";
-    };
-    readonly variants: {
-        readonly color: Record<import("../../types/base.js").VunoColor, Record<"icon", string>>;
-    };
-}>;

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

@@ -1,13 +0,0 @@
-import { accentByColor } from "#vuno/theme/shared";
-import { defineTheme } from "#vuno/utils/theme";
-export const confirmTheme = defineTheme("confirm", {
-  slots: {
-    body: "flex items-start gap-3",
-    content: "",
-    description: "min-w-0 space-y-1",
-    footer: "justify-end",
-    // Mismo caso que el aviso: el color por variable, no por nombre.
-    icon: "size-5 shrink-0 text-(--vuno-accent)"
-  },
-  variants: { color: accentByColor("icon") }
-});

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

@@ -1,6 +0,0 @@
-import type { VunoConfirmOptions } from '#vuno/types/confirm';
-import type { VunoUi } from '#vuno/types/slots';
-export type VunoConfirmProps = VunoConfirmOptions & {
-    loading?: boolean;
-    ui?: VunoUi<'confirm'>;
-};