@egose/shadcn-theme-ng-tw 0.0.28 → 0.2.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 (244) hide show
  1. package/README.md +130 -13
  2. package/accordion/README.md +376 -34
  3. package/accordion/fesm2022/accordion.mjs +20 -20
  4. package/alert/README.md +343 -34
  5. package/alert/fesm2022/alert.mjs +18 -18
  6. package/alert-dialog/README.md +471 -5
  7. package/alert-dialog/fesm2022/alert-dialog.mjs +48 -48
  8. package/alert-dialog/types/alert-dialog.d.ts +1 -1
  9. package/aspect-ratio/README.md +272 -5
  10. package/aspect-ratio/fesm2022/aspect-ratio.mjs +9 -9
  11. package/autocomplete/README.md +473 -34
  12. package/autocomplete/fesm2022/autocomplete.mjs +54 -54
  13. package/autocomplete/types/autocomplete.d.ts +1 -1
  14. package/avatar/README.md +357 -5
  15. package/avatar/fesm2022/avatar.mjs +32 -32
  16. package/badge/README.md +289 -34
  17. package/badge/fesm2022/badge.mjs +4 -4
  18. package/basic-alert/README.md +324 -34
  19. package/basic-alert/fesm2022/basic-alert.mjs +4 -4
  20. package/basic-alert/types/basic-alert.d.ts +1 -1
  21. package/breadcrumb/README.md +406 -5
  22. package/breadcrumb/fesm2022/breadcrumb.mjs +34 -34
  23. package/button/README.md +453 -34
  24. package/button/fesm2022/button.mjs +96 -118
  25. package/button/types/button.d.ts +7 -10
  26. package/button-group/README.md +318 -5
  27. package/button-group/fesm2022/button-group.mjs +20 -20
  28. package/calendar/README.md +328 -34
  29. package/calendar/fesm2022/calendar.mjs +154 -154
  30. package/card/README.md +331 -5
  31. package/card/fesm2022/card.mjs +33 -33
  32. package/carousel/README.md +333 -5
  33. package/carousel/fesm2022/carousel.mjs +47 -44
  34. package/carousel/types/carousel.d.ts +1 -1
  35. package/checkbox/README.md +291 -34
  36. package/checkbox/fesm2022/checkbox.mjs +22 -20
  37. package/checkbox/types/checkbox.d.ts +5 -4
  38. package/collapsible/README.md +332 -5
  39. package/collapsible/fesm2022/collapsible.mjs +15 -15
  40. package/combobox/README.md +507 -5
  41. package/combobox/fesm2022/combobox.mjs +95 -92
  42. package/combobox/types/combobox.d.ts +1 -1
  43. package/command/README.md +435 -5
  44. package/command/fesm2022/command.mjs +56 -56
  45. package/confirmation-dialog/README.md +272 -34
  46. package/confirmation-dialog/fesm2022/confirmation-dialog.mjs +13 -12
  47. package/confirmation-dialog/types/confirmation-dialog.d.ts +9 -5
  48. package/context-menu/README.md +366 -5
  49. package/context-menu/fesm2022/context-menu.mjs +9 -9
  50. package/date-picker/README.md +436 -34
  51. package/date-picker/fesm2022/date-picker.mjs +79 -68
  52. package/date-picker/types/date-picker.d.ts +8 -4
  53. package/dialog/README.md +419 -34
  54. package/dialog/fesm2022/dialog.mjs +48 -48
  55. package/drawer/README.md +395 -5
  56. package/drawer/fesm2022/drawer.mjs +45 -45
  57. package/dropdown-menu/README.md +417 -5
  58. package/dropdown-menu/fesm2022/dropdown-menu.mjs +85 -73
  59. package/dropdown-menu/types/dropdown-menu.d.ts +4 -0
  60. package/empty/README.md +329 -5
  61. package/empty/fesm2022/empty.mjs +31 -31
  62. package/field/README.md +385 -5
  63. package/field/fesm2022/field.mjs +59 -59
  64. package/field/types/field.d.ts +1 -1
  65. package/form-checkbox/README.md +283 -34
  66. package/form-checkbox/fesm2022/form-checkbox.mjs +37 -19
  67. package/form-checkbox/types/form-checkbox.d.ts +7 -1
  68. package/form-date-picker/README.md +293 -34
  69. package/form-date-picker/fesm2022/form-date-picker.mjs +59 -24
  70. package/form-date-picker/types/form-date-picker.d.ts +7 -1
  71. package/form-field/README.md +327 -34
  72. package/form-field/fesm2022/form-field.mjs +30 -16
  73. package/form-field/types/form-field.d.ts +28 -20
  74. package/form-field-simple/README.md +311 -34
  75. package/form-field-simple/fesm2022/form-field-simple.mjs +4 -4
  76. package/form-searchable-multiselect/README.md +332 -34
  77. package/form-searchable-multiselect/fesm2022/form-searchable-multiselect.mjs +41 -21
  78. package/form-searchable-multiselect/types/form-searchable-multiselect.d.ts +8 -2
  79. package/form-select/README.md +321 -34
  80. package/form-select/fesm2022/form-select.mjs +62 -29
  81. package/form-select/types/form-select.d.ts +7 -1
  82. package/form-text-input/README.md +342 -34
  83. package/form-text-input/fesm2022/form-text-input.mjs +43 -55
  84. package/form-text-input/types/form-text-input.d.ts +9 -12
  85. package/form-textarea/README.md +318 -34
  86. package/form-textarea/fesm2022/form-textarea.mjs +42 -23
  87. package/form-textarea/types/form-textarea.d.ts +8 -1
  88. package/hover-card/README.md +256 -5
  89. package/hover-card/fesm2022/hover-card.mjs +19 -19
  90. package/icon/README.md +210 -34
  91. package/icon/fesm2022/icon.mjs +8 -8
  92. package/input/README.md +240 -34
  93. package/input/fesm2022/input.mjs +17 -12
  94. package/input/types/input.d.ts +2 -1
  95. package/input-group/README.md +335 -5
  96. package/input-group/fesm2022/input-group.mjs +37 -37
  97. package/input-group/types/input-group.d.ts +3 -3
  98. package/input-otp/README.md +375 -5
  99. package/input-otp/fesm2022/input-otp.mjs +27 -27
  100. package/item/README.md +385 -5
  101. package/item/fesm2022/item.mjs +54 -54
  102. package/kbd/README.md +291 -5
  103. package/kbd/fesm2022/kbd.mjs +13 -13
  104. package/label/README.md +243 -34
  105. package/label/fesm2022/label.mjs +9 -9
  106. package/label/types/label.d.ts +1 -1
  107. package/layout-simple/README.md +174 -44
  108. package/layout-simple/fesm2022/layout-simple.mjs +917 -398
  109. package/layout-simple/types/layout-simple.d.ts +180 -129
  110. package/menu/README.md +418 -0
  111. package/menu/fesm2022/menu.mjs +461 -0
  112. package/menu/package.json +24 -0
  113. package/menu/types/menu.d.ts +137 -0
  114. package/menubar/README.md +343 -5
  115. package/menubar/fesm2022/menubar.mjs +13 -13
  116. package/native-select/README.md +323 -5
  117. package/native-select/fesm2022/native-select.mjs +19 -19
  118. package/navigation-menu/README.md +369 -5
  119. package/navigation-menu/fesm2022/navigation-menu.mjs +37 -37
  120. package/package.json +183 -154
  121. package/pagination/README.md +388 -5
  122. package/pagination/fesm2022/pagination.mjs +63 -63
  123. package/popover/README.md +302 -34
  124. package/popover/fesm2022/popover.mjs +30 -30
  125. package/progress/README.md +311 -5
  126. package/progress/fesm2022/progress.mjs +13 -13
  127. package/radio-group/README.md +335 -34
  128. package/radio-group/fesm2022/radio-group.mjs +26 -19
  129. package/resizable/README.md +269 -5
  130. package/resizable/fesm2022/resizable.mjs +19 -19
  131. package/scroll-area/README.md +233 -5
  132. package/scroll-area/fesm2022/scroll-area.mjs +9 -9
  133. package/searchable-multiselect/README.md +294 -34
  134. package/searchable-multiselect/fesm2022/searchable-multiselect.mjs +63 -16
  135. package/searchable-multiselect/types/searchable-multiselect.d.ts +8 -2
  136. package/select/README.md +408 -34
  137. package/select/fesm2022/select.mjs +80 -72
  138. package/select/types/select.d.ts +3 -1
  139. package/separator/README.md +193 -34
  140. package/separator/fesm2022/separator.mjs +9 -9
  141. package/separator/types/separator.d.ts +1 -1
  142. package/sheet/README.md +282 -34
  143. package/sheet/fesm2022/sheet.mjs +30 -30
  144. package/sidebar/README.md +457 -5
  145. package/sidebar/fesm2022/sidebar.mjs +136 -134
  146. package/sidebar/types/sidebar.d.ts +3 -3
  147. package/skeleton/README.md +217 -5
  148. package/skeleton/fesm2022/skeleton.mjs +9 -9
  149. package/slider/README.md +273 -5
  150. package/slider/fesm2022/slider.mjs +29 -25
  151. package/sonner/README.md +317 -34
  152. package/sonner/fesm2022/sonner.mjs +9 -9
  153. package/spinner/README.md +255 -34
  154. package/spinner/fesm2022/spinner.mjs +8 -8
  155. package/switch/README.md +281 -34
  156. package/switch/fesm2022/switch.mjs +12 -14
  157. package/table/README.md +423 -5
  158. package/table/fesm2022/table.mjs +41 -41
  159. package/tabs/README.md +382 -34
  160. package/tabs/fesm2022/tabs.mjs +48 -38
  161. package/textarea/README.md +282 -5
  162. package/textarea/fesm2022/textarea.mjs +9 -9
  163. package/toggle/README.md +270 -5
  164. package/toggle/fesm2022/toggle.mjs +14 -14
  165. package/toggle-group/README.md +340 -5
  166. package/toggle-group/fesm2022/toggle-group.mjs +13 -13
  167. package/toggle-group/types/toggle-group.d.ts +13 -7
  168. package/tooltip/README.md +240 -34
  169. package/tooltip/fesm2022/tooltip.mjs +14 -14
  170. package/typography/README.md +271 -5
  171. package/typography/fesm2022/typography.mjs +53 -53
  172. package/typography/types/typography.d.ts +12 -12
  173. package/utils/README.md +274 -34
  174. package/utils/fesm2022/utils.mjs +68 -44
  175. package/accordion/fesm2022/accordion.mjs.map +0 -1
  176. package/alert/fesm2022/alert.mjs.map +0 -1
  177. package/alert-dialog/fesm2022/alert-dialog.mjs.map +0 -1
  178. package/aspect-ratio/fesm2022/aspect-ratio.mjs.map +0 -1
  179. package/autocomplete/fesm2022/autocomplete.mjs.map +0 -1
  180. package/avatar/fesm2022/avatar.mjs.map +0 -1
  181. package/badge/fesm2022/badge.mjs.map +0 -1
  182. package/basic-alert/fesm2022/basic-alert.mjs.map +0 -1
  183. package/breadcrumb/fesm2022/breadcrumb.mjs.map +0 -1
  184. package/button/fesm2022/button.mjs.map +0 -1
  185. package/button-group/fesm2022/button-group.mjs.map +0 -1
  186. package/calendar/fesm2022/calendar.mjs.map +0 -1
  187. package/card/fesm2022/card.mjs.map +0 -1
  188. package/carousel/fesm2022/carousel.mjs.map +0 -1
  189. package/checkbox/fesm2022/checkbox.mjs.map +0 -1
  190. package/collapsible/fesm2022/collapsible.mjs.map +0 -1
  191. package/combobox/fesm2022/combobox.mjs.map +0 -1
  192. package/command/fesm2022/command.mjs.map +0 -1
  193. package/confirmation-dialog/fesm2022/confirmation-dialog.mjs.map +0 -1
  194. package/context-menu/fesm2022/context-menu.mjs.map +0 -1
  195. package/date-picker/fesm2022/date-picker.mjs.map +0 -1
  196. package/dialog/fesm2022/dialog.mjs.map +0 -1
  197. package/drawer/fesm2022/drawer.mjs.map +0 -1
  198. package/dropdown-menu/fesm2022/dropdown-menu.mjs.map +0 -1
  199. package/empty/fesm2022/empty.mjs.map +0 -1
  200. package/field/fesm2022/field.mjs.map +0 -1
  201. package/form-checkbox/fesm2022/form-checkbox.mjs.map +0 -1
  202. package/form-date-picker/fesm2022/form-date-picker.mjs.map +0 -1
  203. package/form-field/fesm2022/form-field.mjs.map +0 -1
  204. package/form-field-simple/fesm2022/form-field-simple.mjs.map +0 -1
  205. package/form-searchable-multiselect/fesm2022/form-searchable-multiselect.mjs.map +0 -1
  206. package/form-select/fesm2022/form-select.mjs.map +0 -1
  207. package/form-text-input/fesm2022/form-text-input.mjs.map +0 -1
  208. package/form-textarea/fesm2022/form-textarea.mjs.map +0 -1
  209. package/hover-card/fesm2022/hover-card.mjs.map +0 -1
  210. package/icon/fesm2022/icon.mjs.map +0 -1
  211. package/input/fesm2022/input.mjs.map +0 -1
  212. package/input-group/fesm2022/input-group.mjs.map +0 -1
  213. package/input-otp/fesm2022/input-otp.mjs.map +0 -1
  214. package/item/fesm2022/item.mjs.map +0 -1
  215. package/kbd/fesm2022/kbd.mjs.map +0 -1
  216. package/label/fesm2022/label.mjs.map +0 -1
  217. package/layout-simple/fesm2022/layout-simple.mjs.map +0 -1
  218. package/menubar/fesm2022/menubar.mjs.map +0 -1
  219. package/native-select/fesm2022/native-select.mjs.map +0 -1
  220. package/navigation-menu/fesm2022/navigation-menu.mjs.map +0 -1
  221. package/pagination/fesm2022/pagination.mjs.map +0 -1
  222. package/popover/fesm2022/popover.mjs.map +0 -1
  223. package/progress/fesm2022/progress.mjs.map +0 -1
  224. package/radio-group/fesm2022/radio-group.mjs.map +0 -1
  225. package/resizable/fesm2022/resizable.mjs.map +0 -1
  226. package/scroll-area/fesm2022/scroll-area.mjs.map +0 -1
  227. package/searchable-multiselect/fesm2022/searchable-multiselect.mjs.map +0 -1
  228. package/select/fesm2022/select.mjs.map +0 -1
  229. package/separator/fesm2022/separator.mjs.map +0 -1
  230. package/sheet/fesm2022/sheet.mjs.map +0 -1
  231. package/sidebar/fesm2022/sidebar.mjs.map +0 -1
  232. package/skeleton/fesm2022/skeleton.mjs.map +0 -1
  233. package/slider/fesm2022/slider.mjs.map +0 -1
  234. package/sonner/fesm2022/sonner.mjs.map +0 -1
  235. package/spinner/fesm2022/spinner.mjs.map +0 -1
  236. package/switch/fesm2022/switch.mjs.map +0 -1
  237. package/table/fesm2022/table.mjs.map +0 -1
  238. package/tabs/fesm2022/tabs.mjs.map +0 -1
  239. package/textarea/fesm2022/textarea.mjs.map +0 -1
  240. package/toggle/fesm2022/toggle.mjs.map +0 -1
  241. package/toggle-group/fesm2022/toggle-group.mjs.map +0 -1
  242. package/tooltip/fesm2022/tooltip.mjs.map +0 -1
  243. package/typography/fesm2022/typography.mjs.map +0 -1
  244. package/utils/fesm2022/utils.mjs.map +0 -1
