@ojiepermana/angular 21.2.4 → 21.3.3

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 (345) hide show
  1. package/README.md +155 -12
  2. package/component/accordion/package.json +4 -0
  3. package/component/alert/package.json +4 -0
  4. package/component/alert-dialog/package.json +4 -0
  5. package/component/aspect-ratio/package.json +4 -0
  6. package/component/avatar/package.json +4 -0
  7. package/component/badge/package.json +4 -0
  8. package/component/breadcrumb/package.json +4 -0
  9. package/component/button/package.json +4 -0
  10. package/component/button-group/package.json +4 -0
  11. package/component/calendar/package.json +4 -0
  12. package/component/card/package.json +4 -0
  13. package/component/carousel/package.json +4 -0
  14. package/component/chart/README.md +249 -0
  15. package/component/chart/area/package.json +4 -0
  16. package/component/chart/bar/package.json +4 -0
  17. package/component/chart/line/package.json +4 -0
  18. package/component/chart/package.json +4 -0
  19. package/component/chart/pie/package.json +4 -0
  20. package/component/chart/radar/package.json +4 -0
  21. package/component/chart/radial/package.json +4 -0
  22. package/component/chart/scatter/package.json +4 -0
  23. package/component/checkbox/package.json +4 -0
  24. package/component/collapsible/package.json +4 -0
  25. package/component/combobox/package.json +4 -0
  26. package/component/command/package.json +4 -0
  27. package/component/context-menu/package.json +4 -0
  28. package/component/date-picker/package.json +4 -0
  29. package/component/dialog/package.json +4 -0
  30. package/component/drawer/package.json +4 -0
  31. package/component/dropdown-menu/package.json +4 -0
  32. package/component/form/package.json +4 -0
  33. package/component/input/package.json +4 -0
  34. package/component/input-group/package.json +4 -0
  35. package/component/item/package.json +4 -0
  36. package/component/label/package.json +4 -0
  37. package/component/pagination/package.json +4 -0
  38. package/component/popover/package.json +4 -0
  39. package/component/progress/package.json +4 -0
  40. package/component/radio/package.json +4 -0
  41. package/component/scroll-area/package.json +4 -0
  42. package/component/select/package.json +4 -0
  43. package/component/separator/package.json +4 -0
  44. package/component/sheet/package.json +4 -0
  45. package/component/skeleton/package.json +4 -0
  46. package/component/slider/package.json +4 -0
  47. package/component/switch/package.json +4 -0
  48. package/component/table/package.json +4 -0
  49. package/component/tabs/package.json +4 -0
  50. package/component/textarea/package.json +4 -0
  51. package/component/toast/package.json +4 -0
  52. package/component/tooltip/package.json +4 -0
  53. package/component/utils/package.json +4 -0
  54. package/fesm2022/ojiepermana-angular-component-accordion.mjs +174 -0
  55. package/fesm2022/ojiepermana-angular-component-accordion.mjs.map +1 -0
  56. package/fesm2022/ojiepermana-angular-component-alert-dialog.mjs +242 -0
  57. package/fesm2022/ojiepermana-angular-component-alert-dialog.mjs.map +1 -0
  58. package/fesm2022/ojiepermana-angular-component-alert.mjs +90 -0
  59. package/fesm2022/ojiepermana-angular-component-alert.mjs.map +1 -0
  60. package/fesm2022/ojiepermana-angular-component-aspect-ratio.mjs +33 -0
  61. package/fesm2022/ojiepermana-angular-component-aspect-ratio.mjs.map +1 -0
  62. package/fesm2022/ojiepermana-angular-component-avatar.mjs +123 -0
  63. package/fesm2022/ojiepermana-angular-component-avatar.mjs.map +1 -0
  64. package/fesm2022/ojiepermana-angular-component-badge.mjs +47 -0
  65. package/fesm2022/ojiepermana-angular-component-badge.mjs.map +1 -0
  66. package/fesm2022/ojiepermana-angular-component-breadcrumb.mjs +186 -0
  67. package/fesm2022/ojiepermana-angular-component-breadcrumb.mjs.map +1 -0
  68. package/fesm2022/ojiepermana-angular-component-button-group.mjs +95 -0
  69. package/fesm2022/ojiepermana-angular-component-button-group.mjs.map +1 -0
  70. package/fesm2022/ojiepermana-angular-component-button.mjs +64 -0
  71. package/fesm2022/ojiepermana-angular-component-button.mjs.map +1 -0
  72. package/fesm2022/ojiepermana-angular-component-calendar.mjs +78 -0
  73. package/fesm2022/ojiepermana-angular-component-calendar.mjs.map +1 -0
  74. package/fesm2022/ojiepermana-angular-component-card.mjs +137 -0
  75. package/fesm2022/ojiepermana-angular-component-card.mjs.map +1 -0
  76. package/fesm2022/ojiepermana-angular-component-carousel.mjs +310 -0
  77. package/fesm2022/ojiepermana-angular-component-carousel.mjs.map +1 -0
  78. package/fesm2022/ojiepermana-angular-component-chart-area.mjs +6 -0
  79. package/fesm2022/ojiepermana-angular-component-chart-area.mjs.map +1 -0
  80. package/fesm2022/ojiepermana-angular-component-chart-bar.mjs +6 -0
  81. package/fesm2022/ojiepermana-angular-component-chart-bar.mjs.map +1 -0
  82. package/fesm2022/ojiepermana-angular-component-chart-line.mjs +6 -0
  83. package/fesm2022/ojiepermana-angular-component-chart-line.mjs.map +1 -0
  84. package/fesm2022/ojiepermana-angular-component-chart-pie.mjs +6 -0
  85. package/fesm2022/ojiepermana-angular-component-chart-pie.mjs.map +1 -0
  86. package/fesm2022/ojiepermana-angular-component-chart-radar.mjs +6 -0
  87. package/fesm2022/ojiepermana-angular-component-chart-radar.mjs.map +1 -0
  88. package/fesm2022/ojiepermana-angular-component-chart-radial.mjs +6 -0
  89. package/fesm2022/ojiepermana-angular-component-chart-radial.mjs.map +1 -0
  90. package/fesm2022/ojiepermana-angular-component-chart-scatter.mjs +6 -0
  91. package/fesm2022/ojiepermana-angular-component-chart-scatter.mjs.map +1 -0
  92. package/fesm2022/{ojiepermana-angular-chart.mjs → ojiepermana-angular-component-chart.mjs} +2 -2
  93. package/fesm2022/ojiepermana-angular-component-chart.mjs.map +1 -0
  94. package/fesm2022/ojiepermana-angular-component-checkbox.mjs +104 -0
  95. package/fesm2022/ojiepermana-angular-component-checkbox.mjs.map +1 -0
  96. package/fesm2022/ojiepermana-angular-component-collapsible.mjs +116 -0
  97. package/fesm2022/ojiepermana-angular-component-collapsible.mjs.map +1 -0
  98. package/fesm2022/ojiepermana-angular-component-combobox.mjs +263 -0
  99. package/fesm2022/ojiepermana-angular-component-combobox.mjs.map +1 -0
  100. package/fesm2022/ojiepermana-angular-component-command.mjs +268 -0
  101. package/fesm2022/ojiepermana-angular-component-command.mjs.map +1 -0
  102. package/fesm2022/ojiepermana-angular-component-context-menu.mjs +100 -0
  103. package/fesm2022/ojiepermana-angular-component-context-menu.mjs.map +1 -0
  104. package/fesm2022/ojiepermana-angular-component-date-picker.mjs +155 -0
  105. package/fesm2022/ojiepermana-angular-component-date-picker.mjs.map +1 -0
  106. package/fesm2022/ojiepermana-angular-component-dialog.mjs +262 -0
  107. package/fesm2022/ojiepermana-angular-component-dialog.mjs.map +1 -0
  108. package/fesm2022/ojiepermana-angular-component-drawer.mjs +6 -0
  109. package/fesm2022/ojiepermana-angular-component-drawer.mjs.map +1 -0
  110. package/fesm2022/ojiepermana-angular-component-dropdown-menu.mjs +458 -0
  111. package/fesm2022/ojiepermana-angular-component-dropdown-menu.mjs.map +1 -0
  112. package/fesm2022/ojiepermana-angular-component-form.mjs +208 -0
  113. package/fesm2022/ojiepermana-angular-component-form.mjs.map +1 -0
  114. package/fesm2022/ojiepermana-angular-component-input-group.mjs +164 -0
  115. package/fesm2022/ojiepermana-angular-component-input-group.mjs.map +1 -0
  116. package/fesm2022/ojiepermana-angular-component-input.mjs +43 -0
  117. package/fesm2022/ojiepermana-angular-component-input.mjs.map +1 -0
  118. package/fesm2022/ojiepermana-angular-component-item.mjs +241 -0
  119. package/fesm2022/ojiepermana-angular-component-item.mjs.map +1 -0
  120. package/fesm2022/ojiepermana-angular-component-label.mjs +30 -0
  121. package/fesm2022/ojiepermana-angular-component-label.mjs.map +1 -0
  122. package/fesm2022/ojiepermana-angular-component-pagination.mjs +192 -0
  123. package/fesm2022/ojiepermana-angular-component-pagination.mjs.map +1 -0
  124. package/fesm2022/ojiepermana-angular-component-popover.mjs +163 -0
  125. package/fesm2022/ojiepermana-angular-component-popover.mjs.map +1 -0
  126. package/fesm2022/ojiepermana-angular-component-progress.mjs +53 -0
  127. package/fesm2022/ojiepermana-angular-component-progress.mjs.map +1 -0
  128. package/fesm2022/ojiepermana-angular-component-radio.mjs +92 -0
  129. package/fesm2022/ojiepermana-angular-component-radio.mjs.map +1 -0
  130. package/fesm2022/ojiepermana-angular-component-scroll-area.mjs +48 -0
  131. package/fesm2022/ojiepermana-angular-component-scroll-area.mjs.map +1 -0
  132. package/fesm2022/ojiepermana-angular-component-select.mjs +131 -0
  133. package/fesm2022/ojiepermana-angular-component-select.mjs.map +1 -0
  134. package/fesm2022/ojiepermana-angular-component-separator.mjs +33 -0
  135. package/fesm2022/ojiepermana-angular-component-separator.mjs.map +1 -0
  136. package/fesm2022/ojiepermana-angular-component-sheet.mjs +235 -0
  137. package/fesm2022/ojiepermana-angular-component-sheet.mjs.map +1 -0
  138. package/fesm2022/ojiepermana-angular-component-skeleton.mjs +29 -0
  139. package/fesm2022/ojiepermana-angular-component-skeleton.mjs.map +1 -0
  140. package/fesm2022/ojiepermana-angular-component-slider.mjs +29 -0
  141. package/fesm2022/ojiepermana-angular-component-slider.mjs.map +1 -0
  142. package/fesm2022/ojiepermana-angular-component-switch.mjs +84 -0
  143. package/fesm2022/ojiepermana-angular-component-switch.mjs.map +1 -0
  144. package/fesm2022/ojiepermana-angular-component-table.mjs +139 -0
  145. package/fesm2022/ojiepermana-angular-component-table.mjs.map +1 -0
  146. package/fesm2022/ojiepermana-angular-component-tabs.mjs +252 -0
  147. package/fesm2022/ojiepermana-angular-component-tabs.mjs.map +1 -0
  148. package/fesm2022/ojiepermana-angular-component-textarea.mjs +37 -0
  149. package/fesm2022/ojiepermana-angular-component-textarea.mjs.map +1 -0
  150. package/fesm2022/ojiepermana-angular-component-toast.mjs +47 -0
  151. package/fesm2022/ojiepermana-angular-component-toast.mjs.map +1 -0
  152. package/fesm2022/ojiepermana-angular-component-tooltip.mjs +56 -0
  153. package/fesm2022/ojiepermana-angular-component-tooltip.mjs.map +1 -0
  154. package/fesm2022/ojiepermana-angular-component-utils.mjs +13 -0
  155. package/fesm2022/ojiepermana-angular-component-utils.mjs.map +1 -0
  156. package/fesm2022/ojiepermana-angular-generator-api.mjs +2 -1
  157. package/fesm2022/ojiepermana-angular-generator-api.mjs.map +1 -1
  158. package/fesm2022/ojiepermana-angular-layout-component.mjs +581 -0
  159. package/fesm2022/ojiepermana-angular-layout-component.mjs.map +1 -0
  160. package/fesm2022/ojiepermana-angular-layout-empty.mjs +49 -0
  161. package/fesm2022/ojiepermana-angular-layout-empty.mjs.map +1 -0
  162. package/fesm2022/ojiepermana-angular-layout-horizontal.mjs +119 -0
  163. package/fesm2022/ojiepermana-angular-layout-horizontal.mjs.map +1 -0
  164. package/fesm2022/ojiepermana-angular-layout-provider.mjs +21 -0
  165. package/fesm2022/ojiepermana-angular-layout-provider.mjs.map +1 -0
  166. package/fesm2022/ojiepermana-angular-layout-services.mjs +114 -0
  167. package/fesm2022/ojiepermana-angular-layout-services.mjs.map +1 -0
  168. package/fesm2022/ojiepermana-angular-layout-shell.mjs +48 -0
  169. package/fesm2022/ojiepermana-angular-layout-shell.mjs.map +1 -0
  170. package/fesm2022/ojiepermana-angular-layout-token-directive.mjs +27 -0
  171. package/fesm2022/ojiepermana-angular-layout-token-directive.mjs.map +1 -0
  172. package/fesm2022/ojiepermana-angular-layout-token.mjs +33 -0
  173. package/fesm2022/ojiepermana-angular-layout-token.mjs.map +1 -0
  174. package/fesm2022/ojiepermana-angular-layout-vertical.mjs +113 -0
  175. package/fesm2022/ojiepermana-angular-layout-vertical.mjs.map +1 -0
  176. package/fesm2022/ojiepermana-angular-layout.mjs +141 -137
  177. package/fesm2022/ojiepermana-angular-layout.mjs.map +1 -1
  178. package/fesm2022/ojiepermana-angular-navigation-demo-data.mjs +334 -0
  179. package/fesm2022/ojiepermana-angular-navigation-demo-data.mjs.map +1 -0
  180. package/fesm2022/ojiepermana-angular-navigation-icon.mjs +59 -0
  181. package/fesm2022/ojiepermana-angular-navigation-icon.mjs.map +1 -0
  182. package/fesm2022/ojiepermana-angular-navigation-item.mjs +548 -0
  183. package/fesm2022/ojiepermana-angular-navigation-item.mjs.map +1 -0
  184. package/fesm2022/ojiepermana-angular-navigation-service.mjs +204 -0
  185. package/fesm2022/ojiepermana-angular-navigation-service.mjs.map +1 -0
  186. package/fesm2022/ojiepermana-angular-navigation-sidebar.mjs +373 -0
  187. package/fesm2022/ojiepermana-angular-navigation-sidebar.mjs.map +1 -0
  188. package/fesm2022/ojiepermana-angular-navigation-topbar.mjs +433 -0
  189. package/fesm2022/ojiepermana-angular-navigation-topbar.mjs.map +1 -0
  190. package/fesm2022/ojiepermana-angular-navigation-types.mjs +4 -0
  191. package/fesm2022/ojiepermana-angular-navigation-types.mjs.map +1 -0
  192. package/fesm2022/ojiepermana-angular-theme-provider.mjs +35 -0
  193. package/fesm2022/ojiepermana-angular-theme-provider.mjs.map +1 -0
  194. package/fesm2022/ojiepermana-angular-theme-services.mjs +286 -0
  195. package/fesm2022/ojiepermana-angular-theme-services.mjs.map +1 -0
  196. package/fesm2022/ojiepermana-angular-theme-token.mjs +56 -0
  197. package/fesm2022/ojiepermana-angular-theme-token.mjs.map +1 -0
  198. package/fesm2022/ojiepermana-angular-theme.mjs +31 -56
  199. package/fesm2022/ojiepermana-angular-theme.mjs.map +1 -1
  200. package/fesm2022/ojiepermana-angular.mjs +7 -6
  201. package/fesm2022/ojiepermana-angular.mjs.map +1 -1
  202. package/generator/api/README.md +18 -15
  203. package/generator/api/bin/schematics/init/index.js +4 -2
  204. package/generator/api/bin/src/config/schema.js +2 -1
  205. package/generator/api/bin/src/emit/navigation.js +1 -1
  206. package/generator/api/bin/src/layout/per-domain.js +7 -3
  207. package/generator/api/sdk.config.example.json +4 -2
  208. package/layout/component/package.json +4 -0
  209. package/layout/empty/package.json +4 -0
  210. package/layout/horizontal/package.json +4 -0
  211. package/layout/provider/package.json +4 -0
  212. package/layout/services/package.json +4 -0
  213. package/layout/shell/package.json +4 -0
  214. package/layout/token/directive/package.json +4 -0
  215. package/layout/token/package.json +4 -0
  216. package/layout/vertical/package.json +4 -0
  217. package/navigation/demo-data/package.json +4 -0
  218. package/navigation/icon/package.json +4 -0
  219. package/navigation/item/package.json +4 -0
  220. package/navigation/service/package.json +4 -0
  221. package/navigation/sidebar/package.json +4 -0
  222. package/navigation/topbar/package.json +4 -0
  223. package/navigation/types/package.json +4 -0
  224. package/package.json +284 -16
  225. package/theme/README.md +67 -0
  226. package/theme/provider/package.json +4 -0
  227. package/theme/services/package.json +4 -0
  228. package/theme/styles/index.css +12 -7
  229. package/theme/token/package.json +4 -0
  230. package/types/ojiepermana-angular-component-accordion.d.ts +51 -0
  231. package/types/ojiepermana-angular-component-alert-dialog.d.ts +93 -0
  232. package/types/ojiepermana-angular-component-alert.d.ts +37 -0
  233. package/types/ojiepermana-angular-component-aspect-ratio.d.ts +12 -0
  234. package/types/ojiepermana-angular-component-avatar.d.ts +51 -0
  235. package/types/ojiepermana-angular-component-badge.d.ts +19 -0
  236. package/types/ojiepermana-angular-component-breadcrumb.d.ts +46 -0
  237. package/types/ojiepermana-angular-component-button-group.d.ts +26 -0
  238. package/types/ojiepermana-angular-component-button.d.ts +22 -0
  239. package/types/ojiepermana-angular-component-calendar.d.ts +33 -0
  240. package/types/ojiepermana-angular-component-card.d.ts +60 -0
  241. package/types/ojiepermana-angular-component-carousel.d.ts +86 -0
  242. package/types/ojiepermana-angular-component-chart-area.d.ts +1 -0
  243. package/types/ojiepermana-angular-component-chart-bar.d.ts +1 -0
  244. package/types/ojiepermana-angular-component-chart-line.d.ts +1 -0
  245. package/types/ojiepermana-angular-component-chart-pie.d.ts +1 -0
  246. package/types/ojiepermana-angular-component-chart-radar.d.ts +1 -0
  247. package/types/ojiepermana-angular-component-chart-radial.d.ts +1 -0
  248. package/types/ojiepermana-angular-component-chart-scatter.d.ts +1 -0
  249. package/types/{ojiepermana-angular-chart.d.ts → ojiepermana-angular-component-chart.d.ts} +15 -15
  250. package/types/ojiepermana-angular-component-checkbox.d.ts +35 -0
  251. package/types/ojiepermana-angular-component-collapsible.d.ts +42 -0
  252. package/types/ojiepermana-angular-component-combobox.d.ts +51 -0
  253. package/types/ojiepermana-angular-component-command.d.ts +99 -0
  254. package/types/ojiepermana-angular-component-context-menu.d.ts +35 -0
  255. package/types/ojiepermana-angular-component-date-picker.d.ts +41 -0
  256. package/types/ojiepermana-angular-component-dialog.d.ts +87 -0
  257. package/types/ojiepermana-angular-component-drawer.d.ts +1 -0
  258. package/types/ojiepermana-angular-component-dropdown-menu.d.ts +135 -0
  259. package/types/ojiepermana-angular-component-form.d.ts +92 -0
  260. package/types/ojiepermana-angular-component-input-group.d.ts +51 -0
  261. package/types/ojiepermana-angular-component-input.d.ts +16 -0
  262. package/types/ojiepermana-angular-component-item.d.ts +88 -0
  263. package/types/ojiepermana-angular-component-label.d.ts +11 -0
  264. package/types/ojiepermana-angular-component-pagination.d.ts +27 -0
  265. package/types/ojiepermana-angular-component-popover.d.ts +43 -0
  266. package/types/ojiepermana-angular-component-progress.d.ts +17 -0
  267. package/types/ojiepermana-angular-component-radio.d.ts +34 -0
  268. package/types/ojiepermana-angular-component-scroll-area.d.ts +19 -0
  269. package/types/ojiepermana-angular-component-select.d.ts +45 -0
  270. package/types/ojiepermana-angular-component-separator.d.ts +14 -0
  271. package/types/ojiepermana-angular-component-sheet.d.ts +74 -0
  272. package/types/ojiepermana-angular-component-skeleton.d.ts +10 -0
  273. package/types/ojiepermana-angular-component-slider.d.ts +16 -0
  274. package/types/ojiepermana-angular-component-switch.d.ts +30 -0
  275. package/types/ojiepermana-angular-component-table.d.ts +52 -0
  276. package/types/ojiepermana-angular-component-tabs.d.ts +92 -0
  277. package/types/ojiepermana-angular-component-textarea.d.ts +12 -0
  278. package/types/ojiepermana-angular-component-toast.d.ts +29 -0
  279. package/types/ojiepermana-angular-component-tooltip.d.ts +22 -0
  280. package/types/ojiepermana-angular-component-utils.d.ts +5 -0
  281. package/types/ojiepermana-angular-generator-api.d.ts +2 -1
  282. package/types/ojiepermana-angular-layout-component.d.ts +205 -0
  283. package/types/ojiepermana-angular-layout-empty.d.ts +22 -0
  284. package/types/ojiepermana-angular-layout-horizontal.d.ts +36 -0
  285. package/types/ojiepermana-angular-layout-provider.d.ts +6 -0
  286. package/types/ojiepermana-angular-layout-services.d.ts +25 -0
  287. package/types/ojiepermana-angular-layout-shell.d.ts +8 -0
  288. package/types/ojiepermana-angular-layout-token-directive.d.ts +13 -0
  289. package/types/ojiepermana-angular-layout-token.d.ts +36 -0
  290. package/types/ojiepermana-angular-layout-vertical.d.ts +38 -0
  291. package/types/ojiepermana-angular-layout.d.ts +27 -26
  292. package/types/ojiepermana-angular-navigation-demo-data.d.ts +5 -0
  293. package/types/ojiepermana-angular-navigation-icon.d.ts +17 -0
  294. package/types/ojiepermana-angular-navigation-item.d.ts +54 -0
  295. package/types/ojiepermana-angular-navigation-service.d.ts +77 -0
  296. package/types/ojiepermana-angular-navigation-sidebar.d.ts +75 -0
  297. package/types/ojiepermana-angular-navigation-topbar.d.ts +54 -0
  298. package/types/ojiepermana-angular-navigation-types.d.ts +129 -0
  299. package/types/ojiepermana-angular-theme-provider.d.ts +11 -0
  300. package/types/ojiepermana-angular-theme-services.d.ts +55 -0
  301. package/types/ojiepermana-angular-theme-token.d.ts +57 -0
  302. package/types/ojiepermana-angular-theme.d.ts +11 -66
  303. package/chart/README.md +0 -0
  304. package/chart/package.json +0 -4
  305. package/component/package.json +0 -4
  306. package/fesm2022/ojiepermana-angular-chart.mjs.map +0 -1
  307. package/fesm2022/ojiepermana-angular-component.mjs +0 -5774
  308. package/fesm2022/ojiepermana-angular-component.mjs.map +0 -1
  309. package/fesm2022/ojiepermana-angular-navigation.mjs +0 -2369
  310. package/fesm2022/ojiepermana-angular-navigation.mjs.map +0 -1
  311. package/navigation/package.json +0 -4
  312. package/types/ojiepermana-angular-component.d.ts +0 -1927
  313. package/types/ojiepermana-angular-navigation.d.ts +0 -393
  314. /package/theme/styles/{themes/library/_components.css → foundation/components.css} +0 -0
  315. /package/theme/styles/{themes/library/_layers.css → foundation/layers.css} +0 -0
  316. /package/theme/styles/{themes/library/_tokens.css → foundation/tokens.css} +0 -0
  317. /package/theme/styles/{themes/library/_material-overrides.css → integrations/material.css} +0 -0
  318. /package/theme/styles/{themes → integrations}/tailwind.css +0 -0
  319. /package/theme/styles/{themes/library → variants}/color/amber.css +0 -0
  320. /package/theme/styles/{themes/library → variants}/color/base.css +0 -0
  321. /package/theme/styles/{themes/library → variants}/color/blue.css +0 -0
  322. /package/theme/styles/{themes/library → variants}/color/cyan.css +0 -0
  323. /package/theme/styles/{themes/library → variants}/color/emerald.css +0 -0
  324. /package/theme/styles/{themes/library → variants}/color/fuchsia.css +0 -0
  325. /package/theme/styles/{themes/library → variants}/color/green.css +0 -0
  326. /package/theme/styles/{themes/library → variants}/color/index.css +0 -0
  327. /package/theme/styles/{themes/library → variants}/color/indigo.css +0 -0
  328. /package/theme/styles/{themes/library → variants}/color/lime.css +0 -0
  329. /package/theme/styles/{themes/library → variants}/color/orange.css +0 -0
  330. /package/theme/styles/{themes/library → variants}/color/pink.css +0 -0
  331. /package/theme/styles/{themes/library → variants}/color/purple.css +0 -0
  332. /package/theme/styles/{themes/library → variants}/color/red.css +0 -0
  333. /package/theme/styles/{themes/library → variants}/color/rose.css +0 -0
  334. /package/theme/styles/{themes/library → variants}/color/sky.css +0 -0
  335. /package/theme/styles/{themes/library → variants}/color/teal.css +0 -0
  336. /package/theme/styles/{themes/library → variants}/color/violet.css +0 -0
  337. /package/theme/styles/{themes/library → variants}/color/yellow.css +0 -0
  338. /package/theme/styles/{themes → variants}/mode/dark.css +0 -0
  339. /package/theme/styles/{themes → variants}/mode/index.css +0 -0
  340. /package/theme/styles/{themes → variants}/mode/light.css +0 -0
  341. /package/theme/styles/{themes/library → variants}/style/brutal.css +0 -0
  342. /package/theme/styles/{themes/library → variants}/style/default.css +0 -0
  343. /package/theme/styles/{themes/library → variants}/style/index.css +0 -0
  344. /package/theme/styles/{themes/library → variants}/style/sharp.css +0 -0
  345. /package/theme/styles/{themes/library → variants}/style/soft.css +0 -0
