@mesgflow/ui-kit 0.7.0 → 0.8.0

package/types/mesgflow-ui-kit-qr-code.d.ts

@@ -0,0 +1,160 @@
+import * as _mesgflow_ui_kit_qr_code from '@mesgflow/ui-kit/qr-code';
+import * as _angular_core from '@angular/core';
+
+/** Hata düzeltme seviyesi — kurtarılabilir hasar oranı: L ~%7, M ~%15, Q ~%25, H ~%30. */
+type QrEcc = 'L' | 'M' | 'Q' | 'H';
+interface QrEncodeOptions {
+    /** Varsayılan `'M'`. */
+    ecc?: QrEcc;
+    /** 1–40, varsayılan 1. */
+    minVersion?: number;
+    /** 1–40, varsayılan 40. */
+    maxVersion?: number;
+    /**
+     * Seçilen sürüm (boyut) büyümeden daha yüksek bir hata düzeltme seviyesi sığıyorsa
+     * onu kullanır — aynı boyutta bedava dayanıklılık. Varsayılan `true`.
+     */
+    boostEcc?: boolean;
+}
+interface QrMatrix {
+    /** Modül cinsinden kenar (21–177) — sessiz bölge (quiet zone) HARİÇ. */
+    readonly size: number;
+    /** 1–40. */
+    readonly version: number;
+    /** Gerçekte kullanılan seviye (`boostEcc` ile istenenden yüksek olabilir). */
+    readonly ecc: QrEcc;
+    readonly mask: number;
+    /** `modules[y][x]` — `true` koyu modül. */
+    readonly modules: readonly (readonly boolean[])[];
+    /** `isFunction[y][x]` — finder/timing/alignment/format/version modülü (veri değil). */
+    readonly isFunction: readonly (readonly boolean[])[];
+}
+/** İçerik, `maxVersion` ve seçilen `ecc` ile sığmıyor. */
+declare class QrCapacityError extends Error {
+    constructor();
+}
+/**
+ * Metni (UTF-8; tamamen rakamsa numeric, büyük harf/rakam/` $%*+-./:` ise
+ * alphanumeric kip) ya da ham baytları bir QR matrisine kodlar. En küçük uygun
+ * sürümü ve en düşük cezalı maskeyi seçer.
+ *
+ * @throws {QrCapacityError} içerik sığmıyorsa.
+ */
+declare function encodeQr(data: string | Uint8Array, options?: QrEncodeOptions): QrMatrix;
+
+/** Veri modüllerinin çizim biçimi. */
+type QrModuleShape = 'square' | 'rounded' | 'dots';
+/** Üç köşedeki konum (finder) desenlerinin biçimi. */
+type QrFinderShape = 'square' | 'rounded';
+interface QrGeometry {
+    /** Modül cinsinden QR kenarı (sessiz bölge hariç). */
+    readonly size: number;
+    /** Veri + timing + alignment modülleri — tek `<path>` (tek path = komşu modüller arasında AA dikişi yok). */
+    readonly dataPath: string;
+    /** Finder dış halkaları (`fill-rule="evenodd"`). */
+    readonly finderOuterPath: string;
+    /** Finder iç 3×3 gözleri. */
+    readonly finderInnerPath: string;
+    /** Logo için boşaltılan kare (modül); logo yoksa 0. */
+    readonly excavated: number;
+}
+/**
+ * Logo için merkezde boşaltılacak kare kenarı (modül). QR kenarıyla aynı
+ * paritede (tek) tutulur ki kare tam ortalansın; oran 0–0.3 arası kırpılır
+ * (H seviyesi ~%30 hasarı kurtarır — alan olarak 0.3² ≈ %9, güvenli pay).
+ */
+declare function excavationSize(size: number, ratio: number): number;
+/** Kodlanmış matrisi saf SVG yol dizelerine çevirir — DOM'suz, `computed()` içinde çağrılır. */
+declare function qrGeometry(matrix: QrMatrix, shape: QrModuleShape, finder: QrFinderShape, logoRatio: number): QrGeometry;
+interface QrSvgStringOptions {
+    /** Sessiz bölge (modül), varsayılan 4 — baskı/dışa aktarım için standart. */
+    margin?: number;
+    /** Piksel kenar, varsayılan 256. */
+    pixelSize?: number;
+    foreground?: string;
+    background?: string;
+}
+/** Bağımsız bir `<svg>` belgesi (indirme/paylaşım için) — logo katmanı HTML olduğu için dahil DEĞİL. */
+declare function qrSvgString(geometry: QrGeometry, options?: QrSvgStringOptions): string;
+
+/**
+ * `<mf-qr-code data="…"><img mfQrCodeLogo src="logo.svg" alt="" /></mf-qr-code>` —
+ * QR'ın ortasına yerleştirilen logo. Varlığı hata düzeltmeyi otomatik `H`'ye
+ * yükseltir ve altındaki modülleri boşaltır. Dekoratif olduğu için `alt=""`
+ * önerilir — erişilebilir ad `mf-qr-code`'un kendi `aria-label`'ındadır.
+ */
+declare class QrCodeLogo {
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<QrCodeLogo, never>;
+    static ɵdir: _angular_core.ɵɵDirectiveDeclaration<QrCodeLogo, "[mfQrCodeLogo]", never, {}, {}, never, never, true, never>;
+}
+/**
+ * `<mf-qr-code data="https://mesgflow.dev" />`
+ *
+ * Saf SVG QR kod — kodlayıcı kitin içinde (`qr-encoder.ts`, Nayuki portu), ek
+ * bağımlılık yok; tüm geometri `computed()` ile üretilir, DOM API'si
+ * kullanılmaz (SSR güvenli).
+ *
+ * - `shape`: `square` (klasik) · `rounded` (akışkan, komşu modüllerle birleşen) · `dots`.
+ * - `finder`: köşe desenleri `square` / `rounded`.
+ * - `ecc`: L/M/Q/H — logo varsa otomatik `H`. Aynı boyutta daha yüksek seviye
+ *   sığıyorsa zaten yükseltilir (`boostEcc`).
+ * - `margin`: sessiz bölge (modül). Okuyucular ≥ 2 ister; baskı için 4.
+ * - Logo: `[mfQrCodeLogo]` içerik (bkz. `QrCodeLogo`).
+ * - `toSvgString()`: indirme/paylaşım için bağımsız SVG.
+ *
+ * Renk: varsayılan beyaz kart üstünde siyah modül — BİLİNÇLİ ham renk istisnası:
+ * kameralar koyu-üstünde-açık (ters) QR'ı güvenilir okuyamaz, bu yüzden koyu temada
+ * da açık kart kalır. `foreground`/`background` (herhangi bir CSS rengi, `var(--…)`
+ * dahil) ile değiştirilir — satır içi stil olduğu için sınıf sırası çakışması yok;
+ * modüller `currentColor`, logo kutusu zemini miras alır. Koyu modül / açık zemin ve
+ * yeterli kontrast (≥ ~4:1) korunmalı.
+ *
+ * İçerik sığmazsa hata fırlatmaz: yerinde erişilebilir bir hata durumu çizer ve
+ * `encoded` çıkışı `null` yayar.
+ */
+declare class QrCode {
+    /** Kodlanacak içerik (URL, metin, `WIFI:…`, `mailto:` vb.). */
+    readonly data: _angular_core.InputSignal<string>;
+    /** Piksel kenar (sessiz bölge dahil). */
+    readonly size: _angular_core.InputSignalWithTransform<number, unknown>;
+    readonly ecc: _angular_core.InputSignal<QrEcc>;
+    /** Sessiz bölge, modül cinsinden. */
+    readonly margin: _angular_core.InputSignalWithTransform<number, unknown>;
+    readonly shape: _angular_core.InputSignal<QrModuleShape>;
+    readonly finder: _angular_core.InputSignal<QrFinderShape>;
+    /** Logo karesinin QR kenarına oranı (0–0.3); yalnızca `[mfQrCodeLogo]` varken etkili. */
+    readonly logoSize: _angular_core.InputSignalWithTransform<number, unknown>;
+    /** Modül rengi (CSS rengi). Verilmezse siyah. */
+    readonly foreground: _angular_core.InputSignal<string | undefined>;
+    /** Zemin rengi (CSS rengi). Verilmezse beyaz. */
+    readonly background: _angular_core.InputSignal<string | undefined>;
+    /** `role="img"` erişilebilir adı — verilmezse `MF_QR_CODE_LABELS.ariaLabel`. İçeriği anlatan bir ad önerilir. */
+    readonly ariaLabel: _angular_core.InputSignal<string | undefined>;
+    /** Her yeniden kodlamada matris (hata durumunda `null`). */
+    readonly encoded: _angular_core.OutputEmitterRef<QrMatrix | null>;
+    private readonly labels;
+    private readonly logo;
+    protected readonly hasLogo: _angular_core.Signal<boolean>;
+    protected readonly effectiveEcc: _angular_core.Signal<QrEcc>;
+    protected readonly matrix: _angular_core.Signal<QrMatrix | null>;
+    protected readonly geometry: _angular_core.Signal<_mesgflow_ui_kit_qr_code.QrGeometry | null>;
+    protected readonly quietZone: _angular_core.Signal<number>;
+    protected readonly viewBox: _angular_core.Signal<string>;
+    /** Logo kutusunun piksel kenarı — boşaltılan karenin ekrandaki karşılığı. */
+    protected readonly logoBoxPx: _angular_core.Signal<number>;
+    protected readonly crisp: _angular_core.Signal<boolean>;
+    protected readonly effectiveAriaLabel: _angular_core.Signal<string>;
+    protected readonly hostClasses: _angular_core.Signal<string>;
+    constructor();
+    /**
+     * Bağımsız SVG belgesi — logo katmanı dahil DEĞİL. İçerik sığmıyorsa `null`.
+     * Renkler verilmezse `foreground`/`background` girdileri (onlar da yoksa siyah/beyaz);
+     * `var(--…)` gibi bağlama bağlı değerler dışa aktarımda çözülmez — somut renk geçin.
+     */
+    toSvgString(options?: QrSvgStringOptions): string | null;
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<QrCode, never>;
+    static ɵcmp: _angular_core.ɵɵComponentDeclaration<QrCode, "mf-qr-code", ["mfQrCode"], { "data": { "alias": "data"; "required": true; "isSignal": true; }; "size": { "alias": "size"; "required": false; "isSignal": true; }; "ecc": { "alias": "ecc"; "required": false; "isSignal": true; }; "margin": { "alias": "margin"; "required": false; "isSignal": true; }; "shape": { "alias": "shape"; "required": false; "isSignal": true; }; "finder": { "alias": "finder"; "required": false; "isSignal": true; }; "logoSize": { "alias": "logoSize"; "required": false; "isSignal": true; }; "foreground": { "alias": "foreground"; "required": false; "isSignal": true; }; "background": { "alias": "background"; "required": false; "isSignal": true; }; "ariaLabel": { "alias": "ariaLabel"; "required": false; "isSignal": true; }; }, { "encoded": "encoded"; }, ["logo"], ["[mfQrCodeLogo]"], true, never>;
+}
+
+export { QrCapacityError, QrCode, QrCodeLogo, encodeQr, excavationSize, qrGeometry, qrSvgString };
+export type { QrEcc, QrEncodeOptions, QrFinderShape, QrGeometry, QrMatrix, QrModuleShape, QrSvgStringOptions };

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

@@ -54,6 +54,7 @@ export * from '@mesgflow/ui-kit/pagination';
 export * from '@mesgflow/ui-kit/password-input';
 export * from '@mesgflow/ui-kit/popover';
 export * from '@mesgflow/ui-kit/progress';
+export * from '@mesgflow/ui-kit/qr-code';
 export * from '@mesgflow/ui-kit/radio';
 export * from '@mesgflow/ui-kit/rating';
 export * from '@mesgflow/ui-kit/scroll-area';