@byyuurin/ui 0.2.0 → 0.3.0

package/dist/runtime/components/Tree.vue.d.ts

@@ -0,0 +1,121 @@
+import type { VariantProps } from '@byyuurin/ui-kit';
+import type { TreeItemProps, TreeItemSelectEvent, TreeItemToggleEvent, TreeRootEmits, TreeRootProps } from 'reka-ui';
+import theme from '#build/ui/tree';
+import type { ComponentBaseProps, ComponentStyler, ComponentUIProps, IconProps } from '../types';
+import type { DynamicSlots, GetItemKeys, StaticSlot } from '../types/utils';
+export interface TreeItem extends ComponentBaseProps {
+    icon?: IconProps['name'];
+    label?: string;
+    trailingIcon?: IconProps['name'];
+    defaultExpanded?: boolean;
+    disabled?: boolean;
+    slot?: string;
+    children?: TreeItem[];
+    onToggle?: (e: TreeItemToggleEvent<TreeItem>) => void;
+    onSelect?: (e: TreeItemSelectEvent<TreeItem>) => void;
+    ui?: Pick<ComponentUIProps<typeof theme>, 'item' | 'itemWithChildren' | 'link' | 'linkLeadingIcon' | 'linkLabel' | 'linkTrailing' | 'linkTrailingIcon' | 'listWithChildren'>;
+    [key: string]: any;
+}
+type ThemeVariants = VariantProps<typeof theme>;
+export interface TreeProps<T extends TreeItem[] = TreeItem[], M extends boolean = false> extends ComponentBaseProps, Pick<TreeRootProps<T>, 'expanded' | 'defaultExpanded' | 'selectionBehavior' | 'propagateSelect' | 'disabled' | 'bubbleSelect'> {
+    /**
+     * The element or component this component should render as.
+     * @default "ul"
+     */
+    as?: TreeRootProps<T>['as'] | {
+        root?: TreeRootProps<T>['as'];
+        link: TreeItemProps<T>['as'];
+    };
+    /** @default "primary" */
+    color?: ThemeVariants['color'];
+    /** @default "md" */
+    size?: ThemeVariants['size'];
+    /** This function is passed the index of each item and should return a unique key for that item */
+    getKey?: (val: T[number]) => string;
+    /**
+     * The key used to get the label from the item.
+     * @default "label"
+     */
+    labelKey?: GetItemKeys<T>;
+    /**
+     * The icon displayed on the right side of a parent node.
+     * @default app.icons.chevronDown
+     */
+    trailingIcon?: IconProps['name'];
+    /**
+     * The icon displayed when a parent node is expanded.
+     * @default app.icons.folderOpen
+     */
+    expandedIcon?: IconProps['name'];
+    /**
+     * The icon displayed when a parent node is collapsed.
+     * @default app.icons.folder
+     */
+    collapsedIcon?: IconProps['name'];
+    items?: T;
+    /** The controlled value of the Tree. Can be bind as `v-model`. */
+    modelValue?: M extends true ? T[number][] : T[number];
+    /** The value of the Tree when initially rendered. Use when you do not need to control the state of the Tree. */
+    defaultValue?: M extends true ? T[number][] : T[number];
+    /** Whether multiple options can be selected or not. */
+    multiple?: M & boolean;
+    /**
+     * Use nested DOM structure (children inside parents) vs flattened structure (all items at same level).
+     * @default true
+     */
+    nested?: boolean;
+    onSelect?: (e: TreeItemSelectEvent<T[number]>, item: T[number]) => void;
+    onToggle?: (e: TreeItemToggleEvent<T[number]>, item: T[number]) => void;
+    ui?: ComponentUIProps<typeof theme>;
+}
+export type TreeEmits<T extends TreeItem[] = TreeItem[], M extends boolean = false> = TreeRootEmits<T[number], M>;
+type SlotProps<T extends TreeItem> = StaticSlot<{
+    item: T;
+    index: number;
+    level: number;
+    expanded: boolean;
+    selected: boolean;
+    indeterminate: boolean | undefined;
+    handleSelect: () => void;
+    handleToggle: () => void;
+    ui: ComponentStyler<typeof theme>;
+}>;
+export type TreeSlots<T extends TreeItem[] = TreeItem[]> = {
+    'item-wrapper': SlotProps<T[number]>;
+    'item': SlotProps<T[number]>;
+    'item-leading': SlotProps<T[number]>;
+    'item-label': SlotProps<T[number]>;
+    'item-trailing': SlotProps<T[number]>;
+} & DynamicSlots<T[number], undefined, {
+    index: number;
+    level: number;
+    expanded: boolean;
+    ui: ComponentStyler<typeof theme>;
+    selected: boolean;
+    indeterminate: boolean | undefined;
+    handleSelect: () => void;
+    handleToggle: () => void;
+}>;
+declare const _default: typeof __VLS_export;
+export default _default;
+declare const __VLS_export: <T extends TreeItem[], M extends boolean = false>(__VLS_props: NonNullable<Awaited<typeof __VLS_setup>>["props"], __VLS_ctx?: __VLS_PrettifyLocal<Pick<NonNullable<Awaited<typeof __VLS_setup>>, "attrs" | "emit" | "slots">>, __VLS_exposed?: NonNullable<Awaited<typeof __VLS_setup>>["expose"], __VLS_setup?: Promise<{
+    props: import("vue").PublicProps & __VLS_PrettifyLocal<TreeProps<T, M> & {
+        "onUpdate:modelValue"?: ((val: M extends true ? T[number][] : T[number]) => any) | undefined;
+        "onUpdate:expanded"?: ((val: string[]) => any) | undefined;
+    }> & (typeof globalThis extends {
+        __VLS_PROPS_FALLBACK: infer P;
+    } ? P : {});
+    expose: (exposed: import("vue").ShallowUnwrapRef<{
+        readonly $el: HTMLElement;
+    }>) => void;
+    attrs: any;
+    slots: TreeSlots<T>;
+    emit: ((evt: "update:modelValue", val: M extends true ? T[number][] : T[number]) => void) & ((evt: "update:expanded", val: string[]) => void);
+}>) => import("vue").VNode & {
+    __ctx?: Awaited<typeof __VLS_setup>;
+};
+type __VLS_PrettifyLocal<T> = (T extends any ? {
+    [K in keyof T]: T[K];
+} : {
+    [K in keyof T as K]: T[K];
+}) & {};

