@mesgflow/ui-kit 0.6.0

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

@@ -0,0 +1,123 @@
+import * as i0 from '@angular/core';
+import { input, computed, Component } from '@angular/core';
+
+/**
+ * Sadece semantic token'lar, keyfi renk yok — `tone` (sabit) veya `colorful`
+ * (isme göre) ile seçiliyor. Badge'teki gibi tonal işaret rol token'ı
+ * (`bg-X-tint text-X-tint-fg`, `color-mix()` tabanlı) — bkz.
+ * badge.variants.ts'teki gerekçe. `neutral` — marka rengiyle (primary)
+ * İLİŞKİSİZ bir kişi/varlık için (ör. "Sistem", "Silinmiş kullanıcı") —
+ * `MfTone`'un geri kalanıyla tutarlı, kit genelinde her `tone` ekseni
+ * `neutral`den başlar.
+ */
+const COLOR_CLASSES = {
+    neutral: 'bg-surface-alt text-fg-muted',
+    primary: 'bg-primary-tint text-primary-tint-fg',
+    success: 'bg-success-tint text-success-tint-fg',
+    warning: 'bg-warning-tint text-warning-tint-fg',
+    danger: 'bg-danger-tint text-danger-tint-fg',
+    info: 'bg-info-tint text-info-tint-fg',
+    help: 'bg-help-tint text-help-tint-fg',
+};
+/**
+ * `colorful` hash havuzu BİLEREK `help` HARİÇ eski 6 tonda sabit kalır —
+ * help yeni bir tondur, havuza eklenirse `hash % length` kayar ve önceden
+ * `colorful` ile atanmış isimlerin rengi DEĞİŞİR (bkz. plan "Deep Emerald &
+ * Slate v2" madde B — kırılma istenmiyor).
+ */
+const COLOR_PALETTE = ['neutral', 'primary', 'success', 'warning', 'danger', 'info'].map((tone) => COLOR_CLASSES[tone]);
+function hashString(value) {
+    let hash = 0;
+    for (let i = 0; i < value.length; i++)
+        hash = (Math.imul(hash, 16777619) + value.charCodeAt(i)) >>> 0;
+    return hash;
+}
+class Avatar {
+    name = input.required(/* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "name" }] : /* istanbul ignore next */ []));
+    src = input(null, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "src" }] : /* istanbul ignore next */ []));
+    size = input('md', /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "size" }] : /* istanbul ignore next */ []));
+    shape = input('round', /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "shape" }] : /* istanbul ignore next */ []));
+    /** Her isim için sabit, farklı bir renk (ör. tenant switcher listesi) — `tone` verilmişse yoksayılır. */
+    colorful = input(false, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "colorful" }] : /* istanbul ignore next */ []));
+    /** İsimden bağımsız, hep AYNI sabit renk (ör. tek bir kullanıcının kendi profili) — `colorful`'dan öncelikli. */
+    tone = input(null, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "tone" }] : /* istanbul ignore next */ []));
+    shapeClasses = computed(() => this.shape() === 'square' ? 'rounded-md' : 'rounded-full', /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "shapeClasses" }] : /* istanbul ignore next */ []));
+    colorClasses = computed(() => {
+        const tone = this.tone();
+        if (tone)
+            return COLOR_CLASSES[tone];
+        return this.colorful()
+            ? COLOR_PALETTE[hashString(this.name()) % COLOR_PALETTE.length]
+            : COLOR_CLASSES.primary;
+    }, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "colorClasses" }] : /* istanbul ignore next */ []));
+    initials = computed(() => {
+        const parts = this.name().trim().split(/\s+/).filter(Boolean);
+        if (parts.length === 0)
+            return '';
+        if (parts.length === 1)
+            return parts[0].slice(0, 2).toUpperCase();
+        return (parts[0][0] + parts[parts.length - 1][0]).toUpperCase();
+    }, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "initials" }] : /* istanbul ignore next */ []));
+    sizeClasses = computed(() => ({ sm: 'h-7 w-7 text-xs', md: 'h-9 w-9 text-sm', lg: 'h-12 w-12 text-base' })[this.size()], /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "sizeClasses" }] : /* istanbul ignore next */ []));
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.6", ngImport: i0, type: Avatar, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.1.6", type: Avatar, isStandalone: true, selector: "mf-avatar", inputs: { name: { classPropertyName: "name", publicName: "name", isSignal: true, isRequired: true, transformFunction: null }, src: { classPropertyName: "src", publicName: "src", isSignal: true, isRequired: false, transformFunction: null }, size: { classPropertyName: "size", publicName: "size", isSignal: true, isRequired: false, transformFunction: null }, shape: { classPropertyName: "shape", publicName: "shape", isSignal: true, isRequired: false, transformFunction: null }, colorful: { classPropertyName: "colorful", publicName: "colorful", isSignal: true, isRequired: false, transformFunction: null }, tone: { classPropertyName: "tone", publicName: "tone", isSignal: true, isRequired: false, transformFunction: null } }, host: { classAttribute: "inline-flex" }, ngImport: i0, template: `
+    @if (src(); as url) {
+      <img [src]="url" [alt]="name()" [class]="shapeClasses() + ' object-cover ' + sizeClasses()" />
+    } @else {
+      <span
+        [class]="
+          'inline-flex items-center justify-center ' +
+          shapeClasses() +
+          ' font-medium ' +
+          colorClasses() +
+          ' ' +
+          sizeClasses()
+        "
+      >
+        {{ initials() }}
+      </span>
+    }
+  `, isInline: true });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.6", ngImport: i0, type: Avatar, decorators: [{
+            type: Component,
+            args: [{
+                    selector: 'mf-avatar',
+                    host: { class: 'inline-flex' },
+                    template: `
+    @if (src(); as url) {
+      <img [src]="url" [alt]="name()" [class]="shapeClasses() + ' object-cover ' + sizeClasses()" />
+    } @else {
+      <span
+        [class]="
+          'inline-flex items-center justify-center ' +
+          shapeClasses() +
+          ' font-medium ' +
+          colorClasses() +
+          ' ' +
+          sizeClasses()
+        "
+      >
+        {{ initials() }}
+      </span>
+    }
+  `,
+                }]
+        }], propDecorators: { name: [{ type: i0.Input, args: [{ isSignal: true, alias: "name", required: true }] }], src: [{ type: i0.Input, args: [{ isSignal: true, alias: "src", required: false }] }], size: [{ type: i0.Input, args: [{ isSignal: true, alias: "size", required: false }] }], shape: [{ type: i0.Input, args: [{ isSignal: true, alias: "shape", required: false }] }], colorful: [{ type: i0.Input, args: [{ isSignal: true, alias: "colorful", required: false }] }], tone: [{ type: i0.Input, args: [{ isSignal: true, alias: "tone", required: false }] }] } });
+
+/**
+ * Generated bundle index. Do not edit.
+ */
+
+export { Avatar };
+//# sourceMappingURL=mesgflow-ui-kit-avatar.mjs.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"mesgflow-ui-kit-avatar.mjs","sources":["../../../projects/ui-kit/avatar/avatar.ts","../../../projects/ui-kit/avatar/mesgflow-ui-kit-avatar.ts"],"sourcesContent":["import { Component, computed, input } from '@angular/core';\r\nimport type { MfTone } from '@mesgflow/ui-kit/core';\r\n\r\nexport type AvatarTone = MfTone;\r\n\r\n/**\r\n * Sadece semantic token'lar, keyfi renk yok — `tone` (sabit) veya `colorful`\r\n * (isme göre) ile seçiliyor. Badge'teki gibi tonal işaret rol token'ı\r\n * (`bg-X-tint text-X-tint-fg`, `color-mix()` tabanlı) — bkz.\r\n * badge.variants.ts'teki gerekçe. `neutral` — marka rengiyle (primary)\r\n * İLİŞKİSİZ bir kişi/varlık için (ör. \"Sistem\", \"Silinmiş kullanıcı\") —\r\n * `MfTone`'un geri kalanıyla tutarlı, kit genelinde her `tone` ekseni\r\n * `neutral`den başlar.\r\n */\r\nconst COLOR_CLASSES: Record<AvatarTone, string> = {\r\n  neutral: 'bg-surface-alt text-fg-muted',\r\n  primary: 'bg-primary-tint text-primary-tint-fg',\r\n  success: 'bg-success-tint text-success-tint-fg',\r\n  warning: 'bg-warning-tint text-warning-tint-fg',\r\n  danger: 'bg-danger-tint text-danger-tint-fg',\r\n  info: 'bg-info-tint text-info-tint-fg',\r\n  help: 'bg-help-tint text-help-tint-fg',\r\n};\r\n/**\r\n * `colorful` hash havuzu BİLEREK `help` HARİÇ eski 6 tonda sabit kalır —\r\n * help yeni bir tondur, havuza eklenirse `hash % length` kayar ve önceden\r\n * `colorful` ile atanmış isimlerin rengi DEĞİŞİR (bkz. plan \"Deep Emerald &\r\n * Slate v2\" madde B — kırılma istenmiyor).\r\n */\r\nconst COLOR_PALETTE = (\r\n  ['neutral', 'primary', 'success', 'warning', 'danger', 'info'] as const satisfies AvatarTone[]\r\n).map((tone) => COLOR_CLASSES[tone]);\r\n\r\nfunction hashString(value: string): number {\r\n  let hash = 0;\r\n  for (let i = 0; i < value.length; i++)\r\n    hash = (Math.imul(hash, 16777619) + value.charCodeAt(i)) >>> 0;\r\n  return hash;\r\n}\r\n\r\n@Component({\r\n  selector: 'mf-avatar',\r\n  host: { class: 'inline-flex' },\r\n  template: `\r\n    @if (src(); as url) {\r\n      <img [src]=\"url\" [alt]=\"name()\" [class]=\"shapeClasses() + ' object-cover ' + sizeClasses()\" />\r\n    } @else {\r\n      <span\r\n        [class]=\"\r\n          'inline-flex items-center justify-center ' +\r\n          shapeClasses() +\r\n          ' font-medium ' +\r\n          colorClasses() +\r\n          ' ' +\r\n          sizeClasses()\r\n        \"\r\n      >\r\n        {{ initials() }}\r\n      </span>\r\n    }\r\n  `,\r\n})\r\nexport class Avatar {\r\n  readonly name = input.required<string>();\r\n  readonly src = input<string | null>(null);\r\n  readonly size = input<'sm' | 'md' | 'lg'>('md');\r\n  readonly shape = input<'round' | 'square'>('round');\r\n  /** Her isim için sabit, farklı bir renk (ör. tenant switcher listesi) — `tone` verilmişse yoksayılır. */\r\n  readonly colorful = input(false);\r\n  /** İsimden bağımsız, hep AYNI sabit renk (ör. tek bir kullanıcının kendi profili) — `colorful`'dan öncelikli. */\r\n  readonly tone = input<AvatarTone | null>(null);\r\n\r\n  protected readonly shapeClasses = computed(() =>\r\n    this.shape() === 'square' ? 'rounded-md' : 'rounded-full',\r\n  );\r\n\r\n  protected readonly colorClasses = computed(() => {\r\n    const tone = this.tone();\r\n    if (tone) return COLOR_CLASSES[tone];\r\n    return this.colorful()\r\n      ? COLOR_PALETTE[hashString(this.name()) % COLOR_PALETTE.length]\r\n      : COLOR_CLASSES.primary;\r\n  });\r\n\r\n  protected readonly initials = computed(() => {\r\n    const parts = this.name().trim().split(/\\s+/).filter(Boolean);\r\n    if (parts.length === 0) return '';\r\n    if (parts.length === 1) return parts[0]!.slice(0, 2).toUpperCase();\r\n    return (parts[0]![0] + parts[parts.length - 1]![0]).toUpperCase();\r\n  });\r\n\r\n  protected readonly sizeClasses = computed(\r\n    () =>\r\n      ({ sm: 'h-7 w-7 text-xs', md: 'h-9 w-9 text-sm', lg: 'h-12 w-12 text-base' })[this.size()],\r\n  );\r\n}\r\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":[],"mappings":";;;AAKA;;;;;;;;AAQG;AACH,MAAM,aAAa,GAA+B;AAChD,IAAA,OAAO,EAAE,8BAA8B;AACvC,IAAA,OAAO,EAAE,sCAAsC;AAC/C,IAAA,OAAO,EAAE,sCAAsC;AAC/C,IAAA,OAAO,EAAE,sCAAsC;AAC/C,IAAA,MAAM,EAAE,oCAAoC;AAC5C,IAAA,IAAI,EAAE,gCAAgC;AACtC,IAAA,IAAI,EAAE,gCAAgC;CACvC;AACD;;;;;AAKG;AACH,MAAM,aAAa,GACjB,CAAC,SAAS,EAAE,SAAS,EAAE,SAAS,EAAE,SAAS,EAAE,QAAQ,EAAE,MAAM,CAC9D,CAAC,GAAG,CAAC,CAAC,IAAI,KAAK,aAAa,CAAC,IAAI,CAAC,CAAC;AAEpC,SAAS,UAAU,CAAC,KAAa,EAAA;IAC/B,IAAI,IAAI,GAAG,CAAC;AACZ,IAAA,KAAK,IAAI,CAAC,GAAG,CAAC,EAAE,CAAC,GAAG,KAAK,CAAC,MAAM,EAAE,CAAC,EAAE;QACnC,IAAI,GAAG,CAAC,IAAI,CAAC,IAAI,CAAC,IAAI,EAAE,QAAQ,CAAC,GAAG,KAAK,CAAC,UAAU,CAAC,CAAC,CAAC,MAAM,CAAC;AAChE,IAAA,OAAO,IAAI;AACb;MAwBa,MAAM,CAAA;IACR,IAAI,GAAG,KAAK,CAAC,QAAQ;6EAAU;IAC/B,GAAG,GAAG,KAAK,CAAgB,IAAI;4EAAC;IAChC,IAAI,GAAG,KAAK,CAAqB,IAAI;6EAAC;IACtC,KAAK,GAAG,KAAK,CAAqB,OAAO;8EAAC;;IAE1C,QAAQ,GAAG,KAAK,CAAC,KAAK;iFAAC;;IAEvB,IAAI,GAAG,KAAK,CAAoB,IAAI;6EAAC;AAE3B,IAAA,YAAY,GAAG,QAAQ,CAAC,MACzC,IAAI,CAAC,KAAK,EAAE,KAAK,QAAQ,GAAG,YAAY,GAAG,cAAc;qFAC1D;AAEkB,IAAA,YAAY,GAAG,QAAQ,CAAC,MAAK;AAC9C,QAAA,MAAM,IAAI,GAAG,IAAI,CAAC,IAAI,EAAE;AACxB,QAAA,IAAI,IAAI;AAAE,YAAA,OAAO,aAAa,CAAC,IAAI,CAAC;QACpC,OAAO,IAAI,CAAC,QAAQ;AAClB,cAAE,aAAa,CAAC,UAAU,CAAC,IAAI,CAAC,IAAI,EAAE,CAAC,GAAG,aAAa,CAAC,MAAM;AAC9D,cAAE,aAAa,CAAC,OAAO;IAC3B,CAAC;qFAAC;AAEiB,IAAA,QAAQ,GAAG,QAAQ,CAAC,MAAK;AAC1C,QAAA,MAAM,KAAK,GAAG,IAAI,CAAC,IAAI,EAAE,CAAC,IAAI,EAAE,CAAC,KAAK,CAAC,KAAK,CAAC,CAAC,MAAM,CAAC,OAAO,CAAC;AAC7D,QAAA,IAAI,KAAK,CAAC,MAAM,KAAK,CAAC;AAAE,YAAA,OAAO,EAAE;AACjC,QAAA,IAAI,KAAK,CAAC,MAAM,KAAK,CAAC;AAAE,YAAA,OAAO,KAAK,CAAC,CAAC,CAAE,CAAC,KAAK,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,WAAW,EAAE;QAClE,OAAO,CAAC,KAAK,CAAC,CAAC,CAAE,CAAC,CAAC,CAAC,GAAG,KAAK,CAAC,KAAK,CAAC,MAAM,GAAG,CAAC,CAAE,CAAC,CAAC,CAAC,EAAE,WAAW,EAAE;IACnE,CAAC;iFAAC;IAEiB,WAAW,GAAG,QAAQ,CACvC,MACE,CAAC,EAAE,EAAE,EAAE,iBAAiB,EAAE,EAAE,EAAE,iBAAiB,EAAE,EAAE,EAAE,qBAAqB,EAAE,EAAE,IAAI,CAAC,IAAI,EAAE,CAAC;oFAC7F;uGAhCU,MAAM,EAAA,IAAA,EAAA,EAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,SAAA,EAAA,CAAA;AAAN,IAAA,OAAA,IAAA,GAAA,EAAA,CAAA,oBAAA,CAAA,EAAA,UAAA,EAAA,QAAA,EAAA,OAAA,EAAA,QAAA,EAAA,IAAA,EAAA,MAAM,EAAA,YAAA,EAAA,IAAA,EAAA,QAAA,EAAA,WAAA,EAAA,MAAA,EAAA,EAAA,IAAA,EAAA,EAAA,iBAAA,EAAA,MAAA,EAAA,UAAA,EAAA,MAAA,EAAA,QAAA,EAAA,IAAA,EAAA,UAAA,EAAA,IAAA,EAAA,iBAAA,EAAA,IAAA,EAAA,EAAA,GAAA,EAAA,EAAA,iBAAA,EAAA,KAAA,EAAA,UAAA,EAAA,KAAA,EAAA,QAAA,EAAA,IAAA,EAAA,UAAA,EAAA,KAAA,EAAA,iBAAA,EAAA,IAAA,EAAA,EAAA,IAAA,EAAA,EAAA,iBAAA,EAAA,MAAA,EAAA,UAAA,EAAA,MAAA,EAAA,QAAA,EAAA,IAAA,EAAA,UAAA,EAAA,KAAA,EAAA,iBAAA,EAAA,IAAA,EAAA,EAAA,KAAA,EAAA,EAAA,iBAAA,EAAA,OAAA,EAAA,UAAA,EAAA,OAAA,EAAA,QAAA,EAAA,IAAA,EAAA,UAAA,EAAA,KAAA,EAAA,iBAAA,EAAA,IAAA,EAAA,EAAA,QAAA,EAAA,EAAA,iBAAA,EAAA,UAAA,EAAA,UAAA,EAAA,UAAA,EAAA,QAAA,EAAA,IAAA,EAAA,UAAA,EAAA,KAAA,EAAA,iBAAA,EAAA,IAAA,EAAA,EAAA,IAAA,EAAA,EAAA,iBAAA,EAAA,MAAA,EAAA,UAAA,EAAA,MAAA,EAAA,QAAA,EAAA,IAAA,EAAA,UAAA,EAAA,KAAA,EAAA,iBAAA,EAAA,IAAA,EAAA,EAAA,EAAA,IAAA,EAAA,EAAA,cAAA,EAAA,aAAA,EAAA,EAAA,QAAA,EAAA,EAAA,EAAA,QAAA,EAnBP,CAAA;;;;;;;;;;;;;;;;;AAiBT,EAAA,CAAA,EAAA,QAAA,EAAA,IAAA,EAAA,CAAA;;2FAEU,MAAM,EAAA,UAAA,EAAA,CAAA;kBAtBlB,SAAS;AAAC,YAAA,IAAA,EAAA,CAAA;AACT,oBAAA,QAAQ,EAAE,WAAW;AACrB,oBAAA,IAAI,EAAE,EAAE,KAAK,EAAE,aAAa,EAAE;AAC9B,oBAAA,QAAQ,EAAE,CAAA;;;;;;;;;;;;;;;;;AAiBT,EAAA,CAAA;AACF,iBAAA;;;AC7DD;;AAEG;;"}

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