package/README.md CHANGED
@@ -16,8 +16,13 @@ Install the published package into a consumer Angular workspace with Angular
16
16
  CLI so the required peer dependencies are added to the app's `package.json`
17
17
  and installed in the same flow:
18
18
 
19
+ In the consumer snippets below, `@your-scope/angular` means the package name
20
+ your workspace actually installs. Replace it consistently with the published
21
+ target you use, for example `@ojiepermana/angular`, `@edsis/angular`, or
22
+ another branded alias such as `@etos/angular`.
23
+
19
24
  ```bash
20
- ng add @ojiepermana/angular
25
+ ng add @your-scope/angular
21
26
  ```
22
27
 
23
28
  The library requires Tailwind CSS `^4.3.0`. If the consumer workspace does
@@ -27,7 +32,7 @@ from the published `peerDependencies`.
27
32
  When updating the library later, use Angular CLI as well:
28
33
 
29
34
  ```bash
30
- ng update @ojiepermana/angular
35
+ ng update @your-scope/angular
31
36
  ```
32
37
 
33
38
  The package ships `ng-add` and `ng-update` metadata so Angular and RxJS
@@ -38,21 +43,153 @@ add` directly, peer dependency installation falls back to the package
38
43
  manager's own behavior. In that flow, install Tailwind manually as well:
39
44
 
40
45
  ```bash
