@neural-ui/core 1.2.1 → 1.3.1

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 (239) hide show
  1. package/README.md +56 -88
  2. package/accordion/package.json +4 -0
  3. package/alert/package.json +4 -0
  4. package/autocomplete/package.json +4 -0
  5. package/avatar/package.json +4 -0
  6. package/badge/package.json +4 -0
  7. package/block-ui/package.json +4 -0
  8. package/breadcrumb/package.json +4 -0
  9. package/button/package.json +4 -0
  10. package/card/package.json +4 -0
  11. package/chart/package.json +4 -0
  12. package/checkbox/package.json +4 -0
  13. package/chip/package.json +4 -0
  14. package/code-block/package.json +4 -0
  15. package/color-picker/package.json +4 -0
  16. package/command-palette/package.json +4 -0
  17. package/confirm-dialog/package.json +4 -0
  18. package/context-menu/package.json +4 -0
  19. package/dashboard-grid/package.json +4 -0
  20. package/date-input/package.json +4 -0
  21. package/divider/package.json +4 -0
  22. package/empty-state/package.json +4 -0
  23. package/fesm2022/neural-ui-core-accordion.mjs +162 -0
  24. package/fesm2022/neural-ui-core-accordion.mjs.map +1 -0
  25. package/fesm2022/neural-ui-core-alert.mjs +116 -0
  26. package/fesm2022/neural-ui-core-alert.mjs.map +1 -0
  27. package/fesm2022/neural-ui-core-autocomplete.mjs +406 -0
  28. package/fesm2022/neural-ui-core-autocomplete.mjs.map +1 -0
  29. package/fesm2022/neural-ui-core-avatar.mjs +109 -0
  30. package/fesm2022/neural-ui-core-avatar.mjs.map +1 -0
  31. package/fesm2022/neural-ui-core-badge.mjs +54 -0
  32. package/fesm2022/neural-ui-core-badge.mjs.map +1 -0
  33. package/fesm2022/neural-ui-core-block-ui.mjs +95 -0
  34. package/fesm2022/neural-ui-core-block-ui.mjs.map +1 -0
  35. package/fesm2022/neural-ui-core-breadcrumb.mjs +84 -0
  36. package/fesm2022/neural-ui-core-breadcrumb.mjs.map +1 -0
  37. package/fesm2022/neural-ui-core-button.mjs +125 -0
  38. package/fesm2022/neural-ui-core-button.mjs.map +1 -0
  39. package/fesm2022/neural-ui-core-card.mjs +69 -0
  40. package/fesm2022/neural-ui-core-card.mjs.map +1 -0
  41. package/fesm2022/neural-ui-core-chart.mjs +287 -0
  42. package/fesm2022/neural-ui-core-chart.mjs.map +1 -0
  43. package/fesm2022/neural-ui-core-checkbox.mjs +138 -0
  44. package/fesm2022/neural-ui-core-checkbox.mjs.map +1 -0
  45. package/fesm2022/neural-ui-core-chip.mjs +130 -0
  46. package/fesm2022/neural-ui-core-chip.mjs.map +1 -0
  47. package/fesm2022/neural-ui-core-code-block.mjs +250 -0
  48. package/fesm2022/neural-ui-core-code-block.mjs.map +1 -0
  49. package/fesm2022/neural-ui-core-color-picker.mjs +435 -0
  50. package/fesm2022/neural-ui-core-color-picker.mjs.map +1 -0
  51. package/fesm2022/neural-ui-core-command-palette.mjs +235 -0
  52. package/fesm2022/neural-ui-core-command-palette.mjs.map +1 -0
  53. package/fesm2022/neural-ui-core-confirm-dialog.mjs +118 -0
  54. package/fesm2022/neural-ui-core-confirm-dialog.mjs.map +1 -0
  55. package/fesm2022/neural-ui-core-context-menu.mjs +158 -0
  56. package/fesm2022/neural-ui-core-context-menu.mjs.map +1 -0
  57. package/fesm2022/neural-ui-core-dashboard-grid.mjs +144 -0
  58. package/fesm2022/neural-ui-core-dashboard-grid.mjs.map +1 -0
  59. package/fesm2022/neural-ui-core-date-input.mjs +1332 -0
  60. package/fesm2022/neural-ui-core-date-input.mjs.map +1 -0
  61. package/fesm2022/neural-ui-core-divider.mjs +54 -0
  62. package/fesm2022/neural-ui-core-divider.mjs.map +1 -0
  63. package/fesm2022/neural-ui-core-empty-state.mjs +84 -0
  64. package/fesm2022/neural-ui-core-empty-state.mjs.map +1 -0
  65. package/fesm2022/neural-ui-core-filter-bar.mjs +118 -0
  66. package/fesm2022/neural-ui-core-filter-bar.mjs.map +1 -0
  67. package/fesm2022/neural-ui-core-icon.mjs +50 -0
  68. package/fesm2022/neural-ui-core-icon.mjs.map +1 -0
  69. package/fesm2022/neural-ui-core-image-viewer.mjs +309 -0
  70. package/fesm2022/neural-ui-core-image-viewer.mjs.map +1 -0
  71. package/fesm2022/neural-ui-core-input-otp.mjs +192 -0
  72. package/fesm2022/neural-ui-core-input-otp.mjs.map +1 -0
  73. package/fesm2022/neural-ui-core-input.mjs +320 -0
  74. package/fesm2022/neural-ui-core-input.mjs.map +1 -0
  75. package/fesm2022/neural-ui-core-knob.mjs +323 -0
  76. package/fesm2022/neural-ui-core-knob.mjs.map +1 -0
  77. package/fesm2022/neural-ui-core-meter-group.mjs +122 -0
  78. package/fesm2022/neural-ui-core-meter-group.mjs.map +1 -0
  79. package/fesm2022/neural-ui-core-modal.mjs +156 -0
  80. package/fesm2022/neural-ui-core-modal.mjs.map +1 -0
  81. package/fesm2022/neural-ui-core-multiselect.mjs +825 -0
  82. package/fesm2022/neural-ui-core-multiselect.mjs.map +1 -0
  83. package/fesm2022/neural-ui-core-nav.mjs +952 -0
  84. package/fesm2022/neural-ui-core-nav.mjs.map +1 -0
  85. package/fesm2022/neural-ui-core-notification-center.mjs +264 -0
  86. package/fesm2022/neural-ui-core-notification-center.mjs.map +1 -0
  87. package/fesm2022/neural-ui-core-number-input.mjs +331 -0
  88. package/fesm2022/neural-ui-core-number-input.mjs.map +1 -0
  89. package/fesm2022/neural-ui-core-pagination.mjs +198 -0
  90. package/fesm2022/neural-ui-core-pagination.mjs.map +1 -0
  91. package/fesm2022/neural-ui-core-popover.mjs +207 -0
  92. package/fesm2022/neural-ui-core-popover.mjs.map +1 -0
  93. package/fesm2022/neural-ui-core-progress-bar.mjs +105 -0
  94. package/fesm2022/neural-ui-core-progress-bar.mjs.map +1 -0
  95. package/fesm2022/neural-ui-core-radio.mjs +171 -0
  96. package/fesm2022/neural-ui-core-radio.mjs.map +1 -0
  97. package/fesm2022/neural-ui-core-rating.mjs +151 -0
  98. package/fesm2022/neural-ui-core-rating.mjs.map +1 -0
  99. package/fesm2022/neural-ui-core-select.mjs +710 -0
  100. package/fesm2022/neural-ui-core-select.mjs.map +1 -0
  101. package/fesm2022/neural-ui-core-sidebar.mjs +214 -0
  102. package/fesm2022/neural-ui-core-sidebar.mjs.map +1 -0
  103. package/fesm2022/neural-ui-core-skeleton.mjs +40 -0
  104. package/fesm2022/neural-ui-core-skeleton.mjs.map +1 -0
  105. package/fesm2022/neural-ui-core-slider.mjs +146 -0
  106. package/fesm2022/neural-ui-core-slider.mjs.map +1 -0
  107. package/fesm2022/neural-ui-core-spinner.mjs +113 -0
  108. package/fesm2022/neural-ui-core-spinner.mjs.map +1 -0
  109. package/fesm2022/neural-ui-core-split-button.mjs +252 -0
  110. package/fesm2022/neural-ui-core-split-button.mjs.map +1 -0
  111. package/fesm2022/neural-ui-core-splitter.mjs +174 -0
  112. package/fesm2022/neural-ui-core-splitter.mjs.map +1 -0
  113. package/fesm2022/neural-ui-core-stats-card.mjs +163 -0
  114. package/fesm2022/neural-ui-core-stats-card.mjs.map +1 -0
  115. package/fesm2022/neural-ui-core-stepper.mjs +204 -0
  116. package/fesm2022/neural-ui-core-stepper.mjs.map +1 -0
  117. package/fesm2022/neural-ui-core-switch.mjs +111 -0
  118. package/fesm2022/neural-ui-core-switch.mjs.map +1 -0
  119. package/fesm2022/neural-ui-core-table.mjs +1872 -0
  120. package/fesm2022/neural-ui-core-table.mjs.map +1 -0
  121. package/fesm2022/neural-ui-core-tabs.mjs +338 -0
  122. package/fesm2022/neural-ui-core-tabs.mjs.map +1 -0
  123. package/fesm2022/neural-ui-core-textarea.mjs +188 -0
  124. package/fesm2022/neural-ui-core-textarea.mjs.map +1 -0
  125. package/fesm2022/neural-ui-core-timeline.mjs +117 -0
  126. package/fesm2022/neural-ui-core-timeline.mjs.map +1 -0
  127. package/fesm2022/neural-ui-core-toast.mjs +171 -0
  128. package/fesm2022/neural-ui-core-toast.mjs.map +1 -0
  129. package/fesm2022/neural-ui-core-toggle-button-group.mjs +162 -0
  130. package/fesm2022/neural-ui-core-toggle-button-group.mjs.map +1 -0
  131. package/fesm2022/neural-ui-core-toolbar.mjs +67 -0
  132. package/fesm2022/neural-ui-core-toolbar.mjs.map +1 -0
  133. package/fesm2022/neural-ui-core-tooltip.mjs +151 -0
  134. package/fesm2022/neural-ui-core-tooltip.mjs.map +1 -0
  135. package/fesm2022/neural-ui-core-url-state.mjs +96 -0
  136. package/fesm2022/neural-ui-core-url-state.mjs.map +1 -0
  137. package/fesm2022/neural-ui-core-virtual-list.mjs +126 -0
  138. package/fesm2022/neural-ui-core-virtual-list.mjs.map +1 -0
  139. package/fesm2022/neural-ui-core.mjs +11 -8544
  140. package/fesm2022/neural-ui-core.mjs.map +1 -1
  141. package/filter-bar/package.json +4 -0
  142. package/icon/package.json +4 -0
  143. package/image-viewer/package.json +4 -0
  144. package/input/package.json +4 -0
  145. package/input-otp/package.json +4 -0
  146. package/knob/package.json +4 -0
  147. package/meter-group/package.json +4 -0
  148. package/modal/package.json +4 -0
  149. package/multiselect/package.json +4 -0
  150. package/nav/package.json +4 -0
  151. package/notification-center/package.json +4 -0
  152. package/number-input/package.json +4 -0
  153. package/package.json +252 -5
  154. package/pagination/package.json +4 -0
  155. package/popover/package.json +4 -0
  156. package/progress-bar/package.json +4 -0
  157. package/radio/package.json +4 -0
  158. package/rating/package.json +4 -0
  159. package/select/package.json +4 -0
  160. package/sidebar/package.json +4 -0
  161. package/skeleton/package.json +4 -0
  162. package/slider/package.json +4 -0
  163. package/spinner/package.json +4 -0
  164. package/split-button/package.json +4 -0
  165. package/splitter/package.json +4 -0
  166. package/stats-card/package.json +4 -0
  167. package/stepper/package.json +4 -0
  168. package/styles/_tokens.scss +202 -0
  169. package/styles.scss +1 -0
  170. package/switch/package.json +4 -0
  171. package/table/package.json +4 -0
  172. package/tabs/package.json +4 -0
  173. package/textarea/package.json +4 -0
  174. package/timeline/package.json +4 -0
  175. package/toast/package.json +4 -0
  176. package/toggle-button-group/package.json +4 -0
  177. package/toolbar/package.json +4 -0
  178. package/tooltip/package.json +4 -0
  179. package/types/neural-ui-core-accordion.d.ts +55 -0
  180. package/types/neural-ui-core-alert.d.ts +47 -0
  181. package/types/neural-ui-core-autocomplete.d.ts +75 -0
  182. package/types/neural-ui-core-avatar.d.ts +39 -0
  183. package/types/neural-ui-core-badge.d.ts +36 -0
  184. package/types/neural-ui-core-block-ui.d.ts +46 -0
  185. package/types/neural-ui-core-breadcrumb.d.ts +38 -0
  186. package/types/neural-ui-core-button.d.ts +55 -0
  187. package/types/neural-ui-core-card.d.ts +37 -0
  188. package/types/neural-ui-core-chart.d.ts +236 -0
  189. package/types/neural-ui-core-checkbox.d.ts +33 -0
  190. package/types/neural-ui-core-chip.d.ts +53 -0
  191. package/types/neural-ui-core-code-block.d.ts +55 -0
  192. package/types/neural-ui-core-color-picker.d.ts +55 -0
  193. package/types/neural-ui-core-command-palette.d.ts +56 -0
  194. package/types/neural-ui-core-confirm-dialog.d.ts +50 -0
  195. package/types/neural-ui-core-context-menu.d.ts +66 -0
  196. package/types/neural-ui-core-dashboard-grid.d.ts +41 -0
  197. package/types/neural-ui-core-date-input.d.ts +178 -0
  198. package/types/neural-ui-core-divider.d.ts +20 -0
  199. package/types/neural-ui-core-empty-state.d.ts +32 -0
  200. package/types/neural-ui-core-filter-bar.d.ts +49 -0
  201. package/types/neural-ui-core-icon.d.ts +33 -0
  202. package/types/neural-ui-core-image-viewer.d.ts +67 -0
  203. package/types/neural-ui-core-input-otp.d.ts +49 -0
  204. package/types/neural-ui-core-input.d.ts +86 -0
  205. package/types/neural-ui-core-knob.d.ts +68 -0
  206. package/types/neural-ui-core-meter-group.d.ts +52 -0
  207. package/types/neural-ui-core-modal.d.ts +54 -0
  208. package/types/neural-ui-core-multiselect.d.ts +138 -0
  209. package/types/neural-ui-core-nav.d.ts +69 -0
  210. package/types/neural-ui-core-notification-center.d.ts +60 -0
  211. package/types/neural-ui-core-number-input.d.ts +63 -0
  212. package/types/neural-ui-core-pagination.d.ts +30 -0
  213. package/types/neural-ui-core-popover.d.ts +73 -0
  214. package/types/neural-ui-core-progress-bar.d.ts +35 -0
  215. package/types/neural-ui-core-radio.d.ts +51 -0
  216. package/types/neural-ui-core-rating.d.ts +34 -0
  217. package/types/neural-ui-core-select.d.ts +170 -0
  218. package/types/neural-ui-core-sidebar.d.ts +57 -0
  219. package/types/neural-ui-core-skeleton.d.ts +22 -0
  220. package/types/neural-ui-core-slider.d.ts +42 -0
  221. package/types/neural-ui-core-spinner.d.ts +38 -0
  222. package/types/neural-ui-core-split-button.d.ts +65 -0
  223. package/types/neural-ui-core-splitter.d.ts +28 -0
  224. package/types/neural-ui-core-stats-card.d.ts +39 -0
  225. package/types/neural-ui-core-stepper.d.ts +51 -0
  226. package/types/neural-ui-core-switch.d.ts +34 -0
  227. package/types/neural-ui-core-table.d.ts +285 -0
  228. package/types/neural-ui-core-tabs.d.ts +88 -0
  229. package/types/neural-ui-core-textarea.d.ts +52 -0
  230. package/types/neural-ui-core-timeline.d.ts +33 -0
  231. package/types/neural-ui-core-toast.d.ts +70 -0
  232. package/types/neural-ui-core-toggle-button-group.d.ts +63 -0
  233. package/types/neural-ui-core-toolbar.d.ts +36 -0
  234. package/types/neural-ui-core-tooltip.d.ts +48 -0
  235. package/types/neural-ui-core-url-state.d.ts +58 -0
  236. package/types/neural-ui-core-virtual-list.d.ts +60 -0
  237. package/types/neural-ui-core.d.ts +3 -2105
  238. package/url-state/package.json +4 -0
  239. package/virtual-list/package.json +4 -0
