@mesgflow/ui-kit 0.6.0 → 0.7.0

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

@@ -1,9 +1,72 @@
 import { clsx } from 'clsx';
-import { twMerge } from 'tailwind-merge';
-import { InjectionToken, signal, inject, computed, isSignal, makeEnvironmentProviders } from '@angular/core';
+import { extendTailwindMerge } from 'tailwind-merge';
+import * as i0 from '@angular/core';
+import { input, inject, ElementRef, afterRenderEffect, DestroyRef, afterNextRender, Directive, InjectionToken, signal, computed, isSignal, makeEnvironmentProviders } from '@angular/core';
 import { enUS } from 'date-fns/locale';
 
-/** clsx ile koşullu class'ları birleştirir, tailwind-merge ile çakışan utility'leri (ör. iki farklı `bg-*`) sonuncusu kazanacak şekilde çözer. */
+/**
+ * Kitin kendi utility'lerini tanıyan tailwind-merge örneği. Öncesinde düz
+ * `twMerge` `text-eyebrow`'u bir METİN RENGİ sanıp `text-fg` ile çakıştırıyor
+ * (birini siliyor), `h-control-md` ile `h-8`'i ise hiç çözemiyordu (ikisi de
+ * kalıp CSS sırası kazananı belirliyordu) — `docs/tr/mimari.md` "twMerge
+ * gotcha" artık bu yapılandırmayla kapandı. Yeni bir özel utility
+ * (`@utility`/`@theme` ile) eklerken buraya da ekleyin.
+ */
+const twMerge = extendTailwindMerge({
+    extend: {
+        theme: {
+            text: [
+                'label',
+                'caption',
+                'eyebrow',
+                'title-sm',
+                'title',
+                'title-lg',
+                'display',
+                'display-lg',
+                'metric',
+            ],
+            shadow: ['1', '2', '3', 'control', 'filled', 'glow', 'highlight'],
+            ease: ['emphasis', 'spring', 'exit'],
+            animate: [
+                'progress-slide',
+                'spin-slow',
+                'dialog-in',
+                'dialog-out',
+                'sheet-in',
+                'sheet-out',
+                'drawer-in',
+                'drawer-out',
+                'drawer-start-in',
+                'drawer-start-out',
+                'drawer-top-in',
+                'drawer-top-out',
+                'pop',
+                'overlay-in',
+                'overlay-out',
+                'toast-in',
+                'toast-out',
+                'countdown',
+                'list-in',
+                'draw',
+                'shimmer',
+                'fade-in',
+            ],
+            font: ['display'],
+            tracking: ['label'],
+        },
+        classGroups: {
+            'h-control': [{ 'h-control': ['xs', 'sm', 'md', 'lg', 'xl'] }],
+            duration: [{ duration: ['instant', 'fast', 'base', 'slow', 'slower'] }],
+            z: [{ z: ['sticky', 'nav', 'overlay', 'toast'] }],
+        },
+        conflictingClassGroups: {
+            'h-control': ['h', 'size'],
+            h: ['h-control'],
+        },
+    },
+});
+/** clsx ile koşullu class'ları birleştirir, tailwind-merge ile çakışan utility'leri (ör. iki farklı `bg-*`) sonuncusu kazanacak şekilde çözer — kitin özel token'ları dahil. */
 function cn(...inputs) {
     return twMerge(clsx(inputs));
 }