@@ -12,7 +12,7 @@ import { HlmBtn, provideBrnButtonConfig } from '@egose/shadcn-theme-ng-tw/button
12
12
  class HlmAlertDialogOverlay {
13
13
  _classSettable = injectCustomClassSettable({ optional: true, host: true });
14
14
  userClass = input('', { ...(ngDevMode ? { debugName: "userClass" } : /* istanbul ignore next */ {}), alias: 'class' });
15
- _computedClass = computed(() => hlm('data-open:animate-in data-closed:animate-out data-closed:fade-out-0 data-open:fade-in-0 isolate bg-black/10 duration-100 supports-backdrop-filter:backdrop-blur-xs', this.userClass()), /* @ts-ignore */
15
+ _computedClass = computed(() => hlm('tw:data-open:animate-in tw:data-closed:animate-out data-closed:fade-out-0 data-open:fade-in-0 tw:isolate tw:bg-black/10 tw:duration-100 tw:supports-backdrop-filter:backdrop-blur-xs', this.userClass()), /* @ts-ignore */
16
16
  ...(ngDevMode ? [{ debugName: "_computedClass" }] : /* istanbul ignore next */ []));
17
17
  constructor() {
18
18
  effect(() => {
@@ -20,10 +20,10 @@ class HlmAlertDialogOverlay {
20
20
  untracked(() => this._classSettable?.setClassToCustomElement(classValue));
21
21
  });
22
22
  }
23
- static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.7", ngImport: i0, type: HlmAlertDialogOverlay, deps: [], target: i0.ɵɵFactoryTarget.Directive });
24
- static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "22.0.7", type: HlmAlertDialogOverlay, isStandalone: true, selector: "[hlmAlertDialogOverlay],hlm-alert-dialog-overlay", inputs: { userClass: { classPropertyName: "userClass", publicName: "class", isSignal: true, isRequired: false, transformFunction: null } }, hostDirectives: [{ directive: i1.BrnAlertDialogOverlay }], ngImport: i0 });
23
+ static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.3", ngImport: i0, type: HlmAlertDialogOverlay, deps: [], target: i0.ɵɵFactoryTarget.Directive });
24
+ static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "22.1.3", type: HlmAlertDialogOverlay, isStandalone: true, selector: "[hlmAlertDialogOverlay],hlm-alert-dialog-overlay", inputs: { userClass: { classPropertyName: "userClass", publicName: "class", isSignal: true, isRequired: false, transformFunction: null } }, hostDirectives: [{ directive: i1.BrnAlertDialogOverlay }], ngImport: i0 });
25
25
  }