@@ -0,0 +1,68 @@
+import * as i0 from '@angular/core';
+import { input, computed, Directive } from '@angular/core';
+import { cn } from '@mesgflow/ui-kit/core';
+import { cva } from 'class-variance-authority';
+
+/**
+ * Kullanıcının beğendiği bir Artifact'teki `.pill` deseni birebir uyarlandı:
+ * mono + büyük harf + geniş harf aralığı + `currentColor` nokta göstergesi
+ * (`before:`). Bu bileşenin kendisi bu tazelemenin imza motiflerinden biri
+ * ("mono mikro-etiket") — `text-eyebrow` token'ı (tokens/typography.css)
+ * TAM OLARAK bu dili konuşmak için var (kalın ağırlık + geniş tracking bir
+ * arada); font-weight/letter-spacing'i elle tekrar YAZMAK yerine doğrudan
+ * o token kullanılıyor (bkz. plan Faz 1d — sm/md artık FONT BOYUTUNDA değil,
+ * sadece dolguda ayrışıyor, ikisi de aynı mikro-etiket ölçeğini paylaşıyor).
+ *
+ * Renkli tonlar rol token'ı `bg-X-tint text-X-tint-fg` kullanır — spec'in
+ * "Soft Tinting" tekniği: `color-mix()` ile rampanın kendi basamağının %12
+ * alfası (light çapa 600, dark çapa 400), metin rampanın 800/400 basamağı.
+ * Rozet her türlü zeminin (kart, tablo satırı, toolbar) üstüne oturabiliyor —
+ * `color-mix` her zeminde AYRI karışıp `check:contrast`'ta dört yüzeyde de
+ * doğrulanıyor (bkz. projects/ui-kit/README.md "Token mimarisi").
+ */
+const badgeVariants = cva('inline-flex items-center gap-1.5 rounded-full font-mono text-eyebrow uppercase ' +
+    "before:block before:h-1.5 before:w-1.5 before:shrink-0 before:rounded-full before:bg-current before:content-['']", {
+    variants: {
+        tone: {
+            neutral: 'bg-surface-alt text-fg-muted',
+            primary: 'bg-primary-tint text-primary-tint-fg',
+            success: 'bg-success-tint text-success-tint-fg',
+            warning: 'bg-warning-tint text-warning-tint-fg',
+            danger: 'bg-danger-tint text-danger-tint-fg',
+            info: 'bg-info-tint text-info-tint-fg',
+            help: 'bg-help-tint text-help-tint-fg',
+        },
+        /** `md` öncekiyle (tek boyutlu dönem) BİREBİR aynı dolgu — `sm` tablo hücresi/chip gibi sık dizilen bağlamlar için. */
+        size: {
+            sm: 'py-0.5 pe-2 ps-1.5',
+            md: 'py-1 pe-2.5 ps-2',
+        },
+    },
+    defaultVariants: { tone: 'neutral', size: 'md' },
+});
+
+/** `<span mfBadge tone="success">Aktif</span>` */
+class Badge {
+    tone = input('neutral', /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "tone" }] : /* istanbul ignore next */ []));
+    size = input('md', /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "size" }] : /* istanbul ignore next */ []));
+    classes = computed(() => cn(badgeVariants({ tone: this.tone(), size: this.size() })), /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "classes" }] : /* istanbul ignore next */ []));
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.6", ngImport: i0, type: Badge, deps: [], target: i0.ɵɵFactoryTarget.Directive });
+    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "22.1.6", type: Badge, isStandalone: true, selector: "span[mfBadge]", inputs: { tone: { classPropertyName: "tone", publicName: "tone", isSignal: true, isRequired: false, transformFunction: null }, size: { classPropertyName: "size", publicName: "size", isSignal: true, isRequired: false, transformFunction: null } }, host: { properties: { "class": "classes()" } }, ngImport: i0 });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.6", ngImport: i0, type: Badge, decorators: [{
+            type: Directive,
+            args: [{
+                    selector: 'span[mfBadge]',
+                    host: { '[class]': 'classes()' },
+                }]
+        }], propDecorators: { tone: [{ type: i0.Input, args: [{ isSignal: true, alias: "tone", required: false }] }], size: [{ type: i0.Input, args: [{ isSignal: true, alias: "size", required: false }] }] } });
+
+/**
+ * Generated bundle index. Do not edit.
+ */
+
+export { Badge, badgeVariants };
+//# sourceMappingURL=mesgflow-ui-kit-badge.mjs.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"mesgflow-ui-kit-badge.mjs","sources":["../../../projects/ui-kit/badge/badge.variants.ts","../../../projects/ui-kit/badge/badge.ts","../../../projects/ui-kit/badge/mesgflow-ui-kit-badge.ts"],"sourcesContent":["import { cva, type VariantProps } from 'class-variance-authority';\r\n\r\n/**\r\n * Kullanıcının beğendiği bir Artifact'teki `.pill` deseni birebir uyarlandı:\r\n * mono + büyük harf + geniş harf aralığı + `currentColor` nokta göstergesi\r\n * (`before:`). Bu bileşenin kendisi bu tazelemenin imza motiflerinden biri\r\n * (\"mono mikro-etiket\") — `text-eyebrow` token'ı (tokens/typography.css)\r\n * TAM OLARAK bu dili konuşmak için var (kalın ağırlık + geniş tracking bir\r\n * arada); font-weight/letter-spacing'i elle tekrar YAZMAK yerine doğrudan\r\n * o token kullanılıyor (bkz. plan Faz 1d — sm/md artık FONT BOYUTUNDA değil,\r\n * sadece dolguda ayrışıyor, ikisi de aynı mikro-etiket ölçeğini paylaşıyor).\r\n *\r\n * Renkli tonlar rol token'ı `bg-X-tint text-X-tint-fg` kullanır — spec'in\r\n * \"Soft Tinting\" tekniği: `color-mix()` ile rampanın kendi basamağının %12\r\n * alfası (light çapa 600, dark çapa 400), metin rampanın 800/400 basamağı.\r\n * Rozet her türlü zeminin (kart, tablo satırı, toolbar) üstüne oturabiliyor —\r\n * `color-mix` her zeminde AYRI karışıp `check:contrast`'ta dört yüzeyde de\r\n * doğrulanıyor (bkz. projects/ui-kit/README.md \"Token mimarisi\").\r\n */\r\nexport const badgeVariants = cva(\r\n  'inline-flex items-center gap-1.5 rounded-full font-mono text-eyebrow uppercase ' +\r\n    \"before:block before:h-1.5 before:w-1.5 before:shrink-0 before:rounded-full before:bg-current before:content-['']\",\r\n  {\r\n    variants: {\r\n      tone: {\r\n        neutral: 'bg-surface-alt text-fg-muted',\r\n        primary: 'bg-primary-tint text-primary-tint-fg',\r\n        success: 'bg-success-tint text-success-tint-fg',\r\n        warning: 'bg-warning-tint text-warning-tint-fg',\r\n        danger: 'bg-danger-tint text-danger-tint-fg',\r\n        info: 'bg-info-tint text-info-tint-fg',\r\n        help: 'bg-help-tint text-help-tint-fg',\r\n      },\r\n      /** `md` öncekiyle (tek boyutlu dönem) BİREBİR aynı dolgu — `sm` tablo hücresi/chip gibi sık dizilen bağlamlar için. */\r\n      size: {\r\n        sm: 'py-0.5 pe-2 ps-1.5',\r\n        md: 'py-1 pe-2.5 ps-2',\r\n      },\r\n    },\r\n    defaultVariants: { tone: 'neutral', size: 'md' },\r\n  },\r\n);\r\n\r\nexport type BadgeTone = VariantProps<typeof badgeVariants>['tone'];\r\nexport type BadgeSize = VariantProps<typeof badgeVariants>['size'];\r\n","import { Directive, computed, input } from '@angular/core';\r\nimport { cn } from '@mesgflow/ui-kit/core';\r\nimport { badgeVariants, type BadgeSize, type BadgeTone } from './badge.variants';\r\n\r\n/** `<span mfBadge tone=\"success\">Aktif</span>` */\r\n@Directive({\r\n  selector: 'span[mfBadge]',\r\n  host: { '[class]': 'classes()' },\r\n})\r\nexport class Badge {\r\n  readonly tone = input<BadgeTone>('neutral');\r\n  readonly size = input<BadgeSize>('md');\r\n  protected readonly classes = computed(() =>\r\n    cn(badgeVariants({ tone: this.tone(), size: this.size() })),\r\n  );\r\n}\r\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":[],"mappings":";;;;;AAEA;;;;;;;;;;;;;;;;AAgBG;AACI,MAAM,aAAa,GAAG,GAAG,CAC9B,iFAAiF;AAC/E,IAAA,kHAAkH,EACpH;AACE,IAAA,QAAQ,EAAE;AACR,QAAA,IAAI,EAAE;AACJ,YAAA,OAAO,EAAE,8BAA8B;AACvC,YAAA,OAAO,EAAE,sCAAsC;AAC/C,YAAA,OAAO,EAAE,sCAAsC;AAC/C,YAAA,OAAO,EAAE,sCAAsC;AAC/C,YAAA,MAAM,EAAE,oCAAoC;AAC5C,YAAA,IAAI,EAAE,gCAAgC;AACtC,YAAA,IAAI,EAAE,gCAAgC;AACvC,SAAA;;AAED,QAAA,IAAI,EAAE;AACJ,YAAA,EAAE,EAAE,oBAAoB;AACxB,YAAA,EAAE,EAAE,kBAAkB;AACvB,SAAA;AACF,KAAA;IACD,eAAe,EAAE,EAAE,IAAI,EAAE,SAAS,EAAE,IAAI,EAAE,IAAI,EAAE;AACjD,CAAA;;ACpCH;MAKa,KAAK,CAAA;IACP,IAAI,GAAG,KAAK,CAAY,SAAS;6EAAC;IAClC,IAAI,GAAG,KAAK,CAAY,IAAI;6EAAC;IACnB,OAAO,GAAG,QAAQ,CAAC,MACpC,EAAE,CAAC,aAAa,CAAC,EAAE,IAAI,EAAE,IAAI,CAAC,IAAI,EAAE,EAAE,IAAI,EAAE,IAAI,CAAC,IAAI,EAAE,EAAE,CAAC,CAAC;gFAC5D;uGALU,KAAK,EAAA,IAAA,EAAA,EAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,SAAA,EAAA,CAAA;2FAAL,KAAK,EAAA,YAAA,EAAA,IAAA,EAAA,QAAA,EAAA,eAAA,EAAA,MAAA,EAAA,EAAA,IAAA,EAAA,EAAA,iBAAA,EAAA,MAAA,EAAA,UAAA,EAAA,MAAA,EAAA,QAAA,EAAA,IAAA,EAAA,UAAA,EAAA,KAAA,EAAA,iBAAA,EAAA,IAAA,EAAA,EAAA,IAAA,EAAA,EAAA,iBAAA,EAAA,MAAA,EAAA,UAAA,EAAA,MAAA,EAAA,QAAA,EAAA,IAAA,EAAA,UAAA,EAAA,KAAA,EAAA,iBAAA,EAAA,IAAA,EAAA,EAAA,EAAA,IAAA,EAAA,EAAA,UAAA,EAAA,EAAA,OAAA,EAAA,WAAA,EAAA,EAAA,EAAA,QAAA,EAAA,EAAA,EAAA,CAAA;;2FAAL,KAAK,EAAA,UAAA,EAAA,CAAA;kBAJjB,SAAS;AAAC,YAAA,IAAA,EAAA,CAAA;AACT,oBAAA,QAAQ,EAAE,eAAe;AACzB,oBAAA,IAAI,EAAE,EAAE,SAAS,EAAE,WAAW,EAAE;AACjC,iBAAA;;;ACRD;;AAEG;;"}

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

