@nuxt/ui 2.18.4 → 3.0.0-alpha.1

package/dist/runtime/components/elements/Avatar.vue.d.ts

@@ -1,255 +0,0 @@
-import type { PropType } from 'vue';
-import type { AvatarSize, AvatarChipColor, AvatarChipPosition, Strategy } from '../../types/index.js';
-declare const config: {
-    wrapper: string;
-    background: string;
-    rounded: string;
-    text: string;
-    placeholder: string;
-    size: {
-        '3xs': string;
-        '2xs': string;
-        xs: string;
-        sm: string;
-        md: string;
-        lg: string;
-        xl: string;
-        '2xl': string;
-        '3xl': string;
-    };
-    chip: {
-        base: string;
-        background: string;
-        position: {
-            'top-right': string;
-            'bottom-right': string;
-            'top-left': string;
-            'bottom-left': string;
-        };
-        size: {
-            '3xs': string;
-            '2xs': string;
-            xs: string;
-            sm: string;
-            md: string;
-            lg: string;
-            xl: string;
-            '2xl': string;
-            '3xl': string;
-        };
-    };
-    icon: {
-        base: string;
-        size: {
-            '3xs': string;
-            '2xs': string;
-            xs: string;
-            sm: string;
-            md: string;
-            lg: string;
-            xl: string;
-            '2xl': string;
-            '3xl': string;
-        };
-    };
-    default: {
-        size: string;
-        icon: any;
-        chipColor: any;
-        chipPosition: string;
-    };
-};
-declare const _default: import("vue").DefineComponent<{
-    as: {
-        type: (StringConstructor | ObjectConstructor)[];
-        default: string;
-    };
-    src: {
-        type: (StringConstructor | BooleanConstructor)[];
-        default: any;
-    };
-    alt: {
-        type: StringConstructor;
-        default: any;
-    };
-    text: {
-        type: StringConstructor;
-        default: any;
-    };
-    icon: {
-        type: StringConstructor;
-        default: () => any;
-    };
-    size: {
-        type: PropType<AvatarSize>;
-        default: () => string;
-        validator(value: string): boolean;
-    };
-    chipColor: {
-        type: PropType<AvatarChipColor>;
-        default: () => any;
-        validator(value: string): boolean;
-    };
-    chipPosition: {
-        type: PropType<AvatarChipPosition>;
-        default: () => string;
-        validator(value: string): boolean;
-    };
-    chipText: {
-        type: (StringConstructor | NumberConstructor)[];
-        default: any;
-    };
-    imgClass: {
-        type: StringConstructor;
-        default: string;
-    };
-    class: {
-        type: PropType<any>;
-        default: () => "";
-    };
-    ui: {
-        type: PropType<Partial<typeof config> & {
-            strategy?: Strategy;
-        }>;
-        default: () => {};
-    };
-}, {
-    ui: import("vue").ComputedRef<{
-        wrapper: string;
-        background: string;
-        rounded: string;
-        text: string;
-        placeholder: string;
-        size: {
-            '3xs': string;
-            '2xs': string;
-            xs: string;
-            sm: string;
-            md: string;
-            lg: string;
-            xl: string;
-            '2xl': string;
-            '3xl': string;
-        };
-        chip: {
-            base: string;
-            background: string;
-            position: {
-                'top-right': string;
-                'bottom-right': string;
-                'top-left': string;
-                'bottom-left': string;
-            };
-            size: {
-                '3xs': string;
-                '2xs': string;
-                xs: string;
-                sm: string;
-                md: string;
-                lg: string;
-                xl: string;
-                '2xl': string;
-                '3xl': string;
-            };
-        };
-        icon: {
-            base: string;
-            size: {
-                '3xs': string;
-                '2xs': string;
-                xs: string;
-                sm: string;
-                md: string;
-                lg: string;
-                xl: string;
-                '2xl': string;
-                '3xl': string;
-            };
-        };
-        default: {
-            size: string;
-            icon: any;
-            chipColor: any;
-            chipPosition: string;
-        };
-    }>;
-    attrs: import("vue").ComputedRef<Pick<{
-        [x: string]: unknown;
-    }, string>>;
-    wrapperClass: import("vue").ComputedRef<string>;
-    imgClass: import("vue").ComputedRef<string>;
-    iconClass: import("vue").ComputedRef<string>;
-    chipClass: import("vue").ComputedRef<string>;
-    url: import("vue").ComputedRef<string>;
-    placeholder: import("vue").ComputedRef<string>;
-    error: import("vue").Ref<boolean>;
-    onError: () => void;
-}, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<{
-    as: {
-        type: (StringConstructor | ObjectConstructor)[];
-        default: string;
-    };
-    src: {
-        type: (StringConstructor | BooleanConstructor)[];
-        default: any;
-    };
-    alt: {
-        type: StringConstructor;
-        default: any;
-    };
-    text: {
-        type: StringConstructor;
-        default: any;
-    };
-    icon: {
-        type: StringConstructor;
-        default: () => any;
-    };
-    size: {
-        type: PropType<AvatarSize>;
-        default: () => string;
-        validator(value: string): boolean;
-    };
-    chipColor: {
-        type: PropType<AvatarChipColor>;
-        default: () => any;
-        validator(value: string): boolean;
-    };
-    chipPosition: {
-        type: PropType<AvatarChipPosition>;
-        default: () => string;
-        validator(value: string): boolean;
-    };
-    chipText: {
-        type: (StringConstructor | NumberConstructor)[];
-        default: any;
-    };
-    imgClass: {
-        type: StringConstructor;
-        default: string;
-    };
-    class: {
-        type: PropType<any>;
-        default: () => "";
-    };
-    ui: {
-        type: PropType<Partial<typeof config> & {
-            strategy?: Strategy;
-        }>;
-        default: () => {};
-    };
-}>>, {
-    size: AvatarSize;
-    class: any;
-    as: string | Record<string, any>;
-    text: string;
-    alt: string;
-    ui: {};
-    icon: string;
-    src: string | boolean;
-    chipColor: AvatarChipColor;
-    chipPosition: "top-right" | "bottom-right" | "top-left" | "bottom-left";
-    chipText: string | number;
-    imgClass: string;
-}, {}>;
-export default _default;

