@mesgflow/ui-kit 0.6.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 (230) hide show
  1. package/LICENSE +21 -0
  2. package/README.md +200 -0
  3. package/fesm2022/mesgflow-ui-kit-accordion.mjs +75 -0
  4. package/fesm2022/mesgflow-ui-kit-accordion.mjs.map +1 -0
  5. package/fesm2022/mesgflow-ui-kit-alert.mjs +165 -0
  6. package/fesm2022/mesgflow-ui-kit-alert.mjs.map +1 -0
  7. package/fesm2022/mesgflow-ui-kit-avatar-group.mjs +88 -0
  8. package/fesm2022/mesgflow-ui-kit-avatar-group.mjs.map +1 -0
  9. package/fesm2022/mesgflow-ui-kit-avatar.mjs +123 -0
  10. package/fesm2022/mesgflow-ui-kit-avatar.mjs.map +1 -0
  11. package/fesm2022/mesgflow-ui-kit-badge.mjs +68 -0
  12. package/fesm2022/mesgflow-ui-kit-badge.mjs.map +1 -0
  13. package/fesm2022/mesgflow-ui-kit-banner.mjs +111 -0
  14. package/fesm2022/mesgflow-ui-kit-banner.mjs.map +1 -0
  15. package/fesm2022/mesgflow-ui-kit-box-input.mjs +78 -0
  16. package/fesm2022/mesgflow-ui-kit-box-input.mjs.map +1 -0
  17. package/fesm2022/mesgflow-ui-kit-brand.mjs +120 -0
  18. package/fesm2022/mesgflow-ui-kit-brand.mjs.map +1 -0
  19. package/fesm2022/mesgflow-ui-kit-breadcrumb.mjs +84 -0
  20. package/fesm2022/mesgflow-ui-kit-breadcrumb.mjs.map +1 -0
  21. package/fesm2022/mesgflow-ui-kit-button-group.mjs +37 -0
  22. package/fesm2022/mesgflow-ui-kit-button-group.mjs.map +1 -0
  23. package/fesm2022/mesgflow-ui-kit-button.mjs +359 -0
  24. package/fesm2022/mesgflow-ui-kit-button.mjs.map +1 -0
  25. package/fesm2022/mesgflow-ui-kit-card.mjs +128 -0
  26. package/fesm2022/mesgflow-ui-kit-card.mjs.map +1 -0
  27. package/fesm2022/mesgflow-ui-kit-chart.mjs +538 -0
  28. package/fesm2022/mesgflow-ui-kit-chart.mjs.map +1 -0
  29. package/fesm2022/mesgflow-ui-kit-checkbox.mjs +45 -0
  30. package/fesm2022/mesgflow-ui-kit-checkbox.mjs.map +1 -0
  31. package/fesm2022/mesgflow-ui-kit-chip.mjs +123 -0
  32. package/fesm2022/mesgflow-ui-kit-chip.mjs.map +1 -0
  33. package/fesm2022/mesgflow-ui-kit-code-block.mjs +71 -0
  34. package/fesm2022/mesgflow-ui-kit-code-block.mjs.map +1 -0
  35. package/fesm2022/mesgflow-ui-kit-collapsible.mjs +89 -0
  36. package/fesm2022/mesgflow-ui-kit-collapsible.mjs.map +1 -0
  37. package/fesm2022/mesgflow-ui-kit-color-picker.mjs +210 -0
  38. package/fesm2022/mesgflow-ui-kit-color-picker.mjs.map +1 -0
  39. package/fesm2022/mesgflow-ui-kit-combobox.mjs +181 -0
  40. package/fesm2022/mesgflow-ui-kit-combobox.mjs.map +1 -0
  41. package/fesm2022/mesgflow-ui-kit-command.mjs +491 -0
  42. package/fesm2022/mesgflow-ui-kit-command.mjs.map +1 -0
  43. package/fesm2022/mesgflow-ui-kit-context-menu.mjs +92 -0
  44. package/fesm2022/mesgflow-ui-kit-context-menu.mjs.map +1 -0
  45. package/fesm2022/mesgflow-ui-kit-copy-button.mjs +167 -0
  46. package/fesm2022/mesgflow-ui-kit-copy-button.mjs.map +1 -0
  47. package/fesm2022/mesgflow-ui-kit-core.mjs +624 -0
  48. package/fesm2022/mesgflow-ui-kit-core.mjs.map +1 -0
  49. package/fesm2022/mesgflow-ui-kit-date-picker.mjs +643 -0
  50. package/fesm2022/mesgflow-ui-kit-date-picker.mjs.map +1 -0
  51. package/fesm2022/mesgflow-ui-kit-description-list.mjs +76 -0
  52. package/fesm2022/mesgflow-ui-kit-description-list.mjs.map +1 -0
  53. package/fesm2022/mesgflow-ui-kit-dialog.mjs +700 -0
  54. package/fesm2022/mesgflow-ui-kit-dialog.mjs.map +1 -0
  55. package/fesm2022/mesgflow-ui-kit-divider.mjs +62 -0
  56. package/fesm2022/mesgflow-ui-kit-divider.mjs.map +1 -0
  57. package/fesm2022/mesgflow-ui-kit-dropzone.mjs +126 -0
  58. package/fesm2022/mesgflow-ui-kit-dropzone.mjs.map +1 -0
  59. package/fesm2022/mesgflow-ui-kit-empty-state.mjs +70 -0
  60. package/fesm2022/mesgflow-ui-kit-empty-state.mjs.map +1 -0
  61. package/fesm2022/mesgflow-ui-kit-field.mjs +42 -0
  62. package/fesm2022/mesgflow-ui-kit-field.mjs.map +1 -0
  63. package/fesm2022/mesgflow-ui-kit-hover-card.mjs +171 -0
  64. package/fesm2022/mesgflow-ui-kit-hover-card.mjs.map +1 -0
  65. package/fesm2022/mesgflow-ui-kit-i18n-tr.mjs +258 -0
  66. package/fesm2022/mesgflow-ui-kit-i18n-tr.mjs.map +1 -0
  67. package/fesm2022/mesgflow-ui-kit-icon.mjs +174 -0
  68. package/fesm2022/mesgflow-ui-kit-icon.mjs.map +1 -0
  69. package/fesm2022/mesgflow-ui-kit-input.mjs +448 -0
  70. package/fesm2022/mesgflow-ui-kit-input.mjs.map +1 -0
  71. package/fesm2022/mesgflow-ui-kit-kbd.mjs +24 -0
  72. package/fesm2022/mesgflow-ui-kit-kbd.mjs.map +1 -0
  73. package/fesm2022/mesgflow-ui-kit-link.mjs +48 -0
  74. package/fesm2022/mesgflow-ui-kit-link.mjs.map +1 -0
  75. package/fesm2022/mesgflow-ui-kit-menu.mjs +105 -0
  76. package/fesm2022/mesgflow-ui-kit-menu.mjs.map +1 -0
  77. package/fesm2022/mesgflow-ui-kit-number-input.mjs +153 -0
  78. package/fesm2022/mesgflow-ui-kit-number-input.mjs.map +1 -0
  79. package/fesm2022/mesgflow-ui-kit-otp-input.mjs +164 -0
  80. package/fesm2022/mesgflow-ui-kit-otp-input.mjs.map +1 -0
  81. package/fesm2022/mesgflow-ui-kit-page-header.mjs +83 -0
  82. package/fesm2022/mesgflow-ui-kit-page-header.mjs.map +1 -0
  83. package/fesm2022/mesgflow-ui-kit-pagination.mjs +99 -0
  84. package/fesm2022/mesgflow-ui-kit-pagination.mjs.map +1 -0
  85. package/fesm2022/mesgflow-ui-kit-password-input.mjs +120 -0
  86. package/fesm2022/mesgflow-ui-kit-password-input.mjs.map +1 -0
  87. package/fesm2022/mesgflow-ui-kit-popover.mjs +213 -0
  88. package/fesm2022/mesgflow-ui-kit-popover.mjs.map +1 -0
  89. package/fesm2022/mesgflow-ui-kit-progress.mjs +82 -0
  90. package/fesm2022/mesgflow-ui-kit-progress.mjs.map +1 -0
  91. package/fesm2022/mesgflow-ui-kit-radio.mjs +123 -0
  92. package/fesm2022/mesgflow-ui-kit-radio.mjs.map +1 -0
  93. package/fesm2022/mesgflow-ui-kit-rating.mjs +116 -0
  94. package/fesm2022/mesgflow-ui-kit-rating.mjs.map +1 -0
  95. package/fesm2022/mesgflow-ui-kit-scroll-area.mjs +84 -0
  96. package/fesm2022/mesgflow-ui-kit-scroll-area.mjs.map +1 -0
  97. package/fesm2022/mesgflow-ui-kit-search-input.mjs +154 -0
  98. package/fesm2022/mesgflow-ui-kit-search-input.mjs.map +1 -0
  99. package/fesm2022/mesgflow-ui-kit-segmented-control.mjs +95 -0
  100. package/fesm2022/mesgflow-ui-kit-segmented-control.mjs.map +1 -0
  101. package/fesm2022/mesgflow-ui-kit-select.mjs +227 -0
  102. package/fesm2022/mesgflow-ui-kit-select.mjs.map +1 -0
  103. package/fesm2022/mesgflow-ui-kit-sidebar.mjs +449 -0
  104. package/fesm2022/mesgflow-ui-kit-sidebar.mjs.map +1 -0
  105. package/fesm2022/mesgflow-ui-kit-skeleton.mjs +74 -0
  106. package/fesm2022/mesgflow-ui-kit-skeleton.mjs.map +1 -0
  107. package/fesm2022/mesgflow-ui-kit-slider.mjs +179 -0
  108. package/fesm2022/mesgflow-ui-kit-slider.mjs.map +1 -0
  109. package/fesm2022/mesgflow-ui-kit-spinner.mjs +67 -0
  110. package/fesm2022/mesgflow-ui-kit-spinner.mjs.map +1 -0
  111. package/fesm2022/mesgflow-ui-kit-splitter.mjs +97 -0
  112. package/fesm2022/mesgflow-ui-kit-splitter.mjs.map +1 -0
  113. package/fesm2022/mesgflow-ui-kit-stat-tile.mjs +98 -0
  114. package/fesm2022/mesgflow-ui-kit-stat-tile.mjs.map +1 -0
  115. package/fesm2022/mesgflow-ui-kit-stepper.mjs +133 -0
  116. package/fesm2022/mesgflow-ui-kit-stepper.mjs.map +1 -0
  117. package/fesm2022/mesgflow-ui-kit-switch.mjs +73 -0
  118. package/fesm2022/mesgflow-ui-kit-switch.mjs.map +1 -0
  119. package/fesm2022/mesgflow-ui-kit-table.mjs +1783 -0
  120. package/fesm2022/mesgflow-ui-kit-table.mjs.map +1 -0
  121. package/fesm2022/mesgflow-ui-kit-tabs.mjs +569 -0
  122. package/fesm2022/mesgflow-ui-kit-tabs.mjs.map +1 -0
  123. package/fesm2022/mesgflow-ui-kit-tag-input.mjs +138 -0
  124. package/fesm2022/mesgflow-ui-kit-tag-input.mjs.map +1 -0
  125. package/fesm2022/mesgflow-ui-kit-theme-switcher.mjs +53 -0
  126. package/fesm2022/mesgflow-ui-kit-theme-switcher.mjs.map +1 -0
  127. package/fesm2022/mesgflow-ui-kit-theming.mjs +1016 -0
  128. package/fesm2022/mesgflow-ui-kit-theming.mjs.map +1 -0
  129. package/fesm2022/mesgflow-ui-kit-time-picker.mjs +138 -0
  130. package/fesm2022/mesgflow-ui-kit-time-picker.mjs.map +1 -0
  131. package/fesm2022/mesgflow-ui-kit-timeline.mjs +91 -0
  132. package/fesm2022/mesgflow-ui-kit-timeline.mjs.map +1 -0
  133. package/fesm2022/mesgflow-ui-kit-toast.mjs +202 -0
  134. package/fesm2022/mesgflow-ui-kit-toast.mjs.map +1 -0
  135. package/fesm2022/mesgflow-ui-kit-toggle.mjs +243 -0
  136. package/fesm2022/mesgflow-ui-kit-toggle.mjs.map +1 -0
  137. package/fesm2022/mesgflow-ui-kit-toolbar.mjs +99 -0
  138. package/fesm2022/mesgflow-ui-kit-toolbar.mjs.map +1 -0
  139. package/fesm2022/mesgflow-ui-kit-tooltip.mjs +160 -0
  140. package/fesm2022/mesgflow-ui-kit-tooltip.mjs.map +1 -0
  141. package/fesm2022/mesgflow-ui-kit-tour.mjs +272 -0
  142. package/fesm2022/mesgflow-ui-kit-tour.mjs.map +1 -0
  143. package/fesm2022/mesgflow-ui-kit-tree-select.mjs +177 -0
  144. package/fesm2022/mesgflow-ui-kit-tree-select.mjs.map +1 -0
  145. package/fesm2022/mesgflow-ui-kit-tree.mjs +82 -0
  146. package/fesm2022/mesgflow-ui-kit-tree.mjs.map +1 -0
  147. package/fesm2022/mesgflow-ui-kit.mjs +12851 -0
  148. package/fesm2022/mesgflow-ui-kit.mjs.map +1 -0
  149. package/package.json +374 -0
  150. package/preset.css +20 -0
  151. package/tokens/color.css +693 -0
  152. package/tokens/contrast.css +68 -0
  153. package/tokens/elevation.css +68 -0
  154. package/tokens/motion.css +277 -0
  155. package/tokens/radius.css +69 -0
  156. package/tokens/typography.css +127 -0
  157. package/tokens.css +41 -0
  158. package/types/mesgflow-ui-kit-accordion.d.ts +42 -0
  159. package/types/mesgflow-ui-kit-alert.d.ts +60 -0
  160. package/types/mesgflow-ui-kit-avatar-group.d.ts +28 -0
  161. package/types/mesgflow-ui-kit-avatar.d.ts +23 -0
  162. package/types/mesgflow-ui-kit-badge.d.ts +39 -0
  163. package/types/mesgflow-ui-kit-banner.d.ts +42 -0
  164. package/types/mesgflow-ui-kit-box-input.d.ts +45 -0
  165. package/types/mesgflow-ui-kit-brand.d.ts +48 -0
  166. package/types/mesgflow-ui-kit-breadcrumb.d.ts +26 -0
  167. package/types/mesgflow-ui-kit-button-group.d.ts +17 -0
  168. package/types/mesgflow-ui-kit-button.d.ts +75 -0
  169. package/types/mesgflow-ui-kit-card.d.ts +71 -0
  170. package/types/mesgflow-ui-kit-chart.d.ts +242 -0
  171. package/types/mesgflow-ui-kit-checkbox.d.ts +17 -0
  172. package/types/mesgflow-ui-kit-chip.d.ts +46 -0
  173. package/types/mesgflow-ui-kit-code-block.d.ts +56 -0
  174. package/types/mesgflow-ui-kit-collapsible.d.ts +39 -0
  175. package/types/mesgflow-ui-kit-color-picker.d.ts +78 -0
  176. package/types/mesgflow-ui-kit-combobox.d.ts +74 -0
  177. package/types/mesgflow-ui-kit-command.d.ts +185 -0
  178. package/types/mesgflow-ui-kit-context-menu.d.ts +40 -0
  179. package/types/mesgflow-ui-kit-copy-button.d.ts +47 -0
  180. package/types/mesgflow-ui-kit-core.d.ts +508 -0
  181. package/types/mesgflow-ui-kit-date-picker.d.ts +215 -0
  182. package/types/mesgflow-ui-kit-description-list.d.ts +23 -0
  183. package/types/mesgflow-ui-kit-dialog.d.ts +342 -0
  184. package/types/mesgflow-ui-kit-divider.d.ts +23 -0
  185. package/types/mesgflow-ui-kit-dropzone.d.ts +47 -0
  186. package/types/mesgflow-ui-kit-empty-state.d.ts +18 -0
  187. package/types/mesgflow-ui-kit-field.d.ts +26 -0
  188. package/types/mesgflow-ui-kit-hover-card.d.ts +52 -0
  189. package/types/mesgflow-ui-kit-i18n-tr.d.ts +14 -0
  190. package/types/mesgflow-ui-kit-icon.d.ts +76 -0
  191. package/types/mesgflow-ui-kit-input.d.ts +186 -0
  192. package/types/mesgflow-ui-kit-kbd.d.ts +9 -0
  193. package/types/mesgflow-ui-kit-link.d.ts +20 -0
  194. package/types/mesgflow-ui-kit-menu.d.ts +53 -0
  195. package/types/mesgflow-ui-kit-number-input.d.ts +55 -0
  196. package/types/mesgflow-ui-kit-otp-input.d.ts +44 -0
  197. package/types/mesgflow-ui-kit-page-header.d.ts +31 -0
  198. package/types/mesgflow-ui-kit-pagination.d.ts +50 -0
  199. package/types/mesgflow-ui-kit-password-input.d.ts +33 -0
  200. package/types/mesgflow-ui-kit-popover.d.ts +62 -0
  201. package/types/mesgflow-ui-kit-progress.d.ts +32 -0
  202. package/types/mesgflow-ui-kit-radio.d.ts +59 -0
  203. package/types/mesgflow-ui-kit-rating.d.ts +56 -0
  204. package/types/mesgflow-ui-kit-scroll-area.d.ts +27 -0
  205. package/types/mesgflow-ui-kit-search-input.d.ts +72 -0
  206. package/types/mesgflow-ui-kit-segmented-control.d.ts +54 -0
  207. package/types/mesgflow-ui-kit-select.d.ts +89 -0
  208. package/types/mesgflow-ui-kit-sidebar.d.ts +224 -0
  209. package/types/mesgflow-ui-kit-skeleton.d.ts +29 -0
  210. package/types/mesgflow-ui-kit-slider.d.ts +40 -0
  211. package/types/mesgflow-ui-kit-spinner.d.ts +31 -0
  212. package/types/mesgflow-ui-kit-splitter.d.ts +40 -0
  213. package/types/mesgflow-ui-kit-stat-tile.d.ts +54 -0
  214. package/types/mesgflow-ui-kit-stepper.d.ts +48 -0
  215. package/types/mesgflow-ui-kit-switch.d.ts +34 -0
  216. package/types/mesgflow-ui-kit-table.d.ts +805 -0
  217. package/types/mesgflow-ui-kit-tabs.d.ts +269 -0
  218. package/types/mesgflow-ui-kit-tag-input.d.ts +33 -0
  219. package/types/mesgflow-ui-kit-theme-switcher.d.ts +27 -0
  220. package/types/mesgflow-ui-kit-theming.d.ts +745 -0
  221. package/types/mesgflow-ui-kit-time-picker.d.ts +54 -0
  222. package/types/mesgflow-ui-kit-timeline.d.ts +27 -0
  223. package/types/mesgflow-ui-kit-toast.d.ts +94 -0
  224. package/types/mesgflow-ui-kit-toggle.d.ts +110 -0
  225. package/types/mesgflow-ui-kit-toolbar.d.ts +52 -0
  226. package/types/mesgflow-ui-kit-tooltip.d.ts +55 -0
  227. package/types/mesgflow-ui-kit-tour.d.ts +66 -0
  228. package/types/mesgflow-ui-kit-tree-select.d.ts +65 -0
  229. package/types/mesgflow-ui-kit-tree.d.ts +44 -0
  230. package/types/mesgflow-ui-kit.d.ts +5444 -0