@@ -0,0 +1,111 @@
+import * as i0 from '@angular/core';
+import { input, booleanAttribute, model, output, inject, computed, afterNextRender, Component } from '@angular/core';
+import { MF_ALERT_LABELS, cn } from '@mesgflow/ui-kit/core';
+import { Icon } from '@mesgflow/ui-kit/icon';
+
+const TINT = {
+    neutral: 'border-border bg-surface-alt text-fg',
+    primary: 'border-accent/30 bg-primary-tint text-primary-tint-fg',
+    success: 'border-success/30 bg-success-tint text-success-tint-fg',
+    warning: 'border-warning/30 bg-warning-tint text-warning-tint-fg',
+    danger: 'border-danger/30 bg-danger-tint text-danger-tint-fg',
+    info: 'border-info/30 bg-info-tint text-info-tint-fg',
+    help: 'border-help/30 bg-help-tint text-help-tint-fg',
+};
+/** Dolu zemin/ön plan çiftleri `check:contrast`'ta doğrulanır (fill + fill-fg). */
+const FILL = {
+    neutral: 'border-transparent bg-neutral-fill text-neutral-fill-fg',
+    primary: 'border-transparent bg-accent-fill text-fg-on-accent',
+    success: 'border-transparent bg-success-fill text-success-fill-fg',
+    warning: 'border-transparent bg-warning-fill text-warning-fill-fg',
+    danger: 'border-transparent bg-danger-fill text-danger-fill-fg',
+    info: 'border-transparent bg-info-fill text-info-fill-fg',
+    help: 'border-transparent bg-help-fill text-help-fill-fg',
+};
+const STORAGE_PREFIX = 'mf-banner-dismissed:';
+/**
+ * `<mf-banner tone="primary" appearance="fill" icon="campaign" dismissible dismissKey="v0.5">
+ *    Yeni sürüm yayında. <a href="/changelog">Neler değişti?</a>
+ *    <button mfButton size="sm" action>Güncelle</button>
+ *  </mf-banner>`
+ *
+ * Sayfanın/bölümün üst kenarında tam genişlik duyuru şeridi — `Alert`'ten farkı: kart değil
+ * kenardan kenara şerit, alt kenarlık; `fill` görünümü marka/durum rengiyle dolu. İçerideki
+ * bağlantılar metin rengini devralır ve altı çizilir (dolu zeminde `mfLink`'in marka rengi
+ * kontrastı bozardı). Eylem düğmesi `[action]` slotuna.
+ *
+ * `dismissKey` verilirse kapatma bu tarayıcıda hatırlanır (`localStorage`) — duyuru bir daha
+ * gösterilmez; depolama erişilemezse (gizli pencere) sessizce yalnızca oturumluk kapanır.
+ * Varsayılan olarak `role` YOK (statik duyuru); sonradan beliren, duyurulması gereken bir
+ * şerit için `announce` → `role="status"`.
+ */
+class Banner {
+    tone = input('primary', /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "tone" }] : /* istanbul ignore next */ []));
+    appearance = input('tint', /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "appearance" }] : /* istanbul ignore next */ []));
+    icon = input(null, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "icon" }] : /* istanbul ignore next */ []));
+    align = input('start', /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "align" }] : /* istanbul ignore next */ []));
+    dismissible = input(false, { ...(ngDevMode ? { debugName: "dismissible" } : /* istanbul ignore next */ {}), transform: booleanAttribute });
+    /** Kalıcı kapatma anahtarı — değiştirmek (ör. sürüm) duyuruyu yeniden gösterir. */
+    dismissKey = input(/* @ts-ignore */
+    ...(ngDevMode ? [undefined, { debugName: "dismissKey" }] : /* istanbul ignore next */ []));
+    announce = input(false, { ...(ngDevMode ? { debugName: "announce" } : /* istanbul ignore next */ {}), transform: booleanAttribute });
+    open = model(true, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "open" }] : /* istanbul ignore next */ []));
+    dismissed = output();
+    labels = inject(MF_ALERT_LABELS);
+    hostClasses = computed(() => cn('block border-b text-sm [&_a]:font-medium [&_a]:text-current [&_a]:underline [&_a]:underline-offset-2', this.appearance() === 'fill' ? FILL[this.tone()] : TINT[this.tone()], 
+    // [hidden] değil: `block` sınıfı UA'nın display:none'unu ezerdi.
+    !this.open() && 'hidden'), /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "hostClasses" }] : /* istanbul ignore next */ []));
+    constructor() {
+        // Tarayıcıda, ilk çizimden sonra — SSR'de depolama yok.
+        afterNextRender(() => {
+            const key = this.dismissKey();
+            if (key && readDismissed(key))
+                this.open.set(false);
+        });
+    }
+    dismiss() {
+        const key = this.dismissKey();
+        if (key)
+            writeDismissed(key);
+        this.open.set(false);
+        this.dismissed.emit();
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.6", ngImport: i0, type: Banner, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.1.6", type: Banner, isStandalone: true, selector: "mf-banner", inputs: { tone: { classPropertyName: "tone", publicName: "tone", isSignal: true, isRequired: false, transformFunction: null }, appearance: { classPropertyName: "appearance", publicName: "appearance", isSignal: true, isRequired: false, transformFunction: null }, icon: { classPropertyName: "icon", publicName: "icon", isSignal: true, isRequired: false, transformFunction: null }, align: { classPropertyName: "align", publicName: "align", isSignal: true, isRequired: false, transformFunction: null }, dismissible: { classPropertyName: "dismissible", publicName: "dismissible", isSignal: true, isRequired: false, transformFunction: null }, dismissKey: { classPropertyName: "dismissKey", publicName: "dismissKey", isSignal: true, isRequired: false, transformFunction: null }, announce: { classPropertyName: "announce", publicName: "announce", isSignal: true, isRequired: false, transformFunction: null }, open: { classPropertyName: "open", publicName: "open", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { open: "openChange", dismissed: "dismissed" }, host: { properties: { "class": "hostClasses()", "attr.role": "announce() ? 'status' : null" } }, exportAs: ["mfBanner"], ngImport: i0, template: "<div\r\n  class=\"mx-auto flex min-h-11 flex-wrap items-center gap-x-3 gap-y-2 px-4 py-2\"\r\n  [class.justify-center]=\"align() === 'center'\"\r\n>\r\n  @if (icon()) {\r\n    <span mfIcon [size]=\"18\" class=\"shrink-0\">{{ icon() }}</span>\r\n  }\r\n  <div\r\n    class=\"min-w-0\"\r\n    [class.flex-1]=\"align() === 'start'\"\r\n    [class.text-center]=\"align() === 'center'\"\r\n  >\r\n    <ng-content />\r\n  </div>\r\n  <ng-content select=\"[action]\" />\r\n  @if (dismissible()) {\r\n    <button\r\n      type=\"button\"\r\n      class=\"-me-2 inline-flex size-8 shrink-0 cursor-pointer appearance-none items-center justify-center rounded-md border-0 bg-transparent text-current transition-colors duration-fast ease-emphasis hover:bg-current/10 focus-visible:outline focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-current\"\r\n      [attr.aria-label]=\"labels().dismiss\"\r\n      (click)=\"dismiss()\"\r\n    >\r\n      <span mfIcon [size]=\"18\">close</span>\r\n    </button>\r\n  }\r\n</div>\r\n", dependencies: [{ kind: "directive", type: Icon, selector: "span[mfIcon]", inputs: ["size", "filled"] }] });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.6", ngImport: i0, type: Banner, decorators: [{
+            type: Component,
+            args: [{ selector: 'mf-banner', exportAs: 'mfBanner', imports: [Icon], host: {
+                        '[class]': 'hostClasses()',
+                        '[attr.role]': "announce() ? 'status' : null",
+                    }, template: "<div\r\n  class=\"mx-auto flex min-h-11 flex-wrap items-center gap-x-3 gap-y-2 px-4 py-2\"\r\n  [class.justify-center]=\"align() === 'center'\"\r\n>\r\n  @if (icon()) {\r\n    <span mfIcon [size]=\"18\" class=\"shrink-0\">{{ icon() }}</span>\r\n  }\r\n  <div\r\n    class=\"min-w-0\"\r\n    [class.flex-1]=\"align() === 'start'\"\r\n    [class.text-center]=\"align() === 'center'\"\r\n  >\r\n    <ng-content />\r\n  </div>\r\n  <ng-content select=\"[action]\" />\r\n  @if (dismissible()) {\r\n    <button\r\n      type=\"button\"\r\n      class=\"-me-2 inline-flex size-8 shrink-0 cursor-pointer appearance-none items-center justify-center rounded-md border-0 bg-transparent text-current transition-colors duration-fast ease-emphasis hover:bg-current/10 focus-visible:outline focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-current\"\r\n      [attr.aria-label]=\"labels().dismiss\"\r\n      (click)=\"dismiss()\"\r\n    >\r\n      <span mfIcon [size]=\"18\">close</span>\r\n    </button>\r\n  }\r\n</div>\r\n" }]
+        }], ctorParameters: () => [], propDecorators: { tone: [{ type: i0.Input, args: [{ isSignal: true, alias: "tone", required: false }] }], appearance: [{ type: i0.Input, args: [{ isSignal: true, alias: "appearance", required: false }] }], icon: [{ type: i0.Input, args: [{ isSignal: true, alias: "icon", required: false }] }], align: [{ type: i0.Input, args: [{ isSignal: true, alias: "align", required: false }] }], dismissible: [{ type: i0.Input, args: [{ isSignal: true, alias: "dismissible", required: false }] }], dismissKey: [{ type: i0.Input, args: [{ isSignal: true, alias: "dismissKey", required: false }] }], announce: [{ type: i0.Input, args: [{ isSignal: true, alias: "announce", required: false }] }], open: [{ type: i0.Input, args: [{ isSignal: true, alias: "open", required: false }] }, { type: i0.Output, args: ["openChange"] }], dismissed: [{ type: i0.Output, args: ["dismissed"] }] } });
+function readDismissed(key) {
+    try {
+        return localStorage.getItem(STORAGE_PREFIX + key) === '1';
+    }
+    catch {
+        return false;
+    }
+}
+function writeDismissed(key) {
+    try {
+        localStorage.setItem(STORAGE_PREFIX + key, '1');
+    }
+    catch {
+        // Gizli pencere / engellenmiş depolama — yalnızca bu oturumda kapanır.
+    }
+}
+
+/**
+ * Generated bundle index. Do not edit.
+ */
+
+export { Banner };
+//# sourceMappingURL=mesgflow-ui-kit-banner.mjs.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"mesgflow-ui-kit-banner.mjs","sources":["../../../projects/ui-kit/banner/banner.ts","../../../projects/ui-kit/banner/banner.html","../../../projects/ui-kit/banner/mesgflow-ui-kit-banner.ts"],"sourcesContent":["import {\r\n  Component,\r\n  afterNextRender,\r\n  booleanAttribute,\r\n  computed,\r\n  inject,\r\n  input,\r\n  model,\r\n  output,\r\n} from '@angular/core';\r\nimport { MF_ALERT_LABELS, cn, type MfTone } from '@mesgflow/ui-kit/core';\r\nimport { Icon } from '@mesgflow/ui-kit/icon';\r\n\r\nexport type BannerAppearance = 'tint' | 'fill';\r\n\r\nconst TINT: Record<MfTone, string> = {\r\n  neutral: 'border-border bg-surface-alt text-fg',\r\n  primary: 'border-accent/30 bg-primary-tint text-primary-tint-fg',\r\n  success: 'border-success/30 bg-success-tint text-success-tint-fg',\r\n  warning: 'border-warning/30 bg-warning-tint text-warning-tint-fg',\r\n  danger: 'border-danger/30 bg-danger-tint text-danger-tint-fg',\r\n  info: 'border-info/30 bg-info-tint text-info-tint-fg',\r\n  help: 'border-help/30 bg-help-tint text-help-tint-fg',\r\n};\r\n\r\n/** Dolu zemin/ön plan çiftleri `check:contrast`'ta doğrulanır (fill + fill-fg). */\r\nconst FILL: Record<MfTone, string> = {\r\n  neutral: 'border-transparent bg-neutral-fill text-neutral-fill-fg',\r\n  primary: 'border-transparent bg-accent-fill text-fg-on-accent',\r\n  success: 'border-transparent bg-success-fill text-success-fill-fg',\r\n  warning: 'border-transparent bg-warning-fill text-warning-fill-fg',\r\n  danger: 'border-transparent bg-danger-fill text-danger-fill-fg',\r\n  info: 'border-transparent bg-info-fill text-info-fill-fg',\r\n  help: 'border-transparent bg-help-fill text-help-fill-fg',\r\n};\r\n\r\nconst STORAGE_PREFIX = 'mf-banner-dismissed:';\r\n\r\n/**\r\n * `<mf-banner tone=\"primary\" appearance=\"fill\" icon=\"campaign\" dismissible dismissKey=\"v0.5\">\r\n *    Yeni sürüm yayında. <a href=\"/changelog\">Neler değişti?</a>\r\n *    <button mfButton size=\"sm\" action>Güncelle</button>\r\n *  </mf-banner>`\r\n *\r\n * Sayfanın/bölümün üst kenarında tam genişlik duyuru şeridi — `Alert`'ten farkı: kart değil\r\n * kenardan kenara şerit, alt kenarlık; `fill` görünümü marka/durum rengiyle dolu. İçerideki\r\n * bağlantılar metin rengini devralır ve altı çizilir (dolu zeminde `mfLink`'in marka rengi\r\n * kontrastı bozardı). Eylem düğmesi `[action]` slotuna.\r\n *\r\n * `dismissKey` verilirse kapatma bu tarayıcıda hatırlanır (`localStorage`) — duyuru bir daha\r\n * gösterilmez; depolama erişilemezse (gizli pencere) sessizce yalnızca oturumluk kapanır.\r\n * Varsayılan olarak `role` YOK (statik duyuru); sonradan beliren, duyurulması gereken bir\r\n * şerit için `announce` → `role=\"status\"`.\r\n */\r\n@Component({\r\n  selector: 'mf-banner',\r\n  exportAs: 'mfBanner',\r\n  imports: [Icon],\r\n  host: {\r\n    '[class]': 'hostClasses()',\r\n    '[attr.role]': \"announce() ? 'status' : null\",\r\n  },\r\n  templateUrl: './banner.html',\r\n})\r\nexport class Banner {\r\n  readonly tone = input<MfTone>('primary');\r\n  readonly appearance = input<BannerAppearance>('tint');\r\n  readonly icon = input<string | null>(null);\r\n  readonly align = input<'start' | 'center'>('start');\r\n  readonly dismissible = input(false, { transform: booleanAttribute });\r\n  /** Kalıcı kapatma anahtarı — değiştirmek (ör. sürüm) duyuruyu yeniden gösterir. */\r\n  readonly dismissKey = input<string>();\r\n  readonly announce = input(false, { transform: booleanAttribute });\r\n  readonly open = model(true);\r\n\r\n  readonly dismissed = output<void>();\r\n\r\n  protected readonly labels = inject(MF_ALERT_LABELS);\r\n\r\n  protected readonly hostClasses = computed(() =>\r\n    cn(\r\n      'block border-b text-sm [&_a]:font-medium [&_a]:text-current [&_a]:underline [&_a]:underline-offset-2',\r\n      this.appearance() === 'fill' ? FILL[this.tone()] : TINT[this.tone()],\r\n      // [hidden] değil: `block` sınıfı UA'nın display:none'unu ezerdi.\r\n      !this.open() && 'hidden',\r\n    ),\r\n  );\r\n\r\n  constructor() {\r\n    // Tarayıcıda, ilk çizimden sonra — SSR'de depolama yok.\r\n    afterNextRender(() => {\r\n      const key = this.dismissKey();\r\n      if (key && readDismissed(key)) this.open.set(false);\r\n    });\r\n  }\r\n\r\n  protected dismiss(): void {\r\n    const key = this.dismissKey();\r\n    if (key) writeDismissed(key);\r\n    this.open.set(false);\r\n    this.dismissed.emit();\r\n  }\r\n}\r\n\r\nfunction readDismissed(key: string): boolean {\r\n  try {\r\n    return localStorage.getItem(STORAGE_PREFIX + key) === '1';\r\n  } catch {\r\n    return false;\r\n  }\r\n}\r\n\r\nfunction writeDismissed(key: string): void {\r\n  try {\r\n    localStorage.setItem(STORAGE_PREFIX + key, '1');\r\n  } catch {\r\n    // Gizli pencere / engellenmiş depolama — yalnızca bu oturumda kapanır.\r\n  }\r\n}\r\n","<div\r\n  class=\"mx-auto flex min-h-11 flex-wrap items-center gap-x-3 gap-y-2 px-4 py-2\"\r\n  [class.justify-center]=\"align() === 'center'\"\r\n>\r\n  @if (icon()) {\r\n    <span mfIcon [size]=\"18\" class=\"shrink-0\">{{ icon() }}</span>\r\n  }\r\n  <div\r\n    class=\"min-w-0\"\r\n    [class.flex-1]=\"align() === 'start'\"\r\n    [class.text-center]=\"align() === 'center'\"\r\n  >\r\n    <ng-content />\r\n  </div>\r\n  <ng-content select=\"[action]\" />\r\n  @if (dismissible()) {\r\n    <button\r\n      type=\"button\"\r\n      class=\"-me-2 inline-flex size-8 shrink-0 cursor-pointer appearance-none items-center justify-center rounded-md border-0 bg-transparent text-current transition-colors duration-fast ease-emphasis hover:bg-current/10 focus-visible:outline focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-current\"\r\n      [attr.aria-label]=\"labels().dismiss\"\r\n      (click)=\"dismiss()\"\r\n    >\r\n      <span mfIcon [size]=\"18\">close</span>\r\n    </button>\r\n  }\r\n</div>\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-box-input.mjs

