nuance-ui 0.1.14 → 0.1.15

package/dist/module.json

@@ -4,7 +4,7 @@
   "compatibility": {
     "nuxt": "^4.0.0"
   },
-  "version": "0.1.14",
+  "version": "0.1.15",
   "builder": {
     "@nuxt/module-builder": "1.0.2",
     "unbuild": "3.6.1"

package/dist/runtime/components/action-icon/action-icon.d.vue.ts

@@ -14,6 +14,7 @@ export interface ActionIconProps {
     };
     mod?: BoxProps['mod'];
     icon?: string;
+    disabled?: boolean;
 }
 declare var __VLS_15: {};
 type __VLS_Slots = {} & {

package/dist/runtime/components/action-icon/action-icon.vue

@@ -7,14 +7,15 @@ import Loader from "../loader/loader.vue";
 import css from "./action-icon.module.css";
 const {
   color,
-  size = "md",
+  size,
   variant = "default",
   gradient,
   loading,
   classes,
   radius,
   mod,
-  icon
+  icon,
+  disabled
 } = defineProps({
   size: { type: null, required: false },
   variant: { type: String, required: false },
@@ -24,7 +25,8 @@ const {
   radius: { type: [String, Number], required: false },
   classes: { type: Object, required: false },
   mod: { type: [Object, Array, null], required: false },
-  icon: { type: String, required: false }
+  icon: { type: String, required: false },
+  disabled: { type: Boolean, required: false }
 });
 const style = computed(() => useStyleResolver((theme) => {
   const {
@@ -42,16 +44,15 @@ const style = computed(() => useStyleResolver((theme) => {
     "--ai-bd": border
   };
 }));
-const _mod = computed(() => [{ loading }, mod]);
 </script>
 
 <template>
 	<Box
 		is='button'
-		:mod='_mod'
+		:mod='[{ loading }, mod]'
 		:style
 		:class='[css.root, classes?.root]'
-		:disabled='loading'
+		:disabled='(!disabled ? loading : disabled) || void 0'
 	>
 		<Transition name='slide-down'>
 			<Loader

package/dist/runtime/components/action-icon/action-icon.vue.d.ts

@@ -14,6 +14,7 @@ export interface ActionIconProps {
     };
     mod?: BoxProps['mod'];
     icon?: string;
+    disabled?: boolean;
 }
 declare var __VLS_15: {};
 type __VLS_Slots = {} & {

package/dist/runtime/components/dialog/dialog-close-button.vue

@@ -10,7 +10,8 @@ const { variant = "subtle", icon = "gravity-ui:xmark", ...props } = defineProps(
   radius: { type: [String, Number], required: false },
   classes: { type: Object, required: false },
   mod: { type: [Object, Array, null], required: false },
-  icon: { type: String, required: false }
+  icon: { type: String, required: false },
+  disabled: { type: Boolean, required: false }
 });
 const close = useDialogState();
 </script>

package/dist/runtime/components/drawer/drawer-close-button.vue

@@ -9,7 +9,8 @@ const props = defineProps({
   radius: { type: [String, Number], required: false },
   classes: { type: Object, required: false },
   mod: { type: [Object, Array, null], required: false },
-  icon: { type: String, required: false }
+  icon: { type: String, required: false },
+  disabled: { type: Boolean, required: false }
 });
 </script>
 

package/dist/runtime/components/link/lib.d.ts

@@ -11,6 +11,11 @@ export declare function pickLinkProps<T extends NuxtLinkProps>(props: T): {
         replace?: import("vue").UnwrapRef<T["replace"]> | undefined;
         prefetchOn?: import("vue").UnwrapRef<T["prefetchOn"]> | undefined;
         trailingSlash?: import("vue").UnwrapRef<T["trailingSlash"]> | undefined;
+        activeClass?: import("vue").UnwrapRef<T["activeClass"]> | undefined;
+        ariaCurrentValue?: import("vue").UnwrapRef<T["ariaCurrentValue"]> | undefined;
+        exactActiveClass?: import("vue").UnwrapRef<T["exactActiveClass"]> | undefined;
+        prefetchedClass?: import("vue").UnwrapRef<T["prefetchedClass"]> | undefined;
+        viewTransition?: import("vue").UnwrapRef<T["viewTransition"]> | undefined;
     };
-    rest: Omit<T, Extract<"to", keyof T> | Extract<"target", keyof T> | Extract<"external", keyof T> | Extract<"rel", keyof T> | Extract<"noRel", keyof T> | Extract<"prefetch", keyof T> | Extract<"noPrefetch", keyof T> | Extract<"replace", keyof T> | Extract<"prefetchOn", keyof T> | Extract<"trailingSlash", keyof T>>;
+    rest: Omit<T, Extract<"to", keyof T> | Extract<"target", keyof T> | Extract<"external", keyof T> | Extract<"rel", keyof T> | Extract<"noRel", keyof T> | Extract<"prefetch", keyof T> | Extract<"noPrefetch", keyof T> | Extract<"replace", keyof T> | Extract<"prefetchOn", keyof T> | Extract<"trailingSlash", keyof T> | Extract<"activeClass", keyof T> | Extract<"ariaCurrentValue", keyof T> | Extract<"exactActiveClass", keyof T> | Extract<"prefetchedClass", keyof T> | Extract<"viewTransition", keyof T>>;
 };

package/dist/runtime/components/link/lib.js

@@ -9,7 +9,12 @@ const linkProps = [
   "noPrefetch",
   "replace",
   "prefetchOn",
-  "trailingSlash"
+  "trailingSlash",
+  "activeClass",
+  "ariaCurrentValue",
+  "exactActiveClass",
+  "prefetchedClass",
+  "viewTransition"
 ];
 export function pickLinkProps(props) {
   const link = reactivePick(props, ...linkProps);

package/dist/runtime/components/modal/modal-close-button.vue

@@ -9,7 +9,8 @@ const props = defineProps({
   radius: { type: [String, Number], required: false },
   classes: { type: Object, required: false },
   mod: { type: [Object, Array, null], required: false },
-  icon: { type: String, required: false }
+  icon: { type: String, required: false },
+  disabled: { type: Boolean, required: false }
 });
 </script>
 

package/dist/runtime/components/nav-link/nav-icon-link.d.vue.ts

@@ -0,0 +1,27 @@
+import type { ActionIconProps } from '@nui/components';
+import type { NuanceColor } from '@nui/types';
+import type { NuxtLinkProps } from 'nuxt/app';
+export interface NavIconLinkProps extends ActionIconProps, Omit<NuxtLinkProps, 'href' | 'custom'> {
+    to: NuxtLinkProps['to'];
+    /** Key of `theme.colors` of any valid CSS color to control active styles @default `theme.primaryColor` */
+    color?: NuanceColor;
+    /** Shorthand for passing icon */
+    icon?: string;
+    /** Variant for active state @default `filled` */
+    active?: ActionIconProps['variant'];
+    /** Variant for not active state @default `filled` */
+    notActive?: ActionIconProps['variant'];
+}
+declare var __VLS_14: {};
+type __VLS_Slots = {} & {
+    default?: (props: typeof __VLS_14) => any;
+};
+declare const __VLS_base: import("vue").DefineComponent<NavIconLinkProps, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<NavIconLinkProps> & Readonly<{}>, {}, {}, {}, {}, 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/components/nav-link/nav-icon-link.vue

@@ -0,0 +1,58 @@
+<script setup>
+import ActionIcon from "../action-icon/action-icon.vue";
+import { pickLinkProps } from "../link";
+defineOptions({ inheritAttrs: false });
+const {
+  active = "filled",
+  notActive = "default",
+  mod,
+  ...etc
+} = defineProps({
+  to: { type: null, required: true },
+  color: { type: null, required: false },
+  icon: { type: String, required: false },
+  active: { type: String, required: false },
+  notActive: { type: String, required: false },
+  size: { type: null, required: false },
+  variant: { type: String, required: false },
+  gradient: { type: Object, required: false },
+  loading: { type: Boolean, required: false },
+  radius: { type: [String, Number], required: false },
+  classes: { type: Object, required: false },
+  mod: { type: [Object, Array, null], required: false },
+  disabled: { type: Boolean, 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 },
+  trailingSlash: { type: String, required: false },
+  activeClass: { type: String, required: false },
+  exactActiveClass: { type: String, required: false },
+  ariaCurrentValue: { type: String, required: false },
+  viewTransition: { type: Boolean, required: false },
+  replace: { type: Boolean, required: false }
+});
+const { link, rest } = pickLinkProps(etc);
+</script>
+
+<template>
+	<NuxtLink v-slot='{ href, navigate, isActive, ...linkProps }' v-bind='link' custom>
+		<ActionIcon
+			is='a'
+			v-bind='rest'
+			:href
+			:variant='isActive ? active : notActive'
+			:mod='[{ active: isActive }, mod]'
+			:aria-current="isActive ? 'page' : void 0"
+			:rel='"rel" in linkProps ? linkProps?.rel : void 0'
+			:target='"target" in linkProps ? linkProps?.target : void 0'
+			@click='navigate'
+		>
+			<slot />
+		</ActionIcon>
+	</NuxtLink>
+</template>

package/dist/runtime/components/nav-link/nav-icon-link.vue.d.ts

@@ -0,0 +1,27 @@
+import type { ActionIconProps } from '@nui/components';
+import type { NuanceColor } from '@nui/types';
+import type { NuxtLinkProps } from 'nuxt/app';
+export interface NavIconLinkProps extends ActionIconProps, Omit<NuxtLinkProps, 'href' | 'custom'> {
+    to: NuxtLinkProps['to'];
+    /** Key of `theme.colors` of any valid CSS color to control active styles @default `theme.primaryColor` */
+    color?: NuanceColor;
+    /** Shorthand for passing icon */
+    icon?: string;
+    /** Variant for active state @default `filled` */
+    active?: ActionIconProps['variant'];
+    /** Variant for not active state @default `filled` */
+    notActive?: ActionIconProps['variant'];
+}
+declare var __VLS_14: {};
+type __VLS_Slots = {} & {
+    default?: (props: typeof __VLS_14) => any;
+};
+declare const __VLS_base: import("vue").DefineComponent<NavIconLinkProps, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<NavIconLinkProps> & Readonly<{}>, {}, {}, {}, {}, 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/utils/vars-resolver/create-variant-color-resolver.js

@@ -15,7 +15,7 @@ export function createVariantColorResolver({
         background: `var(--color-${color}-filled)`,
         hover: `var(--color-${color}-filled-hover)`,
         text,
-        border: "1px solid transparent)"
+        border: "1px solid transparent"
       };
     }
     return {
@@ -31,14 +31,14 @@ export function createVariantColorResolver({
         background: `var(--color-${color}-light)`,
         hover: `var(--color-${color}-light-hover)`,
         text: `var(--color-${color}-light-color)`,
-        border: "1px solid transparent)"
+        border: "1px solid transparent"
       };
     }
     return {
       background: `color-mix(var(--color-${parsed.color}-${parsed.shade}), .1)`,
       hover: `color-mix(var(--color-${parsed.color}-${parsed.shade}), .12)`,
       text: `var(--color-${parsed.color}-${Math.min(parsed.shade, 6)})`,
-      border: "1px solid transparent)"
+      border: "1px solid transparent"
     };
   }
   if (variant === "outline") {
@@ -82,7 +82,7 @@ export function createVariantColorResolver({
         deg: gradient?.deg
       }, theme),
       text: "var(--color-white)",
-      border: "none"
+      border: "1px solid transparent"
     };
   }
   if (variant === "gradient-outline") {

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "nuance-ui",
-	"version": "0.1.14",
+	"version": "0.1.15",
 	"description": "A UI Library for Modern Web Apps, powered by Vue.",
 	"repository": {
 		"type": "git",