ngx-tethys 19.0.13 → 19.1.0-next.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 (280) hide show
  1. package/CHANGELOG.md +29 -2
  2. package/action/action.component.d.ts +12 -20
  3. package/action/actions.component.d.ts +5 -7
  4. package/affix/affix.component.d.ts +7 -10
  5. package/alert/alert.component.d.ts +1 -1
  6. package/anchor/anchor-link.component.d.ts +8 -8
  7. package/anchor/anchor.component.d.ts +15 -21
  8. package/arrow-switcher/arrow-switcher.component.d.ts +15 -22
  9. package/autocomplete/autocomplete.component.d.ts +10 -17
  10. package/autocomplete/autocomplete.trigger.directive.d.ts +10 -18
  11. package/avatar/avatar-list/avatar-list.component.d.ts +8 -14
  12. package/avatar/avatar.component.d.ts +25 -39
  13. package/back-top/back-top.component.d.ts +9 -12
  14. package/badge/badge.component.d.ts +19 -59
  15. package/breadcrumb/breadcrumb.component.d.ts +15 -20
  16. package/button/button-icon.component.d.ts +3 -2
  17. package/button/button.component.d.ts +3 -2
  18. package/calendar/calendar-header.component.d.ts +9 -8
  19. package/calendar/calendar.component.d.ts +16 -16
  20. package/card/card.component.d.ts +5 -11
  21. package/card/content.component.d.ts +3 -8
  22. package/card/header.component.d.ts +7 -8
  23. package/carousel/carousel.component.d.ts +22 -27
  24. package/cascader/cascader-li.component.d.ts +13 -21
  25. package/cascader/cascader-search-option.component.d.ts +8 -16
  26. package/cascader/cascader.component.d.ts +58 -80
  27. package/checkbox/checkbox.component.d.ts +2 -5
  28. package/collapse/collapse-item.component.d.ts +12 -19
  29. package/collapse/collapse.component.d.ts +6 -12
  30. package/collapse/collapse.token.d.ts +3 -3
  31. package/color-picker/color-picker-custom-panel.component.d.ts +5 -5
  32. package/color-picker/color-picker-panel.component.d.ts +7 -11
  33. package/color-picker/color-picker.component.d.ts +19 -35
  34. package/color-picker/parts/alpha/alpha.component.d.ts +8 -8
  35. package/color-picker/parts/hue/hue.component.d.ts +6 -6
  36. package/color-picker/parts/indicator/indicator.component.d.ts +4 -3
  37. package/color-picker/parts/inputs/inputs.component.d.ts +9 -9
  38. package/color-picker/parts/saturation/saturation.component.d.ts +9 -9
  39. package/comment/comment.component.d.ts +4 -5
  40. package/copy/copy.directive.d.ts +8 -9
  41. package/date-picker/abstract-picker.component.d.ts +8 -7
  42. package/date-picker/lib/calendar/calendar-footer.component.d.ts +2 -1
  43. package/date-picker/lib/popups/inner-popup.component.d.ts +2 -1
  44. package/date-picker/picker.component.d.ts +2 -1
  45. package/date-range/date-range.component.d.ts +2 -2
  46. package/dialog/body/dialog-body.component.d.ts +2 -6
  47. package/dialog/confirm/confirm.component.d.ts +2 -2
  48. package/dialog/footer/dialog-footer.component.d.ts +6 -9
  49. package/dialog/header/dialog-header.component.d.ts +9 -11
  50. package/divider/divider.component.d.ts +12 -16
  51. package/dot/dot.component.d.ts +5 -13
  52. package/drag-drop/drag-handle.directive.d.ts +2 -1
  53. package/drag-drop/drag.directive.d.ts +2 -1
  54. package/drag-drop/drop-container.directive.d.ts +2 -1
  55. package/dropdown/dropdown-menu-item.directive.d.ts +3 -2
  56. package/dropdown/dropdown-menu.component.d.ts +2 -1
  57. package/dropdown/dropdown.directive.d.ts +2 -1
  58. package/empty/empty.component.d.ts +21 -27
  59. package/fesm2022/ngx-tethys-action.mjs +54 -91
  60. package/fesm2022/ngx-tethys-action.mjs.map +1 -1
  61. package/fesm2022/ngx-tethys-affix.mjs +29 -26
  62. package/fesm2022/ngx-tethys-affix.mjs.map +1 -1
  63. package/fesm2022/ngx-tethys-anchor.mjs +91 -118
  64. package/fesm2022/ngx-tethys-anchor.mjs.map +1 -1
  65. package/fesm2022/ngx-tethys-arrow-switcher.mjs +51 -77
  66. package/fesm2022/ngx-tethys-arrow-switcher.mjs.map +1 -1
  67. package/fesm2022/ngx-tethys-autocomplete.mjs +69 -103
  68. package/fesm2022/ngx-tethys-autocomplete.mjs.map +1 -1
  69. package/fesm2022/ngx-tethys-avatar.mjs +117 -162
  70. package/fesm2022/ngx-tethys-avatar.mjs.map +1 -1
  71. package/fesm2022/ngx-tethys-back-top.mjs +33 -46
  72. package/fesm2022/ngx-tethys-back-top.mjs.map +1 -1
  73. package/fesm2022/ngx-tethys-badge.mjs +104 -208
  74. package/fesm2022/ngx-tethys-badge.mjs.map +1 -1
  75. package/fesm2022/ngx-tethys-breadcrumb.mjs +66 -70
  76. package/fesm2022/ngx-tethys-breadcrumb.mjs.map +1 -1
  77. package/fesm2022/ngx-tethys-calendar.mjs +85 -87
  78. package/fesm2022/ngx-tethys-calendar.mjs.map +1 -1
  79. package/fesm2022/ngx-tethys-card.mjs +72 -77
  80. package/fesm2022/ngx-tethys-card.mjs.map +1 -1
  81. package/fesm2022/ngx-tethys-carousel.mjs +82 -99
  82. package/fesm2022/ngx-tethys-carousel.mjs.map +1 -1
  83. package/fesm2022/ngx-tethys-cascader.mjs +313 -468
  84. package/fesm2022/ngx-tethys-cascader.mjs.map +1 -1
  85. package/fesm2022/ngx-tethys-checkbox.mjs +10 -17
  86. package/fesm2022/ngx-tethys-checkbox.mjs.map +1 -1
  87. package/fesm2022/ngx-tethys-collapse.mjs +66 -71
  88. package/fesm2022/ngx-tethys-collapse.mjs.map +1 -1
  89. package/fesm2022/ngx-tethys-color-picker.mjs +187 -246
  90. package/fesm2022/ngx-tethys-color-picker.mjs.map +1 -1
  91. package/fesm2022/ngx-tethys-comment.mjs +16 -10
  92. package/fesm2022/ngx-tethys-comment.mjs.map +1 -1
  93. package/fesm2022/ngx-tethys-copy.mjs +25 -28
  94. package/fesm2022/ngx-tethys-copy.mjs.map +1 -1
  95. package/fesm2022/ngx-tethys-dialog.mjs +81 -82
  96. package/fesm2022/ngx-tethys-dialog.mjs.map +1 -1
  97. package/fesm2022/ngx-tethys-divider.mjs +49 -58
  98. package/fesm2022/ngx-tethys-divider.mjs.map +1 -1
  99. package/fesm2022/ngx-tethys-dot.mjs +45 -68
  100. package/fesm2022/ngx-tethys-dot.mjs.map +1 -1
  101. package/fesm2022/ngx-tethys-empty.mjs +107 -95
  102. package/fesm2022/ngx-tethys-empty.mjs.map +1 -1
  103. package/fesm2022/ngx-tethys-form.mjs +161 -200
  104. package/fesm2022/ngx-tethys-form.mjs.map +1 -1
  105. package/fesm2022/ngx-tethys-fullscreen.mjs +21 -23
  106. package/fesm2022/ngx-tethys-fullscreen.mjs.map +1 -1
  107. package/fesm2022/ngx-tethys-grid.mjs +160 -152
  108. package/fesm2022/ngx-tethys-grid.mjs.map +1 -1
  109. package/fesm2022/ngx-tethys-i18n.mjs +25 -25
  110. package/fesm2022/ngx-tethys-i18n.mjs.map +1 -1
  111. package/fesm2022/ngx-tethys-input-number.mjs +101 -114
  112. package/fesm2022/ngx-tethys-input-number.mjs.map +1 -1
  113. package/fesm2022/ngx-tethys-input.mjs +268 -271
  114. package/fesm2022/ngx-tethys-input.mjs.map +1 -1
  115. package/fesm2022/ngx-tethys-list.mjs +1 -1
  116. package/fesm2022/ngx-tethys-list.mjs.map +1 -1
  117. package/fesm2022/ngx-tethys-loading.mjs +17 -35
  118. package/fesm2022/ngx-tethys-loading.mjs.map +1 -1
  119. package/fesm2022/ngx-tethys-mention.mjs +52 -74
  120. package/fesm2022/ngx-tethys-mention.mjs.map +1 -1
  121. package/fesm2022/ngx-tethys-menu.mjs +106 -179
  122. package/fesm2022/ngx-tethys-menu.mjs.map +1 -1
  123. package/fesm2022/ngx-tethys-nav.mjs +169 -201
  124. package/fesm2022/ngx-tethys-nav.mjs.map +1 -1
  125. package/fesm2022/ngx-tethys-pagination.mjs +230 -294
  126. package/fesm2022/ngx-tethys-pagination.mjs.map +1 -1
  127. package/fesm2022/ngx-tethys-popover.mjs +67 -70
  128. package/fesm2022/ngx-tethys-popover.mjs.map +1 -1
  129. package/fesm2022/ngx-tethys-progress.mjs +196 -244
  130. package/fesm2022/ngx-tethys-progress.mjs.map +1 -1
  131. package/fesm2022/ngx-tethys-property.mjs +102 -105
  132. package/fesm2022/ngx-tethys-property.mjs.map +1 -1
  133. package/fesm2022/ngx-tethys-radio.mjs +34 -38
  134. package/fesm2022/ngx-tethys-radio.mjs.map +1 -1
  135. package/fesm2022/ngx-tethys-result.mjs +46 -28
  136. package/fesm2022/ngx-tethys-result.mjs.map +1 -1
  137. package/fesm2022/ngx-tethys-skeleton.mjs +339 -342
  138. package/fesm2022/ngx-tethys-skeleton.mjs.map +1 -1
  139. package/fesm2022/ngx-tethys-slider.mjs +75 -108
  140. package/fesm2022/ngx-tethys-slider.mjs.map +1 -1
  141. package/fesm2022/ngx-tethys-space.mjs +26 -46
  142. package/fesm2022/ngx-tethys-space.mjs.map +1 -1
  143. package/fesm2022/ngx-tethys-statistic.mjs +114 -151
  144. package/fesm2022/ngx-tethys-statistic.mjs.map +1 -1
  145. package/fesm2022/ngx-tethys-stepper.mjs +74 -107
  146. package/fesm2022/ngx-tethys-stepper.mjs.map +1 -1
  147. package/fesm2022/ngx-tethys-switch.mjs +80 -140
  148. package/fesm2022/ngx-tethys-switch.mjs.map +1 -1
  149. package/fesm2022/ngx-tethys-table.mjs +1 -1
  150. package/fesm2022/ngx-tethys-table.mjs.map +1 -1
  151. package/fesm2022/ngx-tethys-tabs.mjs +69 -87
  152. package/fesm2022/ngx-tethys-tabs.mjs.map +1 -1
  153. package/fesm2022/ngx-tethys-tag.mjs +42 -64
  154. package/fesm2022/ngx-tethys-tag.mjs.map +1 -1
  155. package/fesm2022/ngx-tethys-timeline.mjs +104 -129
  156. package/fesm2022/ngx-tethys-timeline.mjs.map +1 -1
  157. package/fesm2022/ngx-tethys-typography.mjs +36 -33
  158. package/fesm2022/ngx-tethys-typography.mjs.map +1 -1
  159. package/fesm2022/ngx-tethys-upload.mjs +91 -130
  160. package/fesm2022/ngx-tethys-upload.mjs.map +1 -1
  161. package/fesm2022/ngx-tethys-util.mjs.map +1 -1
  162. package/fesm2022/ngx-tethys-watermark.mjs +36 -40
  163. package/fesm2022/ngx-tethys-watermark.mjs.map +1 -1
  164. package/fesm2022/ngx-tethys.mjs +1 -1
  165. package/fesm2022/ngx-tethys.mjs.map +1 -1
  166. package/form/form-group-error/form-group-error.component.d.ts +2 -3
  167. package/form/form-group-label.directive.d.ts +2 -1
  168. package/form/form-group.component.d.ts +17 -24
  169. package/form/form-submit.directive.d.ts +2 -2
  170. package/form/form.directive.d.ts +6 -8
  171. package/form/from-group-footer/form-group-footer.component.d.ts +2 -2
  172. package/form/validator/confirm-validator.directive.d.ts +2 -2
  173. package/form/validator/unique-validator.directive.d.ts +2 -2
  174. package/fullscreen/fullscreen.component.d.ts +7 -7
  175. package/grid/flex.d.ts +14 -19
  176. package/grid/thy-col.directive.d.ts +6 -9
  177. package/grid/thy-grid-item.component.d.ts +3 -4
  178. package/grid/thy-grid.component.d.ts +11 -12
  179. package/grid/thy-row.directive.d.ts +12 -12
  180. package/icon/icon.component.d.ts +3 -2
  181. package/image/image.directive.d.ts +3 -2
  182. package/input/input-count.component.d.ts +4 -5
  183. package/input/input-group.component.d.ts +20 -20
  184. package/input/input-search.component.d.ts +15 -20
  185. package/input/input.component.d.ts +20 -21
  186. package/input/input.directive.d.ts +4 -6
  187. package/input-number/input-number.component.d.ts +21 -29
  188. package/layout/header.component.d.ts +4 -9
  189. package/layout/sidebar-header.component.d.ts +2 -1
  190. package/layout/sidebar.component.d.ts +8 -7
  191. package/list/list.component.d.ts +2 -1
  192. package/list/selection/selection-list.d.ts +4 -3
  193. package/loading/loading.component.d.ts +4 -10
  194. package/mention/mention.directive.d.ts +6 -7
  195. package/mention/suggestions/suggestions.component.d.ts +8 -9
  196. package/menu/group/menu-group.component.d.ts +16 -33
  197. package/menu/item/action/menu-item-action.component.d.ts +7 -8
  198. package/menu/item/icon/menu-item-icon.component.d.ts +2 -2
  199. package/menu/item/menu-item.component.d.ts +4 -4
  200. package/menu/item/name/menu-item-name.component.d.ts +2 -3
  201. package/menu/menu.component.d.ts +3 -7
  202. package/nav/icon-nav/icon-nav-link.directive.d.ts +3 -7
  203. package/nav/icon-nav/icon-nav.component.d.ts +3 -8
  204. package/nav/nav-ink-bar.directive.d.ts +4 -6
  205. package/nav/nav-item.directive.d.ts +7 -10
  206. package/nav/nav.component.d.ts +20 -48
  207. package/package.json +1 -1
  208. package/pagination/pagination.component.d.ts +48 -109
  209. package/popover/header/popover-header.component.d.ts +7 -6
  210. package/popover/popover.directive.d.ts +11 -18
  211. package/progress/progress-circle.component.d.ts +32 -21
  212. package/progress/progress-strip.component.d.ts +10 -14
  213. package/progress/progress.component.d.ts +15 -23
  214. package/property/examples/single/single.component.scss +6 -0
  215. package/property/properties.component.d.ts +6 -13
  216. package/property/property-item.component.d.ts +21 -26
  217. package/property/styles/properties.scss +124 -52
  218. package/property-operation/property-operation.component.d.ts +6 -5
  219. package/radio/button/radio-button.component.d.ts +2 -2
  220. package/radio/group/radio-group.component.d.ts +8 -7
  221. package/radio/radio.component.d.ts +2 -2
  222. package/radio/radio.token.d.ts +2 -2
  223. package/rate/rate-item.component.d.ts +2 -1
  224. package/rate/rate.component.d.ts +4 -3
  225. package/resizable/resizable.directive.d.ts +4 -9
  226. package/resizable/resize-handle.component.d.ts +2 -1
  227. package/resizable/resize-handles.component.d.ts +2 -1
  228. package/result/result.component.d.ts +9 -10
  229. package/schematics/version.d.ts +1 -1
  230. package/schematics/version.js +1 -1
  231. package/segment/segment-item.component.d.ts +2 -1
  232. package/segment/segment.component.d.ts +2 -1
  233. package/select/custom-select/custom-select.component.d.ts +11 -10
  234. package/select/native-select/native-select.component.d.ts +2 -1
  235. package/shared/base-form-check.component.d.ts +3 -2
  236. package/shared/directives/thy-autofocus.directive.d.ts +3 -2
  237. package/shared/directives/thy-scroll.directive.d.ts +2 -1
  238. package/shared/directives/thy-show.d.ts +2 -1
  239. package/shared/option/group/option-group.component.d.ts +2 -1
  240. package/shared/option/list-option/list-option.component.d.ts +2 -7
  241. package/shared/option/option.component.d.ts +2 -1
  242. package/shared/select/select-control/select-control.component.d.ts +7 -6
  243. package/skeleton/skeleton-circle.component.d.ts +16 -19
  244. package/skeleton/skeleton-rectangle.component.d.ts +20 -23
  245. package/skeleton/skeleton.component.d.ts +5 -6
  246. package/skeleton/stylized/bullet-list.component.d.ts +11 -13
  247. package/skeleton/stylized/list.component.d.ts +10 -12
  248. package/skeleton/stylized/paragraph.component.d.ts +12 -14
  249. package/slide/slide-body/slide-body-section.component.d.ts +2 -1
  250. package/slider/slider.component.d.ts +17 -24
  251. package/space/space.component.d.ts +8 -8
  252. package/statistic/statistic.component.d.ts +35 -40
  253. package/stepper/step-header.component.d.ts +6 -10
  254. package/stepper/step.component.d.ts +6 -6
  255. package/stepper/stepper.component.d.ts +15 -20
  256. package/switch/switch.component.d.ts +24 -35
  257. package/table/table-column.component.d.ts +6 -5
  258. package/table/table-skeleton.component.d.ts +3 -10
  259. package/table/table.component.d.ts +11 -10
  260. package/tabs/tab-content.component.d.ts +4 -4
  261. package/tabs/tab.component.d.ts +4 -5
  262. package/tabs/tabs.component.d.ts +13 -15
  263. package/tag/tag.component.d.ts +10 -16
  264. package/time-picker/time-picker-panel.component.d.ts +3 -2
  265. package/time-picker/time-picker.component.d.ts +6 -5
  266. package/timeline/timeline-item.component.d.ts +9 -13
  267. package/timeline/timeline.component.d.ts +13 -17
  268. package/tooltip/tooltip.directive.d.ts +3 -2
  269. package/tree/tree-node.component.d.ts +6 -15
  270. package/tree/tree.component.d.ts +8 -7
  271. package/tree-select/tree-select.component.d.ts +8 -7
  272. package/typography/bg-color.directive.d.ts +3 -3
  273. package/typography/text/text.component.d.ts +2 -2
  274. package/typography/text-color.directive.d.ts +3 -3
  275. package/upload/file-drop.directive.d.ts +9 -11
  276. package/upload/file-select-base.d.ts +6 -10
  277. package/upload/file-select.component.d.ts +10 -20
  278. package/util/helpers/helpers.d.ts +2 -1
  279. package/vote/vote.component.d.ts +4 -3
  280. package/watermark/watermark.directive.d.ts +7 -9
