nicklabs-ui 1.0.46 → 1.0.48

package/README.md

@@ -2,7 +2,7 @@
 
 A Vue 3 component library with glassmorphism design, built for modern web applications.
 
-**Version**: 1.0.39 | **Framework**: Vue 3.5+
+**Version**: 1.0.48 | **Framework**: Vue 3.5+
 
 ---
 
@@ -128,11 +128,12 @@ A versatile button supporting multiple visual variants and semantic intents.
 
 | Prop | Type | Default | Description |
 |------|------|---------|-------------|
-| `variant` | `"none" \| "solid" \| "outline" \| "ghost" \| "mute"` | `"solid"` | Visual style |
-| `intent` | `"none" \| "primary" \| "error" \| "success" \| "warning" \| "info"` | `"none"` | Semantic color intent |
+| `variant` | `"none" \| "solid" \| "outline" \| "bordered" \| "ghost" \| "mute" \| "link"` | `"none"` | Visual style |
+| `intent` | `"none" \| "primary" \| "secondary" \| "error" \| "success" \| "warning" \| "info" \| "default" \| "purple"` | `"none"` | Semantic color intent |
+| `loading` | `boolean` | `false` | Show spinner and disable interaction |
+| `disabled` | `boolean` | `false` | Disable interaction |
 | `size` | `"sm" \| "md" \| "lg"` | `"md"` | Button size |
 | `radiusSize` | `"sm" \| "md" \| "lg" \| "xl" \| "full"` | `"md"` | Border radius |
-| `disabled` | `boolean` | `false` | Disable interaction |
 | `type` | `"button" \| "submit" \| "reset"` | `"button"` | HTML button type |
 | `square` | `boolean` | `false` | Equal width/height (icon button) |
 | `padding` | `string` | — | Custom padding override |
@@ -149,8 +150,21 @@ A versatile button supporting multiple visual variants and semantic intents.
   <!-- Variants -->
   <NButton variant="solid" intent="primary">Primary</NButton>
   <NButton variant="outline" intent="success">Success</NButton>
+  <NButton variant="bordered" intent="error">Bordered (intent-colored border)</NButton>
   <NButton variant="ghost" intent="warning">Warning</NButton>
   <NButton variant="mute" intent="error">Danger</NButton>
+  <NButton variant="link" intent="primary">Link style</NButton>
+
+  <!-- Intents -->
+  <NButton variant="solid" intent="secondary">Secondary</NButton>
+  <NButton variant="solid" intent="default">Default (grey)</NButton>
+  <NButton variant="solid" intent="purple">Purple</NButton>
+
+  <!-- Loading state -->
+  <NButton variant="solid" intent="primary" loading>Saving...</NButton>
+  <NButton variant="solid" intent="primary" :loading="isSubmitting" @click="submit">
+    Submit
+  </NButton>
 
   <!-- Sizes -->
   <NButton size="sm">Small</NButton>
@@ -170,7 +184,16 @@ A versatile button supporting multiple visual variants and semantic intents.
 </template>
 
 <script setup>
+import { ref } from 'vue'
 import { NButton } from 'nicklabs-ui'
+
+const isSubmitting = ref(false)
+
+async function submit() {
+  isSubmitting.value = true
+  await doSomething()
+  isSubmitting.value = false
+}
 </script>
 ```
 
@@ -1954,8 +1977,8 @@ interface BreadcrumbItem {
 }
 
 // Sizes / Variants
-type NButtonVariant = 'none' | 'solid' | 'outline' | 'ghost' | 'mute'
-type NButtonIntent = 'none' | 'primary' | 'error' | 'success' | 'warning' | 'info'
+type NButtonVariant = 'none' | 'solid' | 'outline' | 'bordered' | 'ghost' | 'mute' | 'link'
+type NButtonIntent = 'none' | 'primary' | 'secondary' | 'error' | 'success' | 'warning' | 'info' | 'default' | 'purple'
 type NButtonRadiusSize = 'sm' | 'md' | 'lg' | 'xl' | 'full'
 type NButtonSize = 'sm' | 'md' | 'lg'
 type NTagIntent = 'none' | 'primary' | 'success' | 'warning' | 'error' | 'info'