nexa-ui-kit 0.7.11 → 0.8.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (41) hide show
  1. package/dist/components/NAlert.js +1 -1
  2. package/dist/components/NAutocomplete.js +1 -1
  3. package/dist/components/NAvatar.js +1 -1
  4. package/dist/components/NBadge.js +1 -1
  5. package/dist/components/NBottomSheet.js +1 -1
  6. package/dist/components/NButton.js +225 -225
  7. package/dist/components/NButton.nexa +274 -274
  8. package/dist/components/NCard.js +3 -3
  9. package/dist/components/NCheckbox.js +1 -1
  10. package/dist/components/NChips.js +1 -1
  11. package/dist/components/NDataTable.js +59 -61
  12. package/dist/components/NDataTable.nexa +203 -204
  13. package/dist/components/NDatepicker.js +1 -1
  14. package/dist/components/NForm.js +1 -1
  15. package/dist/components/NFormField.js +1 -1
  16. package/dist/components/NImage.js +1 -1
  17. package/dist/components/NInput.js +1 -1
  18. package/dist/components/NInputNumber.js +17 -17
  19. package/dist/components/NInputNumber.nexa +232 -232
  20. package/dist/components/NModal.js +131 -131
  21. package/dist/components/NModal.nexa +226 -226
  22. package/dist/components/NMultiSelect.js +1 -1
  23. package/dist/components/NPaginator.js +1 -1
  24. package/dist/components/NPassword.js +1 -1
  25. package/dist/components/NProgressBar.js +1 -1
  26. package/dist/components/NRadio.js +1 -1
  27. package/dist/components/NScrollView.js +1 -1
  28. package/dist/components/NSelect.js +1 -1
  29. package/dist/components/NSkeleton.js +1 -1
  30. package/dist/components/NSwitch.js +1 -1
  31. package/dist/components/NTabs.js +1 -1
  32. package/dist/components/NTag.js +1 -1
  33. package/dist/components/NToastContainer.js +1 -1
  34. package/dist/components/NTooltip.js +1 -1
  35. package/dist/components/NTreeMenu.js +1 -1
  36. package/dist/components/NVirtualList.js +1 -1
  37. package/package.json +4 -4
  38. package/src/components/NButton.nexa +274 -274
  39. package/src/components/NDataTable.nexa +203 -204
  40. package/src/components/NInputNumber.nexa +232 -232
  41. package/src/components/NModal.nexa +226 -226
@@ -23,7 +23,7 @@ const _sfc_main = defineComponent({
23
23
  })
24
24
  // Injected render function
