@eslamdevui/ui 4.1.1-rc.2 → 4.3.0

package/dist/runtime/vue/overrides/none/Link.vue

@@ -0,0 +1,122 @@
+<script>
+import theme from "#build/ui/link";
+</script>
+
+<script setup>
+import { computed } from "vue";
+import { defu } from "defu";
+import { hasProtocol } from "ufo";
+import { useAppConfig } from "#imports";
+import { mergeClasses } from "../../../utils";
+import { tv } from "../../../utils/tv";
+import ULinkBase from "../../../components/LinkBase.vue";
+defineOptions({ inheritAttrs: false });
+const props = defineProps({
+  as: { type: null, required: false, default: "button" },
+  type: { type: null, required: false, default: "button" },
+  disabled: { type: Boolean, required: false },
+  active: { type: Boolean, required: false, default: void 0 },
+  exact: { type: Boolean, required: false },
+  exactQuery: { type: [Boolean, String], required: false },
+  exactHash: { type: Boolean, required: false },
+  inactiveClass: { type: String, required: false },
+  activeClass: { type: String, required: false },
+  ariaCurrentValue: { type: String, required: false, default: "page" },
+  custom: { type: Boolean, required: false },
+  raw: { type: Boolean, required: false },
+  class: { type: null, required: false },
+  to: { type: String, required: false },
+  href: { type: String, required: false },
+  external: { type: Boolean, required: false },
+  target: { type: [String, Object, null], required: false },
+  rel: { type: [String, Object, null], required: false },
+  noRel: { type: Boolean, required: false }
+});
+defineSlots();
+const appConfig = useAppConfig();
+const ui = computed(() => tv({
+  extend: tv(theme),
+  ...defu({
+    variants: {
+      active: {
+        true: mergeClasses(appConfig.ui?.link?.variants?.active?.true, props.activeClass),
+        false: mergeClasses(appConfig.ui?.link?.variants?.active?.false, props.inactiveClass)
+      }
+    }
+  }, appConfig.ui?.link || {})
+}));
+const href = computed(() => props.to ?? props.href);
+const isExternal = computed(() => {
+  if (props.target === "_blank") {
+    return true;
+  }
+  if (props.external) {
+    return true;
+  }
+  if (!href.value) {
+    return false;
+  }
+  return hasProtocol(href.value, { acceptRelative: true });
+});
+const isLinkActive = computed(() => {
+  if (props.active !== void 0) {
+    return props.active;
+  }
+  return false;
+});
+const linkClass = computed(() => {
+  const active = isLinkActive.value;
+  if (props.raw) {
+    return [props.class, active ? props.activeClass : props.inactiveClass];
+  }
+  return ui.value({ class: props.class, active, disabled: props.disabled });
+});
+const linkRel = computed(() => {
+  if (props.noRel) {
+    return null;
+  }
+  if (props.rel) {
+    return props.rel;
+  }
+  if (isExternal.value) {
+    return "noopener noreferrer";
+  }
+  return null;
+});
+</script>
+
+<template>
+  <template v-if="custom">
+    <slot
+      v-bind="{
+  ...$attrs,
+  as,
+  type,
+  disabled,
+  href,
+  navigate: void 0,
+  rel: linkRel,
+  target: target || (isExternal ? '_blank' : void 0),
+  isExternal,
+  active: isLinkActive
+}"
+    />
+  </template>
+  <ULinkBase
+    v-else
+    v-bind="{
+  ...$attrs,
+  as,
+  type,
+  disabled,
+  href,
+  navigate: void 0,
+  rel: linkRel,
+  target: target || (isExternal ? '_blank' : void 0),
+  isExternal
+}"
+    :class="linkClass"
+  >
+    <slot :active="isLinkActive" />
+  </ULinkBase>
+</template>

package/dist/runtime/{inertia/components → vue/overrides/none}/Link.vue.d.ts

@@ -1,7 +1,5 @@
 import type { ButtonHTMLAttributes } from 'vue';