@@ -1,5 +1,5 @@
1
1
  import * as i0 from '@angular/core';
2
- import { Input, ViewChild, ContentChild, ChangeDetectionStrategy, Component, ViewEncapsulation, inject, ChangeDetectorRef, ElementRef, QueryList, DestroyRef, EventEmitter, Output, ContentChildren, NgModule } from '@angular/core';
2
+ import { input, ViewChild, ContentChild, ChangeDetectionStrategy, Component, ViewEncapsulation, inject, ChangeDetectorRef, ElementRef, QueryList, DestroyRef, output, effect, ContentChildren, NgModule } from '@angular/core';
3
3
  import { NgTemplateOutlet, CommonModule } from '@angular/common';
4
4
  import { coerceBooleanProperty, isString } from 'ngx-tethys/util';
5
5
  import { fromEvent } from 'rxjs';
@@ -12,10 +12,24 @@ import { ThyIconModule } from 'ngx-tethys/icon';
12
12
  * @name thy-tab
13
13
  */
14
14
  class ThyTab {
15
- constructor() { }
15
+ constructor() {
16
+ /**
17
+ * 选项标题
18
+ */
19
+ this.thyTitle = input(undefined);
20
+ /**
21
+ * 选项的唯一标识
22
+ */
23
+ this.id = input(undefined);
24
+ /**
25
+ * 是否禁用选项
26
+ * @default false
27
+ */
28
+ this.thyDisabled = input(false, { transform: coerceBooleanProperty });
29
+ }
16
30
  ngOnInit() { }
17
31
  static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.8", ngImport: i0, type: ThyTab, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
18
- static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "16.1.0", version: "19.2.8", type: ThyTab, isStandalone: true, selector: "thy-tab", inputs: { thyTitle: "thyTitle", id: "id", thyDisabled: ["thyDisabled", "thyDisabled", coerceBooleanProperty] }, queries: [{ propertyName: "titleTemplateRef", first: true, predicate: ["title"], descendants: true }], viewQueries: [{ propertyName: "content", first: true, predicate: ["content"], descendants: true, static: true }], ngImport: i0, template: ` <ng-template #content><ng-content></ng-content></ng-template> `, isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
32
+ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "19.2.8", type: ThyTab, isStandalone: true, selector: "thy-tab", inputs: { thyTitle: { classPropertyName: "thyTitle", publicName: "thyTitle", isSignal: true, isRequired: false, transformFunction: null }, id: { classPropertyName: "id", publicName: "id", isSignal: true, isRequired: false, transformFunction: null }, thyDisabled: { classPropertyName: "thyDisabled", publicName: "thyDisabled", isSignal: true, isRequired: false, transformFunction: null } }, queries: [{ propertyName: "titleTemplateRef", first: true, predicate: ["title"], descendants: true }], viewQueries: [{ propertyName: "content", first: true, predicate: ["content"], descendants: true, static: true }], ngImport: i0, template: ` <ng-template #content><ng-content></ng-content></ng-template> `, isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
19
33
  }