@@ -47,9 +110,11 @@ const disabledRecipe = 'disabled:pointer-events-none disabled:opacity-50 disable
 const controlSurface = 'rounded-md border border-border bg-surface text-fg shadow-control transition-colors duration-fast ease-emphasis hover:border-border-strong focus-within:border-accent';
 /** `size: MfSize` eksenindeki TÜM kontrollerin ortak yükseklik/dolgu/font eşlemesi — bkz. `radius.css`'teki `--control-h-*` token'ları. */
 const controlSize = {
+    xs: 'h-control-xs px-2 text-xs',
     sm: 'h-control-sm px-2.5 text-sm',
     md: 'h-control-md px-3 text-sm',
     lg: 'h-control-lg px-3.5 text-base',
+    xl: 'h-control-xl px-4 text-base',
 };
 /**
  * Popover/Menu/Select/Combobox/... overlay panellerinin ortak kabuğu — BORDER-
@@ -121,135 +186,233 @@ class ValueAccessorBase {
     }
 }
 
+const OPPOSITE = { top: 'bottom', bottom: 'top', start: 'end', end: 'start' };
+function split(placement) {
+    const [rawSide, rawAlign] = placement.split('-');
+    const side = rawSide === 'left' ? 'start' : rawSide === 'right' ? 'end' : rawSide;
+    return [side, rawAlign ?? 'center'];
+}
+function position(side, align, offset) {
+    if (side === 'top' || side === 'bottom') {
+        const below = side === 'bottom';
+        return {
+            originX: align,
+            originY: below ? 'bottom' : 'top',
+            overlayX: align,
+            overlayY: below ? 'top' : 'bottom',
+            offsetY: below ? offset : -offset,
+            // Panel aşağıdaysa ÜSTÜNDEN (tetikleyiciye bakan kenarından) büyür.
+            panelClass: [`mf-side-${side}`, `mf-origin-${below ? 'top' : 'bottom'}-${align}`],
+        };
+    }
+    const atEnd = side === 'end';
+    const alignY = align === 'start' ? 'top' : align === 'end' ? 'bottom' : 'center';
+    return {
+        originX: atEnd ? 'end' : 'start',
+        originY: alignY,
+        overlayX: atEnd ? 'start' : 'end',
+        overlayY: alignY,
+        offsetX: atEnd ? offset : -offset,
+        panelClass: [`mf-side-${side}`, `mf-origin-${alignY}-${atEnd ? 'start' : 'end'}`],
+    };
+}
 /**
- * `Popover`'ın (`PLACEMENTS`) ve `Tooltip`'in (`POSITIONS`) kendi dosyalarında
- * ayrı ayrı tuttuğu CDK `ConnectedPosition[]` çiftlerinin ORTAK geometri
- * üretici hâli — 8 yerleşimin (4 köşe + 4 kenar) hepsini tek bir fonksiyonla
- * üretir, `offset` çağıranın KENDİ mevcut değerini (Popover 4px, Tooltip 8px,
- * diğer overlay'ler 4-8px arası değişen) korumasını sağlar.
+ * Tüm bağlı overlay'lerin (Popover, Tooltip, HoverCard, Tour, ContextMenu ve
+ * Popover üstüne kurulan Select/Combobox/DatePicker/...) TEK konum üreticisi:
+ * tercih edilen yerleşim + taşmada karşı tarafa çevrilen (flip) yedek.
  *
- * Bu modül BİLEREK henüz hiçbir bileşene BAĞLANMADI (Faz 0c) — `Popover`,
- * `Tooltip` ve 10 kopya `ConnectedPosition[]` içeren diğer bileşenlerin buna
- * geçişi Faz 1c'nin ("Overlay birleştirme") kapsamı: her biri kendi klavye/
- * vurgu mantığını koruyarak taşınmalı ve tarayıcıda tek tek doğrulanmalı —
- * bu fazın (yapısal taşıma) riskiyle karıştırılmamalı.
+ * Her pozisyon bir `panelClass` taşır — CDK hangisini SEÇERSE pane'e o
+ * eklenir: `mf-side-*` (giriş kayma yönü) + `mf-origin-*` (`transform-origin`),
+ * bkz. styles/tokens/motion.css. Böylece panel yukarı çevrildiğinde (flip) animasyon
+ * da tetikleyiciden dışarı doğru açılır (Radix
+ * `--radix-popper-transform-origin` eşleniği, abonelik gerekmeden).
+ *
+ * `left`/`right` MANTIKSAL (`start`/`end`) — RTL'de CDK kendisi çevirir.
  */
 function overlayPositions(placement, offset = 4) {
-    switch (placement) {
-        case 'bottom-start':
-            return [
-                {
-                    originX: 'start',
-                    originY: 'bottom',
-                    overlayX: 'start',
-                    overlayY: 'top',
-                    offsetY: offset,
-                },
-                {
-                    originX: 'start',
-                    originY: 'top',
-                    overlayX: 'start',
-                    overlayY: 'bottom',
-                    offsetY: -offset,
-                },
-            ];
-        case 'bottom-end':
-            return [
-                { originX: 'end', originY: 'bottom', overlayX: 'end', overlayY: 'top', offsetY: offset },
-                { originX: 'end', originY: 'top', overlayX: 'end', overlayY: 'bottom', offsetY: -offset },
-            ];
-        case 'top-start':
-            return [
-                {
-                    originX: 'start',
-                    originY: 'top',
-                    overlayX: 'start',
-                    overlayY: 'bottom',
-                    offsetY: -offset,
-                },
-                {
-                    originX: 'start',
-                    originY: 'bottom',
-                    overlayX: 'start',
-                    overlayY: 'top',
-                    offsetY: offset,
-                },
-            ];
-        case 'top-end':
-            return [
-                { originX: 'end', originY: 'top', overlayX: 'end', overlayY: 'bottom', offsetY: -offset },
-                { originX: 'end', originY: 'bottom', overlayX: 'end', overlayY: 'top', offsetY: offset },
-            ];
-        case 'top':
-            return [
-                {
-                    originX: 'center',
-                    originY: 'top',
-                    overlayX: 'center',
-                    overlayY: 'bottom',
-                    offsetY: -offset,
-                },
-                {
-                    originX: 'center',
-                    originY: 'bottom',
-                    overlayX: 'center',
-                    overlayY: 'top',
-                    offsetY: offset,
-                },
-            ];
-        case 'bottom':
-            return [
-                {
-                    originX: 'center',
-                    originY: 'bottom',
-                    overlayX: 'center',
-                    overlayY: 'top',
-                    offsetY: offset,
-                },
-                {
-                    originX: 'center',
-                    originY: 'top',
-                    overlayX: 'center',
-                    overlayY: 'bottom',
-                    offsetY: -offset,
-                },
-            ];
-        case 'left':
-            return [
-                {
-                    originX: 'start',
-                    originY: 'center',
-                    overlayX: 'end',
-                    overlayY: 'center',
-                    offsetX: -offset,
-                },
-                {
-                    originX: 'end',
-                    originY: 'center',
-                    overlayX: 'start',
-                    overlayY: 'center',
-                    offsetX: offset,
-                },
-            ];
-        case 'right':
-            return [
-                {
-                    originX: 'end',
-                    originY: 'center',
-                    overlayX: 'start',
-                    overlayY: 'center',
-                    offsetX: offset,
-                },
-                {
-                    originX: 'start',
-                    originY: 'center',
-                    overlayX: 'end',
-                    overlayY: 'center',
-                    offsetX: -offset,
-                },
-            ];
+    const [side, align] = split(placement);
+    return [position(side, align, offset), position(OPPOSITE[side], align, offset)];
+}
+/**
+ * İmleç konumuna açılan paneller (ContextMenu) — köşe tetikleyiciye yapışık,
+ * dört çeyrekte flip; origin her zaman imlece bakan köşe.
+ */
+function pointerPositions() {
+    return [
+        {
+            originX: 'start',
+            originY: 'top',
+            overlayX: 'start',
+            overlayY: 'top',
+            panelClass: ['mf-side-bottom', 'mf-origin-top-start'],
+        },
+        {
+            originX: 'start',
+            originY: 'top',
+            overlayX: 'start',
+            overlayY: 'bottom',
+            panelClass: ['mf-side-top', 'mf-origin-bottom-start'],
+        },
+        {
+            originX: 'start',
+            originY: 'top',
+            overlayX: 'end',
+            overlayY: 'top',
+            panelClass: ['mf-side-bottom', 'mf-origin-top-end'],
+        },
+        {
+            originX: 'start',
+            originY: 'top',
+            overlayX: 'end',
+            overlayY: 'bottom',
+            panelClass: ['mf-side-top', 'mf-origin-bottom-end'],
+        },
+    ];
+}
+
+/** `prefers-reduced-motion: reduce` — SSR/jsdom'da (matchMedia yok) `false`. */
+function prefersReducedMotion() {
+    return (typeof matchMedia !== 'undefined' && matchMedia('(prefers-reduced-motion: reduce)').matches);
+}
+/** CSS süre string'ini (`120ms`, `0.2s`) milisaniyeye çevirir; çözülemezse `null`. */
+function parseCssDuration(raw) {
+    const value = raw.trim();
+    const match = /^(-?\d*\.?\d+)(ms|s)$/.exec(value);
+    if (!match)
+        return null;
+    const n = Number(match[1]);
+    return match[2] === 's' ? n * 1000 : n;
+}
+const DEFAULT_EXIT_MS = 120;
+/**
+ * Overlay/dialog/toast çıkış animasyonunun süresi — `--mf-duration-exit`
+ * (styles/tokens/motion.css) TEK kaynak. Eskiden `dialog.service.ts`,
+ * `popover.ts`, `toast.service.ts` her biri `EXIT_MS = 120` sabitini CSS'le
+ * ELLE eşitliyordu; token değişince JS kısa kalıp panel animasyonun ortasında
+ * kopuyordu. Reduced-motion'da `0` (panel anında kaldırılır).
+ */
+function exitDurationMs() {
+    if (prefersReducedMotion())
+        return 0;
+    if (typeof document === 'undefined' || typeof getComputedStyle === 'undefined') {
+        return DEFAULT_EXIT_MS;
+    }
+    const raw = getComputedStyle(document.documentElement).getPropertyValue('--mf-duration-exit');
+    return parseCssDuration(raw) ?? DEFAULT_EXIT_MS;
+}
+
+/**
+ * `<span mfSlidingIndicator [track]="selected()" class="-bottom-px h-0.5 bg-accent-fill"></span>`
+ *
+ * Kitin ortak "kayan gösterge" motoru — Tabs'ın çizgisi/hapı, SegmentedControl'ün
+ * parçası, TabNav'ın çizgisi ve hover-izleme vurgusu AYNI hareketi paylaşsın diye.
+ * Kapsayıcı (varsayılan `parentElement`, `relative` olmalı) içinde `target`'ı
+ * bulur, onun `offsetLeft/offsetWidth`'ine (x) ya da `offsetTop/offsetHeight`'ına
+ * (y) göre `transform` + boyut yazar.
+ *
+ * - **Hareket:** hedef bir öğeden BAŞKA bir öğeye geçince yay eğrisiyle kayar
+ *   (`ease-spring`, `duration-slow`). İlk görünüm, hedefin yeniden belirmesi ve
+ *   yeniden boyutlanma (ResizeObserver, font yüklenmesi) ANINDA — göstergenin
+ *   0'dan "uçarak" gelmesi olmaz. Opaklık her zaman yumuşak geçer.
+ * - **Çapraz eksen** tüketicinin sınıfıdır (`-bottom-px h-0.5`, `inset-y-0`…);
+ *   motor yalnız ana ekseni yazar.
+ * - **RTL:** `left-0` + `offsetLeft` + `translateX` üçü de fiziksel — birlikte
+ *   RTL'de doğru (bkz. scripts/rtl-rules.mjs allowlist).
+ * - `target` `null` ise gösterge son konumunda solar (hover bitişi).
+ * - Azaltılmış harekette `motion.css`'in global anahtarı geçişleri sıfırlar.
+ */
+class SlidingIndicator {
+    axis = input('x', /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "axis" }] : /* istanbul ignore next */ []));
+    /** Kapsayıcı içinde çözülen CSS seçici, somut bir öğe ya da `null` (gizli). */
+    target = input('[aria-selected="true"]', /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "target" }] : /* istanbul ignore next */ []));
+    /** Herhangi bir değer — değişince (ör. seçim sinyali) hedef yeniden ölçülür. */
+    track = input(/* @ts-ignore */
+    ...(ngDevMode ? [undefined, { debugName: "track" }] : /* istanbul ignore next */ []));
+    /** Ölçüm kapsayıcısı; varsayılan `parentElement` (offsetParent olmalı). */
+    container = input(/* @ts-ignore */
+    ...(ngDevMode ? [undefined, { debugName: "container" }] : /* istanbul ignore next */ []));
+    el = inject(ElementRef).nativeElement;
+    current = null;
+    constructor() {
+        afterRenderEffect(() => {
+            this.target();
+            this.track();
+            this.axis();
+            this.update(true);
+        });
+        const destroyRef = inject(DestroyRef);
+        afterNextRender(() => {
+            const box = this.box();
+            if (!box || typeof ResizeObserver === 'undefined')
+                return;
+            const observer = new ResizeObserver(() => this.update(false));
+            observer.observe(box);
+            destroyRef.onDestroy(() => observer.disconnect());
+        });
+    }
+    /** Dışarıdan yeniden ölçüm (ör. içerik değişti ama seçim değişmedi). */
+    refresh(animate = false) {
+        this.update(animate);
+    }
+    box() {
+        return this.container() ?? this.el.parentElement;
+    }
+    resolve() {
+        const target = this.target();
+        if (!target)
+            return null;
+        if (typeof target !== 'string')
+            return target;
+        return this.box()?.querySelector(target) ?? null;
+    }
+    update(allowAnimate) {
+        const target = this.resolve();
+        const style = this.el.style;
+        if (!target) {
+            style.opacity = '0';
+            this.current = null;
+            return;
+        }
+        const animate = allowAnimate && this.current !== null && this.current !== target;
+        // Anında yol: geometri geçişsiz yazılır, opaklık yine yumuşak kalır.
+        if (!animate)
+            style.transitionProperty = 'opacity';
+        if (this.axis() === 'y') {
+            style.transform = `translateY(${target.offsetTop}px)`;
+            style.height = `${target.offsetHeight}px`;
+            style.width = '';
+        }
+        else {
+            style.transform = `translateX(${target.offsetLeft}px)`;
+            style.width = `${target.offsetWidth}px`;
+            style.height = '';
+        }
+        style.opacity = '1';
+        if (!animate) {
+            // Yeniden akışı zorla ki geçiş özelliği geri gelince konum değişimi animasyonlanmasın.
+            void this.el.getBoundingClientRect();
+            style.transitionProperty = '';
+        }
+        this.current = target;
     }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.6", ngImport: i0, type: SlidingIndicator, deps: [], target: i0.ɵɵFactoryTarget.Directive });