41
- bun add @ojiepermana/angular tailwindcss@^4.3.0
46
+ bun add @your-scope/angular tailwindcss@^4.3.0
42
47
  ```
43
48
 
44
49
  Consumer app styles should import the library theme, Tailwind, and the
45
50
  Tailwind bridge in this order:
46
51
 
47
52
  ```css
48
- @import '@ojiepermana/angular/theme/styles';
53
+ @import '@your-scope/angular/theme/styles';
54
+ @import 'tailwindcss';
55
+ @import '@your-scope/angular/theme/tailwind/theme.css';
56
+ ```
57
+
58
+ ## Theme entrypoint
59
+
60
+ The shared theme runtime ships through `@your-scope/angular/theme`, with
61
+ granular deep-import surfaces available at `@your-scope/angular/theme/services`,
62
+ `@your-scope/angular/theme/provider`, and `@your-scope/angular/theme/token`.
63
+ The CSS assets stay available through `@your-scope/angular/theme/styles` and
64
+ `@your-scope/angular/theme/tailwind/theme.css`.
65
+
66
+ ```ts
67
+ import { provideMaterialTheme, withMaterialDefaults } from '@your-scope/angular/theme';
68
+ ```
69
+
70
+ ```css
71
+ @import '@your-scope/angular/theme/styles';
49
72
  @import 'tailwindcss';