package/dist/runtime/components/elements/AvatarGroup.d.ts

@@ -1,56 +0,0 @@
-import type { PropType } from 'vue';
-import type { AvatarSize, Strategy } from '../../types/index.js';
-declare const avatarGroupConfig: {
-    wrapper: string;
-    ring: string;
-    margin: string;
-};
-declare const _default: import("@vue/runtime-core").DefineComponent<{
-    size: {
-        type: PropType<AvatarSize>;
-        default: any;
-        validator(value: string): boolean;
-    };
-    max: {
-        type: NumberConstructor;
-        default: any;
-    };
-    class: {
-        type: PropType<any>;
-        default: () => "";
-    };
-    ui: {
-        type: PropType<Partial<typeof avatarGroupConfig> & {
-            strategy?: Strategy;
-        }>;
-        default: () => {};
-    };
-}, () => import("@vue/runtime-core").VNode<import("@vue/runtime-core").RendererNode, import("@vue/runtime-core").RendererElement, {
-    [key: string]: any;
-}>, unknown, {}, {}, import("@vue/runtime-core").ComponentOptionsMixin, import("@vue/runtime-core").ComponentOptionsMixin, {}, string, import("@vue/runtime-core").PublicProps, Readonly<import("@vue/runtime-core").ExtractPropTypes<{
-    size: {
-        type: PropType<AvatarSize>;
-        default: any;
-        validator(value: string): boolean;
-    };
-    max: {
-        type: NumberConstructor;
-        default: any;
-    };
-    class: {
-        type: PropType<any>;
-        default: () => "";
-    };
-    ui: {
-        type: PropType<Partial<typeof avatarGroupConfig> & {
-            strategy?: Strategy;
-        }>;
-        default: () => {};
-    };
-}>>, {
-    size: AvatarSize;
-    ui: {};
-    class: any;
-    max: number;
-}, {}>;
-export default _default;