25
25
  _sfc_main.render = function(ctx) {
26
- let { visible, dismiss, icons, $slots, emit, variant, title, closable, icon, Fragment: _ntc_Fragment } = ctx
26
+ const { visible, dismiss, icons, $slots, emit, variant, title, closable, icon, Fragment: _ntc_Fragment } = ctx
27
27
  return (visible.value) ? h('div', { class: ["n-alert", `is-${variant}`], "data-v-22a3a541": "" }, [
28
28
  "\n ",
29
29
  h('span', { class: "n-alert-icon", "data-v-22a3a541": "" }, [
@@ -39,7 +39,7 @@ const _sfc_main = defineComponent({
39
39
  })
40
40
  // Injected render function
41
41
  _sfc_main.render = function(ctx) {
42
- let { instanceId, listboxId, inputId, isOpen, query, focusedIndex, rootEl, popupStyle, resolvedPlacement, stopTracking, completeTimer, normalizeOption, normalizedOptions, filteredOptions, activeId, close, open, requestComplete, onInput, onFocus, onKeydown, selectOption, clearValue, openAll, onBeforeUnmount, trackFloatingOverlay, $slots, emit, modelValue, options, placeholder, label, disabled, readonly, clearable, minLength, delay, loading, dropdown, emptyMessage, placement, Fragment: _ntc_Fragment, Teleport: _ntc_Teleport } = ctx
42
+ const { instanceId, listboxId, inputId, isOpen, query, focusedIndex, rootEl, popupStyle, resolvedPlacement, stopTracking, completeTimer, normalizeOption, normalizedOptions, filteredOptions, activeId, close, open, requestComplete, onInput, onFocus, onKeydown, selectOption, clearValue, openAll, onBeforeUnmount, trackFloatingOverlay, $slots, emit, modelValue, options, placeholder, label, disabled, readonly, clearable, minLength, delay, loading, dropdown, emptyMessage, placement, Fragment: _ntc_Fragment, Teleport: _ntc_Teleport } = ctx
43
43
  return h('div', { class: "n-ac", "data-autocomplete-root": instanceId, "data-v-741257a1": "" }, [
44
44
  "\n ",
45
45
  (label) ? h('label', { class: "n-ac-label", for: inputId, "data-v-741257a1": "" }, [
@@ -26,7 +26,7 @@ const _sfc_main = defineComponent({
26
26
  })
27
27
  // Injected render function
28
28
  _sfc_main.render = function(ctx) {
29
- let { initials, $slots, label, size, variant, image, shape, Fragment: _ntc_Fragment } = ctx
29
+ const { initials, $slots, label, size, variant, image, shape, Fragment: _ntc_Fragment } = ctx
30
30
  return h('div', { class: ['n-avatar', `is-${size}`, `is-${variant}`, `is-${shape}`], "vBind:style": "image ? { backgroundImage: `url(${image})` } : {}", "aria-label": label, "data-v-147134": "" }, [
31
31
  "\n ",
32
32
  (!image) ? h('span', { class: "n-avatar-initials", "data-v-147134": "" }, [
@@ -17,7 +17,7 @@ const _sfc_main = defineComponent({
17
17
  })
18
18
  // Injected render function
19
19
  _sfc_main.render = function(ctx) {
20
- let { $slots, variant, size, rounded, dot, position, Fragment: _ntc_Fragment } = ctx
20
+ const { $slots, variant, size, rounded, dot, position, Fragment: _ntc_Fragment } = ctx
21
21
  return (dot) ? h('span', { class: ["n-badge-dot", [`is-${variant}`, position ? `is-${position}` : '']], "data-v-ff3cf3e": "" }) : (true) ? h('span', { class: ['n-badge', `n-badge-${variant}`, `n-badge-${size}`, rounded ? 'is-rounded' : ''], "data-v-ff3cf3e": "" }, [
22
22
  "\n ",
23
23
  ctx.$slots.default ? ctx.$slots.default() : null,
@@ -60,7 +60,7 @@ const _sfc_main = defineComponent({
60
60
  })
61
61
  // Injected render function
62
62
  _sfc_main.render = function(ctx) {
63
- let { yOffset, isDragging, currentSnap, gestures, sortedPoints, translateY, overlayOpacity, useGestures, $slots, emit, show, snapPoints, Fragment: _ntc_Fragment, Teleport: _ntc_Teleport } = ctx
63
+ const { yOffset, isDragging, currentSnap, gestures, sortedPoints, translateY, overlayOpacity, useGestures, $slots, emit, show, snapPoints, Fragment: _ntc_Fragment, Teleport: _ntc_Teleport } = ctx
64
64
  return h(_ntc_Teleport, { to: "body", "data-v-55f61938": "" }, [
65
65
  "\n ",
66
66
  h('div', { class: ["n-bottom-sheet-root", { 'is-active': show || isDragging.value }], "data-v-55f61938": "" }, [
@@ -1,7 +1,7 @@
1
1
  import { signal, computed, h, hText, effect, defineComponent, registerComponent, reloadComponent, injectStyle } from 'nexa-framework'
2
2
 
3
3
  const _sfc_main = defineComponent({
4
- __scopeId: 'data-v-27fd765',
4
+ __scopeId: 'data-v-76573beb',
5
5
  __hmrId: 'NButton_nexa',
6
6
  props: {
7
7
  variant: { type: String, default: 'primary' },
@@ -44,240 +44,240 @@ const _sfc_main = defineComponent({
44
44
  })
45
45
  // Injected render function
46
46
  _sfc_main.render = function(ctx) {
47
- let { ripple, handleClick, btnClass, $slots, emit, variant, size, type, disabled, loading, block, rounded, loadingText, Fragment: _ntc_Fragment } = ctx
48
- return h('button', { class: btnClass.value, type: type, disabled: disabled || loading, onClick: handleClick, "data-v-27fd765": "" }, [
49
- "\n ",
50
- (loading) ? h('span', { class: "n-btn-loader", "data-v-27fd765": "" }) : null,
51
- (loading && loadingText) ? h('span', { class: "n-btn-loading-text", "data-v-27fd765": "" }, [
47
+ const { ripple, handleClick, btnClass, $slots, emit, variant, size, type, disabled, loading, block, rounded, loadingText, Fragment: _ntc_Fragment } = ctx
48
+ return h('button', { class: btnClass.value, type: type, disabled: disabled || loading, onClick: handleClick, "data-v-76573beb": "" }, [
49
+ "\r\n ",
50
+ (loading) ? h('span', { class: "n-btn-loader", "data-v-76573beb": "" }) : null,
51
+ (loading && loadingText) ? h('span', { class: "n-btn-loading-text", "data-v-76573beb": "" }, [
52
52
  loadingText
53
53
  ]) : null,
54
- (!loading || (loading && !loadingText)) ? h('span', { class: "n-btn-content", "data-v-27fd765": "" }, [
55
- "\n ",
54
+ (!loading || (loading && !loadingText)) ? h('span', { class: "n-btn-content", "data-v-76573beb": "" }, [
55
+ "\r\n ",
56
56
  ctx.$slots.default ? ctx.$slots.default() : null,
57
- "\n "
57
+ "\r\n "
58
58
  ]) : null,
59
59
  (ripple.value).map((r, index) =>
60
- h('span', { class: "n-btn-ripple", key: r.id, style: { left: r.x + 'px', top: r.y + 'px' }, "data-v-27fd765": "" })
60
+ h('span', { class: "n-btn-ripple", key: r.id, style: { left: r.x + 'px', top: r.y + 'px' }, "data-v-76573beb": "" })
61
61
  ),
62
- "\n "
62
+ "\r\n "
63
63
  ])
64
64
  }
65
- _sfc_main.__scopeId = 'data-v-27fd765'
65
+ _sfc_main.__scopeId = 'data-v-76573beb'
66
66
  _sfc_main.__hmrId = 'NButton_nexa'
67
67
 
68
68
  export default _sfc_main
69
69
 
70
- const __style = `.n-btn[data-v-27fd765]{
71
- position: relative;
72
- display: inline-flex;
73
- align-items: center;
74
- justify-content: center;
75
- gap: var(--n-space-2);
76
- font-family: var(--n-font-sans);
77
- font-weight: var(--n-weight-semibold);
78
- border-radius: var(--n-radius-md);
79
- cursor: pointer;
80
- transition: all var(--n-transition-normal);
81
- border: 1px solid transparent;
82
- outline: none;
83
- white-space: nowrap;
84
- user-select: none;
85
- overflow: hidden;
86
- text-decoration: none;
87
- line-height: var(--n-leading-normal, 1.5);
88
- min-width: fit-content;
89
- }
90
-
91
- .n-btn[data-v-27fd765]:focus-visible{
92
- box-shadow: 0 0 0 3px var(--n-color-primary-light);
93
- }
94
-
95
- /* Sizes */
96
- .n-btn-sm[data-v-27fd765]{ padding: 0.5rem 1.25rem; font-size: var(--n-text-sm); gap: var(--n-space-1); border-radius: var(--n-radius-sm); min-height: 32px; }
97
- .n-btn-md[data-v-27fd765]{ padding: 0.65rem 1.75rem; font-size: var(--n-text-base); min-height: 40px; }
98
- .n-btn-lg[data-v-27fd765]{ padding: 0.85rem 2.5rem; font-size: var(--n-text-lg); border-radius: var(--n-radius-lg); min-height: 48px; }
99
-
100
- /* Block */
101
- .is-block[data-v-27fd765]{ width: 100%; }
102
-
103
- /* Rounded */
104
- .is-rounded[data-v-27fd765]{ border-radius: var(--n-radius-full); }
105
-
106
- /* Variant: Primary */
107
- .n-btn-primary[data-v-27fd765]{
108
- background: linear-gradient(135deg, var(--n-color-primary) 0%, var(--n-color-primary-hover) 100%);
109
- color: white;
110
- box-shadow: var(--n-shadow-glow-primary);
111
- }
112
- .n-btn-primary[data-v-27fd765]:hover:not(:disabled){
113
- transform: translateY(-2px);
114
- box-shadow: 0 8px 20px -3px var(--n-color-primary-glow);
115
- }
116
- .n-btn-primary[data-v-27fd765]:active:not(:disabled){
117
- transform: translateY(0) scale(0.97);
118
- }
119
-
120
- /* Variant: Secondary */
121
- .n-btn-secondary[data-v-27fd765]{
122
- background: var(--n-color-surface-alt);
123
- color: var(--n-color-text);
124
- border-color: var(--n-color-border);
125
- }
126
- .n-btn-secondary[data-v-27fd765]:hover:not(:disabled){
127
- background: var(--n-color-surface-hover);
128
- border-color: var(--n-color-border-hover);
129
- }
130
-
131
- /* Variant: Success */
132
- .n-btn-success[data-v-27fd765]{
133
- background: linear-gradient(135deg, var(--n-color-success) 0%, var(--n-color-success-hover) 100%);
134
- color: white;
135
- box-shadow: 0 4px 12px -2px rgba(16, 185, 129, 0.3);
136
- }
137
- .n-btn-success[data-v-27fd765]:hover:not(:disabled){
138
- transform: translateY(-2px);
139
- box-shadow: 0 8px 20px -3px rgba(16, 185, 129, 0.4);
140
- }
141
- .n-btn-success[data-v-27fd765]:active:not(:disabled){
142
- transform: translateY(0) scale(0.97);
143
- }
144
-
145
- /* Variant: Warning */
146
- .n-btn-warning[data-v-27fd765]{
147
- background: linear-gradient(135deg, var(--n-color-warning) 0%, var(--n-color-warning-hover) 100%);
148
- color: white;
149
- box-shadow: 0 4px 12px -2px rgba(245, 158, 11, 0.3);
150
- }
151
- .n-btn-warning[data-v-27fd765]:hover:not(:disabled){
152
- transform: translateY(-2px);
153
- box-shadow: 0 8px 20px -3px rgba(245, 158, 11, 0.4);
154
- }
155
- .n-btn-warning[data-v-27fd765]:active:not(:disabled){
156
- transform: translateY(0) scale(0.97);
157
- }
158
-
159
- /* Variant: Info */
160
- .n-btn-info[data-v-27fd765]{
161
- background: linear-gradient(135deg, var(--n-color-info) 0%, var(--n-color-info-hover) 100%);
162
- color: white;
163
- box-shadow: 0 4px 12px -2px rgba(6, 182, 212, 0.3);
164
- }
165
- .n-btn-info[data-v-27fd765]:hover:not(:disabled){
166
- transform: translateY(-2px);
167
- box-shadow: 0 8px 20px -3px rgba(6, 182, 212, 0.4);
168
- }
169
- .n-btn-info[data-v-27fd765]:active:not(:disabled){
170
- transform: translateY(0) scale(0.97);
171
- }
172
-
173
- /* Variant: Danger */
174
- .n-btn-danger[data-v-27fd765]{
175
- background: linear-gradient(135deg, var(--n-color-danger) 0%, var(--n-color-danger-hover) 100%);
176
- color: white;
177
- box-shadow: 0 4px 12px -2px rgba(239, 68, 68, 0.3);
178
- }
179
- .n-btn-danger[data-v-27fd765]:hover:not(:disabled){
180
- transform: translateY(-2px);
181
- box-shadow: 0 8px 20px -3px rgba(220, 38, 38, 0.4);
182
- }
183
- .n-btn-danger[data-v-27fd765]:active:not(:disabled){
184
- transform: translateY(0) scale(0.97);
185
- }
186
-
187
- /* Variant: Ghost */
188
- .n-btn-ghost[data-v-27fd765]{
189
- background: transparent;
190
- color: var(--n-color-text-secondary);
191
- }
192
- .n-btn-ghost[data-v-27fd765]:hover:not(:disabled){
193
- background: var(--n-color-glass);
194
- color: var(--n-color-text);
195
- }
196
-
197
- /* Variant: Outline */
198
- .n-btn-outline[data-v-27fd765]{
199
- background: transparent;
200
- color: var(--n-color-primary);
201
- border-color: var(--n-color-primary);
202
- }
203
- .n-btn-outline[data-v-27fd765]:hover:not(:disabled){
204
- background: var(--n-color-primary-light);
205
- border-color: var(--n-color-primary-hover);
206
- }
207
-
208
- /* Variant: Glass */
209
- .n-btn-glass[data-v-27fd765]{
210
- background: var(--n-color-glass);
211
- backdrop-filter: blur(10px);
212
- border-color: var(--n-color-glass-border);
213
- color: var(--n-color-text);
214
- }
215
- .n-btn-glass[data-v-27fd765]:hover:not(:disabled){
216
- background: var(--n-color-glass-hover);
217
- border-color: var(--n-color-border-hover);
218
- }
219
-
220
- /* Disabled */
221
- .n-btn[data-v-27fd765]:disabled{
222
- opacity: 0.45;
223
- cursor: not-allowed;
224
- transform: none !important;
225
- box-shadow: none !important;
226
- }
227
-
228
- /* Loader */
229
- .n-btn-loader[data-v-27fd765]{
230
- width: 1rem;
231
- height: 1rem;
232
- border: 2px solid currentColor;
233
- border-right-color: transparent;
234
- border-radius: var(--n-radius-full);
235
- animation: n-spin 0.7s linear infinite;
236
- flex-shrink: 0;
237
- }
238
-
239
- .n-btn-lg .n-btn-loader[data-v-27fd765]{
240
- width: 1.25rem;
241
- height: 1.25rem;
242
- border-width: 2.5px;
243
- }
244
-
245
- .n-btn-sm .n-btn-loader[data-v-27fd765]{
246
- width: 0.85rem;
247
- height: 0.85rem;
248
- }
249
-
250
- .n-btn-loading-text[data-v-27fd765]{
251
- opacity: 0.8;
252
- font-weight: var(--n-weight-normal);
253
- }
254
-
255
- .n-btn-content[data-v-27fd765]{
256
- display: inline-flex;
257
- align-items: center;
258
- gap: var(--n-space-2);
259
- }
260
-
261
- @keyframes n-spin {
262
- from[data-v-27fd765]{ transform: rotate(0deg); }
263
- to[data-v-27fd765]{ transform: rotate(360deg); }
264
- }
265
-
266
- /* Ripple */
267
- .n-btn-ripple[data-v-27fd765]{
268
- position: absolute;
269
- border-radius: var(--n-radius-full);
270
- background: rgba(255, 255, 255, 0.35);
271
- width: 20px;
272
- height: 20px;
273
- margin-left: -10px;
274
- margin-top: -10px;
275
- pointer-events: none;
276
- animation: n-ripple 0.6s ease-out forwards;
277
- }
278
-
279
- @keyframes n-ripple {
280
- from[data-v-27fd765]{ transform: scale(0); opacity: 1; }
281
- to[data-v-27fd765]{ transform: scale(8); opacity: 0; }
70
+ const __style = `.n-btn[data-v-76573beb]{
71
+ position: relative;
72
+ display: inline-flex;
73
+ align-items: center;
74
+ justify-content: center;
75
+ gap: var(--n-space-2);
76
+ font-family: var(--n-font-sans);
77
+ font-weight: var(--n-weight-semibold);
78
+ border-radius: var(--n-radius-md);
79
+ cursor: pointer;
80
+ transition: all var(--n-transition-normal);
81
+ border: 1px solid transparent;
82
+ outline: none;
83
+ white-space: nowrap;
84
+ user-select: none;
85
+ overflow: hidden;
86
+ text-decoration: none;
87
+ line-height: var(--n-leading-normal, 1.5);
88
+ min-width: fit-content;
89
+ }
90
+
91
+ .n-btn[data-v-76573beb]:focus-visible{
92
+ box-shadow: 0 0 0 3px var(--n-color-primary-light);
93
+ }
94
+
95
+ /* Sizes */
96
+ .n-btn-sm[data-v-76573beb]{ padding: 0.5rem 1.25rem; font-size: var(--n-text-sm); gap: var(--n-space-1); border-radius: var(--n-radius-sm); min-height: 32px; }
97
+ .n-btn-md[data-v-76573beb]{ padding: 0.65rem 1.75rem; font-size: var(--n-text-base); min-height: 40px; }
98
+ .n-btn-lg[data-v-76573beb]{ padding: 0.85rem 2.5rem; font-size: var(--n-text-lg); border-radius: var(--n-radius-lg); min-height: 48px; }
99
+
100
+ /* Block */
101
+ .is-block[data-v-76573beb]{ width: 100%; }
102
+
103
+ /* Rounded */
104
+ .is-rounded[data-v-76573beb]{ border-radius: var(--n-radius-full); }
105
+
106
+ /* Variant: Primary */
107
+ .n-btn-primary[data-v-76573beb]{
108
+ background: linear-gradient(135deg, var(--n-color-primary) 0%, var(--n-color-primary-hover) 100%);
109
+ color: white;
110
+ box-shadow: var(--n-shadow-glow-primary);
111
+ }
112
+ .n-btn-primary[data-v-76573beb]:hover:not(:disabled){
113
+ transform: translateY(-2px);
114
+ box-shadow: 0 8px 20px -3px var(--n-color-primary-glow);
115
+ }
116
+ .n-btn-primary[data-v-76573beb]:active:not(:disabled){
117
+ transform: translateY(0) scale(0.97);
118
+ }
119
+
120
+ /* Variant: Secondary */
121
+ .n-btn-secondary[data-v-76573beb]{
122
+ background: var(--n-color-surface-alt);
123
+ color: var(--n-color-text);
124
+ border-color: var(--n-color-border);
125
+ }
126
+ .n-btn-secondary[data-v-76573beb]:hover:not(:disabled){
127
+ background: var(--n-color-surface-hover);
128
+ border-color: var(--n-color-border-hover);
129
+ }
130
+
131
+ /* Variant: Success */
132
+ .n-btn-success[data-v-76573beb]{
133
+ background: linear-gradient(135deg, var(--n-color-success) 0%, var(--n-color-success-hover) 100%);
134
+ color: white;
135
+ box-shadow: 0 4px 12px -2px rgba(16, 185, 129, 0.3);
136
+ }
137
+ .n-btn-success[data-v-76573beb]:hover:not(:disabled){
138
+ transform: translateY(-2px);
139
+ box-shadow: 0 8px 20px -3px rgba(16, 185, 129, 0.4);
140
+ }
141
+ .n-btn-success[data-v-76573beb]:active:not(:disabled){
142
+ transform: translateY(0) scale(0.97);
143
+ }
144
+
145
+ /* Variant: Warning */
146
+ .n-btn-warning[data-v-76573beb]{
147
+ background: linear-gradient(135deg, var(--n-color-warning) 0%, var(--n-color-warning-hover) 100%);
148
+ color: white;
149
+ box-shadow: 0 4px 12px -2px rgba(245, 158, 11, 0.3);
150
+ }
151
+ .n-btn-warning[data-v-76573beb]:hover:not(:disabled){
152
+ transform: translateY(-2px);
153
+ box-shadow: 0 8px 20px -3px rgba(245, 158, 11, 0.4);
154
+ }
155
+ .n-btn-warning[data-v-76573beb]:active:not(:disabled){
156
+ transform: translateY(0) scale(0.97);
157
+ }
158
+
159
+ /* Variant: Info */
160
+ .n-btn-info[data-v-76573beb]{
161
+ background: linear-gradient(135deg, var(--n-color-info) 0%, var(--n-color-info-hover) 100%);
162
+ color: white;
163
+ box-shadow: 0 4px 12px -2px rgba(6, 182, 212, 0.3);
164
+ }
165
+ .n-btn-info[data-v-76573beb]:hover:not(:disabled){
166
+ transform: translateY(-2px);
167
+ box-shadow: 0 8px 20px -3px rgba(6, 182, 212, 0.4);
168
+ }
169
+ .n-btn-info[data-v-76573beb]:active:not(:disabled){
170
+ transform: translateY(0) scale(0.97);
171
+ }
172
+
173
+ /* Variant: Danger */
174
+ .n-btn-danger[data-v-76573beb]{
175
+ background: linear-gradient(135deg, var(--n-color-danger) 0%, var(--n-color-danger-hover) 100%);
176
+ color: white;
177
+ box-shadow: 0 4px 12px -2px rgba(239, 68, 68, 0.3);
178
+ }
179
+ .n-btn-danger[data-v-76573beb]:hover:not(:disabled){
180
+ transform: translateY(-2px);
181
+ box-shadow: 0 8px 20px -3px rgba(220, 38, 38, 0.4);
182
+ }
183
+ .n-btn-danger[data-v-76573beb]:active:not(:disabled){
184
+ transform: translateY(0) scale(0.97);
185
+ }
186
+
187
+ /* Variant: Ghost */
188
+ .n-btn-ghost[data-v-76573beb]{
189
+ background: transparent;
190
+ color: var(--n-color-text-secondary);
191
+ }
192
+ .n-btn-ghost[data-v-76573beb]:hover:not(:disabled){
193
+ background: var(--n-color-glass);
194
+ color: var(--n-color-text);
195
+ }
196
+
197
+ /* Variant: Outline */
198
+ .n-btn-outline[data-v-76573beb]{
199
+ background: transparent;
200
+ color: var(--n-color-primary);
201
+ border-color: var(--n-color-primary);
202
+ }
203
+ .n-btn-outline[data-v-76573beb]:hover:not(:disabled){
204
+ background: var(--n-color-primary-light);
205
+ border-color: var(--n-color-primary-hover);
206
+ }
207
+
208
+ /* Variant: Glass */
209
+ .n-btn-glass[data-v-76573beb]{
210
+ background: var(--n-color-glass);
211
+ backdrop-filter: blur(10px);
212
+ border-color: var(--n-color-glass-border);
213
+ color: var(--n-color-text);
214
+ }
215
+ .n-btn-glass[data-v-76573beb]:hover:not(:disabled){
216
+ background: var(--n-color-glass-hover);
217
+ border-color: var(--n-color-border-hover);
218
+ }
219
+
220
+ /* Disabled */
221
+ .n-btn[data-v-76573beb]:disabled{
222
+ opacity: 0.45;
223
+ cursor: not-allowed;
224
+ transform: none !important;
225
+ box-shadow: none !important;
226
+ }
227
+
228
+ /* Loader */
229
+ .n-btn-loader[data-v-76573beb]{
230
+ width: 1rem;
231
+ height: 1rem;
232
+ border: 2px solid currentColor;
233
+ border-right-color: transparent;
234
+ border-radius: var(--n-radius-full);
235
+ animation: n-spin 0.7s linear infinite;
236
+ flex-shrink: 0;
237
+ }
238
+
239
+ .n-btn-lg .n-btn-loader[data-v-76573beb]{
240
+ width: 1.25rem;
241
+ height: 1.25rem;
242
+ border-width: 2.5px;
243
+ }
244
+
245
+ .n-btn-sm .n-btn-loader[data-v-76573beb]{
246
+ width: 0.85rem;
247
+ height: 0.85rem;
248
+ }
249
+
250
+ .n-btn-loading-text[data-v-76573beb]{
251
+ opacity: 0.8;
252
+ font-weight: var(--n-weight-normal);
253
+ }
254
+
255
+ .n-btn-content[data-v-76573beb]{
256
+ display: inline-flex;
257
+ align-items: center;
258
+ gap: var(--n-space-2);
259
+ }
260
+
261
+ @keyframes n-spin {
262
+ from[data-v-76573beb]{ transform: rotate(0deg); }
263
+ to[data-v-76573beb]{ transform: rotate(360deg); }
264
+ }
265
+
266
+ /* Ripple */
267
+ .n-btn-ripple[data-v-76573beb]{
268
+ position: absolute;
269
+ border-radius: var(--n-radius-full);
270
+ background: rgba(255, 255, 255, 0.35);
271
+ width: 20px;
272
+ height: 20px;
273
+ margin-left: -10px;
274
+ margin-top: -10px;
275
+ pointer-events: none;
276
+ animation: n-ripple 0.6s ease-out forwards;
277
+ }
278
+
279
+ @keyframes n-ripple {
280
+ from[data-v-76573beb]{ transform: scale(0); opacity: 1; }
281
+ to[data-v-76573beb]{ transform: scale(8); opacity: 0; }
282
282
  }`
283
- injectStyle('data-v-27fd765', __style)
283
+ injectStyle('data-v-76573beb', __style)