50
- @import '@ojiepermana/angular/theme/tailwind/theme.css';
73
+ @import '@your-scope/angular/theme/tailwind/theme.css';
51
74
  ```
52
75
 
76
+ For contributors working in this repository, the theme entrypoint source is
77
+ split into runtime APIs under [`projects/angular/theme/services/src/lib`](theme/services/src/lib),
78
+ [`projects/angular/theme/provider/src/lib`](theme/provider/src/lib),
79
+ [`projects/angular/theme/token/src/lib`](theme/token/src/lib), and stylesheet
80
+ assets under [`projects/angular/theme/css`](theme/css).
81
+ The stylesheet sources are grouped into `foundation/`, `variants/`, and
82
+ `integrations/`. Local entrypoint notes live in
83
+ [`projects/angular/theme/README.md`](theme/README.md).
84
+
85
+ To run the theme-only regression suite from the workspace root, use:
86
+
87
+ ```bash
88
+ bun run test:theme
89
+ ```
90
+
91
+ ## Breaking change migration
92
+
93
+ Granular secondary entrypoints are now the required component and navigation
94
+ surface. If your app previously imported from the removed
95
+ `@your-scope/angular/component` or `@your-scope/angular/navigation` barrels,
96
+ migrate in this order:
97
+
98
+ 1. Confirm the package root you install in the consumer app. Keep that same
99
+ root in every `ng add`, `ng update`, stylesheet import, and TypeScript
100
+ import.
101
+ 2. Replace broad barrel imports such as `@your-scope/angular/component` with
102
+ the smallest matching subpath, for example
103
+ `@your-scope/angular/component/button` or
104
+ `@your-scope/angular/component/dropdown-menu`.
105
+ 3. Replace removed navigation imports such as `@your-scope/angular/navigation`
106
+ with the matching navigation subpath, for example
107
+ `@your-scope/angular/navigation/sidebar`,
108
+ `@your-scope/angular/navigation/topbar`,
109
+ `@your-scope/angular/navigation/service`, or
110
+ `@your-scope/angular/navigation/types`.
111
+ 4. Update any internal helper imports to their new granular subpaths as well,
112
+ including utilities such as `@your-scope/angular/component/utils`.
113
+ 5. Update schematic commands in the same way. The package name before the
114
+ colon must match the installed target.
115
+
116
+ Example migration:
117
+
118
+ ```ts
119
+ import { ButtonComponent } from '@your-scope/angular/component/button';
120
+ import { DropdownMenuComponent } from '@your-scope/angular/component/dropdown-menu';
121
+ import { SidebarComponent } from '@your-scope/angular/navigation/sidebar';
122
+ import { NavigationService } from '@your-scope/angular/navigation/service';
123
+ import { UiNavIconComponent } from '@your-scope/angular/navigation/icon';
124
+ ```
125
+
126
+ ## Granular imports for production builds
127
+
128
+ Prefer the smallest subpath that matches the primitives you actually use,
129
+ especially in Native Federation or other shared-chunk builds. Every component
130
+ now ships only through its matching granular subpath, for example
131
+ `@your-scope/angular/component/date-picker`,
132
+ `@your-scope/angular/component/dropdown-menu`, and
133
+ `@your-scope/angular/component/tooltip`.
134
+
135
+ ```ts
136
+ import { AvatarComponent, AvatarFallbackComponent, AvatarImageComponent } from '@your-scope/angular/component/avatar';
137
+ import { ButtonComponent } from '@your-scope/angular/component/button';
138
+ import { PopoverContentDirective, PopoverTriggerDirective } from '@your-scope/angular/component/popover';
139
+ import { cn } from '@your-scope/angular/component/utils';
140
+ import { UiNavIconComponent } from '@your-scope/angular/navigation/icon';
141
+ ```
142
+
143
+ `@your-scope/angular/component` and `@your-scope/angular/navigation` aggregate
144
+ barrels have been removed. Consumers should use granular
145
+ `@your-scope/angular/component/<slug>` and
146
+ `@your-scope/angular/navigation/<part>` imports.
147
+
148
+ Navigation now follows the same granular pattern:
149
+ `@your-scope/angular/navigation/types`,
150
+ `@your-scope/angular/navigation/service`,
151
+ `@your-scope/angular/navigation/sidebar`,
152
+ `@your-scope/angular/navigation/topbar`,
153
+ `@your-scope/angular/navigation/item`,
154
+ `@your-scope/angular/navigation/icon`, and
155
+ `@your-scope/angular/navigation/demo-data`.
156
+
157
+ The same subpaths are preserved for branded packages. For example, a consumer
158
+ built from the EDSIS release uses:
159
+
160
+ ```ts
161
+ import { ButtonComponent } from '@edsis/angular/component/button';
162
+ import { cn } from '@edsis/angular/component/utils';
163
+ import { UiNavIconComponent } from '@edsis/angular/navigation/icon';
164
+ ```
165
+
166
+ To verify the generated package still publishes smaller entrypoints after a
167
+ build, run:
168
+
169
+ ```bash
170
+ bun run build
171
+ bun run report:entrypoints -- --check
172
+ ```
173
+
174
+ The size report validates that every granular component and navigation
175
+ entrypoint resolves to its own module and that the removed `./component` and
176
+ `./navigation` parent barrels do not return in the published exports.
177
+
53
178
  ## Navigation primitives
54
179
 
55
- `@ojiepermana/angular/navigation` exports the shared sidebar and topbar building blocks used by the demo shells. The vertical navigation selector is now `sidebar` and the projected sidebar slots use `sidebar-header` and `sidebar-footer`.
180
+ The navigation library now publishes only granular child entrypoints, so each
181
+ part can be consumed independently.
182
+
183
+ ```ts
184
+ import { SidebarComponent } from '@your-scope/angular/navigation/sidebar';
185
+ import { TopbarComponent } from '@your-scope/angular/navigation/topbar';
186
+ import { NavigationService } from '@your-scope/angular/navigation/service';
187
+ import type { NavigationItem, SidebarAppearance } from '@your-scope/angular/navigation/types';
188
+ import { UiNavIconComponent } from '@your-scope/angular/navigation/icon';
189
+ ```
190
+
191
+ The vertical navigation selector is now `sidebar` and the projected sidebar
192
+ slots use `sidebar-header` and `sidebar-footer`.
56
193
 
57
194
  ```html
