@mesgflow/ui-kit 0.9.0 → 0.11.0

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

@@ -1 +1 @@
-{"version":3,"file":"mesgflow-ui-kit-menu.mjs","sources":["../../../projects/ui-kit/menu/menu.ts","../../../projects/ui-kit/menu/menu.variants.ts","../../../projects/ui-kit/menu/menu-item.ts","../../../projects/ui-kit/menu/menu-trigger.ts","../../../projects/ui-kit/menu/menubar.ts","../../../projects/ui-kit/menu/mesgflow-ui-kit-menu.ts"],"sourcesContent":["import { Menu as AriaMenu } from '@angular/aria/menu';\r\nimport { Component } from '@angular/core';\r\n\r\n/**\r\n * `<mf-menu #menu=\"ngMenu\" (itemSelected)=\"onSelect($event)\"><button mfMenuItem value=\"a\">A</button></mf-menu>`\r\n * — genelde bir `mf-popover` içine konur, tetikleyici için `mfMenuTrigger`\r\n * kullanılır (bkz. `menu-trigger.ts`). ARIA/klavye (ok tuşu navigasyonu,\r\n * typeahead, alt-menü açma) `@angular/aria/menu`'nün `Menu` pattern'inden\r\n * `hostDirectives` ile geliyor — `Select`'in listbox'ıyla AYNI görsel dil\r\n * (rounded-lg, shadow-2, bg-overlay).\r\n *\r\n * `hostDirectives` uygulanan bir directive'in KENDİ `exportAs`'ı (`ngMenu`)\r\n * host elemanda hâlâ kullanılabilir (Angular directive composition API'sinin\r\n * dokümante edilmiş davranışı) — bu yüzden `MenuTrigger`'ın `[menu]`\r\n * girdisine doğrudan `#menu=\"ngMenu\"` verilebiliyor, ayrı bir forward'a\r\n * gerek yok.\r\n */\r\n@Component({\r\n  selector: 'mf-menu',\r\n  exportAs: 'mfMenu',\r\n  hostDirectives: [\r\n    {\r\n      directive: AriaMenu,\r\n      inputs: ['wrap', 'disabled', 'typeaheadDelay'],\r\n      outputs: ['itemSelected'],\r\n    },\r\n  ],\r\n  host: {\r\n    class:\r\n      'block max-h-64 min-w-[10rem] overflow-auto rounded-lg border border-hairline bg-overlay p-1 text-sm shadow-2',\r\n  },\r\n  template: '<ng-content />',\r\n})\r\nexport class Menu {}\r\n","import { cva, type VariantProps } from 'class-variance-authority';\r\n\r\nexport const menuItemVariants = cva(\r\n  'flex cursor-pointer items-center gap-2 rounded-sm px-2.5 py-1.5 text-fg-muted transition-colors duration-fast ease-emphasis active:scale-[0.99]',\r\n  {\r\n    variants: {\r\n      active: {\r\n        true: 'bg-state-hover text-fg',\r\n        false: '',\r\n      },\r\n      disabled: {\r\n        true: 'pointer-events-none opacity-50 active:scale-100',\r\n        false: '',\r\n      },\r\n    },\r\n    defaultVariants: { active: false, disabled: false },\r\n  },\r\n);\r\n\r\nexport type MenuItemActive = VariantProps<typeof menuItemVariants>['active'];\r\n","import { MenuItem as AriaMenuItem } from '@angular/aria/menu';\r\nimport { Directive, computed, inject } from '@angular/core';\r\nimport { cn } from '@mesgflow/ui-kit/core';\r\nimport { menuItemVariants } from './menu.variants';\r\n\r\n/** `<button mfMenuItem value=\"delete\">Sil</button>` — `mf-menu` içine konur. */\r\n@Directive({\r\n  selector: 'button[mfMenuItem], div[mfMenuItem]',\r\n  hostDirectives: [{ directive: AriaMenuItem, inputs: ['value', 'disabled', 'id'] }],\r\n  host: { '[class]': 'classes()' },\r\n})\r\nexport class MenuItem<V> {\r\n  private readonly ariaMenuItem = inject<AriaMenuItem<V>>(AriaMenuItem);\r\n\r\n  protected readonly classes = computed(() =>\r\n    cn(\r\n      menuItemVariants({\r\n        active: this.ariaMenuItem.active(),\r\n        disabled: this.ariaMenuItem.disabled(),\r\n      }),\r\n    ),\r\n  );\r\n}\r\n","import { MenuTrigger as AriaMenuTrigger } from '@angular/aria/menu';\r\nimport { Directive } from '@angular/core';\r\n\r\n/**\r\n * `<button mfMenuTrigger [menu]=\"menuRef\" cdkOverlayOrigin #origin=\"cdkOverlayOrigin\">Aç</button>`\r\n * — `[menu]`'ye `mf-menu`'nün `#ref=\"ngMenu\"` template referansını ver.\r\n * Pozisyonlama (floating panel) bu directive'in İŞİ DEĞİL — `@angular/aria/menu`\r\n * headless, konum bilgisi taşımıyor; `mf-popover`'ın `[open]=\"trigger.expanded()\"`\r\n * ile beslenmesi gerekiyor (bkz. playground'daki Menu demosu, `(closed)`\r\n * çıktısında `trigger.close()` çağırarak iki state'i senkron tutma deseni).\r\n */\r\n@Directive({\r\n  selector: '[mfMenuTrigger]',\r\n  exportAs: 'mfMenuTrigger',\r\n  hostDirectives: [{ directive: AriaMenuTrigger, inputs: ['menu', 'disabled'] }],\r\n})\r\nexport class MenuTrigger {}\r\n","import { OverlayModule } from '@angular/cdk/overlay';\r\nimport {\r\n  Menu as AriaMenu,\r\n  MenuBar as AriaMenuBar,\r\n  MenuContent,\r\n  MenuItem as AriaMenuItem,\r\n} from '@angular/aria/menu';\r\nimport { Component, input, output, signal, viewChildren } from '@angular/core';\r\nimport { overlayPositions } from '@mesgflow/ui-kit/core';\r\nimport { Icon } from '@mesgflow/ui-kit/icon';\r\nimport { Kbd } from '@mesgflow/ui-kit/kbd';\r\n\r\nexport interface MenubarAction<V = string> {\r\n  label: string;\r\n  value: V;\r\n  icon?: string;\r\n  /** Görsel kısayol ipucu (ör. `Ctrl+S`) — kısayolu KAYDETMEZ, yalnızca gösterir. */\r\n  shortcut?: string;\r\n  disabled?: boolean;\r\n  danger?: boolean;\r\n  /** Bu öğeden SONRA ayırıcı çizgi. */\r\n  separatorAfter?: boolean;\r\n}\r\n\r\nexport interface MenubarMenu<V = string> {\r\n  label: string;\r\n  items: MenubarAction<V>[];\r\n}\r\n\r\n/**\r\n * `<mf-menubar [menus]=\"menus\" (itemSelect)=\"run($event)\" ariaLabel=\"Editör\" />`\r\n *\r\n * Masaüstü uygulama tarzı kalıcı menü çubuğu (Dosya · Düzen · Görünüm) —\r\n * WAI-ARIA APG \"Menubar\": `@angular/aria/menu`'nün `ngMenuBar`/`ngMenu`\r\n * desenleri. Klavye: ←/→ üst menüler arası (açık menü eşlik eder), ↓/Enter\r\n * açar, ↑/↓ öğeler, typeahead, Escape kapatır ve odağı çubuğa döndürür.\r\n *\r\n * Alt menüler CDK bağlı overlay'lerinde; çubuğa ilk odak/hover'da bir kez\r\n * render edilir (`rendered`), görünürlüğü `ngMenu`'nün `data-visible`'ı yönetir.\r\n */\r\n@Component({\r\n  selector: 'mf-menubar',\r\n  exportAs: 'mfMenubar',\r\n  imports: [OverlayModule, AriaMenuBar, AriaMenu, AriaMenuItem, MenuContent, Icon, Kbd],\r\n  host: { class: 'block' },\r\n  template: `\r\n    <div\r\n      ngMenuBar\r\n      [attr.aria-label]=\"ariaLabel() || null\"\r\n      class=\"flex items-center gap-0.5 rounded-lg border border-hairline bg-surface p-1 shadow-control\"\r\n      (focusin)=\"rendered.set(true)\"\r\n      (pointerenter)=\"rendered.set(true)\"\r\n      (itemSelected)=\"itemSelect.emit($any($event))\"\r\n    >\r\n      @for (menu of menus(); track menu.label; let i = $index) {\r\n        <div\r\n          ngMenuItem\r\n          #origin\r\n          #top=\"ngMenuItem\"\r\n          [value]=\"menu.label\"\r\n          [submenu]=\"$any(submenus()[i])\"\r\n          class=\"cursor-default rounded-md px-3 py-1 text-sm font-medium text-fg-muted outline-none select-none transition-colors duration-fast ease-emphasis hover:bg-state-hover hover:text-fg data-[active=true]:bg-state-hover data-[active=true]:text-fg aria-expanded:bg-state-selected aria-expanded:text-fg focus-visible:outline-2 focus-visible:-outline-offset-2 focus-visible:outline-focus-ring\"\r\n        >\r\n          {{ menu.label }}\r\n        </div>\r\n\r\n        <ng-template\r\n          [cdkConnectedOverlayOpen]=\"rendered()\"\r\n          [cdkConnectedOverlay]=\"{ origin: origin, usePopover: 'inline' }\"\r\n          [cdkConnectedOverlayPositions]=\"positions\"\r\n          [cdkConnectedOverlayDisableClose]=\"true\"\r\n          cdkAttachPopoverAsChild\r\n        >\r\n          <div\r\n            ngMenu\r\n            class=\"min-w-[13rem] rounded-lg border border-hairline bg-overlay p-1 text-sm shadow-2 data-[visible=false]:hidden data-[visible=true]:animate-overlay-in\"\r\n          >\r\n            <ng-template ngMenuContent>\r\n              @for (action of menu.items; track action.value) {\r\n                <div\r\n                  ngMenuItem\r\n                  [value]=\"action.value\"\r\n                  [disabled]=\"!!action.disabled\"\r\n                  class=\"flex cursor-default items-center gap-2 rounded-sm px-2.5 py-1.5 text-fg-muted outline-none select-none data-[active=true]:bg-state-hover data-[active=true]:text-fg aria-disabled:pointer-events-none aria-disabled:opacity-50\"\r\n                  [class.text-danger]=\"action.danger\"\r\n                >\r\n                  <span\r\n                    mfIcon\r\n                    [size]=\"16\"\r\n                    class=\"text-fg-subtle\"\r\n                    [class.invisible]=\"!action.icon\"\r\n                    >{{ action.icon || 'circle' }}</span\r\n                  >\r\n                  <span class=\"flex-1\">{{ action.label }}</span>\r\n                  @if (action.shortcut) {\r\n                    <kbd mfKbd class=\"ms-6\">{{ action.shortcut }}</kbd>\r\n                  }\r\n                </div>\r\n                @if (action.separatorAfter) {\r\n                  <div role=\"separator\" class=\"mx-1 my-1 h-px bg-hairline\"></div>\r\n                }\r\n              }\r\n            </ng-template>\r\n          </div>\r\n        </ng-template>\r\n      }\r\n    </div>\r\n  `,\r\n})\r\nexport class Menubar<V = string> {\r\n  readonly menus = input.required<MenubarMenu<V>[]>();\r\n  readonly ariaLabel = input('');\r\n  readonly itemSelect = output<V>();\r\n\r\n  protected readonly rendered = signal(false);\r\n  protected readonly submenus = viewChildren(AriaMenu<V>);\r\n  protected readonly positions = overlayPositions('bottom-start', 4);\r\n}\r\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":["AriaMenu","AriaMenuItem","AriaMenuTrigger","i1","AriaMenuBar"],"mappings":"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"}
+{"version":3,"file":"mesgflow-ui-kit-menu.mjs","sources":["../../../projects/ui-kit/menu/menu.ts","../../../projects/ui-kit/menu/menu.variants.ts","../../../projects/ui-kit/menu/menu-item.ts","../../../projects/ui-kit/menu/menu-trigger.ts","../../../projects/ui-kit/menu/menubar.ts","../../../projects/ui-kit/menu/mesgflow-ui-kit-menu.ts"],"sourcesContent":["import { Menu as AriaMenu } from '@angular/aria/menu';\r\nimport { Component } from '@angular/core';\r\n\r\n/**\r\n * `<mf-menu #menu=\"ngMenu\" (itemSelected)=\"onSelect($event)\"><button mfMenuItem value=\"a\">A</button></mf-menu>`\r\n * — genelde bir `mf-popover` içine konur, tetikleyici için `mfMenuTrigger`\r\n * kullanılır (bkz. `menu-trigger.ts`). ARIA/klavye (ok tuşu navigasyonu,\r\n * typeahead, alt-menü açma) `@angular/aria/menu`'nün `Menu` pattern'inden\r\n * `hostDirectives` ile geliyor — `Select`'in listbox'ıyla AYNI görsel dil\r\n * (rounded-lg, shadow-2, bg-overlay).\r\n *\r\n * `hostDirectives` uygulanan bir directive'in KENDİ `exportAs`'ı (`ngMenu`)\r\n * host elemanda hâlâ kullanılabilir (Angular directive composition API'sinin\r\n * dokümante edilmiş davranışı) — bu yüzden `MenuTrigger`'ın `[menu]`\r\n * girdisine doğrudan `#menu=\"ngMenu\"` verilebiliyor, ayrı bir forward'a\r\n * gerek yok.\r\n */\r\n@Component({\r\n  selector: 'mf-menu',\r\n  exportAs: 'mfMenu',\r\n  hostDirectives: [\r\n    {\r\n      directive: AriaMenu,\r\n      inputs: ['wrap', 'disabled', 'typeaheadDelay'],\r\n      outputs: ['itemSelected'],\r\n    },\r\n  ],\r\n  host: {\r\n    class:\r\n      'block max-h-64 min-w-[10rem] overflow-auto rounded-lg border border-hairline bg-overlay p-1 text-sm shadow-2',\r\n  },\r\n  template: '<ng-content />',\r\n})\r\nexport class Menu {}\r\n","import { cva, type VariantProps } from 'class-variance-authority';\r\n\r\nexport const menuItemVariants = cva(\r\n  'flex w-full cursor-pointer items-center gap-2 rounded-sm px-2.5 text-start py-1.5 transition-colors duration-fast ease-emphasis active:scale-[0.99]',\r\n  {\r\n    variants: {\r\n      /** `danger`: tehlikeli eylem (\"Çıkış yap\", \"Üyeyi çıkar\") — ikon slotu `currentColor` ile aynı rengi miras alır. */\r\n      tone: {\r\n        neutral: 'text-fg-muted',\r\n        danger: 'text-danger',\r\n      },\r\n      active: {\r\n        true: '',\r\n        false: '',\r\n      },\r\n      disabled: {\r\n        true: 'pointer-events-none opacity-50 active:scale-100',\r\n        false: '',\r\n      },\r\n    },\r\n    compoundVariants: [\r\n      { tone: 'neutral', active: true, class: 'bg-state-hover text-fg' },\r\n      { tone: 'danger', active: true, class: 'bg-danger-tint text-danger-tint-fg' },\r\n    ],\r\n    defaultVariants: { tone: 'neutral', active: false, disabled: false },\r\n  },\r\n);\r\n\r\nexport type MenuItemActive = VariantProps<typeof menuItemVariants>['active'];\r\nexport type MenuItemTone = NonNullable<VariantProps<typeof menuItemVariants>['tone']>;\r\n","import { MenuItem as AriaMenuItem } from '@angular/aria/menu';\r\nimport { Component, computed, inject, input } from '@angular/core';\r\nimport { cn } from '@mesgflow/ui-kit/core';\r\nimport { Icon } from '@mesgflow/ui-kit/icon';\r\nimport { menuItemVariants, type MenuItemTone } from './menu.variants';\r\n\r\n/**\r\n * `<button mfMenuItem value=\"delete\">Sil</button>` — `mf-menu` içine konur.\r\n *\r\n * `checked` verilirse (true/false) öğe tek-seçimli bir grubun parçası olur:\r\n * `role=\"menuitemradio\"` + `aria-checked`, seçili öğenin sağında tik. Verilmezse\r\n * (`undefined`) düz `menuitem` — eski davranış birebir.\r\n *\r\n * `tone=\"danger\"` tehlikeli eylemi (\"Çıkış yap\", \"Üyeyi çıkar\") ayrıştırır: metin\r\n * `text-danger`, etkin/hover `bg-danger-tint text-danger-tint-fg`; ikon slotu aynı\r\n * rengi (`currentColor`) miras alır. Yalnızca görsel — ARIA rolü değişmez.\r\n */\r\n@Component({\r\n  // eslint-disable-next-line @angular-eslint/component-selector -- BİLEREK native eleman + attribute (tik ikonu için şablon gerekiyor)\r\n  selector: 'button[mfMenuItem], div[mfMenuItem]',\r\n  imports: [Icon],\r\n  hostDirectives: [{ directive: AriaMenuItem, inputs: ['value', 'disabled', 'id'] }],\r\n  host: {\r\n    '[class]': 'classes()',\r\n    '[attr.role]': 'checked() === undefined ? ariaMenuItem.role() : \"menuitemradio\"',\r\n    '[attr.aria-checked]': 'checked() ?? null',\r\n  },\r\n  template: `\r\n    <ng-content />\r\n    @if (checked() !== undefined) {\r\n      <span mfIcon [size]=\"16\" class=\"ms-auto shrink-0 text-accent\" [class.invisible]=\"!checked()\"\r\n        >check</span\r\n      >\r\n    }\r\n  `,\r\n})\r\nexport class MenuItem<V> {\r\n  readonly checked = input<boolean | undefined>(undefined);\r\n  readonly tone = input<MenuItemTone>('neutral');\r\n\r\n  protected readonly ariaMenuItem = inject<AriaMenuItem<V>>(AriaMenuItem);\r\n\r\n  protected readonly classes = computed(() =>\r\n    cn(\r\n      menuItemVariants({\r\n        tone: this.tone(),\r\n        active: this.ariaMenuItem.active(),\r\n        disabled: this.ariaMenuItem.disabled(),\r\n      }),\r\n    ),\r\n  );\r\n}\r\n","import { CdkOverlayOrigin, Overlay, type OverlayRef } from '@angular/cdk/overlay';\r\nimport { DomPortal } from '@angular/cdk/portal';\r\nimport { Menu as AriaMenu, MenuTrigger as AriaMenuTrigger } from '@angular/aria/menu';\r\nimport {\r\n  DestroyRef,\r\n  Directive,\r\n  ElementRef,\r\n  effect,\r\n  inject,\r\n  input,\r\n  untracked,\r\n  type OutputRefSubscription,\r\n} from '@angular/core';\r\nimport { exitDurationMs, overlayPositions, type MfPlacement } from '@mesgflow/ui-kit/core';\r\n\r\n/**\r\n * `<button mfMenuTrigger [menu]=\"menuRef\" cdkOverlayOrigin #origin=\"cdkOverlayOrigin\">Aç</button>`\r\n * — `[menu]`'ye `mf-menu`'nün `#ref=\"ngMenu\"` template referansını ver.\r\n * Pozisyonlama (floating panel) bu directive'in İŞİ DEĞİL — `@angular/aria/menu`\r\n * headless, konum bilgisi taşımıyor; `mf-popover`'ın `[open]=\"trigger.expanded()\"`\r\n * ile beslenmesi gerekiyor (bkz. playground'daki Menu demosu, `(closed)`\r\n * çıktısında `trigger.close()` çağırarak iki state'i senkron tutma deseni).\r\n *\r\n * Konumlandırmayı kendisi yapan (ve `@angular/cdk` import'u gerektirmeyen) biçim\r\n * için bkz. `MenuTriggerFor` — `[mfMenuTrigger]=\"menuRef\"`. İkisinin seçicisi\r\n * `[menu]` bağlamasının varlığıyla ayrışır, aynı elemanda asla ikisi birden eşleşmez.\r\n */\r\n@Directive({\r\n  selector: '[mfMenuTrigger][menu]',\r\n  exportAs: 'mfMenuTrigger',\r\n  hostDirectives: [{ directive: AriaMenuTrigger, inputs: ['menu', 'disabled'] }],\r\n})\r\nexport class MenuTrigger {}\r\n\r\n/**\r\n * `<button mfButton [mfMenuTrigger]=\"langMenu\">TR</button>\r\n *  <mf-menu #langMenu=\"ngMenu\" (itemSelected)=\"setLang($event)\">…</mf-menu>`\r\n *\r\n * Tek düğmeli açılır menü — tüketici `@angular/cdk` import etmez, `mf-popover`\r\n * sarmalamaz. Menü şablonda NORMAL yerinde durur (kapalıyken gizli), açılınca\r\n * `DomPortal` ile overlay'e TAŞINIR ve tetiğe göre `placement`'a konumlanır;\r\n * kapanınca çıkış animasyonundan sonra eski yerine döner — Angular'ın mantıksal\r\n * ağacı (içerik projeksiyonu, `mfMenuItem` ↔ `mf-menu` DI bağı) hiç değişmez.\r\n *\r\n * `[mfMenuTrigger]`'a `mf-menu`'nün `ngMenu` referansı verilir (`mfMenu` DEĞİL —\r\n * `@angular/aria`'nın tetikleyicisi kendi `Menu` örneğini ister). ARIA/klavye\r\n * (`aria-haspopup`/`aria-expanded`, ok tuşları, typeahead, Enter/Boşluk seçer, Esc\r\n * kapatıp odağı tetiğe döndürür) `@angular/aria/menu`'den; bu directive üstüne:\r\n * seçimde kapanıp odağı tetiğe döndürme, dışarı tıklamada kapanma.\r\n *\r\n * Tetik aynı zamanda bir `CdkOverlayOrigin` (host directive) — ayrıca\r\n * `cdkOverlayOrigin` yazılmaz.\r\n */\r\n@Directive({\r\n  selector: '[mfMenuTrigger]:not([menu])',\r\n  exportAs: 'mfMenuTrigger',\r\n  hostDirectives: [\r\n    { directive: AriaMenuTrigger, inputs: ['menu: mfMenuTrigger', 'disabled'] },\r\n    CdkOverlayOrigin,\r\n  ],\r\n  // aria `\"true\"` yazar (ARIA'da `menu` ile eşdeğer) — açık değer ekran okuyucularda daha tutarlı.\r\n  host: { '[attr.aria-haspopup]': '\"menu\"' },\r\n})\r\nexport class MenuTriggerFor {\r\n  /** Menünün tetiğe göre konumu — `left`/`right` mantıksal (RTL'de çevrilir). */\r\n  readonly placement = input<MfPlacement>('bottom-end');\r\n\r\n  private readonly aria = inject(AriaMenuTrigger);\r\n  private readonly overlay = inject(Overlay);\r\n  private readonly host = inject<ElementRef<HTMLElement>>(ElementRef);\r\n  private overlayRef?: OverlayRef;\r\n  private exitTimer?: ReturnType<typeof setTimeout>;\r\n  /** Kapalıyken gizlenen (ve açıkken overlay'e taşınan) menü elemanı. */\r\n  private hiddenMenu?: HTMLElement;\r\n  private selection?: OutputRefSubscription;\r\n\r\n  constructor() {\r\n    // Menü bağlanınca: kapalıyken yerinde gizle, seçimde kapan.\r\n    effect((onCleanup) => {\r\n      const menu = this.aria.menu() as AriaMenu<unknown> | undefined;\r\n      if (!menu) return;\r\n      untracked(() => this.bindMenu(menu));\r\n      onCleanup(() => this.unbindMenu());\r\n    });\r\n\r\n    effect(() => {\r\n      const expanded = this.aria.expanded();\r\n      const menu = this.aria.menu() as AriaMenu<unknown> | undefined;\r\n      untracked(() => (expanded && menu ? this.attach(menu.element) : this.detach()));\r\n    });\r\n\r\n    inject(DestroyRef).onDestroy(() => {\r\n      clearTimeout(this.exitTimer);\r\n      this.overlayRef?.dispose();\r\n      this.unbindMenu();\r\n    });\r\n  }\r\n\r\n  /** Public — menüyü kapatır, odak yerinde kalır (aria `close()` ile aynı). */\r\n  close(): void {\r\n    this.aria.close();\r\n  }\r\n\r\n  /** Public — menüyü açar ve ilk öğeye odaklanır. */\r\n  open(): void {\r\n    this.aria.open();\r\n  }\r\n\r\n  private bindMenu(menu: AriaMenu<unknown>): void {\r\n    this.hiddenMenu = menu.element;\r\n    if (!this.overlayRef?.hasAttached()) this.hiddenMenu.style.display = 'none';\r\n    this.selection = menu.itemSelected.subscribe(() => {\r\n      this.aria.close();\r\n      this.host.nativeElement.focus();\r\n    });\r\n  }\r\n\r\n  private unbindMenu(): void {\r\n    this.selection?.unsubscribe();\r\n    this.selection = undefined;\r\n    if (this.hiddenMenu) this.hiddenMenu.style.display = '';\r\n    this.hiddenMenu = undefined;\r\n  }\r\n\r\n  private attach(menuEl: HTMLElement): void {\r\n    clearTimeout(this.exitTimer);\r\n    const ref = this.ensureOverlay();\r\n    ref.updatePositionStrategy(this.positionStrategy());\r\n    const panel = ref.overlayElement;\r\n    panel.classList.remove('animate-overlay-out');\r\n    panel.classList.add('animate-overlay-in');\r\n    if (ref.hasAttached()) return;\r\n\r\n    menuEl.style.display = '';\r\n    ref.attach(new DomPortal(menuEl));\r\n  }\r\n\r\n  private detach(): void {\r\n    const ref = this.overlayRef;\r\n    if (!ref?.hasAttached()) return;\r\n\r\n    const finish = () => {\r\n      // `detach()` DomPortal'ı ESKİ yerine geri koyar — orada yine gizli durmalı.\r\n      ref.detach();\r\n      if (this.hiddenMenu) this.hiddenMenu.style.display = 'none';\r\n    };\r\n    const exitMs = exitDurationMs();\r\n    if (exitMs === 0) {\r\n      finish();\r\n      return;\r\n    }\r\n    ref.overlayElement.classList.remove('animate-overlay-in');\r\n    ref.overlayElement.classList.add('animate-overlay-out');\r\n    clearTimeout(this.exitTimer);\r\n    this.exitTimer = setTimeout(finish, exitMs);\r\n  }\r\n\r\n  private ensureOverlay(): OverlayRef {\r\n    if (this.overlayRef) return this.overlayRef;\r\n    const ref = this.overlay.create({\r\n      positionStrategy: this.positionStrategy(),\r\n      scrollStrategy: this.overlay.scrollStrategies.reposition(),\r\n    });\r\n    // Dışarı tıklama kapatır — tetiğin kendisi hariç (onun tıklaması aria'da zaten aç/kapa).\r\n    ref.outsidePointerEvents().subscribe((event) => {\r\n      const target = event.target as Node | null;\r\n      if (target && this.host.nativeElement.contains(target)) return;\r\n      if (this.aria.expanded()) this.aria.close();\r\n    });\r\n    this.overlayRef = ref;\r\n    return ref;\r\n  }\r\n\r\n  private positionStrategy() {\r\n    return this.overlay\r\n      .position()\r\n      .flexibleConnectedTo(this.host)\r\n      .withPositions(overlayPositions(this.placement(), 4))\r\n      .withPush(false);\r\n  }\r\n}\r\n","import { OverlayModule } from '@angular/cdk/overlay';\r\nimport {\r\n  Menu as AriaMenu,\r\n  MenuBar as AriaMenuBar,\r\n  MenuContent,\r\n  MenuItem as AriaMenuItem,\r\n} from '@angular/aria/menu';\r\nimport { Component, input, output, signal, viewChildren } from '@angular/core';\r\nimport { overlayPositions } from '@mesgflow/ui-kit/core';\r\nimport { Icon } from '@mesgflow/ui-kit/icon';\r\nimport { Kbd } from '@mesgflow/ui-kit/kbd';\r\n\r\nexport interface MenubarAction<V = string> {\r\n  label: string;\r\n  value: V;\r\n  icon?: string;\r\n  /** Görsel kısayol ipucu (ör. `Ctrl+S`) — kısayolu KAYDETMEZ, yalnızca gösterir. */\r\n  shortcut?: string;\r\n  disabled?: boolean;\r\n  danger?: boolean;\r\n  /** Bu öğeden SONRA ayırıcı çizgi. */\r\n  separatorAfter?: boolean;\r\n}\r\n\r\nexport interface MenubarMenu<V = string> {\r\n  label: string;\r\n  items: MenubarAction<V>[];\r\n}\r\n\r\n/**\r\n * `<mf-menubar [menus]=\"menus\" (itemSelect)=\"run($event)\" ariaLabel=\"Editör\" />`\r\n *\r\n * Masaüstü uygulama tarzı kalıcı menü çubuğu (Dosya · Düzen · Görünüm) —\r\n * WAI-ARIA APG \"Menubar\": `@angular/aria/menu`'nün `ngMenuBar`/`ngMenu`\r\n * desenleri. Klavye: ←/→ üst menüler arası (açık menü eşlik eder), ↓/Enter\r\n * açar, ↑/↓ öğeler, typeahead, Escape kapatır ve odağı çubuğa döndürür.\r\n *\r\n * Alt menüler CDK bağlı overlay'lerinde; çubuğa ilk odak/hover'da bir kez\r\n * render edilir (`rendered`), görünürlüğü `ngMenu`'nün `data-visible`'ı yönetir.\r\n */\r\n@Component({\r\n  selector: 'mf-menubar',\r\n  exportAs: 'mfMenubar',\r\n  imports: [OverlayModule, AriaMenuBar, AriaMenu, AriaMenuItem, MenuContent, Icon, Kbd],\r\n  host: { class: 'block' },\r\n  template: `\r\n    <div\r\n      ngMenuBar\r\n      [attr.aria-label]=\"ariaLabel() || null\"\r\n      class=\"flex items-center gap-0.5 rounded-lg border border-hairline bg-surface p-1 shadow-control\"\r\n      (focusin)=\"rendered.set(true)\"\r\n      (pointerenter)=\"rendered.set(true)\"\r\n      (itemSelected)=\"itemSelect.emit($any($event))\"\r\n    >\r\n      @for (menu of menus(); track menu.label; let i = $index) {\r\n        <div\r\n          ngMenuItem\r\n          #origin\r\n          #top=\"ngMenuItem\"\r\n          [value]=\"menu.label\"\r\n          [submenu]=\"$any(submenus()[i])\"\r\n          class=\"cursor-default rounded-md px-3 py-1 text-sm font-medium text-fg-muted outline-none select-none transition-colors duration-fast ease-emphasis hover:bg-state-hover hover:text-fg data-[active=true]:bg-state-hover data-[active=true]:text-fg aria-expanded:bg-state-selected aria-expanded:text-fg focus-visible:outline-2 focus-visible:-outline-offset-2 focus-visible:outline-focus-ring\"\r\n        >\r\n          {{ menu.label }}\r\n        </div>\r\n\r\n        <ng-template\r\n          [cdkConnectedOverlayOpen]=\"rendered()\"\r\n          [cdkConnectedOverlay]=\"{ origin: origin, usePopover: 'inline' }\"\r\n          [cdkConnectedOverlayPositions]=\"positions\"\r\n          [cdkConnectedOverlayDisableClose]=\"true\"\r\n          cdkAttachPopoverAsChild\r\n        >\r\n          <div\r\n            ngMenu\r\n            class=\"min-w-[13rem] rounded-lg border border-hairline bg-overlay p-1 text-sm shadow-2 data-[visible=false]:hidden data-[visible=true]:animate-overlay-in\"\r\n          >\r\n            <ng-template ngMenuContent>\r\n              @for (action of menu.items; track action.value) {\r\n                <div\r\n                  ngMenuItem\r\n                  [value]=\"action.value\"\r\n                  [disabled]=\"!!action.disabled\"\r\n                  class=\"flex cursor-default items-center gap-2 rounded-sm px-2.5 py-1.5 text-fg-muted outline-none select-none data-[active=true]:bg-state-hover data-[active=true]:text-fg aria-disabled:pointer-events-none aria-disabled:opacity-50\"\r\n                  [class.text-danger]=\"action.danger\"\r\n                >\r\n                  <span\r\n                    mfIcon\r\n                    [size]=\"16\"\r\n                    class=\"text-fg-subtle\"\r\n                    [class.invisible]=\"!action.icon\"\r\n                    >{{ action.icon || 'circle' }}</span\r\n                  >\r\n                  <span class=\"flex-1\">{{ action.label }}</span>\r\n                  @if (action.shortcut) {\r\n                    <kbd mfKbd class=\"ms-6\">{{ action.shortcut }}</kbd>\r\n                  }\r\n                </div>\r\n                @if (action.separatorAfter) {\r\n                  <div role=\"separator\" class=\"mx-1 my-1 h-px bg-hairline\"></div>\r\n                }\r\n              }\r\n            </ng-template>\r\n          </div>\r\n        </ng-template>\r\n      }\r\n    </div>\r\n  `,\r\n})\r\nexport class Menubar<V = string> {\r\n  readonly menus = input.required<MenubarMenu<V>[]>();\r\n  readonly ariaLabel = input('');\r\n  readonly itemSelect = output<V>();\r\n\r\n  protected readonly rendered = signal(false);\r\n  protected readonly submenus = viewChildren(AriaMenu<V>);\r\n  protected readonly positions = overlayPositions('bottom-start', 4);\r\n}\r\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":["AriaMenu","AriaMenuItem","AriaMenuTrigger","i1","AriaMenuBar"],"mappings":"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"}

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

@@ -1,7 +1,7 @@
 import * as i1 from '@angular/cdk/overlay';
-import { OverlayModule } from '@angular/cdk/overlay';
+import { OverlayModule, CdkOverlayOrigin } from '@angular/cdk/overlay';
 import * as i0 from '@angular/core';
-import { input, model, output, signal, computed, effect, untracked, Component } from '@angular/core';
+import { input, model, output, signal, computed, ElementRef, effect, untracked, Component, inject, Directive } from '@angular/core';
 import { overlayPositions, cn, exitDurationMs } from '@mesgflow/ui-kit/core';
 import { cva } from 'class-variance-authority';
 
@@ -30,8 +30,9 @@ const popoverPanelVariants = cva('overflow-auto rounded-lg border border-hairlin
  * Popover'ın panel içeriğiyle nasıl kompoze edeceğine karar vermeli, ayrı ve
  * her ekranın tarayıcıda tek tek doğrulanmasını gerektiren bir iş.
  *
- * `origin`, CDK'nın `cdkOverlayOrigin` directive'inin `exportAs` referansı —
- * ayrı bir wrapper directive'e gerek yok, CDK zaten sağlıyor.
+ * `origin`: kitin `mfPopoverOrigin` referansı (tüketici `@angular/cdk` import
+ * etmez), geriye uyumlu olarak `cdkOverlayOrigin` ya da düz bir eleman — bkz.
+ * `PopoverOriginRef`.
  */
 class Popover {
     origin = input.required(/* @ts-ignore */
@@ -67,6 +68,16 @@ class Popover {
     closing = signal(false, /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "closing" }] : /* istanbul ignore next */ []));
     exitTimer;
+    /** CDK'ya verilen çapa — `cdkConnectedOverlayOrigin` bir `ElementRef`'i doğrudan kabul eder. */
+    anchor = computed(() => {
+        const origin = this.origin();
+        return origin instanceof ElementRef
+            ? origin
+            : origin instanceof HTMLElement
+                ? new ElementRef(origin)
+                : origin.elementRef;
+    }, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "anchor" }] : /* istanbul ignore next */ []));
     positions = computed(() => {
         const placement = this.placement();
         return overlayPositions(placement, placement === 'right-start' ? 8 : 4);
@@ -107,14 +118,12 @@ class Popover {
     static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "22.1.7", type: Popover, isStandalone: true, selector: "mf-popover", inputs: { origin: { classPropertyName: "origin", publicName: "origin", isSignal: true, isRequired: true, transformFunction: null }, open: { classPropertyName: "open", publicName: "open", isSignal: true, isRequired: false, transformFunction: null }, placement: { classPropertyName: "placement", publicName: "placement", isSignal: true, isRequired: false, transformFunction: null }, padding: { classPropertyName: "padding", publicName: "padding", isSignal: true, isRequired: false, transformFunction: null }, hasBackdrop: { classPropertyName: "hasBackdrop", publicName: "hasBackdrop", isSignal: true, isRequired: false, transformFunction: null }, matchTriggerWidth: { classPropertyName: "matchTriggerWidth", publicName: "matchTriggerWidth", isSignal: true, isRequired: false, transformFunction: null }, panelClass: { classPropertyName: "panelClass", publicName: "panelClass", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { open: "openChange", closed: "closed" }, host: { classAttribute: "contents" }, exportAs: ["mfPopover"], ngImport: i0, template: `
     <ng-template
       cdkConnectedOverlay
-      [cdkConnectedOverlayOrigin]="origin()"
+      [cdkConnectedOverlayOrigin]="anchor()"
       [cdkConnectedOverlayOpen]="attached()"
       [cdkConnectedOverlayPositions]="positions()"
       [cdkConnectedOverlayHasBackdrop]="hasBackdrop()"
       cdkConnectedOverlayBackdropClass="cdk-overlay-transparent-backdrop"
-      [cdkConnectedOverlayMinWidth]="
-        matchTriggerWidth() ? origin().elementRef.nativeElement.offsetWidth : null
-      "
+      [cdkConnectedOverlayMinWidth]="matchTriggerWidth() ? anchor().nativeElement.offsetWidth : 0"
       (backdropClick)="close()"
       (detach)="close()"
     >
@@ -140,14 +149,12 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.7", ngImpor
                     template: `
     <ng-template
       cdkConnectedOverlay
-      [cdkConnectedOverlayOrigin]="origin()"
+      [cdkConnectedOverlayOrigin]="anchor()"
       [cdkConnectedOverlayOpen]="attached()"
       [cdkConnectedOverlayPositions]="positions()"
       [cdkConnectedOverlayHasBackdrop]="hasBackdrop()"
       cdkConnectedOverlayBackdropClass="cdk-overlay-transparent-backdrop"
-      [cdkConnectedOverlayMinWidth]="
-        matchTriggerWidth() ? origin().elementRef.nativeElement.offsetWidth : null
-      "
+      [cdkConnectedOverlayMinWidth]="matchTriggerWidth() ? anchor().nativeElement.offsetWidth : 0"
       (backdropClick)="close()"
       (detach)="close()"
     >
@@ -165,9 +172,32 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.7", ngImpor
                 }]
         }], ctorParameters: () => [], propDecorators: { origin: [{ type: i0.Input, args: [{ isSignal: true, alias: "origin", required: true }] }], open: [{ type: i0.Input, args: [{ isSignal: true, alias: "open", required: false }] }, { type: i0.Output, args: ["openChange"] }], placement: [{ type: i0.Input, args: [{ isSignal: true, alias: "placement", required: false }] }], padding: [{ type: i0.Input, args: [{ isSignal: true, alias: "padding", required: false }] }], hasBackdrop: [{ type: i0.Input, args: [{ isSignal: true, alias: "hasBackdrop", required: false }] }], matchTriggerWidth: [{ type: i0.Input, args: [{ isSignal: true, alias: "matchTriggerWidth", required: false }] }], panelClass: [{ type: i0.Input, args: [{ isSignal: true, alias: "panelClass", required: false }] }], closed: [{ type: i0.Output, args: ["closed"] }] } });
 