@@ -0,0 +1,78 @@
+import * as i0 from '@angular/core';
+import { model, input, signal, inject, computed, forwardRef, Component } from '@angular/core';
+import { NG_VALUE_ACCESSOR } from '@angular/forms';
+import { ValueAccessorBase, MF_BOX_INPUT_LABELS } from '@mesgflow/ui-kit/core';
+import { Icon } from '@mesgflow/ui-kit/icon';
+import { NumberInput } from '@mesgflow/ui-kit/number-input';
+
+const SIDES = ['top', 'right', 'bottom', 'left'];
+/**
+ * `<mf-box-input [(value)]="padding" unit="px" />` — 4 kenar (padding/
+ * margin/border) kutu-model girdisi. Bağlantılı mod (varsayılan AÇIK): tek
+ * input değiştirmek dördünü BİRDEN değiştirir — zincir ikonuna tıklayınca
+ * kenarlar bağımsızlaşır (kenarı ayırırken mevcut `top` değeri dördüne
+ * BASILMAZ — sadece tekrar bağlarken senkronlanır). `NumberInput` üstüne
+ * kompoze edilmiş bir COMPONENT (gerçek iç yapı — bkz. README "Directive mi,
+ * component mi?").
+ */
+class BoxInput extends ValueAccessorBase {
+    value = model({ top: 0, right: 0, bottom: 0, left: 0 }, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "value" }] : /* istanbul ignore next */ []));
+    unit = input('px', /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "unit" }] : /* istanbul ignore next */ []));
+    min = input(0, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "min" }] : /* istanbul ignore next */ []));
+    max = input(null, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "max" }] : /* istanbul ignore next */ []));
+    disabled = input(false, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "disabled" }] : /* istanbul ignore next */ []));
+    linked = signal(true, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "linked" }] : /* istanbul ignore next */ []));
+    sides = SIDES;
+    boxInputLabels = inject(MF_BOX_INPUT_LABELS);
+    sideLabels = computed(() => {
+        const labels = this.boxInputLabels();
+        return { top: labels.top, right: labels.right, bottom: labels.bottom, left: labels.left };
+    }, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "sideLabels" }] : /* istanbul ignore next */ []));
+    linkToggleTitle = computed(() => this.linked() ? this.boxInputLabels().unlinkSides : this.boxInputLabels().linkSides, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "linkToggleTitle" }] : /* istanbul ignore next */ []));
+    writeValue(value) {
+        this.value.set(value);
+    }
+    sideValue(side) {
+        return this.value()[side];
+    }
+    setSide(side, next) {
+        const n = next ?? 0;
+        if (this.linked()) {
+            this.value.set({ top: n, right: n, bottom: n, left: n });
+        }
+        else {
+            this.value.update((v) => ({ ...v, [side]: n }));
+        }
+        this.onChange(this.value());
+        this.onTouched();
+    }
+    toggleLinked() {
+        this.linked.update((v) => !v);
+        if (this.linked()) {
+            const t = this.value().top;
+            this.value.set({ top: t, right: t, bottom: t, left: t });
+            this.onChange(this.value());
+        }
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.6", ngImport: i0, type: BoxInput, deps: null, target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.1.6", type: BoxInput, isStandalone: true, selector: "mf-box-input", inputs: { value: { classPropertyName: "value", publicName: "value", isSignal: true, isRequired: false, transformFunction: null }, unit: { classPropertyName: "unit", publicName: "unit", isSignal: true, isRequired: false, transformFunction: null }, min: { classPropertyName: "min", publicName: "min", isSignal: true, isRequired: false, transformFunction: null }, max: { classPropertyName: "max", publicName: "max", isSignal: true, isRequired: false, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { value: "valueChange" }, host: { classAttribute: "block" }, providers: [{ provide: NG_VALUE_ACCESSOR, useExisting: forwardRef(() => BoxInput), multi: true }], usesInheritance: true, ngImport: i0, template: "<div class=\"inline-flex items-end gap-1.5\">\r\n  @for (side of sides; track side) {\r\n    <div class=\"flex flex-col items-center gap-1\">\r\n      <span class=\"text-xs text-fg-subtle\">{{ sideLabels()[side] }}</span>\r\n      <mf-number-input\r\n        class=\"w-20\"\r\n        [value]=\"sideValue(side)\"\r\n        (valueChange)=\"setSide(side, $event)\"\r\n        [min]=\"min()\"\r\n        [max]=\"max()\"\r\n        [unit]=\"unit()\"\r\n        [ariaLabel]=\"sideLabels()[side]\"\r\n        [disabled]=\"disabled()\"\r\n      />\r\n    </div>\r\n  }\r\n  <button\r\n    type=\"button\"\r\n    class=\"mb-0.5 flex h-9 w-9 shrink-0 items-center justify-center rounded-md border border-border bg-surface text-fg-subtle transition-colors duration-fast ease-emphasis hover:bg-surface-alt focus-visible:outline focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-focus-ring disabled:pointer-events-none disabled:opacity-50\"\r\n    [class.text-accent]=\"linked()\"\r\n    [class.border-accent]=\"linked()\"\r\n    [disabled]=\"disabled()\"\r\n    (click)=\"toggleLinked()\"\r\n    [attr.aria-pressed]=\"linked()\"\r\n    [attr.title]=\"linkToggleTitle()\"\r\n  >\r\n    <span mfIcon [size]=\"16\">{{ linked() ? 'link' : 'link_off' }}</span>\r\n  </button>\r\n</div>\r\n", dependencies: [{ kind: "component", type: NumberInput, selector: "mf-number-input", inputs: ["value", "min", "max", "step", "unit", "disabled", "hasError", "ariaLabel"], outputs: ["valueChange"], exportAs: ["mfNumberInput"] }, { kind: "directive", type: Icon, selector: "span[mfIcon]", inputs: ["size", "filled"] }] });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.6", ngImport: i0, type: BoxInput, decorators: [{
+            type: Component,
+            args: [{ selector: 'mf-box-input', imports: [NumberInput, Icon], host: { class: 'block' }, providers: [{ provide: NG_VALUE_ACCESSOR, useExisting: forwardRef(() => BoxInput), multi: true }], template: "<div class=\"inline-flex items-end gap-1.5\">\r\n  @for (side of sides; track side) {\r\n    <div class=\"flex flex-col items-center gap-1\">\r\n      <span class=\"text-xs text-fg-subtle\">{{ sideLabels()[side] }}</span>\r\n      <mf-number-input\r\n        class=\"w-20\"\r\n        [value]=\"sideValue(side)\"\r\n        (valueChange)=\"setSide(side, $event)\"\r\n        [min]=\"min()\"\r\n        [max]=\"max()\"\r\n        [unit]=\"unit()\"\r\n        [ariaLabel]=\"sideLabels()[side]\"\r\n        [disabled]=\"disabled()\"\r\n      />\r\n    </div>\r\n  }\r\n  <button\r\n    type=\"button\"\r\n    class=\"mb-0.5 flex h-9 w-9 shrink-0 items-center justify-center rounded-md border border-border bg-surface text-fg-subtle transition-colors duration-fast ease-emphasis hover:bg-surface-alt focus-visible:outline focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-focus-ring disabled:pointer-events-none disabled:opacity-50\"\r\n    [class.text-accent]=\"linked()\"\r\n    [class.border-accent]=\"linked()\"\r\n    [disabled]=\"disabled()\"\r\n    (click)=\"toggleLinked()\"\r\n    [attr.aria-pressed]=\"linked()\"\r\n    [attr.title]=\"linkToggleTitle()\"\r\n  >\r\n    <span mfIcon [size]=\"16\">{{ linked() ? 'link' : 'link_off' }}</span>\r\n  </button>\r\n</div>\r\n" }]
+        }], propDecorators: { value: [{ type: i0.Input, args: [{ isSignal: true, alias: "value", required: false }] }, { type: i0.Output, args: ["valueChange"] }], unit: [{ type: i0.Input, args: [{ isSignal: true, alias: "unit", required: false }] }], min: [{ type: i0.Input, args: [{ isSignal: true, alias: "min", required: false }] }], max: [{ type: i0.Input, args: [{ isSignal: true, alias: "max", required: false }] }], disabled: [{ type: i0.Input, args: [{ isSignal: true, alias: "disabled", required: false }] }] } });
+
+/**
+ * Generated bundle index. Do not edit.
+ */
+
+export { BoxInput };
+//# sourceMappingURL=mesgflow-ui-kit-box-input.mjs.map