package/dist/runtime/composables/defineShortcuts.d.ts

@@ -10,6 +10,7 @@ export interface ShortcutsConfig {
 }
 export interface ShortcutsOptions {
     chainDelay?: number;
+    layoutIndependent?: boolean;
 }
 export declare function extractShortcuts(items: any[] | any[][]): Record<string, Handler>;
 export declare function defineShortcuts(config: MaybeRef<ShortcutsConfig>, options?: ShortcutsOptions): import("@vueuse/core").Fn;

package/dist/runtime/composables/defineShortcuts.js

@@ -3,7 +3,28 @@ import { computed, ref, toValue } from "vue";
 import { useKbd } from "./useKbd.js";
 const chainedShortcutRegex = /^[^-]+.*-.*[^-]+$/;
 const combinedShortcutRegex = /^[^_]+.*_.*[^_]+$/;
-const shiftableKeys = /* @__PURE__ */ new Set(["arrowleft", "arrowright", "arrowup", "arrowright", "tab", "escape", "enter", "backspace"]);
+const shiftableKeys = ["arrowleft", "arrowright", "arrowup", "arrowright", "tab", "escape", "enter", "backspace"];
+function convertKeyToCode(key) {
+  if (/^[a-z]$/i.test(key))
+    return `Key${key.toUpperCase()}`;
+  if (/^\d$/.test(key))
+    return `Digit${key}`;
+  if (/^f\d+$/i.test(key))
+    return key.toUpperCase();
+  const specialKeys = {
+    space: "Space",
+    enter: "Enter",
+    escape: "Escape",
+    tab: "Tab",
+    backspace: "Backspace",
+    delete: "Delete",
+    arrowup: "ArrowUp",
+    arrowdown: "ArrowDown",
+    arrowleft: "ArrowLeft",
+    arrowright: "ArrowRight"
+  };
+  return specialKeys[key.toLowerCase()] || key;
+}
 export function extractShortcuts(items) {
   const shortcuts = {};
   function traverse(items2) {
@@ -29,6 +50,8 @@ export function defineShortcuts(config, options = {}) {
   const debouncedClearChainedInput = useDebounceFn(clearChainedInput, options.chainDelay ?? 800);
   const { macOS } = useKbd();
   const activeElement = useActiveElement();
+  const layoutIndependent = options.layoutIndependent ?? false;
+  const shiftableCodes = new Set(shiftableKeys.map((k) => convertKeyToCode(k)));
   const usingInput = computed(() => {
     const tagName = activeElement.value?.tagName;
     const contentEditable = activeElement.value?.contentEditable;
@@ -48,8 +71,13 @@ export function defineShortcuts(config, options = {}) {
         console.trace(`[Shortcut] Invalid key: "${key}"`);
       const chained = key.includes("-") && key !== "-" && !key.includes("_");
       if (chained) {
+        let shortcutKey = key.toLowerCase();
+        if (layoutIndependent) {
+          const parts = key.split("-").map((p) => convertKeyToCode(p));
+          shortcutKey = parts.join("-");
+        }
         shortcut = {
-          key: key.toLowerCase(),
+          key: shortcutKey,
           metaKey: false,
           ctrlKey: false,
           shiftKey: false,
@@ -57,8 +85,11 @@ export function defineShortcuts(config, options = {}) {
         };
       } else {
         const keySplit = key.toLowerCase().split("_").map((k) => k);
+        let baseKey = keySplit.filter((k) => !["meta", "command", "ctrl", "shift", "alt", "option"].includes(k)).join("_");
+        if (layoutIndependent)
+          baseKey = convertKeyToCode(baseKey);
         shortcut = {
-          key: keySplit.filter((k) => !["meta", "command", "ctrl", "shift", "alt", "option"].includes(k)).join("_"),
+          key: baseKey,
           metaKey: keySplit.includes("meta") || keySplit.includes("command"),
           ctrlKey: keySplit.includes("ctrl"),
           shiftKey: keySplit.includes("shift"),
@@ -90,10 +121,10 @@ export function defineShortcuts(config, options = {}) {
   const onKeyDown = (e) => {
     if (!e.key)
       return;
-    const alphabetKey = /^[a-z]{1}$/i.test(e.key);
-    const shiftableKey = shiftableKeys.has(e.key.toLowerCase());
+    const alphabetKey = layoutIndependent ? /^Key[A-Z]$/i.test(e.code) : /^[a-z]{1}$/i.test(e.key);
+    const shiftableKey = layoutIndependent ? shiftableCodes.has(e.code) : shiftableKeys.includes(e.key.toLowerCase());
     let chainedKey;
-    chainedInputs.value.push(e.key);
+    chainedInputs.value.push(layoutIndependent ? e.code : e.key);
     if (chainedInputs.value.length >= 2) {
       chainedKey = chainedInputs.value.slice(-2).join("-");
       for (const shortcut of shortcuts.value.filter((s) => s.chained)) {
@@ -108,8 +139,13 @@ export function defineShortcuts(config, options = {}) {
       }
     }
     for (const shortcut of shortcuts.value.filter((s) => !s.chained)) {
-      if (e.key.toLowerCase() !== shortcut.key)
-        continue;
+      if (layoutIndependent) {
+        if (e.code !== shortcut.key)
+          continue;
+      } else {
+        if (e.key.toLowerCase() !== shortcut.key)
+          continue;
+      }
       if (e.metaKey !== shortcut.metaKey)
         continue;
       if (e.ctrlKey !== shortcut.ctrlKey)

package/dist/runtime/composables/useLocale.d.ts

@@ -26,6 +26,12 @@ declare function _useLocale(): {
         modal: {
             close: string;
         };
+        select: {
+            create: string;
+            noData: string;
+            noMatch: string;
+            search: string;
+        };
         table: {
             noData: string;
         };
@@ -59,6 +65,12 @@ declare function _useLocale(): {
         modal: {
             close: string;
         };
+        select: {
+            create: string;
+            noData: string;
+            noMatch: string;
+            search: string;
+        };
         table: {
             noData: string;
         };

package/dist/runtime/locale/en.d.ts

@@ -21,6 +21,12 @@ declare const _default: Required<import("@byyuurin/ui-kit").Locale<{
     modal: {
         close: string;
     };
+    select: {
+        create: string;
+        noData: string;
+        noMatch: string;
+        search: string;
+    };
     table: {
         noData: string;
     };

package/dist/runtime/locale/en.js

@@ -25,6 +25,12 @@ export default defineLocale({
     modal: {
       close: "Close"
     },
+    select: {
+      create: 'Create "{label}"',
+      noData: "No data",
+      noMatch: "No matching data",
+      search: "Search\u2026"
+    },
     table: {
       noData: "No data"
     },

package/dist/runtime/locale/zh_tw.d.ts

@@ -21,6 +21,12 @@ declare const _default: Required<import("@byyuurin/ui-kit").Locale<{
     modal: {
         close: string;
     };
+    select: {
+        create: string;
+        noData: string;
+        noMatch: string;
+        search: string;
+    };
     table: {
         noData: string;
     };

package/dist/runtime/locale/zh_tw.js

@@ -25,6 +25,12 @@ export default defineLocale({
     modal: {
       close: "\u95DC\u9589"
     },
+    select: {
+      create: "\u5EFA\u7ACB\u300C{label}\u300D",
+      noData: "\u6C92\u6709\u8CC7\u6599",
+      noMatch: "\u6C92\u6709\u76F8\u7B26\u7684\u8CC7\u6599",
+      search: "\u641C\u5C0B\u2026"
+    },
     table: {
       noData: "\u6C92\u6709\u8CC7\u6599"
     },

package/dist/runtime/types/html.d.ts

@@ -0,0 +1,8 @@
+import type { AnchorHTMLAttributes as VueAnchorHTMLAttributes, ButtonHTMLAttributes as VueButtonHTMLAttributes, FormHTMLAttributes as VueFormHTMLAttributes, ImgHTMLAttributes as VueImgHTMLAttributes, InputHTMLAttributes as VueInputHTMLAttributes, TableHTMLAttributes as VueTableHTMLAttributes, TextareaHTMLAttributes as VueTextareaHTMLAttributes } from 'vue';
+export type AnchorHTMLAttributes = Pick<VueAnchorHTMLAttributes, 'download' | 'href' | 'hreflang' | 'media' | 'ping' | 'rel' | 'target' | 'type' | 'referrerpolicy'>;
+export type ButtonHTMLAttributes = Pick<VueButtonHTMLAttributes, 'autofocus' | 'disabled' | 'form' | 'formaction' | 'formenctype' | 'formmethod' | 'formnovalidate' | 'formtarget' | 'name' | 'type' | 'value'>;
+export type FormHTMLAttributes = Pick<VueFormHTMLAttributes, 'acceptcharset' | 'action' | 'autocomplete' | 'enctype' | 'method' | 'name' | 'novalidate' | 'target'>;
+export type ImgHTMLAttributes = Pick<VueImgHTMLAttributes, 'alt' | 'crossorigin' | 'decoding' | 'height' | 'loading' | 'referrerpolicy' | 'sizes' | 'src' | 'srcset' | 'usemap' | 'width'>;
+export type InputHTMLAttributes = Pick<VueInputHTMLAttributes, 'accept' | 'alt' | 'autocomplete' | 'autofocus' | 'capture' | 'checked' | 'crossorigin' | 'disabled' | 'enterKeyHint' | 'form' | 'formaction' | 'formenctype' | 'formmethod' | 'formnovalidate' | 'formtarget' | 'height' | 'indeterminate' | 'list' | 'max' | 'maxlength' | 'min' | 'minlength' | 'multiple' | 'name' | 'pattern' | 'placeholder' | 'readonly' | 'required' | 'size' | 'src' | 'step' | 'type' | 'value' | 'width'>;
+export type TableHTMLAttributes = Pick<VueTableHTMLAttributes, 'cellpadding' | 'cellspacing' | 'summary' | 'width'>;
+export type TextareaHTMLAttributes = Pick<VueTextareaHTMLAttributes, 'autocomplete' | 'autofocus' | 'cols' | 'dirname' | 'disabled' | 'form' | 'maxlength' | 'minlength' | 'name' | 'placeholder' | 'readonly' | 'required' | 'rows' | 'value' | 'wrap'>;

package/dist/runtime/types/index.d.ts

@@ -40,6 +40,7 @@ export * from '../components/Select.vue';
 export * from '../components/Separator.vue';
 export * from '../components/Skeleton.vue';
 export * from '../components/Slider.vue';
+export * from '../components/Stepper.vue';
 export * from '../components/Switch.vue';
 export * from '../components/Table.vue';
 export * from '../components/Tabs.vue';
@@ -48,6 +49,7 @@ export * from '../components/Timeline.vue';
 export * from '../components/Toast.vue';
 export * from '../components/ToastProvider.vue';
 export * from '../components/Tooltip.vue';
+export * from '../components/Tree.vue';
 export * from './form';
 export * from './locale';
 export * from './style';

package/dist/runtime/types/index.js

@@ -38,6 +38,7 @@ export * from "../components/Select.vue";
 export * from "../components/Separator.vue";
 export * from "../components/Skeleton.vue";
 export * from "../components/Slider.vue";
+export * from "../components/Stepper.vue";
 export * from "../components/Switch.vue";
 export * from "../components/Table.vue";
 export * from "../components/Tabs.vue";
@@ -46,6 +47,7 @@ export * from "../components/Timeline.vue";
 export * from "../components/Toast.vue";
 export * from "../components/ToastProvider.vue";
 export * from "../components/Tooltip.vue";
+export * from "../components/Tree.vue";
 export * from "./form.js";
 export * from "./locale.js";
 export * from "./style.js";

package/dist/runtime/types/input.d.ts

@@ -1,8 +1,8 @@
-export interface ModelModifiers {
-    string?: boolean;
-    number?: boolean;
-    trim?: boolean;
+export interface ModelModifiers<T = any> {
+    string?: string extends T ? boolean : never;
+    number?: number extends T ? boolean : never;
+    trim?: string extends T ? boolean : never;
     lazy?: boolean;
-    nullable?: boolean;
+    nullable?: null extends T ? boolean : never;
     optional?: boolean;
 }

package/dist/runtime/types/locale.d.ts

@@ -25,6 +25,12 @@ export interface Messages {
     modal: {
         close: string;
     };
+    select: {
+        create: string;
+        noData: string;
+        noMatch: string;
+        search: string;
+    };
     table: {
         noData: string;
     };

package/dist/runtime/types/unocss.d.ts

@@ -1,4 +1,4 @@
-declare module '#build/uno-merge' {
-  const unoMerge = (code: string) => string
-  export { unoMerge }
-}
+declare module '#build/uno-merge' {
+  const unoMerge = (code: string) => string
+  export { unoMerge }
+}

package/dist/runtime/types/utils.d.ts

@@ -43,9 +43,9 @@ export type ExtractItem<I, S extends string = 'slot'> = Extract<NestedItem<I>, {
     [Slot in S]: string;
 }>;
 export type GetItemKeys<I> = keyof Extract<NestedItem<I>, object> | DotPathKeys<Extract<NestedItem<I>, object>>;
-export type GetItemValue<I, VK extends GetItemKeys<I> | undefined, T extends NestedItem<I> = NestedItem<I>> = T extends object ? VK extends undefined ? T : VK extends DotPathKeys<T> ? DotPathValue<T, VK> : never : T;
-export type GetModelValue<T, VK extends GetItemKeys<T> | undefined, M extends boolean> = M extends true ? GetItemValue<T, VK>[] : GetItemValue<T, VK>;
-export interface GetModelValueEmits<T, VK extends GetItemKeys<T> | undefined, M extends boolean> {
+export type GetItemValue<I, VK extends Nullable<GetItemKeys<I>>, T extends NestedItem<I> = NestedItem<I>> = T extends object ? VK extends undefined | null ? T : VK extends DotPathKeys<T> ? DotPathValue<T, VK> : never : T;
+export type GetModelValue<T, VK extends Nullable<GetItemKeys<T>>, M extends boolean> = M extends true ? GetItemValue<T, VK>[] : GetItemValue<T, VK>;
+export interface GetModelValueEmits<T, VK extends Nullable<GetItemKeys<T>>, M extends boolean> {
     /** Event handler called when the value changes. */
     'update:modelValue': [value: GetModelValue<T, VK, M>];
 }

package/dist/runtime/utils/index.d.ts

@@ -1,4 +1,4 @@
-import type { GetItemKeys, Nullable } from '../types/utils';
+import type { GetItemKeys, MaybeNull, Nullable } from '../types/utils';
 export * from './form';
 export * from './link';
 export * from './vue';
@@ -7,7 +7,7 @@ export { looseToNumber } from '@vue/shared';
 export declare function compare<T>(value?: T, currentValue?: T, comparator?: string | ((a: T, b: T) => boolean)): boolean;
 export declare function isEmpty(value: unknown): boolean;
 export declare function getDisplayValue<T extends Array<any>, V>(items: T, value: Nullable<V>, options?: {
-    valueKey?: GetItemKeys<T>;
-    labelKey?: GetItemKeys<T>;
+    valueKey?: MaybeNull<GetItemKeys<T>>;
+    labelKey?: MaybeNull<GetItemKeys<T>>;
 }): string | undefined;
 export declare function isArrayOfArray<T>(item: T[] | T[][]): item is T[][];

package/dist/runtime/utils/link.d.ts

@@ -1,7 +1,8 @@
 import type { LinkProps } from '../types';
+export declare const linkKeys: readonly ["active", "activeClass", "ariaCurrentValue", "as", "disabled", "download", "exact", "exactActiveClass", "exactHash", "exactQuery", "external", "form", "formaction", "formenctype", "formmethod", "formnovalidate", "formtarget", "href", "hreflang", "inactiveClass", "media", "noPrefetch", "noRel", "onClick", "ping", "prefetch", "prefetchOn", "prefetchedClass", "referrerpolicy", "rel", "replace", "target", "title", "to", "trailingSlash", "type", "viewTransition"];
 export declare function pickLinkProps(link: LinkProps & {
     [key: string]: any;
 }): import("@vueuse/core").ReactivePickReturn<LinkProps & {
     [key: string]: any;
-}, "label" | "raw" | "replace" | "disabled" | "title" | "class" | "active" | "to" | "type" | "custom" | "activeClass" | "exactActiveClass" | "ariaCurrentValue" | "viewTransition" | `aria-${string}` | `data-${string}` | "as" | "exact" | "exactQuery" | "exactHash" | "inactiveClass" | "href" | "external" | "target" | "rel" | "noRel" | "prefetchedClass" | "prefetch" | "prefetchOn" | "noPrefetch" | "download" | "onClick">;
+}, "replace" | "disabled" | "title" | "active" | "to" | "type" | "activeClass" | "ariaCurrentValue" | "as" | "download" | "exact" | "exactActiveClass" | "exactHash" | "exactQuery" | "external" | "form" | "formaction" | "formenctype" | "formmethod" | "formnovalidate" | "formtarget" | "href" | "hreflang" | "inactiveClass" | "media" | "noPrefetch" | "noRel" | "onClick" | "ping" | "prefetch" | "prefetchOn" | "prefetchedClass" | "referrerpolicy" | "rel" | "target" | "trailingSlash" | "viewTransition" | `aria-${string}` | `data-${string}`>;
 export declare function isPartiallyEqual(item1: any, item2: any): boolean;

package/dist/runtime/utils/link.js

@@ -1,40 +1,51 @@
 import { reactivePick } from "@vueuse/core";
 import { diff, isEqual } from "ohash/utils";
+export const linkKeys = [
+  "active",
+  "activeClass",
+  "ariaCurrentValue",
+  "as",
+  "disabled",
+  "download",
+  "exact",
+  "exactActiveClass",
+  "exactHash",
+  "exactQuery",
+  "external",
+  "form",
+  "formaction",
+  "formenctype",
+  "formmethod",
+  "formnovalidate",
+  "formtarget",
+  "href",
+  "hreflang",
+  "inactiveClass",
+  "media",
+  "noPrefetch",
+  "noRel",
+  "onClick",
+  "ping",
+  "prefetch",
+  "prefetchOn",
+  "prefetchedClass",
+  "referrerpolicy",
+  "rel",
+  "replace",
+  "target",
+  "title",
+  "to",
+  "trailingSlash",
+  "type",
+  "viewTransition"
+];
 export function pickLinkProps(link) {
   const keys = Object.keys(link);
   const ariaKeys = keys.filter((key) => key.startsWith("aria-"));
   const dataKeys = keys.filter((key) => key.startsWith("data-"));
-  const pickProps = [
-    "active",
-    "activeClass",
-    "ariaCurrentValue",
-    "as",
-    "disabled",
-    "exact",
-    "exactActiveClass",
-    "exactHash",
-    "exactQuery",
-    "external",
-    "href",
-    "download",
-    "inactiveClass",
-    "noPrefetch",
-    "noRel",
-    "prefetch",
-    "prefetchedClass",
-    "rel",
-    "replace",
-    "target",
-    "to",
-    "type",
-    "title",
-    "onClick",
-    "title",
-    "onClick"
-  ];
   return reactivePick(
     link,
-    ...pickProps,
+    ...linkKeys,
     ...ariaKeys,
     ...dataKeys
   );

package/dist/runtime/vue/components/Icon.vue

@@ -10,6 +10,6 @@ const props = defineProps({
 </script>
 
 <template>
-  <IconifyIcon v-if="typeof props.name === 'string'" :icon="props.name.replace(/^i-/, '')" />
-  <component :is="props.name" v-else />
+  <IconifyIcon v-if="typeof props.name === 'string'" :icon="props.name.replace(/^i-/, '')" />
+  <component :is="props.name" v-else />
 </template>

package/dist/runtime/vue/components/Icon.vue.d.ts

@@ -2,6 +2,6 @@ import type { IconProps as NuxtIconProps } from '../../types';
 export interface IconProps {
     name: NuxtIconProps['name'];
 }
-declare const __VLS_export: import("vue").DefineComponent<IconProps, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<IconProps> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
 declare const _default: typeof __VLS_export;
 export default _default;
+declare const __VLS_export: import("vue").DefineComponent<IconProps, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<IconProps> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;

package/dist/runtime/vue/components/Link.vue

@@ -16,6 +16,10 @@ import { cv, merge } from "../../utils/style";
 defineOptions({ inheritAttrs: false });
 const props = defineProps({
   as: { type: null, required: false, default: "button" },
+  href: { type: null, required: false },
+  external: { type: Boolean, required: false },
+  target: { type: [String, Object, null], required: false },
+  rel: { type: [String, Object, null], required: false },
   type: { type: null, required: false, default: "button" },
   label: { type: String, required: false },
   disabled: { type: Boolean, required: false },
@@ -27,20 +31,11 @@ const props = defineProps({
   custom: { type: Boolean, required: false },
   raw: { type: Boolean, required: false },
   class: { type: [Object, String, Number, Boolean, null, Array], required: false, skipCheck: true },
-  to: { type: null, required: false },
-  href: { type: null, required: false },
-  external: { type: Boolean, required: false },
-  target: { type: [String, Object], required: false },
-  rel: { type: [String, Object], required: false },
-  noRel: { type: Boolean, required: false },
-  prefetchedClass: { type: String, required: false },
-  prefetch: { type: Boolean, required: false },
-  prefetchOn: { type: [String, Object], required: false },
-  noPrefetch: { type: Boolean, required: false },
   activeClass: { type: String, required: false },
   exactActiveClass: { type: String, required: false },
   ariaCurrentValue: { type: String, required: false, default: "page" },
   viewTransition: { type: Boolean, required: false },
+  to: { type: null, required: true },
   replace: { type: Boolean, required: false }
 });
 defineSlots();
@@ -137,7 +132,7 @@ function resolveLinkClass({ route: route2, isActive, isExactActive } = {}) {
   ...inheritProps,
   href: to,
   target: isExternal ? '_blank' : void 0,
-  active,
+  active: active ?? false,
   isExternal
 }"
       >
@@ -155,7 +150,7 @@ function resolveLinkClass({ route: route2, isActive, isExactActive } = {}) {
 }"
       :class="resolveLinkClass()"
     >
-      <slot :active="active">
+      <slot :active="active ?? false">
         {{ props.label }}
       </slot>
     </LinkBase>