+/**
+ * `<button #trigger="mfPopoverOrigin" mfPopoverOrigin (click)="open.set(true)">…</button>
+ *  <mf-popover [origin]="trigger" [(open)]="open">…</mf-popover>`
+ *
+ * `mf-popover`'ın `[origin]`'i için kitin kendi çapası — tüketici `@angular/cdk`
+ * import etmeden `cdkOverlayOrigin` ile aynı işi görür (host directive olarak onu
+ * taşır). `[origin]` ayrıca bir `HTMLElement`/`ElementRef` (`#ref` şablon
+ * referansı) de kabul eder.
+ */
+class PopoverOrigin {
+    elementRef = inject(ElementRef);
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.7", ngImport: i0, type: PopoverOrigin, deps: [], target: i0.ɵɵFactoryTarget.Directive });
+    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "22.1.7", type: PopoverOrigin, isStandalone: true, selector: "[mfPopoverOrigin]", exportAs: ["mfPopoverOrigin"], hostDirectives: [{ directive: i1.CdkOverlayOrigin }], ngImport: i0 });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.7", ngImport: i0, type: PopoverOrigin, decorators: [{
+            type: Directive,
+            args: [{
+                    selector: '[mfPopoverOrigin]',
+                    exportAs: 'mfPopoverOrigin',
+                    hostDirectives: [CdkOverlayOrigin],
+                }]
+        }] });
+
 /**
  * Generated bundle index. Do not edit.
  */
 
