@mesgflow/ui-kit 0.6.0 → 0.7.0

package/fesm2022/mesgflow-ui-kit-checkbox.mjs

@@ -1,41 +1,36 @@
 import * as i0 from '@angular/core';
 import { input, computed, Directive } from '@angular/core';
-import { cn } from '@mesgflow/ui-kit/core';
+import { cn, focusRecipe } from '@mesgflow/ui-kit/core';
 
 const SIZE_CLASSES = { sm: 'h-3.5 w-3.5', md: 'h-4 w-4', lg: 'h-5 w-5' };
 /**
- * `<input type="checkbox" mfCheckbox">` — `accent-color` (modern tarayıcı
- * desteği) native checkbox'ın kendi tik/kutu görselini renklendiriyor, ayrı
- * bir cva şemasına gerek yok (Switch'in aksine burada özel track+thumb
- * görseli istemiyoruz, native checkbox görünümü + marka rengi yeterli).
+ * `<input type="checkbox" mfCheckbox [indeterminate]="some()">` — native
+ * `<input>` kalır (klavye/form/erişilebilirlik ağacı değişmez), görsel katman
+ * `mf-check` utility'si (styles/tokens/controls.css): rol token'lı kutu,
+ * yay eğrisiyle büyüyen işaret, `indeterminate` çizgisi, hover'da marka
+ * kenarlığı, basınca hafif küçülme.
  */
 class Checkbox {
     size = input('md', /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "size" }] : /* istanbul ignore next */ []));
-    classes = computed(() => cn(
-    // `accent-color` (tik/kutu rengi) BİLEREK Button'daki "büyük dolu blok
-    // dark modda parlamaz" kuralının DIŞINDA — burada işaretlenmiş bir
-    // checkbox küçük/ince bir öğe, dark modda 400 basamağına parlaması
-    // (`Tailwind'in accent-* utility'si "accent-color" CSS property'sini
-    // besliyor, tek class'ta iki değer alamıyor, o yüzden burada tek yerde
-    // manuel dark: eşleniği var) okunabilirliği artırıyor. Focus artık
-    // tüm primitifler genelinde tek mekanizma olan native `outline`
-    // (bkz. button.variants.ts'teki focus notu) — eski `ring-2 ring-offset-2`
-    // box-shadow'u kalktı.
-    SIZE_CLASSES[this.size()], 'shrink-0 rounded-xs border-border accent-primary-600 dark:accent-primary-400 transition-colors duration-fast ease-emphasis ' +
-        'focus-visible:outline focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-focus-ring ' +
-        'disabled:pointer-events-none disabled:cursor-not-allowed disabled:opacity-50'), /* @ts-ignore */
+    /** "Kısmen seçili" (ör. tablo başlığındaki tümünü-seç) — native `indeterminate` özelliğine yazılır, `aria-checked="mixed"` tarayıcı tarafından anons edilir. */
+    indeterminate = input(false, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "indeterminate" }] : /* istanbul ignore next */ []));
+    classes = computed(() => cn('mf-check', SIZE_CLASSES[this.size()], focusRecipe), /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "classes" }] : /* istanbul ignore next */ []));
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.6", ngImport: i0, type: Checkbox, deps: [], target: i0.ɵɵFactoryTarget.Directive });
-    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "22.1.6", type: Checkbox, isStandalone: true, selector: "input[type=checkbox][mfCheckbox]", inputs: { size: { classPropertyName: "size", publicName: "size", isSignal: true, isRequired: false, transformFunction: null } }, host: { properties: { "class": "classes()" } }, ngImport: i0 });
+    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "22.1.6", type: Checkbox, isStandalone: true, selector: "input[type=checkbox][mfCheckbox]", inputs: { size: { classPropertyName: "size", publicName: "size", isSignal: true, isRequired: false, transformFunction: null }, indeterminate: { classPropertyName: "indeterminate", publicName: "indeterminate", isSignal: true, isRequired: false, transformFunction: null } }, host: { properties: { "class": "classes()", "indeterminate": "indeterminate()" } }, ngImport: i0 });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.6", ngImport: i0, type: Checkbox, decorators: [{
             type: Directive,
             args: [{
                     selector: 'input[type=checkbox][mfCheckbox]',
-                    host: { '[class]': 'classes()' },
+                    host: {
+                        '[class]': 'classes()',
+                        '[indeterminate]': 'indeterminate()',
+                    },
                 }]