package/fesm2022/mesgflow-ui-kit-box-input.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"mesgflow-ui-kit-box-input.mjs","sources":["../../../projects/ui-kit/box-input/box-input.ts","../../../projects/ui-kit/box-input/box-input.html","../../../projects/ui-kit/box-input/mesgflow-ui-kit-box-input.ts"],"sourcesContent":["import { Component, computed, forwardRef, inject, input, model, signal } from '@angular/core';\r\nimport { NG_VALUE_ACCESSOR, type ControlValueAccessor } from '@angular/forms';\r\nimport { MF_BOX_INPUT_LABELS, ValueAccessorBase } from '@mesgflow/ui-kit/core';\r\nimport { Icon } from '@mesgflow/ui-kit/icon';\r\nimport { NumberInput } from '@mesgflow/ui-kit/number-input';\r\n\r\nexport interface BoxValue {\r\n  top: number;\r\n  right: number;\r\n  bottom: number;\r\n  left: number;\r\n}\r\n\r\nconst SIDES: (keyof BoxValue)[] = ['top', 'right', 'bottom', 'left'];\r\n\r\n/**\r\n * `<mf-box-input [(value)]=\"padding\" unit=\"px\" />` — 4 kenar (padding/\r\n * margin/border) kutu-model girdisi. Bağlantılı mod (varsayılan AÇIK): tek\r\n * input değiştirmek dördünü BİRDEN değiştirir — zincir ikonuna tıklayınca\r\n * kenarlar bağımsızlaşır (kenarı ayırırken mevcut `top` değeri dördüne\r\n * BASILMAZ — sadece tekrar bağlarken senkronlanır). `NumberInput` üstüne\r\n * kompoze edilmiş bir COMPONENT (gerçek iç yapı — bkz. README \"Directive mi,\r\n * component mi?\").\r\n */\r\n@Component({\r\n  selector: 'mf-box-input',\r\n  imports: [NumberInput, Icon],\r\n  host: { class: 'block' },\r\n  templateUrl: './box-input.html',\r\n  providers: [{ provide: NG_VALUE_ACCESSOR, useExisting: forwardRef(() => BoxInput), multi: true }],\r\n})\r\nexport class BoxInput extends ValueAccessorBase<BoxValue> implements ControlValueAccessor {\r\n  readonly value = model<BoxValue>({ top: 0, right: 0, bottom: 0, left: 0 });\r\n  readonly unit = input('px');\r\n  readonly min = input(0);\r\n  readonly max = input<number | null>(null);\r\n  readonly disabled = input(false);\r\n\r\n  protected readonly linked = signal(true);\r\n  protected readonly sides = SIDES;\r\n\r\n  private readonly boxInputLabels = inject(MF_BOX_INPUT_LABELS);\r\n  protected readonly sideLabels = computed(() => {\r\n    const labels = this.boxInputLabels();\r\n    return { top: labels.top, right: labels.right, bottom: labels.bottom, left: labels.left };\r\n  });\r\n  protected readonly linkToggleTitle = computed(() =>\r\n    this.linked() ? this.boxInputLabels().unlinkSides : this.boxInputLabels().linkSides,\r\n  );\r\n\r\n  writeValue(value: BoxValue): void {\r\n    this.value.set(value);\r\n  }\r\n\r\n  protected sideValue(side: keyof BoxValue): number {\r\n    return this.value()[side];\r\n  }\r\n\r\n  protected setSide(side: keyof BoxValue, next: number | null): void {\r\n    const n = next ?? 0;\r\n    if (this.linked()) {\r\n      this.value.set({ top: n, right: n, bottom: n, left: n });\r\n    } else {\r\n      this.value.update((v) => ({ ...v, [side]: n }));\r\n    }\r\n    this.onChange(this.value());\r\n    this.onTouched();\r\n  }\r\n\r\n  protected toggleLinked(): void {\r\n    this.linked.update((v) => !v);\r\n    if (this.linked()) {\r\n      const t = this.value().top;\r\n      this.value.set({ top: t, right: t, bottom: t, left: t });\r\n      this.onChange(this.value());\r\n    }\r\n  }\r\n}\r\n","<div class=\"inline-flex items-end gap-1.5\">\r\n  @for (side of sides; track side) {\r\n    <div class=\"flex flex-col items-center gap-1\">\r\n      <span class=\"text-xs text-fg-subtle\">{{ sideLabels()[side] }}</span>\r\n      <mf-number-input\r\n        class=\"w-20\"\r\n        [value]=\"sideValue(side)\"\r\n        (valueChange)=\"setSide(side, $event)\"\r\n        [min]=\"min()\"\r\n        [max]=\"max()\"\r\n        [unit]=\"unit()\"\r\n        [ariaLabel]=\"sideLabels()[side]\"\r\n        [disabled]=\"disabled()\"\r\n      />\r\n    </div>\r\n  }\r\n  <button\r\n    type=\"button\"\r\n    class=\"mb-0.5 flex h-9 w-9 shrink-0 items-center justify-center rounded-md border border-border bg-surface text-fg-subtle transition-colors duration-fast ease-emphasis hover:bg-surface-alt focus-visible:outline focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-focus-ring disabled:pointer-events-none disabled:opacity-50\"\r\n    [class.text-accent]=\"linked()\"\r\n    [class.border-accent]=\"linked()\"\r\n    [disabled]=\"disabled()\"\r\n    (click)=\"toggleLinked()\"\r\n    [attr.aria-pressed]=\"linked()\"\r\n    [attr.title]=\"linkToggleTitle()\"\r\n  >\r\n    <span mfIcon [size]=\"16\">{{ linked() ? 'link' : 'link_off' }}</span>\r\n  </button>\r\n</div>\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-brand.mjs

@@ -0,0 +1,120 @@
+import * as i0 from '@angular/core';
+import { input, computed, Component } from '@angular/core';
+
+/**
+ * `<mf-brand [name]="i18n().auth.layout.brandName" />`
+ *
+ * Marka işareti TEK kaynağa indirildi — daha önce üç ayrı yerde üç farklı
+ * şey vardı: auth masaüstü panelinde sabit kodlu "MF", mobil auth bloğunda
+ * ve layout sidebar'ında sabit kodlu "N", sidebar'da ayrıca `bg-teal-600`
+ * (eski marka rengi, köşeli/`rounded-*` olmayan bir kare). İşaret artık
+ * `name()`'in İLK HARFİNDEN türetiliyor — `brandName` çevirisi değişse bile
+ * bir daha asenkron/bayat kalamaz.
+ *
+ * `labelTone="auto"` (varsayılan) isim metnini moda-duyarlı `text-fg` ile
+ * boyar — ama auth-layout'un sol paneli gibi TEMADAN BAĞIMSIZ hep koyu kalan
+ * zeminlerde bu YANLIŞ: light modda `text-fg` koyu metne döner, koyu panel
+ * üstünde görünmez olur (gerçek bug, tarayıcıda yakalandı). O bağlamlarda
+ * `labelTone="light"` ver — sabit beyaz metin, moddan bağımsız. Simetrik
+ * olarak `labelTone="dark"` — sabit koyu (`primary-900`) metin, TEMADAN
+ * BAĞIMSIZ hep AÇIK kalan zeminler için (`appearance="brand-light"` sidebar
+ * gibi): `auto` orada da YANLIŞ olurdu — dark site modunda `text-fg` açık
+ * renge döner, ki zemin (primary-100) hep açık kaldığından metin kaybolurdu.
+ *
+ * İşaret zemini `bg-accent-fill` — Sidebar `appearance="brand"` içine
+ * (`[brand]` slotu ile) projelendiğinde bu artık primary-900'e (kök
+ * sidebar'la AYNI zemin) denk düşer, işaret kaybolurdu. `group-data-
+ * [appearance=brand]/sidebar:` varyantı (özgüllük 0,2,0, `bg-accent-fill`in
+ * 0,1,0'ını İKİ MODDA da yener) o bağlamda primary-400 (`#10b981`) + ink
+ * (`primary-950`, ≈6.9:1) zeminine geçer — Sidebar'ın kendi `data-appearance`
+ * attribute'una bağlı, `Brand`'e yeni bir input EKLENMEDEN.
+ *
+ * `appearance="brand-light"` (kök primary-100, İKİ modda da AYNI) için AYRI
+ * bir override GEREKİR — DARK site modunda `bg-accent-fill` primary-400'e
+ * kayıyor, primary-100 zemine karşı sadece 2.15:1 (AA altı, neredeyse
+ * kaybolur). Sabit koyu blok + beyaz metin (`primary-900`/`white`) — bu,
+ * LIGHT site modunda zaten `bg-accent-fill`in verdiği sonuçla (primary-900)
+ * ÖRTÜŞÜYOR, sadece dark site modundaki tutarsızlığı gideriyor.
+ */
+class Brand {
+    name = input.required(/* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "name" }] : /* istanbul ignore next */ []));
+    size = input('md', /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "size" }] : /* istanbul ignore next */ []));
+    showLabel = input(true, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "showLabel" }] : /* istanbul ignore next */ []));
+    labelTone = input('auto', /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "labelTone" }] : /* istanbul ignore next */ []));
+    mark = computed(() => this.name().trim().slice(0, 1).toUpperCase() || '?', /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "mark" }] : /* istanbul ignore next */ []));
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.6", ngImport: i0, type: Brand, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.1.6", type: Brand, isStandalone: true, selector: "mf-brand", inputs: { name: { classPropertyName: "name", publicName: "name", isSignal: true, isRequired: true, transformFunction: null }, size: { classPropertyName: "size", publicName: "size", isSignal: true, isRequired: false, transformFunction: null }, showLabel: { classPropertyName: "showLabel", publicName: "showLabel", isSignal: true, isRequired: false, transformFunction: null }, labelTone: { classPropertyName: "labelTone", publicName: "labelTone", isSignal: true, isRequired: false, transformFunction: null } }, ngImport: i0, template: `
+    <span class="inline-flex items-center gap-2">
+      <span
+        [class]="
+          'flex shrink-0 items-center justify-center rounded-md bg-accent-fill font-display font-bold text-fg-on-accent ' +
+          'group-data-[appearance=brand]/sidebar:bg-primary-400 group-data-[appearance=brand]/sidebar:text-primary-950 ' +
+          'group-data-[appearance=brand-light]/sidebar:bg-primary-900 group-data-[appearance=brand-light]/sidebar:text-white ' +
+          (size() === 'sm' ? 'h-8 w-8 text-sm' : 'h-9 w-9 text-sm')
+        "
+        aria-hidden="true"
+      >
+        {{ mark() }}
+      </span>
+      @if (showLabel()) {
+        <span
+          [class]="
+            'truncate text-title font-semibold ' +
+            (labelTone() === 'light'
+              ? 'text-white'
+              : labelTone() === 'dark'
+                ? 'text-primary-900'
+                : 'text-fg')
+          "
+          >{{ name() }}</span
+        >
+      }
+    </span>
+  `, isInline: true });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.6", ngImport: i0, type: Brand, decorators: [{
+            type: Component,
+            args: [{
+                    selector: 'mf-brand',
+                    template: `
+    <span class="inline-flex items-center gap-2">
+      <span
+        [class]="
+          'flex shrink-0 items-center justify-center rounded-md bg-accent-fill font-display font-bold text-fg-on-accent ' +
+          'group-data-[appearance=brand]/sidebar:bg-primary-400 group-data-[appearance=brand]/sidebar:text-primary-950 ' +
+          'group-data-[appearance=brand-light]/sidebar:bg-primary-900 group-data-[appearance=brand-light]/sidebar:text-white ' +
+          (size() === 'sm' ? 'h-8 w-8 text-sm' : 'h-9 w-9 text-sm')
+        "
+        aria-hidden="true"
+      >
+        {{ mark() }}
+      </span>
+      @if (showLabel()) {
+        <span
+          [class]="
+            'truncate text-title font-semibold ' +
+            (labelTone() === 'light'
+              ? 'text-white'
+              : labelTone() === 'dark'
+                ? 'text-primary-900'
+                : 'text-fg')
+          "
+          >{{ name() }}</span
+        >
+      }
+    </span>
+  `,
+                }]
+        }], propDecorators: { name: [{ type: i0.Input, args: [{ isSignal: true, alias: "name", required: true }] }], size: [{ type: i0.Input, args: [{ isSignal: true, alias: "size", required: false }] }], showLabel: [{ type: i0.Input, args: [{ isSignal: true, alias: "showLabel", required: false }] }], labelTone: [{ type: i0.Input, args: [{ isSignal: true, alias: "labelTone", required: false }] }] } });
+
+/**
+ * Generated bundle index. Do not edit.
+ */
+
+export { Brand };
+//# sourceMappingURL=mesgflow-ui-kit-brand.mjs.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"mesgflow-ui-kit-brand.mjs","sources":["../../../projects/ui-kit/brand/brand.ts","../../../projects/ui-kit/brand/mesgflow-ui-kit-brand.ts"],"sourcesContent":["import { Component, computed, input } from '@angular/core';\r\n\r\n/**\r\n * `<mf-brand [name]=\"i18n().auth.layout.brandName\" />`\r\n *\r\n * Marka işareti TEK kaynağa indirildi — daha önce üç ayrı yerde üç farklı\r\n * şey vardı: auth masaüstü panelinde sabit kodlu \"MF\", mobil auth bloğunda\r\n * ve layout sidebar'ında sabit kodlu \"N\", sidebar'da ayrıca `bg-teal-600`\r\n * (eski marka rengi, köşeli/`rounded-*` olmayan bir kare). İşaret artık\r\n * `name()`'in İLK HARFİNDEN türetiliyor — `brandName` çevirisi değişse bile\r\n * bir daha asenkron/bayat kalamaz.\r\n *\r\n * `labelTone=\"auto\"` (varsayılan) isim metnini moda-duyarlı `text-fg` ile\r\n * boyar — ama auth-layout'un sol paneli gibi TEMADAN BAĞIMSIZ hep koyu kalan\r\n * zeminlerde bu YANLIŞ: light modda `text-fg` koyu metne döner, koyu panel\r\n * üstünde görünmez olur (gerçek bug, tarayıcıda yakalandı). O bağlamlarda\r\n * `labelTone=\"light\"` ver — sabit beyaz metin, moddan bağımsız. Simetrik\r\n * olarak `labelTone=\"dark\"` — sabit koyu (`primary-900`) metin, TEMADAN\r\n * BAĞIMSIZ hep AÇIK kalan zeminler için (`appearance=\"brand-light\"` sidebar\r\n * gibi): `auto` orada da YANLIŞ olurdu — dark site modunda `text-fg` açık\r\n * renge döner, ki zemin (primary-100) hep açık kaldığından metin kaybolurdu.\r\n *\r\n * İşaret zemini `bg-accent-fill` — Sidebar `appearance=\"brand\"` içine\r\n * (`[brand]` slotu ile) projelendiğinde bu artık primary-900'e (kök\r\n * sidebar'la AYNI zemin) denk düşer, işaret kaybolurdu. `group-data-\r\n * [appearance=brand]/sidebar:` varyantı (özgüllük 0,2,0, `bg-accent-fill`in\r\n * 0,1,0'ını İKİ MODDA da yener) o bağlamda primary-400 (`#10b981`) + ink\r\n * (`primary-950`, ≈6.9:1) zeminine geçer — Sidebar'ın kendi `data-appearance`\r\n * attribute'una bağlı, `Brand`'e yeni bir input EKLENMEDEN.\r\n *\r\n * `appearance=\"brand-light\"` (kök primary-100, İKİ modda da AYNI) için AYRI\r\n * bir override GEREKİR — DARK site modunda `bg-accent-fill` primary-400'e\r\n * kayıyor, primary-100 zemine karşı sadece 2.15:1 (AA altı, neredeyse\r\n * kaybolur). Sabit koyu blok + beyaz metin (`primary-900`/`white`) — bu,\r\n * LIGHT site modunda zaten `bg-accent-fill`in verdiği sonuçla (primary-900)\r\n * ÖRTÜŞÜYOR, sadece dark site modundaki tutarsızlığı gideriyor.\r\n */\r\n@Component({\r\n  selector: 'mf-brand',\r\n  template: `\r\n    <span class=\"inline-flex items-center gap-2\">\r\n      <span\r\n        [class]=\"\r\n          'flex shrink-0 items-center justify-center rounded-md bg-accent-fill font-display font-bold text-fg-on-accent ' +\r\n          'group-data-[appearance=brand]/sidebar:bg-primary-400 group-data-[appearance=brand]/sidebar:text-primary-950 ' +\r\n          'group-data-[appearance=brand-light]/sidebar:bg-primary-900 group-data-[appearance=brand-light]/sidebar:text-white ' +\r\n          (size() === 'sm' ? 'h-8 w-8 text-sm' : 'h-9 w-9 text-sm')\r\n        \"\r\n        aria-hidden=\"true\"\r\n      >\r\n        {{ mark() }}\r\n      </span>\r\n      @if (showLabel()) {\r\n        <span\r\n          [class]=\"\r\n            'truncate text-title font-semibold ' +\r\n            (labelTone() === 'light'\r\n              ? 'text-white'\r\n              : labelTone() === 'dark'\r\n                ? 'text-primary-900'\r\n                : 'text-fg')\r\n          \"\r\n          >{{ name() }}</span\r\n        >\r\n      }\r\n    </span>\r\n  `,\r\n})\r\nexport class Brand {\r\n  readonly name = input.required<string>();\r\n  readonly size = input<'sm' | 'md'>('md');\r\n  readonly showLabel = input(true);\r\n  readonly labelTone = input<'auto' | 'light' | 'dark'>('auto');\r\n\r\n  protected readonly mark = computed(() => this.name().trim().slice(0, 1).toUpperCase() || '?');\r\n}\r\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":[],"mappings":";;;AAEA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAkCG;MAgCU,KAAK,CAAA;IACP,IAAI,GAAG,KAAK,CAAC,QAAQ;6EAAU;IAC/B,IAAI,GAAG,KAAK,CAAc,IAAI;6EAAC;IAC/B,SAAS,GAAG,KAAK,CAAC,IAAI;kFAAC;IACvB,SAAS,GAAG,KAAK,CAA4B,MAAM;kFAAC;IAE1C,IAAI,GAAG,QAAQ,CAAC,MAAM,IAAI,CAAC,IAAI,EAAE,CAAC,IAAI,EAAE,CAAC,KAAK,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,WAAW,EAAE,IAAI,GAAG;6EAAC;uGANlF,KAAK,EAAA,IAAA,EAAA,EAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,SAAA,EAAA,CAAA;AAAL,IAAA,OAAA,IAAA,GAAA,EAAA,CAAA,oBAAA,CAAA,EAAA,UAAA,EAAA,QAAA,EAAA,OAAA,EAAA,QAAA,EAAA,IAAA,EAAA,KAAK,EAAA,YAAA,EAAA,IAAA,EAAA,QAAA,EAAA,UAAA,EAAA,MAAA,EAAA,EAAA,IAAA,EAAA,EAAA,iBAAA,EAAA,MAAA,EAAA,UAAA,EAAA,MAAA,EAAA,QAAA,EAAA,IAAA,EAAA,UAAA,EAAA,IAAA,EAAA,iBAAA,EAAA,IAAA,EAAA,EAAA,IAAA,EAAA,EAAA,iBAAA,EAAA,MAAA,EAAA,UAAA,EAAA,MAAA,EAAA,QAAA,EAAA,IAAA,EAAA,UAAA,EAAA,KAAA,EAAA,iBAAA,EAAA,IAAA,EAAA,EAAA,SAAA,EAAA,EAAA,iBAAA,EAAA,WAAA,EAAA,UAAA,EAAA,WAAA,EAAA,QAAA,EAAA,IAAA,EAAA,UAAA,EAAA,KAAA,EAAA,iBAAA,EAAA,IAAA,EAAA,EAAA,SAAA,EAAA,EAAA,iBAAA,EAAA,WAAA,EAAA,UAAA,EAAA,WAAA,EAAA,QAAA,EAAA,IAAA,EAAA,UAAA,EAAA,KAAA,EAAA,iBAAA,EAAA,IAAA,EAAA,EAAA,EAAA,QAAA,EAAA,EAAA,EAAA,QAAA,EA7BN,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;AA2BT,EAAA,CAAA,EAAA,QAAA,EAAA,IAAA,EAAA,CAAA;;2FAEU,KAAK,EAAA,UAAA,EAAA,CAAA;kBA/BjB,SAAS;AAAC,YAAA,IAAA,EAAA,CAAA;AACT,oBAAA,QAAQ,EAAE,UAAU;AACpB,oBAAA,QAAQ,EAAE,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;AA2BT,EAAA,CAAA;AACF,iBAAA;;;ACnED;;AAEG;;"}