-export { Popover, popoverPanelVariants };
+export { Popover, PopoverOrigin, popoverPanelVariants };
 //# sourceMappingURL=mesgflow-ui-kit-popover.mjs.map

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

@@ -1 +1 @@
-{"version":3,"file":"mesgflow-ui-kit-popover.mjs","sources":["../../../projects/ui-kit/popover/popover.variants.ts","../../../projects/ui-kit/popover/popover.ts","../../../projects/ui-kit/popover/mesgflow-ui-kit-popover.ts"],"sourcesContent":["import { cva, type VariantProps } from 'class-variance-authority';\r\n\r\nexport const popoverPanelVariants = cva(\r\n  'overflow-auto rounded-lg border border-hairline bg-overlay shadow-2',\r\n  {\r\n    variants: {\r\n      padding: {\r\n        none: 'p-0',\r\n        sm: 'p-1',\r\n        md: 'p-2',\r\n        lg: 'p-3',\r\n      },\r\n    },\r\n    defaultVariants: { padding: 'sm' },\r\n  },\r\n);\r\n\r\nexport type PopoverPadding = VariantProps<typeof popoverPanelVariants>['padding'];\r\n","import { CdkOverlayOrigin, OverlayModule } from '@angular/cdk/overlay';\r\nimport {\r\n  Component,\r\n  computed,\r\n  effect,\r\n  input,\r\n  model,\r\n  output,\r\n  signal,\r\n  untracked,\r\n} from '@angular/core';\r\nimport { cn, exitDurationMs, overlayPositions, type MfPlacement } from '@mesgflow/ui-kit/core';\r\nimport { popoverPanelVariants, type PopoverPadding } from './popover.variants';\r\n\r\n/**\r\n * Tüm `MfPlacement` değerleri — `left`/`right` MANTIKSAL (RTL'de çevrilir).\r\n * `right-start`: tetikleyicinin ÜSTÜYLE hizalı (Sidebar daraltılmış nav\r\n * flyout'u gibi çok satırlı panellerde `right`in dikey ortalaması paneli\r\n * beklenmedik yönde kaydırır), 8px boşlukla.\r\n */\r\nexport type PopoverPlacement = MfPlacement;\r\n\r\n/**\r\n * `<button cdkOverlayOrigin #trigger=\"cdkOverlayOrigin\" (click)=\"open.set(true)\">...</button>`\r\n * `<mf-popover [origin]=\"trigger\" [(open)]=\"open\">...içerik (ng-content)...</mf-popover>`\r\n *\r\n * `Select`/`TableColumnsMenu`/`TableFilterMenu`/`DatePicker`'ın HER BİRİNİN\r\n * ayrı ayrı yazdığı `cdkConnectedOverlay` + pozisyon dizisi + backdrop/ESC\r\n * kapama iskeletini TEK yerde toplayan genel amaçlı panel primitifi (bkz.\r\n * README \"Yeni bir primitif gerektiğinde\"). YENİ kullanım noktaları bunu\r\n * kullanmalı — mevcut dört bileşenin buna taşınması BİLEREK bu değişiklikle\r\n * birlikte yapılmadı: her biri kendi klavye/vurgu (highlight) mantığını\r\n * Popover'ın panel içeriğiyle nasıl kompoze edeceğine karar vermeli, ayrı ve\r\n * her ekranın tarayıcıda tek tek doğrulanmasını gerektiren bir iş.\r\n *\r\n * `origin`, CDK'nın `cdkOverlayOrigin` directive'inin `exportAs` referansı —\r\n * ayrı bir wrapper directive'e gerek yok, CDK zaten sağlıyor.\r\n */\r\n@Component({\r\n  selector: 'mf-popover',\r\n  exportAs: 'mfPopover',\r\n  imports: [OverlayModule],\r\n  host: { class: 'contents' },\r\n  template: `\r\n    <ng-template\r\n      cdkConnectedOverlay\r\n      [cdkConnectedOverlayOrigin]=\"origin()\"\r\n      [cdkConnectedOverlayOpen]=\"attached()\"\r\n      [cdkConnectedOverlayPositions]=\"positions()\"\r\n      [cdkConnectedOverlayHasBackdrop]=\"hasBackdrop()\"\r\n      cdkConnectedOverlayBackdropClass=\"cdk-overlay-transparent-backdrop\"\r\n      [cdkConnectedOverlayMinWidth]=\"\r\n        matchTriggerWidth() ? origin().elementRef.nativeElement.offsetWidth : null\r\n      \"\r\n      (backdropClick)=\"close()\"\r\n      (detach)=\"close()\"\r\n    >\r\n      <!--\r\n        Panel sarmalayıcısı BİLEREK odaklanabilir değil — Escape'i içindeki\r\n        odaklanmış elemandan yukarı taşıyan bir olay-delegasyon kapsayıcısı,\r\n        kendisi bir etkileşim hedefi değil.\r\n      -->\r\n      <!-- eslint-disable-next-line @angular-eslint/template/interactive-supports-focus -->\r\n      <div [class]=\"classes()\" (keydown.escape)=\"close()\">\r\n        <ng-content />\r\n      </div>\r\n    </ng-template>\r\n  `,\r\n})\r\nexport class Popover {\r\n  readonly origin = input.required<CdkOverlayOrigin>();\r\n  readonly open = model(false);\r\n  readonly placement = input<PopoverPlacement>('bottom-start');\r\n  readonly padding = input<PopoverPadding>('sm');\r\n  /** Backdrop şeffaf ama TIKLANABİLİR — dışarı tıklayınca kapanması için var, görsel karartma YOK. */\r\n  readonly hasBackdrop = input(true);\r\n  /** `true` ise panel tetikleyiciden DAR olamaz (min-width) — genişleyebilir, küçülemez. */\r\n  readonly matchTriggerWidth = input(false);\r\n  readonly panelClass = input('');\r\n\r\n  readonly closed = output<void>();\r\n\r\n  /**\r\n   * `open()` MANTIKSAL durumu taşır (tüketici `[(open)]` ile doğrudan\r\n   * yazabilir — ör. `Select`'in bir seçenek tıklamasında `this.open.set(false)`\r\n   * çağırması). `attached()` ise CDK'ya bağlanan GERÇEK durum: `open()`\r\n   * `false`'a düştüğünde panel ANINDA kaldırılmaz, `closing` işaretlenip\r\n   * `animate-overlay-out` oynatılır, `exitDurationMs()` sonra `attached` da `false`\r\n   * olur. Bu ikili, `DialogService.open()`'daki `closePredicate` gecikmesiyle\r\n   * AYNI doktrini CDK Overlay tarafında uyguluyor (CDK'nın `cdkConnectedOverlay`'i\r\n   * Dialog'un aksine bir \"kapanışı ertele\" kancası SUNMUYOR, bu yüzden\r\n   * `effect()` tabanlı bu yaklaşım gerekiyor).\r\n   */\r\n  protected readonly attached = signal(false);\r\n  protected readonly closing = signal(false);\r\n  private exitTimer?: ReturnType<typeof setTimeout>;\r\n\r\n  protected readonly positions = computed(() => {\r\n    const placement = this.placement();\r\n    return overlayPositions(placement, placement === 'right-start' ? 8 : 4);\r\n  });\r\n  protected readonly classes = computed(() =>\r\n    cn(\r\n      popoverPanelVariants({ padding: this.padding() }),\r\n      this.closing() ? 'animate-overlay-out' : 'animate-overlay-in',\r\n      this.panelClass(),\r\n    ),\r\n  );\r\n\r\n  constructor() {\r\n    effect(() => {\r\n      const shouldBeOpen = this.open();\r\n      clearTimeout(this.exitTimer);\r\n\r\n      if (shouldBeOpen) {\r\n        this.closing.set(false);\r\n        this.attached.set(true);\r\n        return;\r\n      }\r\n\r\n      untracked(() => {\r\n        if (!this.attached()) return;\r\n\r\n        const exitMs = exitDurationMs();\r\n        if (exitMs === 0) {\r\n          this.attached.set(false);\r\n          return;\r\n        }\r\n\r\n        this.closing.set(true);\r\n        this.exitTimer = setTimeout(() => {\r\n          this.attached.set(false);\r\n          this.closing.set(false);\r\n        }, exitMs);\r\n      });\r\n    });\r\n  }\r\n\r\n  protected close(): void {\r\n    this.open.set(false);\r\n    this.closed.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-popover.mjs","sources":["../../../projects/ui-kit/popover/popover.variants.ts","../../../projects/ui-kit/popover/popover.ts","../../../projects/ui-kit/popover/popover-origin.ts","../../../projects/ui-kit/popover/mesgflow-ui-kit-popover.ts"],"sourcesContent":["import { cva, type VariantProps } from 'class-variance-authority';\r\n\r\nexport const popoverPanelVariants = cva(\r\n  'overflow-auto rounded-lg border border-hairline bg-overlay shadow-2',\r\n  {\r\n    variants: {\r\n      padding: {\r\n        none: 'p-0',\r\n        sm: 'p-1',\r\n        md: 'p-2',\r\n        lg: 'p-3',\r\n      },\r\n    },\r\n    defaultVariants: { padding: 'sm' },\r\n  },\r\n);\r\n\r\nexport type PopoverPadding = VariantProps<typeof popoverPanelVariants>['padding'];\r\n","import { CdkOverlayOrigin, OverlayModule } from '@angular/cdk/overlay';\r\nimport {\r\n  Component,\r\n  ElementRef,\r\n  computed,\r\n  effect,\r\n  input,\r\n  model,\r\n  output,\r\n  signal,\r\n  untracked,\r\n} from '@angular/core';\r\nimport { cn, exitDurationMs, overlayPositions, type MfPlacement } from '@mesgflow/ui-kit/core';\r\nimport { PopoverOrigin } from './popover-origin';\r\nimport { popoverPanelVariants, type PopoverPadding } from './popover.variants';\r\n\r\n/**\r\n * Tüm `MfPlacement` değerleri — `left`/`right` MANTIKSAL (RTL'de çevrilir).\r\n * `right-start`: tetikleyicinin ÜSTÜYLE hizalı (Sidebar daraltılmış nav\r\n * flyout'u gibi çok satırlı panellerde `right`in dikey ortalaması paneli\r\n * beklenmedik yönde kaydırır), 8px boşlukla.\r\n */\r\nexport type PopoverPlacement = MfPlacement;\r\n\r\n/**\r\n * `[origin]`'in kabul ettiği çapalar: kitin `mfPopoverOrigin`'i (tercih edilen —\r\n * tüketici `@angular/cdk` import etmez), CDK'nın `cdkOverlayOrigin`'i (geriye\r\n * uyumlu) ya da düz bir eleman (`#ref` şablon referansı / `ElementRef`).\r\n */\r\nexport type PopoverOriginRef =\r\n  PopoverOrigin | CdkOverlayOrigin | ElementRef<HTMLElement> | HTMLElement;\r\n\r\n/**\r\n * `<button cdkOverlayOrigin #trigger=\"cdkOverlayOrigin\" (click)=\"open.set(true)\">...</button>`\r\n * `<mf-popover [origin]=\"trigger\" [(open)]=\"open\">...içerik (ng-content)...</mf-popover>`\r\n *\r\n * `Select`/`TableColumnsMenu`/`TableFilterMenu`/`DatePicker`'ın HER BİRİNİN\r\n * ayrı ayrı yazdığı `cdkConnectedOverlay` + pozisyon dizisi + backdrop/ESC\r\n * kapama iskeletini TEK yerde toplayan genel amaçlı panel primitifi (bkz.\r\n * README \"Yeni bir primitif gerektiğinde\"). YENİ kullanım noktaları bunu\r\n * kullanmalı — mevcut dört bileşenin buna taşınması BİLEREK bu değişiklikle\r\n * birlikte yapılmadı: her biri kendi klavye/vurgu (highlight) mantığını\r\n * Popover'ın panel içeriğiyle nasıl kompoze edeceğine karar vermeli, ayrı ve\r\n * her ekranın tarayıcıda tek tek doğrulanmasını gerektiren bir iş.\r\n *\r\n * `origin`: kitin `mfPopoverOrigin` referansı (tüketici `@angular/cdk` import\r\n * etmez), geriye uyumlu olarak `cdkOverlayOrigin` ya da düz bir eleman — bkz.\r\n * `PopoverOriginRef`.\r\n */\r\n@Component({\r\n  selector: 'mf-popover',\r\n  exportAs: 'mfPopover',\r\n  imports: [OverlayModule],\r\n  host: { class: 'contents' },\r\n  template: `\r\n    <ng-template\r\n      cdkConnectedOverlay\r\n      [cdkConnectedOverlayOrigin]=\"anchor()\"\r\n      [cdkConnectedOverlayOpen]=\"attached()\"\r\n      [cdkConnectedOverlayPositions]=\"positions()\"\r\n      [cdkConnectedOverlayHasBackdrop]=\"hasBackdrop()\"\r\n      cdkConnectedOverlayBackdropClass=\"cdk-overlay-transparent-backdrop\"\r\n      [cdkConnectedOverlayMinWidth]=\"matchTriggerWidth() ? anchor().nativeElement.offsetWidth : 0\"\r\n      (backdropClick)=\"close()\"\r\n      (detach)=\"close()\"\r\n    >\r\n      <!--\r\n        Panel sarmalayıcısı BİLEREK odaklanabilir değil — Escape'i içindeki\r\n        odaklanmış elemandan yukarı taşıyan bir olay-delegasyon kapsayıcısı,\r\n        kendisi bir etkileşim hedefi değil.\r\n      -->\r\n      <!-- eslint-disable-next-line @angular-eslint/template/interactive-supports-focus -->\r\n      <div [class]=\"classes()\" (keydown.escape)=\"close()\">\r\n        <ng-content />\r\n      </div>\r\n    </ng-template>\r\n  `,\r\n})\r\nexport class Popover {\r\n  readonly origin = input.required<PopoverOriginRef>();\r\n  readonly open = model(false);\r\n  readonly placement = input<PopoverPlacement>('bottom-start');\r\n  readonly padding = input<PopoverPadding>('sm');\r\n  /** Backdrop şeffaf ama TIKLANABİLİR — dışarı tıklayınca kapanması için var, görsel karartma YOK. */\r\n  readonly hasBackdrop = input(true);\r\n  /** `true` ise panel tetikleyiciden DAR olamaz (min-width) — genişleyebilir, küçülemez. */\r\n  readonly matchTriggerWidth = input(false);\r\n  readonly panelClass = input('');\r\n\r\n  readonly closed = output<void>();\r\n\r\n  /**\r\n   * `open()` MANTIKSAL durumu taşır (tüketici `[(open)]` ile doğrudan\r\n   * yazabilir — ör. `Select`'in bir seçenek tıklamasında `this.open.set(false)`\r\n   * çağırması). `attached()` ise CDK'ya bağlanan GERÇEK durum: `open()`\r\n   * `false`'a düştüğünde panel ANINDA kaldırılmaz, `closing` işaretlenip\r\n   * `animate-overlay-out` oynatılır, `exitDurationMs()` sonra `attached` da `false`\r\n   * olur. Bu ikili, `DialogService.open()`'daki `closePredicate` gecikmesiyle\r\n   * AYNI doktrini CDK Overlay tarafında uyguluyor (CDK'nın `cdkConnectedOverlay`'i\r\n   * Dialog'un aksine bir \"kapanışı ertele\" kancası SUNMUYOR, bu yüzden\r\n   * `effect()` tabanlı bu yaklaşım gerekiyor).\r\n   */\r\n  protected readonly attached = signal(false);\r\n  protected readonly closing = signal(false);\r\n  private exitTimer?: ReturnType<typeof setTimeout>;\r\n\r\n  /** CDK'ya verilen çapa — `cdkConnectedOverlayOrigin` bir `ElementRef`'i doğrudan kabul eder. */\r\n  protected readonly anchor = computed<ElementRef<HTMLElement>>(() => {\r\n    const origin = this.origin();\r\n    return origin instanceof ElementRef\r\n      ? origin\r\n      : origin instanceof HTMLElement\r\n        ? new ElementRef(origin)\r\n        : origin.elementRef;\r\n  });\r\n\r\n  protected readonly positions = computed(() => {\r\n    const placement = this.placement();\r\n    return overlayPositions(placement, placement === 'right-start' ? 8 : 4);\r\n  });\r\n  protected readonly classes = computed(() =>\r\n    cn(\r\n      popoverPanelVariants({ padding: this.padding() }),\r\n      this.closing() ? 'animate-overlay-out' : 'animate-overlay-in',\r\n      this.panelClass(),\r\n    ),\r\n  );\r\n\r\n  constructor() {\r\n    effect(() => {\r\n      const shouldBeOpen = this.open();\r\n      clearTimeout(this.exitTimer);\r\n\r\n      if (shouldBeOpen) {\r\n        this.closing.set(false);\r\n        this.attached.set(true);\r\n        return;\r\n      }\r\n\r\n      untracked(() => {\r\n        if (!this.attached()) return;\r\n\r\n        const exitMs = exitDurationMs();\r\n        if (exitMs === 0) {\r\n          this.attached.set(false);\r\n          return;\r\n        }\r\n\r\n        this.closing.set(true);\r\n        this.exitTimer = setTimeout(() => {\r\n          this.attached.set(false);\r\n          this.closing.set(false);\r\n        }, exitMs);\r\n      });\r\n    });\r\n  }\r\n\r\n  protected close(): void {\r\n    this.open.set(false);\r\n    this.closed.emit();\r\n  }\r\n}\r\n","import { CdkOverlayOrigin } from '@angular/cdk/overlay';\r\nimport { Directive, ElementRef, inject } from '@angular/core';\r\n\r\n/**\r\n * `<button #trigger=\"mfPopoverOrigin\" mfPopoverOrigin (click)=\"open.set(true)\">…</button>\r\n *  <mf-popover [origin]=\"trigger\" [(open)]=\"open\">…</mf-popover>`\r\n *\r\n * `mf-popover`'ın `[origin]`'i için kitin kendi çapası — tüketici `@angular/cdk`\r\n * import etmeden `cdkOverlayOrigin` ile aynı işi görür (host directive olarak onu\r\n * taşır). `[origin]` ayrıca bir `HTMLElement`/`ElementRef` (`#ref` şablon\r\n * referansı) de kabul eder.\r\n */\r\n@Directive({\r\n  selector: '[mfPopoverOrigin]',\r\n  exportAs: 'mfPopoverOrigin',\r\n  hostDirectives: [CdkOverlayOrigin],\r\n})\r\nexport class PopoverOrigin {\r\n  readonly elementRef = inject<ElementRef<HTMLElement>>(ElementRef);\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-sidebar.mjs

@@ -1,5 +1,5 @@
 import * as i0 from '@angular/core';
-import { input, output, computed, signal, Component, inject, model, effect, untracked } from '@angular/core';
+import { input, output, computed, signal, Component, inject, model, booleanAttribute, effect, untracked } from '@angular/core';
 import { focusRecipe, cn, MF_SIDEBAR_LABELS } from '@mesgflow/ui-kit/core';
 import { Icon } from '@mesgflow/ui-kit/icon';
 import { Tooltip } from '@mesgflow/ui-kit/tooltip';
@@ -8,6 +8,7 @@ import * as i1 from '@angular/cdk/overlay';
 import { OverlayModule } from '@angular/cdk/overlay';
 import { Popover } from '@mesgflow/ui-kit/popover';
 import { Avatar } from '@mesgflow/ui-kit/avatar';
+import { Badge } from '@mesgflow/ui-kit/badge';
 
 /**
  * Kök panel: kart değil, yapısal/kenar-kenara chrome — `shadow-*`/`rounded-*`
@@ -57,8 +58,17 @@ const sidebarVariants = cva(
             /** Marka kenar çubuğu, AÇIK — kök zemini iki modda da primary-100, kenarlık KORUNUR (bkz. yukarıdaki doc). */
             'brand-light': 'border-e-primary-200 bg-primary-100',
         },
+        /** Çekmece içinde: dış kenarlık yok, genişlik kabı doldurur (bkz. `Sidebar.embedded`). */
+        embedded: {
+            true: 'w-full border-e-0',
+            false: '',
+        },
     },
-    defaultVariants: { collapsed: false, appearance: 'chrome' },
+    compoundVariants: [
+        // Nötr görünüm çekmecenin kendi yüzeyini kullanır; marka zeminleri kontrast için kalır.
+        { embedded: true, appearance: 'chrome', class: 'bg-transparent' },
+    ],
+    defaultVariants: { collapsed: false, appearance: 'chrome', embedded: false },
 });
 /**
  * Nav satırı (leaf veya parent-toggle) — `rounded-sm`(6px, menü öğesi kademesi,
@@ -185,11 +195,11 @@ class SidebarNavItemRow {
         this.flyoutOpen.set(false);
     }
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.7", ngImport: i0, type: SidebarNavItemRow, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.1.7", type: SidebarNavItemRow, isStandalone: true, selector: "mf-sidebar-nav-item", inputs: { item: { classPropertyName: "item", publicName: "item", isSignal: true, isRequired: true, transformFunction: null }, collapsed: { classPropertyName: "collapsed", publicName: "collapsed", isSignal: true, isRequired: false, transformFunction: null }, activeItemId: { classPropertyName: "activeItemId", publicName: "activeItemId", isSignal: true, isRequired: false, transformFunction: null }, expanded: { classPropertyName: "expanded", publicName: "expanded", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { activate: "activate", toggleExpand: "toggleExpand" }, host: { classAttribute: "contents" }, ngImport: i0, template: "<button\r\n  type=\"button\"\r\n  cdkOverlayOrigin\r\n  #origin=\"cdkOverlayOrigin\"\r\n  [class]=\"rowClasses()\"\r\n  [attr.aria-expanded]=\"hasChildren() && !collapsed() ? expanded() : null\"\r\n  [attr.aria-current]=\"isActive() && !hasChildren() ? 'page' : null\"\r\n  [attr.aria-label]=\"collapsed() ? item().label : null\"\r\n  [mfTooltip]=\"collapsed() ? item().label : ''\"\r\n  tooltipPosition=\"right\"\r\n  (click)=\"onRowClick()\"\r\n>\r\n  <span mfIcon [size]=\"20\" [filled]=\"isActive()\">{{ item().icon }}</span>\r\n\r\n  @if (!collapsed()) {\r\n    <span class=\"min-w-0 flex-1 truncate\">{{ item().label }}</span>\r\n    @if (item().badge !== undefined) {\r\n      <span\r\n        class=\"rounded-full bg-primary-tint px-1.5 py-0.5 font-mono text-eyebrow text-primary-tint-fg group-data-[appearance=brand]/sidebar:bg-primary-800 group-data-[appearance=brand]/sidebar:text-primary-100 group-data-[appearance=brand-light]/sidebar:bg-primary-200 group-data-[appearance=brand-light]/sidebar:text-primary-800\"\r\n      >\r\n        {{ item().badge }}\r\n      </span>\r\n    }\r\n    @if (hasChildren()) {\r\n      <span\r\n        mfIcon\r\n        [size]=\"16\"\r\n        class=\"shrink-0 text-fg-subtle transition-transform duration-base group-data-[appearance=brand]/sidebar:text-primary-300 group-data-[appearance=brand-light]/sidebar:text-primary-700 rtl:-scale-x-100\"\r\n        [class.rotate-90]=\"expanded()\"\r\n        [class.rtl:-rotate-90]=\"expanded()\"\r\n      >\r\n        chevron_right\r\n      </span>\r\n    }\r\n  }\r\n</button>\r\n\r\n@if (hasChildren() && !collapsed()) {\r\n  <div\r\n    class=\"grid overflow-hidden transition-[grid-template-rows] duration-base ease-out\"\r\n    [style.grid-template-rows]=\"expanded() ? '1fr' : '0fr'\"\r\n    [attr.inert]=\"expanded() ? null : true\"\r\n  >\r\n    <ul class=\"m-0 min-h-0 list-none overflow-hidden p-0\">\r\n      @for (child of item().children; track child.id) {\r\n        <li>\r\n          <button type=\"button\" [class]=\"childRowClasses(child)\" (click)=\"onChildClick(child)\">\r\n            <span mfIcon [size]=\"16\">{{ child.icon }}</span>\r\n            <span class=\"truncate\">{{ child.label }}</span>\r\n          </button>\r\n        </li>\r\n      }\r\n    </ul>\r\n  </div>\r\n}\r\n\r\n@if (hasChildren() && collapsed()) {\r\n  <mf-popover\r\n    [origin]=\"origin\"\r\n    [open]=\"flyoutOpen()\"\r\n    placement=\"right-start\"\r\n    padding=\"sm\"\r\n    panelClass=\"min-w-48\"\r\n    (closed)=\"closeFlyout()\"\r\n  >\r\n    <div role=\"menu\" [attr.aria-label]=\"item().label\">\r\n      <p class=\"truncate px-2.5 py-1.5 text-eyebrow text-fg-subtle\">{{ item().label }}</p>\r\n      @for (child of item().children; track child.id) {\r\n        <button\r\n          type=\"button\"\r\n          role=\"menuitem\"\r\n          class=\"flex w-full appearance-none items-center gap-2.5 rounded-sm border-0 bg-transparent px-2.5 py-1.5 text-start text-sm font-medium text-fg-muted transition-colors duration-fast ease-emphasis hover:bg-state-hover\"\r\n          (click)=\"onChildClick(child)\"\r\n        >\r\n          <span mfIcon [size]=\"16\">{{ child.icon }}</span>\r\n          <span class=\"truncate\">{{ child.label }}</span>\r\n        </button>\r\n      }\r\n    </div>\r\n  </mf-popover>\r\n}\r\n", dependencies: [{ kind: "directive", type: Icon, selector: "span[mfIcon]", inputs: ["size", "filled"] }, { kind: "ngmodule", type: OverlayModule }, { kind: "directive", type: i1.CdkOverlayOrigin, selector: "[cdk-overlay-origin], [overlay-origin], [cdkOverlayOrigin]", exportAs: ["cdkOverlayOrigin"] }, { kind: "component", type: Popover, selector: "mf-popover", inputs: ["origin", "open", "placement", "padding", "hasBackdrop", "matchTriggerWidth", "panelClass"], outputs: ["openChange", "closed"], exportAs: ["mfPopover"] }, { kind: "directive", type: Tooltip, selector: "[mfTooltip], [mfTooltipContent]", inputs: ["mfTooltip", "mfTooltipContent", "tooltipPosition"], exportAs: ["mfTooltip"] }] });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.1.7", type: SidebarNavItemRow, isStandalone: true, selector: "mf-sidebar-nav-item", inputs: { item: { classPropertyName: "item", publicName: "item", isSignal: true, isRequired: true, transformFunction: null }, collapsed: { classPropertyName: "collapsed", publicName: "collapsed", isSignal: true, isRequired: false, transformFunction: null }, activeItemId: { classPropertyName: "activeItemId", publicName: "activeItemId", isSignal: true, isRequired: false, transformFunction: null }, expanded: { classPropertyName: "expanded", publicName: "expanded", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { activate: "activate", toggleExpand: "toggleExpand" }, host: { classAttribute: "contents" }, ngImport: i0, template: "<button\r\n  type=\"button\"\r\n  cdkOverlayOrigin\r\n  #origin=\"cdkOverlayOrigin\"\r\n  [class]=\"rowClasses()\"\r\n  [attr.aria-expanded]=\"hasChildren() ? (collapsed() ? flyoutOpen() : expanded()) : null\"\r\n  [attr.aria-haspopup]=\"hasChildren() && collapsed() ? 'menu' : null\"\r\n  [attr.aria-current]=\"isActive() && !hasChildren() ? 'page' : null\"\r\n  [attr.aria-label]=\"collapsed() ? item().label : null\"\r\n  [mfTooltip]=\"collapsed() ? item().label : ''\"\r\n  tooltipPosition=\"right\"\r\n  (click)=\"onRowClick()\"\r\n>\r\n  <span mfIcon [size]=\"20\" [filled]=\"isActive()\">{{ item().icon }}</span>\r\n\r\n  @if (!collapsed()) {\r\n    <span class=\"min-w-0 flex-1 truncate\">{{ item().label }}</span>\r\n    @if (item().badge !== undefined) {\r\n      <span\r\n        class=\"rounded-full bg-primary-tint px-1.5 py-0.5 font-mono text-eyebrow text-primary-tint-fg group-data-[appearance=brand]/sidebar:bg-primary-800 group-data-[appearance=brand]/sidebar:text-primary-100 group-data-[appearance=brand-light]/sidebar:bg-primary-200 group-data-[appearance=brand-light]/sidebar:text-primary-800\"\r\n      >\r\n        {{ item().badge }}\r\n      </span>\r\n    }\r\n    @if (hasChildren()) {\r\n      <span\r\n        mfIcon\r\n        [size]=\"16\"\r\n        class=\"shrink-0 text-fg-subtle transition-transform duration-base group-data-[appearance=brand]/sidebar:text-primary-300 group-data-[appearance=brand-light]/sidebar:text-primary-700 rtl:-scale-x-100\"\r\n        [class.rotate-90]=\"expanded()\"\r\n        [class.rtl:-rotate-90]=\"expanded()\"\r\n      >\r\n        chevron_right\r\n      </span>\r\n    }\r\n  }\r\n</button>\r\n\r\n@if (hasChildren() && !collapsed()) {\r\n  <div\r\n    class=\"grid overflow-hidden transition-[grid-template-rows] duration-base ease-out\"\r\n    [style.grid-template-rows]=\"expanded() ? '1fr' : '0fr'\"\r\n    [attr.inert]=\"expanded() ? null : true\"\r\n  >\r\n    <ul class=\"m-0 min-h-0 list-none overflow-hidden p-0\">\r\n      @for (child of item().children; track child.id) {\r\n        <li>\r\n          <button\r\n            type=\"button\"\r\n            [class]=\"childRowClasses(child)\"\r\n            [attr.aria-current]=\"child.id === activeItemId() ? 'page' : null\"\r\n            (click)=\"onChildClick(child)\"\r\n          >\r\n            <span mfIcon [size]=\"16\">{{ child.icon }}</span>\r\n            <span class=\"truncate\">{{ child.label }}</span>\r\n          </button>\r\n        </li>\r\n      }\r\n    </ul>\r\n  </div>\r\n}\r\n\r\n@if (hasChildren() && collapsed()) {\r\n  <mf-popover\r\n    [origin]=\"origin\"\r\n    [open]=\"flyoutOpen()\"\r\n    placement=\"right-start\"\r\n    padding=\"sm\"\r\n    panelClass=\"min-w-48\"\r\n    (closed)=\"closeFlyout()\"\r\n  >\r\n    <div role=\"menu\" [attr.aria-label]=\"item().label\">\r\n      <p class=\"truncate px-2.5 py-1.5 text-eyebrow text-fg-subtle\">{{ item().label }}</p>\r\n      @for (child of item().children; track child.id) {\r\n        <button\r\n          type=\"button\"\r\n          role=\"menuitem\"\r\n          [attr.aria-current]=\"child.id === activeItemId() ? 'page' : null\"\r\n          class=\"flex w-full appearance-none items-center gap-2.5 rounded-sm border-0 bg-transparent px-2.5 py-1.5 text-start text-sm font-medium text-fg-muted transition-colors duration-fast ease-emphasis hover:bg-state-hover\"\r\n          (click)=\"onChildClick(child)\"\r\n        >\r\n          <span mfIcon [size]=\"16\">{{ child.icon }}</span>\r\n          <span class=\"truncate\">{{ child.label }}</span>\r\n        </button>\r\n      }\r\n    </div>\r\n  </mf-popover>\r\n}\r\n", dependencies: [{ kind: "directive", type: Icon, selector: "span[mfIcon]", inputs: ["size", "filled"] }, { kind: "ngmodule", type: OverlayModule }, { kind: "directive", type: i1.CdkOverlayOrigin, selector: "[cdk-overlay-origin], [overlay-origin], [cdkOverlayOrigin]", exportAs: ["cdkOverlayOrigin"] }, { kind: "component", type: Popover, selector: "mf-popover", inputs: ["origin", "open", "placement", "padding", "hasBackdrop", "matchTriggerWidth", "panelClass"], outputs: ["openChange", "closed"], exportAs: ["mfPopover"] }, { kind: "directive", type: Tooltip, selector: "[mfTooltip], [mfTooltipContent]", inputs: ["mfTooltip", "mfTooltipContent", "tooltipPosition"], exportAs: ["mfTooltip"] }] });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.7", ngImport: i0, type: SidebarNavItemRow, decorators: [{
             type: Component,
-            args: [{ selector: 'mf-sidebar-nav-item', imports: [Icon, OverlayModule, Popover, Tooltip], host: { class: 'contents' }, template: "<button\r\n  type=\"button\"\r\n  cdkOverlayOrigin\r\n  #origin=\"cdkOverlayOrigin\"\r\n  [class]=\"rowClasses()\"\r\n  [attr.aria-expanded]=\"hasChildren() && !collapsed() ? expanded() : null\"\r\n  [attr.aria-current]=\"isActive() && !hasChildren() ? 'page' : null\"\r\n  [attr.aria-label]=\"collapsed() ? item().label : null\"\r\n  [mfTooltip]=\"collapsed() ? item().label : ''\"\r\n  tooltipPosition=\"right\"\r\n  (click)=\"onRowClick()\"\r\n>\r\n  <span mfIcon [size]=\"20\" [filled]=\"isActive()\">{{ item().icon }}</span>\r\n\r\n  @if (!collapsed()) {\r\n    <span class=\"min-w-0 flex-1 truncate\">{{ item().label }}</span>\r\n    @if (item().badge !== undefined) {\r\n      <span\r\n        class=\"rounded-full bg-primary-tint px-1.5 py-0.5 font-mono text-eyebrow text-primary-tint-fg group-data-[appearance=brand]/sidebar:bg-primary-800 group-data-[appearance=brand]/sidebar:text-primary-100 group-data-[appearance=brand-light]/sidebar:bg-primary-200 group-data-[appearance=brand-light]/sidebar:text-primary-800\"\r\n      >\r\n        {{ item().badge }}\r\n      </span>\r\n    }\r\n    @if (hasChildren()) {\r\n      <span\r\n        mfIcon\r\n        [size]=\"16\"\r\n        class=\"shrink-0 text-fg-subtle transition-transform duration-base group-data-[appearance=brand]/sidebar:text-primary-300 group-data-[appearance=brand-light]/sidebar:text-primary-700 rtl:-scale-x-100\"\r\n        [class.rotate-90]=\"expanded()\"\r\n        [class.rtl:-rotate-90]=\"expanded()\"\r\n      >\r\n        chevron_right\r\n      </span>\r\n    }\r\n  }\r\n</button>\r\n\r\n@if (hasChildren() && !collapsed()) {\r\n  <div\r\n    class=\"grid overflow-hidden transition-[grid-template-rows] duration-base ease-out\"\r\n    [style.grid-template-rows]=\"expanded() ? '1fr' : '0fr'\"\r\n    [attr.inert]=\"expanded() ? null : true\"\r\n  >\r\n    <ul class=\"m-0 min-h-0 list-none overflow-hidden p-0\">\r\n      @for (child of item().children; track child.id) {\r\n        <li>\r\n          <button type=\"button\" [class]=\"childRowClasses(child)\" (click)=\"onChildClick(child)\">\r\n            <span mfIcon [size]=\"16\">{{ child.icon }}</span>\r\n            <span class=\"truncate\">{{ child.label }}</span>\r\n          </button>\r\n        </li>\r\n      }\r\n    </ul>\r\n  </div>\r\n}\r\n\r\n@if (hasChildren() && collapsed()) {\r\n  <mf-popover\r\n    [origin]=\"origin\"\r\n    [open]=\"flyoutOpen()\"\r\n    placement=\"right-start\"\r\n    padding=\"sm\"\r\n    panelClass=\"min-w-48\"\r\n    (closed)=\"closeFlyout()\"\r\n  >\r\n    <div role=\"menu\" [attr.aria-label]=\"item().label\">\r\n      <p class=\"truncate px-2.5 py-1.5 text-eyebrow text-fg-subtle\">{{ item().label }}</p>\r\n      @for (child of item().children; track child.id) {\r\n        <button\r\n          type=\"button\"\r\n          role=\"menuitem\"\r\n          class=\"flex w-full appearance-none items-center gap-2.5 rounded-sm border-0 bg-transparent px-2.5 py-1.5 text-start text-sm font-medium text-fg-muted transition-colors duration-fast ease-emphasis hover:bg-state-hover\"\r\n          (click)=\"onChildClick(child)\"\r\n        >\r\n          <span mfIcon [size]=\"16\">{{ child.icon }}</span>\r\n          <span class=\"truncate\">{{ child.label }}</span>\r\n        </button>\r\n      }\r\n    </div>\r\n  </mf-popover>\r\n}\r\n" }]
+            args: [{ selector: 'mf-sidebar-nav-item', imports: [Icon, OverlayModule, Popover, Tooltip], host: { class: 'contents' }, template: "<button\r\n  type=\"button\"\r\n  cdkOverlayOrigin\r\n  #origin=\"cdkOverlayOrigin\"\r\n  [class]=\"rowClasses()\"\r\n  [attr.aria-expanded]=\"hasChildren() ? (collapsed() ? flyoutOpen() : expanded()) : null\"\r\n  [attr.aria-haspopup]=\"hasChildren() && collapsed() ? 'menu' : null\"\r\n  [attr.aria-current]=\"isActive() && !hasChildren() ? 'page' : null\"\r\n  [attr.aria-label]=\"collapsed() ? item().label : null\"\r\n  [mfTooltip]=\"collapsed() ? item().label : ''\"\r\n  tooltipPosition=\"right\"\r\n  (click)=\"onRowClick()\"\r\n>\r\n  <span mfIcon [size]=\"20\" [filled]=\"isActive()\">{{ item().icon }}</span>\r\n\r\n  @if (!collapsed()) {\r\n    <span class=\"min-w-0 flex-1 truncate\">{{ item().label }}</span>\r\n    @if (item().badge !== undefined) {\r\n      <span\r\n        class=\"rounded-full bg-primary-tint px-1.5 py-0.5 font-mono text-eyebrow text-primary-tint-fg group-data-[appearance=brand]/sidebar:bg-primary-800 group-data-[appearance=brand]/sidebar:text-primary-100 group-data-[appearance=brand-light]/sidebar:bg-primary-200 group-data-[appearance=brand-light]/sidebar:text-primary-800\"\r\n      >\r\n        {{ item().badge }}\r\n      </span>\r\n    }\r\n    @if (hasChildren()) {\r\n      <span\r\n        mfIcon\r\n        [size]=\"16\"\r\n        class=\"shrink-0 text-fg-subtle transition-transform duration-base group-data-[appearance=brand]/sidebar:text-primary-300 group-data-[appearance=brand-light]/sidebar:text-primary-700 rtl:-scale-x-100\"\r\n        [class.rotate-90]=\"expanded()\"\r\n        [class.rtl:-rotate-90]=\"expanded()\"\r\n      >\r\n        chevron_right\r\n      </span>\r\n    }\r\n  }\r\n</button>\r\n\r\n@if (hasChildren() && !collapsed()) {\r\n  <div\r\n    class=\"grid overflow-hidden transition-[grid-template-rows] duration-base ease-out\"\r\n    [style.grid-template-rows]=\"expanded() ? '1fr' : '0fr'\"\r\n    [attr.inert]=\"expanded() ? null : true\"\r\n  >\r\n    <ul class=\"m-0 min-h-0 list-none overflow-hidden p-0\">\r\n      @for (child of item().children; track child.id) {\r\n        <li>\r\n          <button\r\n            type=\"button\"\r\n            [class]=\"childRowClasses(child)\"\r\n            [attr.aria-current]=\"child.id === activeItemId() ? 'page' : null\"\r\n            (click)=\"onChildClick(child)\"\r\n          >\r\n            <span mfIcon [size]=\"16\">{{ child.icon }}</span>\r\n            <span class=\"truncate\">{{ child.label }}</span>\r\n          </button>\r\n        </li>\r\n      }\r\n    </ul>\r\n  </div>\r\n}\r\n\r\n@if (hasChildren() && collapsed()) {\r\n  <mf-popover\r\n    [origin]=\"origin\"\r\n    [open]=\"flyoutOpen()\"\r\n    placement=\"right-start\"\r\n    padding=\"sm\"\r\n    panelClass=\"min-w-48\"\r\n    (closed)=\"closeFlyout()\"\r\n  >\r\n    <div role=\"menu\" [attr.aria-label]=\"item().label\">\r\n      <p class=\"truncate px-2.5 py-1.5 text-eyebrow text-fg-subtle\">{{ item().label }}</p>\r\n      @for (child of item().children; track child.id) {\r\n        <button\r\n          type=\"button\"\r\n          role=\"menuitem\"\r\n          [attr.aria-current]=\"child.id === activeItemId() ? 'page' : null\"\r\n          class=\"flex w-full appearance-none items-center gap-2.5 rounded-sm border-0 bg-transparent px-2.5 py-1.5 text-start text-sm font-medium text-fg-muted transition-colors duration-fast ease-emphasis hover:bg-state-hover\"\r\n          (click)=\"onChildClick(child)\"\r\n        >\r\n          <span mfIcon [size]=\"16\">{{ child.icon }}</span>\r\n          <span class=\"truncate\">{{ child.label }}</span>\r\n        </button>\r\n      }\r\n    </div>\r\n  </mf-popover>\r\n}\r\n" }]
         }], propDecorators: { item: [{ type: i0.Input, args: [{ isSignal: true, alias: "item", required: true }] }], collapsed: [{ type: i0.Input, args: [{ isSignal: true, alias: "collapsed", required: false }] }], activeItemId: [{ type: i0.Input, args: [{ isSignal: true, alias: "activeItemId", required: false }] }], expanded: [{ type: i0.Input, args: [{ isSignal: true, alias: "expanded", required: false }] }], activate: [{ type: i0.Output, args: ["activate"] }], toggleExpand: [{ type: i0.Output, args: ["toggleExpand"] }] } });
 
 /**
@@ -238,12 +248,20 @@ class SidebarTenantSwitcher {
         this.open.set(false);
     }
     select(tenant) {
+        if (tenant.disabled)
+            return;
         this.tenantChange.emit(tenant);
         this.close();
     }
+    /** "Ad, açıklama[, rozet]" — yalnızca ek alan varsa; yoksa `null` (içerikten türetilir, eski davranış). */
+    optionAriaLabel(tenant) {
+        if (!tenant.description && !tenant.badge)
+            return null;
+        return [tenant.name, tenant.description, tenant.badge].filter(Boolean).join(', ');
+    }
     optionClasses(tenant, index) {
         const isSelected = tenant.id === this.activeTenantId();
-        return cn('flex cursor-pointer items-center gap-2.5 rounded-sm px-2 py-1.5 transition-colors duration-fast ease-emphasis', index === this.highlighted() && !isSelected && 'bg-surface-alt', isSelected && 'bg-primary-tint text-primary-tint-fg');
+        return cn('flex cursor-pointer items-center gap-2.5 rounded-sm px-2 py-1.5 transition-colors duration-fast ease-emphasis', index === this.highlighted() && !isSelected && 'bg-surface-alt', isSelected && 'bg-primary-tint text-primary-tint-fg', tenant.disabled && 'cursor-not-allowed opacity-50');
     }
     onTriggerKeydown(event) {
         if (event.key === 'ArrowDown' || event.key === 'Enter' || event.key === ' ') {
@@ -277,11 +295,11 @@ class SidebarTenantSwitcher {
         }
     }
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.7", ngImport: i0, type: SidebarTenantSwitcher, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.1.7", type: SidebarTenantSwitcher, isStandalone: true, selector: "mf-sidebar-tenant-switcher", inputs: { tenants: { classPropertyName: "tenants", publicName: "tenants", isSignal: true, isRequired: false, transformFunction: null }, activeTenantId: { classPropertyName: "activeTenantId", publicName: "activeTenantId", isSignal: true, isRequired: false, transformFunction: null }, collapsed: { classPropertyName: "collapsed", publicName: "collapsed", isSignal: true, isRequired: false, transformFunction: null }, label: { classPropertyName: "label", publicName: "label", isSignal: true, isRequired: false, transformFunction: null }, noTenantsLabel: { classPropertyName: "noTenantsLabel", publicName: "noTenantsLabel", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { tenantChange: "tenantChange" }, host: { classAttribute: "contents" }, ngImport: i0, template: "<button\r\n  type=\"button\"\r\n  cdkOverlayOrigin\r\n  #origin=\"cdkOverlayOrigin\"\r\n  class=\"flex h-16 w-full shrink-0 appearance-none items-center gap-2.5 border-x-0 border-t-0 border-b border-border bg-transparent px-3 text-start transition-colors duration-fast ease-emphasis hover:bg-state-hover focus-visible:outline focus-visible:outline-2 focus-visible:-outline-offset-2 focus-visible:outline-focus-ring group-data-[appearance=brand]/sidebar:border-primary-800 group-data-[appearance=brand]/sidebar:hover:bg-primary-800 group-data-[appearance=brand]/sidebar:focus-visible:outline-primary-300 group-data-[appearance=brand-light]/sidebar:border-primary-200 group-data-[appearance=brand-light]/sidebar:hover:bg-primary-200 group-data-[appearance=brand-light]/sidebar:focus-visible:outline-primary-700\"\r\n  [class.justify-center]=\"collapsed()\"\r\n  [attr.aria-label]=\"collapsed() ? (activeTenant()?.name ?? effectiveLabel()) : null\"\r\n  [mfTooltip]=\"collapsed() ? (activeTenant()?.name ?? effectiveLabel()) : ''\"\r\n  tooltipPosition=\"right\"\r\n  [attr.aria-expanded]=\"open()\"\r\n  aria-haspopup=\"listbox\"\r\n  (click)=\"toggle()\"\r\n  (keydown)=\"onTriggerKeydown($event)\"\r\n>\r\n  <mf-avatar [name]=\"activeTenant()?.name ?? '?'\" shape=\"square\" size=\"md\" [colorful]=\"true\" />\r\n  @if (!collapsed()) {\r\n    <span class=\"flex min-w-0 flex-1 flex-col\">\r\n      <span\r\n        class=\"truncate font-display text-sm font-semibold text-fg group-data-[appearance=brand]/sidebar:text-primary-50 group-data-[appearance=brand-light]/sidebar:text-primary-900\"\r\n      >\r\n        {{ activeTenant()?.name ?? effectiveNoTenantsLabel() }}\r\n      </span>\r\n      <span\r\n        class=\"truncate text-xs text-fg-subtle group-data-[appearance=brand]/sidebar:text-primary-300 group-data-[appearance=brand-light]/sidebar:text-primary-700\"\r\n        >{{ effectiveLabel() }}</span\r\n      >\r\n    </span>\r\n    <span\r\n      mfIcon\r\n      [size]=\"18\"\r\n      class=\"shrink-0 text-fg-subtle group-data-[appearance=brand]/sidebar:text-primary-300 group-data-[appearance=brand-light]/sidebar:text-primary-700\"\r\n      >unfold_more</span\r\n    >\r\n  }\r\n</button>\r\n\r\n<mf-popover\r\n  [origin]=\"origin\"\r\n  [open]=\"open()\"\r\n  placement=\"bottom-start\"\r\n  padding=\"sm\"\r\n  [matchTriggerWidth]=\"!collapsed()\"\r\n  [panelClass]=\"cn('max-h-72', collapsed() ? 'min-w-60' : '')\"\r\n  (closed)=\"close()\"\r\n>\r\n  <ul\r\n    role=\"listbox\"\r\n    tabindex=\"0\"\r\n    [attr.aria-label]=\"effectiveLabel()\"\r\n    class=\"w-full text-sm\"\r\n    (keydown)=\"onPanelKeydown($event)\"\r\n  >\r\n    @for (tenant of tenants(); track tenant.id; let i = $index) {\r\n      <!-- role=\"option\" B\u0130LEREK odaklanabilir de\u011Fil \u2014 klavye gezinmesi yukar\u0131daki listbox (keydown)'da merkezi. -->\r\n      <!-- eslint-disable-next-line @angular-eslint/template/click-events-have-key-events, @angular-eslint/template/interactive-supports-focus -->\r\n      <li\r\n        role=\"option\"\r\n        [attr.aria-selected]=\"tenant.id === activeTenantId()\"\r\n        [class]=\"optionClasses(tenant, i)\"\r\n        (mouseenter)=\"highlighted.set(i)\"\r\n        (click)=\"select(tenant)\"\r\n      >\r\n        <mf-avatar [name]=\"tenant.name\" shape=\"square\" size=\"sm\" [colorful]=\"true\" />\r\n        <span class=\"min-w-0 flex-1 truncate text-fg-muted\">{{ tenant.name }}</span>\r\n        @if (tenant.id === activeTenantId()) {\r\n          <span mfIcon [size]=\"16\">check</span>\r\n        }\r\n      </li>\r\n    } @empty {\r\n      <li class=\"px-2.5 py-1.5 text-fg-subtle\">{{ effectiveNoTenantsLabel() }}</li>\r\n    }\r\n  </ul>\r\n</mf-popover>\r\n", dependencies: [{ kind: "component", type: Avatar, selector: "mf-avatar", inputs: ["name", "src", "size", "shape", "colorful", "tone"] }, { kind: "directive", type: Icon, selector: "span[mfIcon]", inputs: ["size", "filled"] }, { kind: "ngmodule", type: OverlayModule }, { kind: "directive", type: i1.CdkOverlayOrigin, selector: "[cdk-overlay-origin], [overlay-origin], [cdkOverlayOrigin]", exportAs: ["cdkOverlayOrigin"] }, { kind: "component", type: Popover, selector: "mf-popover", inputs: ["origin", "open", "placement", "padding", "hasBackdrop", "matchTriggerWidth", "panelClass"], outputs: ["openChange", "closed"], exportAs: ["mfPopover"] }, { kind: "directive", type: Tooltip, selector: "[mfTooltip], [mfTooltipContent]", inputs: ["mfTooltip", "mfTooltipContent", "tooltipPosition"], exportAs: ["mfTooltip"] }] });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.1.7", type: SidebarTenantSwitcher, isStandalone: true, selector: "mf-sidebar-tenant-switcher", inputs: { tenants: { classPropertyName: "tenants", publicName: "tenants", isSignal: true, isRequired: false, transformFunction: null }, activeTenantId: { classPropertyName: "activeTenantId", publicName: "activeTenantId", isSignal: true, isRequired: false, transformFunction: null }, collapsed: { classPropertyName: "collapsed", publicName: "collapsed", isSignal: true, isRequired: false, transformFunction: null }, label: { classPropertyName: "label", publicName: "label", isSignal: true, isRequired: false, transformFunction: null }, noTenantsLabel: { classPropertyName: "noTenantsLabel", publicName: "noTenantsLabel", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { tenantChange: "tenantChange" }, host: { classAttribute: "contents" }, ngImport: i0, template: "<button\r\n  type=\"button\"\r\n  cdkOverlayOrigin\r\n  #origin=\"cdkOverlayOrigin\"\r\n  class=\"flex h-16 w-full shrink-0 appearance-none items-center gap-2.5 border-x-0 border-t-0 border-b border-border bg-transparent px-3 text-start transition-colors duration-fast ease-emphasis hover:bg-state-hover focus-visible:outline focus-visible:outline-2 focus-visible:-outline-offset-2 focus-visible:outline-focus-ring group-data-[appearance=brand]/sidebar:border-primary-800 group-data-[appearance=brand]/sidebar:hover:bg-primary-800 group-data-[appearance=brand]/sidebar:focus-visible:outline-primary-300 group-data-[appearance=brand-light]/sidebar:border-primary-200 group-data-[appearance=brand-light]/sidebar:hover:bg-primary-200 group-data-[appearance=brand-light]/sidebar:focus-visible:outline-primary-700\"\r\n  [class.justify-center]=\"collapsed()\"\r\n  [attr.aria-label]=\"collapsed() ? (activeTenant()?.name ?? effectiveLabel()) : null\"\r\n  [mfTooltip]=\"collapsed() ? (activeTenant()?.name ?? effectiveLabel()) : ''\"\r\n  tooltipPosition=\"right\"\r\n  [attr.aria-expanded]=\"open()\"\r\n  aria-haspopup=\"listbox\"\r\n  (click)=\"toggle()\"\r\n  (keydown)=\"onTriggerKeydown($event)\"\r\n>\r\n  <mf-avatar [name]=\"activeTenant()?.name ?? '?'\" shape=\"square\" size=\"md\" [colorful]=\"true\" />\r\n  @if (!collapsed()) {\r\n    <span class=\"flex min-w-0 flex-1 flex-col\">\r\n      <span\r\n        class=\"truncate font-display text-sm font-semibold text-fg group-data-[appearance=brand]/sidebar:text-primary-50 group-data-[appearance=brand-light]/sidebar:text-primary-900\"\r\n      >\r\n        {{ activeTenant()?.name ?? effectiveNoTenantsLabel() }}\r\n      </span>\r\n      <span\r\n        class=\"truncate text-xs text-fg-subtle group-data-[appearance=brand]/sidebar:text-primary-300 group-data-[appearance=brand-light]/sidebar:text-primary-700\"\r\n        >{{ activeTenant()?.description || effectiveLabel() }}</span\r\n      >\r\n    </span>\r\n    <span\r\n      mfIcon\r\n      [size]=\"18\"\r\n      class=\"shrink-0 text-fg-subtle group-data-[appearance=brand]/sidebar:text-primary-300 group-data-[appearance=brand-light]/sidebar:text-primary-700\"\r\n      >unfold_more</span\r\n    >\r\n  }\r\n</button>\r\n\r\n<mf-popover\r\n  [origin]=\"origin\"\r\n  [open]=\"open()\"\r\n  placement=\"bottom-start\"\r\n  padding=\"sm\"\r\n  [matchTriggerWidth]=\"!collapsed()\"\r\n  [panelClass]=\"cn('max-h-72', collapsed() ? 'min-w-60' : '')\"\r\n  (closed)=\"close()\"\r\n>\r\n  <ul\r\n    role=\"listbox\"\r\n    tabindex=\"0\"\r\n    [attr.aria-label]=\"effectiveLabel()\"\r\n    class=\"w-full text-sm\"\r\n    (keydown)=\"onPanelKeydown($event)\"\r\n  >\r\n    @for (tenant of tenants(); track tenant.id; let i = $index) {\r\n      <!-- role=\"option\" B\u0130LEREK odaklanabilir de\u011Fil \u2014 klavye gezinmesi yukar\u0131daki listbox (keydown)'da merkezi. -->\r\n      <!-- eslint-disable-next-line @angular-eslint/template/click-events-have-key-events, @angular-eslint/template/interactive-supports-focus -->\r\n      <li\r\n        role=\"option\"\r\n        [attr.aria-selected]=\"tenant.id === activeTenantId()\"\r\n        [attr.aria-disabled]=\"tenant.disabled ? true : null\"\r\n        [attr.aria-label]=\"optionAriaLabel(tenant)\"\r\n        [class]=\"optionClasses(tenant, i)\"\r\n        (mouseenter)=\"highlighted.set(i)\"\r\n        (click)=\"select(tenant)\"\r\n      >\r\n        <mf-avatar [name]=\"tenant.name\" shape=\"square\" size=\"sm\" [colorful]=\"true\" />\r\n        @if (tenant.description) {\r\n          <span class=\"flex min-w-0 flex-1 flex-col\">\r\n            <span class=\"truncate text-fg-muted\">{{ tenant.name }}</span>\r\n            <span class=\"truncate text-xs text-fg-subtle\">{{ tenant.description }}</span>\r\n          </span>\r\n        } @else {\r\n          <span class=\"min-w-0 flex-1 truncate text-fg-muted\">{{ tenant.name }}</span>\r\n        }\r\n        @if (tenant.badge) {\r\n          <span mfBadge [tone]=\"tenant.badgeTone ?? 'neutral'\" size=\"sm\" casing=\"sentence\">{{\r\n            tenant.badge\r\n          }}</span>\r\n        }\r\n        @if (tenant.id === activeTenantId()) {\r\n          <span mfIcon [size]=\"16\">check</span>\r\n        }\r\n      </li>\r\n    } @empty {\r\n      <li class=\"px-2.5 py-1.5 text-fg-subtle\">{{ effectiveNoTenantsLabel() }}</li>\r\n    }\r\n  </ul>\r\n</mf-popover>\r\n", dependencies: [{ kind: "component", type: Avatar, selector: "mf-avatar", inputs: ["name", "src", "size", "shape", "colorful", "tone"] }, { kind: "directive", type: Badge, selector: "span[mfBadge]", inputs: ["tone", "size", "casing"] }, { kind: "directive", type: Icon, selector: "span[mfIcon]", inputs: ["size", "filled"] }, { kind: "ngmodule", type: OverlayModule }, { kind: "directive", type: i1.CdkOverlayOrigin, selector: "[cdk-overlay-origin], [overlay-origin], [cdkOverlayOrigin]", exportAs: ["cdkOverlayOrigin"] }, { kind: "component", type: Popover, selector: "mf-popover", inputs: ["origin", "open", "placement", "padding", "hasBackdrop", "matchTriggerWidth", "panelClass"], outputs: ["openChange", "closed"], exportAs: ["mfPopover"] }, { kind: "directive", type: Tooltip, selector: "[mfTooltip], [mfTooltipContent]", inputs: ["mfTooltip", "mfTooltipContent", "tooltipPosition"], exportAs: ["mfTooltip"] }] });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.7", ngImport: i0, type: SidebarTenantSwitcher, decorators: [{
             type: Component,