@@ -0,0 +1,144 @@
1
+ import * as i0 from '@angular/core';
2
+ import { inject, ElementRef, input, output, signal, viewChildren, effect, untracked, ChangeDetectionStrategy, ViewEncapsulation, Component } from '@angular/core';
3
+ import { moveItemInArray, CdkDrag, CdkDragPlaceholder, CdkDragPreview, CdkDropList } from '@angular/cdk/drag-drop';
4
+
5
+ /**
6
+ * NeuralUI DashboardGrid
7
+ *
8
+ * Cuadrícula de tiles reordenables mediante drag-and-drop (CDK DragDrop).
9
+ *
10
+ * Uso:
11
+ * <neu-dashboard-grid [tiles]="tileConfigs" [columns]="3">
12
+ * <ng-template neuDashboardTile id="tile-1">...</ng-template>
13
+ * </neu-dashboard-grid>
14
+ */
15
+ class NeuDashboardGridComponent {
16
+ _host = inject(ElementRef);
17
+ tiles = input([], ...(ngDevMode ? [{ debugName: "tiles" }] : /* istanbul ignore next */ []));
18
+ columns = input(3, ...(ngDevMode ? [{ debugName: "columns" }] : /* istanbul ignore next */ []));
19
+ /** Emitido cuando el orden cambia / Emitted when order changes */
20
+ orderChange = output();
21
+ _orderedTiles = signal([], ...(ngDevMode ? [{ debugName: "_orderedTiles" }] : /* istanbul ignore next */ []));
22
+ _tileSlots = viewChildren('tileSlot', ...(ngDevMode ? [{ debugName: "_tileSlots" }] : /* istanbul ignore next */ []));
23
+ constructor() {
24
+ effect(() => {
25
+ const t = this.tiles();
26
+ untracked(() => this._orderedTiles.set([...t]));
27
+ });
28
+ effect(() => {
29
+ this._orderedTiles();
30
+ this._tileSlots();
31
+ queueMicrotask(() => this._attachProjectedTiles());
32
+ });
33
+ }
34
+ _onDrop(event) {
35
+ const tiles = [...this._orderedTiles()];
36
+ moveItemInArray(tiles, event.previousIndex, event.currentIndex);
37
+ this._orderedTiles.set(tiles);
38
+ this.orderChange.emit(tiles);
39
+ }
40
+ _attachProjectedTiles() {
41
+ const slots = new Map(this._tileSlots().map((slotRef) => [
42
+ slotRef.nativeElement.dataset['slotId'],
43
+ slotRef.nativeElement,
44
+ ]));
45
+ const projectedTiles = this._host.nativeElement.querySelectorAll('[data-tile-id]');
46
+ for (const tileContent of projectedTiles) {
47
+ const tileId = tileContent.dataset['tileId'];
48
+ const slot = slots.get(tileId);
49
+ if (slot && tileContent.parentElement !== slot) {
50
+ slot.appendChild(tileContent);
51
+ }
52
+ }
53
+ }
54
+ static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.8", ngImport: i0, type: NeuDashboardGridComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
55
+ static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.8", type: NeuDashboardGridComponent, isStandalone: true, selector: "neu-dashboard-grid", inputs: { tiles: { classPropertyName: "tiles", publicName: "tiles", isSignal: true, isRequired: false, transformFunction: null }, columns: { classPropertyName: "columns", publicName: "columns", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { orderChange: "orderChange" }, host: { properties: { "style.--neu-dg-cols": "columns()" }, classAttribute: "neu-dg" }, viewQueries: [{ propertyName: "_tileSlots", predicate: ["tileSlot"], descendants: true, isSignal: true }], ngImport: i0, template: `
56
+ <div class="neu-dg__projection-source" aria-hidden="true">
57
+ <ng-content />
58
+ </div>
59
+
60
+ <div
61
+ class="neu-dg__grid"
62
+ cdkDropList
63
+ [cdkDropListData]="_orderedTiles()"
64
+ (cdkDropListDropped)="_onDrop($event)"
65
+ >
66
+ @for (tile of _orderedTiles(); track tile.id) {
67
+ <div
68
+ class="neu-dg__tile"
69
+ cdkDrag
70
+ [cdkDragData]="tile"
71
+ [style.--tile-cols]="tile.cols ?? 1"
72
+ [style.--tile-rows]="tile.rows ?? 1"
73
+ >
74
+ <!-- Drag handle -->
75
+ <div class="neu-dg__tile-handle" cdkDragHandle>
76
+ @if (tile.title) {
77
+ <span class="neu-dg__tile-title">{{ tile.title }}</span>
78
+ }
79
+ <span class="neu-dg__handle-icon" aria-hidden="true">⠿</span>
80
+ </div>
81
+ <!-- Drag placeholder -->
82
+ <div *cdkDragPlaceholder class="neu-dg__placeholder"></div>
83
+ <!-- Drag preview -->
84
+ <div *cdkDragPreview class="neu-dg__preview">{{ tile.title ?? tile.id }}</div>
85
+ <!-- Content slot -->
86
+ <div class="neu-dg__tile-content" tabindex="0">
87
+ <div class="neu-dg__tile-slot" #tileSlot [attr.data-slot-id]="tile.id"></div>
88
+ </div>
89
+ </div>
90
+ }
91
+ </div>
92
+ `, isInline: true, styles: ["@charset \"UTF-8\";.neu-dg{display:block;width:100%}.neu-dg__projection-source{display:none}.neu-dg__grid{display:grid;grid-template-columns:repeat(var(--neu-dg-cols, 3),1fr);gap:var(--neu-dg-gap, 16px)}.neu-dg__tile{grid-column:span var(--tile-cols, 1);grid-row:span var(--tile-rows, 1);background:var(--neu-surface-1, #ffffff);border:1px solid var(--neu-border-color, #e5e7eb);border-radius:var(--neu-radius-xl, 16px);overflow:hidden;display:flex;flex-direction:column;transition:box-shadow .12s}.neu-dg__tile:hover{box-shadow:0 4px 12px -2px #00000014}.neu-dg__tile-handle{display:flex;align-items:center;justify-content:space-between;padding:10px 12px;border-bottom:1px solid var(--neu-border-color, #f3f4f6);cursor:grab;-webkit-user-select:none;user-select:none}.neu-dg__tile-handle:active{cursor:grabbing}.neu-dg__tile-title{font-size:.875rem;font-weight:600;color:var(--neu-text-primary, #111)}.neu-dg__handle-icon{font-size:1rem;color:var(--neu-text-secondary, #9ca3af);letter-spacing:2px}.neu-dg__tile-content{flex:1;overflow:auto;padding:12px 12px 16px}.neu-dg__tile-slot{display:flex;flex-direction:column;gap:var(--neu-dg-content-gap, 12px);min-height:100%}.neu-dg__placeholder{background:var(--neu-color-primary-alpha, rgba(14, 165, 233, .1));border:2px dashed var(--neu-color-primary, #0ea5e9);border-radius:var(--neu-radius-xl, 16px)}.neu-dg__preview{display:flex;align-items:center;justify-content:center;padding:12px 20px;background:var(--neu-surface-1, #fff);border:1px solid var(--neu-border-color, #e5e7eb);border-radius:var(--neu-radius-xl, 16px);box-shadow:0 8px 20px -4px #00000024;font-size:.875rem;font-weight:500}.cdk-drag-animating{transition:transform .2s cubic-bezier(.25,.8,.25,1)}\n"], dependencies: [{ kind: "directive", type: CdkDrag, selector: "[cdkDrag]", inputs: ["cdkDragData", "cdkDragLockAxis", "cdkDragRootElement", "cdkDragBoundary", "cdkDragStartDelay", "cdkDragFreeDragPosition", "cdkDragDisabled", "cdkDragConstrainPosition", "cdkDragPreviewClass", "cdkDragPreviewContainer", "cdkDragScale"], outputs: ["cdkDragStarted", "cdkDragReleased", "cdkDragEnded", "cdkDragEntered", "cdkDragExited", "cdkDragDropped", "cdkDragMoved"], exportAs: ["cdkDrag"] }, { kind: "directive", type: CdkDragPlaceholder, selector: "ng-template[cdkDragPlaceholder]", inputs: ["data"] }, { kind: "directive", type: CdkDragPreview, selector: "ng-template[cdkDragPreview]", inputs: ["data", "matchSize"] }, { kind: "directive", type: CdkDropList, selector: "[cdkDropList], cdk-drop-list", inputs: ["cdkDropListConnectedTo", "cdkDropListData", "cdkDropListOrientation", "id", "cdkDropListLockAxis", "cdkDropListDisabled", "cdkDropListSortingDisabled", "cdkDropListEnterPredicate", "cdkDropListSortPredicate", "cdkDropListAutoScrollDisabled", "cdkDropListAutoScrollStep", "cdkDropListElementContainer", "cdkDropListHasAnchor"], outputs: ["cdkDropListDropped", "cdkDropListEntered", "cdkDropListExited", "cdkDropListSorted"], exportAs: ["cdkDropList"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
93
+ }
94
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.8", ngImport: i0, type: NeuDashboardGridComponent, decorators: [{
95
+ type: Component,
96
+ args: [{ selector: 'neu-dashboard-grid', imports: [CdkDrag, CdkDragPlaceholder, CdkDragPreview, CdkDropList], encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, host: {
97
+ class: 'neu-dg',
98
+ '[style.--neu-dg-cols]': 'columns()',
99
+ }, template: `
100
+ <div class="neu-dg__projection-source" aria-hidden="true">
101
+ <ng-content />
102
+ </div>
103
+
104
+ <div
105
+ class="neu-dg__grid"
106
+ cdkDropList
107
+ [cdkDropListData]="_orderedTiles()"
108
+ (cdkDropListDropped)="_onDrop($event)"
109
+ >
110
+ @for (tile of _orderedTiles(); track tile.id) {
111
+ <div
112
+ class="neu-dg__tile"
113
+ cdkDrag
114
+ [cdkDragData]="tile"
115
+ [style.--tile-cols]="tile.cols ?? 1"
116
+ [style.--tile-rows]="tile.rows ?? 1"
117
+ >
118
+ <!-- Drag handle -->
119
+ <div class="neu-dg__tile-handle" cdkDragHandle>
120
+ @if (tile.title) {
121
+ <span class="neu-dg__tile-title">{{ tile.title }}</span>
122
+ }
123
+ <span class="neu-dg__handle-icon" aria-hidden="true">⠿</span>
124
+ </div>
125
+ <!-- Drag placeholder -->
126
+ <div *cdkDragPlaceholder class="neu-dg__placeholder"></div>
127
+ <!-- Drag preview -->
128
+ <div *cdkDragPreview class="neu-dg__preview">{{ tile.title ?? tile.id }}</div>
129
+ <!-- Content slot -->
130
+ <div class="neu-dg__tile-content" tabindex="0">
131
+ <div class="neu-dg__tile-slot" #tileSlot [attr.data-slot-id]="tile.id"></div>
132
+ </div>
133
+ </div>
134
+ }
135
+ </div>
136
+ `, styles: ["@charset \"UTF-8\";.neu-dg{display:block;width:100%}.neu-dg__projection-source{display:none}.neu-dg__grid{display:grid;grid-template-columns:repeat(var(--neu-dg-cols, 3),1fr);gap:var(--neu-dg-gap, 16px)}.neu-dg__tile{grid-column:span var(--tile-cols, 1);grid-row:span var(--tile-rows, 1);background:var(--neu-surface-1, #ffffff);border:1px solid var(--neu-border-color, #e5e7eb);border-radius:var(--neu-radius-xl, 16px);overflow:hidden;display:flex;flex-direction:column;transition:box-shadow .12s}.neu-dg__tile:hover{box-shadow:0 4px 12px -2px #00000014}.neu-dg__tile-handle{display:flex;align-items:center;justify-content:space-between;padding:10px 12px;border-bottom:1px solid var(--neu-border-color, #f3f4f6);cursor:grab;-webkit-user-select:none;user-select:none}.neu-dg__tile-handle:active{cursor:grabbing}.neu-dg__tile-title{font-size:.875rem;font-weight:600;color:var(--neu-text-primary, #111)}.neu-dg__handle-icon{font-size:1rem;color:var(--neu-text-secondary, #9ca3af);letter-spacing:2px}.neu-dg__tile-content{flex:1;overflow:auto;padding:12px 12px 16px}.neu-dg__tile-slot{display:flex;flex-direction:column;gap:var(--neu-dg-content-gap, 12px);min-height:100%}.neu-dg__placeholder{background:var(--neu-color-primary-alpha, rgba(14, 165, 233, .1));border:2px dashed var(--neu-color-primary, #0ea5e9);border-radius:var(--neu-radius-xl, 16px)}.neu-dg__preview{display:flex;align-items:center;justify-content:center;padding:12px 20px;background:var(--neu-surface-1, #fff);border:1px solid var(--neu-border-color, #e5e7eb);border-radius:var(--neu-radius-xl, 16px);box-shadow:0 8px 20px -4px #00000024;font-size:.875rem;font-weight:500}.cdk-drag-animating{transition:transform .2s cubic-bezier(.25,.8,.25,1)}\n"] }]
137
+ }], ctorParameters: () => [], propDecorators: { tiles: [{ type: i0.Input, args: [{ isSignal: true, alias: "tiles", required: false }] }], columns: [{ type: i0.Input, args: [{ isSignal: true, alias: "columns", required: false }] }], orderChange: [{ type: i0.Output, args: ["orderChange"] }], _tileSlots: [{ type: i0.ViewChildren, args: ['tileSlot', { isSignal: true }] }] } });
138
+
139
+ /**
140
+ * Generated bundle index. Do not edit.
141
+ */
142
+
143
+ export { NeuDashboardGridComponent };
144
+ //# sourceMappingURL=neural-ui-core-dashboard-grid.mjs.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"neural-ui-core-dashboard-grid.mjs","sources":["../../../../projects/ui-core/dashboard-grid/neu-dashboard-grid.component.ts","../../../../projects/ui-core/dashboard-grid/neural-ui-core-dashboard-grid.ts"],"sourcesContent":["import {\n ChangeDetectionStrategy,\n Component,\n ElementRef,\n ViewEncapsulation,\n effect,\n inject,\n input,\n output,\n signal,\n untracked,\n viewChildren,\n} from '@angular/core';\nimport {\n CdkDrag,\n CdkDragDrop,\n CdkDragPlaceholder,\n CdkDragPreview,\n CdkDropList,\n moveItemInArray,\n} from '@angular/cdk/drag-drop';\n\nexport interface NeuDashboardTileConfig {\n /** Identificador único / Unique identifier */\n id: string;\n /** Número de columnas que ocupa / Column span */\n cols?: number;\n /** Número de filas que ocupa / Row span */\n rows?: number;\n /** Título del tile / Tile title */\n title?: string;\n}\n\n/**\n * NeuralUI DashboardGrid\n *\n * Cuadrícula de tiles reordenables mediante drag-and-drop (CDK DragDrop).\n *\n * Uso:\n * <neu-dashboard-grid [tiles]=\"tileConfigs\" [columns]=\"3\">\n * <ng-template neuDashboardTile id=\"tile-1\">...</ng-template>\n * </neu-dashboard-grid>\n */\n@Component({\n selector: 'neu-dashboard-grid',\n imports: [CdkDrag, CdkDragPlaceholder, CdkDragPreview, CdkDropList],\n encapsulation: ViewEncapsulation.None,\n changeDetection: ChangeDetectionStrategy.OnPush,\n host: {\n class: 'neu-dg',\n '[style.--neu-dg-cols]': 'columns()',\n },\n template: `\n <div class=\"neu-dg__projection-source\" aria-hidden=\"true\">\n <ng-content />\n </div>\n\n <div\n class=\"neu-dg__grid\"\n cdkDropList\n [cdkDropListData]=\"_orderedTiles()\"\n (cdkDropListDropped)=\"_onDrop($event)\"\n >\n @for (tile of _orderedTiles(); track tile.id) {\n <div\n class=\"neu-dg__tile\"\n cdkDrag\n [cdkDragData]=\"tile\"\n [style.--tile-cols]=\"tile.cols ?? 1\"\n [style.--tile-rows]=\"tile.rows ?? 1\"\n >\n <!-- Drag handle -->\n <div class=\"neu-dg__tile-handle\" cdkDragHandle>\n @if (tile.title) {\n <span class=\"neu-dg__tile-title\">{{ tile.title }}</span>\n }\n <span class=\"neu-dg__handle-icon\" aria-hidden=\"true\">⠿</span>\n </div>\n <!-- Drag placeholder -->\n <div *cdkDragPlaceholder class=\"neu-dg__placeholder\"></div>\n <!-- Drag preview -->\n <div *cdkDragPreview class=\"neu-dg__preview\">{{ tile.title ?? tile.id }}</div>\n <!-- Content slot -->\n <div class=\"neu-dg__tile-content\" tabindex=\"0\">\n <div class=\"neu-dg__tile-slot\" #tileSlot [attr.data-slot-id]=\"tile.id\"></div>\n </div>\n </div>\n }\n </div>\n `,\n styleUrl: './neu-dashboard-grid.component.scss',\n})\nexport class NeuDashboardGridComponent {\n private readonly _host = inject(ElementRef) as ElementRef<HTMLElement>;\n\n readonly tiles = input<NeuDashboardTileConfig[]>([]);\n readonly columns = input<number>(3);\n\n /** Emitido cuando el orden cambia / Emitted when order changes */\n readonly orderChange = output<NeuDashboardTileConfig[]>();\n\n readonly _orderedTiles = signal<NeuDashboardTileConfig[]>([]);\n readonly _tileSlots = viewChildren<ElementRef<HTMLElement>>('tileSlot');\n\n constructor() {\n effect(() => {\n const t = this.tiles();\n untracked(() => this._orderedTiles.set([...t]));\n });\n\n effect(() => {\n this._orderedTiles();\n this._tileSlots();\n queueMicrotask(() => this._attachProjectedTiles());\n });\n }\n\n _onDrop(event: CdkDragDrop<NeuDashboardTileConfig[]>): void {\n const tiles = [...this._orderedTiles()];\n moveItemInArray(tiles, event.previousIndex, event.currentIndex);\n this._orderedTiles.set(tiles);\n this.orderChange.emit(tiles);\n }\n\n private _attachProjectedTiles(): void {\n const slots = new Map(\n this._tileSlots().map((slotRef) => [\n slotRef.nativeElement.dataset['slotId'],\n slotRef.nativeElement,\n ]),\n );\n\n const projectedTiles = this._host.nativeElement.querySelectorAll(\n '[data-tile-id]',\n ) as NodeListOf<HTMLElement>;\n\n for (const tileContent of projectedTiles) {\n const tileId = tileContent.dataset['tileId'];\n const slot = slots.get(tileId);\n\n if (slot && tileContent.parentElement !== slot) {\n slot.appendChild(tileContent);\n }\n }\n }\n}\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './public_api';\n"],"names":[],"mappings":"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"}