nexa-ui-kit 0.11.6 → 0.11.9

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 (95) hide show
  1. package/dist/components/NAlert.js +2 -14
  2. package/dist/components/NAlert.nexa +3 -14
  3. package/dist/components/NAutocomplete.js +1 -1
  4. package/dist/components/NAutocomplete.nexa +2 -1
  5. package/dist/components/NAvatar.js +0 -5
  6. package/dist/components/NAvatar.nexa +1 -5
  7. package/dist/components/NBadge.js +0 -6
  8. package/dist/components/NBadge.nexa +1 -6
  9. package/dist/components/NBottomSheet.js +0 -5
  10. package/dist/components/NBottomSheet.nexa +1 -5
  11. package/dist/components/NButton.js +219 -296
  12. package/dist/components/NButton.nexa +241 -320
  13. package/dist/components/NCard.js +39 -82
  14. package/dist/components/NCard.nexa +27 -71
  15. package/dist/components/NCheckbox.js +74 -63
  16. package/dist/components/NCheckbox.nexa +64 -44
  17. package/dist/components/NChips.nexa +1 -0
  18. package/dist/components/NDataTable.js +300 -356
  19. package/dist/components/NDataTable.nexa +265 -320
  20. package/dist/components/NDatepicker.js +4 -25
  21. package/dist/components/NDatepicker.nexa +5 -25
  22. package/dist/components/NForm.nexa +1 -0
  23. package/dist/components/NFormField.js +0 -5
  24. package/dist/components/NFormField.nexa +1 -5
  25. package/dist/components/NImage.js +1 -6
  26. package/dist/components/NImage.nexa +2 -6
  27. package/dist/components/NInput.js +96 -263
  28. package/dist/components/NInput.nexa +89 -259
  29. package/dist/components/NInputNumber.nexa +1 -1
  30. package/dist/components/NModal.js +1 -118
  31. package/dist/components/NModal.nexa +2 -119
  32. package/dist/components/NMultiSelect.js +1 -1
  33. package/dist/components/NMultiSelect.nexa +2 -1
  34. package/dist/components/NPaginator.js +1 -11
  35. package/dist/components/NPaginator.nexa +2 -11
  36. package/dist/components/NPassword.nexa +1 -0
  37. package/dist/components/NProgressBar.js +0 -11
  38. package/dist/components/NProgressBar.nexa +1 -11
  39. package/dist/components/NRadio.js +1 -8
  40. package/dist/components/NRadio.nexa +2 -8
  41. package/dist/components/NScrollView.js +0 -6
  42. package/dist/components/NScrollView.nexa +1 -6
  43. package/dist/components/NSelect.js +7 -35
  44. package/dist/components/NSelect.nexa +8 -35
  45. package/dist/components/NSkeleton.js +3 -9
  46. package/dist/components/NSkeleton.nexa +4 -9
  47. package/dist/components/NSwitch.js +0 -6
  48. package/dist/components/NSwitch.nexa +1 -6
  49. package/dist/components/NTabs.js +0 -11
  50. package/dist/components/NTabs.nexa +1 -11
  51. package/dist/components/NTag.js +1 -11
  52. package/dist/components/NTag.nexa +2 -11
  53. package/dist/components/NToastContainer.js +3 -27
  54. package/dist/components/NToastContainer.nexa +4 -27
  55. package/dist/components/NTooltip.js +0 -13
  56. package/dist/components/NTooltip.nexa +1 -13
  57. package/dist/components/NTreeMenu.js +1 -21
  58. package/dist/components/NTreeMenu.nexa +2 -21
  59. package/dist/components/NVirtualList.js +0 -2
  60. package/dist/components/NVirtualList.nexa +1 -2
  61. package/dist/styles/tokens.css +82 -173
  62. package/package.json +5 -5
  63. package/src/components/NAlert.nexa +3 -14
  64. package/src/components/NAutocomplete.nexa +2 -1
  65. package/src/components/NAvatar.nexa +1 -5
  66. package/src/components/NBadge.nexa +1 -6
  67. package/src/components/NBottomSheet.nexa +1 -5
  68. package/src/components/NButton.nexa +241 -320
  69. package/src/components/NCard.nexa +27 -71
  70. package/src/components/NCheckbox.nexa +64 -44
  71. package/src/components/NChips.nexa +1 -0
  72. package/src/components/NDataTable.nexa +265 -320
  73. package/src/components/NDatepicker.nexa +5 -25
  74. package/src/components/NForm.nexa +1 -0
  75. package/src/components/NFormField.nexa +1 -5
  76. package/src/components/NImage.nexa +2 -6
  77. package/src/components/NInput.nexa +89 -259
  78. package/src/components/NInputNumber.nexa +1 -1
  79. package/src/components/NModal.nexa +2 -119
  80. package/src/components/NMultiSelect.nexa +2 -1
  81. package/src/components/NPaginator.nexa +2 -11
  82. package/src/components/NPassword.nexa +1 -0
  83. package/src/components/NProgressBar.nexa +1 -11
  84. package/src/components/NRadio.nexa +2 -8
  85. package/src/components/NScrollView.nexa +1 -6
  86. package/src/components/NSelect.nexa +8 -35
  87. package/src/components/NSkeleton.nexa +4 -9
  88. package/src/components/NSwitch.nexa +1 -6
  89. package/src/components/NTabs.nexa +1 -11
  90. package/src/components/NTag.nexa +2 -11
  91. package/src/components/NToastContainer.nexa +4 -27
  92. package/src/components/NTooltip.nexa +1 -13
  93. package/src/components/NTreeMenu.nexa +2 -21
  94. package/src/components/NVirtualList.nexa +1 -2
  95. package/src/styles/tokens.css +82 -173