-            args: [{ selector: 'mf-sidebar-tenant-switcher', imports: [Avatar, Icon, OverlayModule, Popover, Tooltip], host: { class: 'contents' }, template: "<button\r\n  type=\"button\"\r\n  cdkOverlayOrigin\r\n  #origin=\"cdkOverlayOrigin\"\r\n  class=\"flex h-16 w-full shrink-0 appearance-none items-center gap-2.5 border-x-0 border-t-0 border-b border-border bg-transparent px-3 text-start transition-colors duration-fast ease-emphasis hover:bg-state-hover focus-visible:outline focus-visible:outline-2 focus-visible:-outline-offset-2 focus-visible:outline-focus-ring group-data-[appearance=brand]/sidebar:border-primary-800 group-data-[appearance=brand]/sidebar:hover:bg-primary-800 group-data-[appearance=brand]/sidebar:focus-visible:outline-primary-300 group-data-[appearance=brand-light]/sidebar:border-primary-200 group-data-[appearance=brand-light]/sidebar:hover:bg-primary-200 group-data-[appearance=brand-light]/sidebar:focus-visible:outline-primary-700\"\r\n  [class.justify-center]=\"collapsed()\"\r\n  [attr.aria-label]=\"collapsed() ? (activeTenant()?.name ?? effectiveLabel()) : null\"\r\n  [mfTooltip]=\"collapsed() ? (activeTenant()?.name ?? effectiveLabel()) : ''\"\r\n  tooltipPosition=\"right\"\r\n  [attr.aria-expanded]=\"open()\"\r\n  aria-haspopup=\"listbox\"\r\n  (click)=\"toggle()\"\r\n  (keydown)=\"onTriggerKeydown($event)\"\r\n>\r\n  <mf-avatar [name]=\"activeTenant()?.name ?? '?'\" shape=\"square\" size=\"md\" [colorful]=\"true\" />\r\n  @if (!collapsed()) {\r\n    <span class=\"flex min-w-0 flex-1 flex-col\">\r\n      <span\r\n        class=\"truncate font-display text-sm font-semibold text-fg group-data-[appearance=brand]/sidebar:text-primary-50 group-data-[appearance=brand-light]/sidebar:text-primary-900\"\r\n      >\r\n        {{ activeTenant()?.name ?? effectiveNoTenantsLabel() }}\r\n      </span>\r\n      <span\r\n        class=\"truncate text-xs text-fg-subtle group-data-[appearance=brand]/sidebar:text-primary-300 group-data-[appearance=brand-light]/sidebar:text-primary-700\"\r\n        >{{ effectiveLabel() }}</span\r\n      >\r\n    </span>\r\n    <span\r\n      mfIcon\r\n      [size]=\"18\"\r\n      class=\"shrink-0 text-fg-subtle group-data-[appearance=brand]/sidebar:text-primary-300 group-data-[appearance=brand-light]/sidebar:text-primary-700\"\r\n      >unfold_more</span\r\n    >\r\n  }\r\n</button>\r\n\r\n<mf-popover\r\n  [origin]=\"origin\"\r\n  [open]=\"open()\"\r\n  placement=\"bottom-start\"\r\n  padding=\"sm\"\r\n  [matchTriggerWidth]=\"!collapsed()\"\r\n  [panelClass]=\"cn('max-h-72', collapsed() ? 'min-w-60' : '')\"\r\n  (closed)=\"close()\"\r\n>\r\n  <ul\r\n    role=\"listbox\"\r\n    tabindex=\"0\"\r\n    [attr.aria-label]=\"effectiveLabel()\"\r\n    class=\"w-full text-sm\"\r\n    (keydown)=\"onPanelKeydown($event)\"\r\n  >\r\n    @for (tenant of tenants(); track tenant.id; let i = $index) {\r\n      <!-- role=\"option\" B\u0130LEREK odaklanabilir de\u011Fil \u2014 klavye gezinmesi yukar\u0131daki listbox (keydown)'da merkezi. -->\r\n      <!-- eslint-disable-next-line @angular-eslint/template/click-events-have-key-events, @angular-eslint/template/interactive-supports-focus -->\r\n      <li\r\n        role=\"option\"\r\n        [attr.aria-selected]=\"tenant.id === activeTenantId()\"\r\n        [class]=\"optionClasses(tenant, i)\"\r\n        (mouseenter)=\"highlighted.set(i)\"\r\n        (click)=\"select(tenant)\"\r\n      >\r\n        <mf-avatar [name]=\"tenant.name\" shape=\"square\" size=\"sm\" [colorful]=\"true\" />\r\n        <span class=\"min-w-0 flex-1 truncate text-fg-muted\">{{ tenant.name }}</span>\r\n        @if (tenant.id === activeTenantId()) {\r\n          <span mfIcon [size]=\"16\">check</span>\r\n        }\r\n      </li>\r\n    } @empty {\r\n      <li class=\"px-2.5 py-1.5 text-fg-subtle\">{{ effectiveNoTenantsLabel() }}</li>\r\n    }\r\n  </ul>\r\n</mf-popover>\r\n" }]
+            args: [{ selector: 'mf-sidebar-tenant-switcher', imports: [Avatar, Badge, Icon, OverlayModule, Popover, Tooltip], host: { class: 'contents' }, template: "<button\r\n  type=\"button\"\r\n  cdkOverlayOrigin\r\n  #origin=\"cdkOverlayOrigin\"\r\n  class=\"flex h-16 w-full shrink-0 appearance-none items-center gap-2.5 border-x-0 border-t-0 border-b border-border bg-transparent px-3 text-start transition-colors duration-fast ease-emphasis hover:bg-state-hover focus-visible:outline focus-visible:outline-2 focus-visible:-outline-offset-2 focus-visible:outline-focus-ring group-data-[appearance=brand]/sidebar:border-primary-800 group-data-[appearance=brand]/sidebar:hover:bg-primary-800 group-data-[appearance=brand]/sidebar:focus-visible:outline-primary-300 group-data-[appearance=brand-light]/sidebar:border-primary-200 group-data-[appearance=brand-light]/sidebar:hover:bg-primary-200 group-data-[appearance=brand-light]/sidebar:focus-visible:outline-primary-700\"\r\n  [class.justify-center]=\"collapsed()\"\r\n  [attr.aria-label]=\"collapsed() ? (activeTenant()?.name ?? effectiveLabel()) : null\"\r\n  [mfTooltip]=\"collapsed() ? (activeTenant()?.name ?? effectiveLabel()) : ''\"\r\n  tooltipPosition=\"right\"\r\n  [attr.aria-expanded]=\"open()\"\r\n  aria-haspopup=\"listbox\"\r\n  (click)=\"toggle()\"\r\n  (keydown)=\"onTriggerKeydown($event)\"\r\n>\r\n  <mf-avatar [name]=\"activeTenant()?.name ?? '?'\" shape=\"square\" size=\"md\" [colorful]=\"true\" />\r\n  @if (!collapsed()) {\r\n    <span class=\"flex min-w-0 flex-1 flex-col\">\r\n      <span\r\n        class=\"truncate font-display text-sm font-semibold text-fg group-data-[appearance=brand]/sidebar:text-primary-50 group-data-[appearance=brand-light]/sidebar:text-primary-900\"\r\n      >\r\n        {{ activeTenant()?.name ?? effectiveNoTenantsLabel() }}\r\n      </span>\r\n      <span\r\n        class=\"truncate text-xs text-fg-subtle group-data-[appearance=brand]/sidebar:text-primary-300 group-data-[appearance=brand-light]/sidebar:text-primary-700\"\r\n        >{{ activeTenant()?.description || effectiveLabel() }}</span\r\n      >\r\n    </span>\r\n    <span\r\n      mfIcon\r\n      [size]=\"18\"\r\n      class=\"shrink-0 text-fg-subtle group-data-[appearance=brand]/sidebar:text-primary-300 group-data-[appearance=brand-light]/sidebar:text-primary-700\"\r\n      >unfold_more</span\r\n    >\r\n  }\r\n</button>\r\n\r\n<mf-popover\r\n  [origin]=\"origin\"\r\n  [open]=\"open()\"\r\n  placement=\"bottom-start\"\r\n  padding=\"sm\"\r\n  [matchTriggerWidth]=\"!collapsed()\"\r\n  [panelClass]=\"cn('max-h-72', collapsed() ? 'min-w-60' : '')\"\r\n  (closed)=\"close()\"\r\n>\r\n  <ul\r\n    role=\"listbox\"\r\n    tabindex=\"0\"\r\n    [attr.aria-label]=\"effectiveLabel()\"\r\n    class=\"w-full text-sm\"\r\n    (keydown)=\"onPanelKeydown($event)\"\r\n  >\r\n    @for (tenant of tenants(); track tenant.id; let i = $index) {\r\n      <!-- role=\"option\" B\u0130LEREK odaklanabilir de\u011Fil \u2014 klavye gezinmesi yukar\u0131daki listbox (keydown)'da merkezi. -->\r\n      <!-- eslint-disable-next-line @angular-eslint/template/click-events-have-key-events, @angular-eslint/template/interactive-supports-focus -->\r\n      <li\r\n        role=\"option\"\r\n        [attr.aria-selected]=\"tenant.id === activeTenantId()\"\r\n        [attr.aria-disabled]=\"tenant.disabled ? true : null\"\r\n        [attr.aria-label]=\"optionAriaLabel(tenant)\"\r\n        [class]=\"optionClasses(tenant, i)\"\r\n        (mouseenter)=\"highlighted.set(i)\"\r\n        (click)=\"select(tenant)\"\r\n      >\r\n        <mf-avatar [name]=\"tenant.name\" shape=\"square\" size=\"sm\" [colorful]=\"true\" />\r\n        @if (tenant.description) {\r\n          <span class=\"flex min-w-0 flex-1 flex-col\">\r\n            <span class=\"truncate text-fg-muted\">{{ tenant.name }}</span>\r\n            <span class=\"truncate text-xs text-fg-subtle\">{{ tenant.description }}</span>\r\n          </span>\r\n        } @else {\r\n          <span class=\"min-w-0 flex-1 truncate text-fg-muted\">{{ tenant.name }}</span>\r\n        }\r\n        @if (tenant.badge) {\r\n          <span mfBadge [tone]=\"tenant.badgeTone ?? 'neutral'\" size=\"sm\" casing=\"sentence\">{{\r\n            tenant.badge\r\n          }}</span>\r\n        }\r\n        @if (tenant.id === activeTenantId()) {\r\n          <span mfIcon [size]=\"16\">check</span>\r\n        }\r\n      </li>\r\n    } @empty {\r\n      <li class=\"px-2.5 py-1.5 text-fg-subtle\">{{ effectiveNoTenantsLabel() }}</li>\r\n    }\r\n  </ul>\r\n</mf-popover>\r\n" }]
         }], propDecorators: { tenants: [{ type: i0.Input, args: [{ isSignal: true, alias: "tenants", required: false }] }], activeTenantId: [{ type: i0.Input, args: [{ isSignal: true, alias: "activeTenantId", required: false }] }], collapsed: [{ type: i0.Input, args: [{ isSignal: true, alias: "collapsed", required: false }] }], label: [{ type: i0.Input, args: [{ isSignal: true, alias: "label", required: false }] }], noTenantsLabel: [{ type: i0.Input, args: [{ isSignal: true, alias: "noTenantsLabel", required: false }] }], tenantChange: [{ type: i0.Output, args: ["tenantChange"] }] } });
 
 /**
@@ -357,6 +375,22 @@ class Sidebar {
      */
     appearance = input('chrome', /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "appearance" }] : /* istanbul ignore next */ []));