26
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.7", ngImport: i0, type: HlmAlertDialogOverlay, decorators: [{
26
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.3", ngImport: i0, type: HlmAlertDialogOverlay, decorators: [{
27
27
  type: Directive,
28
28
  args: [{
29
29
  selector: '[hlmAlertDialogOverlay],hlm-alert-dialog-overlay',
@@ -32,8 +32,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.7", ngImpor
32
32
  }], ctorParameters: () => [], propDecorators: { userClass: [{ type: i0.Input, args: [{ isSignal: true, alias: "class", required: false }] }] } });
33
33
 
34
34
  class HlmAlertDialog extends BrnAlertDialog {
35
- static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.7", ngImport: i0, type: HlmAlertDialog, deps: null, target: i0.ɵɵFactoryTarget.Component });
36
- static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "22.0.7", type: HlmAlertDialog, isStandalone: true, selector: "hlm-alert-dialog", providers: [
35
+ static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.3", ngImport: i0, type: HlmAlertDialog, deps: null, target: i0.ɵɵFactoryTarget.Component });
36
+ static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "22.1.3", type: HlmAlertDialog, isStandalone: true, selector: "hlm-alert-dialog", providers: [
37
37
  {
38
38
  provide: BrnDialog,
39
39
  useExisting: forwardRef(() => HlmAlertDialog),
@@ -46,7 +46,7 @@ class HlmAlertDialog extends BrnAlertDialog {
46
46
  <ng-content />
47
47
  `, isInline: true, dependencies: [{ kind: "directive", type: HlmAlertDialogOverlay, selector: "[hlmAlertDialogOverlay],hlm-alert-dialog-overlay", inputs: ["class"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
48
48
  }
49
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.7", ngImport: i0, type: HlmAlertDialog, decorators: [{
49
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.3", ngImport: i0, type: HlmAlertDialog, decorators: [{
50
50
  type: Component,
51
51
  args: [{
52
52
  selector: 'hlm-alert-dialog',
@@ -72,10 +72,10 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.7", ngImpor
72
72
  class HlmAlertDialogAction {
73
73
  type = input('button', /* @ts-ignore */
74
74
  ...(ngDevMode ? [{ debugName: "type" }] : /* istanbul ignore next */ []));
75
- static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.7", ngImport: i0, type: HlmAlertDialogAction, deps: [], target: i0.ɵɵFactoryTarget.Directive });
76
- static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "22.0.7", type: HlmAlertDialogAction, isStandalone: true, selector: "button[hlmAlertDialogAction]", inputs: { type: { classPropertyName: "type", publicName: "type", isSignal: true, isRequired: false, transformFunction: null } }, host: { attributes: { "data-slot": "alert-dialog-action" }, properties: { "type": "type()" } }, hostDirectives: [{ directive: i1$1.HlmBtn, inputs: ["variant", "variant", "size", "size"] }], ngImport: i0 });
75
+ static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.3", ngImport: i0, type: HlmAlertDialogAction, deps: [], target: i0.ɵɵFactoryTarget.Directive });
76
+ static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "22.1.3", type: HlmAlertDialogAction, isStandalone: true, selector: "button[hlmAlertDialogAction]", inputs: { type: { classPropertyName: "type", publicName: "type", isSignal: true, isRequired: false, transformFunction: null } }, host: { attributes: { "data-slot": "alert-dialog-action" }, properties: { "type": "type()" } }, hostDirectives: [{ directive: i1$1.HlmBtn, inputs: ["variant", "variant", "size", "size"] }], ngImport: i0 });
77
77
  }
78
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.7", ngImport: i0, type: HlmAlertDialogAction, decorators: [{
78
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.3", ngImport: i0, type: HlmAlertDialogAction, decorators: [{
79
79
  type: Directive,
80
80
  args: [{
81
81
  selector: 'button[hlmAlertDialogAction]',
@@ -87,10 +87,10 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.7", ngImpor
87
87
  class HlmAlertDialogCancel {
88
88
  type = input('button', /* @ts-ignore */
89
89
  ...(ngDevMode ? [{ debugName: "type" }] : /* istanbul ignore next */ []));
90
- static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.7", ngImport: i0, type: HlmAlertDialogCancel, deps: [], target: i0.ɵɵFactoryTarget.Directive });
91
- static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "22.0.7", type: HlmAlertDialogCancel, isStandalone: true, selector: "button[hlmAlertDialogCancel]", inputs: { type: { classPropertyName: "type", publicName: "type", isSignal: true, isRequired: false, transformFunction: null } }, host: { attributes: { "data-slot": "alert-dialog-cancel" }, properties: { "type": "type()" } }, providers: [provideBrnButtonConfig({ variant: 'outline' })], hostDirectives: [{ directive: i1$2.BrnDialogClose }, { directive: i1$1.HlmBtn, inputs: ["variant", "variant", "size", "size"] }], ngImport: i0 });
90
+ static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.3", ngImport: i0, type: HlmAlertDialogCancel, deps: [], target: i0.ɵɵFactoryTarget.Directive });
91
+ static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "22.1.3", type: HlmAlertDialogCancel, isStandalone: true, selector: "button[hlmAlertDialogCancel]", inputs: { type: { classPropertyName: "type", publicName: "type", isSignal: true, isRequired: false, transformFunction: null } }, host: { attributes: { "data-slot": "alert-dialog-cancel" }, properties: { "type": "type()" } }, providers: [provideBrnButtonConfig({ variant: 'outline' })], hostDirectives: [{ directive: i1$2.BrnDialogClose }, { directive: i1$1.HlmBtn, inputs: ["variant", "variant", "size", "size"] }], ngImport: i0 });
92
92
  }
93
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.7", ngImport: i0, type: HlmAlertDialogCancel, decorators: [{
93
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.3", ngImport: i0, type: HlmAlertDialogCancel, decorators: [{
94
94
  type: Directive,
95
95
  args: [{
96
96
  selector: 'button[hlmAlertDialogCancel]',
@@ -106,12 +106,12 @@ class HlmAlertDialogContent {
106
106
  size = input('default', /* @ts-ignore */
107
107
  ...(ngDevMode ? [{ debugName: "size" }] : /* istanbul ignore next */ []));
108
108
  constructor() {
109
- classes(() => 'data-open:animate-in data-closed:animate-out data-closed:fade-out-0 data-open:fade-in-0 data-closed:zoom-out-95 data-open:zoom-in-95 bg-popover text-popover-foreground ring-foreground/10 gap-6 rounded-xl p-6 ring-1 duration-100 data-[size=default]:max-w-xs data-[size=sm]:max-w-xs data-[size=default]:sm:max-w-lg group/alert-dialog-content grid w-full outline-none');
109
+ classes(() => 'tw:data-open:animate-in tw:data-closed:animate-out data-closed:fade-out-0 data-open:fade-in-0 tw:data-closed:zoom-out-95 tw:data-open:zoom-in-95 tw:bg-popover tw:text-popover-foreground tw:ring-foreground/10 tw:gap-6 tw:rounded-xl tw:p-6 tw:ring-1 tw:duration-100 tw:data-[size=default]:max-w-xs tw:data-[size=sm]:max-w-xs tw:data-[size=default]:sm:max-w-lg tw:group/alert-dialog-content tw:grid tw:w-full tw:outline-none');
110
110
  }
111
- static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.7", ngImport: i0, type: HlmAlertDialogContent, deps: [], target: i0.ɵɵFactoryTarget.Directive });
112
- static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "22.0.7", type: HlmAlertDialogContent, isStandalone: true, selector: "[hlmAlertDialogContent],hlm-alert-dialog-content", inputs: { size: { classPropertyName: "size", publicName: "size", isSignal: true, isRequired: false, transformFunction: null } }, host: { attributes: { "data-slot": "alert-dialog-content" }, properties: { "attr.data-state": "state()", "attr.data-size": "size()" } }, ngImport: i0 });
111
+ static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.3", ngImport: i0, type: HlmAlertDialogContent, deps: [], target: i0.ɵɵFactoryTarget.Directive });
112
+ static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "22.1.3", type: HlmAlertDialogContent, isStandalone: true, selector: "[hlmAlertDialogContent],hlm-alert-dialog-content", inputs: { size: { classPropertyName: "size", publicName: "size", isSignal: true, isRequired: false, transformFunction: null } }, host: { attributes: { "data-slot": "alert-dialog-content" }, properties: { "attr.data-state": "state()", "attr.data-size": "size()" } }, ngImport: i0 });
113
113
  }
114
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.7", ngImport: i0, type: HlmAlertDialogContent, decorators: [{
114
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.3", ngImport: i0, type: HlmAlertDialogContent, decorators: [{
115
115
  type: Directive,
116
116
  args: [{
117
117
  selector: '[hlmAlertDialogContent],hlm-alert-dialog-content',
@@ -125,12 +125,12 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.7", ngImpor
125
125
 
126
126
  class HlmAlertDialogDescription {
127
127
  constructor() {
128
- classes(() => 'text-muted-foreground *:[a]:hover:text-foreground text-sm text-balance md:text-pretty *:[a]:underline *:[a]:underline-offset-3');
128
+ classes(() => 'tw:text-muted-foreground tw:*:[a]:hover:text-foreground tw:text-sm tw:text-balance tw:md:text-pretty tw:*:[a]:underline tw:*:[a]:underline-offset-3');
129
129
  }
130
- static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.7", ngImport: i0, type: HlmAlertDialogDescription, deps: [], target: i0.ɵɵFactoryTarget.Directive });
131
- static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "22.0.7", type: HlmAlertDialogDescription, isStandalone: true, selector: "[hlmAlertDialogDescription]", host: { attributes: { "data-slot": "alert-dialog-description" } }, hostDirectives: [{ directive: i1.BrnAlertDialogDescription }], ngImport: i0 });
130
+ static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.3", ngImport: i0, type: HlmAlertDialogDescription, deps: [], target: i0.ɵɵFactoryTarget.Directive });
131
+ static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "22.1.3", type: HlmAlertDialogDescription, isStandalone: true, selector: "[hlmAlertDialogDescription]", host: { attributes: { "data-slot": "alert-dialog-description" } }, hostDirectives: [{ directive: i1.BrnAlertDialogDescription }], ngImport: i0 });
132
132
  }
133
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.7", ngImport: i0, type: HlmAlertDialogDescription, decorators: [{
133
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.3", ngImport: i0, type: HlmAlertDialogDescription, decorators: [{
134
134
  type: Directive,
135
135
  args: [{
136
136
  selector: '[hlmAlertDialogDescription]',
@@ -141,12 +141,12 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.7", ngImpor
141
141
 
142
142
  class HlmAlertDialogFooter {
143
143
  constructor() {
144
- classes(() => 'flex flex-col-reverse gap-2 group-data-[size=sm]/alert-dialog-content:grid group-data-[size=sm]/alert-dialog-content:grid-cols-2 sm:flex-row sm:justify-end');
144
+ classes(() => 'tw:flex tw:flex-col-reverse tw:gap-2 tw:group-data-[size=sm]/alert-dialog-content:grid tw:group-data-[size=sm]/alert-dialog-content:grid-cols-2 tw:sm:flex-row tw:sm:justify-end');
145
145
  }
146
- static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.7", ngImport: i0, type: HlmAlertDialogFooter, deps: [], target: i0.ɵɵFactoryTarget.Directive });
147
- static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "22.0.7", type: HlmAlertDialogFooter, isStandalone: true, selector: "[hlmAlertDialogFooter],hlm-alert-dialog-footer", host: { attributes: { "data-slot": "alert-dialog-footer" } }, ngImport: i0 });
146
+ static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.3", ngImport: i0, type: HlmAlertDialogFooter, deps: [], target: i0.ɵɵFactoryTarget.Directive });
147
+ static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "22.1.3", type: HlmAlertDialogFooter, isStandalone: true, selector: "[hlmAlertDialogFooter],hlm-alert-dialog-footer", host: { attributes: { "data-slot": "alert-dialog-footer" } }, ngImport: i0 });
148
148
  }
149
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.7", ngImport: i0, type: HlmAlertDialogFooter, decorators: [{
149
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.3", ngImport: i0, type: HlmAlertDialogFooter, decorators: [{
150
150
  type: Directive,
151
151
  args: [{
152
152
  selector: '[hlmAlertDialogFooter],hlm-alert-dialog-footer',
@@ -156,12 +156,12 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.7", ngImpor
156
156
 
157
157
  class HlmAlertDialogHeader {
158
158
  constructor() {
159
- classes(() => 'grid grid-rows-[auto_1fr] place-items-center gap-1.5 text-center has-data-[slot=alert-dialog-media]:grid-rows-[auto_auto_1fr] has-data-[slot=alert-dialog-media]:gap-x-6 sm:group-data-[size=default]/alert-dialog-content:place-items-start sm:group-data-[size=default]/alert-dialog-content:text-start sm:group-data-[size=default]/alert-dialog-content:has-data-[slot=alert-dialog-media]:grid-rows-[auto_1fr]');
159
+ classes(() => 'tw:grid tw:grid-rows-[auto_1fr] tw:place-items-center tw:gap-1.5 tw:text-center tw:has-data-[slot=alert-dialog-media]:grid-rows-[auto_auto_1fr] tw:has-data-[slot=alert-dialog-media]:gap-x-6 tw:sm:group-data-[size=default]/alert-dialog-content:place-items-start tw:sm:group-data-[size=default]/alert-dialog-content:text-start tw:sm:group-data-[size=default]/alert-dialog-content:has-data-[slot=alert-dialog-media]:grid-rows-[auto_1fr]');
160
160
  }
161
- static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.7", ngImport: i0, type: HlmAlertDialogHeader, deps: [], target: i0.ɵɵFactoryTarget.Directive });
162
- static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "22.0.7", type: HlmAlertDialogHeader, isStandalone: true, selector: "[hlmAlertDialogHeader],hlm-alert-dialog-header", host: { attributes: { "data-slot": "alert-dialog-header" } }, ngImport: i0 });
161
+ static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.3", ngImport: i0, type: HlmAlertDialogHeader, deps: [], target: i0.ɵɵFactoryTarget.Directive });
162
+ static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "22.1.3", type: HlmAlertDialogHeader, isStandalone: true, selector: "[hlmAlertDialogHeader],hlm-alert-dialog-header", host: { attributes: { "data-slot": "alert-dialog-header" } }, ngImport: i0 });
163
163
  }
164
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.7", ngImport: i0, type: HlmAlertDialogHeader, decorators: [{
164
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.3", ngImport: i0, type: HlmAlertDialogHeader, decorators: [{
165
165
  type: Directive,
166
166
  args: [{
167
167
  selector: '[hlmAlertDialogHeader],hlm-alert-dialog-header',
@@ -171,12 +171,12 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.7", ngImpor
171
171
 
172
172
  class HlmAlertDialogMedia {
173
173
  constructor() {
174
- classes(() => "bg-muted mb-2 inline-flex size-16 items-center justify-center rounded-md sm:group-data-[size=default]/alert-dialog-content:row-span-2 *:[ng-icon:not([class*='text-'])]:text-[length:--spacing(8)]");
174
+ classes(() => "tw:bg-muted tw:mb-2 tw:inline-flex tw:size-16 tw:items-center tw:justify-center tw:rounded-md tw:sm:group-data-[size=default]/alert-dialog-content:row-span-2 tw:*:[ng-icon:not([class*='text-'])]:text-[length:--spacing(8)]");
175
175
  }
176
- static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.7", ngImport: i0, type: HlmAlertDialogMedia, deps: [], target: i0.ɵɵFactoryTarget.Directive });
177
- static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "22.0.7", type: HlmAlertDialogMedia, isStandalone: true, selector: "[hlmAlertDialogMedia],hlm-alert-dialog-media", host: { attributes: { "data-slot": "alert-dialog-media" } }, ngImport: i0 });
176
+ static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.3", ngImport: i0, type: HlmAlertDialogMedia, deps: [], target: i0.ɵɵFactoryTarget.Directive });
177
+ static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "22.1.3", type: HlmAlertDialogMedia, isStandalone: true, selector: "[hlmAlertDialogMedia],hlm-alert-dialog-media", host: { attributes: { "data-slot": "alert-dialog-media" } }, ngImport: i0 });
178
178
  }
179
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.7", ngImport: i0, type: HlmAlertDialogMedia, decorators: [{
179
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.3", ngImport: i0, type: HlmAlertDialogMedia, decorators: [{
180
180
  type: Directive,
181
181
  args: [{
182
182
  selector: '[hlmAlertDialogMedia],hlm-alert-dialog-media',
@@ -185,10 +185,10 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.7", ngImpor
185
185
  }], ctorParameters: () => [] });
186
186
 
187
187
  class HlmAlertDialogPortal {
188
- static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.7", ngImport: i0, type: HlmAlertDialogPortal, deps: [], target: i0.ɵɵFactoryTarget.Directive });
189
- static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "22.0.7", type: HlmAlertDialogPortal, isStandalone: true, selector: "[hlmAlertDialogPortal]", hostDirectives: [{ directive: i1.BrnAlertDialogContent, inputs: ["context", "context", "class", "class"] }], ngImport: i0 });
188
+ static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.3", ngImport: i0, type: HlmAlertDialogPortal, deps: [], target: i0.ɵɵFactoryTarget.Directive });
189
+ static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "22.1.3", type: HlmAlertDialogPortal, isStandalone: true, selector: "[hlmAlertDialogPortal]", hostDirectives: [{ directive: i1.BrnAlertDialogContent, inputs: ["context", "context", "class", "class"] }], ngImport: i0 });
190
190
  }
191
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.7", ngImport: i0, type: HlmAlertDialogPortal, decorators: [{
191
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.3", ngImport: i0, type: HlmAlertDialogPortal, decorators: [{
192
192
  type: Directive,
193
193
  args: [{
194
194
  selector: '[hlmAlertDialogPortal]',
@@ -198,12 +198,12 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.7", ngImpor
198
198
 
199
199
  class HlmAlertDialogTitle {
200
200
  constructor() {
201
- classes(() => 'text-lg font-medium sm:group-data-[size=default]/alert-dialog-content:group-has-data-[slot=alert-dialog-media]/alert-dialog-content:col-start-2');
201
+ classes(() => 'tw:text-lg tw:font-medium tw:sm:group-data-[size=default]/alert-dialog-content:group-has-data-[slot=alert-dialog-media]/alert-dialog-content:col-start-2');
202
202
  }
203
- static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.7", ngImport: i0, type: HlmAlertDialogTitle, deps: [], target: i0.ɵɵFactoryTarget.Directive });
204
- static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "22.0.7", type: HlmAlertDialogTitle, isStandalone: true, selector: "[hlmAlertDialogTitle]", host: { attributes: { "data-slot": "alert-dialog-title" } }, hostDirectives: [{ directive: i1.BrnAlertDialogTitle }], ngImport: i0 });
203
+ static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.3", ngImport: i0, type: HlmAlertDialogTitle, deps: [], target: i0.ɵɵFactoryTarget.Directive });
204
+ static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "22.1.3", type: HlmAlertDialogTitle, isStandalone: true, selector: "[hlmAlertDialogTitle]", host: { attributes: { "data-slot": "alert-dialog-title" } }, hostDirectives: [{ directive: i1.BrnAlertDialogTitle }], ngImport: i0 });
205
205
  }
206
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.7", ngImport: i0, type: HlmAlertDialogTitle, decorators: [{
206
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.3", ngImport: i0, type: HlmAlertDialogTitle, decorators: [{
207
207
  type: Directive,
208
208
  args: [{
209
209
  selector: '[hlmAlertDialogTitle]',
@@ -213,10 +213,10 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.7", ngImpor
213
213
  }], ctorParameters: () => [] });
214
214
 
215
215
  class HlmAlertDialogTrigger {
216
- static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.7", ngImport: i0, type: HlmAlertDialogTrigger, deps: [], target: i0.ɵɵFactoryTarget.Directive });
217
- static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "22.0.7", type: HlmAlertDialogTrigger, isStandalone: true, selector: "button[hlmAlertDialogTrigger],button[hlmAlertDialogTriggerFor]", host: { attributes: { "data-slot": "alert-dialog-trigger" } }, hostDirectives: [{ directive: i1.BrnAlertDialogTrigger, inputs: ["id", "id", "brnAlertDialogTriggerFor", "hlmAlertDialogTriggerFor", "type", "type"] }], ngImport: i0 });
216
+ static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.3", ngImport: i0, type: HlmAlertDialogTrigger, deps: [], target: i0.ɵɵFactoryTarget.Directive });
217
+ static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "22.1.3", type: HlmAlertDialogTrigger, isStandalone: true, selector: "button[hlmAlertDialogTrigger],button[hlmAlertDialogTriggerFor]", host: { attributes: { "data-slot": "alert-dialog-trigger" } }, hostDirectives: [{ directive: i1.BrnAlertDialogTrigger, inputs: ["id", "id", "brnAlertDialogTriggerFor", "hlmAlertDialogTriggerFor", "type", "type"] }], ngImport: i0 });
218
218
  }
219
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.7", ngImport: i0, type: HlmAlertDialogTrigger, decorators: [{
219
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.3", ngImport: i0, type: HlmAlertDialogTrigger, decorators: [{
220
220
  type: Directive,
221
221
  args: [{
222
222
  selector: 'button[hlmAlertDialogTrigger],button[hlmAlertDialogTriggerFor]',
@@ -245,8 +245,8 @@ const HlmAlertDialogImports = [
245
245
  HlmAlertDialogTrigger,
246
246
  ];
247
247
  class HlmAlertDialogModule {
248
- static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.7", ngImport: i0, type: HlmAlertDialogModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
249
- static ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "22.0.7", ngImport: i0, type: HlmAlertDialogModule, imports: [HlmAlertDialog,
248
+ static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.3", ngImport: i0, type: HlmAlertDialogModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
249
+ static ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "22.1.3", ngImport: i0, type: HlmAlertDialogModule, imports: [HlmAlertDialog,
250
250
  HlmAlertDialogAction,
251
251
  HlmAlertDialogCancel,
252
252
  HlmAlertDialogContent,
@@ -269,9 +269,9 @@ class HlmAlertDialogModule {
269
269
  HlmAlertDialogPortal,
270
270
  HlmAlertDialogTitle,
271
271
  HlmAlertDialogTrigger] });
272
- static ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "22.0.7", ngImport: i0, type: HlmAlertDialogModule });
272
+ static ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "22.1.3", ngImport: i0, type: HlmAlertDialogModule });
273
273
  }
274
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.7", ngImport: i0, type: HlmAlertDialogModule, decorators: [{
274
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.3", ngImport: i0, type: HlmAlertDialogModule, decorators: [{
275
275
  type: NgModule,
276
276
  args: [{
277
277
  imports: [...HlmAlertDialogImports],
@@ -284,4 +284,4 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.7", ngImpor
284
284
  */
285
285
 
286
286
  export { HlmAlertDialog, HlmAlertDialogAction, HlmAlertDialogCancel, HlmAlertDialogContent, HlmAlertDialogDescription, HlmAlertDialogFooter, HlmAlertDialogHeader, HlmAlertDialogImports, HlmAlertDialogMedia, HlmAlertDialogModule, HlmAlertDialogOverlay, HlmAlertDialogPortal, HlmAlertDialogTitle, HlmAlertDialogTrigger };
287
- //# sourceMappingURL=alert-dialog.mjs.map
287
+
@@ -1,7 +1,7 @@
1
1
  import * as i1$2 from '@spartan-ng/brain/alert-dialog';
2
2
  import { BrnAlertDialog } from '@spartan-ng/brain/alert-dialog';
3
3
  import * as i0 from '@angular/core';
4
- import * as i1 from '@egose/shadcn-theme-ng/button';
4
+ import * as i1 from '@egose/shadcn-theme-ng-tw/button';
5
5
  import * as i1$1 from '@spartan-ng/brain/dialog';
6
6
  import { ClassValue } from 'clsx';
7
7
 
@@ -1,11 +1,278 @@
1
- # AspectRatio
1
+ # Aspect Ratio (`@egose/shadcn-theme-ng/aspect-ratio`)
2
2
 
3
- This project was generated using [Angular CLI](https://github.com/angular/angular-cli).
3
+ A layout helper in the shadcn/ui Aspect Ratio style: it forces a box to keep a fixed
4
+ width-to-height proportion (16:9 video embeds, square thumbnails, 4:3 cards) regardless of the
5
+ viewport. Content placed inside simply fills the ratio-locked frame.
4
6
 
5
- ## Building
7
+ This is a **standalone utility directive with no brain primitive**. `HlmAspectRatio` writes the
8
+ numeric ratio to a `--ratio` CSS custom property and applies the `aspect-(--ratio)` Tailwind class;
9
+ it accepts plain numbers, coercible values, or `"W/H"` strings such as `"16/9"`.
6
10
 
7
- To build the library, run:
11
+ > **Ships as:** `@egose/shadcn-theme-ng/aspect-ratio` and `@egose/shadcn-theme-ng-tw/aspect-ratio`
12
+ > (the `tw:`-prefixed Tailwind variant). Both expose the identical TypeScript surface; only the
13
+ > emitted Tailwind class strings differ. See the [package README](../../README.md) for install
14
+ > steps, peer dependencies, and Tailwind setup. Do not publish this project directory independently.
15
+
16
+ ## Installation
8
17
 
9
18
  ```bash
10
- ng build aspect-ratio
19
+ # Plain Tailwind (no prefix)
20
+ npm install @egose/shadcn-theme-ng
21
+
22
+ # tw:-prefixed Tailwind variant
23
+ npm install @egose/shadcn-theme-ng-tw
24
+ ```
25
+
26
+ Peer dependencies (Angular core/common) are documented in the
27
+ [package README](../../README.md#peer-dependencies). Runtime styling helper:
28
+ `@egose/shadcn-theme-ng/utils` (`classes()`).
29
+
30
+ ## Imports
31
+
32
+ All symbols are exported from the subpath root (`projects/aspect-ratio/src/public-api.ts`):
33
+
34
+ ```ts
35
+ import { HlmAspectRatio, HlmAspectRatioImports, HlmAspectRatioModule } from '@egose/shadcn-theme-ng/aspect-ratio';
36
+ // tw variant: replace with '@egose/shadcn-theme-ng-tw/aspect-ratio'
37
+ ```
38
+
39
+ Standalone component — spread the `*Imports` array (single entry):
40
+
41
+ ```ts
42
+ import { Component } from '@angular/core';
43
+ import { HlmAspectRatioImports } from '@egose/shadcn-theme-ng/aspect-ratio';
44
+
45
+ @Component({
46
+ selector: 'app-demo',
47
+ standalone: true,
48
+ imports: [...HlmAspectRatioImports],
49
+ template: `...`,
50
+ })
51
+ export class DemoComponent {}
52
+ ```
53
+
54
+ NgModule-based consumer — import the module:
55
+
56
+ ```ts
57
+ import { NgModule } from '@angular/core';
58
+ import { HlmAspectRatioModule } from '@egose/shadcn-theme-ng/aspect-ratio';
59
+
60
+ @NgModule({ imports: [HlmAspectRatioModule] })
61
+ export class DemoModule {}
11
62
  ```
63
+
64
+ You can also import `HlmAspectRatio` itself directly — it is a standalone directive.
65
+
66
+ ## Anatomy / Structure
67
+
68
+ ```html
69
+ <div [hlmAspectRatio]="16 / 9">
70
+ <img src="hero.jpg" alt="Hero" class="tw:h-full tw:w-full tw:object-cover tw:rounded-md" />
71
+ </div>
72
+ ```
73
+
74
+ Real selector (from source):
75
+
76
+ | Class | Selector | Kind |
77
+ | ---------------- | ------------------ | --------- |
78
+ | `HlmAspectRatio` | `[hlmAspectRatio]` | Directive |
79
+
80
+ The host gets `data-slot="aspect-ratio"`, `[style.--ratio]` bound to the coerced value, and the
81
+ `tw:relative tw:aspect-(--ratio)` classes. Anything projected inside lays out against that frame.
82
+
83
+ ## API reference
84
+
85
+ ### `HlmAspectRatio` — `[hlmAspectRatio]`
86
+
87
+ | Input | Type | Default | Description |
88
+ | --------------------------------------- | ----------------------- | ------- | ------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- |
89
+ | `hlmAspectRatio` (aliased as `ratio()`) | `number \| NumberInput` | `1` | Width ÷ height. Accepts numbers (`1.777`), numeric strings (`"1.5"`), or `"W/H"` strings (`"16/9"`, `"4/3"`, `"1/1"`). Values that coerce to `≤ 0` (or `NaN`) fall back to `1`. |
90
+
91
+ Coercion details (read from source): `"W/H"` strings are split on `/`, each side parsed with
92
+ `parseInt`, then divided; the result passes through `coerceNumberProperty` from
93
+ `@angular/cdk/coercion`. So `[hlmAspectRatio]="'16/9'"` ⇒ `16 / 9 ≈ 1.778`.
94
+
95
+ No outputs, no methods — purely presentational.
96
+
97
+ ## Examples
98
+
99
+ ### 1. Basic 16:9 embed
100
+
101
+ ```ts
102
+ import { Component } from '@angular/core';
103
+ import { HlmAspectRatioImports } from '@egose/shadcn-theme-ng/aspect-ratio';
104
+
105
+ @Component({
106
+ selector: 'app-ratio-basic',
107
+ standalone: true,
108
+ imports: [...HlmAspectRatioImports],
109
+ template: `
110
+ <div [hlmAspectRatio]="16 / 9" class="tw:overflow-hidden tw:rounded-md tw:bg-muted">
111
+ <img src="https://picsum.photos/800/450" alt="Landscape" class="tw:h-full tw:w-full tw:object-cover" />
112
+ </div>
113
+ `,
114
+ })
115
+ export class RatioBasicComponent {}
116
+ ```
117
+
118
+ ```html
119
+ <app-ratio-basic />
120
+ ```
121
+
122
+ ### 2. String ratios: square, portrait, cinematic
123
+
124
+ ```ts
125
+ import { Component } from '@angular/core';
126
+ import { HlmAspectRatioImports } from '@egose/shadcn-theme-ng/aspect-ratio';
127
+
128
+ @Component({
129
+ selector: 'app-ratio-strings',
130
+ standalone: true,
131
+ imports: [...HlmAspectRatioImports],
132
+ template: `
133
+ <div class="tw:grid tw:grid-cols-3 tw:gap-4">
134
+ <div hlmAspectRatio="1/1" class="tw:overflow-hidden tw:rounded-md tw:bg-muted">
135
+ <img src="https://picsum.photos/400/400" alt="Square" class="tw:h-full tw:w-full tw:object-cover" />
136
+ </div>
137
+ <div hlmAspectRatio="3/4" class="tw:overflow-hidden tw:rounded-md tw:bg-muted">
138
+ <img src="https://picsum.photos/300/400" alt="Portrait" class="tw:h-full tw:w-full tw:object-cover" />
139
+ </div>
140
+ <div hlmAspectRatio="21/9" class="tw:overflow-hidden tw:rounded-md tw:bg-muted">
141
+ <img src="https://picsum.photos/630/270" alt="Cinematic" class="tw:h-full tw:w-full tw:object-cover" />
142
+ </div>
143
+ </div>
144
+ `,
145
+ })
146
+ export class RatioStringsComponent {}
147
+ ```
148
+
149
+ ### 3. Video / iframe embed
150
+
151
+ ```ts
152
+ import { Component } from '@angular/core';
153
+ import { HlmAspectRatioImports } from '@egose/shadcn-theme-ng/aspect-ratio';
154
+
155
+ @Component({
156
+ selector: 'app-ratio-video',
157
+ standalone: true,
158
+ imports: [...HlmAspectRatioImports],
159
+ template: `
160
+ <div [hlmAspectRatio]="16 / 9" class="tw:overflow-hidden tw:rounded-lg tw:border">
161
+ <iframe
162
+ class="tw:absolute tw:inset-0 tw:h-full tw:w-full"
163
+ src="https://www.youtube.com/embed/dQw4w9WgXcQ"
164
+ title="Product tour"
165
+ allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture"
166
+ allowfullscreen
167
+ ></iframe>
168
+ </div>
169
+ `,
170
+ })
171
+ export class RatioVideoComponent {}
172
+ ```
173
+
174
+ (The host is `relative`, so absolute-positioned media pins to the frame.)
175
+
176
+ ### 4. Dynamic ratio from a signal (user-selectable)
177
+
178
+ ```ts
179
+ import { Component, signal } from '@angular/core';
180
+ import { HlmAspectRatioImports } from '@egose/shadcn-theme-ng/aspect-ratio';
181
+
182
+ @Component({
183
+ selector: 'app-ratio-dynamic',
184
+ standalone: true,
185
+ imports: [...HlmAspectRatioImports],
186
+ template: `
187
+ <div class="tw:mb-3 tw:flex tw:gap-2">
188
+ @for (preset of presets; track preset.label) {
189
+ <button (click)="ratio.set(preset.value)" [disabled]="ratio() === preset.value">
190
+ {{ preset.label }}
191
+ </button>
192
+ }
193
+ </div>
194
+ <div [hlmAspectRatio]="ratio()" class="tw:overflow-hidden tw:rounded-md tw:bg-muted">
195
+ <img src="https://picsum.photos/800/600" alt="Preview" class="tw:h-full tw:w-full tw:object-cover" />
196
+ </div>
197
+ `,
198
+ })
199
+ export class RatioDynamicComponent {
200
+ readonly presets = [
201
+ { label: 'Square', value: 1 },
202
+ { label: '16:9', value: 16 / 9 },
203
+ { label: '4:3', value: 4 / 3 },
204
+ ];
205
+ readonly ratio = signal<number>(16 / 9);
206
+ }
207
+ ```
208
+
209
+ ### 5. Card media header with overlay content
210
+
211
+ ```ts
212
+ import { Component } from '@angular/core';
213
+ import { HlmAspectRatioImports } from '@egose/shadcn-theme-ng/aspect-ratio';
214
+ import { HlmBadge } from '@egose/shadcn-theme-ng/badge';
215
+
216
+ @Component({
217
+ selector: 'app-ratio-card',
218
+ standalone: true,
219
+ imports: [...HlmAspectRatioImports, HlmBadge],
220
+ template: `
221
+ <article class="tw:overflow-hidden tw:rounded-lg tw:border">
222
+ <div hlmAspectRatio="16/9" class="tw:bg-muted">
223
+ <img src="https://picsum.photos/640/360" alt="Post cover" class="tw:h-full tw:w-full tw:object-cover" />
224
+ <span hlmBadge class="tw:absolute tw:top-2 tw:left-2">New</span>
225
+ </div>
226
+ <div class="tw:p-4">
227
+ <h3 class="tw:font-semibold">Ratio-locked covers</h3>
228
+ <p class="tw:text-sm tw:text-muted-foreground">Every card image lines up, whatever the source size.</p>
229
+ </div>
230
+ </article>
231
+ `,
232
+ })
233
+ export class RatioCardComponent {}
234
+ ```
235
+
236
+ ### 6. Invalid values fall back to square
237
+
238
+ ```ts
239
+ import { Component } from '@angular/core';
240
+ import { HlmAspectRatioImports } from '@egose/shadcn-theme-ng/aspect-ratio';
241
+
242
+ @Component({
243
+ selector: 'app-ratio-fallback',
244
+ standalone: true,
245
+ imports: [...HlmAspectRatioImports],
246
+ template: `
247
+ <!-- 0, negatives, and NaN coerce to ratio 1 (square) instead of breaking layout -->
248
+ <div [hlmAspectRatio]="userValue" class="tw:bg-muted tw:rounded-md">
249
+ <p class="tw:p-4 tw:text-sm">ratio input: {{ userValue }} → renders square</p>
250
+ </div>
251
+ `,
252
+ })
253
+ export class RatioFallbackComponent {
254
+ userValue = 0; // try -2, Number.NaN, or a valid number
255
+ }
256
+ ```
257
+
258
+ ## Accessibility notes
259
+
260
+ - The directive adds no semantics (`data-slot` only) — the _content_ carries meaning. Always give
261
+ images real `alt` text and iframes a `title`.
262
+ - Do not use aspect-ratio boxes as click targets by themselves; put a real `<button>` or `<a>`
263
+ inside or around them so keyboard users get a focusable control.
264
+ - Avoid extreme ratios for text content (e.g. `21/9` with paragraphs) — zoomed text can overflow
265
+ the locked frame. Prefer images/video, or allow the frame to grow with `min-h` utilities.
266
+
267
+ ## Theming / CSS variables
268
+
269
+ The directive sets one custom property on its host: `--ratio` (unitless number). The frame size
270
+ comes from the `aspect-(--ratio)` utility reading that property. You can read or override
271
+ `--ratio` in your own CSS if you need derived sizing (e.g. `height: calc(100vw / var(--ratio))`).
272
+
273
+ ## Related subpaths
274
+
275
+ - `@egose/shadcn-theme-ng/avatar` — fixed-size ratio-locked identity images
276
+ - `@egose/shadcn-theme-ng/card` — cards whose media headers use ratio frames
277
+ - `@egose/shadcn-theme-ng/carousel` — slides with consistent media proportions
278
+ - `@egose/shadcn-theme-ng/skeleton` — ratio-shaped loading placeholders
@@ -21,12 +21,12 @@ class HlmAspectRatio {
21
21
  return coerced <= 0 ? 1 : coerced;
22
22
  } });
23
23
  constructor() {
24
- classes(() => 'relative aspect-(--ratio)');
24
+ classes(() => 'tw:relative tw:aspect-(--ratio)');
25
25
  }
26
- static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.7", ngImport: i0, type: HlmAspectRatio, deps: [], target: i0.ɵɵFactoryTarget.Directive });
27
- static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "22.0.7", type: HlmAspectRatio, isStandalone: true, selector: "[hlmAspectRatio]", inputs: { ratio: { classPropertyName: "ratio", publicName: "hlmAspectRatio", isSignal: true, isRequired: false, transformFunction: null } }, host: { attributes: { "data-slot": "aspect-ratio" }, properties: { "style.--ratio": "ratio()" } }, ngImport: i0 });
26
+ static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.3", ngImport: i0, type: HlmAspectRatio, deps: [], target: i0.ɵɵFactoryTarget.Directive });
27
+ static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "22.1.3", type: HlmAspectRatio, isStandalone: true, selector: "[hlmAspectRatio]", inputs: { ratio: { classPropertyName: "ratio", publicName: "hlmAspectRatio", isSignal: true, isRequired: false, transformFunction: null } }, host: { attributes: { "data-slot": "aspect-ratio" }, properties: { "style.--ratio": "ratio()" } }, ngImport: i0 });
28
28
  }
29
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.7", ngImport: i0, type: HlmAspectRatio, decorators: [{
29
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.3", ngImport: i0, type: HlmAspectRatio, decorators: [{
30
30
  type: Directive,
31
31
  args: [{
32
32
  selector: '[hlmAspectRatio]',
@@ -42,11 +42,11 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.7", ngImpor
42
42
  */
43
43
  const HlmAspectRatioImports = [HlmAspectRatio];
44
44
  class HlmAspectRatioModule {
45
- static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.7", ngImport: i0, type: HlmAspectRatioModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
46
- static ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "22.0.7", ngImport: i0, type: HlmAspectRatioModule, imports: [HlmAspectRatio], exports: [HlmAspectRatio] });
47
- static ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "22.0.7", ngImport: i0, type: HlmAspectRatioModule });
45
+ static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.3", ngImport: i0, type: HlmAspectRatioModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
46
+ static ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "22.1.3", ngImport: i0, type: HlmAspectRatioModule, imports: [HlmAspectRatio], exports: [HlmAspectRatio] });
47
+ static ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "22.1.3", ngImport: i0, type: HlmAspectRatioModule });
48
48
  }
49
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.7", ngImport: i0, type: HlmAspectRatioModule, decorators: [{
49
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.3", ngImport: i0, type: HlmAspectRatioModule, decorators: [{
50
50
  type: NgModule,
51
51
  args: [{
52
52
  imports: [...HlmAspectRatioImports],
@@ -59,4 +59,4 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.7", ngImpor
59
59
  */
60
60
 
61
61
  export { HlmAspectRatio, HlmAspectRatioImports, HlmAspectRatioModule };
62
- //# sourceMappingURL=aspect-ratio.mjs.map
62
+