20
34
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.8", ngImport: i0, type: ThyTab, decorators: [{
21
35
  type: Component,
@@ -30,13 +44,6 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.8", ngImpor
30
44
  }], content: [{
31
45
  type: ViewChild,
32
46
  args: ['content', { static: true }]
33
- }], thyTitle: [{
34
- type: Input
35
- }], id: [{
36
- type: Input
37
- }], thyDisabled: [{
38
- type: Input,
39
- args: [{ transform: coerceBooleanProperty }]
40
47
  }] } });
41
48
 
42
49
  /**
@@ -44,14 +51,14 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.8", ngImpor
44
51
  */
45
52
  class ThyTabContent {
46
53
  constructor() {
47
- this.content = null;
48
- this.active = false;
49
- this.tabPaneAnimated = true;
54
+ this.content = input(null);
55
+ this.active = input(false, { transform: coerceBooleanProperty });
56
+ this.tabPaneAnimated = input(true, { transform: coerceBooleanProperty });
50
57
  }
51
58
  static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.8", ngImport: i0, type: ThyTabContent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
52
- static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.8", type: ThyTabContent, isStandalone: true, selector: "thy-tab-content, [thyTabContent]", inputs: { content: "content", active: "active", tabPaneAnimated: "tabPaneAnimated" }, host: { properties: { "attr.aria-hidden": "!active", "attr.tabindex": "active ? 0 : -1", "style.visibility": "tabPaneAnimated ? active ? null : \"hidden\" : null", "style.height": "tabPaneAnimated ? active ? null : 0 : null", "style.overflow-y": "tabPaneAnimated ? active ? null : \"none\" : null", "style.display": "!tabPaneAnimated ? active ? null : \"none\" : null" }, classAttribute: "thy-tab-content" }, exportAs: ["thyTabContent"], ngImport: i0, template: `
53
- @if (active) {
54
- <ng-template [ngTemplateOutlet]="content"></ng-template>
59
+ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.8", type: ThyTabContent, isStandalone: true, selector: "thy-tab-content, [thyTabContent]", inputs: { content: { classPropertyName: "content", publicName: "content", isSignal: true, isRequired: false, transformFunction: null }, active: { classPropertyName: "active", publicName: "active", isSignal: true, isRequired: false, transformFunction: null }, tabPaneAnimated: { classPropertyName: "tabPaneAnimated", publicName: "tabPaneAnimated", isSignal: true, isRequired: false, transformFunction: null } }, host: { properties: { "attr.aria-hidden": "!active()", "attr.tabindex": "active() ? 0 : -1", "style.visibility": "tabPaneAnimated() ? active() ? null : \"hidden\" : null", "style.height": "tabPaneAnimated() ? active() ? null : 0 : null", "style.overflow-y": "tabPaneAnimated() ? active() ? null : \"none\" : null", "style.display": "!tabPaneAnimated() ? active() ? null : \"none\" : null" }, classAttribute: "thy-tab-content" }, exportAs: ["thyTabContent"], ngImport: i0, template: `
60
+ @if (active()) {
61
+ <ng-template [ngTemplateOutlet]="content()"></ng-template>
55
62
  }
56
63
  `, isInline: true, dependencies: [{ kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
57
64
  }
@@ -64,28 +71,22 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.8", ngImpor
64
71
  encapsulation: ViewEncapsulation.None,
65
72
  changeDetection: ChangeDetectionStrategy.OnPush,
66
73
  template: `