+    /**
+     * `[brand]` yuvasının tenant switcher'la ilişkisi. `'replace'` (varsayılan,
+     * eski davranış): marka YALNIZ `tenants` boşken çizilir, switcher onun
+     * yerine geçer. `'above'`: marka her zaman üstte, switcher (liste doluysa)
+     * altında. Daraltılmışken yalnız logo için `<mf-brand [showLabel]="!collapsed()">`
+     * — ad görsel olarak gizlenir, erişilebilir ad korunur.
+     */
+    brandPlacement = input('replace', /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "brandPlacement" }] : /* istanbul ignore next */ []));
+    /**
+     * `true`: bir çekmece (`mf-drawer`) gibi kendi yüzeyi olan bir kabın İÇİNDE —
+     * dış kenarlık ve `chrome` zemini çizilmez (çift çerçeve olmasın), genişlik
+     * kabı doldurur. Marka görünümleri (`brand`/`brand-light`) kontrast için
+     * kendi zeminini korur.
+     */
+    embedded = input(false, { ...(ngDevMode ? { debugName: "embedded" } : /* istanbul ignore next */ {}), transform: booleanAttribute });
     /** Verilmezse `MF_SIDEBAR_LABELS`'a düşer — `SidebarTenantSwitcher`/`SidebarUserMenu`'nün KENDİ etiketleri artık AYRICA buradan prop-drilling YAPILMIYOR, ikisi de `MF_SIDEBAR_LABELS`'ı doğrudan inject ediyor. */
     collapseLabel = input(/* @ts-ignore */
     ...(ngDevMode ? [undefined, { debugName: "collapseLabel" }] : /* istanbul ignore next */ []));