-        }], propDecorators: { size: [{ type: i0.Input, args: [{ isSignal: true, alias: "size", required: false }] }] } });
+        }], propDecorators: { size: [{ type: i0.Input, args: [{ isSignal: true, alias: "size", required: false }] }], indeterminate: [{ type: i0.Input, args: [{ isSignal: true, alias: "indeterminate", required: false }] }] } });
 
 /**
  * Generated bundle index. Do not edit.

package/fesm2022/mesgflow-ui-kit-checkbox.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"mesgflow-ui-kit-checkbox.mjs","sources":["../../../projects/ui-kit/checkbox/checkbox.ts","../../../projects/ui-kit/checkbox/mesgflow-ui-kit-checkbox.ts"],"sourcesContent":["import { Directive, computed, input } from '@angular/core';\r\nimport { cn, type MfSize } from '@mesgflow/ui-kit/core';\r\n\r\nconst SIZE_CLASSES: Record<MfSize, string> = { sm: 'h-3.5 w-3.5', md: 'h-4 w-4', lg: 'h-5 w-5' };\r\n\r\n/**\r\n * `<input type=\"checkbox\" mfCheckbox\">` — `accent-color` (modern tarayıcı\r\n * desteği) native checkbox'ın kendi tik/kutu görselini renklendiriyor, ayrı\r\n * bir cva şemasına gerek yok (Switch'in aksine burada özel track+thumb\r\n * görseli istemiyoruz, native checkbox görünümü + marka rengi yeterli).\r\n */\r\n@Directive({\r\n  selector: 'input[type=checkbox][mfCheckbox]',\r\n  host: { '[class]': 'classes()' },\r\n})\r\nexport class Checkbox {\r\n  readonly size = input<MfSize>('md');\r\n\r\n  protected readonly classes = computed(() =>\r\n    cn(\r\n      // `accent-color` (tik/kutu rengi) BİLEREK Button'daki \"büyük dolu blok\r\n      // dark modda parlamaz\" kuralının DIŞINDA — burada işaretlenmiş bir\r\n      // checkbox küçük/ince bir öğe, dark modda 400 basamağına parlaması\r\n      // (`Tailwind'in accent-* utility'si \"accent-color\" CSS property'sini\r\n      // besliyor, tek class'ta iki değer alamıyor, o yüzden burada tek yerde\r\n      // manuel dark: eşleniği var) okunabilirliği artırıyor. Focus artık\r\n      // tüm primitifler genelinde tek mekanizma olan native `outline`\r\n      // (bkz. button.variants.ts'teki focus notu) — eski `ring-2 ring-offset-2`\r\n      // box-shadow'u kalktı.\r\n      SIZE_CLASSES[this.size()],\r\n      'shrink-0 rounded-xs border-border accent-primary-600 dark:accent-primary-400 transition-colors duration-fast ease-emphasis ' +\r\n        'focus-visible:outline focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-focus-ring ' +\r\n        'disabled:pointer-events-none disabled:cursor-not-allowed disabled:opacity-50',\r\n    ),\r\n  );\r\n}\r\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":[],"mappings":";;;;AAGA,MAAM,YAAY,GAA2B,EAAE,EAAE,EAAE,aAAa,EAAE,EAAE,EAAE,SAAS,EAAE,EAAE,EAAE,SAAS,EAAE;AAEhG;;;;;AAKG;MAKU,QAAQ,CAAA;IACV,IAAI,GAAG,KAAK,CAAS,IAAI;6EAAC;AAEhB,IAAA,OAAO,GAAG,QAAQ,CAAC,MACpC,EAAE;;;;;;;;;;AAUA,IAAA,YAAY,CAAC,IAAI,CAAC,IAAI,EAAE,CAAC,EACzB,6HAA6H;QAC3H,gHAAgH;AAChH,QAAA,8EAA8E,CACjF;gFACF;uGAnBU,QAAQ,EAAA,IAAA,EAAA,EAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,SAAA,EAAA,CAAA;2FAAR,QAAQ,EAAA,YAAA,EAAA,IAAA,EAAA,QAAA,EAAA,kCAAA,EAAA,MAAA,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,EAAA,IAAA,EAAA,EAAA,UAAA,EAAA,EAAA,OAAA,EAAA,WAAA,EAAA,EAAA,EAAA,QAAA,EAAA,EAAA,EAAA,CAAA;;2FAAR,QAAQ,EAAA,UAAA,EAAA,CAAA;kBAJpB,SAAS;AAAC,YAAA,IAAA,EAAA,CAAA;AACT,oBAAA,QAAQ,EAAE,kCAAkC;AAC5C,oBAAA,IAAI,EAAE,EAAE,SAAS,EAAE,WAAW,EAAE;AACjC,iBAAA;;;ACdD;;AAEG;;"}
+{"version":3,"file":"mesgflow-ui-kit-checkbox.mjs","sources":["../../../projects/ui-kit/checkbox/checkbox.ts","../../../projects/ui-kit/checkbox/mesgflow-ui-kit-checkbox.ts"],"sourcesContent":["import { Directive, computed, input } from '@angular/core';\r\nimport { cn, focusRecipe, type MfSize } from '@mesgflow/ui-kit/core';\r\n\r\nconst SIZE_CLASSES: Record<MfSize, string> = { sm: 'h-3.5 w-3.5', md: 'h-4 w-4', lg: 'h-5 w-5' };\r\n\r\n/**\r\n * `<input type=\"checkbox\" mfCheckbox [indeterminate]=\"some()\">` — native\r\n * `<input>` kalır (klavye/form/erişilebilirlik ağacı değişmez), görsel katman\r\n * `mf-check` utility'si (styles/tokens/controls.css): rol token'lı kutu,\r\n * yay eğrisiyle büyüyen işaret, `indeterminate` çizgisi, hover'da marka\r\n * kenarlığı, basınca hafif küçülme.\r\n */\r\n@Directive({\r\n  selector: 'input[type=checkbox][mfCheckbox]',\r\n  host: {\r\n    '[class]': 'classes()',\r\n    '[indeterminate]': 'indeterminate()',\r\n  },\r\n})\r\nexport class Checkbox {\r\n  readonly size = input<MfSize>('md');\r\n  /** \"Kısmen seçili\" (ör. tablo başlığındaki tümünü-seç) — native `indeterminate` özelliğine yazılır, `aria-checked=\"mixed\"` tarayıcı tarafından anons edilir. */\r\n  readonly indeterminate = input(false);\r\n\r\n  protected readonly classes = computed(() =>\r\n    cn('mf-check', SIZE_CLASSES[this.size()], focusRecipe),\r\n  );\r\n}\r\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":[],"mappings":";;;;AAGA,MAAM,YAAY,GAA2B,EAAE,EAAE,EAAE,aAAa,EAAE,EAAE,EAAE,SAAS,EAAE,EAAE,EAAE,SAAS,EAAE;AAEhG;;;;;;AAMG;MAQU,QAAQ,CAAA;IACV,IAAI,GAAG,KAAK,CAAS,IAAI;6EAAC;;IAE1B,aAAa,GAAG,KAAK,CAAC,KAAK;sFAAC;AAElB,IAAA,OAAO,GAAG,QAAQ,CAAC,MACpC,EAAE,CAAC,UAAU,EAAE,YAAY,CAAC,IAAI,CAAC,IAAI,EAAE,CAAC,EAAE,WAAW,CAAC;gFACvD;uGAPU,QAAQ,EAAA,IAAA,EAAA,EAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,SAAA,EAAA,CAAA;2FAAR,QAAQ,EAAA,YAAA,EAAA,IAAA,EAAA,QAAA,EAAA,kCAAA,EAAA,MAAA,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,aAAA,EAAA,EAAA,iBAAA,EAAA,eAAA,EAAA,UAAA,EAAA,eAAA,EAAA,QAAA,EAAA,IAAA,EAAA,UAAA,EAAA,KAAA,EAAA,iBAAA,EAAA,IAAA,EAAA,EAAA,EAAA,IAAA,EAAA,EAAA,UAAA,EAAA,EAAA,OAAA,EAAA,WAAA,EAAA,eAAA,EAAA,iBAAA,EAAA,EAAA,EAAA,QAAA,EAAA,EAAA,EAAA,CAAA;;2FAAR,QAAQ,EAAA,UAAA,EAAA,CAAA;kBAPpB,SAAS;AAAC,YAAA,IAAA,EAAA,CAAA;AACT,oBAAA,QAAQ,EAAE,kCAAkC;AAC5C,oBAAA,IAAI,EAAE;AACJ,wBAAA,SAAS,EAAE,WAAW;AACtB,wBAAA,iBAAiB,EAAE,iBAAiB;AACrC,qBAAA;AACF,iBAAA;;;AClBD;;AAEG;;"}

package/fesm2022/mesgflow-ui-kit-chip.mjs

@@ -81,7 +81,7 @@ class Chip {
     @if (removable()) {
       <button
         type="button"
-        class="text-fg-subtle hover:text-danger -me-1 shrink-0 appearance-none border-0 bg-transparent p-0.5 transition-colors duration-fast ease-emphasis disabled:pointer-events-none"
+        class="inline-flex items-center justify-center text-fg-subtle hover:text-danger -me-1 shrink-0 appearance-none border-0 bg-transparent p-0.5 transition-colors duration-fast ease-emphasis disabled:pointer-events-none"
         [attr.aria-label]="effectiveRemoveLabel()"
         [disabled]="disabled()"
         (click)="onRemoveClick($event)"
@@ -103,7 +103,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.6", ngImpor
     @if (removable()) {
       <button
         type="button"
-        class="text-fg-subtle hover:text-danger -me-1 shrink-0 appearance-none border-0 bg-transparent p-0.5 transition-colors duration-fast ease-emphasis disabled:pointer-events-none"
+        class="inline-flex items-center justify-center text-fg-subtle hover:text-danger -me-1 shrink-0 appearance-none border-0 bg-transparent p-0.5 transition-colors duration-fast ease-emphasis disabled:pointer-events-none"
         [attr.aria-label]="effectiveRemoveLabel()"
         [disabled]="disabled()"
         (click)="onRemoveClick($event)"

package/fesm2022/mesgflow-ui-kit-chip.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"mesgflow-ui-kit-chip.mjs","sources":["../../../projects/ui-kit/chip/chip.variants.ts","../../../projects/ui-kit/chip/chip.ts","../../../projects/ui-kit/chip/mesgflow-ui-kit-chip.ts"],"sourcesContent":["import { cva, type VariantProps } from 'class-variance-authority';\r\n\r\n/**\r\n * Badge (bkz. badge.variants.ts) ile AYNI tonal işaret rol token'ı\r\n * (`bg-X-tint text-X-tint-fg`) — chip Badge'in ETKİLEŞİMLİ (kaldırılabilir/\r\n * seçilebilir) hali, o yüzden aynı görsel aileyi paylaşıyor. `text-eyebrow`'un\r\n * mono/büyük-harf kimliği BİLEREK burada YOK — chip genelde \"Rol: Yönetici\"\r\n * gibi okunabilir, karma büyük/küçük harfli içerik taşıyor (Badge'in kısa\r\n * durum etiketlerinin aksine).\r\n */\r\nexport const chipVariants = cva(\r\n  'inline-flex items-center gap-1 rounded-full text-xs font-medium transition-colors duration-fast ease-emphasis',\r\n  {\r\n    variants: {\r\n      tone: {\r\n        neutral: 'bg-surface-alt text-fg-muted',\r\n        primary: 'bg-primary-tint text-primary-tint-fg',\r\n        success: 'bg-success-tint text-success-tint-fg',\r\n        warning: 'bg-warning-tint text-warning-tint-fg',\r\n        danger: 'bg-danger-tint text-danger-tint-fg',\r\n        info: 'bg-info-tint text-info-tint-fg',\r\n        help: 'bg-help-tint text-help-tint-fg',\r\n      },\r\n      size: {\r\n        sm: 'py-1 pe-1.5 ps-2.5',\r\n        md: 'py-1.5 pe-2 ps-3',\r\n      },\r\n      /** Seçili durumdaki bir chip (ör. filtrelenebilir bir etiket listesi) — tona bakmaksızın TEK bir vurgu mekanizması (`ring-current`), her tonun kendi seçili basamağını tanımlamasına gerek kalmadan. */\r\n      selected: {\r\n        true: 'ring-1 ring-inset ring-current',\r\n        false: '',\r\n      },\r\n      disabled: {\r\n        true: 'pointer-events-none opacity-50',\r\n        false: '',\r\n      },\r\n    },\r\n    defaultVariants: { tone: 'neutral', size: 'md', selected: false, disabled: false },\r\n  },\r\n);\r\n\r\nexport type ChipTone = VariantProps<typeof chipVariants>['tone'];\r\nexport type ChipSize = VariantProps<typeof chipVariants>['size'];\r\n","import { Component, computed, inject, input, output } from '@angular/core';\r\nimport { cn, MF_CHIP_LABELS } from '@mesgflow/ui-kit/core';\r\nimport { Icon } from '@mesgflow/ui-kit/icon';\r\nimport { chipVariants, type ChipSize, type ChipTone } from './chip.variants';\r\n\r\n/**\r\n * `<mf-chip removable (removed)=\"onRemove()\">Rol: Yönetici</mf-chip>` — asıl\r\n * içerik `<ng-content />` ile projekte edilir (ör. `TableFilterBar`'ın\r\n * kendi tıklanabilir düzenleme düğmesi, bkz. `table-filter-bar.html`); Chip\r\n * SADECE kabuğu (tonal dolgu + opsiyonel kaldırma düğmesi) sağlar, içeriğin\r\n * kendi tıklama davranışına karışmaz.\r\n */\r\n@Component({\r\n  selector: 'mf-chip',\r\n  exportAs: 'mfChip',\r\n  imports: [Icon],\r\n  host: { '[class]': 'classes()' },\r\n  template: `\r\n    <ng-content />\r\n    @if (removable()) {\r\n      <button\r\n        type=\"button\"\r\n        class=\"text-fg-subtle hover:text-danger -me-1 shrink-0 appearance-none border-0 bg-transparent p-0.5 transition-colors duration-fast ease-emphasis disabled:pointer-events-none\"\r\n        [attr.aria-label]=\"effectiveRemoveLabel()\"\r\n        [disabled]=\"disabled()\"\r\n        (click)=\"onRemoveClick($event)\"\r\n      >\r\n        <span mfIcon [size]=\"14\">close</span>\r\n      </button>\r\n    }\r\n  `,\r\n})\r\nexport class Chip {\r\n  readonly tone = input<ChipTone>('neutral');\r\n  readonly size = input<ChipSize>('md');\r\n  readonly selected = input(false);\r\n  readonly disabled = input(false);\r\n  readonly removable = input(false);\r\n  readonly removeLabel = input<string>();\r\n\r\n  readonly removed = output<void>();\r\n\r\n  private readonly chipLabels = inject(MF_CHIP_LABELS);\r\n  protected readonly effectiveRemoveLabel = computed(\r\n    () => this.removeLabel() ?? this.chipLabels().remove,\r\n  );\r\n\r\n  protected readonly classes = computed(() =>\r\n    cn(\r\n      chipVariants({\r\n        tone: this.tone(),\r\n        size: this.size(),\r\n        selected: this.selected(),\r\n        disabled: this.disabled(),\r\n      }),\r\n    ),\r\n  );\r\n\r\n  protected onRemoveClick(event: Event): void {\r\n    event.stopPropagation();\r\n    this.removed.emit();\r\n  }\r\n}\r\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":[],"mappings":"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"}
+{"version":3,"file":"mesgflow-ui-kit-chip.mjs","sources":["../../../projects/ui-kit/chip/chip.variants.ts","../../../projects/ui-kit/chip/chip.ts","../../../projects/ui-kit/chip/mesgflow-ui-kit-chip.ts"],"sourcesContent":["import { cva, type VariantProps } from 'class-variance-authority';\r\n\r\n/**\r\n * Badge (bkz. badge.variants.ts) ile AYNI tonal işaret rol token'ı\r\n * (`bg-X-tint text-X-tint-fg`) — chip Badge'in ETKİLEŞİMLİ (kaldırılabilir/\r\n * seçilebilir) hali, o yüzden aynı görsel aileyi paylaşıyor. `text-eyebrow`'un\r\n * mono/büyük-harf kimliği BİLEREK burada YOK — chip genelde \"Rol: Yönetici\"\r\n * gibi okunabilir, karma büyük/küçük harfli içerik taşıyor (Badge'in kısa\r\n * durum etiketlerinin aksine).\r\n */\r\nexport const chipVariants = cva(\r\n  'inline-flex items-center gap-1 rounded-full text-xs font-medium transition-colors duration-fast ease-emphasis',\r\n  {\r\n    variants: {\r\n      tone: {\r\n        neutral: 'bg-surface-alt text-fg-muted',\r\n        primary: 'bg-primary-tint text-primary-tint-fg',\r\n        success: 'bg-success-tint text-success-tint-fg',\r\n        warning: 'bg-warning-tint text-warning-tint-fg',\r\n        danger: 'bg-danger-tint text-danger-tint-fg',\r\n        info: 'bg-info-tint text-info-tint-fg',\r\n        help: 'bg-help-tint text-help-tint-fg',\r\n      },\r\n      size: {\r\n        sm: 'py-1 pe-1.5 ps-2.5',\r\n        md: 'py-1.5 pe-2 ps-3',\r\n      },\r\n      /** Seçili durumdaki bir chip (ör. filtrelenebilir bir etiket listesi) — tona bakmaksızın TEK bir vurgu mekanizması (`ring-current`), her tonun kendi seçili basamağını tanımlamasına gerek kalmadan. */\r\n      selected: {\r\n        true: 'ring-1 ring-inset ring-current',\r\n        false: '',\r\n      },\r\n      disabled: {\r\n        true: 'pointer-events-none opacity-50',\r\n        false: '',\r\n      },\r\n    },\r\n    defaultVariants: { tone: 'neutral', size: 'md', selected: false, disabled: false },\r\n  },\r\n);\r\n\r\nexport type ChipTone = VariantProps<typeof chipVariants>['tone'];\r\nexport type ChipSize = VariantProps<typeof chipVariants>['size'];\r\n","import { Component, computed, inject, input, output } from '@angular/core';\r\nimport { cn, MF_CHIP_LABELS } from '@mesgflow/ui-kit/core';\r\nimport { Icon } from '@mesgflow/ui-kit/icon';\r\nimport { chipVariants, type ChipSize, type ChipTone } from './chip.variants';\r\n\r\n/**\r\n * `<mf-chip removable (removed)=\"onRemove()\">Rol: Yönetici</mf-chip>` — asıl\r\n * içerik `<ng-content />` ile projekte edilir (ör. `TableFilterBar`'ın\r\n * kendi tıklanabilir düzenleme düğmesi, bkz. `table-filter-bar.html`); Chip\r\n * SADECE kabuğu (tonal dolgu + opsiyonel kaldırma düğmesi) sağlar, içeriğin\r\n * kendi tıklama davranışına karışmaz.\r\n */\r\n@Component({\r\n  selector: 'mf-chip',\r\n  exportAs: 'mfChip',\r\n  imports: [Icon],\r\n  host: { '[class]': 'classes()' },\r\n  template: `\r\n    <ng-content />\r\n    @if (removable()) {\r\n      <button\r\n        type=\"button\"\r\n        class=\"inline-flex items-center justify-center text-fg-subtle hover:text-danger -me-1 shrink-0 appearance-none border-0 bg-transparent p-0.5 transition-colors duration-fast ease-emphasis disabled:pointer-events-none\"\r\n        [attr.aria-label]=\"effectiveRemoveLabel()\"\r\n        [disabled]=\"disabled()\"\r\n        (click)=\"onRemoveClick($event)\"\r\n      >\r\n        <span mfIcon [size]=\"14\">close</span>\r\n      </button>\r\n    }\r\n  `,\r\n})\r\nexport class Chip {\r\n  readonly tone = input<ChipTone>('neutral');\r\n  readonly size = input<ChipSize>('md');\r\n  readonly selected = input(false);\r\n  readonly disabled = input(false);\r\n  readonly removable = input(false);\r\n  readonly removeLabel = input<string>();\r\n\r\n  readonly removed = output<void>();\r\n\r\n  private readonly chipLabels = inject(MF_CHIP_LABELS);\r\n  protected readonly effectiveRemoveLabel = computed(\r\n    () => this.removeLabel() ?? this.chipLabels().remove,\r\n  );\r\n\r\n  protected readonly classes = computed(() =>\r\n    cn(\r\n      chipVariants({\r\n        tone: this.tone(),\r\n        size: this.size(),\r\n        selected: this.selected(),\r\n        disabled: this.disabled(),\r\n      }),\r\n    ),\r\n  );\r\n\r\n  protected onRemoveClick(event: Event): void {\r\n    event.stopPropagation();\r\n    this.removed.emit();\r\n  }\r\n}\r\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":[],"mappings":"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"}

package/fesm2022/mesgflow-ui-kit-code-block.mjs

@@ -1,6 +1,6 @@
 import * as i0 from '@angular/core';
-import { InjectionToken, input, booleanAttribute, inject, computed, Component } from '@angular/core';
-import { MF_COPY_LABELS, cn } from '@mesgflow/ui-kit/core';
+import { InjectionToken, input, booleanAttribute, computed, inject, Component } from '@angular/core';
+import { cn, MF_COPY_LABELS } from '@mesgflow/ui-kit/core';
 import { CopyButton } from '@mesgflow/ui-kit/copy-button';
 import { Icon } from '@mesgflow/ui-kit/icon';
 
@@ -40,6 +40,10 @@ class CodeBlock {
     /** Kaydırma alanının azami yüksekliği (CSS uzunluğu, ör. `'20rem'`); verilmezse sınırsız. */
     maxHeight = input(/* @ts-ignore */
     ...(ngDevMode ? [undefined, { debugName: "maxHeight" }] : /* istanbul ignore next */ []));
+    /** `false` — kenarlık/köşe yarıçapı olmadan, bir kartın/panelin İÇİNE gömülü (sekmeli demo panelleri). */
+    bordered = input(true, { ...(ngDevMode ? { debugName: "bordered" } : /* istanbul ignore next */ {}), transform: booleanAttribute });
+    figureClasses = computed(() => cn('m-0 overflow-hidden bg-surface-sunken', this.bordered() ? 'rounded-lg border border-border' : 'rounded-none border-0'), /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "figureClasses" }] : /* istanbul ignore next */ []));
     highlighter = inject(MF_CODE_HIGHLIGHTER);
     labels = inject(MF_COPY_LABELS);
     hasHeader = computed(() => !!(this.filename() || this.language()), /* @ts-ignore */
@@ -56,12 +60,12 @@ class CodeBlock {
     preClasses = computed(() => cn('m-0 flex-1 py-4 pe-4 font-mono text-sm leading-relaxed text-fg-muted', this.lineNumbers() ? 'ps-2' : 'ps-4', this.wraps() ? 'whitespace-pre-wrap break-words' : 'whitespace-pre', !this.hasHeader() && this.copyable() && 'pe-12'), /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "preClasses" }] : /* istanbul ignore next */ []));
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.6", ngImport: i0, type: CodeBlock, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.1.6", type: CodeBlock, isStandalone: true, selector: "mf-code-block", inputs: { code: { classPropertyName: "code", publicName: "code", isSignal: true, isRequired: true, transformFunction: null }, language: { classPropertyName: "language", publicName: "language", isSignal: true, isRequired: false, transformFunction: null }, filename: { classPropertyName: "filename", publicName: "filename", isSignal: true, isRequired: false, transformFunction: null }, lineNumbers: { classPropertyName: "lineNumbers", publicName: "lineNumbers", isSignal: true, isRequired: false, transformFunction: null }, wrap: { classPropertyName: "wrap", publicName: "wrap", isSignal: true, isRequired: false, transformFunction: null }, copyable: { classPropertyName: "copyable", publicName: "copyable", isSignal: true, isRequired: false, transformFunction: null }, maxHeight: { classPropertyName: "maxHeight", publicName: "maxHeight", isSignal: true, isRequired: false, transformFunction: null } }, host: { classAttribute: "block" }, exportAs: ["mfCodeBlock"], ngImport: i0, template: "<figure class=\"m-0 overflow-hidden rounded-lg border border-border bg-surface-sunken\">\r\n  @if (hasHeader()) {\r\n    <figcaption\r\n      class=\"flex min-h-10 items-center gap-2 border-b border-border ps-4 pe-1.5 text-xs text-fg-muted\"\r\n    >\r\n      @if (filename()) {\r\n        <span mfIcon [size]=\"14\" class=\"shrink-0 text-fg-subtle\">description</span>\r\n        <span class=\"min-w-0 truncate font-mono\">{{ filename() }}</span>\r\n      }\r\n      <span class=\"ms-auto flex shrink-0 items-center gap-1\">\r\n        @if (language()) {\r\n          <span\r\n            class=\"rounded-xs bg-surface-alt px-1.5 py-0.5 font-mono text-eyebrow text-fg-subtle uppercase\"\r\n            >{{ language() }}</span\r\n          >\r\n        }\r\n        @if (copyable()) {\r\n          <mf-copy-button [value]=\"code()\" />\r\n        }\r\n      </span>\r\n    </figcaption>\r\n  }\r\n\r\n  <div class=\"relative\">\r\n    @if (!hasHeader() && copyable()) {\r\n      <mf-copy-button class=\"absolute end-2 top-2 z-[2]\" [value]=\"code()\" />\r\n    }\r\n    <div\r\n      tabindex=\"0\"\r\n      role=\"group\"\r\n      [attr.aria-label]=\"regionLabel()\"\r\n      class=\"overflow-auto outline-none focus-visible:outline-2 focus-visible:-outline-offset-2 focus-visible:outline-focus-ring\"\r\n      [style.max-height]=\"maxHeight() ?? null\"\r\n    >\r\n      <div class=\"flex\" [class.min-w-max]=\"!wraps()\">\r\n        @if (lineNumbers()) {\r\n          <div\r\n            aria-hidden=\"true\"\r\n            class=\"sticky start-0 z-[1] shrink-0 bg-surface-sunken py-4 ps-4 pe-2 text-end font-mono text-sm leading-relaxed text-fg-subtle tabular-nums select-none\"\r\n          >\r\n            @for (line of lines(); track line) {\r\n              <div>{{ line }}</div>\r\n            }\r\n          </div>\r\n        }\r\n        <!-- \u0130\u00E7erik tek sat\u0131rda: <pre> i\u00E7indeki \u015Fablon bo\u015Fluklar\u0131 koda s\u0131zmas\u0131n. -->\r\n        @if (highlighted(); as html) {\r\n          <pre [class]=\"preClasses()\"><code [innerHTML]=\"html\"></code></pre>\r\n        } @else {\r\n          <pre [class]=\"preClasses()\"><code>{{ code() }}</code></pre>\r\n        }\r\n      </div>\r\n    </div>\r\n  </div>\r\n</figure>\r\n", dependencies: [{ kind: "component", type: CopyButton, selector: "mf-copy-button", inputs: ["value", "label"], exportAs: ["mfCopyButton"] }, { kind: "directive", type: Icon, selector: "span[mfIcon]", inputs: ["size", "filled"] }] });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.1.6", type: CodeBlock, isStandalone: true, selector: "mf-code-block", inputs: { code: { classPropertyName: "code", publicName: "code", isSignal: true, isRequired: true, transformFunction: null }, language: { classPropertyName: "language", publicName: "language", isSignal: true, isRequired: false, transformFunction: null }, filename: { classPropertyName: "filename", publicName: "filename", isSignal: true, isRequired: false, transformFunction: null }, lineNumbers: { classPropertyName: "lineNumbers", publicName: "lineNumbers", isSignal: true, isRequired: false, transformFunction: null }, wrap: { classPropertyName: "wrap", publicName: "wrap", isSignal: true, isRequired: false, transformFunction: null }, copyable: { classPropertyName: "copyable", publicName: "copyable", isSignal: true, isRequired: false, transformFunction: null }, maxHeight: { classPropertyName: "maxHeight", publicName: "maxHeight", isSignal: true, isRequired: false, transformFunction: null }, bordered: { classPropertyName: "bordered", publicName: "bordered", isSignal: true, isRequired: false, transformFunction: null } }, host: { classAttribute: "block" }, exportAs: ["mfCodeBlock"], ngImport: i0, template: "<figure [class]=\"figureClasses()\">\r\n  @if (hasHeader()) {\r\n    <figcaption\r\n      class=\"flex min-h-10 items-center gap-2 border-b border-border ps-4 pe-1.5 text-xs text-fg-muted\"\r\n    >\r\n      @if (filename()) {\r\n        <span mfIcon [size]=\"14\" class=\"shrink-0 text-fg-subtle\">description</span>\r\n        <span class=\"min-w-0 truncate font-mono\">{{ filename() }}</span>\r\n      }\r\n      <span class=\"ms-auto flex shrink-0 items-center gap-1\">\r\n        @if (language()) {\r\n          <span\r\n            class=\"rounded-xs bg-surface-alt px-1.5 py-0.5 font-mono text-eyebrow text-fg-subtle uppercase\"\r\n            >{{ language() }}</span\r\n          >\r\n        }\r\n        @if (copyable()) {\r\n          <mf-copy-button [value]=\"code()\" />\r\n        }\r\n      </span>\r\n    </figcaption>\r\n  }\r\n\r\n  <div class=\"relative\">\r\n    @if (!hasHeader() && copyable()) {\r\n      <mf-copy-button class=\"absolute end-2 top-2 z-[2]\" [value]=\"code()\" />\r\n    }\r\n    <div\r\n      tabindex=\"0\"\r\n      role=\"group\"\r\n      [attr.aria-label]=\"regionLabel()\"\r\n      class=\"overflow-auto outline-none focus-visible:outline-2 focus-visible:-outline-offset-2 focus-visible:outline-focus-ring\"\r\n      [style.max-height]=\"maxHeight() ?? null\"\r\n    >\r\n      <div class=\"flex\" [class.min-w-max]=\"!wraps()\">\r\n        @if (lineNumbers()) {\r\n          <div\r\n            aria-hidden=\"true\"\r\n            class=\"sticky start-0 z-[1] shrink-0 bg-surface-sunken py-4 ps-4 pe-2 text-end font-mono text-sm leading-relaxed text-fg-subtle tabular-nums select-none\"\r\n          >\r\n            @for (line of lines(); track line) {\r\n              <div>{{ line }}</div>\r\n            }\r\n          </div>\r\n        }\r\n        <!-- \u0130\u00E7erik tek sat\u0131rda: <pre> i\u00E7indeki \u015Fablon bo\u015Fluklar\u0131 koda s\u0131zmas\u0131n. -->\r\n        @if (highlighted(); as html) {\r\n          <pre [class]=\"preClasses()\"><code [innerHTML]=\"html\"></code></pre>\r\n        } @else {\r\n          <pre [class]=\"preClasses()\"><code>{{ code() }}</code></pre>\r\n        }\r\n      </div>\r\n    </div>\r\n  </div>\r\n</figure>\r\n", dependencies: [{ kind: "component", type: CopyButton, selector: "mf-copy-button", inputs: ["value", "label"], exportAs: ["mfCopyButton"] }, { kind: "directive", type: Icon, selector: "span[mfIcon]", inputs: ["size", "filled"] }] });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.6", ngImport: i0, type: CodeBlock, decorators: [{
             type: Component,
-            args: [{ selector: 'mf-code-block', exportAs: 'mfCodeBlock', imports: [CopyButton, Icon], host: { class: 'block' }, template: "<figure class=\"m-0 overflow-hidden rounded-lg border border-border bg-surface-sunken\">\r\n  @if (hasHeader()) {\r\n    <figcaption\r\n      class=\"flex min-h-10 items-center gap-2 border-b border-border ps-4 pe-1.5 text-xs text-fg-muted\"\r\n    >\r\n      @if (filename()) {\r\n        <span mfIcon [size]=\"14\" class=\"shrink-0 text-fg-subtle\">description</span>\r\n        <span class=\"min-w-0 truncate font-mono\">{{ filename() }}</span>\r\n      }\r\n      <span class=\"ms-auto flex shrink-0 items-center gap-1\">\r\n        @if (language()) {\r\n          <span\r\n            class=\"rounded-xs bg-surface-alt px-1.5 py-0.5 font-mono text-eyebrow text-fg-subtle uppercase\"\r\n            >{{ language() }}</span\r\n          >\r\n        }\r\n        @if (copyable()) {\r\n          <mf-copy-button [value]=\"code()\" />\r\n        }\r\n      </span>\r\n    </figcaption>\r\n  }\r\n\r\n  <div class=\"relative\">\r\n    @if (!hasHeader() && copyable()) {\r\n      <mf-copy-button class=\"absolute end-2 top-2 z-[2]\" [value]=\"code()\" />\r\n    }\r\n    <div\r\n      tabindex=\"0\"\r\n      role=\"group\"\r\n      [attr.aria-label]=\"regionLabel()\"\r\n      class=\"overflow-auto outline-none focus-visible:outline-2 focus-visible:-outline-offset-2 focus-visible:outline-focus-ring\"\r\n      [style.max-height]=\"maxHeight() ?? null\"\r\n    >\r\n      <div class=\"flex\" [class.min-w-max]=\"!wraps()\">\r\n        @if (lineNumbers()) {\r\n          <div\r\n            aria-hidden=\"true\"\r\n            class=\"sticky start-0 z-[1] shrink-0 bg-surface-sunken py-4 ps-4 pe-2 text-end font-mono text-sm leading-relaxed text-fg-subtle tabular-nums select-none\"\r\n          >\r\n            @for (line of lines(); track line) {\r\n              <div>{{ line }}</div>\r\n            }\r\n          </div>\r\n        }\r\n        <!-- \u0130\u00E7erik tek sat\u0131rda: <pre> i\u00E7indeki \u015Fablon bo\u015Fluklar\u0131 koda s\u0131zmas\u0131n. -->\r\n        @if (highlighted(); as html) {\r\n          <pre [class]=\"preClasses()\"><code [innerHTML]=\"html\"></code></pre>\r\n        } @else {\r\n          <pre [class]=\"preClasses()\"><code>{{ code() }}</code></pre>\r\n        }\r\n      </div>\r\n    </div>\r\n  </div>\r\n</figure>\r\n" }]
-        }], propDecorators: { code: [{ type: i0.Input, args: [{ isSignal: true, alias: "code", required: true }] }], language: [{ type: i0.Input, args: [{ isSignal: true, alias: "language", required: false }] }], filename: [{ type: i0.Input, args: [{ isSignal: true, alias: "filename", required: false }] }], lineNumbers: [{ type: i0.Input, args: [{ isSignal: true, alias: "lineNumbers", required: false }] }], wrap: [{ type: i0.Input, args: [{ isSignal: true, alias: "wrap", required: false }] }], copyable: [{ type: i0.Input, args: [{ isSignal: true, alias: "copyable", required: false }] }], maxHeight: [{ type: i0.Input, args: [{ isSignal: true, alias: "maxHeight", required: false }] }] } });
+            args: [{ selector: 'mf-code-block', exportAs: 'mfCodeBlock', imports: [CopyButton, Icon], host: { class: 'block' }, template: "<figure [class]=\"figureClasses()\">\r\n  @if (hasHeader()) {\r\n    <figcaption\r\n      class=\"flex min-h-10 items-center gap-2 border-b border-border ps-4 pe-1.5 text-xs text-fg-muted\"\r\n    >\r\n      @if (filename()) {\r\n        <span mfIcon [size]=\"14\" class=\"shrink-0 text-fg-subtle\">description</span>\r\n        <span class=\"min-w-0 truncate font-mono\">{{ filename() }}</span>\r\n      }\r\n      <span class=\"ms-auto flex shrink-0 items-center gap-1\">\r\n        @if (language()) {\r\n          <span\r\n            class=\"rounded-xs bg-surface-alt px-1.5 py-0.5 font-mono text-eyebrow text-fg-subtle uppercase\"\r\n            >{{ language() }}</span\r\n          >\r\n        }\r\n        @if (copyable()) {\r\n          <mf-copy-button [value]=\"code()\" />\r\n        }\r\n      </span>\r\n    </figcaption>\r\n  }\r\n\r\n  <div class=\"relative\">\r\n    @if (!hasHeader() && copyable()) {\r\n      <mf-copy-button class=\"absolute end-2 top-2 z-[2]\" [value]=\"code()\" />\r\n    }\r\n    <div\r\n      tabindex=\"0\"\r\n      role=\"group\"\r\n      [attr.aria-label]=\"regionLabel()\"\r\n      class=\"overflow-auto outline-none focus-visible:outline-2 focus-visible:-outline-offset-2 focus-visible:outline-focus-ring\"\r\n      [style.max-height]=\"maxHeight() ?? null\"\r\n    >\r\n      <div class=\"flex\" [class.min-w-max]=\"!wraps()\">\r\n        @if (lineNumbers()) {\r\n          <div\r\n            aria-hidden=\"true\"\r\n            class=\"sticky start-0 z-[1] shrink-0 bg-surface-sunken py-4 ps-4 pe-2 text-end font-mono text-sm leading-relaxed text-fg-subtle tabular-nums select-none\"\r\n          >\r\n            @for (line of lines(); track line) {\r\n              <div>{{ line }}</div>\r\n            }\r\n          </div>\r\n        }\r\n        <!-- \u0130\u00E7erik tek sat\u0131rda: <pre> i\u00E7indeki \u015Fablon bo\u015Fluklar\u0131 koda s\u0131zmas\u0131n. -->\r\n        @if (highlighted(); as html) {\r\n          <pre [class]=\"preClasses()\"><code [innerHTML]=\"html\"></code></pre>\r\n        } @else {\r\n          <pre [class]=\"preClasses()\"><code>{{ code() }}</code></pre>\r\n        }\r\n      </div>\r\n    </div>\r\n  </div>\r\n</figure>\r\n" }]
+        }], propDecorators: { code: [{ type: i0.Input, args: [{ isSignal: true, alias: "code", required: true }] }], language: [{ type: i0.Input, args: [{ isSignal: true, alias: "language", required: false }] }], filename: [{ type: i0.Input, args: [{ isSignal: true, alias: "filename", required: false }] }], lineNumbers: [{ type: i0.Input, args: [{ isSignal: true, alias: "lineNumbers", required: false }] }], wrap: [{ type: i0.Input, args: [{ isSignal: true, alias: "wrap", required: false }] }], copyable: [{ type: i0.Input, args: [{ isSignal: true, alias: "copyable", required: false }] }], maxHeight: [{ type: i0.Input, args: [{ isSignal: true, alias: "maxHeight", required: false }] }], bordered: [{ type: i0.Input, args: [{ isSignal: true, alias: "bordered", required: false }] }] } });
 
 /**
  * Generated bundle index. Do not edit.

package/fesm2022/mesgflow-ui-kit-code-block.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"mesgflow-ui-kit-code-block.mjs","sources":["../../../projects/ui-kit/code-block/code-highlighter.ts","../../../projects/ui-kit/code-block/code-block.ts","../../../projects/ui-kit/code-block/code-block.html","../../../projects/ui-kit/code-block/mesgflow-ui-kit-code-block.ts"],"sourcesContent":["import { InjectionToken, type Provider } from '@angular/core';\r\n\r\n/**\r\n * Kod → vurgulanmış HTML. Dönüş `[innerHTML]` ile basılır: düz `string` Angular'ın sanitizer'ından\r\n * geçer (sınıflar kalır, satır içi `style` atılır — highlight.js/Prism gibi SINIF tabanlı\r\n * vurgulayıcılar olduğu gibi çalışır). Satır içi renk kullanan bir çıktıya (ör. varsayılan shiki)\r\n * güveniyorsanız `DomSanitizer.bypassSecurityTrustHtml` çıktısını döndürün — sorumluluk sizde.\r\n * (Tip `object`: kit `@angular/platform-browser`'a peer bağımlılık eklemesin diye `SafeHtml` yerine.)\r\n */\r\nexport type MfCodeHighlighter = (code: string, language: string | undefined) => string | object;\r\n\r\n/** Varsayılan `null` — kit vurgulama kütüphanesi GÖMMEZ (bağımlılık politikası); düz metin. */\r\nexport const MF_CODE_HIGHLIGHTER = new InjectionToken<MfCodeHighlighter | null>(\r\n  'mesgflow.code-highlighter',\r\n  { factory: () => null },\r\n);\r\n\r\n/** `providers: [provideCodeHighlighter((code, lang) => hljs.highlight(code, { language: lang ?? 'plaintext' }).value)]` */\r\nexport function provideCodeHighlighter(highlighter: MfCodeHighlighter): Provider {\r\n  return { provide: MF_CODE_HIGHLIGHTER, useValue: highlighter };\r\n}\r\n","import { Component, booleanAttribute, computed, inject, input } from '@angular/core';\r\nimport { MF_COPY_LABELS, cn } from '@mesgflow/ui-kit/core';\r\nimport { CopyButton } from '@mesgflow/ui-kit/copy-button';\r\nimport { Icon } from '@mesgflow/ui-kit/icon';\r\nimport { MF_CODE_HIGHLIGHTER } from './code-highlighter';\r\n\r\n/**\r\n * `<mf-code-block [code]=\"snippet\" filename=\"app.config.ts\" language=\"ts\" lineNumbers />`\r\n *\r\n * Başlık şeridi (dosya adı · dil rozeti · kopyala) yalnızca `filename`/`language` verilince\r\n * çizilir; yoksa kopyala düğmesi sağ üst köşede yüzer. Kaydırma alanı odaklanabilir ve adlı bir\r\n * `role=\"group\"` (klavyeyle kaydırılabilsin — axe `scrollable-region-focusable`). `region`\r\n * DEĞİL: region bir landmark; bir sayfadaki onlarca \"Kod\" bölgesi landmark listesini kirletip\r\n * axe `landmark-unique` ihlali veriyordu (showcase rota taramasında yakalandı).\r\n *\r\n * Satır numaraları kaydırma alanının İÇİNDE, yatayda yapışkan (`sticky start-0`) bir oluk —\r\n * dikey kaydırmada satırlarla hizalı kalır, yatayda yerinde durur; seçimle kopyalanmaz.\r\n * `wrap` satır kaydırır ama numaralarla birlikte kullanılamaz (kaydırılan satır numara\r\n * hizasını bozar) — ikisi birden verilirse `lineNumbers` kazanır.\r\n *\r\n * Vurgulama isteğe bağlı: `provideCodeHighlighter()` (bkz. `code-highlighter.ts`).\r\n */\r\n@Component({\r\n  selector: 'mf-code-block',\r\n  exportAs: 'mfCodeBlock',\r\n  imports: [CopyButton, Icon],\r\n  host: { class: 'block' },\r\n  templateUrl: './code-block.html',\r\n})\r\nexport class CodeBlock {\r\n  readonly code = input.required<string>();\r\n  readonly language = input<string>();\r\n  readonly filename = input<string>();\r\n  readonly lineNumbers = input(false, { transform: booleanAttribute });\r\n  readonly wrap = input(false, { transform: booleanAttribute });\r\n  readonly copyable = input(true, { transform: booleanAttribute });\r\n  /** Kaydırma alanının azami yüksekliği (CSS uzunluğu, ör. `'20rem'`); verilmezse sınırsız. */\r\n  readonly maxHeight = input<string>();\r\n\r\n  private readonly highlighter = inject(MF_CODE_HIGHLIGHTER);\r\n  private readonly labels = inject(MF_COPY_LABELS);\r\n\r\n  protected readonly hasHeader = computed(() => !!(this.filename() || this.language()));\r\n  protected readonly regionLabel = computed(() => this.filename() || this.labels().code);\r\n  protected readonly highlighted = computed(() =>\r\n    this.highlighter ? this.highlighter(this.code(), this.language()) : null,\r\n  );\r\n  /** Sondaki satır sonu boş bir satır numarası üretmesin. */\r\n  protected readonly lines = computed(() =>\r\n    Array.from({ length: this.code().replace(/\\n$/, '').split('\\n').length }, (_, i) => i + 1),\r\n  );\r\n  protected readonly wraps = computed(() => this.wrap() && !this.lineNumbers());\r\n\r\n  protected readonly preClasses = computed(() =>\r\n    cn(\r\n      'm-0 flex-1 py-4 pe-4 font-mono text-sm leading-relaxed text-fg-muted',\r\n      this.lineNumbers() ? 'ps-2' : 'ps-4',\r\n      this.wraps() ? 'whitespace-pre-wrap break-words' : 'whitespace-pre',\r\n      !this.hasHeader() && this.copyable() && 'pe-12',\r\n    ),\r\n  );\r\n}\r\n","<figure class=\"m-0 overflow-hidden rounded-lg border border-border bg-surface-sunken\">\r\n  @if (hasHeader()) {\r\n    <figcaption\r\n      class=\"flex min-h-10 items-center gap-2 border-b border-border ps-4 pe-1.5 text-xs text-fg-muted\"\r\n    >\r\n      @if (filename()) {\r\n        <span mfIcon [size]=\"14\" class=\"shrink-0 text-fg-subtle\">description</span>\r\n        <span class=\"min-w-0 truncate font-mono\">{{ filename() }}</span>\r\n      }\r\n      <span class=\"ms-auto flex shrink-0 items-center gap-1\">\r\n        @if (language()) {\r\n          <span\r\n            class=\"rounded-xs bg-surface-alt px-1.5 py-0.5 font-mono text-eyebrow text-fg-subtle uppercase\"\r\n            >{{ language() }}</span\r\n          >\r\n        }\r\n        @if (copyable()) {\r\n          <mf-copy-button [value]=\"code()\" />\r\n        }\r\n      </span>\r\n    </figcaption>\r\n  }\r\n\r\n  <div class=\"relative\">\r\n    @if (!hasHeader() && copyable()) {\r\n      <mf-copy-button class=\"absolute end-2 top-2 z-[2]\" [value]=\"code()\" />\r\n    }\r\n    <div\r\n      tabindex=\"0\"\r\n      role=\"group\"\r\n      [attr.aria-label]=\"regionLabel()\"\r\n      class=\"overflow-auto outline-none focus-visible:outline-2 focus-visible:-outline-offset-2 focus-visible:outline-focus-ring\"\r\n      [style.max-height]=\"maxHeight() ?? null\"\r\n    >\r\n      <div class=\"flex\" [class.min-w-max]=\"!wraps()\">\r\n        @if (lineNumbers()) {\r\n          <div\r\n            aria-hidden=\"true\"\r\n            class=\"sticky start-0 z-[1] shrink-0 bg-surface-sunken py-4 ps-4 pe-2 text-end font-mono text-sm leading-relaxed text-fg-subtle tabular-nums select-none\"\r\n          >\r\n            @for (line of lines(); track line) {\r\n              <div>{{ line }}</div>\r\n            }\r\n          </div>\r\n        }\r\n        <!-- İçerik tek satırda: <pre> içindeki şablon boşlukları koda sızmasın. -->\r\n        @if (highlighted(); as html) {\r\n          <pre [class]=\"preClasses()\"><code [innerHTML]=\"html\"></code></pre>\r\n        } @else {\r\n          <pre [class]=\"preClasses()\"><code>{{ code() }}</code></pre>\r\n        }\r\n      </div>\r\n    </div>\r\n  </div>\r\n</figure>\r\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":[],"mappings":"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"}
+{"version":3,"file":"mesgflow-ui-kit-code-block.mjs","sources":["../../../projects/ui-kit/code-block/code-highlighter.ts","../../../projects/ui-kit/code-block/code-block.ts","../../../projects/ui-kit/code-block/code-block.html","../../../projects/ui-kit/code-block/mesgflow-ui-kit-code-block.ts"],"sourcesContent":["import { InjectionToken, type Provider } from '@angular/core';\r\n\r\n/**\r\n * Kod → vurgulanmış HTML. Dönüş `[innerHTML]` ile basılır: düz `string` Angular'ın sanitizer'ından\r\n * geçer (sınıflar kalır, satır içi `style` atılır — highlight.js/Prism gibi SINIF tabanlı\r\n * vurgulayıcılar olduğu gibi çalışır). Satır içi renk kullanan bir çıktıya (ör. varsayılan shiki)\r\n * güveniyorsanız `DomSanitizer.bypassSecurityTrustHtml` çıktısını döndürün — sorumluluk sizde.\r\n * (Tip `object`: kit `@angular/platform-browser`'a peer bağımlılık eklemesin diye `SafeHtml` yerine.)\r\n */\r\nexport type MfCodeHighlighter = (code: string, language: string | undefined) => string | object;\r\n\r\n/** Varsayılan `null` — kit vurgulama kütüphanesi GÖMMEZ (bağımlılık politikası); düz metin. */\r\nexport const MF_CODE_HIGHLIGHTER = new InjectionToken<MfCodeHighlighter | null>(\r\n  'mesgflow.code-highlighter',\r\n  { factory: () => null },\r\n);\r\n\r\n/** `providers: [provideCodeHighlighter((code, lang) => hljs.highlight(code, { language: lang ?? 'plaintext' }).value)]` */\r\nexport function provideCodeHighlighter(highlighter: MfCodeHighlighter): Provider {\r\n  return { provide: MF_CODE_HIGHLIGHTER, useValue: highlighter };\r\n}\r\n","import { Component, booleanAttribute, computed, inject, input } from '@angular/core';\r\nimport { MF_COPY_LABELS, cn } from '@mesgflow/ui-kit/core';\r\nimport { CopyButton } from '@mesgflow/ui-kit/copy-button';\r\nimport { Icon } from '@mesgflow/ui-kit/icon';\r\nimport { MF_CODE_HIGHLIGHTER } from './code-highlighter';\r\n\r\n/**\r\n * `<mf-code-block [code]=\"snippet\" filename=\"app.config.ts\" language=\"ts\" lineNumbers />`\r\n *\r\n * Başlık şeridi (dosya adı · dil rozeti · kopyala) yalnızca `filename`/`language` verilince\r\n * çizilir; yoksa kopyala düğmesi sağ üst köşede yüzer. Kaydırma alanı odaklanabilir ve adlı bir\r\n * `role=\"group\"` (klavyeyle kaydırılabilsin — axe `scrollable-region-focusable`). `region`\r\n * DEĞİL: region bir landmark; bir sayfadaki onlarca \"Kod\" bölgesi landmark listesini kirletip\r\n * axe `landmark-unique` ihlali veriyordu (showcase rota taramasında yakalandı).\r\n *\r\n * Satır numaraları kaydırma alanının İÇİNDE, yatayda yapışkan (`sticky start-0`) bir oluk —\r\n * dikey kaydırmada satırlarla hizalı kalır, yatayda yerinde durur; seçimle kopyalanmaz.\r\n * `wrap` satır kaydırır ama numaralarla birlikte kullanılamaz (kaydırılan satır numara\r\n * hizasını bozar) — ikisi birden verilirse `lineNumbers` kazanır.\r\n *\r\n * Vurgulama isteğe bağlı: `provideCodeHighlighter()` (bkz. `code-highlighter.ts`).\r\n */\r\n@Component({\r\n  selector: 'mf-code-block',\r\n  exportAs: 'mfCodeBlock',\r\n  imports: [CopyButton, Icon],\r\n  host: { class: 'block' },\r\n  templateUrl: './code-block.html',\r\n})\r\nexport class CodeBlock {\r\n  readonly code = input.required<string>();\r\n  readonly language = input<string>();\r\n  readonly filename = input<string>();\r\n  readonly lineNumbers = input(false, { transform: booleanAttribute });\r\n  readonly wrap = input(false, { transform: booleanAttribute });\r\n  readonly copyable = input(true, { transform: booleanAttribute });\r\n  /** Kaydırma alanının azami yüksekliği (CSS uzunluğu, ör. `'20rem'`); verilmezse sınırsız. */\r\n  readonly maxHeight = input<string>();\r\n  /** `false` — kenarlık/köşe yarıçapı olmadan, bir kartın/panelin İÇİNE gömülü (sekmeli demo panelleri). */\r\n  readonly bordered = input(true, { transform: booleanAttribute });\r\n\r\n  protected readonly figureClasses = computed(() =>\r\n    cn(\r\n      'm-0 overflow-hidden bg-surface-sunken',\r\n      this.bordered() ? 'rounded-lg border border-border' : 'rounded-none border-0',\r\n    ),\r\n  );\r\n\r\n  private readonly highlighter = inject(MF_CODE_HIGHLIGHTER);\r\n  private readonly labels = inject(MF_COPY_LABELS);\r\n\r\n  protected readonly hasHeader = computed(() => !!(this.filename() || this.language()));\r\n  protected readonly regionLabel = computed(() => this.filename() || this.labels().code);\r\n  protected readonly highlighted = computed(() =>\r\n    this.highlighter ? this.highlighter(this.code(), this.language()) : null,\r\n  );\r\n  /** Sondaki satır sonu boş bir satır numarası üretmesin. */\r\n  protected readonly lines = computed(() =>\r\n    Array.from({ length: this.code().replace(/\\n$/, '').split('\\n').length }, (_, i) => i + 1),\r\n  );\r\n  protected readonly wraps = computed(() => this.wrap() && !this.lineNumbers());\r\n\r\n  protected readonly preClasses = computed(() =>\r\n    cn(\r\n      'm-0 flex-1 py-4 pe-4 font-mono text-sm leading-relaxed text-fg-muted',\r\n      this.lineNumbers() ? 'ps-2' : 'ps-4',\r\n      this.wraps() ? 'whitespace-pre-wrap break-words' : 'whitespace-pre',\r\n      !this.hasHeader() && this.copyable() && 'pe-12',\r\n    ),\r\n  );\r\n}\r\n","<figure [class]=\"figureClasses()\">\r\n  @if (hasHeader()) {\r\n    <figcaption\r\n      class=\"flex min-h-10 items-center gap-2 border-b border-border ps-4 pe-1.5 text-xs text-fg-muted\"\r\n    >\r\n      @if (filename()) {\r\n        <span mfIcon [size]=\"14\" class=\"shrink-0 text-fg-subtle\">description</span>\r\n        <span class=\"min-w-0 truncate font-mono\">{{ filename() }}</span>\r\n      }\r\n      <span class=\"ms-auto flex shrink-0 items-center gap-1\">\r\n        @if (language()) {\r\n          <span\r\n            class=\"rounded-xs bg-surface-alt px-1.5 py-0.5 font-mono text-eyebrow text-fg-subtle uppercase\"\r\n            >{{ language() }}</span\r\n          >\r\n        }\r\n        @if (copyable()) {\r\n          <mf-copy-button [value]=\"code()\" />\r\n        }\r\n      </span>\r\n    </figcaption>\r\n  }\r\n\r\n  <div class=\"relative\">\r\n    @if (!hasHeader() && copyable()) {\r\n      <mf-copy-button class=\"absolute end-2 top-2 z-[2]\" [value]=\"code()\" />\r\n    }\r\n    <div\r\n      tabindex=\"0\"\r\n      role=\"group\"\r\n      [attr.aria-label]=\"regionLabel()\"\r\n      class=\"overflow-auto outline-none focus-visible:outline-2 focus-visible:-outline-offset-2 focus-visible:outline-focus-ring\"\r\n      [style.max-height]=\"maxHeight() ?? null\"\r\n    >\r\n      <div class=\"flex\" [class.min-w-max]=\"!wraps()\">\r\n        @if (lineNumbers()) {\r\n          <div\r\n            aria-hidden=\"true\"\r\n            class=\"sticky start-0 z-[1] shrink-0 bg-surface-sunken py-4 ps-4 pe-2 text-end font-mono text-sm leading-relaxed text-fg-subtle tabular-nums select-none\"\r\n          >\r\n            @for (line of lines(); track line) {\r\n              <div>{{ line }}</div>\r\n            }\r\n          </div>\r\n        }\r\n        <!-- İçerik tek satırda: <pre> içindeki şablon boşlukları koda sızmasın. -->\r\n        @if (highlighted(); as html) {\r\n          <pre [class]=\"preClasses()\"><code [innerHTML]=\"html\"></code></pre>\r\n        } @else {\r\n          <pre [class]=\"preClasses()\"><code>{{ code() }}</code></pre>\r\n        }\r\n      </div>\r\n    </div>\r\n  </div>\r\n</figure>\r\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":[],"mappings":"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"}

package/fesm2022/mesgflow-ui-kit-color-picker.mjs

@@ -3,7 +3,7 @@ import { OverlayModule } from '@angular/cdk/overlay';
 import * as i0 from '@angular/core';
 import { model, input, inject, computed, signal, viewChild, forwardRef, Component } from '@angular/core';
 import { NG_VALUE_ACCESSOR } from '@angular/forms';
-import { MF_COLOR_PICKER_LABELS, cn } from '@mesgflow/ui-kit/core';
+import { MF_COLOR_PICKER_LABELS, cn, focusRecipe } from '@mesgflow/ui-kit/core';
 import { Icon } from '@mesgflow/ui-kit/icon';
 import { Popover } from '@mesgflow/ui-kit/popover';
 
@@ -187,19 +187,21 @@ class ColorPicker {
         }
     }
     classes = computed(() => cn('flex aspect-square h-control-md shrink-0 items-center justify-center rounded-md border border-border shadow-control transition-colors duration-fast ease-emphasis ' +
-        'hover:border-border-strong focus-visible:outline focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-focus-ring ' +
+        'hover:border-border-strong ' +
+        focusRecipe +
+        ' ' +
         (this.disabled() ? 'pointer-events-none cursor-not-allowed opacity-50' : 'cursor-pointer')), /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "classes" }] : /* istanbul ignore next */ []));
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.6", ngImport: i0, type: ColorPicker, deps: [], target: i0.ɵɵFactoryTarget.Component });
     static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.1.6", type: ColorPicker, isStandalone: true, selector: "mf-color-picker", inputs: { value: { classPropertyName: "value", publicName: "value", isSignal: true, isRequired: false, transformFunction: null }, palette: { classPropertyName: "palette", publicName: "palette", 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: { classAttribute: "inline-flex" }, providers: [
             { provide: NG_VALUE_ACCESSOR, useExisting: forwardRef(() => ColorPicker), multi: true },
