@nexxtmove/ui 0.0.13 → 0.0.14

package/dist/index.d.ts

@@ -4,19 +4,7 @@ import { DefineComponent } from 'vue';
 import { IconName } from '@awesome.me/kit-37b149f3ef/icons';
 import { PublicProps } from 'vue';
 
-declare const __VLS_component: DefineComponent<__VLS_Props, {}, {}, {}, {}, ComponentOptionsMixin, ComponentOptionsMixin, {}, string, PublicProps, Readonly<__VLS_Props> & Readonly<{}>, {
-variant: "primary" | "secondary";
-buttonType: "button" | "submit" | "reset";
-}, {}, {}, {}, string, ComponentProvideOptions, false, {}, HTMLButtonElement>;
-
-declare type __VLS_Props = {
-    variant?: 'primary' | 'secondary';
-    icon?: InstanceType<typeof NexxtIcon>['name'];
-    iconRight?: boolean;
-    disabled?: boolean;
-    loading?: boolean;
-    buttonType?: 'button' | 'submit' | 'reset';
-};
+declare const __VLS_component: DefineComponent<NexxtButtonProps, {}, {}, {}, {}, ComponentOptionsMixin, ComponentOptionsMixin, {}, string, PublicProps, Readonly<NexxtButtonProps> & Readonly<{}>, {}, {}, {}, {}, string, ComponentProvideOptions, false, {}, HTMLButtonElement>;
 
 declare function __VLS_template(): {
     attrs: Partial<{}>;
@@ -39,11 +27,18 @@ declare type IconType = 'regular' | 'solid' | 'light' | 'duotone' | 'brands';
 
 export declare const NexxtButton: __VLS_WithTemplateSlots<typeof __VLS_component, __VLS_TemplateResult["slots"]>;
 
-export declare const NexxtIcon: DefineComponent<Props, {}, {}, {}, {}, ComponentOptionsMixin, ComponentOptionsMixin, {}, string, PublicProps, Readonly<Props> & Readonly<{}>, {
-type: IconType;
-}, {}, {}, {}, string, ComponentProvideOptions, false, {}, HTMLElement>;
+declare interface NexxtButtonProps {
+    variant?: 'primary' | 'secondary' | 'link';
+    icon?: InstanceType<typeof NexxtIcon>['name'];
+    iconRight?: boolean;
+    disabled?: boolean;
+    loading?: boolean;
+    buttonType?: 'button' | 'submit' | 'reset';
+}
+
+export declare const NexxtIcon: DefineComponent<NexxtIconProps, {}, {}, {}, {}, ComponentOptionsMixin, ComponentOptionsMixin, {}, string, PublicProps, Readonly<NexxtIconProps> & Readonly<{}>, {}, {}, {}, {}, string, ComponentProvideOptions, false, {}, HTMLElement>;
 
-declare interface Props {
+declare interface NexxtIconProps {
     name: IconName;
     type?: IconType;
 }

package/dist/index.js

@@ -1,5 +1,5 @@
-import { defineComponent as c, createElementBlock as o, openBlock as t, normalizeClass as a, createBlock as d, createCommentVNode as l, renderSlot as u, createVNode as s, Transition as m, withCtx as y } from "vue";
-const r = /* @__PURE__ */ c({
+import { defineComponent as c, createElementBlock as i, openBlock as n, normalizeClass as t, createBlock as d, createCommentVNode as o, createElementVNode as u, createVNode as l, renderSlot as f, Transition as m, withCtx as y } from "vue";
+const s = /* @__PURE__ */ c({
   name: "NexxtIcon",
   __name: "Icon",
   props: {
@@ -7,11 +7,14 @@ const r = /* @__PURE__ */ c({
     type: { default: "light" }
   },
   setup(e) {
-    return (i, n) => (t(), o("i", {
-      class: a([`fa-${e.type}`, `fa-${e.name}`, "items-center", "justify-center"])
+    return (a, r) => (n(), i("i", {
+      class: t([`fa-${e.type}`, `fa-${e.name}`, "items-center", "justify-center"])
     }, null, 2));
   }
-}), f = ["type", "disabled", "data-variant"], x = /* @__PURE__ */ c({
+}), v = ["type", "disabled", "data-variant"], b = {
+  key: 0,
+  class: /* @__PURE__ */ t(["absolute inset-0 flex items-center justify-center rounded-lg"])
+}, x = /* @__PURE__ */ c({
   name: "NexxtButton",
   __name: "Button",
   props: {
@@ -19,32 +22,37 @@ const r = /* @__PURE__ */ c({
     icon: {},
     iconRight: { type: Boolean },
     disabled: { type: Boolean },
-    loading: { type: Boolean },
+    loading: { type: Boolean, default: !1 },
     buttonType: { default: "button" }
   },
   setup(e) {
-    const i = {
-      primary: "bg-cornflower-blue-500",
-      secondary: "bg-white"
-    };
-    return (n, b) => (t(), o("button", {
+    return (a, r) => (n(), i("button", {
       type: e.buttonType,
       disabled: e.disabled,
-      class: a([
-        "button relative flex h-10 cursor-pointer items-center justify-center overflow-hidden rounded-lg transition-colors focus-visible:outline-3 disabled:cursor-not-allowed",
+      class: t([
+        "button relative flex h-10 cursor-pointer items-center justify-center overflow-hidden rounded-lg transition-colors duration-200 focus-visible:outline-3 disabled:cursor-not-allowed",
         `button-${e.variant}`,
-        n.$slots.default ?? "w-10",
+        a.$slots.default ?? "w-10",
         e.loading ? "pointer-events-none" : ""
       ]),
       "data-variant": e.variant
     }, [
-      e.icon ? (t(), d(r, {
+      e.icon ? (n(), d(s, {
         key: 0,
         name: e.icon,
-        class: a({ "order-last": e.iconRight })
-      }, null, 8, ["name", "class"])) : l("", !0),
-      u(n.$slots, "default"),
-      s(m, {
+        class: t({ "order-last": e.iconRight, "opacity-0": e.loading })
+      }, null, 8, ["name", "class"])) : o("", !0),
+      u("span", {
+        class: t([
+          "inline-block transition-all duration-200",
+          { "opacity-0": e.loading },
+          e.variant === "link" ? "underline underline-offset-1" : "",
+          e.variant === "link" && !e.loading && !e.disabled ? "hover:underline-offset-2" : ""
+        ])
+      }, [
+        f(a.$slots, "default")
+      ], 2),
+      l(m, {
         "enter-active-class": "transition-opacity duration-200",
         "enter-from-class": "opacity-0",
         "enter-to-class": "opacity-100",
@@ -53,26 +61,20 @@ const r = /* @__PURE__ */ c({
         "leave-to-class": "opacity-0"
       }, {
         default: y(() => [
-          e.loading ? (t(), o("div", {
-            key: 0,
-            class: a([
-              "absolute inset-0 flex items-center justify-center rounded-lg",
-              i[e.variant]
-            ])
-          }, [
-            s(r, {
+          e.loading ? (n(), i("div", b, [
+            l(s, {
               name: "spinner-third",
               type: "light",
               class: "fa-spin absolute text-sm"
             })
-          ], 2)) : l("", !0)
+          ])) : o("", !0)
         ]),
         _: 1
       })
-    ], 10, f));
+    ], 10, v));
   }
 });
 export {
   x as NexxtButton,
-  r as NexxtIcon
+  s as NexxtIcon
 };

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@nexxtmove/ui",
   "type": "module",
-  "version": "0.0.13",
+  "version": "0.0.14",
   "exports": {
     ".": {
       "types": "./dist/index.d.ts",
@@ -23,11 +23,11 @@
   "devDependencies": {
     "@awesome.me/kit-37b149f3ef": "^1.0.4",
     "@eslint/js": "^9.39.2",
-    "@storybook/addon-a11y": "^10.1.11",
-    "@storybook/addon-docs": "^10.1.11",
-    "@storybook/addon-vitest": "^10.1.11",
-    "@storybook/builder-vite": "^10.1.11",
-    "@storybook/vue3-vite": "^10.1.11",
+    "@storybook/addon-a11y": "^10.2.0",
+    "@storybook/addon-docs": "^10.2.0",
+    "@storybook/addon-vitest": "^10.2.0",
+    "@storybook/builder-vite": "^10.2.0",
+    "@storybook/vue3-vite": "^10.2.0",
     "@tailwindcss/vite": "^4.1.18",
     "@types/node": "^25.0.3",
     "@types/react": "^19.2.8",
@@ -49,11 +49,12 @@
     "react": "^19.2.3",
     "react-dom": "^19.2.3",
     "remark-frontmatter": "^5.0.0",
-    "storybook": "^10.1.11",
+    "storybook": "^10.2.0",
     "typescript-eslint": "^8.52.0",
     "vite": "^7.3.0",
     "vite-plugin-dts": "^4.5.4",
-    "vitest": "^4.0.16"
+    "vitest": "^4.0.16",
+    "eslint-plugin-storybook": "10.2.0"
   },
   "engines": {
     "node": ">=22.18.0"