@@ -0,0 +1 @@
1
+ {"version":3,"file":"mesgflow-ui-kit-sidebar.mjs","sources":["../../../projects/ui-kit/sidebar/sidebar.variants.ts","../../../projects/ui-kit/sidebar/sidebar-nav-item.ts","../../../projects/ui-kit/sidebar/sidebar-nav-item.html","../../../projects/ui-kit/sidebar/sidebar-tenant-switcher.ts","../../../projects/ui-kit/sidebar/sidebar-tenant-switcher.html","../../../projects/ui-kit/sidebar/sidebar-user-menu.ts","../../../projects/ui-kit/sidebar/sidebar-user-menu.html","../../../projects/ui-kit/sidebar/sidebar.ts","../../../projects/ui-kit/sidebar/sidebar.html","../../../projects/ui-kit/sidebar/mesgflow-ui-kit-sidebar.ts"],"sourcesContent":["import { cva, type VariantProps } from 'class-variance-authority';\r\n\r\n/**\r\n * Kök panel: kart değil, yapısal/kenar-kenara chrome — `shadow-*`/`rounded-*`\r\n * YOK. `bg-chrome` (styles.css'te tanımlı, moda göre 975/950 basamağı arasında\r\n * takas olan yüzey rolü) — dark modda uygulamanın EN KOYU tonu, \"chrome her\r\n * zaman içerikten koyu\" kuralının kaynağı. Kenar artık `border-hairline`\r\n * (border-first depth, 2026-09 Deep Emerald geçişi) — `border-e` UZUN-EL\r\n * yazıldı (`border-e-hairline`, kısaltma DEĞİL) ki `appearance=\"brand\"`'ın\r\n * `border-e-transparent`'ı AYNI özgüllükte, cascade sırasına bağlı olmadan\r\n * güvenle üstüne yazabilsin.\r\n *\r\n * `appearance: 'chrome' | 'brand' | 'brand-light'` — `group/sidebar` + kök\r\n * elementteki `data-appearance` ATTRIBUTE'u (bkz. sidebar.html), alt\r\n * bileşenler kendi class'larına yeni bir input EKLEMEDEN\r\n * `group-data-[appearance=brand]/sidebar:`/`group-data-[appearance=brand-light]/sidebar:`\r\n * varyantıyla opt-in eder — CDK overlay'e (flyout/tenant listesi) taşınan\r\n * içerik bu grubun TORUNU DEĞİLDİR, bu yüzden overlay panelleri bilerek\r\n * katı `chrome` kalır (istenen: aşırı marka rengi overlay'lerde yorucu olur).\r\n *\r\n * `brand-light` — kullanıcı isteğiyle eklendi (varsayılan HÂLÂ `chrome`,\r\n * `brand`'in KENDİSİ birebir korunuyor — bu SADECE üçüncü bir seçenek):\r\n * `brand`in \"her adımda bir basamak açığa doğru\" desenini primary rampasının\r\n * AÇIK ucuna yansıtır (900→100, 800→200, 300→700, beyaz→900 gibi) — aynı\r\n * \"iki modda AYNI, marka her zaman sabit\" felsefesi, sadece açık zeminde.\r\n * `primary-100` `neutral-100` canvas'a karşı yalnızca 1.08:1 (saf L farkı) —\r\n * `brand`in aksine (900 her zeminden zaten kopuyor) burada kenarlık BİLEREK\r\n * KORUNUYOR (`border-e-primary-200`) ki blok net ayrışsın.\r\n */\r\nexport const sidebarVariants = cva(\r\n /*\r\n * `overflow-hidden` BİLEREK yok — kenar toggle butonu bu kutunun dışına\r\n * taşarak (`-end-3`) sınırı \"kucaklıyor\" (Notion/Linear deseni), kırpma\r\n * kök elementte olsaydı kendi toggle'ını keserdi. İç içerik (tenant/nav/\r\n * kullanıcı sütunu) genişlik geçişi sırasında taşma göstermesin diye kendi\r\n * `overflow-hidden`'ını sidebar.html'de ayrı bir iç wrapper'da taşıyor.\r\n */\r\n 'group/sidebar relative flex h-full flex-col border-e border-e-hairline bg-chrome transition-[width] duration-base ease-out',\r\n {\r\n variants: {\r\n collapsed: {\r\n true: 'w-[72px]',\r\n false: 'w-64',\r\n },\r\n appearance: {\r\n chrome: '',\r\n /** Marka kenar çubuğu — kök zemini iki modda da primary-900 (#062c22, kullanıcının \"primer\"i), kenarlık gizlenir (zemin zaten belirgin bir blok). */\r\n brand: 'border-e-transparent bg-primary-900',\r\n /** Marka kenar çubuğu, AÇIK — kök zemini iki modda da primary-100, kenarlık KORUNUR (bkz. yukarıdaki doc). */\r\n 'brand-light': 'border-e-primary-200 bg-primary-100',\r\n },\r\n },\r\n defaultVariants: { collapsed: false, appearance: 'chrome' },\r\n },\r\n);\r\n\r\n/**\r\n * Nav satırı (leaf veya parent-toggle) — `rounded-sm`(6px, menü öğesi kademesi,\r\n * bkz. styles.css radius notu), panel değil kontrol. `border-s-2 border-s-\r\n * transparent` BASE'te HER ZAMAN rezerve — aktif olunca sadece rengi değişir,\r\n * yoksa 2px'lik ray aktifleşirken satırın geri kalanı kayardı (layout shift).\r\n *\r\n * Brand sınıfları (`group-data-[appearance=brand]/sidebar:…`) özgüllükte\r\n * (0,2,0) — düz `text-fg-muted`/`hover:bg-surface-alt` (0,1,0) ve `dark:`\r\n * (0,1,0) varyantlarının HER İKİSİNİ de cascade sırasından bağımsız yener,\r\n * bu yüzden ayrı bir `dark:` ikizi yazmaya gerek yok (brand görünümü iki\r\n * modda da AYNI).\r\n */\r\nexport const sidebarNavItemVariants = cva(\r\n 'group flex w-full appearance-none items-center gap-3 rounded-sm border-0 border-s-2 border-s-transparent bg-transparent px-3 py-2 text-start text-sm font-medium ' +\r\n 'text-fg-muted transition-colors duration-fast ease-emphasis hover:bg-surface-alt hover:text-fg ' +\r\n 'focus-visible:outline focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-focus-ring ' +\r\n 'group-data-[appearance=brand]/sidebar:text-primary-200 ' +\r\n 'group-data-[appearance=brand]/sidebar:hover:bg-primary-800 group-data-[appearance=brand]/sidebar:hover:text-primary-50 ' +\r\n 'group-data-[appearance=brand]/sidebar:focus-visible:outline-primary-300 ' +\r\n 'group-data-[appearance=brand-light]/sidebar:text-primary-800 ' +\r\n 'group-data-[appearance=brand-light]/sidebar:hover:bg-primary-200 group-data-[appearance=brand-light]/sidebar:hover:text-primary-900 ' +\r\n 'group-data-[appearance=brand-light]/sidebar:focus-visible:outline-primary-700',\r\n {\r\n variants: {\r\n /*\r\n * \"Ray\" — bu tazelemenin imza motiflerinden biri (bkz. plan): dolu\r\n * yeşil sol çizgi + tonal işaret zemini, SADECE \"buradasın\" anlamında\r\n * kullanılıyor (sidebar aktif öğe, aktif sekme, seçili tablo satırı —\r\n * başka HİÇBİR yerde). Rol token'ı (`bg-primary-tint text-primary-tint-fg`,\r\n * badge/avatar ile aynı dil) — `color-mix()` her iki modu da TEK satırda\r\n * çözer, ayrı bir `dark:` ikizi YOK.\r\n */\r\n active: {\r\n true:\r\n 'border-s-accent-fill bg-primary-tint text-primary-tint-fg hover:bg-primary-tint hover:text-primary-tint-fg ' +\r\n 'group-data-[appearance=brand]/sidebar:border-s-primary-300 group-data-[appearance=brand]/sidebar:bg-primary-800 ' +\r\n 'group-data-[appearance=brand]/sidebar:text-white group-data-[appearance=brand]/sidebar:hover:bg-primary-800 ' +\r\n 'group-data-[appearance=brand]/sidebar:hover:text-white ' +\r\n 'group-data-[appearance=brand-light]/sidebar:border-s-primary-700 group-data-[appearance=brand-light]/sidebar:bg-primary-200 ' +\r\n 'group-data-[appearance=brand-light]/sidebar:text-primary-900 group-data-[appearance=brand-light]/sidebar:hover:bg-primary-200 ' +\r\n 'group-data-[appearance=brand-light]/sidebar:hover:text-primary-900',\r\n false: '',\r\n },\r\n collapsed: {\r\n true: 'justify-center px-0',\r\n false: '',\r\n },\r\n },\r\n compoundVariants: [\r\n // Daraltılmış (icon-only, 72px) haldeyken ray bastırılıyor — ikonu\r\n // merkeze göre 2px kaydırırdı, dar/simetrik bir rayda yeri yok. Tonal\r\n // zemin (bg-primary-tint, brand'de primary-800) tek başına yeterli\r\n // \"aktif\" sinyali veriyor.\r\n {\r\n active: true,\r\n collapsed: true,\r\n class:\r\n 'border-s-transparent group-data-[appearance=brand]/sidebar:border-s-transparent ' +\r\n 'group-data-[appearance=brand-light]/sidebar:border-s-transparent',\r\n },\r\n ],\r\n defaultVariants: { active: false, collapsed: false },\r\n },\r\n);\r\n\r\nexport type SidebarCollapsedVariant = VariantProps<typeof sidebarVariants>['collapsed'];\r\nexport type SidebarAppearance = NonNullable<VariantProps<typeof sidebarVariants>['appearance']>;\r\n","import { OverlayModule } from '@angular/cdk/overlay';\r\nimport { Component, computed, input, output, signal } from '@angular/core';\r\nimport { cn } from '@mesgflow/ui-kit/core';\r\nimport { Icon } from '@mesgflow/ui-kit/icon';\r\nimport { Popover } from '@mesgflow/ui-kit/popover';\r\nimport { Tooltip } from '@mesgflow/ui-kit/tooltip';\r\nimport { sidebarNavItemVariants } from './sidebar.variants';\r\nimport type { SidebarNavItem as SidebarNavItemModel } from './sidebar.model';\r\n\r\n/** Genişkenken akordeonda açılan çocuk satırı — brand görünümde metin/hover/odak marka tonlu (bkz. sidebar.variants.ts doc'u, aynı özgüllük mantığı). */\r\nconst CHILD_ROW_BASE =\r\n 'flex w-full appearance-none items-center gap-3 rounded-sm border-0 bg-transparent py-1.5 pe-3 ps-9 text-start text-label text-fg-muted transition-colors duration-fast ease-emphasis hover:bg-surface-alt hover:text-fg focus-visible:outline focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-focus-ring ' +\r\n 'group-data-[appearance=brand]/sidebar:text-primary-300 group-data-[appearance=brand]/sidebar:hover:bg-primary-800 ' +\r\n 'group-data-[appearance=brand]/sidebar:hover:text-primary-50 group-data-[appearance=brand]/sidebar:focus-visible:outline-primary-300 ' +\r\n 'group-data-[appearance=brand-light]/sidebar:text-primary-700 group-data-[appearance=brand-light]/sidebar:hover:bg-primary-200 ' +\r\n 'group-data-[appearance=brand-light]/sidebar:hover:text-primary-900 group-data-[appearance=brand-light]/sidebar:focus-visible:outline-primary-700';\r\n\r\n/**\r\n * Tek nav satırı — yaprak veya çocuklu (parent). Sadece 1 seviye nesting\r\n * (çocuğun çocuğu render edilmiyor, YAGNI). Genişkenken parent'a tıklayınca\r\n * çocuklar CSS-only grid-rows akordeonuyla İÇERİDE açılır (her grup bağımsız,\r\n * root `Sidebar`'ın `expandedIds` set'i tarafından yönetilir). Daraltılmışken\r\n * aynı satıra TIKLAYINCA (hover değil — kullanıcı kararı) sağda bir `Popover`\r\n * flyout paneli çocukları listeler (bkz. plan Faz 1c).\r\n */\r\n@Component({\r\n selector: 'mf-sidebar-nav-item',\r\n imports: [Icon, OverlayModule, Popover, Tooltip],\r\n host: { class: 'contents' },\r\n templateUrl: './sidebar-nav-item.html',\r\n})\r\nexport class SidebarNavItemRow {\r\n readonly item = input.required<SidebarNavItemModel>();\r\n readonly collapsed = input(false);\r\n readonly activeItemId = input<string | null>(null);\r\n /** Genişkenken akordeon açık/kapalı durumu — root Sidebar tarafından kontrol edilir. */\r\n readonly expanded = input(false);\r\n\r\n readonly activate = output<SidebarNavItemModel>();\r\n readonly toggleExpand = output<string>();\r\n\r\n protected readonly hasChildren = computed(() => (this.item().children?.length ?? 0) > 0);\r\n protected readonly isActive = computed(() => {\r\n const id = this.activeItemId();\r\n return this.item().id === id || (this.item().children?.some((c) => c.id === id) ?? false);\r\n });\r\n\r\n protected readonly rowClasses = computed(() =>\r\n cn(sidebarNavItemVariants({ active: this.isActive(), collapsed: this.collapsed() })),\r\n );\r\n\r\n protected readonly flyoutOpen = signal(false);\r\n\r\n protected onRowClick(): void {\r\n if (this.hasChildren()) {\r\n if (this.collapsed()) {\r\n this.flyoutOpen.update((v) => !v);\r\n } else {\r\n this.toggleExpand.emit(this.item().id);\r\n }\r\n return;\r\n }\r\n this.activate.emit(this.item());\r\n }\r\n\r\n protected childRowClasses(child: SidebarNavItemModel): string {\r\n return cn(\r\n CHILD_ROW_BASE,\r\n child.id === this.activeItemId() &&\r\n 'text-accent group-data-[appearance=brand]/sidebar:text-white ' +\r\n 'group-data-[appearance=brand-light]/sidebar:text-primary-900',\r\n );\r\n }\r\n\r\n protected onChildClick(child: SidebarNavItemModel): void {\r\n this.activate.emit(child);\r\n this.closeFlyout();\r\n }\r\n\r\n protected closeFlyout(): void {\r\n this.flyoutOpen.set(false);\r\n }\r\n}\r\n","<button\r\n type=\"button\"\r\n cdkOverlayOrigin\r\n #origin=\"cdkOverlayOrigin\"\r\n [class]=\"rowClasses()\"\r\n [attr.aria-expanded]=\"hasChildren() && !collapsed() ? expanded() : null\"\r\n [attr.aria-current]=\"isActive() && !hasChildren() ? 'page' : null\"\r\n [attr.aria-label]=\"collapsed() ? item().label : null\"\r\n [mfTooltip]=\"collapsed() ? item().label : ''\"\r\n tooltipPosition=\"right\"\r\n (click)=\"onRowClick()\"\r\n>\r\n <span mfIcon [size]=\"20\" [filled]=\"isActive()\">{{ item().icon }}</span>\r\n\r\n @if (!collapsed()) {\r\n <span class=\"min-w-0 flex-1 truncate\">{{ item().label }}</span>\r\n @if (item().badge !== undefined) {\r\n <span\r\n class=\"rounded-full bg-primary-tint px-1.5 py-0.5 font-mono text-eyebrow text-primary-tint-fg group-data-[appearance=brand]/sidebar:bg-primary-800 group-data-[appearance=brand]/sidebar:text-primary-100 group-data-[appearance=brand-light]/sidebar:bg-primary-200 group-data-[appearance=brand-light]/sidebar:text-primary-800\"\r\n >\r\n {{ item().badge }}\r\n </span>\r\n }\r\n @if (hasChildren()) {\r\n <span\r\n mfIcon\r\n [size]=\"16\"\r\n class=\"shrink-0 text-fg-subtle transition-transform duration-base group-data-[appearance=brand]/sidebar:text-primary-300 group-data-[appearance=brand-light]/sidebar:text-primary-700 rtl:-scale-x-100\"\r\n [class.rotate-90]=\"expanded()\"\r\n [class.rtl:-rotate-90]=\"expanded()\"\r\n >\r\n chevron_right\r\n </span>\r\n }\r\n }\r\n</button>\r\n\r\n@if (hasChildren() && !collapsed()) {\r\n <div\r\n class=\"grid overflow-hidden transition-[grid-template-rows] duration-base ease-out\"\r\n [style.grid-template-rows]=\"expanded() ? '1fr' : '0fr'\"\r\n [attr.inert]=\"expanded() ? null : true\"\r\n >\r\n <ul class=\"m-0 min-h-0 list-none overflow-hidden p-0\">\r\n @for (child of item().children; track child.id) {\r\n <li>\r\n <button type=\"button\" [class]=\"childRowClasses(child)\" (click)=\"onChildClick(child)\">\r\n <span mfIcon [size]=\"16\">{{ child.icon }}</span>\r\n <span class=\"truncate\">{{ child.label }}</span>\r\n </button>\r\n </li>\r\n }\r\n </ul>\r\n </div>\r\n}\r\n\r\n@if (hasChildren() && collapsed()) {\r\n <mf-popover\r\n [origin]=\"origin\"\r\n [open]=\"flyoutOpen()\"\r\n placement=\"right-start\"\r\n padding=\"sm\"\r\n panelClass=\"min-w-48\"\r\n (closed)=\"closeFlyout()\"\r\n >\r\n <div role=\"menu\" [attr.aria-label]=\"item().label\">\r\n <p class=\"truncate px-2.5 py-1.5 text-eyebrow text-fg-subtle\">{{ item().label }}</p>\r\n @for (child of item().children; track child.id) {\r\n <button\r\n type=\"button\"\r\n role=\"menuitem\"\r\n class=\"flex w-full appearance-none items-center gap-2.5 rounded-sm border-0 bg-transparent px-2.5 py-1.5 text-start text-sm font-medium text-fg-muted transition-colors duration-fast ease-emphasis hover:bg-surface-alt\"\r\n (click)=\"onChildClick(child)\"\r\n >\r\n <span mfIcon [size]=\"16\">{{ child.icon }}</span>\r\n <span class=\"truncate\">{{ child.label }}</span>\r\n </button>\r\n }\r\n </div>\r\n </mf-popover>\r\n}\r\n","import { OverlayModule } from '@angular/cdk/overlay';\r\nimport { Component, computed, inject, input, output, signal } from '@angular/core';\r\nimport { Avatar } from '@mesgflow/ui-kit/avatar';\r\nimport { cn, MF_SIDEBAR_LABELS } from '@mesgflow/ui-kit/core';\r\nimport { Icon } from '@mesgflow/ui-kit/icon';\r\nimport { Popover } from '@mesgflow/ui-kit/popover';\r\nimport { Tooltip } from '@mesgflow/ui-kit/tooltip';\r\nimport type { SidebarTenant } from './sidebar.model';\r\n\r\n/**\r\n * Sidebar'ın üst bloğu — panel iskeleti `Popover`'a devredildi (bkz. plan\r\n * Faz 1c). Panel genişliği daraltılmışken trigger genişliğine değil SABİT\r\n * 240px'e bağlı (`matchTriggerWidth` kapalı, `panelClass` ile `min-w-60`\r\n * veriliyor) — daralmışken trigger sadece 72px, tenant adları sığmaz.\r\n */\r\n@Component({\r\n selector: 'mf-sidebar-tenant-switcher',\r\n imports: [Avatar, Icon, OverlayModule, Popover, Tooltip],\r\n host: { class: 'contents' },\r\n templateUrl: './sidebar-tenant-switcher.html',\r\n})\r\nexport class SidebarTenantSwitcher {\r\n readonly tenants = input<SidebarTenant[]>([]);\r\n readonly activeTenantId = input<string | null>(null);\r\n readonly collapsed = input(false);\r\n readonly label = input<string>();\r\n readonly noTenantsLabel = input<string>();\r\n\r\n readonly tenantChange = output<SidebarTenant>();\r\n\r\n private readonly sidebarLabels = inject(MF_SIDEBAR_LABELS);\r\n protected readonly effectiveLabel = computed(\r\n () => this.label() ?? this.sidebarLabels().switchTenant,\r\n );\r\n protected readonly effectiveNoTenantsLabel = computed(\r\n () => this.noTenantsLabel() ?? this.sidebarLabels().noTenants,\r\n );\r\n\r\n protected readonly cn = cn;\r\n protected readonly open = signal(false);\r\n protected readonly highlighted = signal(0);\r\n\r\n // `.at(0)` BİLEREK `[0]` yerine — `noUncheckedIndexedAccess` kapalıyken TS `arr[0]`'ı\r\n // her zaman tanımlı sayar (boş dizide çalışma zamanında `undefined` olsa bile), bu da\r\n // `?? null`'ı statik olarak \"asla tetiklenmez\" gösterip strictTemplates'in şablondaki\r\n // savunmacı `?.`/`??`'yi hatalı biçimde gereksiz işaretlemesine yol açıyordu. `.at()`\r\n // dizinden bağımsız her zaman `T | undefined` döner, tür çıkarımı gerçek davranışla eşleşir.\r\n protected readonly activeTenant = computed(\r\n () =>\r\n this.tenants().find((t) => t.id === this.activeTenantId()) ?? this.tenants().at(0) ?? null,\r\n );\r\n\r\n protected toggle(): void {\r\n if (this.tenants().length === 0) return;\r\n if (!this.open())\r\n this.highlighted.set(\r\n Math.max(\r\n 0,\r\n this.tenants().findIndex((t) => t.id === this.activeTenantId()),\r\n ),\r\n );\r\n this.open.update((v) => !v);\r\n }\r\n\r\n protected close(): void {\r\n this.open.set(false);\r\n }\r\n\r\n protected select(tenant: SidebarTenant): void {\r\n this.tenantChange.emit(tenant);\r\n this.close();\r\n }\r\n\r\n protected optionClasses(tenant: SidebarTenant, index: number): string {\r\n const isSelected = tenant.id === this.activeTenantId();\r\n return cn(\r\n 'flex cursor-pointer items-center gap-2.5 rounded-sm px-2 py-1.5 transition-colors duration-fast ease-emphasis',\r\n index === this.highlighted() && !isSelected && 'bg-surface-alt',\r\n isSelected && 'bg-primary-tint text-primary-tint-fg',\r\n );\r\n }\r\n\r\n protected onTriggerKeydown(event: KeyboardEvent): void {\r\n if (event.key === 'ArrowDown' || event.key === 'Enter' || event.key === ' ') {\r\n event.preventDefault();\r\n if (!this.open()) this.toggle();\r\n }\r\n }\r\n\r\n protected onPanelKeydown(event: KeyboardEvent): void {\r\n const tenants = this.tenants();\r\n if (event.key === 'Escape') {\r\n event.preventDefault();\r\n this.close();\r\n return;\r\n }\r\n if (event.key === 'ArrowDown') {\r\n event.preventDefault();\r\n this.highlighted.update((i) => Math.min(tenants.length - 1, i + 1));\r\n return;\r\n }\r\n if (event.key === 'ArrowUp') {\r\n event.preventDefault();\r\n this.highlighted.update((i) => Math.max(0, i - 1));\r\n return;\r\n }\r\n if (event.key === 'Enter' || event.key === ' ') {\r\n event.preventDefault();\r\n const tenant = tenants[this.highlighted()];\r\n if (tenant) this.select(tenant);\r\n }\r\n }\r\n}\r\n","<button\r\n type=\"button\"\r\n cdkOverlayOrigin\r\n #origin=\"cdkOverlayOrigin\"\r\n class=\"flex h-16 w-full shrink-0 appearance-none items-center gap-2.5 border-x-0 border-t-0 border-b border-border bg-transparent px-3 text-start transition-colors duration-fast ease-emphasis hover:bg-surface-alt focus-visible:outline focus-visible:outline-2 focus-visible:-outline-offset-2 focus-visible:outline-focus-ring group-data-[appearance=brand]/sidebar:border-primary-800 group-data-[appearance=brand]/sidebar:hover:bg-primary-800 group-data-[appearance=brand]/sidebar:focus-visible:outline-primary-300 group-data-[appearance=brand-light]/sidebar:border-primary-200 group-data-[appearance=brand-light]/sidebar:hover:bg-primary-200 group-data-[appearance=brand-light]/sidebar:focus-visible:outline-primary-700\"\r\n [class.justify-center]=\"collapsed()\"\r\n [attr.aria-label]=\"collapsed() ? (activeTenant()?.name ?? effectiveLabel()) : null\"\r\n [mfTooltip]=\"collapsed() ? (activeTenant()?.name ?? effectiveLabel()) : ''\"\r\n tooltipPosition=\"right\"\r\n [attr.aria-expanded]=\"open()\"\r\n aria-haspopup=\"listbox\"\r\n (click)=\"toggle()\"\r\n (keydown)=\"onTriggerKeydown($event)\"\r\n>\r\n <mf-avatar [name]=\"activeTenant()?.name ?? '?'\" shape=\"square\" size=\"md\" [colorful]=\"true\" />\r\n @if (!collapsed()) {\r\n <span class=\"flex min-w-0 flex-1 flex-col\">\r\n <span\r\n class=\"truncate font-display text-sm font-semibold text-fg group-data-[appearance=brand]/sidebar:text-primary-50 group-data-[appearance=brand-light]/sidebar:text-primary-900\"\r\n >\r\n {{ activeTenant()?.name ?? effectiveNoTenantsLabel() }}\r\n </span>\r\n <span\r\n class=\"truncate text-xs text-fg-subtle group-data-[appearance=brand]/sidebar:text-primary-300 group-data-[appearance=brand-light]/sidebar:text-primary-700\"\r\n >{{ effectiveLabel() }}</span\r\n >\r\n </span>\r\n <span\r\n mfIcon\r\n [size]=\"18\"\r\n class=\"shrink-0 text-fg-subtle group-data-[appearance=brand]/sidebar:text-primary-300 group-data-[appearance=brand-light]/sidebar:text-primary-700\"\r\n >unfold_more</span\r\n >\r\n }\r\n</button>\r\n\r\n<mf-popover\r\n [origin]=\"origin\"\r\n [open]=\"open()\"\r\n placement=\"bottom-start\"\r\n padding=\"sm\"\r\n [matchTriggerWidth]=\"!collapsed()\"\r\n [panelClass]=\"cn('max-h-72', collapsed() ? 'min-w-60' : '')\"\r\n (closed)=\"close()\"\r\n>\r\n <ul\r\n role=\"listbox\"\r\n tabindex=\"0\"\r\n [attr.aria-label]=\"effectiveLabel()\"\r\n class=\"w-full text-sm\"\r\n (keydown)=\"onPanelKeydown($event)\"\r\n >\r\n @for (tenant of tenants(); track tenant.id; let i = $index) {\r\n <!-- role=\"option\" BİLEREK odaklanabilir değil — klavye gezinmesi yukarıdaki listbox (keydown)'da merkezi. -->\r\n <!-- eslint-disable-next-line @angular-eslint/template/click-events-have-key-events, @angular-eslint/template/interactive-supports-focus -->\r\n <li\r\n role=\"option\"\r\n [attr.aria-selected]=\"tenant.id === activeTenantId()\"\r\n [class]=\"optionClasses(tenant, i)\"\r\n (mouseenter)=\"highlighted.set(i)\"\r\n (click)=\"select(tenant)\"\r\n >\r\n <mf-avatar [name]=\"tenant.name\" shape=\"square\" size=\"sm\" [colorful]=\"true\" />\r\n <span class=\"min-w-0 flex-1 truncate text-fg-muted\">{{ tenant.name }}</span>\r\n @if (tenant.id === activeTenantId()) {\r\n <span mfIcon [size]=\"16\">check</span>\r\n }\r\n </li>\r\n } @empty {\r\n <li class=\"px-2.5 py-1.5 text-fg-subtle\">{{ effectiveNoTenantsLabel() }}</li>\r\n }\r\n </ul>\r\n</mf-popover>\r\n","import { Component, computed, inject, input, output } from '@angular/core';\r\nimport { Avatar } from '@mesgflow/ui-kit/avatar';\r\nimport { MF_SIDEBAR_LABELS } from '@mesgflow/ui-kit/core';\r\nimport { Icon } from '@mesgflow/ui-kit/icon';\r\nimport { Tooltip } from '@mesgflow/ui-kit/tooltip';\r\nimport type { SidebarUser } from './sidebar.model';\r\n\r\n/**\r\n * Sidebar'ın alt bloğu — menü AÇMIYOR, tek bir satır: tıklanınca `profileClick`\r\n * emit ediyor, gerçek \"profile git\" navigasyonu tüketicinin sorumluluğu\r\n * (ör. `(profileClick)=\"router.navigate(['/profile'])\"`).\r\n */\r\n@Component({\r\n selector: 'mf-sidebar-user-menu',\r\n imports: [Avatar, Icon, Tooltip],\r\n host: { class: 'contents' },\r\n templateUrl: './sidebar-user-menu.html',\r\n})\r\nexport class SidebarUserMenu {\r\n readonly user = input<SidebarUser | null>(null);\r\n readonly collapsed = input(false);\r\n readonly noUserLabel = input<string>();\r\n\r\n readonly profileClick = output<void>();\r\n\r\n private readonly sidebarLabels = inject(MF_SIDEBAR_LABELS);\r\n protected readonly effectiveNoUserLabel = computed(\r\n () => this.noUserLabel() ?? this.sidebarLabels().noUser,\r\n );\r\n}\r\n","@if (user(); as current) {\r\n <button\r\n type=\"button\"\r\n class=\"flex h-16 w-full shrink-0 appearance-none items-center gap-2.5 border-0 bg-transparent px-3 text-start transition-colors duration-fast ease-emphasis hover:bg-surface-alt focus-visible:outline focus-visible:outline-2 focus-visible:-outline-offset-2 focus-visible:outline-focus-ring group-data-[appearance=brand]/sidebar:hover:bg-primary-800 group-data-[appearance=brand]/sidebar:focus-visible:outline-primary-300 group-data-[appearance=brand-light]/sidebar:hover:bg-primary-200 group-data-[appearance=brand-light]/sidebar:focus-visible:outline-primary-700\"\r\n [class.justify-center]=\"collapsed()\"\r\n [attr.aria-label]=\"collapsed() ? current.name : null\"\r\n [mfTooltip]=\"collapsed() ? current.name : ''\"\r\n tooltipPosition=\"right\"\r\n (click)=\"profileClick.emit()\"\r\n >\r\n <mf-avatar [name]=\"current.name\" tone=\"info\" size=\"md\" />\r\n @if (!collapsed()) {\r\n <span class=\"flex min-w-0 flex-1 flex-col\">\r\n <span\r\n class=\"truncate text-sm font-semibold text-fg group-data-[appearance=brand]/sidebar:text-primary-50 group-data-[appearance=brand-light]/sidebar:text-primary-900\"\r\n >{{ current.name }}</span\r\n >\r\n <span\r\n class=\"truncate text-xs text-fg-subtle group-data-[appearance=brand]/sidebar:text-primary-300 group-data-[appearance=brand-light]/sidebar:text-primary-700\"\r\n >{{ current.role ?? current.email }}</span\r\n >\r\n </span>\r\n <span\r\n mfIcon\r\n [size]=\"18\"\r\n class=\"shrink-0 text-fg-subtle group-data-[appearance=brand]/sidebar:text-primary-300 group-data-[appearance=brand-light]/sidebar:text-primary-700\"\r\n >settings</span\r\n >\r\n }\r\n </button>\r\n} @else {\r\n <div\r\n class=\"flex h-16 shrink-0 items-center gap-2.5 px-3 text-fg-subtle\"\r\n [class.justify-center]=\"collapsed()\"\r\n >\r\n <span mfIcon [size]=\"20\">person_off</span>\r\n @if (!collapsed()) {\r\n <span class=\"truncate text-sm\">{{ effectiveNoUserLabel() }}</span>\r\n }\r\n </div>\r\n}\r\n","import {\r\n Component,\r\n computed,\r\n effect,\r\n inject,\r\n model,\r\n input,\r\n output,\r\n untracked,\r\n} from '@angular/core';\r\nimport { cn, MF_SIDEBAR_LABELS } from '@mesgflow/ui-kit/core';\r\nimport { Icon } from '@mesgflow/ui-kit/icon';\r\nimport { Tooltip } from '@mesgflow/ui-kit/tooltip';\r\nimport { sidebarVariants, type SidebarAppearance } from './sidebar.variants';\r\nimport { SidebarNavItemRow } from './sidebar-nav-item';\r\nimport { SidebarTenantSwitcher } from './sidebar-tenant-switcher';\r\nimport { SidebarUserMenu } from './sidebar-user-menu';\r\nimport type {\r\n SidebarNavItem as SidebarNavItemModel,\r\n SidebarTenant,\r\n SidebarUser,\r\n} from './sidebar.model';\r\n\r\n/**\r\n * `<mf-sidebar [navItems]=\"items\" [tenants]=\"tenants\" [user]=\"user\" [(collapsed)]=\"collapsed\" />`\r\n *\r\n * Tamamen generic/yeniden kullanılabilir bir premium sidebar — Table'daki gibi,\r\n * gerçek veriye değil `input()`lara bağlı (bkz. layout/shell/shell.ts'in bunu\r\n * gerçek veriyle beslemesi). Üç bölge: tenant switcher (üst), navigasyon\r\n * (orta, açılır gruplu), kullanıcı satırı (alt, tıklanınca `profileClick`\r\n * emit eder — menü AÇMAZ) — hepsi tek bir dikey panelde.\r\n */\r\n@Component({\r\n selector: 'mf-sidebar',\r\n exportAs: 'mfSidebar',\r\n host: { class: 'flex h-full' },\r\n imports: [Icon, Tooltip, SidebarTenantSwitcher, SidebarNavItemRow, SidebarUserMenu],\r\n templateUrl: './sidebar.html',\r\n})\r\nexport class Sidebar {\r\n readonly tenants = input<SidebarTenant[]>([]);\r\n readonly activeTenantId = model<string | null>(null);\r\n readonly navItems = input.required<SidebarNavItemModel[]>();\r\n readonly activeItemId = model<string | null>(null);\r\n readonly user = input<SidebarUser | null>(null);\r\n /**\r\n * `false` -- kullanıcı satırı VE üstündeki ayraç HİÇ render edilmez.\r\n * Varsayılan `true` (mevcut davranış korunur): `user()` `null` olsa bile\r\n * `SidebarUserMenu` kendi \"oturum açılmadı\" boş-durumunu gösterir (bilinçli,\r\n * bkz. `sidebar-user-menu.ts`) — bu, kullanıcı kavramı OLMAYAN tüketiciler\r\n * (ör. salt-dokümantasyon/showcase kabukları) için YANLIŞ bir sinyal\r\n * olabiliyordu (gerçek bulgu). `false` geçmek o tüketicilerin kaçış yolu.\r\n */\r\n readonly showUserMenu = input(true);\r\n readonly collapsed = model(false);\r\n /**\r\n * Sidebar'ın kendi kenarındaki yuvarlak daralt/genişlet butonu. Varsayılan\r\n * `true` — tetikleyiciyi kendi navbar'ına taşıyan tüketiciler `false` geçer,\r\n * aksi halde masaüstünde İKİ ayrı daraltma kontrolü olurdu.\r\n */\r\n readonly showCollapseToggle = input(true);\r\n /**\r\n * `'chrome'` (varsayılan, mevcut nötr görünüm) | `'brand'` (kök zemini\r\n * `primary-900`, nav metni/aktif ray marka tonlu — iki modda AYNI, bkz.\r\n * `sidebar.variants.ts` doc'u) | `'brand-light'` (AYNI marka kimliği,\r\n * kök zemini `primary-100` — koyu yerine açık bir marka bloğu, yine iki\r\n * modda AYNI). CDK overlay'e taşınan flyout/tenant listesi bu grubun\r\n * TORUNU olmadığından her zaman katı `chrome` kalır.\r\n */\r\n readonly appearance = input<SidebarAppearance>('chrome');\r\n\r\n /** Verilmezse `MF_SIDEBAR_LABELS`'a düşer — `SidebarTenantSwitcher`/`SidebarUserMenu`'nün KENDİ etiketleri artık AYRICA buradan prop-drilling YAPILMIYOR, ikisi de `MF_SIDEBAR_LABELS`'ı doğrudan inject ediyor. */\r\n readonly collapseLabel = input<string>();\r\n readonly expandLabel = input<string>();\r\n readonly navAriaLabel = input<string>();\r\n\r\n readonly tenantChange = output<SidebarTenant>();\r\n readonly itemClick = output<SidebarNavItemModel>();\r\n /** Kullanıcı satırına tıklanınca — profile navigasyonu tüketicinin sorumluluğu. */\r\n readonly profileClick = output<void>();\r\n\r\n private readonly sidebarLabels = inject(MF_SIDEBAR_LABELS);\r\n protected readonly effectiveCollapseLabel = computed(\r\n () => this.collapseLabel() ?? this.sidebarLabels().collapse,\r\n );\r\n protected readonly effectiveExpandLabel = computed(\r\n () => this.expandLabel() ?? this.sidebarLabels().expand,\r\n );\r\n protected readonly effectiveNavAriaLabel = computed(\r\n () => this.navAriaLabel() ?? this.sidebarLabels().nav,\r\n );\r\n\r\n protected readonly rootClasses = computed(() =>\r\n cn(sidebarVariants({ collapsed: this.collapsed(), appearance: this.appearance() })),\r\n );\r\n\r\n /** Genişkenken hangi gruplar açık — her grup BAĞIMSIZ açılır/kapanır (akordeon değil, kullanıcı kararı). `model()` — tüketici okuyabilir/yazabilir (ör. \"hepsini aç\" bir buton). */\r\n readonly expandedIds = model<ReadonlySet<string>>(new Set());\r\n /**\r\n * `activeItemId()` bir alt öğeye (children içinde) eşleşince o öğenin\r\n * EBEVEYN grubunu otomatik açar — YALNIZCA aktif öğe DEĞİŞİNCE (kullanıcının\r\n * sonradan elle kapatması korunur, tekrar zorla açılmaz). Öncesinde derin\r\n * bir bağlantıya (ör. `/components/button`) DOĞRUDAN gidildiğinde tüm\r\n * gruplar kapalı geliyor, aktif öğe görünmüyordu (gerçek bulgu).\r\n */\r\n readonly autoExpandActive = input(true);\r\n\r\n protected isExpanded(id: string): boolean {\r\n return this.expandedIds().has(id);\r\n }\r\n\r\n protected onToggleExpand(id: string): void {\r\n this.expandedIds.update((current) => {\r\n const next = new Set(current);\r\n if (next.has(id)) next.delete(id);\r\n else next.add(id);\r\n return next;\r\n });\r\n }\r\n\r\n constructor() {\r\n // `expandedIds()` BİLEREK `untracked()` içinde okunuyor — aksi halde bu\r\n // effect KENDİ yazdığı sinyale de bağımlı olurdu ve kullanıcı grubu elle\r\n // kapattığında (`expandedIds` değişince, `activeItemId` AYNI kalsa bile)\r\n // yeniden tetiklenip anında geri açardı (gerçek bulgu, ilk denemede\r\n // yakalandı). Bu effect SADECE `autoExpandActive`/`activeItemId`/\r\n // `navItems` değişince çalışmalı.\r\n effect(() => {\r\n if (!this.autoExpandActive()) return;\r\n const activeId = this.activeItemId();\r\n if (!activeId) return;\r\n const parent = this.navItems().find((item) =>\r\n item.children?.some((child) => child.id === activeId),\r\n );\r\n if (!parent) return;\r\n untracked(() => {\r\n if (this.expandedIds().has(parent.id)) return;\r\n this.expandedIds.update((current) => new Set(current).add(parent.id));\r\n });\r\n });\r\n }\r\n\r\n protected onItemActivate(item: SidebarNavItemModel): void {\r\n this.activeItemId.set(item.id);\r\n this.itemClick.emit(item);\r\n }\r\n\r\n protected onTenantSelect(tenant: SidebarTenant): void {\r\n this.activeTenantId.set(tenant.id);\r\n this.tenantChange.emit(tenant);\r\n }\r\n\r\n protected toggleCollapse(): void {\r\n this.collapsed.update((v) => !v);\r\n }\r\n}\r\n","<aside [class]=\"rootClasses()\" [attr.data-appearance]=\"appearance()\">\r\n <div class=\"flex h-full min-h-0 w-full flex-col overflow-hidden\">\r\n @if (tenants().length > 0) {\r\n <mf-sidebar-tenant-switcher\r\n [tenants]=\"tenants()\"\r\n [activeTenantId]=\"activeTenantId()\"\r\n [collapsed]=\"collapsed()\"\r\n (tenantChange)=\"onTenantSelect($event)\"\r\n />\r\n } @else {\r\n <!--\r\n Tenant kavramı olmayan tüketiciler `tenants` input'unu hiç geçmez — bu\r\n durumda tenant switcher'ın \"Kiracı bulunamadı\" boş-durumunu göstermek\r\n yerine (kafa karıştırıcı, gerçek bir hata gibi okunur) çağıranın kendi\r\n marka başlığını buraya projekte etmesi bekleniyor (ör. `<mf-brand />`).\r\n -->\r\n <div\r\n class=\"flex h-16 shrink-0 items-center gap-2 border-b border-border px-4 group-data-[appearance=brand]/sidebar:border-primary-800 group-data-[appearance=brand-light]/sidebar:border-primary-200\"\r\n [class.justify-center]=\"collapsed()\"\r\n >\r\n <ng-content select=\"[brand]\" />\r\n </div>\r\n }\r\n\r\n <nav\r\n class=\"flex-1 overflow-x-hidden overflow-y-auto px-2 py-3\"\r\n [attr.aria-label]=\"effectiveNavAriaLabel()\"\r\n >\r\n <ul class=\"m-0 flex list-none flex-col gap-1 p-0\">\r\n @for (item of navItems(); track item.id) {\r\n <li>\r\n <mf-sidebar-nav-item\r\n [item]=\"item\"\r\n [collapsed]=\"collapsed()\"\r\n [activeItemId]=\"activeItemId()\"\r\n [expanded]=\"isExpanded(item.id)\"\r\n (activate)=\"onItemActivate($event)\"\r\n (toggleExpand)=\"onToggleExpand($event)\"\r\n />\r\n </li>\r\n }\r\n </ul>\r\n </nav>\r\n\r\n @if (showUserMenu()) {\r\n <div\r\n class=\"border-t border-border group-data-[appearance=brand]/sidebar:border-primary-800 group-data-[appearance=brand-light]/sidebar:border-primary-200\"\r\n ></div>\r\n\r\n <mf-sidebar-user-menu\r\n [user]=\"user()\"\r\n [collapsed]=\"collapsed()\"\r\n (profileClick)=\"profileClick.emit()\"\r\n />\r\n }\r\n </div>\r\n\r\n @if (showCollapseToggle()) {\r\n <button\r\n type=\"button\"\r\n class=\"absolute top-14 -end-3 z-10 flex h-6 w-6 appearance-none items-center justify-center rounded-full border border-hairline bg-chrome p-0 text-fg-subtle shadow-1 transition-colors duration-fast ease-emphasis hover:bg-surface-alt hover:text-fg active:scale-[0.99] focus-visible:outline focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-focus-ring group-data-[appearance=brand]/sidebar:bg-primary-900 group-data-[appearance=brand]/sidebar:text-primary-200 group-data-[appearance=brand]/sidebar:hover:bg-primary-800 group-data-[appearance=brand]/sidebar:hover:text-primary-50 group-data-[appearance=brand]/sidebar:focus-visible:outline-primary-300 group-data-[appearance=brand-light]/sidebar:bg-primary-100 group-data-[appearance=brand-light]/sidebar:text-primary-800 group-data-[appearance=brand-light]/sidebar:hover:bg-primary-200 group-data-[appearance=brand-light]/sidebar:hover:text-primary-900 group-data-[appearance=brand-light]/sidebar:focus-visible:outline-primary-700\"\r\n [mfTooltip]=\"collapsed() ? effectiveExpandLabel() : effectiveCollapseLabel()\"\r\n tooltipPosition=\"right\"\r\n [attr.aria-label]=\"collapsed() ? effectiveExpandLabel() : effectiveCollapseLabel()\"\r\n (click)=\"toggleCollapse()\"\r\n >\r\n <span mfIcon [size]=\"14\" class=\"rtl:-scale-x-100\">{{\r\n collapsed() ? 'chevron_right' : 'chevron_left'\r\n }}</span>\r\n </button>\r\n }\r\n</aside>\r\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":[],"mappings":"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"}
@@ -0,0 +1,74 @@
1
+ import * as i0 from '@angular/core';
2
+ import { input, computed, Component } from '@angular/core';
3
+ import { cn } from '@mesgflow/ui-kit/core';
4
+
5
+ /**
6
+ * `animate-pulse` (opaklık titreşimi) yerine soldan sağa kayan bir parıltı
7
+ * (bkz. `tokens/motion.css` `animate-shimmer`, plan Faz 1c) — taban rengin
8
+ * üstüne `background-size:200%` bir gradient bindirilip pozisyonu animasyonla
9
+ * kaydırılıyor. `border-strong` bant rengi HER İKİ modda da taban `surface-
10
+ * active`'ten AYIRT EDİLEBİLİR bir basamak.
11
+ */
12
+ const SHIMMER = 'bg-surface-active bg-[linear-gradient(90deg,transparent,var(--color-border-strong),transparent)] bg-[length:200%_100%] animate-shimmer';
13
+ /**
14
+ * `<div mfSkeleton class="h-4 w-32"></div>` (varsayılan `variant="rect"` —
15
+ * boyutu tüketici `class` ile verir, ESKİ davranış BİREBİR korunur) veya
16
+ * `<div mfSkeleton variant="circle" class="h-10 w-10"></div>` (`rounded-full`
17
+ * eklenir) veya `<div mfSkeleton variant="text" [lines]="3"></div>`
18
+ * (`lines > 1` iken alt alta `lines` kadar satır render eder — SON satır
19
+ * bilerek `w-3/4`, bir paragrafın düzensiz son satırını taklit eder).
20
+ *
21
+ * `lines > 1` YALNIZCA `variant="text"`'te anlamlı — bu durumda host
22
+ * kendisi bir shimmer kutusu OLMAKTAN çıkıp satırları dikey dizen bir
23
+ * `flex flex-col` kabına dönüşür (directive'ten component'e yükseltilmesinin
24
+ * TEK sebebi — bkz. `Button`'ın aynı yükseltme deseni, `button.ts`).
25
+ */
26
+ class Skeleton {
27
+ variant = input('rect', /* @ts-ignore */
28
+ ...(ngDevMode ? [{ debugName: "variant" }] : /* istanbul ignore next */ []));
29
+ lines = input(1, /* @ts-ignore */
30
+ ...(ngDevMode ? [{ debugName: "lines" }] : /* istanbul ignore next */ []));
31
+ multiline = computed(() => this.variant() === 'text' && this.lines() > 1, /* @ts-ignore */
32
+ ...(ngDevMode ? [{ debugName: "multiline" }] : /* istanbul ignore next */ []));
33
+ lineIndexes = computed(() => Array.from({ length: this.lines() }, (_, i) => i), /* @ts-ignore */
34
+ ...(ngDevMode ? [{ debugName: "lineIndexes" }] : /* istanbul ignore next */ []));
35
+ hostClasses = computed(() => {
36
+ if (this.multiline())
37
+ return 'flex flex-col gap-2';
38
+ return cn('block', SHIMMER, this.variant() === 'circle' ? 'rounded-full' : 'rounded-xs');
39
+ }, /* @ts-ignore */
40
+ ...(ngDevMode ? [{ debugName: "hostClasses" }] : /* istanbul ignore next */ []));
41
+ lineClasses(last) {
42
+ return cn('block h-4 rounded-xs', SHIMMER, last ? 'w-3/4' : 'w-full');
43
+ }
44
+ static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.6", ngImport: i0, type: Skeleton, deps: [], target: i0.ɵɵFactoryTarget.Component });
45
+ static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.1.6", type: Skeleton, isStandalone: true, selector: "[mfSkeleton]", inputs: { variant: { classPropertyName: "variant", publicName: "variant", isSignal: true, isRequired: false, transformFunction: null }, lines: { classPropertyName: "lines", publicName: "lines", isSignal: true, isRequired: false, transformFunction: null } }, host: { properties: { "class": "hostClasses()" } }, ngImport: i0, template: `
46
+ @if (multiline()) {
47
+ @for (line of lineIndexes(); track line; let last = $last) {
48
+ <span [class]="lineClasses(last)"></span>
49
+ }
50
+ }
51
+ `, isInline: true });
52
+ }
53
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.6", ngImport: i0, type: Skeleton, decorators: [{
54
+ type: Component,
55
+ args: [{
56
+ // eslint-disable-next-line @angular-eslint/component-selector -- BİLEREK native eleman + attribute (bkz. Button'daki AYNI desen)
57
+ selector: '[mfSkeleton]',
58
+ host: { '[class]': 'hostClasses()' },
59
+ template: `
60
+ @if (multiline()) {
61
+ @for (line of lineIndexes(); track line; let last = $last) {
62
+ <span [class]="lineClasses(last)"></span>
63
+ }
64
+ }
65
+ `,
66
+ }]
67
+ }], propDecorators: { variant: [{ type: i0.Input, args: [{ isSignal: true, alias: "variant", required: false }] }], lines: [{ type: i0.Input, args: [{ isSignal: true, alias: "lines", required: false }] }] } });
68
+
69
+ /**
70
+ * Generated bundle index. Do not edit.
71
+ */
72
+
73
+ export { Skeleton };
74
+ //# sourceMappingURL=mesgflow-ui-kit-skeleton.mjs.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"mesgflow-ui-kit-skeleton.mjs","sources":["../../../projects/ui-kit/skeleton/skeleton.ts","../../../projects/ui-kit/skeleton/mesgflow-ui-kit-skeleton.ts"],"sourcesContent":["import { Component, computed, input } from '@angular/core';\r\nimport { cn } from '@mesgflow/ui-kit/core';\r\n\r\nexport type SkeletonVariant = 'text' | 'circle' | 'rect';\r\n\r\n/**\r\n * `animate-pulse` (opaklık titreşimi) yerine soldan sağa kayan bir parıltı\r\n * (bkz. `tokens/motion.css` `animate-shimmer`, plan Faz 1c) — taban rengin\r\n * üstüne `background-size:200%` bir gradient bindirilip pozisyonu animasyonla\r\n * kaydırılıyor. `border-strong` bant rengi HER İKİ modda da taban `surface-\r\n * active`'ten AYIRT EDİLEBİLİR bir basamak.\r\n */\r\nconst SHIMMER =\r\n 'bg-surface-active bg-[linear-gradient(90deg,transparent,var(--color-border-strong),transparent)] bg-[length:200%_100%] animate-shimmer';\r\n\r\n/**\r\n * `<div mfSkeleton class=\"h-4 w-32\"></div>` (varsayılan `variant=\"rect\"` —\r\n * boyutu tüketici `class` ile verir, ESKİ davranış BİREBİR korunur) veya\r\n * `<div mfSkeleton variant=\"circle\" class=\"h-10 w-10\"></div>` (`rounded-full`\r\n * eklenir) veya `<div mfSkeleton variant=\"text\" [lines]=\"3\"></div>`\r\n * (`lines > 1` iken alt alta `lines` kadar satır render eder — SON satır\r\n * bilerek `w-3/4`, bir paragrafın düzensiz son satırını taklit eder).\r\n *\r\n * `lines > 1` YALNIZCA `variant=\"text\"`'te anlamlı — bu durumda host\r\n * kendisi bir shimmer kutusu OLMAKTAN çıkıp satırları dikey dizen bir\r\n * `flex flex-col` kabına dönüşür (directive'ten component'e yükseltilmesinin\r\n * TEK sebebi — bkz. `Button`'ın aynı yükseltme deseni, `button.ts`).\r\n */\r\n@Component({\r\n // eslint-disable-next-line @angular-eslint/component-selector -- BİLEREK native eleman + attribute (bkz. Button'daki AYNI desen)\r\n selector: '[mfSkeleton]',\r\n host: { '[class]': 'hostClasses()' },\r\n template: `\r\n @if (multiline()) {\r\n @for (line of lineIndexes(); track line; let last = $last) {\r\n <span [class]=\"lineClasses(last)\"></span>\r\n }\r\n }\r\n `,\r\n})\r\nexport class Skeleton {\r\n readonly variant = input<SkeletonVariant>('rect');\r\n readonly lines = input(1);\r\n\r\n protected readonly multiline = computed(() => this.variant() === 'text' && this.lines() > 1);\r\n protected readonly lineIndexes = computed(() =>\r\n Array.from({ length: this.lines() }, (_, i) => i),\r\n );\r\n\r\n protected readonly hostClasses = computed(() => {\r\n if (this.multiline()) return 'flex flex-col gap-2';\r\n return cn('block', SHIMMER, this.variant() === 'circle' ? 'rounded-full' : 'rounded-xs');\r\n });\r\n\r\n protected lineClasses(last: boolean): string {\r\n return cn('block h-4 rounded-xs', SHIMMER, last ? 'w-3/4' : 'w-full');\r\n }\r\n}\r\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":[],"mappings":";;;;AAKA;;;;;;AAMG;AACH,MAAM,OAAO,GACX,wIAAwI;AAE1I;;;;;;;;;;;;AAYG;MAaU,QAAQ,CAAA;IACV,OAAO,GAAG,KAAK,CAAkB,MAAM;gFAAC;IACxC,KAAK,GAAG,KAAK,CAAC,CAAC;8EAAC;AAEN,IAAA,SAAS,GAAG,QAAQ,CAAC,MAAM,IAAI,CAAC,OAAO,EAAE,KAAK,MAAM,IAAI,IAAI,CAAC,KAAK,EAAE,GAAG,CAAC;kFAAC;IACzE,WAAW,GAAG,QAAQ,CAAC,MACxC,KAAK,CAAC,IAAI,CAAC,EAAE,MAAM,EAAE,IAAI,CAAC,KAAK,EAAE,EAAE,EAAE,CAAC,CAAC,EAAE,CAAC,KAAK,CAAC,CAAC;oFAClD;AAEkB,IAAA,WAAW,GAAG,QAAQ,CAAC,MAAK;QAC7C,IAAI,IAAI,CAAC,SAAS,EAAE;AAAE,YAAA,OAAO,qBAAqB;QAClD,OAAO,EAAE,CAAC,OAAO,EAAE,OAAO,EAAE,IAAI,CAAC,OAAO,EAAE,KAAK,QAAQ,GAAG,cAAc,GAAG,YAAY,CAAC;IAC1F,CAAC;oFAAC;AAEQ,IAAA,WAAW,CAAC,IAAa,EAAA;AACjC,QAAA,OAAO,EAAE,CAAC,sBAAsB,EAAE,OAAO,EAAE,IAAI,GAAG,OAAO,GAAG,QAAQ,CAAC;IACvE;uGAhBW,QAAQ,EAAA,IAAA,EAAA,EAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,SAAA,EAAA,CAAA;AAAR,IAAA,OAAA,IAAA,GAAA,EAAA,CAAA,oBAAA,CAAA,EAAA,UAAA,EAAA,QAAA,EAAA,OAAA,EAAA,QAAA,EAAA,IAAA,EAAA,QAAQ,EAAA,YAAA,EAAA,IAAA,EAAA,QAAA,EAAA,cAAA,EAAA,MAAA,EAAA,EAAA,OAAA,EAAA,EAAA,iBAAA,EAAA,SAAA,EAAA,UAAA,EAAA,SAAA,EAAA,QAAA,EAAA,IAAA,EAAA,UAAA,EAAA,KAAA,EAAA,iBAAA,EAAA,IAAA,EAAA,EAAA,KAAA,EAAA,EAAA,iBAAA,EAAA,OAAA,EAAA,UAAA,EAAA,OAAA,EAAA,QAAA,EAAA,IAAA,EAAA,UAAA,EAAA,KAAA,EAAA,iBAAA,EAAA,IAAA,EAAA,EAAA,EAAA,IAAA,EAAA,EAAA,UAAA,EAAA,EAAA,OAAA,EAAA,eAAA,EAAA,EAAA,EAAA,QAAA,EAAA,EAAA,EAAA,QAAA,EART,CAAA;;;;;;AAMT,EAAA,CAAA,EAAA,QAAA,EAAA,IAAA,EAAA,CAAA;;2FAEU,QAAQ,EAAA,UAAA,EAAA,CAAA;kBAZpB,SAAS;AAAC,YAAA,IAAA,EAAA,CAAA;;AAET,oBAAA,QAAQ,EAAE,cAAc;AACxB,oBAAA,IAAI,EAAE,EAAE,SAAS,EAAE,eAAe,EAAE;AACpC,oBAAA,QAAQ,EAAE,CAAA;;;;;;AAMT,EAAA,CAAA;AACF,iBAAA;;;ACvCD;;AAEG;;"}
@@ -0,0 +1,179 @@
1
+ import * as i0 from '@angular/core';
2
+ import { model, input, inject, ElementRef, computed, forwardRef, Component } from '@angular/core';
3
+ import { NG_VALUE_ACCESSOR } from '@angular/forms';
4
+ import { ValueAccessorBase, cn, isRtl, inlineStartRatio } from '@mesgflow/ui-kit/core';
5
+ import { cva } from 'class-variance-authority';
6
+
7
+ const sliderHostVariants = cva('relative block h-4 w-full cursor-pointer touch-none rounded-full select-none ' +
8
+ 'focus-visible:outline focus-visible:outline-2 focus-visible:outline-offset-4 focus-visible:outline-focus-ring', {
9
+ variants: {
10
+ disabled: {
11
+ true: 'pointer-events-none opacity-50',
12
+ false: '',
13
+ },
14
+ },
15
+ defaultVariants: { disabled: false },
16
+ });
17
+
18
+ /**
19
+ * `<mf-slider [(value)]="opacity" [min]="0" [max]="100" [step]="5" />` —
20
+ * `@angular/aria`'da hazır bir slider pattern'i YOK (sadece accordion/
21
+ * combobox/grid/listbox/menu/tabs/toolbar/tree var), bu yüzden ARIA
22
+ * `role="slider"` ve klavye (ok tuşları/Home/End/PageUp/PageDown) + pointer
23
+ * sürükleme ELLE kuruldu — kodda hand-rolled ARIA'nın ikinci örneği
24
+ * (ilki `Calendar`, bkz. README "Takvim ızgarası bilerek grid KULLANMADI").
25
+ */
26
+ class Slider extends ValueAccessorBase {
27
+ value = model(0, /* @ts-ignore */
28
+ ...(ngDevMode ? [{ debugName: "value" }] : /* istanbul ignore next */ []));
29
+ min = input(0, /* @ts-ignore */
30
+ ...(ngDevMode ? [{ debugName: "min" }] : /* istanbul ignore next */ []));
31
+ max = input(100, /* @ts-ignore */
32
+ ...(ngDevMode ? [{ debugName: "max" }] : /* istanbul ignore next */ []));
33
+ step = input(1, /* @ts-ignore */
34
+ ...(ngDevMode ? [{ debugName: "step" }] : /* istanbul ignore next */ []));
35
+ disabled = input(false, /* @ts-ignore */
36
+ ...(ngDevMode ? [{ debugName: "disabled" }] : /* istanbul ignore next */ []));
37
+ ariaLabel = input('', /* @ts-ignore */
38
+ ...(ngDevMode ? [{ debugName: "ariaLabel" }] : /* istanbul ignore next */ []));
39
+ elementRef = inject((ElementRef));
40
+ percent = computed(() => {
41
+ const range = this.max() - this.min();
42
+ if (range <= 0)
43
+ return 0;
44
+ return ((this.value() - this.min()) / range) * 100;
45
+ }, /* @ts-ignore */
46
+ ...(ngDevMode ? [{ debugName: "percent" }] : /* istanbul ignore next */ []));
47
+ hostClasses = computed(() => cn(sliderHostVariants({ disabled: this.disabled() })), /* @ts-ignore */
48
+ ...(ngDevMode ? [{ debugName: "hostClasses" }] : /* istanbul ignore next */ []));
49
+ writeValue(value) {
50
+ this.value.set(value);
51
+ }
52
+ clamp(raw) {
53
+ const stepped = Math.round((raw - this.min()) / this.step()) * this.step() + this.min();
54
+ return Math.min(this.max(), Math.max(this.min(), stepped));
55
+ }
56
+ setValue(next) {
57
+ this.value.set(next);
58
+ this.onChange(next);
59
+ this.onTouched();
60
+ }
61
+ onKeydown(event) {
62
+ if (this.disabled())
63
+ return;
64
+ const s = this.step();
65
+ // Yatay oklar GÖRSEL yöne göre: RTL'de dolgu sağdan başladığı için → azaltır.
66
+ const key = isRtl(this.elementRef.nativeElement)
67
+ ? ({ ArrowRight: 'ArrowLeft', ArrowLeft: 'ArrowRight' }[event.key] ?? event.key)
68
+ : event.key;
69
+ switch (key) {
70
+ case 'ArrowRight':
71
+ case 'ArrowUp':
72
+ event.preventDefault();
73
+ this.setValue(this.clamp(this.value() + s));
74
+ break;
75
+ case 'ArrowLeft':
76
+ case 'ArrowDown':
77
+ event.preventDefault();
78
+ this.setValue(this.clamp(this.value() - s));
79
+ break;
80
+ case 'Home':
81
+ event.preventDefault();
82
+ this.setValue(this.min());
83
+ break;
84
+ case 'End':
85
+ event.preventDefault();
86
+ this.setValue(this.max());
87
+ break;
88
+ case 'PageUp':
89
+ event.preventDefault();
90
+ this.setValue(this.clamp(this.value() + s * 10));
91
+ break;
92
+ case 'PageDown':
93
+ event.preventDefault();
94
+ this.setValue(this.clamp(this.value() - s * 10));
95
+ break;
96
+ }
97
+ }
98
+ onPointerDown(event) {
99
+ if (this.disabled())
100
+ return;
101
+ this.elementRef.nativeElement.setPointerCapture(event.pointerId);
102
+ this.elementRef.nativeElement.focus();
103
+ this.updateFromPointer(event);
104
+ }
105
+ onPointerMove(event) {
106
+ if (this.disabled() || event.buttons !== 1)
107
+ return;
108
+ this.updateFromPointer(event);
109
+ }
110
+ onPointerUp(event) {
111
+ this.elementRef.nativeElement.releasePointerCapture(event.pointerId);
112
+ }
113
+ updateFromPointer(event) {
114
+ const rect = this.elementRef.nativeElement.getBoundingClientRect();
115
+ const ratio = inlineStartRatio(event.clientX, rect, isRtl(this.elementRef.nativeElement));
116
+ const raw = this.min() + ratio * (this.max() - this.min());
117
+ this.setValue(this.clamp(raw));
118
+ }
119
+ static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.6", ngImport: i0, type: Slider, deps: null, target: i0.ɵɵFactoryTarget.Component });
120
+ static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "22.1.6", type: Slider, isStandalone: true, selector: "mf-slider", inputs: { value: { classPropertyName: "value", publicName: "value", isSignal: true, isRequired: false, transformFunction: null }, min: { classPropertyName: "min", publicName: "min", isSignal: true, isRequired: false, transformFunction: null }, max: { classPropertyName: "max", publicName: "max", isSignal: true, isRequired: false, transformFunction: null }, step: { classPropertyName: "step", publicName: "step", isSignal: true, isRequired: false, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null }, ariaLabel: { classPropertyName: "ariaLabel", publicName: "ariaLabel", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { value: "valueChange" }, host: { attributes: { "role": "slider", "tabindex": "0" }, listeners: { "keydown": "onKeydown($event)", "pointerdown": "onPointerDown($event)", "pointermove": "onPointerMove($event)", "pointerup": "onPointerUp($event)" }, properties: { "attr.aria-valuemin": "min()", "attr.aria-valuemax": "max()", "attr.aria-valuenow": "value()", "attr.aria-disabled": "disabled() || null", "attr.aria-label": "ariaLabel() || null", "class": "hostClasses()" } }, providers: [{ provide: NG_VALUE_ACCESSOR, useExisting: forwardRef(() => Slider), multi: true }], exportAs: ["mfSlider"], usesInheritance: true, ngImport: i0, template: `
121
+ <div
122
+ class="pointer-events-none absolute inset-x-0 top-1/2 h-1.5 -translate-y-1/2 rounded-full bg-surface-alt"
123
+ >
124
+ <div
125
+ class="absolute inset-y-0 start-0 rounded-full bg-accent-fill"
126
+ [style.width.%]="percent()"
127
+ ></div>
128
+ </div>
129
+ <div
130
+ class="pointer-events-none absolute top-1/2 h-4 w-4 -translate-y-1/2 rounded-full border-2 border-accent bg-surface shadow-1"
131
+ [style.inset-inline-start.%]="percent()"
132
+ style="margin-inline-start: -8px"
133
+ ></div>
134
+ `, isInline: true });
135
+ }
136
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.6", ngImport: i0, type: Slider, decorators: [{
137
+ type: Component,
138
+ args: [{
139
+ selector: 'mf-slider',
140
+ exportAs: 'mfSlider',
141
+ host: {
142
+ role: 'slider',
143
+ tabindex: '0',
144
+ '[attr.aria-valuemin]': 'min()',
145
+ '[attr.aria-valuemax]': 'max()',
146
+ '[attr.aria-valuenow]': 'value()',
147
+ '[attr.aria-disabled]': 'disabled() || null',
148
+ '[attr.aria-label]': 'ariaLabel() || null',
149
+ '[class]': 'hostClasses()',
150
+ '(keydown)': 'onKeydown($event)',
151
+ '(pointerdown)': 'onPointerDown($event)',
152
+ '(pointermove)': 'onPointerMove($event)',
153
+ '(pointerup)': 'onPointerUp($event)',
154
+ },
155
+ template: `
156
+ <div
157
+ class="pointer-events-none absolute inset-x-0 top-1/2 h-1.5 -translate-y-1/2 rounded-full bg-surface-alt"
158
+ >
159
+ <div
160
+ class="absolute inset-y-0 start-0 rounded-full bg-accent-fill"
161
+ [style.width.%]="percent()"
162
+ ></div>
163
+ </div>
164
+ <div
165
+ class="pointer-events-none absolute top-1/2 h-4 w-4 -translate-y-1/2 rounded-full border-2 border-accent bg-surface shadow-1"
166
+ [style.inset-inline-start.%]="percent()"
167
+ style="margin-inline-start: -8px"
168
+ ></div>
169
+ `,
170
+ providers: [{ provide: NG_VALUE_ACCESSOR, useExisting: forwardRef(() => Slider), multi: true }],
171
+ }]
172
+ }], propDecorators: { value: [{ type: i0.Input, args: [{ isSignal: true, alias: "value", required: false }] }, { type: i0.Output, args: ["valueChange"] }], min: [{ type: i0.Input, args: [{ isSignal: true, alias: "min", required: false }] }], max: [{ type: i0.Input, args: [{ isSignal: true, alias: "max", required: false }] }], step: [{ type: i0.Input, args: [{ isSignal: true, alias: "step", required: false }] }], disabled: [{ type: i0.Input, args: [{ isSignal: true, alias: "disabled", required: false }] }], ariaLabel: [{ type: i0.Input, args: [{ isSignal: true, alias: "ariaLabel", required: false }] }] } });
173
+
174
+ /**
175
+ * Generated bundle index. Do not edit.
176
+ */
177
+
178
+ export { Slider, sliderHostVariants };
179
+ //# sourceMappingURL=mesgflow-ui-kit-slider.mjs.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"mesgflow-ui-kit-slider.mjs","sources":["../../../projects/ui-kit/slider/slider.variants.ts","../../../projects/ui-kit/slider/slider.ts","../../../projects/ui-kit/slider/mesgflow-ui-kit-slider.ts"],"sourcesContent":["import { cva } from 'class-variance-authority';\r\n\r\nexport const sliderHostVariants = cva(\r\n 'relative block h-4 w-full cursor-pointer touch-none rounded-full select-none ' +\r\n 'focus-visible:outline focus-visible:outline-2 focus-visible:outline-offset-4 focus-visible:outline-focus-ring',\r\n {\r\n variants: {\r\n disabled: {\r\n true: 'pointer-events-none opacity-50',\r\n false: '',\r\n },\r\n },\r\n defaultVariants: { disabled: false },\r\n },\r\n);\r\n","import { Component, ElementRef, computed, forwardRef, inject, input, model } from '@angular/core';\r\nimport { NG_VALUE_ACCESSOR, type ControlValueAccessor } from '@angular/forms';\r\nimport { ValueAccessorBase, cn, inlineStartRatio, isRtl } from '@mesgflow/ui-kit/core';\r\nimport { sliderHostVariants } from './slider.variants';\r\n\r\n/**\r\n * `<mf-slider [(value)]=\"opacity\" [min]=\"0\" [max]=\"100\" [step]=\"5\" />` —\r\n * `@angular/aria`'da hazır bir slider pattern'i YOK (sadece accordion/\r\n * combobox/grid/listbox/menu/tabs/toolbar/tree var), bu yüzden ARIA\r\n * `role=\"slider\"` ve klavye (ok tuşları/Home/End/PageUp/PageDown) + pointer\r\n * sürükleme ELLE kuruldu — kodda hand-rolled ARIA'nın ikinci örneği\r\n * (ilki `Calendar`, bkz. README \"Takvim ızgarası bilerek grid KULLANMADI\").\r\n */\r\n@Component({\r\n selector: 'mf-slider',\r\n exportAs: 'mfSlider',\r\n host: {\r\n role: 'slider',\r\n tabindex: '0',\r\n '[attr.aria-valuemin]': 'min()',\r\n '[attr.aria-valuemax]': 'max()',\r\n '[attr.aria-valuenow]': 'value()',\r\n '[attr.aria-disabled]': 'disabled() || null',\r\n '[attr.aria-label]': 'ariaLabel() || null',\r\n '[class]': 'hostClasses()',\r\n '(keydown)': 'onKeydown($event)',\r\n '(pointerdown)': 'onPointerDown($event)',\r\n '(pointermove)': 'onPointerMove($event)',\r\n '(pointerup)': 'onPointerUp($event)',\r\n },\r\n template: `\r\n <div\r\n class=\"pointer-events-none absolute inset-x-0 top-1/2 h-1.5 -translate-y-1/2 rounded-full bg-surface-alt\"\r\n >\r\n <div\r\n class=\"absolute inset-y-0 start-0 rounded-full bg-accent-fill\"\r\n [style.width.%]=\"percent()\"\r\n ></div>\r\n </div>\r\n <div\r\n class=\"pointer-events-none absolute top-1/2 h-4 w-4 -translate-y-1/2 rounded-full border-2 border-accent bg-surface shadow-1\"\r\n [style.inset-inline-start.%]=\"percent()\"\r\n style=\"margin-inline-start: -8px\"\r\n ></div>\r\n `,\r\n providers: [{ provide: NG_VALUE_ACCESSOR, useExisting: forwardRef(() => Slider), multi: true }],\r\n})\r\nexport class Slider extends ValueAccessorBase<number> implements ControlValueAccessor {\r\n readonly value = model(0);\r\n readonly min = input(0);\r\n readonly max = input(100);\r\n readonly step = input(1);\r\n readonly disabled = input(false);\r\n readonly ariaLabel = input('');\r\n\r\n private readonly elementRef = inject(ElementRef<HTMLElement>);\r\n\r\n protected readonly percent = computed(() => {\r\n const range = this.max() - this.min();\r\n if (range <= 0) return 0;\r\n return ((this.value() - this.min()) / range) * 100;\r\n });\r\n\r\n protected readonly hostClasses = computed(() =>\r\n cn(sliderHostVariants({ disabled: this.disabled() })),\r\n );\r\n\r\n writeValue(value: number): void {\r\n this.value.set(value);\r\n }\r\n\r\n private clamp(raw: number): number {\r\n const stepped = Math.round((raw - this.min()) / this.step()) * this.step() + this.min();\r\n return Math.min(this.max(), Math.max(this.min(), stepped));\r\n }\r\n\r\n private setValue(next: number): void {\r\n this.value.set(next);\r\n this.onChange(next);\r\n this.onTouched();\r\n }\r\n\r\n protected onKeydown(event: KeyboardEvent): void {\r\n if (this.disabled()) return;\r\n const s = this.step();\r\n // Yatay oklar GÖRSEL yöne göre: RTL'de dolgu sağdan başladığı için → azaltır.\r\n const key = isRtl(this.elementRef.nativeElement)\r\n ? (({ ArrowRight: 'ArrowLeft', ArrowLeft: 'ArrowRight' } as Record<string, string>)[\r\n event.key\r\n ] ?? event.key)\r\n : event.key;\r\n switch (key) {\r\n case 'ArrowRight':\r\n case 'ArrowUp':\r\n event.preventDefault();\r\n this.setValue(this.clamp(this.value() + s));\r\n break;\r\n case 'ArrowLeft':\r\n case 'ArrowDown':\r\n event.preventDefault();\r\n this.setValue(this.clamp(this.value() - s));\r\n break;\r\n case 'Home':\r\n event.preventDefault();\r\n this.setValue(this.min());\r\n break;\r\n case 'End':\r\n event.preventDefault();\r\n this.setValue(this.max());\r\n break;\r\n case 'PageUp':\r\n event.preventDefault();\r\n this.setValue(this.clamp(this.value() + s * 10));\r\n break;\r\n case 'PageDown':\r\n event.preventDefault();\r\n this.setValue(this.clamp(this.value() - s * 10));\r\n break;\r\n }\r\n }\r\n\r\n protected onPointerDown(event: PointerEvent): void {\r\n if (this.disabled()) return;\r\n this.elementRef.nativeElement.setPointerCapture(event.pointerId);\r\n this.elementRef.nativeElement.focus();\r\n this.updateFromPointer(event);\r\n }\r\n\r\n protected onPointerMove(event: PointerEvent): void {\r\n if (this.disabled() || event.buttons !== 1) return;\r\n this.updateFromPointer(event);\r\n }\r\n\r\n protected onPointerUp(event: PointerEvent): void {\r\n this.elementRef.nativeElement.releasePointerCapture(event.pointerId);\r\n }\r\n\r\n private updateFromPointer(event: PointerEvent): void {\r\n const rect = this.elementRef.nativeElement.getBoundingClientRect();\r\n const ratio = inlineStartRatio(event.clientX, rect, isRtl(this.elementRef.nativeElement));\r\n const raw = this.min() + ratio * (this.max() - this.min());\r\n this.setValue(this.clamp(raw));\r\n }\r\n}\r\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":[],"mappings":";;;;;;AAEO,MAAM,kBAAkB,GAAG,GAAG,CACnC,+EAA+E;AAC7E,IAAA,+GAA+G,EACjH;AACE,IAAA,QAAQ,EAAE;AACR,QAAA,QAAQ,EAAE;AACR,YAAA,IAAI,EAAE,gCAAgC;AACtC,YAAA,KAAK,EAAE,EAAE;AACV,SAAA;AACF,KAAA;AACD,IAAA,eAAe,EAAE,EAAE,QAAQ,EAAE,KAAK,EAAE;AACrC,CAAA;;ACRH;;;;;;;AAOG;AAmCG,MAAO,MAAO,SAAQ,iBAAyB,CAAA;IAC1C,KAAK,GAAG,KAAK,CAAC,CAAC;8EAAC;IAChB,GAAG,GAAG,KAAK,CAAC,CAAC;4EAAC;IACd,GAAG,GAAG,KAAK,CAAC,GAAG;4EAAC;IAChB,IAAI,GAAG,KAAK,CAAC,CAAC;6EAAC;IACf,QAAQ,GAAG,KAAK,CAAC,KAAK;iFAAC;IACvB,SAAS,GAAG,KAAK,CAAC,EAAE;kFAAC;AAEb,IAAA,UAAU,GAAG,MAAM,EAAC,UAAuB,EAAC;AAE1C,IAAA,OAAO,GAAG,QAAQ,CAAC,MAAK;QACzC,MAAM,KAAK,GAAG,IAAI,CAAC,GAAG,EAAE,GAAG,IAAI,CAAC,GAAG,EAAE;QACrC,IAAI,KAAK,IAAI,CAAC;AAAE,YAAA,OAAO,CAAC;AACxB,QAAA,OAAO,CAAC,CAAC,IAAI,CAAC,KAAK,EAAE,GAAG,IAAI,CAAC,GAAG,EAAE,IAAI,KAAK,IAAI,GAAG;IACpD,CAAC;gFAAC;AAEiB,IAAA,WAAW,GAAG,QAAQ,CAAC,MACxC,EAAE,CAAC,kBAAkB,CAAC,EAAE,QAAQ,EAAE,IAAI,CAAC,QAAQ,EAAE,EAAE,CAAC,CAAC;oFACtD;AAED,IAAA,UAAU,CAAC,KAAa,EAAA;AACtB,QAAA,IAAI,CAAC,KAAK,CAAC,GAAG,CAAC,KAAK,CAAC;IACvB;AAEQ,IAAA,KAAK,CAAC,GAAW,EAAA;AACvB,QAAA,MAAM,OAAO,GAAG,IAAI,CAAC,KAAK,CAAC,CAAC,GAAG,GAAG,IAAI,CAAC,GAAG,EAAE,IAAI,IAAI,CAAC,IAAI,EAAE,CAAC,GAAG,IAAI,CAAC,IAAI,EAAE,GAAG,IAAI,CAAC,GAAG,EAAE;QACvF,OAAO,IAAI,CAAC,GAAG,CAAC,IAAI,CAAC,GAAG,EAAE,EAAE,IAAI,CAAC,GAAG,CAAC,IAAI,CAAC,GAAG,EAAE,EAAE,OAAO,CAAC,CAAC;IAC5D;AAEQ,IAAA,QAAQ,CAAC,IAAY,EAAA;AAC3B,QAAA,IAAI,CAAC,KAAK,CAAC,GAAG,CAAC,IAAI,CAAC;AACpB,QAAA,IAAI,CAAC,QAAQ,CAAC,IAAI,CAAC;QACnB,IAAI,CAAC,SAAS,EAAE;IAClB;AAEU,IAAA,SAAS,CAAC,KAAoB,EAAA;QACtC,IAAI,IAAI,CAAC,QAAQ,EAAE;YAAE;AACrB,QAAA,MAAM,CAAC,GAAG,IAAI,CAAC,IAAI,EAAE;;QAErB,MAAM,GAAG,GAAG,KAAK,CAAC,IAAI,CAAC,UAAU,CAAC,aAAa;eACzC,EAAE,UAAU,EAAE,WAAW,EAAE,SAAS,EAAE,YAAY,EAA6B,CAC/E,KAAK,CAAC,GAAG,CACV,IAAI,KAAK,CAAC,GAAG;AAChB,cAAE,KAAK,CAAC,GAAG;QACb,QAAQ,GAAG;AACT,YAAA,KAAK,YAAY;AACjB,YAAA,KAAK,SAAS;gBACZ,KAAK,CAAC,cAAc,EAAE;AACtB,gBAAA,IAAI,CAAC,QAAQ,CAAC,IAAI,CAAC,KAAK,CAAC,IAAI,CAAC,KAAK,EAAE,GAAG,CAAC,CAAC,CAAC;gBAC3C;AACF,YAAA,KAAK,WAAW;AAChB,YAAA,KAAK,WAAW;gBACd,KAAK,CAAC,cAAc,EAAE;AACtB,gBAAA,IAAI,CAAC,QAAQ,CAAC,IAAI,CAAC,KAAK,CAAC,IAAI,CAAC,KAAK,EAAE,GAAG,CAAC,CAAC,CAAC;gBAC3C;AACF,YAAA,KAAK,MAAM;gBACT,KAAK,CAAC,cAAc,EAAE;gBACtB,IAAI,CAAC,QAAQ,CAAC,IAAI,CAAC,GAAG,EAAE,CAAC;gBACzB;AACF,YAAA,KAAK,KAAK;gBACR,KAAK,CAAC,cAAc,EAAE;gBACtB,IAAI,CAAC,QAAQ,CAAC,IAAI,CAAC,GAAG,EAAE,CAAC;gBACzB;AACF,YAAA,KAAK,QAAQ;gBACX,KAAK,CAAC,cAAc,EAAE;AACtB,gBAAA,IAAI,CAAC,QAAQ,CAAC,IAAI,CAAC,KAAK,CAAC,IAAI,CAAC,KAAK,EAAE,GAAG,CAAC,GAAG,EAAE,CAAC,CAAC;gBAChD;AACF,YAAA,KAAK,UAAU;gBACb,KAAK,CAAC,cAAc,EAAE;AACtB,gBAAA,IAAI,CAAC,QAAQ,CAAC,IAAI,CAAC,KAAK,CAAC,IAAI,CAAC,KAAK,EAAE,GAAG,CAAC,GAAG,EAAE,CAAC,CAAC;gBAChD;;IAEN;AAEU,IAAA,aAAa,CAAC,KAAmB,EAAA;QACzC,IAAI,IAAI,CAAC,QAAQ,EAAE;YAAE;QACrB,IAAI,CAAC,UAAU,CAAC,aAAa,CAAC,iBAAiB,CAAC,KAAK,CAAC,SAAS,CAAC;AAChE,QAAA,IAAI,CAAC,UAAU,CAAC,aAAa,CAAC,KAAK,EAAE;AACrC,QAAA,IAAI,CAAC,iBAAiB,CAAC,KAAK,CAAC;IAC/B;AAEU,IAAA,aAAa,CAAC,KAAmB,EAAA;QACzC,IAAI,IAAI,CAAC,QAAQ,EAAE,IAAI,KAAK,CAAC,OAAO,KAAK,CAAC;YAAE;AAC5C,QAAA,IAAI,CAAC,iBAAiB,CAAC,KAAK,CAAC;IAC/B;AAEU,IAAA,WAAW,CAAC,KAAmB,EAAA;QACvC,IAAI,CAAC,UAAU,CAAC,aAAa,CAAC,qBAAqB,CAAC,KAAK,CAAC,SAAS,CAAC;IACtE;AAEQ,IAAA,iBAAiB,CAAC,KAAmB,EAAA;QAC3C,MAAM,IAAI,GAAG,IAAI,CAAC,UAAU,CAAC,aAAa,CAAC,qBAAqB,EAAE;AAClE,QAAA,MAAM,KAAK,GAAG,gBAAgB,CAAC,KAAK,CAAC,OAAO,EAAE,IAAI,EAAE,KAAK,CAAC,IAAI,CAAC,UAAU,CAAC,aAAa,CAAC,CAAC;QACzF,MAAM,GAAG,GAAG,IAAI,CAAC,GAAG,EAAE,GAAG,KAAK,IAAI,IAAI,CAAC,GAAG,EAAE,GAAG,IAAI,CAAC,GAAG,EAAE,CAAC;QAC1D,IAAI,CAAC,QAAQ,CAAC,IAAI,CAAC,KAAK,CAAC,GAAG,CAAC,CAAC;IAChC;uGA/FW,MAAM,EAAA,IAAA,EAAA,IAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,SAAA,EAAA,CAAA;2FAAN,MAAM,EAAA,YAAA,EAAA,IAAA,EAAA,QAAA,EAAA,WAAA,EAAA,MAAA,EAAA,EAAA,KAAA,EAAA,EAAA,iBAAA,EAAA,OAAA,EAAA,UAAA,EAAA,OAAA,EAAA,QAAA,EAAA,IAAA,EAAA,UAAA,EAAA,KAAA,EAAA,iBAAA,EAAA,IAAA,EAAA,EAAA,GAAA,EAAA,EAAA,iBAAA,EAAA,KAAA,EAAA,UAAA,EAAA,KAAA,EAAA,QAAA,EAAA,IAAA,EAAA,UAAA,EAAA,KAAA,EAAA,iBAAA,EAAA,IAAA,EAAA,EAAA,GAAA,EAAA,EAAA,iBAAA,EAAA,KAAA,EAAA,UAAA,EAAA,KAAA,EAAA,QAAA,EAAA,IAAA,EAAA,UAAA,EAAA,KAAA,EAAA,iBAAA,EAAA,IAAA,EAAA,EAAA,IAAA,EAAA,EAAA,iBAAA,EAAA,MAAA,EAAA,UAAA,EAAA,MAAA,EAAA,QAAA,EAAA,IAAA,EAAA,UAAA,EAAA,KAAA,EAAA,iBAAA,EAAA,IAAA,EAAA,EAAA,QAAA,EAAA,EAAA,iBAAA,EAAA,UAAA,EAAA,UAAA,EAAA,UAAA,EAAA,QAAA,EAAA,IAAA,EAAA,UAAA,EAAA,KAAA,EAAA,iBAAA,EAAA,IAAA,EAAA,EAAA,SAAA,EAAA,EAAA,iBAAA,EAAA,WAAA,EAAA,UAAA,EAAA,WAAA,EAAA,QAAA,EAAA,IAAA,EAAA,UAAA,EAAA,KAAA,EAAA,iBAAA,EAAA,IAAA,EAAA,EAAA,EAAA,OAAA,EAAA,EAAA,KAAA,EAAA,aAAA,EAAA,EAAA,IAAA,EAAA,EAAA,UAAA,EAAA,EAAA,MAAA,EAAA,QAAA,EAAA,UAAA,EAAA,GAAA,EAAA,EAAA,SAAA,EAAA,EAAA,SAAA,EAAA,mBAAA,EAAA,aAAA,EAAA,uBAAA,EAAA,aAAA,EAAA,uBAAA,EAAA,WAAA,EAAA,qBAAA,EAAA,EAAA,UAAA,EAAA,EAAA,oBAAA,EAAA,OAAA,EAAA,oBAAA,EAAA,OAAA,EAAA,oBAAA,EAAA,SAAA,EAAA,oBAAA,EAAA,oBAAA,EAAA,iBAAA,EAAA,qBAAA,EAAA,OAAA,EAAA,eAAA,EAAA,EAAA,EAAA,SAAA,EAFN,CAAC,EAAE,OAAO,EAAE,iBAAiB,EAAE,WAAW,EAAE,UAAU,CAAC,MAAM,MAAM,CAAC,EAAE,KAAK,EAAE,IAAI,EAAE,CAAC,EAAA,QAAA,EAAA,CAAA,UAAA,CAAA,EAAA,eAAA,EAAA,IAAA,EAAA,QAAA,EAAA,EAAA,EAAA,QAAA,EAfrF,CAAA;;;;;;;;;;;;;;AAcT,EAAA,CAAA,EAAA,QAAA,EAAA,IAAA,EAAA,CAAA;;2FAGU,MAAM,EAAA,UAAA,EAAA,CAAA;kBAlClB,SAAS;AAAC,YAAA,IAAA,EAAA,CAAA;AACT,oBAAA,QAAQ,EAAE,WAAW;AACrB,oBAAA,QAAQ,EAAE,UAAU;AACpB,oBAAA,IAAI,EAAE;AACJ,wBAAA,IAAI,EAAE,QAAQ;AACd,wBAAA,QAAQ,EAAE,GAAG;AACb,wBAAA,sBAAsB,EAAE,OAAO;AAC/B,wBAAA,sBAAsB,EAAE,OAAO;AAC/B,wBAAA,sBAAsB,EAAE,SAAS;AACjC,wBAAA,sBAAsB,EAAE,oBAAoB;AAC5C,wBAAA,mBAAmB,EAAE,qBAAqB;AAC1C,wBAAA,SAAS,EAAE,eAAe;AAC1B,wBAAA,WAAW,EAAE,mBAAmB;AAChC,wBAAA,eAAe,EAAE,uBAAuB;AACxC,wBAAA,eAAe,EAAE,uBAAuB;AACxC,wBAAA,aAAa,EAAE,qBAAqB;AACrC,qBAAA;AACD,oBAAA,QAAQ,EAAE,CAAA;;;;;;;;;;;;;;AAcT,EAAA,CAAA;oBACD,SAAS,EAAE,CAAC,EAAE,OAAO,EAAE,iBAAiB,EAAE,WAAW,EAAE,UAAU,CAAC,YAAY,CAAC,EAAE,KAAK,EAAE,IAAI,EAAE,CAAC;AAChG,iBAAA;;;AC9CD;;AAEG;;"}
@@ -0,0 +1,67 @@
1
+ import * as i0 from '@angular/core';
2
+ import { input, inject, computed, Component } from '@angular/core';
3
+ import { MF_COMMON_LABELS, cn } from '@mesgflow/ui-kit/core';
4
+ import { Icon } from '@mesgflow/ui-kit/icon';
5
+
6
+ const SIZE_PX = { xs: 14, sm: 16, md: 20, lg: 24 };
7
+ const TONE_CLASS = {
8
+ /** Ambient metin rengini MİRAS ALIR — ör. dolu bir butonun içine gömülü spinner, butonun kendi `text-fg-on-accent`'ini otomatik kullanır. Varsayılan. */
9
+ current: 'text-current',
10
+ neutral: 'text-fg-subtle',
11
+ primary: 'text-accent',
12
+ success: 'text-success',
13
+ warning: 'text-warning',
14
+ danger: 'text-danger',
15
+ info: 'text-info',
16
+ help: 'text-help',
17
+ };
18
+ /**
19
+ * `<mf-spinner size="sm" />` — dönen yüklenme göstergesi. Ayrı bir SVG/CSS
20
+ * animasyonu ÇİZMEK yerine kitin zaten her yerde kullandığı `progress_activity`
21
+ * Material Symbol'ü + `animate-spin` deseni tekrar kullanılıyor (bkz.
22
+ * `ConfirmDialog`'un onay butonu) — tüm "yükleniyor" göstergeleri tek bir
23
+ * görsel dil konuşuyor.
24
+ *
25
+ * `role="status"` + `aria-label` HOST'ta (ikonun kendisi `Icon` directive'i
26
+ * gereği her zaman `aria-hidden` — bkz. icon.ts) — ekran okuyucu ligature
27
+ * kaynak metnini ("progress_activity") DEĞİL, buradaki anlamlı etiketi anons eder.
28
+ */
29
+ class Spinner {
30
+ size = input('md', /* @ts-ignore */
31
+ ...(ngDevMode ? [{ debugName: "size" }] : /* istanbul ignore next */ []));
32
+ tone = input('current', /* @ts-ignore */
33
+ ...(ngDevMode ? [{ debugName: "tone" }] : /* istanbul ignore next */ []));
34
+ /** Verilmezse `MF_COMMON_LABELS`'ın `loading`'i kullanılır (bkz. `provideMesgflowUi`). */
35
+ ariaLabel = input(/* @ts-ignore */
36
+ ...(ngDevMode ? [undefined, { debugName: "ariaLabel" }] : /* istanbul ignore next */ []));
37
+ commonLabels = inject(MF_COMMON_LABELS);
38
+ effectiveAriaLabel = computed(() => this.ariaLabel() ?? this.commonLabels().loading, /* @ts-ignore */
39
+ ...(ngDevMode ? [{ debugName: "effectiveAriaLabel" }] : /* istanbul ignore next */ []));
40
+ sizePx = computed(() => SIZE_PX[this.size()], /* @ts-ignore */
41
+ ...(ngDevMode ? [{ debugName: "sizePx" }] : /* istanbul ignore next */ []));
42
+ iconClasses = computed(() => cn('animate-spin', TONE_CLASS[this.tone()]), /* @ts-ignore */
43
+ ...(ngDevMode ? [{ debugName: "iconClasses" }] : /* istanbul ignore next */ []));
44
+ static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.6", ngImport: i0, type: Spinner, deps: [], target: i0.ɵɵFactoryTarget.Component });
45
+ static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "22.1.6", type: Spinner, isStandalone: true, selector: "mf-spinner", inputs: { size: { classPropertyName: "size", publicName: "size", isSignal: true, isRequired: false, transformFunction: null }, tone: { classPropertyName: "tone", publicName: "tone", isSignal: true, isRequired: false, transformFunction: null }, ariaLabel: { classPropertyName: "ariaLabel", publicName: "ariaLabel", isSignal: true, isRequired: false, transformFunction: null } }, host: { attributes: { "role": "status" }, properties: { "attr.aria-label": "effectiveAriaLabel()" }, classAttribute: "inline-flex" }, exportAs: ["mfSpinner"], ngImport: i0, template: `<span mfIcon [size]="sizePx()" [class]="iconClasses()">progress_activity</span>`, isInline: true, dependencies: [{ kind: "directive", type: Icon, selector: "span[mfIcon]", inputs: ["size", "filled"] }] });
46
+ }
47
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.6", ngImport: i0, type: Spinner, decorators: [{
48
+ type: Component,
49
+ args: [{
50
+ selector: 'mf-spinner',
51
+ exportAs: 'mfSpinner',
52
+ imports: [Icon],
53
+ host: {
54
+ class: 'inline-flex',
55
+ role: 'status',
56
+ '[attr.aria-label]': 'effectiveAriaLabel()',
57
+ },
58
+ template: `<span mfIcon [size]="sizePx()" [class]="iconClasses()">progress_activity</span>`,
59
+ }]
60
+ }], propDecorators: { size: [{ type: i0.Input, args: [{ isSignal: true, alias: "size", required: false }] }], tone: [{ type: i0.Input, args: [{ isSignal: true, alias: "tone", required: false }] }], ariaLabel: [{ type: i0.Input, args: [{ isSignal: true, alias: "ariaLabel", required: false }] }] } });
61
+
62
+ /**
63
+ * Generated bundle index. Do not edit.
64
+ */
65
+
66
+ export { Spinner };
67
+ //# sourceMappingURL=mesgflow-ui-kit-spinner.mjs.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"mesgflow-ui-kit-spinner.mjs","sources":["../../../projects/ui-kit/spinner/spinner.ts","../../../projects/ui-kit/spinner/mesgflow-ui-kit-spinner.ts"],"sourcesContent":["import { Component, computed, inject, input } from '@angular/core';\r\nimport { cn, MF_COMMON_LABELS, type MfSize, type MfTone } from '@mesgflow/ui-kit/core';\r\nimport { Icon } from '@mesgflow/ui-kit/icon';\r\n\r\nexport type SpinnerSize = 'xs' | MfSize;\r\nexport type SpinnerTone = MfTone | 'current';\r\n\r\nconst SIZE_PX: Record<SpinnerSize, number> = { xs: 14, sm: 16, md: 20, lg: 24 };\r\n\r\nconst TONE_CLASS: Record<SpinnerTone, string> = {\r\n /** Ambient metin rengini MİRAS ALIR — ör. dolu bir butonun içine gömülü spinner, butonun kendi `text-fg-on-accent`'ini otomatik kullanır. Varsayılan. */\r\n current: 'text-current',\r\n neutral: 'text-fg-subtle',\r\n primary: 'text-accent',\r\n success: 'text-success',\r\n warning: 'text-warning',\r\n danger: 'text-danger',\r\n info: 'text-info',\r\n help: 'text-help',\r\n};\r\n\r\n/**\r\n * `<mf-spinner size=\"sm\" />` — dönen yüklenme göstergesi. Ayrı bir SVG/CSS\r\n * animasyonu ÇİZMEK yerine kitin zaten her yerde kullandığı `progress_activity`\r\n * Material Symbol'ü + `animate-spin` deseni tekrar kullanılıyor (bkz.\r\n * `ConfirmDialog`'un onay butonu) — tüm \"yükleniyor\" göstergeleri tek bir\r\n * görsel dil konuşuyor.\r\n *\r\n * `role=\"status\"` + `aria-label` HOST'ta (ikonun kendisi `Icon` directive'i\r\n * gereği her zaman `aria-hidden` — bkz. icon.ts) — ekran okuyucu ligature\r\n * kaynak metnini (\"progress_activity\") DEĞİL, buradaki anlamlı etiketi anons eder.\r\n */\r\n@Component({\r\n selector: 'mf-spinner',\r\n exportAs: 'mfSpinner',\r\n imports: [Icon],\r\n host: {\r\n class: 'inline-flex',\r\n role: 'status',\r\n '[attr.aria-label]': 'effectiveAriaLabel()',\r\n },\r\n template: `<span mfIcon [size]=\"sizePx()\" [class]=\"iconClasses()\">progress_activity</span>`,\r\n})\r\nexport class Spinner {\r\n readonly size = input<SpinnerSize>('md');\r\n readonly tone = input<SpinnerTone>('current');\r\n /** Verilmezse `MF_COMMON_LABELS`'ın `loading`'i kullanılır (bkz. `provideMesgflowUi`). */\r\n readonly ariaLabel = input<string>();\r\n\r\n private readonly commonLabels = inject(MF_COMMON_LABELS);\r\n protected readonly effectiveAriaLabel = computed(\r\n () => this.ariaLabel() ?? this.commonLabels().loading,\r\n );\r\n\r\n protected readonly sizePx = computed(() => SIZE_PX[this.size()]);\r\n protected readonly iconClasses = computed(() => cn('animate-spin', TONE_CLASS[this.tone()]));\r\n}\r\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":[],"mappings":"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"}
@@ -0,0 +1,97 @@
1
+ import * as i0 from '@angular/core';
2
+ import { input, inject, ElementRef, linkedSignal, computed, Component } from '@angular/core';
3
+ import { cn, inlineStartRatio, isRtl } from '@mesgflow/ui-kit/core';
4
+
5
+ /**
6
+ * `<mf-splitter><div splitterPane1>Sol</div><div splitterPane2>Sağ</div></mf-splitter>`
7
+ *
8
+ * Tuvalin iki yanındaki yeniden boyutlanabilir paneller için — `@angular/aria`'da
9
+ * hazır bir splitter pattern'i YOK, `role="separator"` + klavye (ok tuşları/
10
+ * Home/End) + pointer sürükleme ELLE kuruldu (Slider'daki AYNI hand-rolled
11
+ * ARIA yaklaşımı). Yüzde tabanlı bölünme (`flex-basis: %`) — piksel değil,
12
+ * konteyner yeniden boyutlandığında oran korunur.
13
+ *
14
+ * `currentSplit` BİLEREK `linkedSignal(() => this.initialSplit())` — düz bir
15
+ * `signal(50)` + constructor'da `.set(this.initialSplit())` YERİNE (BULUNAN
16
+ * GERÇEK HATA: constructor çalıştığı anda `input()` sinyali HENÜZ bağlanan
17
+ * değere sahip DEĞİL, `initialSplit()` varsayılana — 50 — düşüyor ve
18
+ * `currentSplit` bir daha ASLA güncellenmiyordu; `[split]="20"` gibi
19
+ * varsayılan-DIŞI bir değer SESSİZCE yok sayılıyordu, gerçek tarayıcıda
20
+ * `aria-valuenow` okununca ortaya çıktı). `linkedSignal` hem `initialSplit()`
21
+ * değiştiğinde YENİDEN hesaplanıyor HEM DE sürükleme/klavye ile YEREL
22
+ * `.set()`'e izin veriyor (CLAUDE.md: "birden çok reaktif kaynaktan türeyen
23
+ * VE senkron kalması gereken durum için `linkedSignal()`").
24
+ */
25
+ class Splitter {
26
+ orientation = input('horizontal', /* @ts-ignore */
27
+ ...(ngDevMode ? [{ debugName: "orientation" }] : /* istanbul ignore next */ []));
28
+ min = input(10, /* @ts-ignore */
29
+ ...(ngDevMode ? [{ debugName: "min" }] : /* istanbul ignore next */ []));
30
+ max = input(90, /* @ts-ignore */
31
+ ...(ngDevMode ? [{ debugName: "max" }] : /* istanbul ignore next */ []));
32
+ // Alias `split` mevcut public API — yeniden adlandırma kırıcı, ileri bir sürümde ele alınacak.
33
+ // eslint-disable-next-line @angular-eslint/no-input-rename
34
+ initialSplit = input(50, { ...(ngDevMode ? { debugName: "initialSplit" } : /* istanbul ignore next */ {}), alias: 'split' });
35
+ elementRef = inject((ElementRef));
36
+ currentSplit = linkedSignal(() => this.initialSplit(), /* @ts-ignore */
37
+ ...(ngDevMode ? [{ debugName: "currentSplit" }] : /* istanbul ignore next */ []));
38
+ hostClasses = computed(() => cn('flex h-full w-full', this.orientation() === 'vertical' ? 'flex-col' : 'flex-row'), /* @ts-ignore */
39
+ ...(ngDevMode ? [{ debugName: "hostClasses" }] : /* istanbul ignore next */ []));
40
+ clamp(v) {
41
+ return Math.min(this.max(), Math.max(this.min(), v));
42
+ }
43
+ onPointerDown(event) {
44
+ const handle = event.currentTarget;
45
+ handle.setPointerCapture(event.pointerId);
46
+ }
47
+ onPointerMove(event) {
48
+ if (event.buttons !== 1)
49
+ return;
50
+ const rect = this.elementRef.nativeElement.getBoundingClientRect();
51
+ const isVertical = this.orientation() === 'vertical';
52
+ // Yatayda ilk panel satır başında durur — RTL'de sağda; oran oradan ölçülür.
53
+ const ratio = isVertical
54
+ ? (event.clientY - rect.top) / rect.height
55
+ : inlineStartRatio(event.clientX, rect, isRtl(this.elementRef.nativeElement));
56
+ this.currentSplit.set(this.clamp(Math.round(ratio * 100)));
57
+ }
58
+ onPointerUp(event) {
59
+ event.currentTarget.releasePointerCapture(event.pointerId);
60
+ }
61
+ onKeydown(event) {
62
+ const isVertical = this.orientation() === 'vertical';
63
+ // Yatay oklar görsel yöne göre: RTL'de ← ayırıcıyı satır sonuna (sola) iter, ilk paneli büyütür.
64
+ const rtl = !isVertical && isRtl(this.elementRef.nativeElement);
65
+ const increaseKey = isVertical ? 'ArrowDown' : rtl ? 'ArrowLeft' : 'ArrowRight';
66
+ const decreaseKey = isVertical ? 'ArrowUp' : rtl ? 'ArrowRight' : 'ArrowLeft';
67
+ if (event.key === increaseKey) {
68
+ event.preventDefault();
69
+ this.currentSplit.update((v) => this.clamp(v + 2));
70
+ }
71
+ else if (event.key === decreaseKey) {
72
+ event.preventDefault();
73
+ this.currentSplit.update((v) => this.clamp(v - 2));
74
+ }
75
+ else if (event.key === 'Home') {
76
+ event.preventDefault();
77
+ this.currentSplit.set(this.min());
78
+ }
79
+ else if (event.key === 'End') {
80
+ event.preventDefault();
81
+ this.currentSplit.set(this.max());
82
+ }
83
+ }
84
+ static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.6", ngImport: i0, type: Splitter, deps: [], target: i0.ɵɵFactoryTarget.Component });
85
+ static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "22.1.6", type: Splitter, isStandalone: true, selector: "mf-splitter", inputs: { orientation: { classPropertyName: "orientation", publicName: "orientation", isSignal: true, isRequired: false, transformFunction: null }, min: { classPropertyName: "min", publicName: "min", isSignal: true, isRequired: false, transformFunction: null }, max: { classPropertyName: "max", publicName: "max", isSignal: true, isRequired: false, transformFunction: null }, initialSplit: { classPropertyName: "initialSplit", publicName: "split", isSignal: true, isRequired: false, transformFunction: null } }, host: { properties: { "class": "hostClasses()" } }, exportAs: ["mfSplitter"], ngImport: i0, template: "<div class=\"min-h-0 min-w-0 overflow-auto\" [style.flex]=\"currentSplit() + '% 0 0'\">\r\n <ng-content select=\"[splitterPane1]\" />\r\n</div>\r\n\r\n<div\r\n role=\"separator\"\r\n tabindex=\"0\"\r\n [attr.aria-orientation]=\"orientation() === 'vertical' ? 'horizontal' : 'vertical'\"\r\n [attr.aria-valuenow]=\"currentSplit()\"\r\n [attr.aria-valuemin]=\"min()\"\r\n [attr.aria-valuemax]=\"max()\"\r\n [class]=\"\r\n 'shrink-0 touch-none bg-border transition-colors duration-fast ease-emphasis hover:bg-accent focus-visible:outline focus-visible:outline-2 focus-visible:-outline-offset-2 focus-visible:outline-focus-ring ' +\r\n (orientation() === 'vertical' ? 'h-1 w-full cursor-row-resize' : 'w-1 cursor-col-resize')\r\n \"\r\n (pointerdown)=\"onPointerDown($event)\"\r\n (pointermove)=\"onPointerMove($event)\"\r\n (pointerup)=\"onPointerUp($event)\"\r\n (keydown)=\"onKeydown($event)\"\r\n></div>\r\n\r\n<div class=\"min-h-0 min-w-0 flex-1 overflow-auto\">\r\n <ng-content select=\"[splitterPane2]\" />\r\n</div>\r\n" });
86
+ }
87
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.6", ngImport: i0, type: Splitter, decorators: [{
88
+ type: Component,
89
+ args: [{ selector: 'mf-splitter', exportAs: 'mfSplitter', host: { '[class]': 'hostClasses()' }, template: "<div class=\"min-h-0 min-w-0 overflow-auto\" [style.flex]=\"currentSplit() + '% 0 0'\">\r\n <ng-content select=\"[splitterPane1]\" />\r\n</div>\r\n\r\n<div\r\n role=\"separator\"\r\n tabindex=\"0\"\r\n [attr.aria-orientation]=\"orientation() === 'vertical' ? 'horizontal' : 'vertical'\"\r\n [attr.aria-valuenow]=\"currentSplit()\"\r\n [attr.aria-valuemin]=\"min()\"\r\n [attr.aria-valuemax]=\"max()\"\r\n [class]=\"\r\n 'shrink-0 touch-none bg-border transition-colors duration-fast ease-emphasis hover:bg-accent focus-visible:outline focus-visible:outline-2 focus-visible:-outline-offset-2 focus-visible:outline-focus-ring ' +\r\n (orientation() === 'vertical' ? 'h-1 w-full cursor-row-resize' : 'w-1 cursor-col-resize')\r\n \"\r\n (pointerdown)=\"onPointerDown($event)\"\r\n (pointermove)=\"onPointerMove($event)\"\r\n (pointerup)=\"onPointerUp($event)\"\r\n (keydown)=\"onKeydown($event)\"\r\n></div>\r\n\r\n<div class=\"min-h-0 min-w-0 flex-1 overflow-auto\">\r\n <ng-content select=\"[splitterPane2]\" />\r\n</div>\r\n" }]
90
+ }], propDecorators: { orientation: [{ type: i0.Input, args: [{ isSignal: true, alias: "orientation", required: false }] }], min: [{ type: i0.Input, args: [{ isSignal: true, alias: "min", required: false }] }], max: [{ type: i0.Input, args: [{ isSignal: true, alias: "max", required: false }] }], initialSplit: [{ type: i0.Input, args: [{ isSignal: true, alias: "split", required: false }] }] } });
91
+
92
+ /**
93
+ * Generated bundle index. Do not edit.
94
+ */
95
+
96
+ export { Splitter };
97
+ //# sourceMappingURL=mesgflow-ui-kit-splitter.mjs.map