58
195
  <sidebar [ariaLabel]="'Primary'" [appearance]="'default'">
@@ -70,9 +207,9 @@ SDK config file under `config/sdk.config.json` and generate an Angular SDK direc
70
207
  schematics:
71
208
 
72
209
  ```bash
73
- ng generate @ojiepermana/angular:sdk-init
210
+ ng generate @your-scope/angular:sdk-init
74
211
  # edit config/sdk.config.json
75
- ng generate @ojiepermana/angular:sdk
212
+ ng generate @your-scope/angular:sdk
76
213
  ```
77
214
 
78
215
  The main consumer flow is: create `config/sdk.config.json`, adjust the OpenAPI
@@ -83,8 +220,8 @@ If you want short script aliases in the consumer app's `package.json`, add:
83
220
  ```json
84
221
  {
85
222
  "scripts": {
86
- "gen:sdk:init": "ng generate @ojiepermana/angular:sdk-init",
87
- "gen:sdk": "ng generate @ojiepermana/angular:sdk"
223
+ "gen:sdk:init": "ng generate @your-scope/angular:sdk-init",
224
+ "gen:sdk": "ng generate @your-scope/angular:sdk"
88
225
  }
89
226
  }
90
227
  ```
@@ -95,8 +232,8 @@ ships the compiled schematic runtime.
95
232
  Common follow-up options:
