@mesgflow/ui-kit 0.8.0 → 0.9.0

package/types/mesgflow-ui-kit-field.d.ts

@@ -12,6 +12,10 @@ import * as _angular_core from '@angular/core';
  * - `aria-required="true"` → `required` iken.
  * Hata metni `role="alert"` DEĞİL, `aria-live="polite"` — her tuş vuruşunda
  * ekran okuyucuyu kesmesin. `error` `string | undefined` kabul eder.
+ *
+ * Etiket satırında eylem: `[mfFieldLabelAction]` işaretli çocuk (ör. "Şifremi
+ * unuttum" bağlantısı) etiketin sağına, label'ın KARDEŞİ olarak projekte edilir —
+ * bkz. `FieldLabelAction`. Etiket boşsa da satır eylem için çizilir.
  */
 declare class Field {
     readonly label: _angular_core.InputSignal<string>;
@@ -21,6 +25,8 @@ declare class Field {
     readonly required: _angular_core.InputSignal<boolean>;
     /** `true` ise kalan yüksekliği doldurur (`flex-1 min-h-0`). */
     readonly grow: _angular_core.InputSignal<boolean>;
+    private readonly labelAction;
+    protected readonly hasLabelRow: _angular_core.Signal<boolean>;
     private readonly host;
     private readonly baseId;
     protected readonly hintId: string;
@@ -29,7 +35,23 @@ declare class Field {
     protected readonly describedId: _angular_core.Signal<string | null>;
     constructor();
     static ɵfac: _angular_core.ɵɵFactoryDeclaration<Field, never>;
-    static ɵcmp: _angular_core.ɵɵComponentDeclaration<Field, "mf-field", never, { "label": { "alias": "label"; "required": false; "isSignal": true; }; "for": { "alias": "for"; "required": false; "isSignal": true; }; "hint": { "alias": "hint"; "required": false; "isSignal": true; }; "error": { "alias": "error"; "required": false; "isSignal": true; }; "required": { "alias": "required"; "required": false; "isSignal": true; }; "grow": { "alias": "grow"; "required": false; "isSignal": true; }; }, {}, never, ["*"], true, never>;
+    static ɵcmp: _angular_core.ɵɵComponentDeclaration<Field, "mf-field", never, { "label": { "alias": "label"; "required": false; "isSignal": true; }; "for": { "alias": "for"; "required": false; "isSignal": true; }; "hint": { "alias": "hint"; "required": false; "isSignal": true; }; "error": { "alias": "error"; "required": false; "isSignal": true; }; "required": { "alias": "required"; "required": false; "isSignal": true; }; "grow": { "alias": "grow"; "required": false; "isSignal": true; }; }, {}, ["labelAction"], ["[mfFieldLabelAction]", "*"], true, never>;
+}
+
+/**
+ * `<a mfLink mfFieldLabelAction routerLink="/forgot-password">Şifremi unuttum</a>` —
+ * `mf-field` içine konan öğeyi etiket satırının SAĞINA taşır (yaygın "etiket + eylem"
+ * kalıbı: parola alanının yanında "Şifremi unuttum").
+ *
+ * Öğe `<label>`'ın İÇİNE değil, KARDEŞİNE projekte edilir — label içindeki bir bağlantı
+ * tıklamayı alana yönlendirir ve ekran okuyucuda etiket adına karışırdı. DOM sırası =
+ * görsel sıra (etiket → eylem → alan), sekme sırası da buna uyar.
+ *
+ * `ms-auto`: etiket yoksa ya da dar ekranda alt satıra sarıldığında da sağda kalır.
+ */
+declare class FieldLabelAction {
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<FieldLabelAction, never>;
+    static ɵdir: _angular_core.ɵɵDirectiveDeclaration<FieldLabelAction, "[mfFieldLabelAction]", never, {}, {}, never, never, true, never>;
 }
 
-export { Field };
+export { Field, FieldLabelAction };

package/types/mesgflow-ui-kit-input.d.ts

@@ -164,6 +164,8 @@ declare class InputSuffix {
  * textarea `rows` arttıkça bu tabanın üstüne doğal büyüyor. `min-h-(--control-h-*)`
  * — Tailwind v4'ün parantezli kısayolu, `--control-h-*` token'ına (radius.css)
  * doğrudan referans, ayrı bir `min-h-control-*` utility'si tanımlamaya gerek yok.
+ * `py-*` + satır yüksekliği + kenarlık token'ı AŞMAMALI — aşarsa `min-h` etkisiz kalır ve
+ * alan `mf-input-group`/`mfButton`'dan uzun çıkar (lg eskiden `py-2` + `text-base` = 42px ≠ 40px).
  *
  * `hasError` (invalid DEĞİL): `@angular/forms/signals`'ın `[formField]`
  * directive'i, AYNI native elemandaki başka bir directive'in `invalid`/

package/types/mesgflow-ui-kit-password-input.d.ts

@@ -1,6 +1,6 @@
 import * as _angular_core from '@angular/core';
 import { ControlValueAccessor } from '@angular/forms';
-import { ValueAccessorBase } from '@mesgflow/ui-kit/core';
+import { ValueAccessorBase, MfSize } from '@mesgflow/ui-kit/core';
 
 /**
  * Parola alanının `autocomplete` ipucu — parola yöneticileri/tarayıcı bunu okur:
@@ -26,9 +26,17 @@ type PasswordAutocomplete = 'current-password' | 'new-password' | 'off' | (strin
  * harfe çevirmez, yazım denetimi parolayı bir sözlük servisine göndermez.
  * Signal Forms `[formField]` bağlandığında `name`/`required`/`readonly`/`disabled`
  * alan durumundan OTOMATİK doldurulur.
+ *
+ * `size`: `input[mfInput]`/`mf-input-group` ile AYNI yükseklik/dolgu/font token'ları —
+ * aynı boydaki düz bir `mfInput` ile yan yana hizalı durur; göster/gizle ikonu boyla büyür.
+ *
+ * Önek: `[mfInputPrefix]` işaretli çocuk (ör. `<span mfIcon mfInputPrefix>lock</span>`)
+ * alanın soluna, `mf-input-group`'un önek yuvasına projekte edilir — metin başlangıcı
+ * önekli bir `mf-input-group` ile aynı. Önek dekoratif kabul edilir (`aria-hidden`).
  */
 declare class PasswordInput extends ValueAccessorBase<string> implements ControlValueAccessor {
     readonly value: _angular_core.ModelSignal<string>;
+    readonly size: _angular_core.InputSignal<MfSize>;
     readonly placeholder: _angular_core.InputSignal<string>;
     readonly disabled: _angular_core.InputSignalWithTransform<boolean, unknown>;
     readonly hasError: _angular_core.InputSignalWithTransform<boolean, unknown>;
@@ -51,12 +59,13 @@ declare class PasswordInput extends ValueAccessorBase<string> implements Control
     private readonly formDisabled;
     protected readonly isDisabled: _angular_core.Signal<boolean>;
     protected readonly visible: _angular_core.WritableSignal<boolean>;
+    protected readonly toggleIconSize: _angular_core.Signal<number>;
     writeValue(value: string | null): void;
     setDisabledState(disabled: boolean): void;
     protected toggle(): void;
     protected onInput(raw: string): void;
     static ɵfac: _angular_core.ɵɵFactoryDeclaration<PasswordInput, never>;
-    static ɵcmp: _angular_core.ɵɵComponentDeclaration<PasswordInput, "mf-password-input", ["mfPasswordInput"], { "value": { "alias": "value"; "required": false; "isSignal": true; }; "placeholder": { "alias": "placeholder"; "required": false; "isSignal": true; }; "disabled": { "alias": "disabled"; "required": false; "isSignal": true; }; "hasError": { "alias": "hasError"; "required": false; "isSignal": true; }; "inputId": { "alias": "inputId"; "required": false; "isSignal": true; }; "ariaLabel": { "alias": "ariaLabel"; "required": false; "isSignal": true; }; "fullWidth": { "alias": "fullWidth"; "required": false; "isSignal": true; }; "showLabel": { "alias": "showLabel"; "required": false; "isSignal": true; }; "hideLabel": { "alias": "hideLabel"; "required": false; "isSignal": true; }; "autocomplete": { "alias": "autocomplete"; "required": false; "isSignal": true; }; "name": { "alias": "name"; "required": false; "isSignal": true; }; "required": { "alias": "required"; "required": false; "isSignal": true; }; "readonly": { "alias": "readonly"; "required": false; "isSignal": true; }; }, { "value": "valueChange"; }, never, never, true, never>;
+    static ɵcmp: _angular_core.ɵɵComponentDeclaration<PasswordInput, "mf-password-input", ["mfPasswordInput"], { "value": { "alias": "value"; "required": false; "isSignal": true; }; "size": { "alias": "size"; "required": false; "isSignal": true; }; "placeholder": { "alias": "placeholder"; "required": false; "isSignal": true; }; "disabled": { "alias": "disabled"; "required": false; "isSignal": true; }; "hasError": { "alias": "hasError"; "required": false; "isSignal": true; }; "inputId": { "alias": "inputId"; "required": false; "isSignal": true; }; "ariaLabel": { "alias": "ariaLabel"; "required": false; "isSignal": true; }; "fullWidth": { "alias": "fullWidth"; "required": false; "isSignal": true; }; "showLabel": { "alias": "showLabel"; "required": false; "isSignal": true; }; "hideLabel": { "alias": "hideLabel"; "required": false; "isSignal": true; }; "autocomplete": { "alias": "autocomplete"; "required": false; "isSignal": true; }; "name": { "alias": "name"; "required": false; "isSignal": true; }; "required": { "alias": "required"; "required": false; "isSignal": true; }; "readonly": { "alias": "readonly"; "required": false; "isSignal": true; }; }, { "value": "valueChange"; }, never, ["[mfInputPrefix]"], true, never>;
 }
 
 export { PasswordInput };

package/types/mesgflow-ui-kit-segmented-control.d.ts

@@ -14,8 +14,16 @@ interface SegmentedOption<T> {
  * farkı: içerik paneli YOK, sadece bir değer seçimi. ARIA/klavye (roving
  * tabindex, ok tuşu navigasyonu) `@angular/aria/toolbar`'ın
  * `Toolbar`/`ToolbarWidgetGroup`/`ToolbarWidget` pattern'inden geliyor —
- * dokümantasyondaki kompozisyon şekli birebir izlendi (dıştaki `ngToolbar`,
- * içteki `ngToolbarWidgetGroup [multi]="false"`).
+ * dokümantasyondaki kompozisyon şekli izlendi (dıştaki `ngToolbar`, içteki
+ * `ngToolbarWidgetGroup`).
+ *
+ * SEÇİM toolbar'dan DEĞİL, bileşenin kendisinden: `@angular/aria` 22.2 toolbar'ın
+ * `value`/`valueChange`'ini ve grubun `multi`'sini KALDIRDI (toolbar artık yalnızca
+ * gezinme). Kit önceden derlendiği için tüketicide derleme hatası çıkmıyor, tıklama
+ * sessizce etkisiz kalıyordu (gerçek bulgu, 0.6–0.8). Artık tıklama + Enter/Space
+ * doğrudan `select()`'i çağırır — 22.1 ve 22.2'de aynı çalışır. Widget'ın `[value]`'su
+ * yalnızca 22.1'in zorunlu girdisi için duruyor (22.2'de düğmenin DOM `value`'suna düşer).
+ * Seçili durum `aria-pressed` ile duyurulur (toolbar hiçbir sürümde vermiyor).
  *
  * Seçili parça core'un `[mfSlidingIndicator]`'ıyla (Tabs ile aynı motor) yay
  * eğrisiyle kayar; aria/toolbar seçili öznitelik vermediği için hedef
@@ -27,19 +35,19 @@ declare class SegmentedControl<T> extends ValueAccessorBase<T | null> implements
     readonly size: _angular_core.InputSignal<"sm" | "md" | null | undefined>;
     readonly ariaLabel: _angular_core.InputSignal<string>;
     readonly disabled: _angular_core.InputSignal<boolean>;
-    protected readonly toolbarValue: _angular_core.Signal<T[]>;
     protected readonly trackClasses: _angular_core.Signal<string>;
     writeValue(value: T | null): void;
     /**
-     * `@angular/aria/toolbar`'ın kendi widget-kayıt döngüsü, gerçek bir tıklama
-     * OLMADAN da BOŞ bir dizi ile (`values: []`) tetiklenebiliyor (gerçek bulgu
-     * — bir seçeneğe tıklarken bile araya giren, seçimle ilgisiz iç kayıt
-     * event'leri). `this.value` her event'te güncellenir (görsel durum ETKİLENMEZ,
-     * zaten `values[0]` genelde mevcut değerle AYNI), ama CVA `onChange`/`onTouched`
-     * SADECE dolu bir dizi (gerçek bir seçim) geldiğinde tetiklenir — aksi halde
-     * Reactive Forms'a sahte "null'a değişti" bildirimleri sızardı.
+     * Seçili seçeneğe tekrar basmak seçimi KALDIRMAZ (segmented control'de her zaman bir
+     * seçim durur) ve değişiklik bildirmez; CVA `onChange` yalnızca gerçek bir değişimde.
+     */
+    protected select(value: T): void;
+    /**
+     * Enter/Space: 22.1'in toolbar'ı bu tuşları kendisi yakalayıp `preventDefault` ettiği
+     * için düğmenin yerel `click`'i gelmiyordu; 22.2'de geliyor. Burada seçip varsayılanı
+     * engellemek iki sürümde de TEK seçim üretir.
      */
-    protected onToolbarValueChange(values: readonly T[]): void;
+    protected onActivateKey(event: Event, value: T): void;
     protected itemClasses(option: SegmentedOption<T>): string;
     static ɵfac: _angular_core.ɵɵFactoryDeclaration<SegmentedControl<any>, never>;
     static ɵcmp: _angular_core.ɵɵComponentDeclaration<SegmentedControl<any>, "mf-segmented-control", ["mfSegmentedControl"], { "options": { "alias": "options"; "required": true; "isSignal": true; }; "value": { "alias": "value"; "required": false; "isSignal": true; }; "size": { "alias": "size"; "required": false; "isSignal": true; }; "ariaLabel": { "alias": "ariaLabel"; "required": false; "isSignal": true; }; "disabled": { "alias": "disabled"; "required": false; "isSignal": true; }; }, { "value": "valueChange"; }, never, never, true, never>;