67
- @if (active) {
68
- <ng-template [ngTemplateOutlet]="content"></ng-template>
74
+ @if (active()) {
75
+ <ng-template [ngTemplateOutlet]="content()"></ng-template>
69
76
  }
70
77
  `,
71
78
  host: {
72
79
  class: 'thy-tab-content',
73
- '[attr.aria-hidden]': '!active',
74
- '[attr.tabindex]': 'active ? 0 : -1',
75
- '[style.visibility]': 'tabPaneAnimated ? active ? null : "hidden" : null',
76
- '[style.height]': 'tabPaneAnimated ? active ? null : 0 : null',
77
- '[style.overflow-y]': 'tabPaneAnimated ? active ? null : "none" : null',
78
- '[style.display]': '!tabPaneAnimated ? active ? null : "none" : null'
80
+ '[attr.aria-hidden]': '!active()',
81
+ '[attr.tabindex]': 'active() ? 0 : -1',
82
+ '[style.visibility]': 'tabPaneAnimated() ? active() ? null : "hidden" : null',
83
+ '[style.height]': 'tabPaneAnimated() ? active() ? null : 0 : null',
84
+ '[style.overflow-y]': 'tabPaneAnimated() ? active() ? null : "none" : null',
85
+ '[style.display]': '!tabPaneAnimated() ? active() ? null : "none" : null'
79
86
  },
80
87
  imports: [NgTemplateOutlet]
81
88
  }]
82
- }], propDecorators: { content: [{
83
- type: Input
84
- }], active: [{
85
- type: Input
86
- }], tabPaneAnimated: [{
87
- type: Input
88
- }] } });
89
+ }] });
89
90
 
90
91
  /**
91
92
  * 选项卡切换组件
@@ -101,44 +102,50 @@ class ThyTabs {
101
102
  * 标签类型
102
103
  * @type 'pulled' | 'tabs' | 'pills' | 'lite'
103
104
  */
104
- this.thyType = 'tabs';
105
+ this.thyType = input('tabs');
105
106
  /**
106
107
  * 选项卡的大小
107
108
  * @type 'lg' | 'md' | 'sm'
108
109
  */
109
- this.thySize = 'md';
110
+ this.thySize = input('md');
111
+ /**
112
+ * 激活的项
113
+ */
114
+ this.thyActiveTab = input(0);
115
+ /**
116
+ * 附加操作
117
+ */
118
+ this.thyExtra = input(undefined);
110
119
  /**
111
120
  * 选项卡的位置
112
121
  * @type 'top' | 'left'
113
122
  */
114
- this.thyPosition = 'top';
123
+ this.thyPosition = input('top');
115
124
  /**
116
125
  * 是否使用动画切换 Tabs
117
126
  */
118
- this.thyAnimated = false;
127
+ this.thyAnimated = input(false, { transform: coerceBooleanProperty });
119
128
  /**
120
129
  * 响应式,自动计算宽度存放 thyNavItem,并添加更多弹框
121
130
  */
122
- this.thyResponsive = false;
131
+ this.thyResponsive = input(false, { transform: coerceBooleanProperty });
123
132
  /**
124
133
  * 激活的项发生改变时的回调
125
134
  */
126
- this.thyActiveTabChange = new EventEmitter();
135
+ this.thyActiveTabChange = output();
127
136
  this.activeTabIndex = 0;
128
137
  this.transitionStarted = false;
129
- }
130
- /**
131
- * 激活的项
132
- */
133
- set thyActiveTab(value) {
134
- if (isString(value)) {
135
- this.activeTabId = value;
136
- this.activeTabIndex = undefined;
137
- }
138
- else {
139
- this.activeTabIndex = value;
140
- this.activeTabId = undefined;
141
- }
138
+ effect(() => {
139
+ const value = this.thyActiveTab();
140
+ if (isString(value)) {
141
+ this.activeTabId = value;
142
+ this.activeTabIndex = undefined;
143
+ }
144
+ else {
145
+ this.activeTabIndex = value;
146
+ this.activeTabId = undefined;
147
+ }
148
+ });
142
149
  }
143
150
  ngOnInit() {
144
151
  const tabsContent = this.el.nativeElement.querySelector('.thy-tabs-content');
@@ -149,23 +156,15 @@ class ThyTabs {
149
156
  this.cd.markForCheck();
150
157
  });
151
158
  }
152
- ngOnChanges(changes) {
153
- const { thyActiveTab } = changes;
154
- if (thyActiveTab && !thyActiveTab.firstChange && this.thyAnimated) {
155
- const index = thyActiveTab?.currentValue?.index || Array.from(this.tabs).findIndex(k => k.id === thyActiveTab?.currentValue.id);
156
- this.transitionStarted = this.activeTabIndex !== index;
157
- this.activeTabIndex = index;
158
- }
159
- }
160
159
  ngAfterContentInit() {
161
160
  this.tabs.changes.pipe(takeUntilDestroyed(this.destroyRef)).subscribe(data => {
162
- this.thyAnimated && (this.transitionStarted = true);
161
+ this.thyAnimated() && (this.transitionStarted = true);
163
162
  this.activeTabIndex = data.length - 1;
164
163
  this.cd.markForCheck();
165
164
  });
166
165
  }
167
166
  get tabPaneAnimated() {
168
- return this.thyPosition === 'top' && this.thyAnimated;
167
+ return this.thyPosition() === 'top' && this.thyAnimated();
169
168
  }
170
169
  getTabContentMarginLeft() {
171
170
  if (this.tabPaneAnimated) {
@@ -174,47 +173,30 @@ class ThyTabs {
174
173
  return '';
175
174
  }
176
175
  activeTab(tab, index) {
177
- if (tab.thyDisabled) {
176
+ if (tab.thyDisabled()) {
178
177
  return;
179
178
  }
180
- this.activeTabId = tab.id || null;
181
- this.thyAnimated && (this.transitionStarted = this.activeTabIndex !== index);
179
+ this.activeTabId = tab.id() || null;
180
+ this.thyAnimated() && (this.transitionStarted = this.activeTabIndex !== index);
182
181
  this.activeTabIndex = index;
183
- const activeTab = tab.id ? tab.id : index;
182
+ const id = tab.id();
183
+ const activeTab = id ? id : index;
184
184
  this.thyActiveTabChange.emit(activeTab);
185
185
  }
186
186
  static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.8", ngImport: i0, type: ThyTabs, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
187
- static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.8", type: ThyTabs, isStandalone: true, selector: "thy-tabs", inputs: { thyType: "thyType", thySize: "thySize", thyActiveTab: "thyActiveTab", thyExtra: "thyExtra", thyPosition: "thyPosition", thyAnimated: ["thyAnimated", "thyAnimated", coerceBooleanProperty], thyResponsive: ["thyResponsive", "thyResponsive", coerceBooleanProperty] }, outputs: { thyActiveTabChange: "thyActiveTabChange" }, host: { properties: { "class.thy-tabs-top": "thyPosition === 'top'", "class.thy-tabs-left": "thyPosition === 'left'", "style.overflow": "transitionStarted ? \"hidden\" : null" }, classAttribute: "thy-tabs" }, queries: [{ propertyName: "tabs", predicate: ThyTab, descendants: true }], usesOnChanges: true, ngImport: i0, template: "<!-- tabs nav -->\n<thy-nav\n class=\"thy-tabs-nav\"\n [thyType]=\"thyType\"\n [thySize]=\"thySize\"\n [thyExtra]=\"thyExtra\"\n [thyVertical]=\"thyPosition === 'left'\"\n [thyResponsive]=\"thyResponsive\">\n @for (tab of tabs; track $index; let i = $index) {\n <a\n href=\"javascript:;\"\n thyNavItem\n [id]=\"tab.id\"\n [thyNavItemDisabled]=\"tab.thyDisabled\"\n [thyNavItemActive]=\"(tab.id && activeTabId && tab.id === activeTabId) ?? i === activeTabIndex\"\n (click)=\"activeTab(tab, i)\">\n @if (tab.titleTemplateRef) {\n <ng-template [ngTemplateOutlet]=\"tab.titleTemplateRef\"></ng-template>\n } @else {\n {{ tab.thyTitle }}\n }\n </a>\n }\n</thy-nav>\n<!-- tabs content -->\n<div class=\"thy-tabs-content\" [class.thy-tabs-content-animated]=\"tabPaneAnimated\" [style.margin-left]=\"getTabContentMarginLeft()\">\n @for (tab of tabs; track $index; let i = $index) {\n <div\n thyTabContent\n [active]=\"(tab.id && activeTabId && tab.id === activeTabId) ?? i === activeTabIndex\"\n [content]=\"tab.content\"\n [tabPaneAnimated]=\"tabPaneAnimated\"></div>\n }\n</div>\n", dependencies: [{ kind: "component", type: ThyNav, selector: "thy-nav", inputs: ["thyType", "thySize", "thyHorizontal", "thyVertical", "thyFill", "thyResponsive", "thyPauseReCalculate", "thyInsideClosable", "thyPopoverOptions", "thyExtra"] }, { kind: "directive", type: ThyNavItemDirective, selector: "[thyNavLink],[thyNavItem]", inputs: ["id", "thyNavItemActive", "thyNavLinkActive", "thyNavItemDisabled"] }, { kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: ThyTabContent, selector: "thy-tab-content, [thyTabContent]", inputs: ["content", "active", "tabPaneAnimated"], exportAs: ["thyTabContent"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
187
+ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.8", type: ThyTabs, isStandalone: true, selector: "thy-tabs", inputs: { thyType: { classPropertyName: "thyType", publicName: "thyType", isSignal: true, isRequired: false, transformFunction: null }, thySize: { classPropertyName: "thySize", publicName: "thySize", isSignal: true, isRequired: false, transformFunction: null }, thyActiveTab: { classPropertyName: "thyActiveTab", publicName: "thyActiveTab", isSignal: true, isRequired: false, transformFunction: null }, thyExtra: { classPropertyName: "thyExtra", publicName: "thyExtra", isSignal: true, isRequired: false, transformFunction: null }, thyPosition: { classPropertyName: "thyPosition", publicName: "thyPosition", isSignal: true, isRequired: false, transformFunction: null }, thyAnimated: { classPropertyName: "thyAnimated", publicName: "thyAnimated", isSignal: true, isRequired: false, transformFunction: null }, thyResponsive: { classPropertyName: "thyResponsive", publicName: "thyResponsive", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { thyActiveTabChange: "thyActiveTabChange" }, host: { properties: { "class.thy-tabs-top": "thyPosition() === 'top'", "class.thy-tabs-left": "thyPosition() === 'left'", "style.overflow": "transitionStarted ? \"hidden\" : null" }, classAttribute: "thy-tabs" }, queries: [{ propertyName: "tabs", predicate: ThyTab, descendants: true }], ngImport: i0, template: "<!-- tabs nav -->\n<thy-nav\n class=\"thy-tabs-nav\"\n [thyType]=\"thyType()\"\n [thySize]=\"thySize()\"\n [thyExtra]=\"thyExtra()\"\n [thyVertical]=\"thyPosition() === 'left'\"\n [thyResponsive]=\"thyResponsive()\">\n @for (tab of tabs; track $index; let i = $index) {\n <a\n href=\"javascript:;\"\n thyNavItem\n [id]=\"tab.id()\"\n [thyNavItemDisabled]=\"tab.thyDisabled()\"\n [thyNavItemActive]=\"(tab.id() && activeTabId && tab.id() === activeTabId) ?? i === activeTabIndex\"\n (click)=\"activeTab(tab, i)\">\n @if (tab.titleTemplateRef) {\n <ng-template [ngTemplateOutlet]=\"tab.titleTemplateRef\"></ng-template>\n } @else {\n {{ tab.thyTitle() }}\n }\n </a>\n }\n</thy-nav>\n<!-- tabs content -->\n<div class=\"thy-tabs-content\" [class.thy-tabs-content-animated]=\"tabPaneAnimated\" [style.margin-left]=\"getTabContentMarginLeft()\">\n @for (tab of tabs; track $index; let i = $index) {\n <div\n thyTabContent\n [active]=\"(tab.id() && activeTabId && tab.id() === activeTabId) ?? i === activeTabIndex\"\n [content]=\"tab.content\"\n [tabPaneAnimated]=\"tabPaneAnimated\"></div>\n }\n</div>\n", dependencies: [{ kind: "component", type: ThyNav, selector: "thy-nav", inputs: ["thyType", "thySize", "thyHorizontal", "thyVertical", "thyFill", "thyResponsive", "thyPauseReCalculate", "thyInsideClosable", "thyPopoverOptions", "thyExtra"] }, { kind: "directive", type: ThyNavItemDirective, selector: "[thyNavLink],[thyNavItem]", inputs: ["id", "thyNavItemActive", "thyNavLinkActive", "thyNavItemDisabled"] }, { kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: ThyTabContent, selector: "thy-tab-content, [thyTabContent]", inputs: ["content", "active", "tabPaneAnimated"], exportAs: ["thyTabContent"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
188
188
  }
189
189
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.8", ngImport: i0, type: ThyTabs, decorators: [{
190
190
  type: Component,
191
191
  args: [{ selector: 'thy-tabs', changeDetection: ChangeDetectionStrategy.OnPush, host: {
192
192
  class: 'thy-tabs',
193
- '[class.thy-tabs-top]': `thyPosition === 'top'`,
194
- '[class.thy-tabs-left]': `thyPosition === 'left'`,
193
+ '[class.thy-tabs-top]': `thyPosition() === 'top'`,
194
+ '[class.thy-tabs-left]': `thyPosition() === 'left'`,
195
195
  '[style.overflow]': `transitionStarted ? "hidden" : null`
196
- }, imports: [ThyNav, ThyNavItemDirective, NgTemplateOutlet, ThyTabContent], template: "<!-- tabs nav -->\n<thy-nav\n class=\"thy-tabs-nav\"\n [thyType]=\"thyType\"\n [thySize]=\"thySize\"\n [thyExtra]=\"thyExtra\"\n [thyVertical]=\"thyPosition === 'left'\"\n [thyResponsive]=\"thyResponsive\">\n @for (tab of tabs; track $index; let i = $index) {\n <a\n href=\"javascript:;\"\n thyNavItem\n [id]=\"tab.id\"\n [thyNavItemDisabled]=\"tab.thyDisabled\"\n [thyNavItemActive]=\"(tab.id && activeTabId && tab.id === activeTabId) ?? i === activeTabIndex\"\n (click)=\"activeTab(tab, i)\">\n @if (tab.titleTemplateRef) {\n <ng-template [ngTemplateOutlet]=\"tab.titleTemplateRef\"></ng-template>\n } @else {\n {{ tab.thyTitle }}\n }\n </a>\n }\n</thy-nav>\n<!-- tabs content -->\n<div class=\"thy-tabs-content\" [class.thy-tabs-content-animated]=\"tabPaneAnimated\" [style.margin-left]=\"getTabContentMarginLeft()\">\n @for (tab of tabs; track $index; let i = $index) {\n <div\n thyTabContent\n [active]=\"(tab.id && activeTabId && tab.id === activeTabId) ?? i === activeTabIndex\"\n [content]=\"tab.content\"\n [tabPaneAnimated]=\"tabPaneAnimated\"></div>\n }\n</div>\n" }]
197
- }], propDecorators: { tabs: [{
196
+ }, imports: [ThyNav, ThyNavItemDirective, NgTemplateOutlet, ThyTabContent], template: "<!-- tabs nav -->\n<thy-nav\n class=\"thy-tabs-nav\"\n [thyType]=\"thyType()\"\n [thySize]=\"thySize()\"\n [thyExtra]=\"thyExtra()\"\n [thyVertical]=\"thyPosition() === 'left'\"\n [thyResponsive]=\"thyResponsive()\">\n @for (tab of tabs; track $index; let i = $index) {\n <a\n href=\"javascript:;\"\n thyNavItem\n [id]=\"tab.id()\"\n [thyNavItemDisabled]=\"tab.thyDisabled()\"\n [thyNavItemActive]=\"(tab.id() && activeTabId && tab.id() === activeTabId) ?? i === activeTabIndex\"\n (click)=\"activeTab(tab, i)\">\n @if (tab.titleTemplateRef) {\n <ng-template [ngTemplateOutlet]=\"tab.titleTemplateRef\"></ng-template>\n } @else {\n {{ tab.thyTitle() }}\n }\n </a>\n }\n</thy-nav>\n<!-- tabs content -->\n<div class=\"thy-tabs-content\" [class.thy-tabs-content-animated]=\"tabPaneAnimated\" [style.margin-left]=\"getTabContentMarginLeft()\">\n @for (tab of tabs; track $index; let i = $index) {\n <div\n thyTabContent\n [active]=\"(tab.id() && activeTabId && tab.id() === activeTabId) ?? i === activeTabIndex\"\n [content]=\"tab.content\"\n [tabPaneAnimated]=\"tabPaneAnimated\"></div>\n }\n</div>\n" }]
197
+ }], ctorParameters: () => [], propDecorators: { tabs: [{
198
198
  type: ContentChildren,
199
199
  args: [ThyTab, { descendants: true }]
200
- }], thyType: [{
201
- type: Input
202
- }], thySize: [{
203
- type: Input
204
- }], thyActiveTab: [{
205
- type: Input
206
- }], thyExtra: [{
207
- type: Input
208
- }], thyPosition: [{
209
- type: Input
210
- }], thyAnimated: [{
211
- type: Input,
212
- args: [{ transform: coerceBooleanProperty }]
213
- }], thyResponsive: [{
214
- type: Input,
215
- args: [{ transform: coerceBooleanProperty }]
216
- }], thyActiveTabChange: [{
217
- type: Output
218
200
  }] } });
219
201
 
220
202
  class ThyTabsModule {
@@ -1 +1 @@
1
- {"version":3,"file":"ngx-tethys-tabs.mjs","sources":["../../../src/tabs/tab.component.ts","../../../src/tabs/tab-content.component.ts","../../../src/tabs/tabs.component.ts","../../../src/tabs/tabs.component.html","../../../src/tabs/tabs.module.ts","../../../src/tabs/ngx-tethys-tabs.ts"],"sourcesContent":["import { Component, OnInit, ChangeDetectionStrategy, Input, ViewChild, TemplateRef, ContentChild } from '@angular/core';\nimport { coerceBooleanProperty } from 'ngx-tethys/util';\n\n/**\n * 选项卡的选项组件\n * @name thy-tab\n */\n@Component({\n selector: 'thy-tab',\n template: ` <ng-template #content><ng-content></ng-content></ng-template> `,\n changeDetection: ChangeDetectionStrategy.OnPush\n})\nexport class ThyTab implements OnInit {\n /**\n * 自定义选项标题的模板\n * @type TemplateRef\n */\n @ContentChild('title') titleTemplateRef: TemplateRef<unknown>;\n\n @ViewChild('content', { static: true }) content: TemplateRef<HTMLElement>;\n\n /**\n * 选项标题\n */\n @Input() thyTitle: string;\n\n /**\n * 选项的唯一标识\n */\n @Input() id: string;\n\n /**\n * 是否禁用选项\n * @default false\n */\n @Input({ transform: coerceBooleanProperty }) thyDisabled: boolean;\n\n constructor() {}\n\n ngOnInit(): void {}\n}\n","import { ChangeDetectionStrategy, Component, Input, TemplateRef, ViewEncapsulation } from '@angular/core';\nimport { NgTemplateOutlet } from '@angular/common';\n\n/**\n * @private\n */\n@Component({\n selector: 'thy-tab-content, [thyTabContent]',\n exportAs: 'thyTabContent',\n preserveWhitespaces: false,\n encapsulation: ViewEncapsulation.None,\n changeDetection: ChangeDetectionStrategy.OnPush,\n template: `\n @if (active) {\n <ng-template [ngTemplateOutlet]=\"content\"></ng-template>\n }\n `,\n host: {\n class: 'thy-tab-content',\n '[attr.aria-hidden]': '!active',\n '[attr.tabindex]': 'active ? 0 : -1',\n '[style.visibility]': 'tabPaneAnimated ? active ? null : \"hidden\" : null',\n '[style.height]': 'tabPaneAnimated ? active ? null : 0 : null',\n '[style.overflow-y]': 'tabPaneAnimated ? active ? null : \"none\" : null',\n '[style.display]': '!tabPaneAnimated ? active ? null : \"none\" : null'\n },\n imports: [NgTemplateOutlet]\n})\nexport class ThyTabContent {\n @Input() content: TemplateRef<void> | null = null;\n\n @Input() active = false;\n\n @Input() tabPaneAnimated = true;\n}\n","import {\n AfterContentInit,\n ChangeDetectionStrategy,\n ChangeDetectorRef,\n Component,\n ContentChildren,\n DestroyRef,\n ElementRef,\n EventEmitter,\n Input,\n OnChanges,\n OnInit,\n Output,\n QueryList,\n SimpleChanges,\n TemplateRef,\n inject\n} from '@angular/core';\nimport { coerceBooleanProperty, isString } from 'ngx-tethys/util';\nimport { fromEvent } from 'rxjs';\nimport { takeUntilDestroyed } from '@angular/core/rxjs-interop';\nimport { ThyTab } from './tab.component';\nimport { ThyActiveTabInfo, ThyTabActiveEvent } from './types';\nimport { ThyTabContent } from './tab-content.component';\nimport { NgTemplateOutlet } from '@angular/common';\nimport { ThyNav, ThyNavItemDirective } from 'ngx-tethys/nav';\n\nexport type ThyTabsSize = 'lg' | 'md' | 'sm';\n\nexport type ThyTabsType = 'pulled' | 'tabs' | 'pills' | 'lite';\n\nexport type ThyTabsPosition = 'top' | 'left';\n\n/**\n * 选项卡切换组件\n * @name thy-tabs\n */\n@Component({\n selector: 'thy-tabs',\n templateUrl: './tabs.component.html',\n changeDetection: ChangeDetectionStrategy.OnPush,\n host: {\n class: 'thy-tabs',\n '[class.thy-tabs-top]': `thyPosition === 'top'`,\n '[class.thy-tabs-left]': `thyPosition === 'left'`,\n '[style.overflow]': `transitionStarted ? \"hidden\" : null`\n },\n imports: [ThyNav, ThyNavItemDirective, NgTemplateOutlet, ThyTabContent]\n})\nexport class ThyTabs implements OnInit, OnChanges, AfterContentInit {\n private cd = inject(ChangeDetectorRef);\n private el = inject(ElementRef);\n\n @ContentChildren(ThyTab, { descendants: true }) tabs = new QueryList<ThyTab>();\n\n private readonly destroyRef = inject(DestroyRef);\n\n /**\n * 标签类型\n * @type 'pulled' | 'tabs' | 'pills' | 'lite'\n */\n @Input() thyType: ThyTabsType = 'tabs';\n\n /**\n * 选项卡的大小\n * @type 'lg' | 'md' | 'sm'\n */\n @Input() thySize: ThyTabsSize = 'md';\n\n /**\n * 激活的项\n */\n @Input()\n set thyActiveTab(value: ThyActiveTabInfo) {\n if (isString(value)) {\n this.activeTabId = value;\n this.activeTabIndex = undefined;\n } else {\n this.activeTabIndex = value;\n this.activeTabId = undefined;\n }\n }\n\n /**\n * 附加操作\n */\n @Input() thyExtra: TemplateRef<unknown>;\n\n /**\n * 选项卡的位置\n * @type 'top' | 'left'\n */\n @Input() thyPosition: ThyTabsPosition = 'top';\n\n /**\n * 是否使用动画切换 Tabs\n */\n @Input({ transform: coerceBooleanProperty }) thyAnimated: boolean = false;\n\n /**\n * 响应式,自动计算宽度存放 thyNavItem,并添加更多弹框\n */\n @Input({ transform: coerceBooleanProperty }) thyResponsive: boolean = false;\n\n /**\n * 激活的项发生改变时的回调\n */\n @Output() thyActiveTabChange: EventEmitter<ThyTabActiveEvent> = new EventEmitter<ThyTabActiveEvent>();\n\n activeTabIndex: number = 0;\n\n activeTabId: string;\n\n transitionStarted: boolean = false;\n\n ngOnInit(): void {\n const tabsContent = this.el.nativeElement.querySelector('.thy-tabs-content');\n fromEvent(tabsContent, 'transitionend')\n .pipe(takeUntilDestroyed(this.destroyRef))\n .subscribe(() => {\n this.transitionStarted = false;\n this.cd.markForCheck();\n });\n }\n\n ngOnChanges(changes: SimpleChanges): void {\n const { thyActiveTab } = changes;\n if (thyActiveTab && !thyActiveTab.firstChange && this.thyAnimated) {\n const index = thyActiveTab?.currentValue?.index || Array.from(this.tabs).findIndex(k => k.id === thyActiveTab?.currentValue.id);\n this.transitionStarted = this.activeTabIndex !== index;\n this.activeTabIndex = index;\n }\n }\n\n ngAfterContentInit() {\n this.tabs.changes.pipe(takeUntilDestroyed(this.destroyRef)).subscribe(data => {\n this.thyAnimated && (this.transitionStarted = true);\n this.activeTabIndex = data.length - 1;\n this.cd.markForCheck();\n });\n }\n\n get tabPaneAnimated(): boolean {\n return this.thyPosition === 'top' && this.thyAnimated;\n }\n\n getTabContentMarginLeft(): string {\n if (this.tabPaneAnimated) {\n return `${-(this.activeTabIndex || 0) * 100}%`;\n }\n return '';\n }\n\n activeTab(tab: ThyTab, index: number) {\n if (tab.thyDisabled) {\n return;\n }\n this.activeTabId = tab.id || null;\n this.thyAnimated && (this.transitionStarted = this.activeTabIndex !== index);\n this.activeTabIndex = index;\n const activeTab = tab.id ? tab.id : index;\n this.thyActiveTabChange.emit(activeTab);\n }\n}\n","<!-- tabs nav -->\n<thy-nav\n class=\"thy-tabs-nav\"\n [thyType]=\"thyType\"\n [thySize]=\"thySize\"\n [thyExtra]=\"thyExtra\"\n [thyVertical]=\"thyPosition === 'left'\"\n [thyResponsive]=\"thyResponsive\">\n @for (tab of tabs; track $index; let i = $index) {\n <a\n href=\"javascript:;\"\n thyNavItem\n [id]=\"tab.id\"\n [thyNavItemDisabled]=\"tab.thyDisabled\"\n [thyNavItemActive]=\"(tab.id && activeTabId && tab.id === activeTabId) ?? i === activeTabIndex\"\n (click)=\"activeTab(tab, i)\">\n @if (tab.titleTemplateRef) {\n <ng-template [ngTemplateOutlet]=\"tab.titleTemplateRef\"></ng-template>\n } @else {\n {{ tab.thyTitle }}\n }\n </a>\n }\n</thy-nav>\n<!-- tabs content -->\n<div class=\"thy-tabs-content\" [class.thy-tabs-content-animated]=\"tabPaneAnimated\" [style.margin-left]=\"getTabContentMarginLeft()\">\n @for (tab of tabs; track $index; let i = $index) {\n <div\n thyTabContent\n [active]=\"(tab.id && activeTabId && tab.id === activeTabId) ?? i === activeTabIndex\"\n [content]=\"tab.content\"\n [tabPaneAnimated]=\"tabPaneAnimated\"></div>\n }\n</div>\n","import { NgModule } from '@angular/core';\nimport { CommonModule } from '@angular/common';\nimport { ThyTabs } from './tabs.component';\nimport { ThyTab } from './tab.component';\nimport { ThyIconModule } from 'ngx-tethys/icon';\nimport { ThyNavModule } from 'ngx-tethys/nav';\nimport { ThyTabContent } from './tab-content.component';\n\n@NgModule({\n imports: [CommonModule, ThyIconModule, ThyNavModule, ThyTabs, ThyTab, ThyTabContent],\n exports: [ThyTabs, ThyTab]\n})\nexport class ThyTabsModule {}\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":[],"mappings":"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"}
1
+ {"version":3,"file":"ngx-tethys-tabs.mjs","sources":["../../../src/tabs/tab.component.ts","../../../src/tabs/tab-content.component.ts","../../../src/tabs/tabs.component.ts","../../../src/tabs/tabs.component.html","../../../src/tabs/tabs.module.ts","../../../src/tabs/ngx-tethys-tabs.ts"],"sourcesContent":["import { Component, OnInit, ChangeDetectionStrategy, ViewChild, TemplateRef, ContentChild, input } from '@angular/core';\nimport { coerceBooleanProperty, ThyBooleanInput } from 'ngx-tethys/util';\n\n/**\n * 选项卡的选项组件\n * @name thy-tab\n */\n@Component({\n selector: 'thy-tab',\n template: ` <ng-template #content><ng-content></ng-content></ng-template> `,\n changeDetection: ChangeDetectionStrategy.OnPush\n})\nexport class ThyTab implements OnInit {\n /**\n * 自定义选项标题的模板\n * @type TemplateRef\n */\n @ContentChild('title') titleTemplateRef: TemplateRef<unknown>;\n\n @ViewChild('content', { static: true }) content: TemplateRef<HTMLElement>;\n\n /**\n * 选项标题\n */\n readonly thyTitle = input<string>(undefined);\n\n /**\n * 选项的唯一标识\n */\n readonly id = input<string>(undefined);\n\n /**\n * 是否禁用选项\n * @default false\n */\n readonly thyDisabled = input<boolean, ThyBooleanInput>(false, { transform: coerceBooleanProperty });\n\n constructor() {}\n\n ngOnInit(): void {}\n}\n","import { ChangeDetectionStrategy, Component, TemplateRef, ViewEncapsulation, input } from '@angular/core';\nimport { NgTemplateOutlet } from '@angular/common';\nimport { coerceBooleanProperty, ThyBooleanInput } from 'ngx-tethys/util';\n\n/**\n * @private\n */\n@Component({\n selector: 'thy-tab-content, [thyTabContent]',\n exportAs: 'thyTabContent',\n preserveWhitespaces: false,\n encapsulation: ViewEncapsulation.None,\n changeDetection: ChangeDetectionStrategy.OnPush,\n template: `\n @if (active()) {\n <ng-template [ngTemplateOutlet]=\"content()\"></ng-template>\n }\n `,\n host: {\n class: 'thy-tab-content',\n '[attr.aria-hidden]': '!active()',\n '[attr.tabindex]': 'active() ? 0 : -1',\n '[style.visibility]': 'tabPaneAnimated() ? active() ? null : \"hidden\" : null',\n '[style.height]': 'tabPaneAnimated() ? active() ? null : 0 : null',\n '[style.overflow-y]': 'tabPaneAnimated() ? active() ? null : \"none\" : null',\n '[style.display]': '!tabPaneAnimated() ? active() ? null : \"none\" : null'\n },\n imports: [NgTemplateOutlet]\n})\nexport class ThyTabContent {\n readonly content = input<TemplateRef<void> | null>(null);\n\n readonly active = input<boolean, ThyBooleanInput>(false, { transform: coerceBooleanProperty });\n\n readonly tabPaneAnimated = input<boolean, ThyBooleanInput>(true, { transform: coerceBooleanProperty });\n}\n","import {\n AfterContentInit,\n ChangeDetectionStrategy,\n ChangeDetectorRef,\n Component,\n ContentChildren,\n DestroyRef,\n ElementRef,\n OnInit,\n QueryList,\n TemplateRef,\n effect,\n inject,\n input,\n output\n} from '@angular/core';\nimport { coerceBooleanProperty, isString, ThyBooleanInput } from 'ngx-tethys/util';\nimport { fromEvent } from 'rxjs';\nimport { takeUntilDestroyed } from '@angular/core/rxjs-interop';\nimport { ThyTab } from './tab.component';\nimport { ThyActiveTabInfo, ThyTabActiveEvent } from './types';\nimport { ThyTabContent } from './tab-content.component';\nimport { NgTemplateOutlet } from '@angular/common';\nimport { ThyNav, ThyNavItemDirective } from 'ngx-tethys/nav';\n\nexport type ThyTabsSize = 'lg' | 'md' | 'sm';\n\nexport type ThyTabsType = 'pulled' | 'tabs' | 'pills' | 'lite';\n\nexport type ThyTabsPosition = 'top' | 'left';\n\n/**\n * 选项卡切换组件\n * @name thy-tabs\n */\n@Component({\n selector: 'thy-tabs',\n templateUrl: './tabs.component.html',\n changeDetection: ChangeDetectionStrategy.OnPush,\n host: {\n class: 'thy-tabs',\n '[class.thy-tabs-top]': `thyPosition() === 'top'`,\n '[class.thy-tabs-left]': `thyPosition() === 'left'`,\n '[style.overflow]': `transitionStarted ? \"hidden\" : null`\n },\n imports: [ThyNav, ThyNavItemDirective, NgTemplateOutlet, ThyTabContent]\n})\nexport class ThyTabs implements OnInit, AfterContentInit {\n private cd = inject(ChangeDetectorRef);\n private el = inject(ElementRef);\n\n @ContentChildren(ThyTab, { descendants: true }) tabs = new QueryList<ThyTab>();\n\n private readonly destroyRef = inject(DestroyRef);\n\n /**\n * 标签类型\n * @type 'pulled' | 'tabs' | 'pills' | 'lite'\n */\n readonly thyType = input<ThyTabsType>('tabs');\n\n /**\n * 选项卡的大小\n * @type 'lg' | 'md' | 'sm'\n */\n readonly thySize = input<ThyTabsSize>('md');\n\n /**\n * 激活的项\n */\n readonly thyActiveTab = input<ThyActiveTabInfo>(0);\n\n /**\n * 附加操作\n */\n readonly thyExtra = input<TemplateRef<unknown>>(undefined);\n\n /**\n * 选项卡的位置\n * @type 'top' | 'left'\n */\n readonly thyPosition = input<ThyTabsPosition>('top');\n\n /**\n * 是否使用动画切换 Tabs\n */\n readonly thyAnimated = input<boolean, ThyBooleanInput>(false, { transform: coerceBooleanProperty });\n\n /**\n * 响应式,自动计算宽度存放 thyNavItem,并添加更多弹框\n */\n readonly thyResponsive = input<boolean, ThyBooleanInput>(false, { transform: coerceBooleanProperty });\n\n /**\n * 激活的项发生改变时的回调\n */\n readonly thyActiveTabChange = output<ThyTabActiveEvent>();\n\n activeTabIndex: number = 0;\n\n activeTabId: string;\n\n transitionStarted: boolean = false;\n\n constructor() {\n effect(() => {\n const value = this.thyActiveTab();\n if (isString(value)) {\n this.activeTabId = value;\n this.activeTabIndex = undefined;\n } else {\n this.activeTabIndex = value;\n this.activeTabId = undefined;\n }\n });\n }\n\n ngOnInit(): void {\n const tabsContent = this.el.nativeElement.querySelector('.thy-tabs-content');\n fromEvent(tabsContent, 'transitionend')\n .pipe(takeUntilDestroyed(this.destroyRef))\n .subscribe(() => {\n this.transitionStarted = false;\n this.cd.markForCheck();\n });\n }\n\n ngAfterContentInit() {\n this.tabs.changes.pipe(takeUntilDestroyed(this.destroyRef)).subscribe(data => {\n this.thyAnimated() && (this.transitionStarted = true);\n this.activeTabIndex = data.length - 1;\n this.cd.markForCheck();\n });\n }\n\n get tabPaneAnimated(): boolean {\n return this.thyPosition() === 'top' && this.thyAnimated();\n }\n\n getTabContentMarginLeft(): string {\n if (this.tabPaneAnimated) {\n return `${-(this.activeTabIndex || 0) * 100}%`;\n }\n return '';\n }\n\n activeTab(tab: ThyTab, index: number) {\n if (tab.thyDisabled()) {\n return;\n }\n this.activeTabId = tab.id() || null;\n this.thyAnimated() && (this.transitionStarted = this.activeTabIndex !== index);\n this.activeTabIndex = index;\n const id = tab.id();\n const activeTab = id ? id : index;\n this.thyActiveTabChange.emit(activeTab);\n }\n}\n","<!-- tabs nav -->\n<thy-nav\n class=\"thy-tabs-nav\"\n [thyType]=\"thyType()\"\n [thySize]=\"thySize()\"\n [thyExtra]=\"thyExtra()\"\n [thyVertical]=\"thyPosition() === 'left'\"\n [thyResponsive]=\"thyResponsive()\">\n @for (tab of tabs; track $index; let i = $index) {\n <a\n href=\"javascript:;\"\n thyNavItem\n [id]=\"tab.id()\"\n [thyNavItemDisabled]=\"tab.thyDisabled()\"\n [thyNavItemActive]=\"(tab.id() && activeTabId && tab.id() === activeTabId) ?? i === activeTabIndex\"\n (click)=\"activeTab(tab, i)\">\n @if (tab.titleTemplateRef) {\n <ng-template [ngTemplateOutlet]=\"tab.titleTemplateRef\"></ng-template>\n } @else {\n {{ tab.thyTitle() }}\n }\n </a>\n }\n</thy-nav>\n<!-- tabs content -->\n<div class=\"thy-tabs-content\" [class.thy-tabs-content-animated]=\"tabPaneAnimated\" [style.margin-left]=\"getTabContentMarginLeft()\">\n @for (tab of tabs; track $index; let i = $index) {\n <div\n thyTabContent\n [active]=\"(tab.id() && activeTabId && tab.id() === activeTabId) ?? i === activeTabIndex\"\n [content]=\"tab.content\"\n [tabPaneAnimated]=\"tabPaneAnimated\"></div>\n }\n</div>\n","import { NgModule } from '@angular/core';\nimport { CommonModule } from '@angular/common';\nimport { ThyTabs } from './tabs.component';\nimport { ThyTab } from './tab.component';\nimport { ThyIconModule } from 'ngx-tethys/icon';\nimport { ThyNavModule } from 'ngx-tethys/nav';\nimport { ThyTabContent } from './tab-content.component';\n\n@NgModule({\n imports: [CommonModule, ThyIconModule, ThyNavModule, ThyTabs, ThyTab, ThyTabContent],\n exports: [ThyTabs, ThyTab]\n})\nexport class ThyTabsModule {}\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":[],"mappings":"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"}
@@ -1,9 +1,9 @@
1
1
  import * as i0 from '@angular/core';
2
- import { inject, ElementRef, Input, ChangeDetectionStrategy, Component, NgModule } from '@angular/core';
2
+ import { inject, ElementRef, input, computed, effect, ChangeDetectionStrategy, Component, NgModule } from '@angular/core';
3
3
  import { CommonModule } from '@angular/common';
4
- import { isThemeColor } from 'ngx-tethys/core';
5
- import { hexToRgb, coerceBooleanProperty } from 'ngx-tethys/util';
6
4
  import { useHostRenderer } from '@tethys/cdk/dom';
5
+ import { isThemeColor } from 'ngx-tethys/core';
6
+ import { coerceBooleanProperty, hexToRgb } from 'ngx-tethys/util';
7
7
  import { ThyIconModule } from 'ngx-tethys/icon';
8
8
 
9
9
  /**
@@ -13,102 +13,80 @@ import { ThyIconModule } from 'ngx-tethys/icon';
13
13
  class ThyTag {
14
14
  constructor() {
15
15
  this.elementRef = inject(ElementRef);
16
- this.color = 'default';
17
16
  this.hostRenderer = useHostRenderer();
17
+ /**
18
+ * 标签颜色,thyColor 的简写
19
+ * @type primary | success | info | warning | danger | default | light | string
20
+ * @default default
21
+ */
22
+ this.thyTag = input('');
18
23
  /**
19
24
  * 标签形状
20
25
  * @type pill | rectangle
21
26
  */
22
- this.thyShape = 'rectangle';
27
+ this.thyShape = input('rectangle');
28
+ /**
29
+ * 标签颜色,支持设置主题色和颜色值,主题色为 default、primary、success、info、warning、danger
30
+ */
31
+ this.thyColor = input('');
23
32
  /**
24
33
  * 标签主题,fill 为颜色填充,outline 为线框,weak-fill 为背景色0.1透明度效果
25
34
  * @type outline | fill | weak-fill
26
35
  */
27
- this.thyTheme = 'fill';
36
+ this.thyTheme = input('fill');
28
37
  /**
29
38
  * 标签大小
30
39
  * @type sm | md | lg
31
40
  */
32
- this.thySize = 'md';
33
- }
34
- /**
35
- * 标签颜色,thyColor 的简写
36
- * @type primary | success | info | warning | danger | default | light | string
37
- * @default default
38
- */
39
- set thyTag(value) {
40
- if (value) {
41
- this.color = value;
42
- }
43
- }
44
- /**
45
- * 标签颜色,支持设置主题色和颜色值,主题色为 default、primary、success、info、warning、danger
46
- */
47
- set thyColor(color) {
48
- this.color = color;
49
- }
50
- ngOnInit() {
51
- this.setColor();
52
- }
53
- ngOnChanges(changes) {
54
- if (changes.thyColor && changes.thyColor.currentValue && !changes.thyColor.firstChange) {
55
- this.setColor();
56
- }
57
- if (changes.thyTheme && changes.thyTheme.currentValue && !changes.thyTheme.firstChange) {
41
+ this.thySize = input('md');
42
+ /**
43
+ * 可 Hover 悬停的标签,设置为 true 时会有一个 Hover 效果
44
+ * @default false
45
+ */
46
+ this.thyHoverable = input(false, { transform: coerceBooleanProperty });
47
+ this.color = computed(() => this.thyColor() || this.thyTag() || 'default');
48
+ effect(() => {
58
49
  this.setColor();
59
- }
50
+ });
60
51
  }
61
52
  setColor() {
62
53
  this.elementRef.nativeElement.style.removeProperty('background-color');
63
54
  this.elementRef.nativeElement.style.removeProperty('border-color');
64
55
  this.elementRef.nativeElement.style.removeProperty('color');
65
56
  this.hostRenderer.updateClass([]);
66
- if (isThemeColor(this.color)) {
67
- this.hostRenderer.updateClass([`thy-tag-${this.thyTheme === 'fill' ? '' : this.thyTheme + '-'}${this.color}`]);
57
+ if (isThemeColor(this.color())) {
58
+ this.hostRenderer.updateClass([`thy-tag-${this.thyTheme() === 'fill' ? '' : this.thyTheme() + '-'}${this.color()}`]);
68
59
  }
69
60
  else {
70
- if (this.thyTheme === 'fill') {
71
- this.elementRef.nativeElement.style.backgroundColor = this.color;
61
+ if (this.thyTheme() === 'fill') {
62
+ this.elementRef.nativeElement.style.backgroundColor = this.color();
72
63
  }
73
- else if (this.thyTheme === 'outline') {
74
- this.elementRef.nativeElement.style.color = this.color;
75
- this.elementRef.nativeElement.style['border-color'] = this.color;
64
+ else if (this.thyTheme() === 'outline') {
65
+ this.elementRef.nativeElement.style.color = this.color();
66
+ this.elementRef.nativeElement.style['border-color'] = this.color();
76
67
  }
77
68
  else {
78
- this.elementRef.nativeElement.style.backgroundColor = hexToRgb(this.color, 0.1);
79
- this.elementRef.nativeElement.style.color = this.color;
69
+ this.elementRef.nativeElement.style.backgroundColor = hexToRgb(this.color(), 0.1);
70
+ this.elementRef.nativeElement.style.color = this.color();
80
71
  }
81
72
  }
82
73
  }
83
74
  static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.8", ngImport: i0, type: ThyTag, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
84
- static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "16.1.0", version: "19.2.8", type: ThyTag, isStandalone: true, selector: "thy-tag,[thyTag]", inputs: { thyTag: "thyTag", thyShape: "thyShape", thyColor: "thyColor", thyTheme: "thyTheme", thySize: "thySize", thyHoverable: ["thyHoverable", "thyHoverable", coerceBooleanProperty] }, host: { properties: { "class.thy-tag-pill": "thyShape === \"pill\"", "class.thy-tag-outline": "thyTheme === \"outline\"", "class.thy-tag-hover": "thyHoverable", "class.thy-tag-md": "thySize === \"md\"", "class.thy-tag-sm": "thySize === \"sm\"", "class.thy-tag-xs": "thySize === \"xs\"", "class.thy-tag-lg": "thySize === \"lg\"" }, classAttribute: "thy-tag" }, usesOnChanges: true, ngImport: i0, template: "<ng-content></ng-content>\n", changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
75
+ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "19.2.8", type: ThyTag, isStandalone: true, selector: "thy-tag,[thyTag]", inputs: { thyTag: { classPropertyName: "thyTag", publicName: "thyTag", isSignal: true, isRequired: false, transformFunction: null }, thyShape: { classPropertyName: "thyShape", publicName: "thyShape", isSignal: true, isRequired: false, transformFunction: null }, thyColor: { classPropertyName: "thyColor", publicName: "thyColor", isSignal: true, isRequired: false, transformFunction: null }, thyTheme: { classPropertyName: "thyTheme", publicName: "thyTheme", isSignal: true, isRequired: false, transformFunction: null }, thySize: { classPropertyName: "thySize", publicName: "thySize", isSignal: true, isRequired: false, transformFunction: null }, thyHoverable: { classPropertyName: "thyHoverable", publicName: "thyHoverable", isSignal: true, isRequired: false, transformFunction: null } }, host: { properties: { "class.thy-tag-pill": "thyShape() === \"pill\"", "class.thy-tag-outline": "thyTheme() === \"outline\"", "class.thy-tag-hover": "thyHoverable()", "class.thy-tag-md": "thySize() === \"md\"", "class.thy-tag-sm": "thySize() === \"sm\"", "class.thy-tag-xs": "thySize() === \"xs\"", "class.thy-tag-lg": "thySize() === \"lg\"" }, classAttribute: "thy-tag" }, ngImport: i0, template: "<ng-content></ng-content>\n", changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
85
76
  }
86
77
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.8", ngImport: i0, type: ThyTag, decorators: [{
87
78
  type: Component,
88
79
  args: [{ selector: 'thy-tag,[thyTag]', changeDetection: ChangeDetectionStrategy.OnPush, host: {
89
80
  class: 'thy-tag',
90
- '[class.thy-tag-pill]': 'thyShape === "pill"',
91
- '[class.thy-tag-outline]': 'thyTheme === "outline"',
92
- '[class.thy-tag-hover]': 'thyHoverable',
93
- '[class.thy-tag-md]': 'thySize === "md"',
94
- '[class.thy-tag-sm]': 'thySize === "sm"',
95
- '[class.thy-tag-xs]': 'thySize === "xs"',
96
- '[class.thy-tag-lg]': 'thySize === "lg"'
81
+ '[class.thy-tag-pill]': 'thyShape() === "pill"',
82
+ '[class.thy-tag-outline]': 'thyTheme() === "outline"',
83
+ '[class.thy-tag-hover]': 'thyHoverable()',
84
+ '[class.thy-tag-md]': 'thySize() === "md"',
85
+ '[class.thy-tag-sm]': 'thySize() === "sm"',
86
+ '[class.thy-tag-xs]': 'thySize() === "xs"',
87
+ '[class.thy-tag-lg]': 'thySize() === "lg"'
97
88
  }, template: "<ng-content></ng-content>\n" }]
98
- }], propDecorators: { thyTag: [{
99
- type: Input
100
- }], thyShape: [{
101
- type: Input
102
- }], thyColor: [{
103
- type: Input
104
- }], thyTheme: [{
105
- type: Input
106
- }], thySize: [{
107
- type: Input
108
- }], thyHoverable: [{
109
- type: Input,
110
- args: [{ transform: coerceBooleanProperty }]
111
- }] } });
89
+ }], ctorParameters: () => [] });
112
90
 