@@ -375,8 +409,14 @@ class Sidebar {
     ...(ngDevMode ? [{ debugName: "effectiveExpandLabel" }] : /* istanbul ignore next */ []));
     effectiveNavAriaLabel = computed(() => this.navAriaLabel() ?? this.sidebarLabels().nav, /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "effectiveNavAriaLabel" }] : /* istanbul ignore next */ []));
-    rootClasses = computed(() => cn(sidebarVariants({ collapsed: this.collapsed(), appearance: this.appearance() })), /* @ts-ignore */
+    rootClasses = computed(() => cn(sidebarVariants({
+        collapsed: this.collapsed(),
+        appearance: this.appearance(),
+        embedded: this.embedded(),
+    })), /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "rootClasses" }] : /* istanbul ignore next */ []));
+    showBrandRow = computed(() => this.brandPlacement() === 'above' || this.tenants().length === 0, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "showBrandRow" }] : /* istanbul ignore next */ []));
     /** Genişkenken hangi gruplar açık — her grup BAĞIMSIZ açılır/kapanır (akordeon değil, kullanıcı kararı). `model()` — tüketici okuyabilir/yazabilir (ör. "hepsini aç" bir buton). */
     expandedIds = model(new Set(), /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "expandedIds" }] : /* istanbul ignore next */ []));