96
233
 
97
234
  ```bash
98
- ng generate @ojiepermana/angular:sdk-init --path=config/my-sdk.config.json
99
- ng generate @ojiepermana/angular:sdk --config=config/my-sdk.config.json --dry-run
235
+ ng generate @your-scope/angular:sdk-init --path=config/my-sdk.config.json
236
+ ng generate @your-scope/angular:sdk --config=config/my-sdk.config.json --dry-run
100
237
  ```
101
238
 
102
239
  ## Code scaffolding
@@ -123,6 +260,12 @@ bun run build
123
260
 
124
261
  This command will compile your project, and the build artifacts will be placed in the `dist/` directory.
125
262
 
263
+ To inspect the generated entrypoint sizes after a build, run:
264
+
265
+ ```bash
266
+ bun run report:entrypoints
267
+ ```
268
+
126
269
  ### Publishing the Library
127
270
 
128
271
  Publish the scoped package to the public npm registry from the workspace root.
@@ -0,0 +1,4 @@
1
+ {
2
+ "module": "../../fesm2022/ojiepermana-angular-component-accordion.mjs",
3
+ "typings": "../../types/ojiepermana-angular-component-accordion.d.ts"
4
+ }
@@ -0,0 +1,4 @@
1
+ {
2
+ "module": "../../fesm2022/ojiepermana-angular-component-alert.mjs",
3
+ "typings": "../../types/ojiepermana-angular-component-alert.d.ts"
4
+ }
@@ -0,0 +1,4 @@
1
+ {
2
+ "module": "../../fesm2022/ojiepermana-angular-component-alert-dialog.mjs",
3
+ "typings": "../../types/ojiepermana-angular-component-alert-dialog.d.ts"
4
+ }
@@ -0,0 +1,4 @@
1
+ {
2
+ "module": "../../fesm2022/ojiepermana-angular-component-aspect-ratio.mjs",
3
+ "typings": "../../types/ojiepermana-angular-component-aspect-ratio.d.ts"
4
+ }
@@ -0,0 +1,4 @@
1
+ {
2
+ "module": "../../fesm2022/ojiepermana-angular-component-avatar.mjs",
3
+ "typings": "../../types/ojiepermana-angular-component-avatar.d.ts"
4
+ }
@@ -0,0 +1,4 @@
1
+ {
2
+ "module": "../../fesm2022/ojiepermana-angular-component-badge.mjs",
3
+ "typings": "../../types/ojiepermana-angular-component-badge.d.ts"
4
+ }
@@ -0,0 +1,4 @@
1
+ {
2
+ "module": "../../fesm2022/ojiepermana-angular-component-breadcrumb.mjs",
3
+ "typings": "../../types/ojiepermana-angular-component-breadcrumb.d.ts"
4
+ }
@@ -0,0 +1,4 @@
1
+ {
2
+ "module": "../../fesm2022/ojiepermana-angular-component-button.mjs",
3
+ "typings": "../../types/ojiepermana-angular-component-button.d.ts"
4
+ }
@@ -0,0 +1,4 @@
1
+ {
2
+ "module": "../../fesm2022/ojiepermana-angular-component-button-group.mjs",
3
+ "typings": "../../types/ojiepermana-angular-component-button-group.d.ts"
4
+ }
@@ -0,0 +1,4 @@
1
+ {
2
+ "module": "../../fesm2022/ojiepermana-angular-component-calendar.mjs",
3
+ "typings": "../../types/ojiepermana-angular-component-calendar.d.ts"
4
+ }
@@ -0,0 +1,4 @@
1
+ {
2
+ "module": "../../fesm2022/ojiepermana-angular-component-card.mjs",
3
+ "typings": "../../types/ojiepermana-angular-component-card.d.ts"
4
+ }
@@ -0,0 +1,4 @@
1
+ {
2
+ "module": "../../fesm2022/ojiepermana-angular-component-carousel.mjs",
3
+ "typings": "../../types/ojiepermana-angular-component-carousel.d.ts"
4
+ }
@@ -0,0 +1,249 @@
1
+ # Chart
2
+
3
+ Angular chart primitives and chart families inspired by shadcn Chart.
4
+
5
+ In this repository, shadcn's single Chart page maps to the dedicated `/ui/chart/*` demo route group so each chart family can keep focused, production-like examples without forcing everything into one `/ui/shadcn/chart` page.
6
+
7
+ Use Chart for dashboards, KPI cards, trend comparisons, radial summaries, and interactive data views where one shared config should drive labels, colors, legends, and tooltip copy.
8
+
9
+ ## Installation
10
+
11
+ ```bash
12
+ bun add @ojiepermana/angular
13
+ npm install @ojiepermana/angular
14
+ ```
15
+
16
+ ## Import
17
+
18
+ Import shared primitives from the chart root entrypoint, then import the concrete chart family from its granular subpath.
19
+
20
+ ```ts
21
+ import {
22
+ ChartAxisX,
23
+ ChartAxisY,
24
+ ChartContainer,
25
+ ChartGrid,
26
+ ChartLegend,
27
+ ChartTooltip,
28
+ type ChartConfig,
29
+ } from '@ojiepermana/angular/component/chart';
30
+ import { BarChart } from '@ojiepermana/angular/component/chart/bar';
31
+ ```
32
+
33
+ ### Supported chart entrypoints
34
+
35
+ | Import path | Selector | Best for |
36
+ | ---------------------------------------------- | ------------------ | ----------------------------------------------------------------- |
37
+ | `@ojiepermana/angular/component/chart/bar` | `ui-bar-chart` | grouped, stacked, horizontal, active, and mixed-color bar layouts |
38
+ | `@ojiepermana/angular/component/chart/line` | `ui-line-chart` | trends, comparisons, and zoomable time-series lines |
39
+ | `@ojiepermana/angular/component/chart/area` | `ui-area-chart` | filled trend bands, stacked areas, and expanded percent views |
40
+ | `@ojiepermana/angular/component/chart/pie` | `ui-pie-chart` | part-to-whole slices and donut charts |
41
+ | `@ojiepermana/angular/component/chart/radar` | `ui-radar-chart` | multi-axis performance comparisons |
42
+ | `@ojiepermana/angular/component/chart/radial` | `ui-radial-chart` | progress rings, radial comparisons, and center-metric summaries |
43
+ | `@ojiepermana/angular/component/chart/scatter` | `ui-scatter-chart` | XY correlation plots and point clouds |
44
+
45
+ ## Composition
46
+
47
+ The Angular structure keeps the same high-level idea as shadcn Chart: define a shared chart config once, then compose a specific chart type with optional grid, axis, tooltip, legend, and center content.
48
+
49
+ ```text
50
+ ui-chart-container
51
+ ├── ui-bar-chart | ui-line-chart | ui-area-chart | ui-scatter-chart
52
+ │ ├── svg:g[ui-chart-grid]
53
+ │ ├── svg:g[ui-chart-axis-x]
54
+ │ ├── svg:g[ui-chart-axis-y]
55
+ │ └── svg:g[ui-chart-crosshair] / svg:g[ui-chart-brush] (optional)
56
+ ├── ui-pie-chart | ui-radial-chart | ui-radar-chart
57
+ │ └── ui-pie-center | ui-radial-center (optional)
58
+ ├── ui-chart-tooltip
59
+ ├── ui-chart-legend
60
+ └── ui-chart-zoom-controls (optional)
61
+ ```
62
+
63
+ All child primitives read dimensions, series metadata, and scoped color tokens from `ui-chart-container`.
64
+
65
+ ## Basic usage
66
+
67
+ Start with a readonly `ChartConfig`, keep the dataset in any shape that makes sense for your feature, and map the chart to the relevant keys.
68
+
69
+ ```ts
70
+ const trafficChartConfig = {
71
+ desktop: { label: 'Desktop', color: 'var(--chart-1)' },
72
+ mobile: { label: 'Mobile', color: 'var(--chart-2)' },
73
+ } satisfies ChartConfig;
74
+
75
+ const trafficData = [
76
+ { month: 'January', desktop: 186, mobile: 80 },
77
+ { month: 'February', desktop: 305, mobile: 200 },
78
+ { month: 'March', desktop: 237, mobile: 120 },
79
+ { month: 'April', desktop: 73, mobile: 190 },
80
+ { month: 'May', desktop: 209, mobile: 130 },
81
+ { month: 'June', desktop: 214, mobile: 140 },
82
+ ];
83
+ ```
84
+
85
+ ```html
86
+ <div class="w-full max-w-3xl">
87
+ <ui-chart-container [config]="trafficChartConfig" chartId="traffic-overview">
88
+ <ui-bar-chart [data]="trafficData" xKey="month">
89
+ <svg:g ui-chart-grid></svg:g>
90
+ <svg:g ui-chart-axis-x></svg:g>
91
+ <svg:g ui-chart-axis-y></svg:g>
92
+ </ui-bar-chart>
93
+ <ui-chart-tooltip [data]="trafficData" xKey="month" />
94
+ <ui-chart-legend />
95
+ </ui-chart-container>
96
+ </div>
97
+ ```
98
+
99
+ ## Common patterns
100
+
101
+ ### First chart flow
102
+
103
+ The closest Angular equivalent to the upstream shadcn walkthrough is:
104
+
105
+ 1. Define your dataset.
106
+ 2. Define `ChartConfig` so labels and colors stay decoupled from the raw data.
107
+ 3. Wrap the chart in `ui-chart-container`.
108
+ 4. Add `svg:g[ui-chart-grid]`, axis directives, `ui-chart-tooltip`, and `ui-chart-legend` only where they add value.
109
+
110
+ This keeps the chart family focused while still letting the shared primitives manage the common UI pieces.
111
+
112
+ ### Swapping chart families
113
+
114
+ The same `ChartConfig` can back multiple chart families. In most cases you only swap the concrete chart import and the family-specific inputs.
115
+
116
+ ```ts
117
+ import { AreaChart } from '@ojiepermana/angular/component/chart/area';
118
+ import { LineChart } from '@ojiepermana/angular/component/chart/line';
119
+ ```
120
+
121
+ - `ui-line-chart` adds inputs such as `curve`, `showDots`, and `showValueLabels`.
122
+ - `ui-area-chart` adds `stacked`, `expanded`, `gradient`, and `curve`.
123
+ - `ui-bar-chart` adds `orientation`, `variant`, `colorKey`, `activeKey`, and `activeValue`.
124
+
125
+ ### Pie and radial summaries
126
+
127
+ For donut, pie, and radial progress layouts, use `nameKey` plus `valueKey` instead of `xKey`.
128
+
129
+ ```html
130
+ <ui-chart-container [config]="browserConfig" aspect="aspect-square">
131
+ <ui-pie-chart
132
+ [data]="browserData"
133
+ nameKey="browser"
134
+ valueKey="visitors"
135
+ [seriesKeys]="browserSeriesKeys"
136
+ [innerRadius]="64">
137
+ </ui-pie-chart>
138
+ <ui-chart-tooltip [data]="browserData" xKey="browser" valueKey="visitors" indicator="dot" />
139
+ <ui-chart-legend />
140
+ </ui-chart-container>
141
+ ```
142
+
143
+ ### Tooltip formatting
144
+
145
+ `ui-chart-tooltip` is where most presentational customization lives.
146
+
147
+ ```html
148
+ <ui-chart-tooltip
149
+ [data]="activityData"
150
+ xKey="date"
151
+ indicator="line"
152
+ labelKey="views"
153
+ [labelFormatter]="longDateFormatter"
154
+ [formatter]="compactNumberFormatter" />
155
+ ```
156
+
157
+ Use `valueKey` for single-value radial and pie datasets, `hideLabel` when the card already provides the label context, and `indicator="none"` when you want a copy-first tooltip layout.
158
+
159
+ ### Per-row colors and active emphasis
160
+
161
+ Use `colorKey` when the dataset itself carries a color token such as `fill`, and use `activeKey` plus `activeValue` when one category should be visually emphasized without rewriting the whole series config.
162
+
163
+ ## API reference
164
+
165
+ ### `ChartContainer`
166
+
167
+ | Input | Type | Default |
168
+ | --------- | ---------------- | ---------------- |
169
+ | `config` | `ChartConfig` | — |
170
+ | `aspect` | `string` | `'aspect-video'` |
171
+ | `chartId` | `string \| null` | auto-generated |
172
+
173
+ `ChartConfig` is a readonly record of series keys to labels, icons, colors, or theme-aware light/dark color maps.
174
+
175
+ ```ts
176
+ type ChartConfig = Readonly<
177
+ Record<
178
+ string,
179
+ {
180
+ label?: string;
181
+ icon?: Type<unknown>;
182
+ color?: string;
183
+ theme?: Readonly<Record<'light' | 'dark', string>>;
184
+ }
185
+ >
186
+ >;
187
+ ```
188
+
189
+ ### Shared primitives
190
+
191
+ | Part | Key inputs | Notes |
192
+ | ------------------------ | -------------------------------------------------------------------------------------------------------- | --------------------------------------------------------------- |
193
+ | `svg:g[ui-chart-grid]` | none | Adds cartesian grid lines behind bar, line, and area charts. |
194
+ | `svg:g[ui-chart-axis-x]` | `tickCount`, `tickLine`, `tickFormat` | Categorical axis for cartesian layouts. |
195
+ | `svg:g[ui-chart-axis-y]` | `tickCount`, `tickLine`, `tickFormat` | Numeric axis for cartesian layouts. |
196
+ | `ui-chart-tooltip` | `data`, `xKey`, `valueKey`, `indicator`, `label`, `labelKey`, `labelFormatter`, `formatter`, `hideLabel` | Handles default tooltip layout plus custom template projection. |
197
+ | `ui-chart-legend` | none | Renders toggle buttons for visible series. |
198
+ | `ui-chart-zoom-controls` | none | Pair with zoomable line and scatter views. |
199
+ | `ui-pie-center` | projected content | Centers labels or KPIs inside pie layouts. |
200
+ | `ui-radial-center` | projected content | Centers labels or KPIs inside radial layouts. |
201
+
202
+ ### Chart families
203
+
204
+ | Selector | Key inputs |
205
+ | ------------------ | --------------------------------------------------------------------------------------------------- |
206
+ | `ui-bar-chart` | `data`, `xKey`, `orientation`, `variant`, `colorKey`, `activeKey`, `activeValue`, `showValueLabels` |
207
+ | `ui-line-chart` | `data`, `xKey`, `curve`, `showDots`, `dotRadius`, `showValueLabels` |
208
+ | `ui-area-chart` | `data`, `xKey`, `stacked`, `expanded`, `gradient`, `curve` |
209
+ | `ui-pie-chart` | `data`, `nameKey`, `valueKey`, `seriesKeys`, `innerRadius`, `activeIndex`, `activeOffset` |
210
+ | `ui-radar-chart` | `data`, `axisKey`, `curve`, `levels`, `grid`, `showLabels`, `showDots` |
211
+ | `ui-radial-chart` | `data`, `nameKey`, `valueKey`, `seriesKeys`, `maxValue`, `showTrack`, `showValueLabels` |
212
+ | `ui-scatter-chart` | `data`, `xKey`, `yKey`, `sizeKey`, `seriesKey`, `xDomain`, `yDomain` |
213
+
214
+ ## Styling and theming
215
+
216
+ - Prefer CSS variables such as `var(--chart-1)` and `var(--chart-2)` in `ChartConfig`. This matches the current shadcn guidance and the theme tokens shipped by this library.
217
+ - `ui-chart-container` scopes generated `--color-<series>` variables to the chart instance, so tooltip rows, legends, and series shapes stay aligned.
218
+ - Use `theme: { light, dark }` on a series config entry when the chart needs different values per color scheme.
219
+ - Keep the parent container responsible for width, and use the `aspect` input when the default `aspect-video` does not match the layout.
220
+ - Use `colorKey` only when the dataset should override per-series colors with a row-specific token such as `fill`.
221
+
222
+ ## Accessibility
223
+
224
+ - Chart hosts expose an `aria-label` summary describing the chart type, category count, and visible series.
225
+ - Interactive marks such as bars, dots, and slices are keyboard focusable where the layout supports activation.
226
+ - `ui-chart-tooltip` includes a polite live region so changing categories can be announced to assistive technology.
227
+ - `ui-chart-legend` uses native buttons with `aria-pressed` to reflect hidden and visible series state.
228
+ - Keep surrounding card copy descriptive so the chart has enough context when read outside its visual layout.
229
+
230
+ ## Keyboard interactions
231
+
232
+ - `Tab` reaches interactive bars, dots, slices, and legend toggle buttons.
233
+ - `Enter` and `Space` trigger the same click behavior as pointer activation on interactive marks.
234
+ - Focusing a supported data mark updates the shared active point so tooltip content stays reachable without hover.
235
+
236
+ ## Angular notes
237
+
238
+ - Keep chart config objects readonly and signal-friendly. A top-level `const` or signal-backed computed config works well.
239
+ - Every chart family must live inside `ui-chart-container`; that container provides dimensions, series visibility state, and scoped color variables to descendants.
240
+ - Use an explicit `chartId` when multiple charts of the same family appear on one page or when tests need a stable selector.
241
+ - The local shadcn mapping for Chart lives in the dedicated `/ui/chart` overview route with focused family demos under `/ui/chart/*`.
242
+
243
+ ## Source parity
244
+
245
+ This Angular package follows the shadcn Chart information architecture and theming concepts, but it does not mirror the React API one-to-one.
246
+
247
+ - shadcn uses Recharts components directly and layers `ChartTooltipContent` and `ChartLegendContent` around them.
248
+ - This Angular library ships standalone chart families plus shared primitives, so you compose `ui-chart-container`, the relevant `ui-*-chart`, `ui-chart-tooltip`, and `ui-chart-legend` instead of wiring Recharts JSX.
249
+ - The dedicated `/ui/chart/*` route group is the intentional local mapping for shadcn Chart in this repo; no duplicate `/ui/shadcn/chart` page is required.
@@ -0,0 +1,4 @@
1
+ {
2
+ "module": "../../../fesm2022/ojiepermana-angular-component-chart-area.mjs",
3
+ "typings": "../../../types/ojiepermana-angular-component-chart-area.d.ts"
4
+ }
@@ -0,0 +1,4 @@
1
+ {
2
+ "module": "../../../fesm2022/ojiepermana-angular-component-chart-bar.mjs",
3
+ "typings": "../../../types/ojiepermana-angular-component-chart-bar.d.ts"
4
+ }
@@ -0,0 +1,4 @@
1
+ {
2
+ "module": "../../../fesm2022/ojiepermana-angular-component-chart-line.mjs",
3
+ "typings": "../../../types/ojiepermana-angular-component-chart-line.d.ts"
4
+ }
@@ -0,0 +1,4 @@
1
+ {
2
+ "module": "../../fesm2022/ojiepermana-angular-component-chart.mjs",
3
+ "typings": "../../types/ojiepermana-angular-component-chart.d.ts"
4
+ }
@@ -0,0 +1,4 @@
1
+ {
2
+ "module": "../../../fesm2022/ojiepermana-angular-component-chart-pie.mjs",
3
+ "typings": "../../../types/ojiepermana-angular-component-chart-pie.d.ts"
4
+ }
@@ -0,0 +1,4 @@
1
+ {
2
+ "module": "../../../fesm2022/ojiepermana-angular-component-chart-radar.mjs",
3
+ "typings": "../../../types/ojiepermana-angular-component-chart-radar.d.ts"
4
+ }
@@ -0,0 +1,4 @@
1
+ {
2
+ "module": "../../../fesm2022/ojiepermana-angular-component-chart-radial.mjs",
3
+ "typings": "../../../types/ojiepermana-angular-component-chart-radial.d.ts"
4
+ }
@@ -0,0 +1,4 @@
1
+ {
2
+ "module": "../../../fesm2022/ojiepermana-angular-component-chart-scatter.mjs",
3
+ "typings": "../../../types/ojiepermana-angular-component-chart-scatter.d.ts"
4
+ }
@@ -0,0 +1,4 @@
1
+ {
2
+ "module": "../../fesm2022/ojiepermana-angular-component-checkbox.mjs",
3
+ "typings": "../../types/ojiepermana-angular-component-checkbox.d.ts"
4
+ }
@@ -0,0 +1,4 @@
1
+ {
2
+ "module": "../../fesm2022/ojiepermana-angular-component-collapsible.mjs",
3
+ "typings": "../../types/ojiepermana-angular-component-collapsible.d.ts"
4
+ }
@@ -0,0 +1,4 @@
1
+ {
2
+ "module": "../../fesm2022/ojiepermana-angular-component-combobox.mjs",
3
+ "typings": "../../types/ojiepermana-angular-component-combobox.d.ts"
4
+ }
@@ -0,0 +1,4 @@
1
+ {
2
+ "module": "../../fesm2022/ojiepermana-angular-component-command.mjs",
3
+ "typings": "../../types/ojiepermana-angular-component-command.d.ts"
4
+ }
@@ -0,0 +1,4 @@
1
+ {
2
+ "module": "../../fesm2022/ojiepermana-angular-component-context-menu.mjs",
3
+ "typings": "../../types/ojiepermana-angular-component-context-menu.d.ts"
4
+ }
@@ -0,0 +1,4 @@
1
+ {
2
+ "module": "../../fesm2022/ojiepermana-angular-component-date-picker.mjs",
3
+ "typings": "../../types/ojiepermana-angular-component-date-picker.d.ts"
4
+ }
@@ -0,0 +1,4 @@
1
+ {
2
+ "module": "../../fesm2022/ojiepermana-angular-component-dialog.mjs",
3
+ "typings": "../../types/ojiepermana-angular-component-dialog.d.ts"
4
+ }
@@ -0,0 +1,4 @@
1
+ {
2
+ "module": "../../fesm2022/ojiepermana-angular-component-drawer.mjs",
3
+ "typings": "../../types/ojiepermana-angular-component-drawer.d.ts"
4
+ }
@@ -0,0 +1,4 @@
1
+ {
2
+ "module": "../../fesm2022/ojiepermana-angular-component-dropdown-menu.mjs",
3
+ "typings": "../../types/ojiepermana-angular-component-dropdown-menu.d.ts"
4
+ }