113
91
  /**
114
92
  * @name thy-tags
@@ -1 +1 @@
1
- {"version":3,"file":"ngx-tethys-tag.mjs","sources":["../../../src/tag/tag.component.ts","../../../src/tag/tag.component.html","../../../src/tag/tags.component.ts","../../../src/tag/tag.module.ts","../../../src/tag/ngx-tethys-tag.ts"],"sourcesContent":["import { Component, ElementRef, OnChanges, Input, OnInit, ChangeDetectionStrategy, SimpleChanges, inject } from '@angular/core';\nimport { isThemeColor, ThyThemeColor } from 'ngx-tethys/core';\nimport { coerceBooleanProperty, hexToRgb } from 'ngx-tethys/util';\nimport { useHostRenderer } from '@tethys/cdk/dom';\n\nexport type ThyTagColor = ThyThemeColor | string;\n\nexport type ThyTagShape = 'pill' | 'rectangle';\n\nexport type ThyTagSize = 'sm' | 'md' | 'lg';\n\n/**\n * 标签组件\n * @name thy-tag,[thyTag]\n */\n@Component({\n selector: 'thy-tag,[thyTag]',\n templateUrl: './tag.component.html',\n changeDetection: ChangeDetectionStrategy.OnPush,\n host: {\n class: 'thy-tag',\n '[class.thy-tag-pill]': 'thyShape === \"pill\"',\n '[class.thy-tag-outline]': 'thyTheme === \"outline\"',\n '[class.thy-tag-hover]': 'thyHoverable',\n '[class.thy-tag-md]': 'thySize === \"md\"',\n '[class.thy-tag-sm]': 'thySize === \"sm\"',\n '[class.thy-tag-xs]': 'thySize === \"xs\"',\n '[class.thy-tag-lg]': 'thySize === \"lg\"'\n }\n})\nexport class ThyTag implements OnInit, OnChanges {\n private elementRef = inject(ElementRef);\n\n private color: ThyTagColor = 'default';\n\n private hostRenderer = useHostRenderer();\n\n /**\n * 标签颜色,thyColor 的简写\n * @type primary | success | info | warning | danger | default | light | string\n * @default default\n */\n @Input()\n set thyTag(value: ThyTagColor) {\n if (value) {\n this.color = value;\n }\n }\n\n /**\n * 标签形状\n * @type pill | rectangle\n */\n @Input() thyShape: ThyTagShape = 'rectangle';\n\n /**\n * 标签颜色,支持设置主题色和颜色值,主题色为 default、primary、success、info、warning、danger\n */\n @Input()\n set thyColor(color: ThyTagColor) {\n this.color = color;\n }\n\n /**\n * 标签主题,fill 为颜色填充,outline 为线框,weak-fill 为背景色0.1透明度效果\n * @type outline | fill | weak-fill\n */\n @Input() thyTheme: 'outline' | 'fill' | 'weak-fill' = 'fill';\n\n /**\n * 标签大小\n * @type sm | md | lg\n */\n @Input() thySize: ThyTagSize = 'md';\n\n /**\n * 可 Hover 悬停的标签,设置为 true 时会有一个 Hover 效果\n * @default false\n */\n @Input({ transform: coerceBooleanProperty })\n thyHoverable: boolean | string;\n\n ngOnInit(): void {\n this.setColor();\n }\n\n ngOnChanges(changes: SimpleChanges): void {\n if (changes.thyColor && changes.thyColor.currentValue && !changes.thyColor.firstChange) {\n this.setColor();\n }\n if (changes.thyTheme && changes.thyTheme.currentValue && !changes.thyTheme.firstChange) {\n this.setColor();\n }\n }\n\n private setColor(): void {\n this.elementRef.nativeElement.style.removeProperty('background-color');\n this.elementRef.nativeElement.style.removeProperty('border-color');\n this.elementRef.nativeElement.style.removeProperty('color');\n this.hostRenderer.updateClass([]);\n\n if (isThemeColor(this.color)) {\n this.hostRenderer.updateClass([`thy-tag-${this.thyTheme === 'fill' ? '' : this.thyTheme + '-'}${this.color}`]);\n } else {\n if (this.thyTheme === 'fill') {\n this.elementRef.nativeElement.style.backgroundColor = this.color;\n } else if (this.thyTheme === 'outline') {\n this.elementRef.nativeElement.style.color = this.color;\n this.elementRef.nativeElement.style['border-color'] = this.color;\n } else {\n this.elementRef.nativeElement.style.backgroundColor = hexToRgb(this.color, 0.1);\n this.elementRef.nativeElement.style.color = this.color;\n }\n }\n }\n}\n","<ng-content></ng-content>\n","import { Component, OnInit, ChangeDetectionStrategy } from '@angular/core';\n\n/**\n * @name thy-tags\n */\n@Component({\n selector: 'thy-tags',\n template: '<ng-content></ng-content>',\n changeDetection: ChangeDetectionStrategy.OnPush,\n host: {\n class: 'thy-tags'\n }\n})\nexport class ThyTags implements OnInit {\n constructor() {}\n\n ngOnInit(): void {}\n}\n","import { NgModule } from '@angular/core';\nimport { CommonModule } from '@angular/common';\nimport { ThyTag } from './tag.component';\nimport { ThyIconModule } from 'ngx-tethys/icon';\nimport { ThyTags } from './tags.component';\n\n@NgModule({\n imports: [CommonModule, ThyIconModule, ThyTag, ThyTags],\n exports: [ThyTag, ThyTags]\n})\nexport class ThyTagModule {}\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":[],"mappings":"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"}
1
+ {"version":3,"file":"ngx-tethys-tag.mjs","sources":["../../../src/tag/tag.component.ts","../../../src/tag/tag.component.html","../../../src/tag/tags.component.ts","../../../src/tag/tag.module.ts","../../../src/tag/ngx-tethys-tag.ts"],"sourcesContent":["import { ChangeDetectionStrategy, Component, computed, effect, ElementRef, inject, input } from '@angular/core';\nimport { useHostRenderer } from '@tethys/cdk/dom';\nimport { isThemeColor, ThyThemeColor } from 'ngx-tethys/core';\nimport { coerceBooleanProperty, hexToRgb } from 'ngx-tethys/util';\n\nexport type ThyTagColor = ThyThemeColor | string;\n\nexport type ThyTagShape = 'pill' | 'rectangle';\n\nexport type ThyTagSize = 'sm' | 'md' | 'lg';\n\n/**\n * 标签组件\n * @name thy-tag,[thyTag]\n */\n@Component({\n selector: 'thy-tag,[thyTag]',\n templateUrl: './tag.component.html',\n changeDetection: ChangeDetectionStrategy.OnPush,\n host: {\n class: 'thy-tag',\n '[class.thy-tag-pill]': 'thyShape() === \"pill\"',\n '[class.thy-tag-outline]': 'thyTheme() === \"outline\"',\n '[class.thy-tag-hover]': 'thyHoverable()',\n '[class.thy-tag-md]': 'thySize() === \"md\"',\n '[class.thy-tag-sm]': 'thySize() === \"sm\"',\n '[class.thy-tag-xs]': 'thySize() === \"xs\"',\n '[class.thy-tag-lg]': 'thySize() === \"lg\"'\n }\n})\nexport class ThyTag {\n private elementRef = inject(ElementRef);\n\n private hostRenderer = useHostRenderer();\n\n /**\n * 标签颜色,thyColor 的简写\n * @type primary | success | info | warning | danger | default | light | string\n * @default default\n */\n readonly thyTag = input<ThyTagColor>('');\n\n /**\n * 标签形状\n * @type pill | rectangle\n */\n readonly thyShape = input<ThyTagShape>('rectangle');\n\n /**\n * 标签颜色,支持设置主题色和颜色值,主题色为 default、primary、success、info、warning、danger\n */\n readonly thyColor = input<ThyTagColor>('');\n\n /**\n * 标签主题,fill 为颜色填充,outline 为线框,weak-fill 为背景色0.1透明度效果\n * @type outline | fill | weak-fill\n */\n readonly thyTheme = input<'outline' | 'fill' | 'weak-fill'>('fill');\n\n /**\n * 标签大小\n * @type sm | md | lg\n */\n readonly thySize = input<ThyTagSize>('md');\n\n /**\n * 可 Hover 悬停的标签,设置为 true 时会有一个 Hover 效果\n * @default false\n */\n readonly thyHoverable = input(false, { transform: coerceBooleanProperty });\n\n protected readonly color = computed(() => this.thyColor() || this.thyTag() || 'default');\n\n constructor() {\n effect(() => {\n this.setColor();\n });\n }\n\n private setColor(): void {\n this.elementRef.nativeElement.style.removeProperty('background-color');\n this.elementRef.nativeElement.style.removeProperty('border-color');\n this.elementRef.nativeElement.style.removeProperty('color');\n this.hostRenderer.updateClass([]);\n\n if (isThemeColor(this.color())) {\n this.hostRenderer.updateClass([`thy-tag-${this.thyTheme() === 'fill' ? '' : this.thyTheme() + '-'}${this.color()}`]);\n } else {\n if (this.thyTheme() === 'fill') {\n this.elementRef.nativeElement.style.backgroundColor = this.color();\n } else if (this.thyTheme() === 'outline') {\n this.elementRef.nativeElement.style.color = this.color();\n this.elementRef.nativeElement.style['border-color'] = this.color();\n } else {\n this.elementRef.nativeElement.style.backgroundColor = hexToRgb(this.color(), 0.1);\n this.elementRef.nativeElement.style.color = this.color();\n }\n }\n }\n}\n","<ng-content></ng-content>\n","import { Component, OnInit, ChangeDetectionStrategy } from '@angular/core';\n\n/**\n * @name thy-tags\n */\n@Component({\n selector: 'thy-tags',\n template: '<ng-content></ng-content>',\n changeDetection: ChangeDetectionStrategy.OnPush,\n host: {\n class: 'thy-tags'\n }\n})\nexport class ThyTags implements OnInit {\n constructor() {}\n\n ngOnInit(): void {}\n}\n","import { NgModule } from '@angular/core';\nimport { CommonModule } from '@angular/common';\nimport { ThyTag } from './tag.component';\nimport { ThyIconModule } from 'ngx-tethys/icon';\nimport { ThyTags } from './tags.component';\n\n@NgModule({\n imports: [CommonModule, ThyIconModule, ThyTag, ThyTags],\n exports: [ThyTag, ThyTags]\n})\nexport class ThyTagModule {}\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":[],"mappings":"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"}