+    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "22.1.6", type: SlidingIndicator, isStandalone: true, selector: "[mfSlidingIndicator]", inputs: { axis: { classPropertyName: "axis", publicName: "axis", isSignal: true, isRequired: false, transformFunction: null }, target: { classPropertyName: "target", publicName: "target", isSignal: true, isRequired: false, transformFunction: null }, track: { classPropertyName: "track", publicName: "track", isSignal: true, isRequired: false, transformFunction: null }, container: { classPropertyName: "container", publicName: "container", isSignal: true, isRequired: false, transformFunction: null } }, host: { attributes: { "aria-hidden": "true" }, properties: { "class.left-0": "axis() === 'x'", "class.top-0": "axis() === 'y'" }, classAttribute: "pointer-events-none absolute opacity-0 transition-[transform,width,height,opacity] duration-slow ease-spring" }, exportAs: ["mfSlidingIndicator"], ngImport: i0 });
 }
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.6", ngImport: i0, type: SlidingIndicator, decorators: [{
+            type: Directive,
+            args: [{
+                    selector: '[mfSlidingIndicator]',
+                    exportAs: 'mfSlidingIndicator',
+                    host: {
+                        class: 'pointer-events-none absolute opacity-0 transition-[transform,width,height,opacity] duration-slow ease-spring',
+                        '[class.left-0]': "axis() === 'x'",
+                        '[class.top-0]': "axis() === 'y'",
+                        'aria-hidden': 'true',
+                    },
+                }]
+        }], ctorParameters: () => [], propDecorators: { axis: [{ type: i0.Input, args: [{ isSignal: true, alias: "axis", required: false }] }], target: [{ type: i0.Input, args: [{ isSignal: true, alias: "target", required: false }] }], track: [{ type: i0.Input, args: [{ isSignal: true, alias: "track", required: false }] }], container: [{ type: i0.Input, args: [{ isSignal: true, alias: "container", required: false }] }] } });
 
 function isPlainObject(value) {
     return typeof value === 'object' && value !== null && !Array.isArray(value);
@@ -319,6 +482,8 @@ const mfLabelsEn = {
         presetLast7: 'Last 7 days',
         presetLast30: 'Last 30 days',
         presetThisMonth: 'This month',
+        date: 'Date',
+        time: 'Time',
     },
     timePicker: {
         placeholder: 'hh:mm',
@@ -428,6 +593,8 @@ const mfLabelsEn = {
     combobox: {
         placeholder: 'Search...',
         noResults: 'No results',
+        create: 'Create “{query}”',
+        remove: 'Remove {label}',
     },
     select: {
         placeholder: 'Select',
@@ -445,6 +612,9 @@ const mfLabelsEn = {
     },
     stepper: {
         ariaLabel: 'Steps',
+        optional: 'Optional',
+        completed: 'Completed',
+        error: 'Needs attention',
     },
     progress: {
         ariaLabel: 'Progress',
@@ -520,6 +690,130 @@ const mfLabelsEn = {
         searchPlaceholder: 'Search…',
         noResults: 'No results',
     },
+    statTile: {
+        increase: 'Increase',
+        decrease: 'Decrease',
+        noChange: 'No change',
+    },
+    slider: {
+        minThumb: 'Minimum',
+        maxThumb: 'Maximum',
+    },
+    splitButton: {
+        moreActions: 'More actions',
+    },
+    fileUpload: {
+        uploading: 'Uploading…',
+        done: 'Uploaded',
+        failed: 'Upload failed',
+        queued: 'Waiting…',
+        retry: 'Retry',
+        cancel: 'Cancel',
+        remove: 'Remove',
+        files: '{count} files',
+    },
+    sortable: {
+        instructions: 'Press Space to pick up, arrow keys to move, Space to drop, Escape to cancel.',
+        grabbed: '{item} grabbed. Position {position} of {total}.',
+        moved: '{item} moved to position {position} of {total}.',
+        movedToColumn: '{item} moved to {column}, position {position} of {total}.',
+        dropped: '{item} dropped at position {position} of {total}.',
+        cancelled: 'Move cancelled. {item} returned to position {position}.',
+        dragHandle: 'Reorder {item}',
+        card: 'card',
+    },
+    countdown: {
+        days: 'days',
+        hours: 'hours',
+        minutes: 'minutes',
+        seconds: 'seconds',
+        remaining: '{time} remaining',
+        finished: 'Time is up',
+    },
+    carousel: {
+        previous: 'Previous slide',
+        next: 'Next slide',
+        slide: '{index} of {total}',
+        pause: 'Pause autoplay',
+        play: 'Start autoplay',
+        goTo: 'Go to slide {index}',
+        carousel: 'Carousel',
+    },
+    inlineEdit: {
+        edit: 'Edit',
+        save: 'Save',
+        cancel: 'Cancel',
+        empty: 'Click to add',
+    },
+    transferList: {
+        available: 'Available',
+        selected: 'Selected',
+        moveRight: 'Move selected right',
+        moveLeft: 'Move selected left',
+        moveAllRight: 'Move all right',
+        moveAllLeft: 'Move all left',
+        search: 'Search',
+        count: '{selected} of {total} selected',
+        empty: 'No items',
+    },
+    lightbox: {
+        close: 'Close',
+        previous: 'Previous image',
+        next: 'Next image',
+        zoomIn: 'Zoom in',
+        zoomOut: 'Zoom out',
+        counter: '{index} of {total}',
+        gallery: 'Image viewer',
+    },
+    notificationCenter: {
+        title: 'Notifications',
+        markAllRead: 'Mark all as read',
+        empty: 'You are all caught up',
+        emptyDescription: 'New notifications will show up here.',
+        unread: 'Unread',
+        trigger: 'Notifications, {count} unread',
+        viewAll: 'View all',
+    },
+    agenda: {
+        allDay: 'All day',
+        empty: 'Nothing scheduled',
+        today: 'Today',
+        tomorrow: 'Tomorrow',
+    },
+    mention: {
+        suggestions: 'Suggestions',
+        noResults: 'No matches',
+    },
+    panelGroup: {
+        resize: 'Resize panel {index}',
+    },
+    authCard: {
+        title: 'Welcome back',
+        description: 'Sign in to continue to your workspace.',
+        email: 'Email',
+        emailPlaceholder: 'you@company.com',
+        password: 'Password',
+        forgotPassword: 'Forgot password?',
+        remember: 'Keep me signed in',
+        submit: 'Sign in',
+        divider: 'or continue with email',
+        noAccount: 'New here?',
+        signUp: 'Create an account',
+        emailRequired: 'Email is required',
+        emailInvalid: 'Enter a valid email',
+        passwordRequired: 'Password is required',
+        errorTitle: 'Sign-in failed',
+    },
+    inviteMembers: {
+        title: 'Invite teammates',
+        description: 'They will receive an email with a link to join.',
+        emails: 'Email addresses',
+        emailsPlaceholder: 'name@company.com, press Enter',
+        role: 'Role',
+        submit: 'Send invites',
+        invalidEmails: 'Not valid: {emails}',
+        emailsRequired: 'Add at least one email address',
+    },
 };
 
 /**
@@ -583,6 +877,22 @@ const MF_TOUR_LABELS = labelToken('tour', 'tour');
 const MF_RATING_LABELS = labelToken('rating', 'rating');
 const MF_THEME_SWITCHER_LABELS = labelToken('themeSwitcher', 'theme-switcher');
 const MF_TREE_SELECT_LABELS = labelToken('treeSelect', 'tree-select');
+const MF_STAT_TILE_LABELS = labelToken('statTile', 'stat-tile');
+const MF_SLIDER_LABELS = labelToken('slider', 'slider');
+const MF_SPLIT_BUTTON_LABELS = labelToken('splitButton', 'split-button');
+const MF_FILE_UPLOAD_LABELS = labelToken('fileUpload', 'file-upload');
+const MF_SORTABLE_LABELS = labelToken('sortable', 'sortable');
+const MF_COUNTDOWN_LABELS = labelToken('countdown', 'countdown');
+const MF_CAROUSEL_LABELS = labelToken('carousel', 'carousel');
+const MF_INLINE_EDIT_LABELS = labelToken('inlineEdit', 'inline-edit');
+const MF_TRANSFER_LIST_LABELS = labelToken('transferList', 'transfer-list');
+const MF_LIGHTBOX_LABELS = labelToken('lightbox', 'lightbox');
+const MF_NOTIFICATION_CENTER_LABELS = labelToken('notificationCenter', 'notification-center');
+const MF_AGENDA_LABELS = labelToken('agenda', 'agenda');
+const MF_MENTION_LABELS = labelToken('mention', 'mention');
+const MF_PANEL_GROUP_LABELS = labelToken('panelGroup', 'panel-group');
+const MF_AUTH_CARD_LABELS = labelToken('authCard', 'auth-card');
+const MF_INVITE_MEMBERS_LABELS = labelToken('inviteMembers', 'invite-members');
 
 /**
  * `app.config.ts`'in `providers` dizisine eklenir — `MF_LABELS`/`MF_DATE_LOCALE`'ı
@@ -611,7 +921,10 @@ function provideMesgflowUi(options = {}) {
     }
     if (options.dateLocale) {
         const dateLocale = options.dateLocale;
-        providers.push({ provide: MF_DATE_LOCALE, useFactory: () => signal(dateLocale) });
+        providers.push({
+            provide: MF_DATE_LOCALE,
+            useFactory: () => (isSignal(dateLocale) ? dateLocale : signal(dateLocale)),
+        });
     }
     return makeEnvironmentProviders(providers);
 }
@@ -620,5 +933,5 @@ function provideMesgflowUi(options = {}) {
  * Generated bundle index. Do not edit.
  */
 
-export { MF_ALERT_LABELS, MF_AVATAR_GROUP_LABELS, MF_BOX_INPUT_LABELS, MF_BREADCRUMB_LABELS, MF_CHARACTER_COUNT_LABELS, MF_CHART_LABELS, MF_CHIP_LABELS, MF_COLOR_PICKER_LABELS, MF_COMBOBOX_LABELS, MF_COMMAND_LABELS, MF_COMMON_LABELS, MF_COPY_LABELS, MF_DATE_LOCALE, MF_DATE_PICKER_LABELS, MF_DIALOG_LABELS, MF_DROPZONE_LABELS, MF_LABELS, MF_OTP_INPUT_LABELS, MF_PAGINATION_LABELS, MF_PASSWORD_INPUT_LABELS, MF_PROGRESS_LABELS, MF_RATING_LABELS, MF_SEARCH_INPUT_LABELS, MF_SELECT_LABELS, MF_SIDEBAR_LABELS, MF_STEPPER_LABELS, MF_TABLE_LABELS, MF_TABS_LABELS, MF_THEME_SWITCHER_LABELS, MF_TIME_PICKER_LABELS, MF_TOAST_LABELS, MF_TOUR_LABELS, MF_TREE_SELECT_LABELS, ValueAccessorBase, cn, containerSurface, controlSize, controlSurface, disabledRecipe, errorRecipe, focusRecipe, glassSurface, inlineStartRatio, isRtl, mergeLabels, mfLabelsEn, nextId, overlayPositions, overlaySurface, pressRecipe, provideMesgflowUi, scrollFromInlineStart, transitionRecipe };
+export { MF_AGENDA_LABELS, MF_ALERT_LABELS, MF_AUTH_CARD_LABELS, MF_AVATAR_GROUP_LABELS, MF_BOX_INPUT_LABELS, MF_BREADCRUMB_LABELS, MF_CAROUSEL_LABELS, MF_CHARACTER_COUNT_LABELS, MF_CHART_LABELS, MF_CHIP_LABELS, MF_COLOR_PICKER_LABELS, MF_COMBOBOX_LABELS, MF_COMMAND_LABELS, MF_COMMON_LABELS, MF_COPY_LABELS, MF_COUNTDOWN_LABELS, MF_DATE_LOCALE, MF_DATE_PICKER_LABELS, MF_DIALOG_LABELS, MF_DROPZONE_LABELS, MF_FILE_UPLOAD_LABELS, MF_INLINE_EDIT_LABELS, MF_INVITE_MEMBERS_LABELS, MF_LABELS, MF_LIGHTBOX_LABELS, MF_MENTION_LABELS, MF_NOTIFICATION_CENTER_LABELS, MF_OTP_INPUT_LABELS, MF_PAGINATION_LABELS, MF_PANEL_GROUP_LABELS, MF_PASSWORD_INPUT_LABELS, MF_PROGRESS_LABELS, MF_RATING_LABELS, MF_SEARCH_INPUT_LABELS, MF_SELECT_LABELS, MF_SIDEBAR_LABELS, MF_SLIDER_LABELS, MF_SORTABLE_LABELS, MF_SPLIT_BUTTON_LABELS, MF_STAT_TILE_LABELS, MF_STEPPER_LABELS, MF_TABLE_LABELS, MF_TABS_LABELS, MF_THEME_SWITCHER_LABELS, MF_TIME_PICKER_LABELS, MF_TOAST_LABELS, MF_TOUR_LABELS, MF_TRANSFER_LIST_LABELS, MF_TREE_SELECT_LABELS, SlidingIndicator, ValueAccessorBase, cn, containerSurface, controlSize, controlSurface, disabledRecipe, errorRecipe, exitDurationMs, focusRecipe, glassSurface, inlineStartRatio, isRtl, mergeLabels, mfLabelsEn, nextId, overlayPositions, overlaySurface, parseCssDuration, pointerPositions, prefersReducedMotion, pressRecipe, provideMesgflowUi, scrollFromInlineStart, transitionRecipe };
 //# sourceMappingURL=mesgflow-ui-kit-core.mjs.map