@@ -437,12 +477,12 @@ class Sidebar {
         this.collapsed.update((v) => !v);
     }
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.7", ngImport: i0, type: Sidebar, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.1.7", type: Sidebar, isStandalone: true, selector: "mf-sidebar", inputs: { tenants: { classPropertyName: "tenants", publicName: "tenants", isSignal: true, isRequired: false, transformFunction: null }, activeTenantId: { classPropertyName: "activeTenantId", publicName: "activeTenantId", isSignal: true, isRequired: false, transformFunction: null }, navItems: { classPropertyName: "navItems", publicName: "navItems", isSignal: true, isRequired: true, transformFunction: null }, activeItemId: { classPropertyName: "activeItemId", publicName: "activeItemId", isSignal: true, isRequired: false, transformFunction: null }, user: { classPropertyName: "user", publicName: "user", isSignal: true, isRequired: false, transformFunction: null }, showUserMenu: { classPropertyName: "showUserMenu", publicName: "showUserMenu", isSignal: true, isRequired: false, transformFunction: null }, collapsed: { classPropertyName: "collapsed", publicName: "collapsed", isSignal: true, isRequired: false, transformFunction: null }, showCollapseToggle: { classPropertyName: "showCollapseToggle", publicName: "showCollapseToggle", isSignal: true, isRequired: false, transformFunction: null }, appearance: { classPropertyName: "appearance", publicName: "appearance", isSignal: true, isRequired: false, transformFunction: null }, collapseLabel: { classPropertyName: "collapseLabel", publicName: "collapseLabel", isSignal: true, isRequired: false, transformFunction: null }, expandLabel: { classPropertyName: "expandLabel", publicName: "expandLabel", isSignal: true, isRequired: false, transformFunction: null }, navAriaLabel: { classPropertyName: "navAriaLabel", publicName: "navAriaLabel", isSignal: true, isRequired: false, transformFunction: null }, expandedIds: { classPropertyName: "expandedIds", publicName: "expandedIds", isSignal: true, isRequired: false, transformFunction: null }, autoExpandActive: { classPropertyName: "autoExpandActive", publicName: "autoExpandActive", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { activeTenantId: "activeTenantIdChange", activeItemId: "activeItemIdChange", collapsed: "collapsedChange", tenantChange: "tenantChange", itemClick: "itemClick", profileClick: "profileClick", expandedIds: "expandedIdsChange" }, host: { classAttribute: "flex h-full" }, exportAs: ["mfSidebar"], ngImport: i0, template: "<aside [class]=\"rootClasses()\" [attr.data-appearance]=\"appearance()\">\r\n  <div class=\"flex h-full min-h-0 w-full flex-col overflow-hidden\">\r\n    @if (tenants().length > 0) {\r\n      <mf-sidebar-tenant-switcher\r\n        [tenants]=\"tenants()\"\r\n        [activeTenantId]=\"activeTenantId()\"\r\n        [collapsed]=\"collapsed()\"\r\n        (tenantChange)=\"onTenantSelect($event)\"\r\n      />\r\n    } @else {\r\n      <!--\r\n      Tenant kavram\u0131 olmayan t\u00FCketiciler `tenants` input'unu hi\u00E7 ge\u00E7mez \u2014 bu\r\n      durumda tenant switcher'\u0131n \"Kirac\u0131 bulunamad\u0131\" bo\u015F-durumunu g\u00F6stermek\r\n      yerine (kafa kar\u0131\u015Ft\u0131r\u0131c\u0131, ger\u00E7ek bir hata gibi okunur) \u00E7a\u011F\u0131ran\u0131n kendi\r\n      marka ba\u015Fl\u0131\u011F\u0131n\u0131 buraya projekte etmesi bekleniyor (\u00F6r. `<mf-brand />`).\r\n    -->\r\n      <div\r\n        class=\"flex h-16 shrink-0 items-center gap-2 border-b border-border px-4 group-data-[appearance=brand]/sidebar:border-primary-800 group-data-[appearance=brand-light]/sidebar:border-primary-200\"\r\n        [class.justify-center]=\"collapsed()\"\r\n      >\r\n        <ng-content select=\"[brand]\" />\r\n      </div>\r\n    }\r\n\r\n    <nav\r\n      class=\"flex-1 overflow-x-hidden overflow-y-auto px-2 py-3\"\r\n      [attr.aria-label]=\"effectiveNavAriaLabel()\"\r\n    >\r\n      <ul class=\"m-0 flex list-none flex-col gap-1 p-0\">\r\n        @for (item of navItems(); track item.id) {\r\n          <li>\r\n            <mf-sidebar-nav-item\r\n              [item]=\"item\"\r\n              [collapsed]=\"collapsed()\"\r\n              [activeItemId]=\"activeItemId()\"\r\n              [expanded]=\"isExpanded(item.id)\"\r\n              (activate)=\"onItemActivate($event)\"\r\n              (toggleExpand)=\"onToggleExpand($event)\"\r\n            />\r\n          </li>\r\n        }\r\n      </ul>\r\n    </nav>\r\n\r\n    @if (showUserMenu()) {\r\n      <div\r\n        class=\"border-t border-border group-data-[appearance=brand]/sidebar:border-primary-800 group-data-[appearance=brand-light]/sidebar:border-primary-200\"\r\n      ></div>\r\n\r\n      <mf-sidebar-user-menu\r\n        [user]=\"user()\"\r\n        [collapsed]=\"collapsed()\"\r\n        (profileClick)=\"profileClick.emit()\"\r\n      />\r\n    }\r\n  </div>\r\n\r\n  @if (showCollapseToggle()) {\r\n    <button\r\n      type=\"button\"\r\n      class=\"absolute top-14 -end-3 z-10 flex h-6 w-6 appearance-none items-center justify-center rounded-full border border-hairline bg-chrome p-0 text-fg-subtle shadow-1 transition-colors duration-fast ease-emphasis hover:bg-state-hover hover:text-fg active:scale-[0.99] focus-visible:outline focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-focus-ring group-data-[appearance=brand]/sidebar:bg-primary-900 group-data-[appearance=brand]/sidebar:text-primary-200 group-data-[appearance=brand]/sidebar:hover:bg-primary-800 group-data-[appearance=brand]/sidebar:hover:text-primary-50 group-data-[appearance=brand]/sidebar:focus-visible:outline-primary-300 group-data-[appearance=brand-light]/sidebar:bg-primary-100 group-data-[appearance=brand-light]/sidebar:text-primary-800 group-data-[appearance=brand-light]/sidebar:hover:bg-primary-200 group-data-[appearance=brand-light]/sidebar:hover:text-primary-900 group-data-[appearance=brand-light]/sidebar:focus-visible:outline-primary-700\"\r\n      [mfTooltip]=\"collapsed() ? effectiveExpandLabel() : effectiveCollapseLabel()\"\r\n      tooltipPosition=\"right\"\r\n      [attr.aria-label]=\"collapsed() ? effectiveExpandLabel() : effectiveCollapseLabel()\"\r\n      (click)=\"toggleCollapse()\"\r\n    >\r\n      <span mfIcon [size]=\"14\" class=\"rtl:-scale-x-100\">{{\r\n        collapsed() ? 'chevron_right' : 'chevron_left'\r\n      }}</span>\r\n    </button>\r\n  }\r\n</aside>\r\n", dependencies: [{ kind: "directive", type: Icon, selector: "span[mfIcon]", inputs: ["size", "filled"] }, { kind: "directive", type: Tooltip, selector: "[mfTooltip], [mfTooltipContent]", inputs: ["mfTooltip", "mfTooltipContent", "tooltipPosition"], exportAs: ["mfTooltip"] }, { kind: "component", type: SidebarTenantSwitcher, selector: "mf-sidebar-tenant-switcher", inputs: ["tenants", "activeTenantId", "collapsed", "label", "noTenantsLabel"], outputs: ["tenantChange"] }, { kind: "component", type: SidebarNavItemRow, selector: "mf-sidebar-nav-item", inputs: ["item", "collapsed", "activeItemId", "expanded"], outputs: ["activate", "toggleExpand"] }, { kind: "component", type: SidebarUserMenu, selector: "mf-sidebar-user-menu", inputs: ["user", "collapsed", "noUserLabel"], outputs: ["profileClick"] }] });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.1.7", type: Sidebar, isStandalone: true, selector: "mf-sidebar", inputs: { tenants: { classPropertyName: "tenants", publicName: "tenants", isSignal: true, isRequired: false, transformFunction: null }, activeTenantId: { classPropertyName: "activeTenantId", publicName: "activeTenantId", isSignal: true, isRequired: false, transformFunction: null }, navItems: { classPropertyName: "navItems", publicName: "navItems", isSignal: true, isRequired: true, transformFunction: null }, activeItemId: { classPropertyName: "activeItemId", publicName: "activeItemId", isSignal: true, isRequired: false, transformFunction: null }, user: { classPropertyName: "user", publicName: "user", isSignal: true, isRequired: false, transformFunction: null }, showUserMenu: { classPropertyName: "showUserMenu", publicName: "showUserMenu", isSignal: true, isRequired: false, transformFunction: null }, collapsed: { classPropertyName: "collapsed", publicName: "collapsed", isSignal: true, isRequired: false, transformFunction: null }, showCollapseToggle: { classPropertyName: "showCollapseToggle", publicName: "showCollapseToggle", isSignal: true, isRequired: false, transformFunction: null }, appearance: { classPropertyName: "appearance", publicName: "appearance", isSignal: true, isRequired: false, transformFunction: null }, brandPlacement: { classPropertyName: "brandPlacement", publicName: "brandPlacement", isSignal: true, isRequired: false, transformFunction: null }, embedded: { classPropertyName: "embedded", publicName: "embedded", isSignal: true, isRequired: false, transformFunction: null }, collapseLabel: { classPropertyName: "collapseLabel", publicName: "collapseLabel", isSignal: true, isRequired: false, transformFunction: null }, expandLabel: { classPropertyName: "expandLabel", publicName: "expandLabel", isSignal: true, isRequired: false, transformFunction: null }, navAriaLabel: { classPropertyName: "navAriaLabel", publicName: "navAriaLabel", isSignal: true, isRequired: false, transformFunction: null }, expandedIds: { classPropertyName: "expandedIds", publicName: "expandedIds", isSignal: true, isRequired: false, transformFunction: null }, autoExpandActive: { classPropertyName: "autoExpandActive", publicName: "autoExpandActive", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { activeTenantId: "activeTenantIdChange", activeItemId: "activeItemIdChange", collapsed: "collapsedChange", tenantChange: "tenantChange", itemClick: "itemClick", profileClick: "profileClick", expandedIds: "expandedIdsChange" }, host: { classAttribute: "flex h-full" }, exportAs: ["mfSidebar"], ngImport: i0, template: "<aside [class]=\"rootClasses()\" [attr.data-appearance]=\"appearance()\">\r\n  <div class=\"flex h-full min-h-0 w-full flex-col overflow-hidden\">\r\n    @if (showBrandRow()) {\r\n      <!--\r\n      Marka sat\u0131r\u0131. `brandPlacement=\"replace\"` (varsay\u0131lan): yaln\u0131z `tenants`\r\n      bo\u015Fken \u2014 tenant kavram\u0131 olmayan t\u00FCketiciler switcher'\u0131n \"Kirac\u0131\r\n      bulunamad\u0131\" bo\u015F-durumu yerine (kafa kar\u0131\u015Ft\u0131r\u0131c\u0131, ger\u00E7ek bir hata gibi\r\n      okunur) kendi marka ba\u015Fl\u0131\u011F\u0131n\u0131 buraya projekte eder (\u00F6r. `<mf-brand />`).\r\n      `\"above\"`: marka HER ZAMAN \u00FCstte, switcher (liste doluysa) alt\u0131nda \u2014\r\n      landmark s\u0131ras\u0131 marka \u2192 \u015Firket de\u011Fi\u015Ftirici \u2192 `nav`.\r\n    -->\r\n      <div\r\n        class=\"flex h-16 shrink-0 items-center gap-2 border-b border-border px-4 group-data-[appearance=brand]/sidebar:border-primary-800 group-data-[appearance=brand-light]/sidebar:border-primary-200\"\r\n        [class.justify-center]=\"collapsed()\"\r\n      >\r\n        <ng-content select=\"[brand]\" />\r\n      </div>\r\n    }\r\n    @if (tenants().length > 0) {\r\n      <mf-sidebar-tenant-switcher\r\n        [tenants]=\"tenants()\"\r\n        [activeTenantId]=\"activeTenantId()\"\r\n        [collapsed]=\"collapsed()\"\r\n        (tenantChange)=\"onTenantSelect($event)\"\r\n      />\r\n    }\r\n\r\n    <nav\r\n      class=\"flex-1 overflow-x-hidden overflow-y-auto px-2 py-3\"\r\n      [attr.aria-label]=\"effectiveNavAriaLabel()\"\r\n    >\r\n      <ul class=\"m-0 flex list-none flex-col gap-1 p-0\">\r\n        @for (item of navItems(); track item.id) {\r\n          <li>\r\n            <mf-sidebar-nav-item\r\n              [item]=\"item\"\r\n              [collapsed]=\"collapsed()\"\r\n              [activeItemId]=\"activeItemId()\"\r\n              [expanded]=\"isExpanded(item.id)\"\r\n              (activate)=\"onItemActivate($event)\"\r\n              (toggleExpand)=\"onToggleExpand($event)\"\r\n            />\r\n          </li>\r\n        }\r\n      </ul>\r\n    </nav>\r\n\r\n    @if (showUserMenu()) {\r\n      <div\r\n        class=\"border-t border-border group-data-[appearance=brand]/sidebar:border-primary-800 group-data-[appearance=brand-light]/sidebar:border-primary-200\"\r\n      ></div>\r\n\r\n      <mf-sidebar-user-menu\r\n        [user]=\"user()\"\r\n        [collapsed]=\"collapsed()\"\r\n        (profileClick)=\"profileClick.emit()\"\r\n      />\r\n    }\r\n  </div>\r\n\r\n  @if (showCollapseToggle()) {\r\n    <button\r\n      type=\"button\"\r\n      class=\"absolute top-14 -end-3 z-10 flex h-6 w-6 appearance-none items-center justify-center rounded-full border border-hairline bg-chrome p-0 text-fg-subtle shadow-1 transition-colors duration-fast ease-emphasis hover:bg-state-hover hover:text-fg active:scale-[0.99] focus-visible:outline focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-focus-ring group-data-[appearance=brand]/sidebar:bg-primary-900 group-data-[appearance=brand]/sidebar:text-primary-200 group-data-[appearance=brand]/sidebar:hover:bg-primary-800 group-data-[appearance=brand]/sidebar:hover:text-primary-50 group-data-[appearance=brand]/sidebar:focus-visible:outline-primary-300 group-data-[appearance=brand-light]/sidebar:bg-primary-100 group-data-[appearance=brand-light]/sidebar:text-primary-800 group-data-[appearance=brand-light]/sidebar:hover:bg-primary-200 group-data-[appearance=brand-light]/sidebar:hover:text-primary-900 group-data-[appearance=brand-light]/sidebar:focus-visible:outline-primary-700\"\r\n      [mfTooltip]=\"collapsed() ? effectiveExpandLabel() : effectiveCollapseLabel()\"\r\n      tooltipPosition=\"right\"\r\n      [attr.aria-label]=\"collapsed() ? effectiveExpandLabel() : effectiveCollapseLabel()\"\r\n      (click)=\"toggleCollapse()\"\r\n    >\r\n      <span mfIcon [size]=\"14\" class=\"rtl:-scale-x-100\">{{\r\n        collapsed() ? 'chevron_right' : 'chevron_left'\r\n      }}</span>\r\n    </button>\r\n  }\r\n</aside>\r\n", dependencies: [{ kind: "directive", type: Icon, selector: "span[mfIcon]", inputs: ["size", "filled"] }, { kind: "directive", type: Tooltip, selector: "[mfTooltip], [mfTooltipContent]", inputs: ["mfTooltip", "mfTooltipContent", "tooltipPosition"], exportAs: ["mfTooltip"] }, { kind: "component", type: SidebarTenantSwitcher, selector: "mf-sidebar-tenant-switcher", inputs: ["tenants", "activeTenantId", "collapsed", "label", "noTenantsLabel"], outputs: ["tenantChange"] }, { kind: "component", type: SidebarNavItemRow, selector: "mf-sidebar-nav-item", inputs: ["item", "collapsed", "activeItemId", "expanded"], outputs: ["activate", "toggleExpand"] }, { kind: "component", type: SidebarUserMenu, selector: "mf-sidebar-user-menu", inputs: ["user", "collapsed", "noUserLabel"], outputs: ["profileClick"] }] });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.7", ngImport: i0, type: Sidebar, decorators: [{
             type: Component,