@@ -2,7 +2,7 @@ import { signal, computed, effect, h, hText, defineComponent, registerComponent,
2
2
  import NPaginator from './NPaginator.js'
3
3
 
4
4
  const _sfc_main = defineComponent({
5
- __scopeId: 'data-v-5a84a658',
5
+ __scopeId: 'data-v-4403e88d',
6
6
  __hmrId: 'NDataTable_nexa',
7
7
  props: { value: { type: Array, default: () => [] }, columns: { type: Array, default: () => [] }, stripedRows: { type: Boolean, default: false }, hoverRows: { type: Boolean, default: true }, size: { type: String, default: 'md' }, scrollable: { type: Boolean, default: true }, paginator: { type: Boolean, default: true }, rows: { type: Number, default: 10 }, first: { type: Number, default: 0 }, rowsPerPageOptions: { type: Array, default: () => [10, 20, 50] }, selectionMode: { type: String, default: '' }, selection: { type: null, default: null }, dataKey: { type: String, default: '' }, sortField: { type: String, default: '' }, sortOrder: { type: Number, default: 1 }, resizableColumns: { type: Boolean, default: true }, columnResizeMode: { type: String, default: 'fit' }, filterDisplay: { type: String, default: 'row' }, globalFilter: { type: String, default: '' }, globalFilterFields: { type: Array, default: null }, filters: { type: null, default: null }, lazy: { type: Boolean, default: false }, totalRecords: { type: Number, default: 0 }, emptyMessage: { type: String, default: 'No records found' }, showGridlines: { type: Boolean, default: false }, searchPlaceholder: { type: String, default: 'Search...' }, filterPlaceholder: { type: String, default: 'Filter' }, loading: { type: Boolean, default: false } },
8
8
  emits: ['update:first', 'update:rows', 'update:selection', 'update:sortField', 'update:sortOrder', 'update:globalFilter', 'update:filters', 'updateFirst', 'updateRows', 'updateSelection', 'updateSortField', 'updateSortOrder', 'updateGlobalFilter', 'updateFilters', 'page', 'rowSelect', 'rowUnselect', 'sort', 'filter'],
@@ -167,97 +167,97 @@ const _sfc_main = defineComponent({
167
167
  // Injected render function
168
168
  _sfc_main.render = function(ctx) {
169
169
  let { internalFirst, internalRows, internalSortField, internalSortOrder, internalFilters, effectiveFilters, columnWidths, resizing, internalSelection, lastPropGlobal, lastPropSelection, normalizeColumns, getRowKey, effectiveSelection, isRowSelected, toggleRowSelection, allVisibleSelected, toggleAllVisible, getHeaderContent, getRawValue, getCellContent, matchFilter, filteredRows, sortedRows, totalRecords, visibleRows, setSort, onSortClick, setGlobal, setColumnFilter, onColumnFilterInput, onPage, getWidth, startResize, NPaginator: _ntc_NPaginator, $slots, emit, value, columns, stripedRows, hoverRows, size, scrollable, paginator, rows, first, rowsPerPageOptions, selectionMode, selection, dataKey, sortField, sortOrder, resizableColumns, columnResizeMode, filterDisplay, globalFilter, globalFilterFields, filters, lazy, emptyMessage, showGridlines, searchPlaceholder, filterPlaceholder, loading, Fragment: _ntc_Fragment } = ctx
170
- return h('div', { class: ["n-dt", [`n-dt-${size}`, showGridlines ? 'is-grid' : '', scrollable ? 'is-scroll' : '']], "aria-busy": loading ? 'true' : undefined, "data-v-5a84a658": "" }, [
170
+ return h('div', { class: ["n-dt", [`n-dt-${size}`, showGridlines ? 'is-grid' : '', scrollable ? 'is-scroll' : '']], "aria-busy": loading ? 'true' : undefined, "data-v-4403e88d": "" }, [
171
171
  "\n ",
172
- h('div', { class: "n-dt-toolbar", "data-v-5a84a658": "" }, [
172
+ h('div', { class: "n-dt-toolbar", "data-v-4403e88d": "" }, [
173
173
  "\r\n ",
174
- h('div', { class: "n-dt-global", "data-v-5a84a658": "" }, [
174
+ h('div', { class: "n-dt-global", "data-v-4403e88d": "" }, [
175
175
  "\r\n ",
176
- h('svg', { viewBox: "0 0 24 24", width: "16", height: "16", fill: "none", stroke: "currentColor", "stroke-width": "2", "stroke-linecap": "round", "stroke-linejoin": "round", focusable: "false", "aria-hidden": "true", "data-v-5a84a658": "" }, [
177
- h('circle', { cx: "11", cy: "11", r: "8", "data-v-5a84a658": "" }),
178
- h('line', { x1: "21", y1: "21", x2: "16.65", y2: "16.65", "data-v-5a84a658": "" })
176
+ h('svg', { viewBox: "0 0 24 24", width: "16", height: "16", fill: "none", stroke: "currentColor", "stroke-width": "2", "stroke-linecap": "round", "stroke-linejoin": "round", focusable: "false", "aria-hidden": "true", "data-v-4403e88d": "" }, [
177
+ h('circle', { cx: "11", cy: "11", r: "8", "data-v-4403e88d": "" }),
178
+ h('line', { x1: "21", y1: "21", x2: "16.65", y2: "16.65", "data-v-4403e88d": "" })
179
179
  ]),
180
180
  "\r\n ",
181
- h('input', { class: "n-dt-global-input", value: effectiveFilters.value.__global || '', placeholder: searchPlaceholder, onInput: setGlobal, "data-v-5a84a658": "" }),
181
+ h('input', { class: "n-dt-global-input", value: effectiveFilters.value.__global || '', placeholder: searchPlaceholder, onInput: setGlobal, "data-v-4403e88d": "" }),
182
182
  "\r\n "
183
183
  ]),
184
184
  "\r\n "
185
185
  ]),
186
186
  "\r\n ",
187
- h('div', { class: "n-dt-wrapper", "data-v-5a84a658": "" }, [
187
+ h('div', { class: "n-dt-wrapper", "data-v-4403e88d": "" }, [
188
188
  "\r\n ",
189
- h('table', { class: ["n-dt-table", { 'is-striped': stripedRows, 'is-hover': hoverRows }], "data-v-5a84a658": "" }, [
189
+ h('table', { class: ["n-dt-table", { 'is-striped': stripedRows, 'is-hover': hoverRows }], "data-v-4403e88d": "" }, [
190
190
  "\r\n ",
191
- h('thead', { class: "n-dt-thead", "data-v-5a84a658": "" }, [
191
+ h('thead', { class: "n-dt-thead", "data-v-4403e88d": "" }, [
192
192
  "\r\n ",
193
- h('tr', { class: "n-dt-head-row", "data-v-5a84a658": "" }, [
193
+ h('tr', { class: "n-dt-head-row", "data-v-4403e88d": "" }, [
194
194
  "\r\n ",
195
- (selectionMode) ? h('th', { class: "n-dt-th is-selection", "data-v-5a84a658": "" }, [
195
+ (selectionMode) ? h('th', { class: "n-dt-th is-selection", "data-v-4403e88d": "" }, [
196
196
  "\r\n ",
197
- (selectionMode === 'multiple') ? h('button', { class: ["n-dt-selectbox", { 'is-checked': allVisibleSelected.value }], type: "button", onClick: ($event) => { $event.stopPropagation(); (toggleAllVisible)($event) }, "aria-label": allVisibleSelected.value ? 'Deselect all' : 'Select all', "data-v-5a84a658": "" }, [
197
+ (selectionMode === 'multiple') ? h('button', { class: ["n-dt-selectbox", { 'is-checked': allVisibleSelected.value }], type: "button", onClick: ($event) => { $event.stopPropagation(); (toggleAllVisible)($event) }, "aria-label": allVisibleSelected.value ? 'Deselect all' : 'Select all', "data-v-4403e88d": "" }, [
198
198
  "\r\n ",
199
- (allVisibleSelected.value) ? h('svg', { viewBox: "0 0 24 24", width: "14", height: "14", fill: "none", stroke: "currentColor", "stroke-width": "3", "stroke-linecap": "round", "stroke-linejoin": "round", focusable: "false", "aria-hidden": "true", "data-v-5a84a658": "" }, [
200
- h('path', { d: "M20 6L9 17l-5-5", "data-v-5a84a658": "" })
199
+ (allVisibleSelected.value) ? h('svg', { viewBox: "0 0 24 24", width: "14", height: "14", fill: "none", stroke: "currentColor", "stroke-width": "3", "stroke-linecap": "round", "stroke-linejoin": "round", focusable: "false", "aria-hidden": "true", "data-v-4403e88d": "" }, [
200
+ h('path', { d: "M20 6L9 17l-5-5", "data-v-4403e88d": "" })
201
201
  ]) : null
202
202
  ]) : null
203
203
  ]) : null,
204
204
  (normalizeColumns.value).map((col, index) =>
205
- h('th', { class: ["n-dt-th", [`is-${col.align}`, col.sortable ? 'is-sortable' : '']], key: col.field, style: { width: getWidth(col) || undefined, minWidth: col.minWidth }, "data-field": col.field, onClick: onSortClick, "data-v-5a84a658": "" }, [
205
+ h('th', { class: ["n-dt-th", [`is-${col.align}`, col.sortable ? 'is-sortable' : '']], key: col.field, style: { width: getWidth(col) || undefined, minWidth: col.minWidth }, "data-field": col.field, onClick: onSortClick, "data-v-4403e88d": "" }, [
206
206
  "\r\n ",
207
- h('div', { class: "n-dt-th-content", "data-v-5a84a658": "" }, [
207
+ h('div', { class: "n-dt-th-content", "data-v-4403e88d": "" }, [
208
208
  "\r\n ",
209
- h('span', { class: "n-dt-th-text", "data-v-5a84a658": "" }, [
209
+ h('span', { class: "n-dt-th-text", "data-v-4403e88d": "" }, [
210
210
  $slots.value && $slots.value[`header-${col.field}`] ? $slots[`header-${col.field}`]({ column: col }) : getHeaderContent(col)
211
211
  ]),
212
212
  "\r\n ",
213
- (col.sortable) ? h('span', { class: ["n-dt-sort", { 'is-active': internalSortField.value === col.field }], "data-v-5a84a658": "" }, [
213
+ (col.sortable) ? h('span', { class: ["n-dt-sort", { 'is-active': internalSortField.value === col.field }], "data-v-4403e88d": "" }, [
214
214
  "\r\n ",
215
- h('svg', { class: ["n-dt-sort-arrow n-dt-sort-arrow-up", { 'is-on': internalSortField.value === col.field && internalSortOrder.value === 1 }], viewBox: "0 0 24 24", width: "16", height: "16", fill: "none", stroke: "currentColor", "stroke-width": "2", "stroke-linecap": "round", "stroke-linejoin": "round", focusable: "false", "aria-hidden": "true", "data-v-5a84a658": "" }, [
216
- h('path', { d: "M12 19V5M5 12l7-7 7 7", "data-v-5a84a658": "" })
215
+ h('svg', { class: ["n-dt-sort-arrow n-dt-sort-arrow-up", { 'is-on': internalSortField.value === col.field && internalSortOrder.value === 1 }], viewBox: "0 0 24 24", width: "16", height: "16", fill: "none", stroke: "currentColor", "stroke-width": "2", "stroke-linecap": "round", "stroke-linejoin": "round", focusable: "false", "aria-hidden": "true", "data-v-4403e88d": "" }, [
216
+ h('path', { d: "M12 19V5M5 12l7-7 7 7", "data-v-4403e88d": "" })
217
217
  ]),
218
218
  "\r\n ",
219
- h('svg', { class: ["n-dt-sort-arrow n-dt-sort-arrow-down", { 'is-on': internalSortField.value === col.field && internalSortOrder.value === -1 }], viewBox: "0 0 24 24", width: "16", height: "16", fill: "none", stroke: "currentColor", "stroke-width": "2", "stroke-linecap": "round", "stroke-linejoin": "round", focusable: "false", "aria-hidden": "true", "data-v-5a84a658": "" }, [
220
- h('path', { d: "M12 5v14M19 12l-7 7-7-7", "data-v-5a84a658": "" })
219
+ h('svg', { class: ["n-dt-sort-arrow n-dt-sort-arrow-down", { 'is-on': internalSortField.value === col.field && internalSortOrder.value === -1 }], viewBox: "0 0 24 24", width: "16", height: "16", fill: "none", stroke: "currentColor", "stroke-width": "2", "stroke-linecap": "round", "stroke-linejoin": "round", focusable: "false", "aria-hidden": "true", "data-v-4403e88d": "" }, [
220
+ h('path', { d: "M12 5v14M19 12l-7 7-7-7", "data-v-4403e88d": "" })
221
221
  ]),
222
222
  "\r\n "
223
223
  ]) : null
224
224
  ]),
225
225
  "\r\n ",
226
- (resizableColumns) ? h('span', { class: "n-dt-resizer", "data-field": col.field, onMousedown: startResize, "data-v-5a84a658": "" }) : null
226
+ (resizableColumns) ? h('span', { class: "n-dt-resizer", "data-field": col.field, onMousedown: startResize, "data-v-4403e88d": "" }) : null
227
227
  ])
228
228
  ),
229
229
  "\r\n "
230
230
  ]),
231
231
  "\r\n ",
232
- (filterDisplay === 'row') ? h('tr', { class: "n-dt-filter-row", "data-v-5a84a658": "" }, [
232
+ (filterDisplay === 'row') ? h('tr', { class: "n-dt-filter-row", "data-v-4403e88d": "" }, [
233
233
  "\r\n ",
234
- (selectionMode) ? h('th', { class: "n-dt-th is-selection", "data-v-5a84a658": "" }) : null,
234
+ (selectionMode) ? h('th', { class: "n-dt-th is-selection", "data-v-4403e88d": "" }) : null,
235
235
  (normalizeColumns.value).map((col, index) =>
236
- h('th', { class: ["n-dt-th", `is-${col.align}`], key: col.field, style: { width: getWidth(col) || undefined, minWidth: col.minWidth }, "data-v-5a84a658": "" }, [
236
+ h('th', { class: ["n-dt-th", `is-${col.align}`], key: col.field, style: { width: getWidth(col) || undefined, minWidth: col.minWidth }, "data-v-4403e88d": "" }, [
237
237
  "\r\n ",
238
- (col.filterable) ? h('input', { class: "n-dt-filter", "data-field": col.field, value: (effectiveFilters.value[col.field]?.value) || '', placeholder: filterPlaceholder, onInput: onColumnFilterInput, "data-v-5a84a658": "" }) : null
238
+ (col.filterable) ? h('input', { class: "n-dt-filter", "data-field": col.field, value: (effectiveFilters.value[col.field]?.value) || '', placeholder: filterPlaceholder, onInput: onColumnFilterInput, "data-v-4403e88d": "" }) : null
239
239
  ])
240
240
  ),
241
241
  "\r\n "
242
242
  ]) : null
243
243
  ]),
244
244
  "\r\n ",
245
- h('tbody', { class: "n-dt-tbody", "data-v-5a84a658": "" }, [
245
+ h('tbody', { class: "n-dt-tbody", "data-v-4403e88d": "" }, [
246
246
  "\r\n ",
247
247
  (visibleRows.value).map((row, i) =>
248
- h('tr', { class: ["n-dt-row", { 'is-selected': isRowSelected(row, i + internalFirst.value) }], key: getRowKey(row, i + internalFirst.value), onClick: ($event) => { toggleRowSelection(row, i + internalFirst.value) }, "data-v-5a84a658": "" }, [
248
+ h('tr', { class: ["n-dt-row", { 'is-selected': isRowSelected(row, i + internalFirst.value) }], key: getRowKey(row, i + internalFirst.value), onClick: ($event) => { toggleRowSelection(row, i + internalFirst.value) }, "data-v-4403e88d": "" }, [
249
249
  "\r\n ",
250
- (selectionMode) ? h('td', { class: "n-dt-td is-selection", "data-v-5a84a658": "" }, [
250
+ (selectionMode) ? h('td', { class: "n-dt-td is-selection", "data-v-4403e88d": "" }, [
251
251
  "\r\n ",
252
- (selectionMode === 'multiple') ? h('button', { class: ["n-dt-selectbox", { 'is-checked': isRowSelected(row, i + internalFirst.value) }], type: "button", onClick: ($event) => { $event.stopPropagation(); (($event) => { toggleRowSelection(row, i + internalFirst.value) })($event) }, "aria-label": isRowSelected(row, i + internalFirst.value) ? 'Deselect row' : 'Select row', "data-v-5a84a658": "" }, [
252
+ (selectionMode === 'multiple') ? h('button', { class: ["n-dt-selectbox", { 'is-checked': isRowSelected(row, i + internalFirst.value) }], type: "button", onClick: ($event) => { $event.stopPropagation(); (($event) => { toggleRowSelection(row, i + internalFirst.value) })($event) }, "aria-label": isRowSelected(row, i + internalFirst.value) ? 'Deselect row' : 'Select row', "data-v-4403e88d": "" }, [
253
253
  "\r\n ",
254
- (isRowSelected(row, i + internalFirst.value)) ? h('svg', { viewBox: "0 0 24 24", width: "14", height: "14", fill: "none", stroke: "currentColor", "stroke-width": "3", "stroke-linecap": "round", "stroke-linejoin": "round", focusable: "false", "aria-hidden": "true", "data-v-5a84a658": "" }, [
255
- h('path', { d: "M20 6L9 17l-5-5", "data-v-5a84a658": "" })
254
+ (isRowSelected(row, i + internalFirst.value)) ? h('svg', { viewBox: "0 0 24 24", width: "14", height: "14", fill: "none", stroke: "currentColor", "stroke-width": "3", "stroke-linecap": "round", "stroke-linejoin": "round", focusable: "false", "aria-hidden": "true", "data-v-4403e88d": "" }, [
255
+ h('path', { d: "M20 6L9 17l-5-5", "data-v-4403e88d": "" })
256
256
  ]) : null
257
257
  ]) : null
258
258
  ]) : null,
259
259
  (normalizeColumns.value).map((col, index) =>
260
- h('td', { class: ["n-dt-td", `is-${col.align}`], key: col.field, style: { width: getWidth(col) || undefined, minWidth: col.minWidth }, "data-v-5a84a658": "" }, [
260
+ h('td', { class: ["n-dt-td", `is-${col.align}`], key: col.field, style: { width: getWidth(col) || undefined, minWidth: col.minWidth }, "data-v-4403e88d": "" }, [
261
261
  "\r\n ",
262
262
  $slots.value && $slots.value[`body-${col.field}`] ? $slots[`body-${col.field}`]({ data: row, column: col, index: i + internalFirst.value }) : getCellContent(row, col, i + internalFirst.value),
263
263
  "\r\n "
@@ -267,8 +267,8 @@ _sfc_main.render = function(ctx) {
267
267
  ])
268
268
  ),
269
269
  "\r\n ",
270
- (visibleRows.value.length === 0) ? h('tr', { class: "n-dt-empty-row", "data-v-5a84a658": "" }, [
271
- h('td', { class: "n-dt-empty", colspan: normalizeColumns.value.length + (selectionMode ? 1 : 0), "data-v-5a84a658": "" }, [
270
+ (visibleRows.value.length === 0) ? h('tr', { class: "n-dt-empty-row", "data-v-4403e88d": "" }, [
271
+ h('td', { class: "n-dt-empty", colspan: normalizeColumns.value.length + (selectionMode ? 1 : 0), "data-v-4403e88d": "" }, [
272
272
  emptyMessage
273
273
  ])
274
274
  ]) : null
@@ -278,329 +278,273 @@ _sfc_main.render = function(ctx) {
278
278
  "\r\n "
279
279
  ]),
280
280
  "\r\n ",
281
- (paginator) ? h('div', { class: "n-dt-paginator-wrap", "data-v-5a84a658": "" }, [
282
- "\r\n ",
283
- h(_ntc_NPaginator, { first: internalFirst.value, rows: internalRows.value, totalRecords: totalRecords.value, rowsPerPageOptions: rowsPerPageOptions, onPage: onPage, "data-v-5a84a658": "" }),
284
- "\r\n "
281
+ (paginator) ? h('div', { class: "n-dt-paginator-wrap", "data-v-4403e88d": "" }, [
282
+ "\n ",
283
+ h(_ntc_NPaginator, { first: internalFirst.value, rows: internalRows.value, totalRecords: totalRecords.value, rowsPerPageOptions: rowsPerPageOptions, onPage: onPage, "data-v-4403e88d": "" }),
284
+ "\n "
285
285
  ]) : null
286
286
  ])
287
287
  }
288
- _sfc_main.__scopeId = 'data-v-5a84a658'
288
+ _sfc_main.__scopeId = 'data-v-4403e88d'
289
289
  _sfc_main.__hmrId = 'NDataTable_nexa'
290
290
 
291
291
  export default _sfc_main
292
292
 
293
- const __style = `.n-dt[data-v-5a84a658]{
294
- border: 1px solid var(--n-color-border);
295
- border-radius: var(--n-radius-lg);
296
- background: var(--n-color-surface);
297
- overflow: hidden;
298
- font-family: var(--n-font-sans);
299
- }
300
-
301
- .n-dt.is-grid[data-v-5a84a658]{
302
- border-color: var(--n-color-border);
303
- }
304
-
305
- .n-dt.is-grid .n-dt-th[data-v-5a84a658],
306
- .n-dt.is-grid .n-dt-td[data-v-5a84a658]{
307
- border: 1px solid var(--n-color-border);
308
- }
309
-
310
- .n-dt-toolbar[data-v-5a84a658]{
311
- display: flex;
312
- align-items: center;
313
- justify-content: space-between;
314
- padding: 0.75rem 1rem;
315
- border-bottom: 1px solid var(--n-color-border);
316
- }
317
-
318
- .n-dt-global[data-v-5a84a658]{
319
- display: flex;
320
- align-items: center;
321
- gap: 0.5rem;
322
- color: var(--n-color-text-muted);
323
- }
324
-
325
- .n-dt-global-input[data-v-5a84a658]{
326
- width: 260px;
327
- max-width: 100%;
328
- background: transparent;
329
- border: 1px solid var(--n-color-border);
330
- border-radius: var(--n-radius-md);
331
- padding: 0.45rem 0.75rem;
332
- color: var(--n-color-text);
333
- font-size: var(--n-text-sm);
334
- outline: none;
335
- box-sizing: border-box;
336
- transition: border-color 0.15s ease;
337
- }
338
-
339
- .n-dt-global-input[data-v-5a84a658]:focus{
340
- border-color: var(--n-color-primary);
341
- }
342
-
343
- .n-dt-wrapper[data-v-5a84a658]{
344
- width: 100%;
345
- overflow: auto;
346
- border-radius: inherit;
347
- }
348
-
349
- .n-dt-table[data-v-5a84a658]{
350
- width: 100%;
351
- border-collapse: collapse;
352
- table-layout: fixed;
353
- }
354
-
355
- .n-dt-thead[data-v-5a84a658]{
356
- background: linear-gradient(180deg, var(--n-color-surface-alt, var(--n-color-surface)) 0%, var(--n-color-surface) 100%);
357
- }
358
-
359
- .n-dt-th[data-v-5a84a658]{
360
- position: relative;
361
- padding: 0.65rem 0.85rem;
362
- border-bottom: 2px solid var(--n-color-border);
363
- color: var(--n-color-text-secondary);
364
- font-size: var(--n-text-sm);
365
- font-weight: var(--n-weight-semibold);
366
- user-select: none;
367
- vertical-align: middle;
368
- text-align: left;
369
- background: var(--n-color-surface);
370
- transition: background 0.15s ease;
371
- }
372
-
373
- .n-dt-th.is-sortable[data-v-5a84a658]{
374
- cursor: pointer;
375
- }
376
-
377
- .n-dt-th.is-sortable[data-v-5a84a658]:hover{
378
- background: var(--n-color-glass);
379
- }
380
-
381
- .n-dt-th.is-right[data-v-5a84a658]{
382
- text-align: right;
383
- }
384
-
385
- .n-dt-th.is-center[data-v-5a84a658]{
386
- text-align: center;
387
- }
388
-
389
- .n-dt-th.is-selection[data-v-5a84a658]{
390
- width: 3rem;
391
- text-align: center;
392
- }
393
-
394
- .n-dt-th-content[data-v-5a84a658]{
395
- display: flex;
396
- align-items: center;
397
- gap: 0.35rem;
398
- }
399
-
400
- .n-dt-th.is-right .n-dt-th-content[data-v-5a84a658]{
401
- justify-content: flex-end;
402
- }
403
-
404
- .n-dt-th.is-center .n-dt-th-content[data-v-5a84a658]{
405
- justify-content: center;
406
- }
407
-
408
- .n-dt-th-text[data-v-5a84a658]{
409
- overflow: hidden;
410
- text-overflow: ellipsis;
411
- white-space: nowrap;
412
- letter-spacing: 0.02em;
413
- text-transform: uppercase;
414
- font-size: 0.6875rem;
415
- }
416
-
417
- .n-dt-sort[data-v-5a84a658]{
418
- display: inline-flex;
419
- flex-direction: column;
420
- align-items: center;
421
- gap: 0;
422
- line-height: 1;
423
- margin-left: auto;
424
- flex-shrink: 0;
425
- }
426
-
427
- .n-dt-sort-arrow[data-v-5a84a658]{
428
- display: block;
429
- color: var(--n-color-border);
430
- transition: color 0.15s ease;
431
- margin: -3px 0;
432
- }
433
-
434
- .n-dt-sort-arrow-up.is-on[data-v-5a84a658]{
435
- color: var(--n-color-primary);
436
- }
437
-
438
- .n-dt-sort-arrow-down.is-on[data-v-5a84a658]{
439
- color: var(--n-color-primary);
440
- }
441
-
442
- .n-dt-th.is-sortable[data-v-5a84a658]:hover .n-dt-sort-arrow{
443
- color: var(--n-color-text-muted);
444
- }
445
-
446
- .n-dt-resizer[data-v-5a84a658]{
447
- position: absolute;
448
- right: 0;
449
- top: 0;
450
- bottom: 0;
451
- width: 6px;
452
- cursor: col-resize;
453
- background: transparent;
454
- transition: background 0.15s ease;
455
- }
456
-
457
- .n-dt-resizer[data-v-5a84a658]:hover{
458
- background: var(--n-color-primary);
459
- opacity: 0.4;
460
- }
461
-
462
- .n-dt-filter-row .n-dt-th[data-v-5a84a658]{
463
- border-bottom: 1px solid var(--n-color-border);
464
- padding: 0.5rem 0.6rem;
465
- background: var(--n-color-surface);
466
- }
467
-
468
- .n-dt-filter[data-v-5a84a658]{
469
- width: 100%;
470
- max-width: 100%;
471
- display: block;
472
- background: var(--n-color-bg);
473
- border: 1px solid var(--n-color-border);
474
- border-radius: var(--n-radius-sm);
475
- padding: 0.3rem 0.45rem;
476
- color: var(--n-color-text);
477
- font-size: var(--n-text-xs);
478
- outline: none;
479
- box-sizing: border-box;
480
- transition: border-color 0.15s ease;
481
- }
482
-
483
- .n-dt-filter[data-v-5a84a658]:focus{
484
- border-color: var(--n-color-primary);
485
- }
486
-
487
- .n-dt-tbody .n-dt-row{
488
- transition: background 0.2s cubic-bezier(0.16, 1, 0.3, 1);
489
- }
490
-
491
- .n-dt-tbody .n-dt-row.is-hover:hover{
492
- background: color-mix(in srgb, var(--n-color-primary) 6%, var(--n-color-surface));
493
- }
494
-
495
- .n-dt-tbody .n-dt-row.is-selected{
496
- background: var(--n-color-primary-light);
497
- outline: none;
498
- }
499
-
500
- .n-dt-tbody .n-dt-row.is-selected td:first-child{
501
- box-shadow: inset 3px 0 0 0 var(--n-color-primary);
502
- }
503
-
504
- .n-dt-tbody .n-dt-row.is-hover.is-selected:hover{
505
- background: var(--n-color-primary-light);
506
- filter: brightness(0.96);
507
- }
508
-
509
- .n-dt-table.is-striped .n-dt-tbody .n-dt-row:nth-child(even){
510
- background: color-mix(in srgb, var(--n-color-glass) 50%, var(--n-color-surface));
511
- }
512
-
513
- .n-dt-table.is-striped .n-dt-tbody .n-dt-row:nth-child(even).is-hover:hover{
514
- background: color-mix(in srgb, var(--n-color-primary) 6%, var(--n-color-surface));
515
- }
516
-
517
- .n-dt-table.is-striped .n-dt-tbody .n-dt-row:nth-child(even).is-selected{
518
- background: var(--n-color-primary-light);
519
- }
520
-
521
- .n-dt-td[data-v-5a84a658]{
522
- padding: 0.6rem 0.85rem;
523
- border-bottom: 1px solid var(--n-color-border);
524
- color: var(--n-color-text);
525
- font-size: var(--n-text-sm);
526
- vertical-align: middle;
527
- text-align: left;
528
- }
529
-
530
- .n-dt-td.is-right[data-v-5a84a658]{
531
- text-align: right;
532
- }
533
-
534
- .n-dt-td.is-center[data-v-5a84a658]{
535
- text-align: center;
536
- }
537
-
538
- .n-dt-td.is-selection[data-v-5a84a658]{
539
- width: 3rem;
540
- text-align: center;
541
- }
542
-
543
- .n-dt-selectbox[data-v-5a84a658]{
544
- width: 20px;
545
- height: 20px;
546
- border: 2px solid var(--n-color-border);
547
- border-radius: 5px;
548
- background: transparent;
549
- cursor: pointer;
550
- display: inline-flex;
551
- align-items: center;
552
- justify-content: center;
553
- padding: 0;
554
- transition: all 0.2s cubic-bezier(0.16, 1, 0.3, 1);
555
- color: transparent;
556
- }
557
-
558
- .n-dt-selectbox.is-checked[data-v-5a84a658]{
559
- background: var(--n-color-primary);
560
- border-color: var(--n-color-primary);
561
- color: white;
562
- }
563
-
564
- .n-dt-selectbox[data-v-5a84a658]:hover:not(.is-checked){
565
- border-color: var(--n-color-primary);
566
- }
567
-
568
- .n-dt-selectbox.is-checked svg[data-v-5a84a658]{
569
- animation: n-dt-check-pop 0.25s cubic-bezier(0.16, 1, 0.3, 1);
570
- }
571
-
572
- @keyframes n-dt-check-pop {
573
- 0%[data-v-5a84a658]{ transform: scale(0); }
574
- 50%[data-v-5a84a658]{ transform: scale(1.15); }
575
- 100%[data-v-5a84a658]{ transform: scale(1); }
576
- }
577
-
578
- .n-dt-empty-row .n-dt-empty[data-v-5a84a658]{
579
- padding: 2rem 1rem;
580
- text-align: center;
581
- color: var(--n-color-text-muted);
582
- font-size: var(--n-text-sm);
583
- }
584
-
585
- .n-dt-sm .n-dt-th[data-v-5a84a658],
586
- .n-dt-sm .n-dt-td[data-v-5a84a658]{
587
- padding: 0.4rem 0.6rem;
588
- font-size: var(--n-text-xs);
589
- }
590
-
591
- .n-dt-lg .n-dt-th[data-v-5a84a658],
592
- .n-dt-lg .n-dt-td[data-v-5a84a658]{
593
- padding: 0.85rem 1rem;
594
- font-size: var(--n-text-base);
595
- }
596
-
597
- .n-dt-paginator-wrap[data-v-5a84a658]{
598
- border-top: 1px solid var(--n-color-border);
599
- background: var(--n-color-surface-alt, var(--n-color-surface));
600
- }
601
-
602
- .n-dt-paginator-wrap [data-v-5a84a658]:deep(.n-paginator){
603
- border-top: none;
604
- background: transparent;
293
+ const __style = `.n-dt[data-v-4403e88d]{
294
+ border: 1px solid var(--n-color-border);
295
+ border-radius: var(--n-radius-lg);
296
+ background: var(--n-color-surface);
297
+ overflow: hidden;
298
+ font-family: var(--n-font-sans);
299
+ }
300
+ .n-dt.is-grid[data-v-4403e88d]{
301
+ border-color: var(--n-color-border);
302
+ }
303
+ .n-dt.is-grid .n-dt-th[data-v-4403e88d],
304
+ .n-dt.is-grid .n-dt-td[data-v-4403e88d]{
305
+ border: 1px solid var(--n-color-border);
306
+ }
307
+ .n-dt-toolbar[data-v-4403e88d]{
308
+ display: flex;
309
+ align-items: center;
310
+ justify-content: space-between;
311
+ padding: 0.75rem 1rem;
312
+ border-bottom: 1px solid var(--n-color-border);
313
+ }
314
+ .n-dt-global[data-v-4403e88d]{
315
+ display: flex;
316
+ align-items: center;
317
+ gap: 0.5rem;
318
+ color: var(--n-color-text-muted);
319
+ }
320
+ .n-dt-global-input[data-v-4403e88d]{
321
+ width: 260px;
322
+ max-width: 100%;
323
+ background: transparent;
324
+ border: 1px solid var(--n-color-border);
325
+ border-radius: var(--n-radius-md);
326
+ padding: 0.45rem 0.75rem;
327
+ color: var(--n-color-text);
328
+ font-size: var(--n-text-sm);
329
+ outline: none;
330
+ box-sizing: border-box;
331
+ transition: border-color var(--n-transition-fast), box-shadow var(--n-transition-fast);
332
+ }
333
+ .n-dt-global-input[data-v-4403e88d]:focus{
334
+ border-color: var(--n-color-primary);
335
+ box-shadow: var(--n-ring-primary);
336
+ }
337
+ .n-dt-wrapper[data-v-4403e88d]{
338
+ width: 100%;
339
+ overflow: auto;
340
+ border-radius: inherit;
341
+ }
342
+ .n-dt-table[data-v-4403e88d]{
343
+ width: 100%;
344
+ border-collapse: collapse;
345
+ table-layout: fixed;
346
+ }
347
+ .n-dt-thead[data-v-4403e88d]{
348
+ background-color: var(--n-color-surface-alt);
349
+ }
350
+ .n-dt-th[data-v-4403e88d]{
351
+ position: relative;
352
+ padding: 0.75rem 1rem;
353
+ border-bottom: 1px solid var(--n-color-border);
354
+ color: var(--n-color-text);
355
+ font-size: var(--n-text-sm);
356
+ font-weight: 600;
357
+ user-select: none;
358
+ vertical-align: middle;
359
+ text-align: left;
360
+ background: var(--n-color-surface-alt);
361
+ transition: background-color var(--n-transition-fast);
362
+ }
363
+ .n-dt-th.is-sortable[data-v-4403e88d]{
364
+ cursor: pointer;
365
+ }
366
+ .n-dt-th.is-sortable[data-v-4403e88d]:hover{
367
+ background-color: var(--n-color-surface-hover);
368
+ }
369
+ .n-dt-th.is-right[data-v-4403e88d]{
370
+ text-align: right;
371
+ }
372
+ .n-dt-th.is-center[data-v-4403e88d]{
373
+ text-align: center;
374
+ }
375
+ .n-dt-th.is-selection[data-v-4403e88d]{
376
+ width: 3rem;
377
+ text-align: center;
378
+ }
379
+ .n-dt-th-content[data-v-4403e88d]{
380
+ display: flex;
381
+ align-items: center;
382
+ gap: 0.5rem;
383
+ }
384
+ .n-dt-th.is-right .n-dt-th-content[data-v-4403e88d]{
385
+ justify-content: flex-end;
386
+ }
387
+ .n-dt-th.is-center .n-dt-th-content[data-v-4403e88d]{
388
+ justify-content: center;
389
+ }
390
+ .n-dt-th-text[data-v-4403e88d]{
391
+ overflow: hidden;
392
+ text-overflow: ellipsis;
393
+ white-space: nowrap;
394
+ letter-spacing: normal;
395
+ }
396
+ .n-dt-sort[data-v-4403e88d]{
397
+ display: inline-flex;
398
+ flex-direction: column;
399
+ align-items: center;
400
+ gap: 0;
401
+ line-height: 1;
402
+ margin-left: auto;
403
+ flex-shrink: 0;
404
+ }
405
+ .n-dt-sort-arrow[data-v-4403e88d]{
406
+ display: block;
407
+ color: var(--n-color-text-muted);
408
+ transition: color var(--n-transition-fast);
409
+ margin: -3px 0;
410
+ }
411
+ .n-dt-sort-arrow-up.is-on[data-v-4403e88d],
412
+ .n-dt-sort-arrow-down.is-on[data-v-4403e88d]{
413
+ color: var(--n-color-primary);
414
+ }
415
+ .n-dt-th.is-sortable[data-v-4403e88d]:hover .n-dt-sort-arrow:not(.is-on){
416
+ color: var(--n-color-text);
417
+ }
418
+ .n-dt-resizer[data-v-4403e88d]{
419
+ position: absolute;
420
+ right: 0;
421
+ top: 0;
422
+ bottom: 0;
423
+ width: 4px;
424
+ cursor: col-resize;
425
+ background: transparent;
426
+ transition: background-color var(--n-transition-fast);
427
+ }
428
+ .n-dt-resizer[data-v-4403e88d]:hover{
429
+ background-color: var(--n-color-primary);
430
+ }
431
+ .n-dt-filter-row .n-dt-th[data-v-4403e88d]{
432
+ border-bottom: 1px solid var(--n-color-border);
433
+ padding: 0.5rem 1rem;
434
+ background-color: var(--n-color-surface-alt);
435
+ }
436
+ .n-dt-filter[data-v-4403e88d]{
437
+ width: 100%;
438
+ max-width: 100%;
439
+ display: block;
440
+ background: var(--n-color-surface);
441
+ border: 1px solid var(--n-color-border);
442
+ border-radius: var(--n-radius-sm);
443
+ padding: 0.375rem 0.5rem;
444
+ color: var(--n-color-text);
445
+ font-size: var(--n-text-xs);
446
+ outline: none;
447
+ box-sizing: border-box;
448
+ transition: border-color var(--n-transition-fast), box-shadow var(--n-transition-fast);
449
+ }
450
+ .n-dt-filter[data-v-4403e88d]:focus{
451
+ border-color: var(--n-color-primary);
452
+ box-shadow: var(--n-ring-primary);
453
+ }
454
+ .n-dt-tbody .n-dt-row{
455
+ background-color: var(--n-color-surface);
456
+ transition: background-color var(--n-transition-fast), color var(--n-transition-fast);
457
+ }
458
+ .n-dt-tbody .n-dt-row.is-hover:hover{
459
+ background-color: var(--n-color-surface-hover);
460
+ }
461
+ .n-dt-tbody .n-dt-row.is-selected{
462
+ background-color: var(--n-color-primary-light);
463
+ color: var(--n-color-primary-text);
464
+ }
465
+ .n-dt-tbody .n-dt-row.is-selected .n-dt-td{
466
+ color: var(--n-color-primary-active);
467
+ }
468
+ .n-dt-table.is-striped .n-dt-tbody .n-dt-row:nth-child(even){
469
+ background-color: var(--n-color-surface-alt);
470
+ }
471
+ .n-dt-table.is-striped .n-dt-tbody .n-dt-row:nth-child(even).is-hover:hover{
472
+ background-color: var(--n-color-surface-hover);
473
+ }
474
+ .n-dt-td[data-v-4403e88d]{
475
+ padding: 0.75rem 1rem;
476
+ border-bottom: 1px solid var(--n-color-border);
477
+ color: var(--n-color-text);
478
+ font-size: var(--n-text-sm);
479
+ vertical-align: middle;
480
+ text-align: left;
481
+ }
482
+ .n-dt-td.is-right[data-v-4403e88d]{
483
+ text-align: right;
484
+ }
485
+ .n-dt-td.is-center[data-v-4403e88d]{
486
+ text-align: center;
487
+ }
488
+ .n-dt-td.is-selection[data-v-4403e88d]{
489
+ width: 3rem;
490
+ text-align: center;
491
+ }
492
+ .n-dt-selectbox[data-v-4403e88d]{
493
+ width: 20px;
494
+ height: 20px;
495
+ border: 2px solid var(--n-color-border);
496
+ border-radius: var(--n-radius-sm);
497
+ background: transparent;
498
+ cursor: pointer;
499
+ display: inline-flex;
500
+ align-items: center;
501
+ justify-content: center;
502
+ padding: 0;
503
+ transition: background-color var(--n-transition-fast), border-color var(--n-transition-fast), box-shadow var(--n-transition-fast);
504
+ color: transparent;
505
+ }
506
+ .n-dt-selectbox.is-checked[data-v-4403e88d]{
507
+ background-color: var(--n-color-primary);
508
+ border-color: var(--n-color-primary);
509
+ color: #fff;
510
+ }
511
+ .n-dt-selectbox[data-v-4403e88d]:hover:not(.is-checked){
512
+ border-color: var(--n-color-primary);
513
+ }
514
+ .n-dt-selectbox[data-v-4403e88d]:focus-visible{
515
+ outline: none;
516
+ box-shadow: var(--n-ring-primary);
517
+ }
518
+ .n-dt-selectbox.is-checked svg[data-v-4403e88d]{
519
+ animation: n-dt-check-pop 0.2s ease-out;
520
+ }
521
+ @keyframes n-dt-check-pop {
522
+ 0%[data-v-4403e88d]{ transform: scale(0.5); }
523
+ 50%[data-v-4403e88d]{ transform: scale(1.2); }
524
+ 100%[data-v-4403e88d]{ transform: scale(1); }
525
+ }
526
+ .n-dt-empty-row .n-dt-empty[data-v-4403e88d]{
527
+ padding: 2rem 1rem;
528
+ text-align: center;
529
+ color: var(--n-color-text-muted);
530
+ font-size: var(--n-text-sm);
531
+ }
532
+ .n-dt-sm .n-dt-th[data-v-4403e88d],
533
+ .n-dt-sm .n-dt-td[data-v-4403e88d]{
534
+ padding: 0.5rem 0.75rem;
535
+ font-size: var(--n-text-xs);
536
+ }
537
+ .n-dt-lg .n-dt-th[data-v-4403e88d],
538
+ .n-dt-lg .n-dt-td[data-v-4403e88d]{
539
+ padding: 1rem 1.25rem;
540
+ font-size: var(--n-text-base);
541
+ }
542
+ .n-dt-paginator-wrap[data-v-4403e88d]{
543
+ border-top: 1px solid var(--n-color-border);
544
+ background: var(--n-color-surface-alt);
545
+ }
546
+ .n-dt-paginator-wrap [data-v-4403e88d]:deep(.n-paginator){
547
+ border-top: none;
548
+ background: transparent;
605
549
  }`
606
- injectStyle('data-v-5a84a658', __style)
550
+ injectStyle('data-v-4403e88d', __style)