package/dist/runtime/components/elements/AvatarGroup.js

@@ -1,58 +0,0 @@
-import { h, cloneVNode, computed, toRef, defineComponent } from "vue";
-import { twMerge, twJoin } from "tailwind-merge";
-import UAvatar from "./Avatar.vue";
-import { useUI } from "../../composables/useUI.js";
-import { mergeConfig, getSlotsChildren } from "../../utils/index.js";
-import appConfig from "#build/app.config";
-import { avatar, avatarGroup } from "#ui/ui.config";
-const avatarConfig = mergeConfig(appConfig.ui.strategy, appConfig.ui.avatar, avatar);
-const avatarGroupConfig = mergeConfig(appConfig.ui.strategy, appConfig.ui.avatarGroup, avatarGroup);
-export default defineComponent({
-  inheritAttrs: false,
-  props: {
-    size: {
-      type: String,
-      default: null,
-      validator(value) {
-        return Object.keys(avatarConfig.size).includes(value);
-      }
-    },
-    max: {
-      type: Number,
-      default: null
-    },
-    class: {
-      type: [String, Object, Array],
-      default: () => ""
-    },
-    ui: {
-      type: Object,
-      default: () => ({})
-    }
-  },
-  setup(props, { slots }) {
-    const { ui, attrs } = useUI("avatarGroup", toRef(props, "ui"), avatarGroupConfig, toRef(props, "class"));
-    const children = computed(() => getSlotsChildren(slots));
-    const max = computed(() => typeof props.max === "string" ? parseInt(props.max, 10) : props.max);
-    const clones = computed(() => children.value.map((node, index) => {
-      const vProps = {};
-      if (!props.max || max.value && index < max.value) {
-        if (props.size) {
-          vProps.size = props.size;
-        }
-        vProps.class = node.props.class || "";
-        vProps.class = twMerge(twJoin(vProps.class, ui.value.ring, ui.value.margin), vProps.class);
-        return cloneVNode(node, vProps);
-      }
-      if (max.value !== void 0 && index === max.value) {
-        return h(UAvatar, {
-          size: props.size || avatarConfig.default.size,
-          text: `+${children.value.length - max.value}`,
-          class: twJoin(ui.value.ring, ui.value.margin)
-        });
-      }
-      return null;
-    }).filter(Boolean).reverse());
-    return () => h("div", { class: ui.value.wrapper, ...attrs.value }, clones.value);
-  }
-});

package/dist/runtime/components/elements/Badge.vue