-            args: [{ selector: 'mf-sidebar', exportAs: 'mfSidebar', host: { class: 'flex h-full' }, imports: [Icon, Tooltip, SidebarTenantSwitcher, SidebarNavItemRow, SidebarUserMenu], template: "<aside [class]=\"rootClasses()\" [attr.data-appearance]=\"appearance()\">\r\n  <div class=\"flex h-full min-h-0 w-full flex-col overflow-hidden\">\r\n    @if (tenants().length > 0) {\r\n      <mf-sidebar-tenant-switcher\r\n        [tenants]=\"tenants()\"\r\n        [activeTenantId]=\"activeTenantId()\"\r\n        [collapsed]=\"collapsed()\"\r\n        (tenantChange)=\"onTenantSelect($event)\"\r\n      />\r\n    } @else {\r\n      <!--\r\n      Tenant kavram\u0131 olmayan t\u00FCketiciler `tenants` input'unu hi\u00E7 ge\u00E7mez \u2014 bu\r\n      durumda tenant switcher'\u0131n \"Kirac\u0131 bulunamad\u0131\" bo\u015F-durumunu g\u00F6stermek\r\n      yerine (kafa kar\u0131\u015Ft\u0131r\u0131c\u0131, ger\u00E7ek bir hata gibi okunur) \u00E7a\u011F\u0131ran\u0131n kendi\r\n      marka ba\u015Fl\u0131\u011F\u0131n\u0131 buraya projekte etmesi bekleniyor (\u00F6r. `<mf-brand />`).\r\n    -->\r\n      <div\r\n        class=\"flex h-16 shrink-0 items-center gap-2 border-b border-border px-4 group-data-[appearance=brand]/sidebar:border-primary-800 group-data-[appearance=brand-light]/sidebar:border-primary-200\"\r\n        [class.justify-center]=\"collapsed()\"\r\n      >\r\n        <ng-content select=\"[brand]\" />\r\n      </div>\r\n    }\r\n\r\n    <nav\r\n      class=\"flex-1 overflow-x-hidden overflow-y-auto px-2 py-3\"\r\n      [attr.aria-label]=\"effectiveNavAriaLabel()\"\r\n    >\r\n      <ul class=\"m-0 flex list-none flex-col gap-1 p-0\">\r\n        @for (item of navItems(); track item.id) {\r\n          <li>\r\n            <mf-sidebar-nav-item\r\n              [item]=\"item\"\r\n              [collapsed]=\"collapsed()\"\r\n              [activeItemId]=\"activeItemId()\"\r\n              [expanded]=\"isExpanded(item.id)\"\r\n              (activate)=\"onItemActivate($event)\"\r\n              (toggleExpand)=\"onToggleExpand($event)\"\r\n            />\r\n          </li>\r\n        }\r\n      </ul>\r\n    </nav>\r\n\r\n    @if (showUserMenu()) {\r\n      <div\r\n        class=\"border-t border-border group-data-[appearance=brand]/sidebar:border-primary-800 group-data-[appearance=brand-light]/sidebar:border-primary-200\"\r\n      ></div>\r\n\r\n      <mf-sidebar-user-menu\r\n        [user]=\"user()\"\r\n        [collapsed]=\"collapsed()\"\r\n        (profileClick)=\"profileClick.emit()\"\r\n      />\r\n    }\r\n  </div>\r\n\r\n  @if (showCollapseToggle()) {\r\n    <button\r\n      type=\"button\"\r\n      class=\"absolute top-14 -end-3 z-10 flex h-6 w-6 appearance-none items-center justify-center rounded-full border border-hairline bg-chrome p-0 text-fg-subtle shadow-1 transition-colors duration-fast ease-emphasis hover:bg-state-hover hover:text-fg active:scale-[0.99] focus-visible:outline focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-focus-ring group-data-[appearance=brand]/sidebar:bg-primary-900 group-data-[appearance=brand]/sidebar:text-primary-200 group-data-[appearance=brand]/sidebar:hover:bg-primary-800 group-data-[appearance=brand]/sidebar:hover:text-primary-50 group-data-[appearance=brand]/sidebar:focus-visible:outline-primary-300 group-data-[appearance=brand-light]/sidebar:bg-primary-100 group-data-[appearance=brand-light]/sidebar:text-primary-800 group-data-[appearance=brand-light]/sidebar:hover:bg-primary-200 group-data-[appearance=brand-light]/sidebar:hover:text-primary-900 group-data-[appearance=brand-light]/sidebar:focus-visible:outline-primary-700\"\r\n      [mfTooltip]=\"collapsed() ? effectiveExpandLabel() : effectiveCollapseLabel()\"\r\n      tooltipPosition=\"right\"\r\n      [attr.aria-label]=\"collapsed() ? effectiveExpandLabel() : effectiveCollapseLabel()\"\r\n      (click)=\"toggleCollapse()\"\r\n    >\r\n      <span mfIcon [size]=\"14\" class=\"rtl:-scale-x-100\">{{\r\n        collapsed() ? 'chevron_right' : 'chevron_left'\r\n      }}</span>\r\n    </button>\r\n  }\r\n</aside>\r\n" }]
-        }], ctorParameters: () => [], propDecorators: { tenants: [{ type: i0.Input, args: [{ isSignal: true, alias: "tenants", required: false }] }], activeTenantId: [{ type: i0.Input, args: [{ isSignal: true, alias: "activeTenantId", required: false }] }, { type: i0.Output, args: ["activeTenantIdChange"] }], navItems: [{ type: i0.Input, args: [{ isSignal: true, alias: "navItems", required: true }] }], activeItemId: [{ type: i0.Input, args: [{ isSignal: true, alias: "activeItemId", required: false }] }, { type: i0.Output, args: ["activeItemIdChange"] }], user: [{ type: i0.Input, args: [{ isSignal: true, alias: "user", required: false }] }], showUserMenu: [{ type: i0.Input, args: [{ isSignal: true, alias: "showUserMenu", required: false }] }], collapsed: [{ type: i0.Input, args: [{ isSignal: true, alias: "collapsed", required: false }] }, { type: i0.Output, args: ["collapsedChange"] }], showCollapseToggle: [{ type: i0.Input, args: [{ isSignal: true, alias: "showCollapseToggle", required: false }] }], appearance: [{ type: i0.Input, args: [{ isSignal: true, alias: "appearance", required: false }] }], collapseLabel: [{ type: i0.Input, args: [{ isSignal: true, alias: "collapseLabel", required: false }] }], expandLabel: [{ type: i0.Input, args: [{ isSignal: true, alias: "expandLabel", required: false }] }], navAriaLabel: [{ type: i0.Input, args: [{ isSignal: true, alias: "navAriaLabel", required: false }] }], tenantChange: [{ type: i0.Output, args: ["tenantChange"] }], itemClick: [{ type: i0.Output, args: ["itemClick"] }], profileClick: [{ type: i0.Output, args: ["profileClick"] }], expandedIds: [{ type: i0.Input, args: [{ isSignal: true, alias: "expandedIds", required: false }] }, { type: i0.Output, args: ["expandedIdsChange"] }], autoExpandActive: [{ type: i0.Input, args: [{ isSignal: true, alias: "autoExpandActive", required: false }] }] } });
+            args: [{ selector: 'mf-sidebar', exportAs: 'mfSidebar', host: { class: 'flex h-full' }, imports: [Icon, Tooltip, SidebarTenantSwitcher, SidebarNavItemRow, SidebarUserMenu], template: "<aside [class]=\"rootClasses()\" [attr.data-appearance]=\"appearance()\">\r\n  <div class=\"flex h-full min-h-0 w-full flex-col overflow-hidden\">\r\n    @if (showBrandRow()) {\r\n      <!--\r\n      Marka sat\u0131r\u0131. `brandPlacement=\"replace\"` (varsay\u0131lan): yaln\u0131z `tenants`\r\n      bo\u015Fken \u2014 tenant kavram\u0131 olmayan t\u00FCketiciler switcher'\u0131n \"Kirac\u0131\r\n      bulunamad\u0131\" bo\u015F-durumu yerine (kafa kar\u0131\u015Ft\u0131r\u0131c\u0131, ger\u00E7ek bir hata gibi\r\n      okunur) kendi marka ba\u015Fl\u0131\u011F\u0131n\u0131 buraya projekte eder (\u00F6r. `<mf-brand />`).\r\n      `\"above\"`: marka HER ZAMAN \u00FCstte, switcher (liste doluysa) alt\u0131nda \u2014\r\n      landmark s\u0131ras\u0131 marka \u2192 \u015Firket de\u011Fi\u015Ftirici \u2192 `nav`.\r\n    -->\r\n      <div\r\n        class=\"flex h-16 shrink-0 items-center gap-2 border-b border-border px-4 group-data-[appearance=brand]/sidebar:border-primary-800 group-data-[appearance=brand-light]/sidebar:border-primary-200\"\r\n        [class.justify-center]=\"collapsed()\"\r\n      >\r\n        <ng-content select=\"[brand]\" />\r\n      </div>\r\n    }\r\n    @if (tenants().length > 0) {\r\n      <mf-sidebar-tenant-switcher\r\n        [tenants]=\"tenants()\"\r\n        [activeTenantId]=\"activeTenantId()\"\r\n        [collapsed]=\"collapsed()\"\r\n        (tenantChange)=\"onTenantSelect($event)\"\r\n      />\r\n    }\r\n\r\n    <nav\r\n      class=\"flex-1 overflow-x-hidden overflow-y-auto px-2 py-3\"\r\n      [attr.aria-label]=\"effectiveNavAriaLabel()\"\r\n    >\r\n      <ul class=\"m-0 flex list-none flex-col gap-1 p-0\">\r\n        @for (item of navItems(); track item.id) {\r\n          <li>\r\n            <mf-sidebar-nav-item\r\n              [item]=\"item\"\r\n              [collapsed]=\"collapsed()\"\r\n              [activeItemId]=\"activeItemId()\"\r\n              [expanded]=\"isExpanded(item.id)\"\r\n              (activate)=\"onItemActivate($event)\"\r\n              (toggleExpand)=\"onToggleExpand($event)\"\r\n            />\r\n          </li>\r\n        }\r\n      </ul>\r\n    </nav>\r\n\r\n    @if (showUserMenu()) {\r\n      <div\r\n        class=\"border-t border-border group-data-[appearance=brand]/sidebar:border-primary-800 group-data-[appearance=brand-light]/sidebar:border-primary-200\"\r\n      ></div>\r\n\r\n      <mf-sidebar-user-menu\r\n        [user]=\"user()\"\r\n        [collapsed]=\"collapsed()\"\r\n        (profileClick)=\"profileClick.emit()\"\r\n      />\r\n    }\r\n  </div>\r\n\r\n  @if (showCollapseToggle()) {\r\n    <button\r\n      type=\"button\"\r\n      class=\"absolute top-14 -end-3 z-10 flex h-6 w-6 appearance-none items-center justify-center rounded-full border border-hairline bg-chrome p-0 text-fg-subtle shadow-1 transition-colors duration-fast ease-emphasis hover:bg-state-hover hover:text-fg active:scale-[0.99] focus-visible:outline focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-focus-ring group-data-[appearance=brand]/sidebar:bg-primary-900 group-data-[appearance=brand]/sidebar:text-primary-200 group-data-[appearance=brand]/sidebar:hover:bg-primary-800 group-data-[appearance=brand]/sidebar:hover:text-primary-50 group-data-[appearance=brand]/sidebar:focus-visible:outline-primary-300 group-data-[appearance=brand-light]/sidebar:bg-primary-100 group-data-[appearance=brand-light]/sidebar:text-primary-800 group-data-[appearance=brand-light]/sidebar:hover:bg-primary-200 group-data-[appearance=brand-light]/sidebar:hover:text-primary-900 group-data-[appearance=brand-light]/sidebar:focus-visible:outline-primary-700\"\r\n      [mfTooltip]=\"collapsed() ? effectiveExpandLabel() : effectiveCollapseLabel()\"\r\n      tooltipPosition=\"right\"\r\n      [attr.aria-label]=\"collapsed() ? effectiveExpandLabel() : effectiveCollapseLabel()\"\r\n      (click)=\"toggleCollapse()\"\r\n    >\r\n      <span mfIcon [size]=\"14\" class=\"rtl:-scale-x-100\">{{\r\n        collapsed() ? 'chevron_right' : 'chevron_left'\r\n      }}</span>\r\n    </button>\r\n  }\r\n</aside>\r\n" }]
+        }], ctorParameters: () => [], propDecorators: { tenants: [{ type: i0.Input, args: [{ isSignal: true, alias: "tenants", required: false }] }], activeTenantId: [{ type: i0.Input, args: [{ isSignal: true, alias: "activeTenantId", required: false }] }, { type: i0.Output, args: ["activeTenantIdChange"] }], navItems: [{ type: i0.Input, args: [{ isSignal: true, alias: "navItems", required: true }] }], activeItemId: [{ type: i0.Input, args: [{ isSignal: true, alias: "activeItemId", required: false }] }, { type: i0.Output, args: ["activeItemIdChange"] }], user: [{ type: i0.Input, args: [{ isSignal: true, alias: "user", required: false }] }], showUserMenu: [{ type: i0.Input, args: [{ isSignal: true, alias: "showUserMenu", required: false }] }], collapsed: [{ type: i0.Input, args: [{ isSignal: true, alias: "collapsed", required: false }] }, { type: i0.Output, args: ["collapsedChange"] }], showCollapseToggle: [{ type: i0.Input, args: [{ isSignal: true, alias: "showCollapseToggle", required: false }] }], appearance: [{ type: i0.Input, args: [{ isSignal: true, alias: "appearance", required: false }] }], brandPlacement: [{ type: i0.Input, args: [{ isSignal: true, alias: "brandPlacement", required: false }] }], embedded: [{ type: i0.Input, args: [{ isSignal: true, alias: "embedded", required: false }] }], collapseLabel: [{ type: i0.Input, args: [{ isSignal: true, alias: "collapseLabel", required: false }] }], expandLabel: [{ type: i0.Input, args: [{ isSignal: true, alias: "expandLabel", required: false }] }], navAriaLabel: [{ type: i0.Input, args: [{ isSignal: true, alias: "navAriaLabel", required: false }] }], tenantChange: [{ type: i0.Output, args: ["tenantChange"] }], itemClick: [{ type: i0.Output, args: ["itemClick"] }], profileClick: [{ type: i0.Output, args: ["profileClick"] }], expandedIds: [{ type: i0.Input, args: [{ isSignal: true, alias: "expandedIds", required: false }] }, { type: i0.Output, args: ["expandedIdsChange"] }], autoExpandActive: [{ type: i0.Input, args: [{ isSignal: true, alias: "autoExpandActive", required: false }] }] } });
 
 /**
  * Generated bundle index. Do not edit.