-import type { InertiaLinkProps } from '@inertiajs/vue3';
-interface NuxtLinkProps extends Omit<InertiaLinkProps, 'href' | 'onClick'> {
-    activeClass?: string;
+interface BaseLinkProps {
     /**
      * Route Location the link should navigate to when clicked on.
      */
@@ -9,7 +7,7 @@ interface NuxtLinkProps extends Omit<InertiaLinkProps, 'href' | 'onClick'> {
     /**
      * An alias for `to`. If used with `to`, `href` will be ignored
      */
-    href?: NuxtLinkProps['to'];
+    href?: string;
     /**
      * Forces the link to be considered as external (true) or internal (false). This is helpful to handle edge-cases
      */
@@ -18,9 +16,16 @@ interface NuxtLinkProps extends Omit<InertiaLinkProps, 'href' | 'onClick'> {
      * Where to display the linked URL, as the name for a browsing context.
      */
     target?: '_blank' | '_parent' | '_self' | '_top' | (string & {}) | null;
-    ariaCurrentValue?: string;
+    /**
+     * A rel attribute value to apply on the link. Defaults to "noopener noreferrer" for external links.
+     */
+    rel?: 'noopener' | 'noreferrer' | 'nofollow' | 'sponsored' | 'ugc' | (string & {}) | null;
+    /**
+     * If set to true, no rel attribute will be added to the link
+     */
+    noRel?: boolean;
 }
-export interface LinkProps extends NuxtLinkProps {
+export interface LinkProps extends BaseLinkProps {
     /**
      * The element or component this component should render as when not a link.
      * @defaultValue 'button'
@@ -36,8 +41,16 @@ export interface LinkProps extends NuxtLinkProps {
     active?: boolean;
     /** Will only be active if the current route is an exact match. */
     exact?: boolean;
+    /** Allows controlling how the current route query sets the link as active. */
+    exactQuery?: boolean | 'partial';
+    /** Will only be active if the current route hash is an exact match. */
+    exactHash?: boolean;
     /** The class to apply when the link is inactive. */
     inactiveClass?: string;
+    /** The class to apply when the link is active. */
+    activeClass?: string;
+    /** The value of the `aria-current` attribute when the link is active. */
+    ariaCurrentValue?: string;
     custom?: boolean;
     /** When `true`, only styles from `class`, `activeClass`, and `inactiveClass` will be applied. */
     raw?: boolean;
@@ -48,15 +61,14 @@ export interface LinkSlots {
         active: boolean;
     }): any;
 }
+declare const _default: typeof __VLS_export;
+export default _default;
 declare const __VLS_export: __VLS_WithSlots<import("vue").DefineComponent<LinkProps, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<LinkProps> & Readonly<{}>, {
     as: any;
     type: "reset" | "submit" | "button";
-    activeClass: string;
     active: boolean;
-    inactiveClass: string;
+    ariaCurrentValue: string;
 }, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>, LinkSlots>;
-declare const _default: typeof __VLS_export;
-export default _default;
 type __VLS_WithSlots<T, S> = T & {
     new (): {
         $slots: S;

package/dist/runtime/vue/{components → overrides/vue-router}/Link.d.vue.ts

@@ -1,14 +1,15 @@
-import type { ButtonHTMLAttributes } from 'vue';
-import type { RouterLinkProps, RouteLocationRaw } from 'vue-router';
-interface NuxtLinkProps extends Omit<RouterLinkProps, 'to'> {
+import type { RouterLinkProps } from 'vue-router';
+import type { ButtonHTMLAttributes, AnchorHTMLAttributes } from '../../../types/html';
+export interface LinkProps extends Partial<Omit<RouterLinkProps, 'custom'>>, /** @vue-ignore */ Omit<ButtonHTMLAttributes, 'type' | 'disabled'>, /** @vue-ignore */ Omit<AnchorHTMLAttributes, 'href' | 'target' | 'rel' | 'type'> {
     /**
-     * Route Location the link should navigate to when clicked on.
+     * The element or component this component should render as when not a link.
+     * @defaultValue 'button'
      */
-    to?: RouteLocationRaw;
+    as?: any;
     /**
      * An alias for `to`. If used with `to`, `href` will be ignored
      */
-    href?: NuxtLinkProps['to'];
+    href?: LinkProps['to'];
     /**
      * Forces the link to be considered as external (true) or internal (false). This is helpful to handle edge-cases
      */
@@ -25,32 +26,6 @@ interface NuxtLinkProps extends Omit<RouterLinkProps, 'to'> {
      * If set to true, no rel attribute will be added to the link
      */
     noRel?: boolean;
-    /**
-     * A class to apply to links that have been prefetched.
-     */
-    prefetchedClass?: string;
-    /**
-     * When enabled will prefetch middleware, layouts and payloads of links in the viewport.
-     */
-    prefetch?: boolean;
-    /**
-     * Allows controlling when to prefetch links. By default, prefetch is triggered only on visibility.
-     */
-    prefetchOn?: 'visibility' | 'interaction' | Partial<{
-        visibility: boolean;
-        interaction: boolean;
-    }>;
-    /**
-     * Escape hatch to disable `prefetch` attribute.
-     */
-    noPrefetch?: boolean;
-}
-export interface LinkProps extends NuxtLinkProps {
-    /**
-     * The element or component this component should render as when not a link.
-     * @defaultValue 'button'
-     */
-    as?: any;
     /**
      * The type of the button when not a link.
      * @defaultValue 'button'
@@ -77,16 +52,14 @@ export interface LinkSlots {
         active: boolean;
     }): any;
 }
+declare const _default: typeof __VLS_export;
+export default _default;
 declare const __VLS_export: __VLS_WithSlots<import("vue").DefineComponent<LinkProps, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<LinkProps> & Readonly<{}>, {
     as: any;
     type: "reset" | "submit" | "button";
-    activeClass: string;
-    ariaCurrentValue: "page" | "step" | "location" | "date" | "time" | "true" | "false";
     active: boolean;
-    inactiveClass: string;
+    ariaCurrentValue: "page" | "step" | "location" | "date" | "time" | "true" | "false";
 }, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>, LinkSlots>;
-declare const _default: typeof __VLS_export;
-export default _default;
 type __VLS_WithSlots<T, S> = T & {
     new (): {
         $slots: S;

package/dist/runtime/vue/{components → overrides/vue-router}/Link.vue

@@ -11,49 +11,46 @@ import { reactiveOmit } from "@vueuse/core";
 import { hasProtocol } from "ufo";
 import { useRoute, RouterLink } from "vue-router";
 import { useAppConfig } from "#imports";
-import { tv } from "../../utils/tv";
-import { isPartiallyEqual } from "../../utils/link";
-import ULinkBase from "../../components/LinkBase.vue";
+import { tv } from "../../../utils/tv";
+import { mergeClasses } from "../../../utils";
+import { isPartiallyEqual } from "../../../utils/link";
+import ULinkBase from "../../../components/LinkBase.vue";
 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 },
+  noRel: { type: Boolean, required: false },
   type: { type: null, required: false, default: "button" },
   disabled: { type: Boolean, required: false },
   active: { type: Boolean, required: false, default: void 0 },
   exact: { type: Boolean, required: false },
   exactQuery: { type: [Boolean, String], required: false },
   exactHash: { type: Boolean, required: false },
-  inactiveClass: { type: String, required: false, default: "" },
+  inactiveClass: { type: String, required: false },
   custom: { type: Boolean, required: false },
   raw: { type: Boolean, required: false },
   class: { type: null, required: false },
-  to: { type: null, required: false },
-  href: { type: null, required: false },
-  external: { type: Boolean, required: false },
-  target: { type: [String, Object, null], required: false },
-  rel: { type: [String, Object, null], 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, default: "" },
+  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: false },
   replace: { type: Boolean, required: false }
 });
 defineSlots();
 const route = useRoute();
 const appConfig = useAppConfig();
-const routerLinkProps = useForwardProps(reactiveOmit(props, "as", "type", "disabled", "active", "exact", "exactQuery", "exactHash", "activeClass", "inactiveClass", "to", "href", "raw", "custom", "class"));
+const routerLinkProps = useForwardProps(reactiveOmit(props, "as", "type", "disabled", "active", "exact", "exactQuery", "exactHash", "activeClass", "inactiveClass", "to", "href", "raw", "custom", "class", "noRel"));
 const ui = computed(() => tv({
   extend: tv(theme),
   ...defu({
     variants: {
       active: {
-        true: props.activeClass,
-        false: props.inactiveClass
+        true: mergeClasses(appConfig.ui?.link?.variants?.active?.true, props.activeClass),
+        false: mergeClasses(appConfig.ui?.link?.variants?.active?.false, props.inactiveClass)
       }
     }
   }, appConfig.ui?.link || {})
@@ -68,6 +65,19 @@ const isExternal = computed(() => {
   }
   return typeof to.value === "string" && hasProtocol(to.value, { acceptRelative: true });
 });
+const hasTarget = computed(() => !!props.target && props.target !== "_self");
+const rel = computed(() => {
+  if (props.noRel) {
+    return null;
+  }
+  if (props.rel !== void 0) {
+    return props.rel || null;
+  }
+  if (isExternal.value || hasTarget.value) {
+    return "noopener noreferrer";
+  }
+  return null;
+});
 function isLinkActive({ route: linkRoute, isActive, isExactActive }) {
   if (props.active !== void 0) {
     return props.active;
@@ -113,6 +123,9 @@ function resolveLinkClass({ route: route2, isActive, isExactActive } = {}) {
   disabled,
   href,
   navigate,
+  rel,
+  target,
+  isExternal,
   active: isLinkActive({ route: linkRoute, isActive, isExactActive })
 }"
         />
@@ -126,7 +139,10 @@ function resolveLinkClass({ route: route2, isActive, isExactActive } = {}) {
   type,
   disabled,
   href,
-  navigate
+  navigate,
+  rel,
+  target,
+  isExternal
 }"
         :class="resolveLinkClass({ route: linkRoute, isActive, isExactActive })"
       >
@@ -144,7 +160,8 @@ function resolveLinkClass({ route: route2, isActive, isExactActive } = {}) {
   type,
   disabled,
   href: to,
-  target: isExternal ? '_blank' : void 0,
+  rel,
+  target,
   active,
   isExternal
 }"
@@ -158,7 +175,8 @@ function resolveLinkClass({ route: route2, isActive, isExactActive } = {}) {
   type,
   disabled,
   href: to,
-  target: isExternal ? '_blank' : void 0,
+  rel,
+  target,
   isExternal
 }"
       :class="resolveLinkClass()"

package/dist/runtime/vue/{components → overrides/vue-router}/Link.vue.d.ts

@@ -1,14 +1,15 @@
-import type { ButtonHTMLAttributes } from 'vue';
-import type { RouterLinkProps, RouteLocationRaw } from 'vue-router';
-interface NuxtLinkProps extends Omit<RouterLinkProps, 'to'> {
+import type { RouterLinkProps } from 'vue-router';
+import type { ButtonHTMLAttributes, AnchorHTMLAttributes } from '../../../types/html';
+export interface LinkProps extends Partial<Omit<RouterLinkProps, 'custom'>>, /** @vue-ignore */ Omit<ButtonHTMLAttributes, 'type' | 'disabled'>, /** @vue-ignore */ Omit<AnchorHTMLAttributes, 'href' | 'target' | 'rel' | 'type'> {
     /**
-     * Route Location the link should navigate to when clicked on.
+     * The element or component this component should render as when not a link.
+     * @defaultValue 'button'
      */
-    to?: RouteLocationRaw;
+    as?: any;
     /**
      * An alias for `to`. If used with `to`, `href` will be ignored
      */
-    href?: NuxtLinkProps['to'];
+    href?: LinkProps['to'];
     /**
      * Forces the link to be considered as external (true) or internal (false). This is helpful to handle edge-cases
      */
@@ -25,32 +26,6 @@ interface NuxtLinkProps extends Omit<RouterLinkProps, 'to'> {
      * If set to true, no rel attribute will be added to the link
      */
     noRel?: boolean;
-    /**
-     * A class to apply to links that have been prefetched.
-     */
-    prefetchedClass?: string;
-    /**
-     * When enabled will prefetch middleware, layouts and payloads of links in the viewport.
-     */
-    prefetch?: boolean;
-    /**
-     * Allows controlling when to prefetch links. By default, prefetch is triggered only on visibility.
-     */
-    prefetchOn?: 'visibility' | 'interaction' | Partial<{
-        visibility: boolean;
-        interaction: boolean;
-    }>;
-    /**
-     * Escape hatch to disable `prefetch` attribute.
-     */
-    noPrefetch?: boolean;
-}
-export interface LinkProps extends NuxtLinkProps {
-    /**
-     * The element or component this component should render as when not a link.
-     * @defaultValue 'button'
-     */
-    as?: any;
     /**
      * The type of the button when not a link.
      * @defaultValue 'button'
@@ -77,16 +52,14 @@ export interface LinkSlots {
         active: boolean;
     }): any;
 }
+declare const _default: typeof __VLS_export;
+export default _default;
 declare const __VLS_export: __VLS_WithSlots<import("vue").DefineComponent<LinkProps, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<LinkProps> & Readonly<{}>, {
     as: any;
     type: "reset" | "submit" | "button";
-    activeClass: string;
-    ariaCurrentValue: "page" | "step" | "location" | "date" | "time" | "true" | "false";
     active: boolean;
-    inactiveClass: string;
+    ariaCurrentValue: "page" | "step" | "location" | "date" | "time" | "true" | "false";
 }, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>, LinkSlots>;
-declare const _default: typeof __VLS_export;
-export default _default;
 type __VLS_WithSlots<T, S> = T & {
     new (): {
         $slots: S;

package/dist/runtime/vue/{stubs.d.ts → stubs/base.d.ts}

@@ -1,11 +1,10 @@
 import type { Ref } from 'vue';
 import type { NuxtApp } from '#app';
 export { useHead } from '@unhead/vue';
-export { useRoute, useRouter } from 'vue-router';
-export { useAppConfig } from './composables/useAppConfig';
-export { defineShortcuts } from '../composables/defineShortcuts';
-export { defineLocale } from '../composables/defineLocale';
-export { useLocale } from '../composables/useLocale';
+export { useAppConfig } from '../composables/useAppConfig';
+export { defineShortcuts } from '../../composables/defineShortcuts';
+export { defineLocale } from '../../composables/defineLocale';
+export { useLocale } from '../../composables/useLocale';
 export declare const clearError: () => void;
 export declare const useColorMode: () => {
     forced: boolean;
@@ -28,7 +27,7 @@ export declare const useState: <T>(key: string, init: () => T) => Ref<T>;
 export declare function useNuxtApp(): {
     isHydrating: boolean;
     payload: {
-        serverRendered: boolean;
+        serverRendered: any;
     };
     hooks: import("hookable").Hookable<Record<string, any>, string>;
     hook: <NameT extends string>(name: NameT, function_: any, options?: {

package/dist/runtime/vue/{stubs.js → stubs/base.js}

@@ -3,11 +3,10 @@ import { createHooks } from "hookable";
 import { useColorMode as useColorModeVueUse } from "@vueuse/core";
 import appConfig from "#build/app.config";
 export { useHead } from "@unhead/vue";
-export { useRoute, useRouter } from "vue-router";
-export { useAppConfig } from "./composables/useAppConfig.js";
-export { defineShortcuts } from "../composables/defineShortcuts.js";
-export { defineLocale } from "../composables/defineLocale.js";
-export { useLocale } from "../composables/useLocale.js";
+export { useAppConfig } from "../composables/useAppConfig.js";
+export { defineShortcuts } from "../../composables/defineShortcuts.js";
+export { defineLocale } from "../../composables/defineLocale.js";
+export { useLocale } from "../../composables/useLocale.js";
 export const clearError = () => {
 };
 export const useColorMode = () => {
@@ -57,7 +56,7 @@ const hooks = createHooks();
 export function useNuxtApp() {
   return {
     isHydrating: true,
-    payload: { serverRendered: false },
+    payload: { serverRendered: import.meta.env.SSR || false },
     hooks,
     hook: hooks.hook
   };

package/dist/runtime/vue/stubs/inertia.d.ts

@@ -0,0 +1,5 @@
+export * from './base';
+export declare const useRoute: () => {
+    fullPath: string;
+};
+export declare const useRouter: () => void;

package/dist/runtime/vue/stubs/inertia.js

@@ -0,0 +1,10 @@
+import { usePage } from "@inertiajs/vue3";
+export * from "./base.js";
+export const useRoute = () => {
+  const page = usePage();
+  return {
+    fullPath: page.url
+  };
+};
+export const useRouter = () => {
+};

package/dist/runtime/vue/stubs/none.d.ts

@@ -0,0 +1,56 @@
+export * from './base';
+export declare const useRoute: () => {
+    fullPath: string;
+    path: string;
+    name: null;
+    params: {};
+    query: {};
+    hash: string;
+    meta: {};
+    matched: never[];
+    redirectedFrom: undefined;
+};
+export declare const useRouter: () => {
+    push: () => Promise<void>;
+    replace: () => Promise<void>;
+    go: () => void;
+    back: () => void;
+    forward: () => void;
+    beforeEach: () => () => void;
+    beforeResolve: () => () => void;
+    afterEach: () => () => void;
+    onError: () => () => void;
+    isReady: () => Promise<boolean>;
+    currentRoute: import("vue").Ref<{
+        fullPath: string;
+        path: string;
+        name: null;
+        params: {};
+        query: {};
+        hash: string;
+        meta: {};
+        matched: never[];
+        redirectedFrom: undefined;
+    }, {
+        fullPath: string;
+        path: string;
+        name: null;
+        params: {};
+        query: {};
+        hash: string;
+        meta: {};
+        matched: never[];
+        redirectedFrom: undefined;
+    } | {
+        fullPath: string;
+        path: string;
+        name: null;
+        params: {};
+        query: {};
+        hash: string;
+        meta: {};
+        matched: never[];
+        redirectedFrom: undefined;
+    }>;
+    options: {};
+};

package/dist/runtime/vue/stubs/none.js

@@ -0,0 +1,48 @@
+import { ref } from "vue";
+export * from "./base.js";
+export const useRoute = () => {
+  return {
+    fullPath: "/",
+    path: "/",
+    name: null,
+    params: {},
+    query: {},
+    hash: "",
+    meta: {},
+    matched: [],
+    redirectedFrom: void 0
+  };
+};
+export const useRouter = () => {
+  return {
+    push: () => Promise.resolve(),
+    replace: () => Promise.resolve(),
+    go: () => {
+    },
+    back: () => {
+    },
+    forward: () => {
+    },
+    beforeEach: () => () => {
+    },
+    beforeResolve: () => () => {
+    },
+    afterEach: () => () => {
+    },
+    onError: () => () => {
+    },
+    isReady: () => Promise.resolve(true),
+    currentRoute: ref({
+      fullPath: "/",
+      path: "/",
+      name: null,
+      params: {},
+      query: {},
+      hash: "",
+      meta: {},
+      matched: [],
+      redirectedFrom: void 0
+    }),
+    options: {}
+  };
+};

package/dist/runtime/vue/stubs/vue-router.d.ts

@@ -0,0 +1,2 @@
+export * from './base';
+export { useRoute, useRouter } from 'vue-router';

package/dist/runtime/vue/stubs/vue-router.js

@@ -0,0 +1,2 @@
+export * from "./base.js";
+export { useRoute, useRouter } from "vue-router";