@@ -1,75 +0,0 @@
-<template>
-  <span :class="badgeClass" v-bind="attrs">
-    <slot>{{ label }}</slot>
-  </span>
-</template>
-
-<script>
-import { computed, toRef, defineComponent } from "vue";
-import { twMerge, twJoin } from "tailwind-merge";
-import { useUI } from "../../composables/useUI";
-import { mergeConfig } from "../../utils";
-import { useInjectButtonGroup } from "../../composables/useButtonGroup";
-import appConfig from "#build/app.config";
-import { badge } from "#ui/ui.config";
-const config = mergeConfig(appConfig.ui.strategy, appConfig.ui.badge, badge);
-export default defineComponent({
-  inheritAttrs: false,
-  props: {
-    size: {
-      type: String,
-      default: () => config.default.size,
-      validator(value) {
-        return Object.keys(config.size).includes(value);
-      }
-    },
-    color: {
-      type: String,
-      default: () => config.default.color,
-      validator(value) {
-        return [...appConfig.ui.colors, ...Object.keys(config.color)].includes(value);
-      }
-    },
-    variant: {
-      type: String,
-      default: () => config.default.variant,
-      validator(value) {
-        return [
-          ...Object.keys(config.variant),
-          ...Object.values(config.color).flatMap((value2) => Object.keys(value2))
-        ].includes(value);
-      }
-    },
-    label: {
-      type: [String, Number],
-      default: null
-    },
-    class: {
-      type: [String, Object, Array],
-      default: () => ""
-    },
-    ui: {
-      type: Object,
-      default: () => ({})
-    }
-  },
-  setup(props) {
-    const { ui, attrs } = useUI("badge", toRef(props, "ui"), config);
-    const { size, rounded } = useInjectButtonGroup({ ui, props });
-    const badgeClass = computed(() => {
-      const variant = ui.value.color?.[props.color]?.[props.variant] || ui.value.variant[props.variant];
-      return twMerge(twJoin(
-        ui.value.base,
-        ui.value.font,
-        rounded.value,
-        ui.value.size[size.value],
-        variant?.replaceAll("{color}", props.color)
-      ), props.class);
-    });
-    return {
-      attrs,
-      badgeClass
-    };
-  }
-});
-</script>

package/dist/runtime/components/elements/Badge.vue.d.ts

@@ -1,109 +0,0 @@
-import type { PropType } from 'vue';
-import type { BadgeColor, BadgeSize, BadgeVariant, Strategy } from '../../types/index.js';
-declare const config: {
-    base: string;
-    rounded: string;
-    font: string;
-    size: {
-        xs: string;
-        sm: string;
-        md: string;
-        lg: string;
-    };
-    color: {
-        white: {
-            solid: string;
-        };
-        gray: {
-            solid: string;
-        };
-        black: {
-            solid: string;
-        };
-    };
-    variant: {
-        solid: string;
-        outline: string;
-        soft: string;
-        subtle: string;
-    };
-    default: {
-        size: string;
-        variant: string;
-        color: string;
-    };
-};
-declare const _default: import("vue").DefineComponent<{
-    size: {
-        type: PropType<BadgeSize>;
-        default: () => string;
-        validator(value: string): boolean;
-    };
-    color: {
-        type: PropType<BadgeColor>;
-        default: () => string;
-        validator(value: string): boolean;
-    };
-    variant: {
-        type: PropType<BadgeVariant>;
-        default: () => string;
-        validator(value: string): boolean;
-    };
-    label: {
-        type: (StringConstructor | NumberConstructor)[];
-        default: any;
-    };
-    class: {
-        type: PropType<any>;
-        default: () => "";
-    };
-    ui: {
-        type: PropType<Partial<typeof config> & {
-            strategy?: Strategy;
-        }>;
-        default: () => {};
-    };
-}, {
-    attrs: import("vue").ComputedRef<Pick<{
-        [x: string]: unknown;
-    }, string>>;
-    badgeClass: import("vue").ComputedRef<string>;
-}, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<{
-    size: {
-        type: PropType<BadgeSize>;
-        default: () => string;
-        validator(value: string): boolean;
-    };
-    color: {
-        type: PropType<BadgeColor>;
-        default: () => string;
-        validator(value: string): boolean;
-    };
-    variant: {
-        type: PropType<BadgeVariant>;
-        default: () => string;
-        validator(value: string): boolean;
-    };
-    label: {
-        type: (StringConstructor | NumberConstructor)[];
-        default: any;
-    };
-    class: {
-        type: PropType<any>;
-        default: () => "";
-    };
-    ui: {
-        type: PropType<Partial<typeof config> & {
-            strategy?: Strategy;
-        }>;
-        default: () => {};
-    };
-}>>, {
-    size: BadgeSize;
-    class: any;
-    color: BadgeColor;
-    variant: BadgeVariant;
-    label: string | number;
-    ui: {};
-}, {}>;
-export default _default;