-        ], viewQueries: [{ propertyName: "areaEl", first: true, predicate: ["area"], descendants: true, isSignal: true }, { propertyName: "hueTrackEl", first: true, predicate: ["hueTrack"], descendants: true, isSignal: true }], exportAs: ["mfColorPicker"], ngImport: i0, template: "<button\r\n  type=\"button\"\r\n  cdkOverlayOrigin\r\n  #origin=\"cdkOverlayOrigin\"\r\n  [class]=\"classes()\"\r\n  [style.background]=\"disabled() ? null : value()\"\r\n  [disabled]=\"disabled()\"\r\n  [attr.aria-label]=\"effectiveAriaLabel()\"\r\n  [attr.aria-expanded]=\"open()\"\r\n  (click)=\"toggle()\"\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=\"lg\"\r\n  panelClass=\"w-56\"\r\n  (closed)=\"close()\"\r\n>\r\n  <div\r\n    #area\r\n    class=\"relative h-32 w-full cursor-crosshair touch-none rounded-md\"\r\n    [style.background]=\"areaBackground()\"\r\n    (pointerdown)=\"onAreaPointerDown($event)\"\r\n    (pointermove)=\"onAreaPointerMove($event)\"\r\n  >\r\n    <div\r\n      class=\"pointer-events-none absolute h-3 w-3 -translate-x-1/2 -translate-y-1/2 rounded-full border-2 border-surface shadow-control\"\r\n      [style.left.%]=\"hsv().s\"\r\n      [style.top.%]=\"100 - hsv().v\"\r\n    ></div>\r\n  </div>\r\n\r\n  <div\r\n    #hueTrack\r\n    class=\"relative mt-3 h-3 w-full touch-none rounded-full\"\r\n    style=\"background: linear-gradient(to right, #f00, #ff0, #0f0, #0ff, #00f, #f0f, #f00)\"\r\n    (pointerdown)=\"onHuePointerDown($event)\"\r\n    (pointermove)=\"onHuePointerMove($event)\"\r\n  >\r\n    <div\r\n      class=\"pointer-events-none absolute top-1/2 h-4 w-4 -translate-x-1/2 -translate-y-1/2 rounded-full border-2 border-surface bg-surface shadow-control\"\r\n      [style.left.%]=\"(hsv().h / 360) * 100\"\r\n    ></div>\r\n  </div>\r\n\r\n  <div class=\"mt-3 flex items-center gap-2\">\r\n    <input\r\n      type=\"text\"\r\n      class=\"min-h-8 w-full rounded-md border border-border bg-surface px-2 py-1 text-sm text-fg shadow-control focus:border-accent focus-visible:outline focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-focus-ring\"\r\n      [value]=\"hexDraft()\"\r\n      (input)=\"onHexInput($any($event.target).value)\"\r\n      [attr.aria-label]=\"colorPickerLabels().hexAriaLabel\"\r\n    />\r\n    @if (supportsEyeDropper) {\r\n      <button\r\n        type=\"button\"\r\n        class=\"flex h-8 w-8 shrink-0 items-center justify-center rounded-md border border-border text-fg-subtle transition-colors duration-fast ease-emphasis hover:bg-surface-alt hover:text-fg\"\r\n        (click)=\"pickWithEyeDropper()\"\r\n        [attr.aria-label]=\"colorPickerLabels().pickFromScreenAriaLabel\"\r\n      >\r\n        <span mfIcon [size]=\"16\">colorize</span>\r\n      </button>\r\n    }\r\n  </div>\r\n\r\n  @if (palette().length > 0) {\r\n    <div class=\"mt-3 flex flex-wrap gap-1.5\">\r\n      @for (color of palette(); track color) {\r\n        <button\r\n          type=\"button\"\r\n          class=\"h-6 w-6 rounded-sm border border-border transition-transform duration-fast hover:scale-110 focus-visible:outline focus-visible:outline-2 focus-visible:outline-offset-1 focus-visible:outline-focus-ring\"\r\n          [style.background]=\"color\"\r\n          [attr.aria-label]=\"color\"\r\n          (click)=\"selectPaletteColor(color)\"\r\n        ></button>\r\n      }\r\n    </div>\r\n  }\r\n</mf-popover>\r\n", dependencies: [{ kind: "ngmodule", type: OverlayModule }, { kind: "directive", type: i1.CdkOverlayOrigin, selector: "[cdk-overlay-origin], [overlay-origin], [cdkOverlayOrigin]", exportAs: ["cdkOverlayOrigin"] }, { kind: "directive", type: Icon, selector: "span[mfIcon]", inputs: ["size", "filled"] }, { kind: "component", type: Popover, selector: "mf-popover", inputs: ["origin", "open", "placement", "padding", "hasBackdrop", "matchTriggerWidth", "panelClass"], outputs: ["openChange", "closed"], exportAs: ["mfPopover"] }] });
+        ], viewQueries: [{ propertyName: "areaEl", first: true, predicate: ["area"], descendants: true, isSignal: true }, { propertyName: "hueTrackEl", first: true, predicate: ["hueTrack"], descendants: true, isSignal: true }], exportAs: ["mfColorPicker"], ngImport: i0, template: "<button\r\n  type=\"button\"\r\n  cdkOverlayOrigin\r\n  #origin=\"cdkOverlayOrigin\"\r\n  [class]=\"classes()\"\r\n  [style.background]=\"disabled() ? null : value()\"\r\n  [disabled]=\"disabled()\"\r\n  [attr.aria-label]=\"effectiveAriaLabel()\"\r\n  [attr.aria-expanded]=\"open()\"\r\n  (click)=\"toggle()\"\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=\"lg\"\r\n  panelClass=\"w-56\"\r\n  (closed)=\"close()\"\r\n>\r\n  <div\r\n    #area\r\n    class=\"relative h-32 w-full cursor-crosshair touch-none rounded-md\"\r\n    [style.background]=\"areaBackground()\"\r\n    (pointerdown)=\"onAreaPointerDown($event)\"\r\n    (pointermove)=\"onAreaPointerMove($event)\"\r\n  >\r\n    <div\r\n      class=\"pointer-events-none absolute h-3 w-3 -translate-x-1/2 -translate-y-1/2 rounded-full border-2 border-surface shadow-control\"\r\n      [style.left.%]=\"hsv().s\"\r\n      [style.top.%]=\"100 - hsv().v\"\r\n    ></div>\r\n  </div>\r\n\r\n  <div\r\n    #hueTrack\r\n    class=\"relative mt-3 h-3 w-full touch-none rounded-full\"\r\n    style=\"background: linear-gradient(to right, #f00, #ff0, #0f0, #0ff, #00f, #f0f, #f00)\"\r\n    (pointerdown)=\"onHuePointerDown($event)\"\r\n    (pointermove)=\"onHuePointerMove($event)\"\r\n  >\r\n    <div\r\n      class=\"pointer-events-none absolute top-1/2 h-4 w-4 -translate-x-1/2 -translate-y-1/2 rounded-full border-2 border-surface bg-surface shadow-control\"\r\n      [style.left.%]=\"(hsv().h / 360) * 100\"\r\n    ></div>\r\n  </div>\r\n\r\n  <div class=\"mt-3 flex items-center gap-2\">\r\n    <input\r\n      type=\"text\"\r\n      class=\"min-h-8 w-full rounded-md border border-border bg-surface px-2 py-1 text-sm text-fg shadow-control focus:border-accent focus-visible:outline focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-focus-ring\"\r\n      [value]=\"hexDraft()\"\r\n      (input)=\"onHexInput($any($event.target).value)\"\r\n      [attr.aria-label]=\"colorPickerLabels().hexAriaLabel\"\r\n    />\r\n    @if (supportsEyeDropper) {\r\n      <button\r\n        type=\"button\"\r\n        class=\"flex h-8 w-8 shrink-0 items-center justify-center rounded-md border border-border text-fg-subtle transition-colors duration-fast ease-emphasis hover:bg-state-hover hover:text-fg\"\r\n        (click)=\"pickWithEyeDropper()\"\r\n        [attr.aria-label]=\"colorPickerLabels().pickFromScreenAriaLabel\"\r\n      >\r\n        <span mfIcon [size]=\"16\">colorize</span>\r\n      </button>\r\n    }\r\n  </div>\r\n\r\n  @if (palette().length > 0) {\r\n    <div class=\"mt-3 flex flex-wrap gap-1.5\">\r\n      @for (color of palette(); track color) {\r\n        <button\r\n          type=\"button\"\r\n          class=\"h-6 w-6 rounded-sm border border-border transition-transform duration-fast hover:scale-110 focus-visible:outline focus-visible:outline-2 focus-visible:outline-offset-1 focus-visible:outline-focus-ring\"\r\n          [style.background]=\"color\"\r\n          [attr.aria-label]=\"color\"\r\n          (click)=\"selectPaletteColor(color)\"\r\n        ></button>\r\n      }\r\n    </div>\r\n  }\r\n</mf-popover>\r\n", dependencies: [{ kind: "ngmodule", type: OverlayModule }, { kind: "directive", type: i1.CdkOverlayOrigin, selector: "[cdk-overlay-origin], [overlay-origin], [cdkOverlayOrigin]", exportAs: ["cdkOverlayOrigin"] }, { kind: "directive", type: Icon, selector: "span[mfIcon]", inputs: ["size", "filled"] }, { kind: "component", type: Popover, selector: "mf-popover", inputs: ["origin", "open", "placement", "padding", "hasBackdrop", "matchTriggerWidth", "panelClass"], outputs: ["openChange", "closed"], exportAs: ["mfPopover"] }] });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.6", ngImport: i0, type: ColorPicker, decorators: [{
             type: Component,
             args: [{ selector: 'mf-color-picker', exportAs: 'mfColorPicker', host: { class: 'inline-flex' }, imports: [OverlayModule, Icon, Popover], providers: [
                         { provide: NG_VALUE_ACCESSOR, useExisting: forwardRef(() => ColorPicker), multi: true },
-                    ], template: "<button\r\n  type=\"button\"\r\n  cdkOverlayOrigin\r\n  #origin=\"cdkOverlayOrigin\"\r\n  [class]=\"classes()\"\r\n  [style.background]=\"disabled() ? null : value()\"\r\n  [disabled]=\"disabled()\"\r\n  [attr.aria-label]=\"effectiveAriaLabel()\"\r\n  [attr.aria-expanded]=\"open()\"\r\n  (click)=\"toggle()\"\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=\"lg\"\r\n  panelClass=\"w-56\"\r\n  (closed)=\"close()\"\r\n>\r\n  <div\r\n    #area\r\n    class=\"relative h-32 w-full cursor-crosshair touch-none rounded-md\"\r\n    [style.background]=\"areaBackground()\"\r\n    (pointerdown)=\"onAreaPointerDown($event)\"\r\n    (pointermove)=\"onAreaPointerMove($event)\"\r\n  >\r\n    <div\r\n      class=\"pointer-events-none absolute h-3 w-3 -translate-x-1/2 -translate-y-1/2 rounded-full border-2 border-surface shadow-control\"\r\n      [style.left.%]=\"hsv().s\"\r\n      [style.top.%]=\"100 - hsv().v\"\r\n    ></div>\r\n  </div>\r\n\r\n  <div\r\n    #hueTrack\r\n    class=\"relative mt-3 h-3 w-full touch-none rounded-full\"\r\n    style=\"background: linear-gradient(to right, #f00, #ff0, #0f0, #0ff, #00f, #f0f, #f00)\"\r\n    (pointerdown)=\"onHuePointerDown($event)\"\r\n    (pointermove)=\"onHuePointerMove($event)\"\r\n  >\r\n    <div\r\n      class=\"pointer-events-none absolute top-1/2 h-4 w-4 -translate-x-1/2 -translate-y-1/2 rounded-full border-2 border-surface bg-surface shadow-control\"\r\n      [style.left.%]=\"(hsv().h / 360) * 100\"\r\n    ></div>\r\n  </div>\r\n\r\n  <div class=\"mt-3 flex items-center gap-2\">\r\n    <input\r\n      type=\"text\"\r\n      class=\"min-h-8 w-full rounded-md border border-border bg-surface px-2 py-1 text-sm text-fg shadow-control focus:border-accent focus-visible:outline focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-focus-ring\"\r\n      [value]=\"hexDraft()\"\r\n      (input)=\"onHexInput($any($event.target).value)\"\r\n      [attr.aria-label]=\"colorPickerLabels().hexAriaLabel\"\r\n    />\r\n    @if (supportsEyeDropper) {\r\n      <button\r\n        type=\"button\"\r\n        class=\"flex h-8 w-8 shrink-0 items-center justify-center rounded-md border border-border text-fg-subtle transition-colors duration-fast ease-emphasis hover:bg-surface-alt hover:text-fg\"\r\n        (click)=\"pickWithEyeDropper()\"\r\n        [attr.aria-label]=\"colorPickerLabels().pickFromScreenAriaLabel\"\r\n      >\r\n        <span mfIcon [size]=\"16\">colorize</span>\r\n      </button>\r\n    }\r\n  </div>\r\n\r\n  @if (palette().length > 0) {\r\n    <div class=\"mt-3 flex flex-wrap gap-1.5\">\r\n      @for (color of palette(); track color) {\r\n        <button\r\n          type=\"button\"\r\n          class=\"h-6 w-6 rounded-sm border border-border transition-transform duration-fast hover:scale-110 focus-visible:outline focus-visible:outline-2 focus-visible:outline-offset-1 focus-visible:outline-focus-ring\"\r\n          [style.background]=\"color\"\r\n          [attr.aria-label]=\"color\"\r\n          (click)=\"selectPaletteColor(color)\"\r\n        ></button>\r\n      }\r\n    </div>\r\n  }\r\n</mf-popover>\r\n" }]
+                    ], template: "<button\r\n  type=\"button\"\r\n  cdkOverlayOrigin\r\n  #origin=\"cdkOverlayOrigin\"\r\n  [class]=\"classes()\"\r\n  [style.background]=\"disabled() ? null : value()\"\r\n  [disabled]=\"disabled()\"\r\n  [attr.aria-label]=\"effectiveAriaLabel()\"\r\n  [attr.aria-expanded]=\"open()\"\r\n  (click)=\"toggle()\"\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=\"lg\"\r\n  panelClass=\"w-56\"\r\n  (closed)=\"close()\"\r\n>\r\n  <div\r\n    #area\r\n    class=\"relative h-32 w-full cursor-crosshair touch-none rounded-md\"\r\n    [style.background]=\"areaBackground()\"\r\n    (pointerdown)=\"onAreaPointerDown($event)\"\r\n    (pointermove)=\"onAreaPointerMove($event)\"\r\n  >\r\n    <div\r\n      class=\"pointer-events-none absolute h-3 w-3 -translate-x-1/2 -translate-y-1/2 rounded-full border-2 border-surface shadow-control\"\r\n      [style.left.%]=\"hsv().s\"\r\n      [style.top.%]=\"100 - hsv().v\"\r\n    ></div>\r\n  </div>\r\n\r\n  <div\r\n    #hueTrack\r\n    class=\"relative mt-3 h-3 w-full touch-none rounded-full\"\r\n    style=\"background: linear-gradient(to right, #f00, #ff0, #0f0, #0ff, #00f, #f0f, #f00)\"\r\n    (pointerdown)=\"onHuePointerDown($event)\"\r\n    (pointermove)=\"onHuePointerMove($event)\"\r\n  >\r\n    <div\r\n      class=\"pointer-events-none absolute top-1/2 h-4 w-4 -translate-x-1/2 -translate-y-1/2 rounded-full border-2 border-surface bg-surface shadow-control\"\r\n      [style.left.%]=\"(hsv().h / 360) * 100\"\r\n    ></div>\r\n  </div>\r\n\r\n  <div class=\"mt-3 flex items-center gap-2\">\r\n    <input\r\n      type=\"text\"\r\n      class=\"min-h-8 w-full rounded-md border border-border bg-surface px-2 py-1 text-sm text-fg shadow-control focus:border-accent focus-visible:outline focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-focus-ring\"\r\n      [value]=\"hexDraft()\"\r\n      (input)=\"onHexInput($any($event.target).value)\"\r\n      [attr.aria-label]=\"colorPickerLabels().hexAriaLabel\"\r\n    />\r\n    @if (supportsEyeDropper) {\r\n      <button\r\n        type=\"button\"\r\n        class=\"flex h-8 w-8 shrink-0 items-center justify-center rounded-md border border-border text-fg-subtle transition-colors duration-fast ease-emphasis hover:bg-state-hover hover:text-fg\"\r\n        (click)=\"pickWithEyeDropper()\"\r\n        [attr.aria-label]=\"colorPickerLabels().pickFromScreenAriaLabel\"\r\n      >\r\n        <span mfIcon [size]=\"16\">colorize</span>\r\n      </button>\r\n    }\r\n  </div>\r\n\r\n  @if (palette().length > 0) {\r\n    <div class=\"mt-3 flex flex-wrap gap-1.5\">\r\n      @for (color of palette(); track color) {\r\n        <button\r\n          type=\"button\"\r\n          class=\"h-6 w-6 rounded-sm border border-border transition-transform duration-fast hover:scale-110 focus-visible:outline focus-visible:outline-2 focus-visible:outline-offset-1 focus-visible:outline-focus-ring\"\r\n          [style.background]=\"color\"\r\n          [attr.aria-label]=\"color\"\r\n          (click)=\"selectPaletteColor(color)\"\r\n        ></button>\r\n      }\r\n    </div>\r\n  }\r\n</mf-popover>\r\n" }]
         }], propDecorators: { value: [{ type: i0.Input, args: [{ isSignal: true, alias: "value", required: false }] }, { type: i0.Output, args: ["valueChange"] }], palette: [{ type: i0.Input, args: [{ isSignal: true, alias: "palette", required: false }] }], disabled: [{ type: i0.Input, args: [{ isSignal: true, alias: "disabled", required: false }] }], ariaLabel: [{ type: i0.Input, args: [{ isSignal: true, alias: "ariaLabel", required: false }] }], areaEl: [{ type: i0.ViewChild, args: ['area', { isSignal: true }] }], hueTrackEl: [{ type: i0.ViewChild, args: ['hueTrack', { isSignal: true }] }] } });
 
 /**

package/fesm2022/mesgflow-ui-kit-color-picker.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"mesgflow-ui-kit-color-picker.mjs","sources":["../../../projects/ui-kit/color-picker/color.ts","../../../projects/ui-kit/color-picker/color-picker.ts","../../../projects/ui-kit/color-picker/color-picker.html","../../../projects/ui-kit/color-picker/mesgflow-ui-kit-color-picker.ts"],"sourcesContent":["export interface Hsv {\r\n  h: number; // 0-360\r\n  s: number; // 0-100\r\n  v: number; // 0-100\r\n}\r\n\r\nexport interface Rgb {\r\n  r: number;\r\n  g: number;\r\n  b: number;\r\n}\r\n\r\nexport function hexToRgb(hex: string): Rgb | null {\r\n  const match = /^#?([a-f\\d]{2})([a-f\\d]{2})([a-f\\d]{2})$/i.exec(hex.trim());\r\n  if (!match) return null;\r\n  return { r: parseInt(match[1], 16), g: parseInt(match[2], 16), b: parseInt(match[3], 16) };\r\n}\r\n\r\nexport function rgbToHex({ r, g, b }: Rgb): string {\r\n  const toHex = (n: number) =>\r\n    Math.round(Math.min(255, Math.max(0, n)))\r\n      .toString(16)\r\n      .padStart(2, '0');\r\n  return `#${toHex(r)}${toHex(g)}${toHex(b)}`;\r\n}\r\n\r\nexport function rgbToHsv({ r, g, b }: Rgb): Hsv {\r\n  const rn = r / 255;\r\n  const gn = g / 255;\r\n  const bn = b / 255;\r\n  const max = Math.max(rn, gn, bn);\r\n  const min = Math.min(rn, gn, bn);\r\n  const delta = max - min;\r\n\r\n  let h = 0;\r\n  if (delta !== 0) {\r\n    if (max === rn) h = 60 * (((gn - bn) / delta) % 6);\r\n    else if (max === gn) h = 60 * ((bn - rn) / delta + 2);\r\n    else h = 60 * ((rn - gn) / delta + 4);\r\n  }\r\n  if (h < 0) h += 360;\r\n\r\n  const s = max === 0 ? 0 : (delta / max) * 100;\r\n  const v = max * 100;\r\n\r\n  return { h, s, v };\r\n}\r\n\r\nexport function hsvToRgb({ h, s, v }: Hsv): Rgb {\r\n  const sn = s / 100;\r\n  const vn = v / 100;\r\n  const c = vn * sn;\r\n  const x = c * (1 - Math.abs(((h / 60) % 2) - 1));\r\n  const m = vn - c;\r\n\r\n  let rp: number;\r\n  let gp: number;\r\n  let bp: number;\r\n  if (h < 60) [rp, gp, bp] = [c, x, 0];\r\n  else if (h < 120) [rp, gp, bp] = [x, c, 0];\r\n  else if (h < 180) [rp, gp, bp] = [0, c, x];\r\n  else if (h < 240) [rp, gp, bp] = [0, x, c];\r\n  else if (h < 300) [rp, gp, bp] = [x, 0, c];\r\n  else [rp, gp, bp] = [c, 0, x];\r\n\r\n  return { r: (rp + m) * 255, g: (gp + m) * 255, b: (bp + m) * 255 };\r\n}\r\n","import { OverlayModule } from '@angular/cdk/overlay';\r\nimport {\r\n  Component,\r\n  ElementRef,\r\n  computed,\r\n  forwardRef,\r\n  inject,\r\n  input,\r\n  model,\r\n  signal,\r\n  viewChild,\r\n} from '@angular/core';\r\nimport { NG_VALUE_ACCESSOR, type ControlValueAccessor } from '@angular/forms';\r\nimport { cn, MF_COLOR_PICKER_LABELS } from '@mesgflow/ui-kit/core';\r\nimport { Icon } from '@mesgflow/ui-kit/icon';\r\nimport { Popover } from '@mesgflow/ui-kit/popover';\r\nimport { hexToRgb, hsvToRgb, rgbToHex, rgbToHsv, type Hsv } from './color';\r\n\r\ninterface EyeDropperResult {\r\n  sRGBHex: string;\r\n}\r\n\r\ninterface EyeDropperApi {\r\n  open(): Promise<EyeDropperResult>;\r\n}\r\n\r\ndeclare global {\r\n  interface Window {\r\n    EyeDropper?: new () => EyeDropperApi;\r\n  }\r\n}\r\n\r\n/**\r\n * `<mf-color-picker [(value)]=\"brandColor\" [palette]=\"brandPalette\" />` —\r\n * HSV alanı + hue slider + hex girdi + marka paleti + (destekleniyorsa)\r\n * `EyeDropper` API. `@angular/aria`'da hazır bir color-picker pattern'i YOK\r\n * — HSV alanı ve hue slider'ı `Slider`'daki AYNI hand-rolled pointer/klavye\r\n * yaklaşımıyla kuruldu. Overlay pozisyonlaması `Select`'in kanıtlanmış\r\n * `cdkConnectedOverlay` deseni.\r\n */\r\n@Component({\r\n  selector: 'mf-color-picker',\r\n  exportAs: 'mfColorPicker',\r\n  host: { class: 'inline-flex' },\r\n  imports: [OverlayModule, Icon, Popover],\r\n  templateUrl: './color-picker.html',\r\n  providers: [\r\n    { provide: NG_VALUE_ACCESSOR, useExisting: forwardRef(() => ColorPicker), multi: true },\r\n  ],\r\n})\r\nexport class ColorPicker implements ControlValueAccessor {\r\n  /** Varsayılan — kitin kendi marka rengi (`--color-primary-600`, bkz. tokens/color.css) — jenerik bir Tailwind yeşili DEĞİL. */\r\n  readonly value = model('#004d40');\r\n  readonly palette = input<string[]>([]);\r\n  readonly disabled = input(false);\r\n  readonly ariaLabel = input<string>();\r\n\r\n  private onChange: (value: string) => void = () => {};\r\n  private onTouched: () => void = () => {};\r\n\r\n  protected readonly colorPickerLabels = inject(MF_COLOR_PICKER_LABELS);\r\n  protected readonly effectiveAriaLabel = computed(\r\n    () => this.ariaLabel() ?? this.colorPickerLabels().ariaLabel,\r\n  );\r\n\r\n  protected readonly open = signal(false);\r\n  protected readonly hexDraft = signal('');\r\n\r\n  protected readonly areaEl = viewChild<ElementRef<HTMLElement>>('area');\r\n  protected readonly hueTrackEl = viewChild<ElementRef<HTMLElement>>('hueTrack');\r\n\r\n  protected readonly hsv = computed<Hsv>(() =>\r\n    rgbToHsv(hexToRgb(this.value()) ?? { r: 0, g: 0, b: 0 }),\r\n  );\r\n\r\n  protected readonly areaBackground = computed(\r\n    () =>\r\n      `linear-gradient(to top, #000, transparent), linear-gradient(to right, #fff, transparent), hsl(${this.hsv().h}, 100%, 50%)`,\r\n  );\r\n\r\n  protected readonly supportsEyeDropper = typeof window !== 'undefined' && !!window.EyeDropper;\r\n\r\n  writeValue(value: string): void {\r\n    this.value.set(value || '#000000');\r\n  }\r\n\r\n  registerOnChange(fn: (value: string) => void): void {\r\n    this.onChange = fn;\r\n  }\r\n\r\n  registerOnTouched(fn: () => void): void {\r\n    this.onTouched = fn;\r\n  }\r\n\r\n  protected toggle(): void {\r\n    if (this.disabled()) return;\r\n    this.hexDraft.set(this.value());\r\n    this.open.update((v) => !v);\r\n  }\r\n\r\n  protected close(): void {\r\n    this.open.set(false);\r\n    this.onTouched();\r\n  }\r\n\r\n  private setHsv(next: Partial<Hsv>): void {\r\n    const hex = rgbToHex(hsvToRgb({ ...this.hsv(), ...next }));\r\n    this.value.set(hex);\r\n    this.hexDraft.set(hex);\r\n    this.onChange(hex);\r\n  }\r\n\r\n  protected onAreaPointerDown(event: PointerEvent): void {\r\n    (event.currentTarget as HTMLElement).setPointerCapture(event.pointerId);\r\n    this.updateFromAreaPointer(event);\r\n  }\r\n\r\n  protected onAreaPointerMove(event: PointerEvent): void {\r\n    if (event.buttons !== 1) return;\r\n    this.updateFromAreaPointer(event);\r\n  }\r\n\r\n  private updateFromAreaPointer(event: PointerEvent): void {\r\n    const rect = this.areaEl()?.nativeElement.getBoundingClientRect();\r\n    if (!rect) return;\r\n    const s = Math.min(100, Math.max(0, ((event.clientX - rect.left) / rect.width) * 100));\r\n    const v = Math.min(100, Math.max(0, 100 - ((event.clientY - rect.top) / rect.height) * 100));\r\n    this.setHsv({ s, v });\r\n  }\r\n\r\n  protected onHuePointerDown(event: PointerEvent): void {\r\n    (event.currentTarget as HTMLElement).setPointerCapture(event.pointerId);\r\n    this.updateFromHuePointer(event);\r\n  }\r\n\r\n  protected onHuePointerMove(event: PointerEvent): void {\r\n    if (event.buttons !== 1) return;\r\n    this.updateFromHuePointer(event);\r\n  }\r\n\r\n  private updateFromHuePointer(event: PointerEvent): void {\r\n    const rect = this.hueTrackEl()?.nativeElement.getBoundingClientRect();\r\n    if (!rect) return;\r\n    const h = Math.min(360, Math.max(0, ((event.clientX - rect.left) / rect.width) * 360));\r\n    this.setHsv({ h });\r\n  }\r\n\r\n  protected onHexInput(raw: string): void {\r\n    this.hexDraft.set(raw);\r\n    const rgb = hexToRgb(raw);\r\n    if (rgb) {\r\n      const hex = rgbToHex(rgb);\r\n      this.value.set(hex);\r\n      this.onChange(hex);\r\n    }\r\n  }\r\n\r\n  protected selectPaletteColor(hex: string): void {\r\n    this.value.set(hex);\r\n    this.hexDraft.set(hex);\r\n    this.onChange(hex);\r\n  }\r\n\r\n  protected async pickWithEyeDropper(): Promise<void> {\r\n    if (!window.EyeDropper) return;\r\n    try {\r\n      const result = await new window.EyeDropper().open();\r\n      this.value.set(result.sRGBHex);\r\n      this.hexDraft.set(result.sRGBHex);\r\n      this.onChange(result.sRGBHex);\r\n    } catch {\r\n      // Kullanıcı Escape ile iptal etti — sessizce yut, gerçek bir hata değil.\r\n    }\r\n  }\r\n\r\n  protected readonly classes = computed(() =>\r\n    cn(\r\n      'flex aspect-square h-control-md shrink-0 items-center justify-center rounded-md border border-border shadow-control transition-colors duration-fast ease-emphasis ' +\r\n        'hover:border-border-strong focus-visible:outline focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-focus-ring ' +\r\n        (this.disabled() ? 'pointer-events-none cursor-not-allowed opacity-50' : 'cursor-pointer'),\r\n    ),\r\n  );\r\n}\r\n","<button\r\n  type=\"button\"\r\n  cdkOverlayOrigin\r\n  #origin=\"cdkOverlayOrigin\"\r\n  [class]=\"classes()\"\r\n  [style.background]=\"disabled() ? null : value()\"\r\n  [disabled]=\"disabled()\"\r\n  [attr.aria-label]=\"effectiveAriaLabel()\"\r\n  [attr.aria-expanded]=\"open()\"\r\n  (click)=\"toggle()\"\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=\"lg\"\r\n  panelClass=\"w-56\"\r\n  (closed)=\"close()\"\r\n>\r\n  <div\r\n    #area\r\n    class=\"relative h-32 w-full cursor-crosshair touch-none rounded-md\"\r\n    [style.background]=\"areaBackground()\"\r\n    (pointerdown)=\"onAreaPointerDown($event)\"\r\n    (pointermove)=\"onAreaPointerMove($event)\"\r\n  >\r\n    <div\r\n      class=\"pointer-events-none absolute h-3 w-3 -translate-x-1/2 -translate-y-1/2 rounded-full border-2 border-surface shadow-control\"\r\n      [style.left.%]=\"hsv().s\"\r\n      [style.top.%]=\"100 - hsv().v\"\r\n    ></div>\r\n  </div>\r\n\r\n  <div\r\n    #hueTrack\r\n    class=\"relative mt-3 h-3 w-full touch-none rounded-full\"\r\n    style=\"background: linear-gradient(to right, #f00, #ff0, #0f0, #0ff, #00f, #f0f, #f00)\"\r\n    (pointerdown)=\"onHuePointerDown($event)\"\r\n    (pointermove)=\"onHuePointerMove($event)\"\r\n  >\r\n    <div\r\n      class=\"pointer-events-none absolute top-1/2 h-4 w-4 -translate-x-1/2 -translate-y-1/2 rounded-full border-2 border-surface bg-surface shadow-control\"\r\n      [style.left.%]=\"(hsv().h / 360) * 100\"\r\n    ></div>\r\n  </div>\r\n\r\n  <div class=\"mt-3 flex items-center gap-2\">\r\n    <input\r\n      type=\"text\"\r\n      class=\"min-h-8 w-full rounded-md border border-border bg-surface px-2 py-1 text-sm text-fg shadow-control focus:border-accent focus-visible:outline focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-focus-ring\"\r\n      [value]=\"hexDraft()\"\r\n      (input)=\"onHexInput($any($event.target).value)\"\r\n      [attr.aria-label]=\"colorPickerLabels().hexAriaLabel\"\r\n    />\r\n    @if (supportsEyeDropper) {\r\n      <button\r\n        type=\"button\"\r\n        class=\"flex h-8 w-8 shrink-0 items-center justify-center rounded-md border border-border text-fg-subtle transition-colors duration-fast ease-emphasis hover:bg-surface-alt hover:text-fg\"\r\n        (click)=\"pickWithEyeDropper()\"\r\n        [attr.aria-label]=\"colorPickerLabels().pickFromScreenAriaLabel\"\r\n      >\r\n        <span mfIcon [size]=\"16\">colorize</span>\r\n      </button>\r\n    }\r\n  </div>\r\n\r\n  @if (palette().length > 0) {\r\n    <div class=\"mt-3 flex flex-wrap gap-1.5\">\r\n      @for (color of palette(); track color) {\r\n        <button\r\n          type=\"button\"\r\n          class=\"h-6 w-6 rounded-sm border border-border transition-transform duration-fast hover:scale-110 focus-visible:outline focus-visible:outline-2 focus-visible:outline-offset-1 focus-visible:outline-focus-ring\"\r\n          [style.background]=\"color\"\r\n          [attr.aria-label]=\"color\"\r\n          (click)=\"selectPaletteColor(color)\"\r\n        ></button>\r\n      }\r\n    </div>\r\n  }\r\n</mf-popover>\r\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":[],"mappings":"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"}
+{"version":3,"file":"mesgflow-ui-kit-color-picker.mjs","sources":["../../../projects/ui-kit/color-picker/color.ts","../../../projects/ui-kit/color-picker/color-picker.ts","../../../projects/ui-kit/color-picker/color-picker.html","../../../projects/ui-kit/color-picker/mesgflow-ui-kit-color-picker.ts"],"sourcesContent":["export interface Hsv {\r\n  h: number; // 0-360\r\n  s: number; // 0-100\r\n  v: number; // 0-100\r\n}\r\n\r\nexport interface Rgb {\r\n  r: number;\r\n  g: number;\r\n  b: number;\r\n}\r\n\r\nexport function hexToRgb(hex: string): Rgb | null {\r\n  const match = /^#?([a-f\\d]{2})([a-f\\d]{2})([a-f\\d]{2})$/i.exec(hex.trim());\r\n  if (!match) return null;\r\n  return { r: parseInt(match[1], 16), g: parseInt(match[2], 16), b: parseInt(match[3], 16) };\r\n}\r\n\r\nexport function rgbToHex({ r, g, b }: Rgb): string {\r\n  const toHex = (n: number) =>\r\n    Math.round(Math.min(255, Math.max(0, n)))\r\n      .toString(16)\r\n      .padStart(2, '0');\r\n  return `#${toHex(r)}${toHex(g)}${toHex(b)}`;\r\n}\r\n\r\nexport function rgbToHsv({ r, g, b }: Rgb): Hsv {\r\n  const rn = r / 255;\r\n  const gn = g / 255;\r\n  const bn = b / 255;\r\n  const max = Math.max(rn, gn, bn);\r\n  const min = Math.min(rn, gn, bn);\r\n  const delta = max - min;\r\n\r\n  let h = 0;\r\n  if (delta !== 0) {\r\n    if (max === rn) h = 60 * (((gn - bn) / delta) % 6);\r\n    else if (max === gn) h = 60 * ((bn - rn) / delta + 2);\r\n    else h = 60 * ((rn - gn) / delta + 4);\r\n  }\r\n  if (h < 0) h += 360;\r\n\r\n  const s = max === 0 ? 0 : (delta / max) * 100;\r\n  const v = max * 100;\r\n\r\n  return { h, s, v };\r\n}\r\n\r\nexport function hsvToRgb({ h, s, v }: Hsv): Rgb {\r\n  const sn = s / 100;\r\n  const vn = v / 100;\r\n  const c = vn * sn;\r\n  const x = c * (1 - Math.abs(((h / 60) % 2) - 1));\r\n  const m = vn - c;\r\n\r\n  let rp: number;\r\n  let gp: number;\r\n  let bp: number;\r\n  if (h < 60) [rp, gp, bp] = [c, x, 0];\r\n  else if (h < 120) [rp, gp, bp] = [x, c, 0];\r\n  else if (h < 180) [rp, gp, bp] = [0, c, x];\r\n  else if (h < 240) [rp, gp, bp] = [0, x, c];\r\n  else if (h < 300) [rp, gp, bp] = [x, 0, c];\r\n  else [rp, gp, bp] = [c, 0, x];\r\n\r\n  return { r: (rp + m) * 255, g: (gp + m) * 255, b: (bp + m) * 255 };\r\n}\r\n","import { OverlayModule } from '@angular/cdk/overlay';\r\nimport {\r\n  Component,\r\n  ElementRef,\r\n  computed,\r\n  forwardRef,\r\n  inject,\r\n  input,\r\n  model,\r\n  signal,\r\n  viewChild,\r\n} from '@angular/core';\r\nimport { NG_VALUE_ACCESSOR, type ControlValueAccessor } from '@angular/forms';\r\nimport { cn, MF_COLOR_PICKER_LABELS, focusRecipe } from '@mesgflow/ui-kit/core';\r\nimport { Icon } from '@mesgflow/ui-kit/icon';\r\nimport { Popover } from '@mesgflow/ui-kit/popover';\r\nimport { hexToRgb, hsvToRgb, rgbToHex, rgbToHsv, type Hsv } from './color';\r\n\r\ninterface EyeDropperResult {\r\n  sRGBHex: string;\r\n}\r\n\r\ninterface EyeDropperApi {\r\n  open(): Promise<EyeDropperResult>;\r\n}\r\n\r\ndeclare global {\r\n  interface Window {\r\n    EyeDropper?: new () => EyeDropperApi;\r\n  }\r\n}\r\n\r\n/**\r\n * `<mf-color-picker [(value)]=\"brandColor\" [palette]=\"brandPalette\" />` —\r\n * HSV alanı + hue slider + hex girdi + marka paleti + (destekleniyorsa)\r\n * `EyeDropper` API. `@angular/aria`'da hazır bir color-picker pattern'i YOK\r\n * — HSV alanı ve hue slider'ı `Slider`'daki AYNI hand-rolled pointer/klavye\r\n * yaklaşımıyla kuruldu. Overlay pozisyonlaması `Select`'in kanıtlanmış\r\n * `cdkConnectedOverlay` deseni.\r\n */\r\n@Component({\r\n  selector: 'mf-color-picker',\r\n  exportAs: 'mfColorPicker',\r\n  host: { class: 'inline-flex' },\r\n  imports: [OverlayModule, Icon, Popover],\r\n  templateUrl: './color-picker.html',\r\n  providers: [\r\n    { provide: NG_VALUE_ACCESSOR, useExisting: forwardRef(() => ColorPicker), multi: true },\r\n  ],\r\n})\r\nexport class ColorPicker implements ControlValueAccessor {\r\n  /** Varsayılan — kitin kendi marka rengi (`--color-primary-600`, bkz. tokens/color.css) — jenerik bir Tailwind yeşili DEĞİL. */\r\n  readonly value = model('#004d40');\r\n  readonly palette = input<string[]>([]);\r\n  readonly disabled = input(false);\r\n  readonly ariaLabel = input<string>();\r\n\r\n  private onChange: (value: string) => void = () => {};\r\n  private onTouched: () => void = () => {};\r\n\r\n  protected readonly colorPickerLabels = inject(MF_COLOR_PICKER_LABELS);\r\n  protected readonly effectiveAriaLabel = computed(\r\n    () => this.ariaLabel() ?? this.colorPickerLabels().ariaLabel,\r\n  );\r\n\r\n  protected readonly open = signal(false);\r\n  protected readonly hexDraft = signal('');\r\n\r\n  protected readonly areaEl = viewChild<ElementRef<HTMLElement>>('area');\r\n  protected readonly hueTrackEl = viewChild<ElementRef<HTMLElement>>('hueTrack');\r\n\r\n  protected readonly hsv = computed<Hsv>(() =>\r\n    rgbToHsv(hexToRgb(this.value()) ?? { r: 0, g: 0, b: 0 }),\r\n  );\r\n\r\n  protected readonly areaBackground = computed(\r\n    () =>\r\n      `linear-gradient(to top, #000, transparent), linear-gradient(to right, #fff, transparent), hsl(${this.hsv().h}, 100%, 50%)`,\r\n  );\r\n\r\n  protected readonly supportsEyeDropper = typeof window !== 'undefined' && !!window.EyeDropper;\r\n\r\n  writeValue(value: string): void {\r\n    this.value.set(value || '#000000');\r\n  }\r\n\r\n  registerOnChange(fn: (value: string) => void): void {\r\n    this.onChange = fn;\r\n  }\r\n\r\n  registerOnTouched(fn: () => void): void {\r\n    this.onTouched = fn;\r\n  }\r\n\r\n  protected toggle(): void {\r\n    if (this.disabled()) return;\r\n    this.hexDraft.set(this.value());\r\n    this.open.update((v) => !v);\r\n  }\r\n\r\n  protected close(): void {\r\n    this.open.set(false);\r\n    this.onTouched();\r\n  }\r\n\r\n  private setHsv(next: Partial<Hsv>): void {\r\n    const hex = rgbToHex(hsvToRgb({ ...this.hsv(), ...next }));\r\n    this.value.set(hex);\r\n    this.hexDraft.set(hex);\r\n    this.onChange(hex);\r\n  }\r\n\r\n  protected onAreaPointerDown(event: PointerEvent): void {\r\n    (event.currentTarget as HTMLElement).setPointerCapture(event.pointerId);\r\n    this.updateFromAreaPointer(event);\r\n  }\r\n\r\n  protected onAreaPointerMove(event: PointerEvent): void {\r\n    if (event.buttons !== 1) return;\r\n    this.updateFromAreaPointer(event);\r\n  }\r\n\r\n  private updateFromAreaPointer(event: PointerEvent): void {\r\n    const rect = this.areaEl()?.nativeElement.getBoundingClientRect();\r\n    if (!rect) return;\r\n    const s = Math.min(100, Math.max(0, ((event.clientX - rect.left) / rect.width) * 100));\r\n    const v = Math.min(100, Math.max(0, 100 - ((event.clientY - rect.top) / rect.height) * 100));\r\n    this.setHsv({ s, v });\r\n  }\r\n\r\n  protected onHuePointerDown(event: PointerEvent): void {\r\n    (event.currentTarget as HTMLElement).setPointerCapture(event.pointerId);\r\n    this.updateFromHuePointer(event);\r\n  }\r\n\r\n  protected onHuePointerMove(event: PointerEvent): void {\r\n    if (event.buttons !== 1) return;\r\n    this.updateFromHuePointer(event);\r\n  }\r\n\r\n  private updateFromHuePointer(event: PointerEvent): void {\r\n    const rect = this.hueTrackEl()?.nativeElement.getBoundingClientRect();\r\n    if (!rect) return;\r\n    const h = Math.min(360, Math.max(0, ((event.clientX - rect.left) / rect.width) * 360));\r\n    this.setHsv({ h });\r\n  }\r\n\r\n  protected onHexInput(raw: string): void {\r\n    this.hexDraft.set(raw);\r\n    const rgb = hexToRgb(raw);\r\n    if (rgb) {\r\n      const hex = rgbToHex(rgb);\r\n      this.value.set(hex);\r\n      this.onChange(hex);\r\n    }\r\n  }\r\n\r\n  protected selectPaletteColor(hex: string): void {\r\n    this.value.set(hex);\r\n    this.hexDraft.set(hex);\r\n    this.onChange(hex);\r\n  }\r\n\r\n  protected async pickWithEyeDropper(): Promise<void> {\r\n    if (!window.EyeDropper) return;\r\n    try {\r\n      const result = await new window.EyeDropper().open();\r\n      this.value.set(result.sRGBHex);\r\n      this.hexDraft.set(result.sRGBHex);\r\n      this.onChange(result.sRGBHex);\r\n    } catch {\r\n      // Kullanıcı Escape ile iptal etti — sessizce yut, gerçek bir hata değil.\r\n    }\r\n  }\r\n\r\n  protected readonly classes = computed(() =>\r\n    cn(\r\n      'flex aspect-square h-control-md shrink-0 items-center justify-center rounded-md border border-border shadow-control transition-colors duration-fast ease-emphasis ' +\r\n        'hover:border-border-strong ' +\r\n        focusRecipe +\r\n        ' ' +\r\n        (this.disabled() ? 'pointer-events-none cursor-not-allowed opacity-50' : 'cursor-pointer'),\r\n    ),\r\n  );\r\n}\r\n","<button\r\n  type=\"button\"\r\n  cdkOverlayOrigin\r\n  #origin=\"cdkOverlayOrigin\"\r\n  [class]=\"classes()\"\r\n  [style.background]=\"disabled() ? null : value()\"\r\n  [disabled]=\"disabled()\"\r\n  [attr.aria-label]=\"effectiveAriaLabel()\"\r\n  [attr.aria-expanded]=\"open()\"\r\n  (click)=\"toggle()\"\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=\"lg\"\r\n  panelClass=\"w-56\"\r\n  (closed)=\"close()\"\r\n>\r\n  <div\r\n    #area\r\n    class=\"relative h-32 w-full cursor-crosshair touch-none rounded-md\"\r\n    [style.background]=\"areaBackground()\"\r\n    (pointerdown)=\"onAreaPointerDown($event)\"\r\n    (pointermove)=\"onAreaPointerMove($event)\"\r\n  >\r\n    <div\r\n      class=\"pointer-events-none absolute h-3 w-3 -translate-x-1/2 -translate-y-1/2 rounded-full border-2 border-surface shadow-control\"\r\n      [style.left.%]=\"hsv().s\"\r\n      [style.top.%]=\"100 - hsv().v\"\r\n    ></div>\r\n  </div>\r\n\r\n  <div\r\n    #hueTrack\r\n    class=\"relative mt-3 h-3 w-full touch-none rounded-full\"\r\n    style=\"background: linear-gradient(to right, #f00, #ff0, #0f0, #0ff, #00f, #f0f, #f00)\"\r\n    (pointerdown)=\"onHuePointerDown($event)\"\r\n    (pointermove)=\"onHuePointerMove($event)\"\r\n  >\r\n    <div\r\n      class=\"pointer-events-none absolute top-1/2 h-4 w-4 -translate-x-1/2 -translate-y-1/2 rounded-full border-2 border-surface bg-surface shadow-control\"\r\n      [style.left.%]=\"(hsv().h / 360) * 100\"\r\n    ></div>\r\n  </div>\r\n\r\n  <div class=\"mt-3 flex items-center gap-2\">\r\n    <input\r\n      type=\"text\"\r\n      class=\"min-h-8 w-full rounded-md border border-border bg-surface px-2 py-1 text-sm text-fg shadow-control focus:border-accent focus-visible:outline focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-focus-ring\"\r\n      [value]=\"hexDraft()\"\r\n      (input)=\"onHexInput($any($event.target).value)\"\r\n      [attr.aria-label]=\"colorPickerLabels().hexAriaLabel\"\r\n    />\r\n    @if (supportsEyeDropper) {\r\n      <button\r\n        type=\"button\"\r\n        class=\"flex h-8 w-8 shrink-0 items-center justify-center rounded-md border border-border text-fg-subtle transition-colors duration-fast ease-emphasis hover:bg-state-hover hover:text-fg\"\r\n        (click)=\"pickWithEyeDropper()\"\r\n        [attr.aria-label]=\"colorPickerLabels().pickFromScreenAriaLabel\"\r\n      >\r\n        <span mfIcon [size]=\"16\">colorize</span>\r\n      </button>\r\n    }\r\n  </div>\r\n\r\n  @if (palette().length > 0) {\r\n    <div class=\"mt-3 flex flex-wrap gap-1.5\">\r\n      @for (color of palette(); track color) {\r\n        <button\r\n          type=\"button\"\r\n          class=\"h-6 w-6 rounded-sm border border-border transition-transform duration-fast hover:scale-110 focus-visible:outline focus-visible:outline-2 focus-visible:outline-offset-1 focus-visible:outline-focus-ring\"\r\n          [style.background]=\"color\"\r\n          [attr.aria-label]=\"color\"\r\n          (click)=\"selectPaletteColor(color)\"\r\n        ></button>\r\n      }\r\n    </div>\r\n  }\r\n</mf-popover>\r\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":[],"mappings":"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"}