@mesgflow/ui-kit 0.7.0 → 0.8.0

package/fesm2022/mesgflow-ui-kit-notification-center.mjs

@@ -47,8 +47,8 @@ class NotificationCenter {
         this.notifications.update((list) => list.map((x) => (x.id === n.id ? { ...x, read: true } : x)));
         this.itemClick.emit(n);
     }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.6", ngImport: i0, type: NotificationCenter, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.1.6", type: NotificationCenter, isStandalone: true, selector: "mf-notification-center", inputs: { notifications: { classPropertyName: "notifications", publicName: "notifications", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { notifications: "notificationsChange", itemClick: "itemClick", viewAll: "viewAll" }, host: { classAttribute: "inline-flex" }, exportAs: ["mfNotificationCenter"], ngImport: i0, template: `
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.7", ngImport: i0, type: NotificationCenter, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.1.7", type: NotificationCenter, isStandalone: true, selector: "mf-notification-center", inputs: { notifications: { classPropertyName: "notifications", publicName: "notifications", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { notifications: "notificationsChange", itemClick: "itemClick", viewAll: "viewAll" }, host: { classAttribute: "inline-flex" }, exportAs: ["mfNotificationCenter"], ngImport: i0, template: `
     <button
       mfButton
       appearance="ghost"
@@ -156,7 +156,7 @@ class NotificationCenter {
     </mf-popover>
   `, isInline: true, dependencies: [{ kind: "ngmodule", type: OverlayModule }, { kind: "directive", type: i1.CdkOverlayOrigin, selector: "[cdk-overlay-origin], [overlay-origin], [cdkOverlayOrigin]", exportAs: ["cdkOverlayOrigin"] }, { kind: "component", type: Popover, selector: "mf-popover", inputs: ["origin", "open", "placement", "padding", "hasBackdrop", "matchTriggerWidth", "panelClass"], outputs: ["openChange", "closed"], exportAs: ["mfPopover"] }, { kind: "component", type: Button, selector: "button[mfButton], a[mfButton]", inputs: ["tone", "appearance", "size", "shape", "type", "loading", "iconStart", "iconEnd"], exportAs: ["mfButton"] }, { kind: "directive", type: Icon, selector: "span[mfIcon]", inputs: ["size", "filled"] }, { kind: "component", type: Avatar, selector: "mf-avatar", inputs: ["name", "src", "size", "shape", "colorful", "tone"] }] });
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.6", ngImport: i0, type: NotificationCenter, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.7", ngImport: i0, type: NotificationCenter, decorators: [{
             type: Component,
             args: [{
                     selector: 'mf-notification-center',

package/fesm2022/mesgflow-ui-kit-number-input.mjs

@@ -136,12 +136,12 @@ class NumberInput {
         event.currentTarget.releasePointerCapture(event.pointerId);
         this.onTouched();
     }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.6", ngImport: i0, type: NumberInput, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.1.6", type: NumberInput, isStandalone: true, selector: "mf-number-input", inputs: { value: { classPropertyName: "value", publicName: "value", 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 }, step: { classPropertyName: "step", publicName: "step", isSignal: true, isRequired: false, transformFunction: null }, unit: { classPropertyName: "unit", publicName: "unit", isSignal: true, isRequired: false, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null }, hasError: { classPropertyName: "hasError", publicName: "hasError", isSignal: true, isRequired: false, transformFunction: null }, inputId: { classPropertyName: "inputId", publicName: "inputId", isSignal: true, isRequired: false, transformFunction: null }, ariaLabel: { classPropertyName: "ariaLabel", publicName: "ariaLabel", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { value: "valueChange" }, host: { classAttribute: "inline-flex" }, providers: [
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.7", ngImport: i0, type: NumberInput, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.1.7", type: NumberInput, isStandalone: true, selector: "mf-number-input", inputs: { value: { classPropertyName: "value", publicName: "value", 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 }, step: { classPropertyName: "step", publicName: "step", isSignal: true, isRequired: false, transformFunction: null }, unit: { classPropertyName: "unit", publicName: "unit", isSignal: true, isRequired: false, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null }, hasError: { classPropertyName: "hasError", publicName: "hasError", isSignal: true, isRequired: false, transformFunction: null }, inputId: { classPropertyName: "inputId", publicName: "inputId", isSignal: true, isRequired: false, transformFunction: null }, ariaLabel: { classPropertyName: "ariaLabel", publicName: "ariaLabel", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { value: "valueChange" }, host: { classAttribute: "inline-flex" }, providers: [
             { provide: NG_VALUE_ACCESSOR, useExisting: forwardRef(() => NumberInput), multi: true },
         ], exportAs: ["mfNumberInput"], ngImport: i0, template: "<mf-input-group [padded]=\"false\" [hasError]=\"hasError()\" [disabled]=\"disabled()\">\r\n  <button\r\n    type=\"button\"\r\n    mfInputPrefix\r\n    class=\"w-8 justify-center rounded-s-md text-fg-subtle transition-colors duration-fast ease-emphasis hover:bg-state-hover hover:text-fg disabled:pointer-events-none disabled:opacity-50\"\r\n    [disabled]=\"!canDecrement()\"\r\n    (click)=\"adjust(-step())\"\r\n    tabindex=\"-1\"\r\n    aria-hidden=\"true\"\r\n  >\r\n    <span mfIcon [size]=\"16\">remove</span>\r\n  </button>\r\n  <input\r\n    mfInput\r\n    [attr.id]=\"inputId() || null\"\r\n    type=\"text\"\r\n    inputmode=\"decimal\"\r\n    role=\"spinbutton\"\r\n    class=\"min-w-0 flex-1 border-0 bg-transparent px-1 py-1.5 text-center shadow-none focus-visible:outline-none disabled:cursor-not-allowed\"\r\n    [value]=\"value() ?? ''\"\r\n    [disabled]=\"disabled()\"\r\n    [attr.aria-label]=\"ariaLabel() || null\"\r\n    [attr.aria-valuemin]=\"min()\"\r\n    [attr.aria-valuemax]=\"max()\"\r\n    [attr.aria-valuenow]=\"value()\"\r\n    (input)=\"onInputChange($any($event.target).value)\"\r\n    (blur)=\"onBlur()\"\r\n    (keydown)=\"onKeydown($event)\"\r\n  />\r\n  @if (unit()) {\r\n    <span\r\n      class=\"number-input-unit flex shrink-0 items-center pe-2 text-sm text-fg-subtle select-none\"\r\n      [class.cursor-ew-resize]=\"!disabled()\"\r\n      aria-hidden=\"true\"\r\n      (pointerdown)=\"onUnitPointerDown($event)\"\r\n      (pointermove)=\"onUnitPointerMove($event)\"\r\n      (pointerup)=\"onUnitPointerUp($event)\"\r\n      >{{ unit() }}</span\r\n    >\r\n  }\r\n  <button\r\n    type=\"button\"\r\n    mfInputSuffix\r\n    class=\"w-8 justify-center rounded-e-md text-fg-subtle transition-colors duration-fast ease-emphasis hover:bg-state-hover hover:text-fg disabled:pointer-events-none disabled:opacity-50\"\r\n    [disabled]=\"!canIncrement()\"\r\n    (click)=\"adjust(step())\"\r\n    tabindex=\"-1\"\r\n    aria-hidden=\"true\"\r\n  >\r\n    <span mfIcon [size]=\"16\">add</span>\r\n  </button>\r\n</mf-input-group>\r\n", dependencies: [{ kind: "directive", type: Icon, selector: "span[mfIcon]", inputs: ["size", "filled"] }, { kind: "directive", type: Input, selector: "input[mfInput]:not([type=checkbox]):not([type=radio]), textarea[mfInput]", inputs: ["size", "hasError", "autosize", "minRows", "maxRows"] }, { kind: "component", type: InputGroup, selector: "mf-input-group", inputs: ["size", "disabled", "hasError", "padded", "wrap"], exportAs: ["mfInputGroup"] }, { kind: "directive", type: InputPrefix, selector: "[mfInputPrefix]", inputs: ["addon"] }, { kind: "directive", type: InputSuffix, selector: "[mfInputSuffix]", inputs: ["addon"] }] });
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.6", ngImport: i0, type: NumberInput, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.7", ngImport: i0, type: NumberInput, decorators: [{
             type: Component,
             args: [{ selector: 'mf-number-input', exportAs: 'mfNumberInput', host: { class: 'inline-flex' }, imports: [Icon, Input, InputGroup, InputPrefix, InputSuffix], providers: [
                         { provide: NG_VALUE_ACCESSOR, useExisting: forwardRef(() => NumberInput), multi: true },

package/fesm2022/mesgflow-ui-kit-otp-input.mjs

@@ -101,8 +101,8 @@ class OtpInput extends ValueAccessorBase {
     focusBox(i) {
         this.boxes()[i]?.nativeElement.focus();
     }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.6", ngImport: i0, type: OtpInput, deps: null, target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.1.6", type: OtpInput, isStandalone: true, selector: "mf-otp-input", inputs: { value: { classPropertyName: "value", publicName: "value", isSignal: true, isRequired: false, transformFunction: null }, length: { classPropertyName: "length", publicName: "length", isSignal: true, isRequired: false, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null }, hasError: { classPropertyName: "hasError", publicName: "hasError", isSignal: true, isRequired: false, transformFunction: null }, ariaLabel: { classPropertyName: "ariaLabel", publicName: "ariaLabel", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { value: "valueChange" }, host: { classAttribute: "inline-flex gap-2" }, providers: [{ provide: NG_VALUE_ACCESSOR, useExisting: forwardRef(() => OtpInput), multi: true }], viewQueries: [{ propertyName: "boxes", predicate: ["boxEl"], descendants: true, isSignal: true }], exportAs: ["mfOtpInput"], usesInheritance: true, ngImport: i0, template: `
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.7", ngImport: i0, type: OtpInput, deps: null, target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.1.7", type: OtpInput, isStandalone: true, selector: "mf-otp-input", inputs: { value: { classPropertyName: "value", publicName: "value", isSignal: true, isRequired: false, transformFunction: null }, length: { classPropertyName: "length", publicName: "length", isSignal: true, isRequired: false, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null }, hasError: { classPropertyName: "hasError", publicName: "hasError", isSignal: true, isRequired: false, transformFunction: null }, ariaLabel: { classPropertyName: "ariaLabel", publicName: "ariaLabel", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { value: "valueChange" }, host: { classAttribute: "inline-flex gap-2" }, providers: [{ provide: NG_VALUE_ACCESSOR, useExisting: forwardRef(() => OtpInput), multi: true }], viewQueries: [{ propertyName: "boxes", predicate: ["boxEl"], descendants: true, isSignal: true }], exportAs: ["mfOtpInput"], usesInheritance: true, ngImport: i0, template: `
     @for (i of indexes(); track i) {
       <input
         mfInput
@@ -124,7 +124,7 @@ class OtpInput extends ValueAccessorBase {
     }
   `, isInline: true, dependencies: [{ kind: "directive", type: Input, selector: "input[mfInput]:not([type=checkbox]):not([type=radio]), textarea[mfInput]", inputs: ["size", "hasError", "autosize", "minRows", "maxRows"] }] });
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.6", ngImport: i0, type: OtpInput, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.7", ngImport: i0, type: OtpInput, decorators: [{
             type: Component,
             args: [{
                     selector: 'mf-otp-input',

package/fesm2022/mesgflow-ui-kit-page-header.mjs

@@ -22,8 +22,8 @@ class PageHeader {
     ...(ngDevMode ? [{ debugName: "description" }] : /* istanbul ignore next */ []));
     breadcrumbItems = input([], /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "breadcrumbItems" }] : /* istanbul ignore next */ []));
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.6", ngImport: i0, type: PageHeader, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.1.6", type: PageHeader, isStandalone: true, selector: "mf-page-header", inputs: { title: { classPropertyName: "title", publicName: "title", isSignal: true, isRequired: true, transformFunction: null }, description: { classPropertyName: "description", publicName: "description", isSignal: true, isRequired: false, transformFunction: null }, breadcrumbItems: { classPropertyName: "breadcrumbItems", publicName: "breadcrumbItems", isSignal: true, isRequired: false, transformFunction: null } }, host: { classAttribute: "block @container" }, exportAs: ["mfPageHeader"], ngImport: i0, template: `
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.7", ngImport: i0, type: PageHeader, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.1.7", type: PageHeader, isStandalone: true, selector: "mf-page-header", inputs: { title: { classPropertyName: "title", publicName: "title", isSignal: true, isRequired: true, transformFunction: null }, description: { classPropertyName: "description", publicName: "description", isSignal: true, isRequired: false, transformFunction: null }, breadcrumbItems: { classPropertyName: "breadcrumbItems", publicName: "breadcrumbItems", isSignal: true, isRequired: false, transformFunction: null } }, host: { classAttribute: "block @container" }, exportAs: ["mfPageHeader"], ngImport: i0, template: `
     @if (breadcrumbItems().length > 0) {
       <mf-breadcrumb [items]="breadcrumbItems()" class="mb-2 block" />
     }
@@ -38,7 +38,7 @@ class PageHeader {
     </div>
   `, isInline: true, dependencies: [{ kind: "component", type: Breadcrumb, selector: "mf-breadcrumb", inputs: ["items", "ariaLabel"], exportAs: ["mfBreadcrumb"] }] });
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.6", ngImport: i0, type: PageHeader, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.7", ngImport: i0, type: PageHeader, decorators: [{
             type: Component,
             args: [{
                     selector: 'mf-page-header',
@@ -64,10 +64,10 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.6", ngImpor
 
 /** `<div mfPageHeaderActions><button mfButton>...</button></div>` — bkz. `page-header.ts`'in JSDoc'u. */
 class PageHeaderActions {
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.6", ngImport: i0, type: PageHeaderActions, deps: [], target: i0.ɵɵFactoryTarget.Directive });
-    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "22.1.6", type: PageHeaderActions, isStandalone: true, selector: "[mfPageHeaderActions]", host: { classAttribute: "flex shrink-0 items-center gap-2" }, ngImport: i0 });
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.7", ngImport: i0, type: PageHeaderActions, deps: [], target: i0.ɵɵFactoryTarget.Directive });
+    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "22.1.7", type: PageHeaderActions, isStandalone: true, selector: "[mfPageHeaderActions]", host: { classAttribute: "flex shrink-0 items-center gap-2" }, ngImport: i0 });
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.6", ngImport: i0, type: PageHeaderActions, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.7", ngImport: i0, type: PageHeaderActions, decorators: [{
             type: Directive,
             args: [{
                     selector: '[mfPageHeaderActions]',

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

@@ -84,10 +84,10 @@ class Pagination {
         if (next !== this.current())
             this.page.set(next);
     }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.6", ngImport: i0, type: Pagination, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.1.6", type: Pagination, isStandalone: true, selector: "mf-pagination", inputs: { page: { classPropertyName: "page", publicName: "page", isSignal: true, isRequired: false, transformFunction: null }, pageCount: { classPropertyName: "pageCount", publicName: "pageCount", isSignal: true, isRequired: true, transformFunction: null }, siblings: { classPropertyName: "siblings", publicName: "siblings", isSignal: true, isRequired: false, transformFunction: null }, showEdges: { classPropertyName: "showEdges", publicName: "showEdges", isSignal: true, isRequired: false, transformFunction: null }, compact: { classPropertyName: "compact", publicName: "compact", isSignal: true, isRequired: false, transformFunction: null }, size: { classPropertyName: "size", publicName: "size", isSignal: true, isRequired: false, transformFunction: null }, ariaLabel: { classPropertyName: "ariaLabel", publicName: "ariaLabel", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { page: "pageChange" }, host: { classAttribute: "block" }, exportAs: ["mfPagination"], ngImport: i0, template: "<nav class=\"flex items-center gap-0.5\" [attr.aria-label]=\"effectiveAriaLabel()\">\r\n  @if (showEdges()) {\r\n    <button\r\n      type=\"button\"\r\n      [class]=\"cell()\"\r\n      [disabled]=\"current() === 1\"\r\n      [attr.aria-label]=\"labels().first\"\r\n      (click)=\"goTo(1)\"\r\n    >\r\n      <span mfIcon [size]=\"16\" class=\"rtl:-scale-x-100\">first_page</span>\r\n    </button>\r\n  }\r\n  <button\r\n    type=\"button\"\r\n    [class]=\"cell()\"\r\n    [disabled]=\"current() === 1\"\r\n    [attr.aria-label]=\"labels().previous\"\r\n    (click)=\"goTo(current() - 1)\"\r\n  >\r\n    <span mfIcon [size]=\"16\" class=\"rtl:-scale-x-100\">chevron_left</span>\r\n  </button>\r\n\r\n  @if (compact()) {\r\n    <span class=\"px-2 text-sm text-fg-muted tabular-nums\" aria-live=\"polite\">\r\n      {{ labels().page }} {{ current() }} / {{ safeCount() }}\r\n    </span>\r\n  } @else {\r\n    @for (item of items(); track item) {\r\n      @if (item === 'ellipsis-start' || item === 'ellipsis-end') {\r\n        <span\r\n          aria-hidden=\"true\"\r\n          class=\"inline-flex min-w-8 items-center justify-center text-sm text-fg-subtle select-none\"\r\n          >\u2026</span\r\n        >\r\n      } @else {\r\n        <button\r\n          type=\"button\"\r\n          [class]=\"cell(item === current())\"\r\n          [attr.aria-current]=\"item === current() ? 'page' : null\"\r\n          [attr.aria-label]=\"labels().page + ' ' + item\"\r\n          (click)=\"goTo(item)\"\r\n        >\r\n          {{ item }}\r\n        </button>\r\n      }\r\n    }\r\n  }\r\n\r\n  <button\r\n    type=\"button\"\r\n    [class]=\"cell()\"\r\n    [disabled]=\"current() === safeCount()\"\r\n    [attr.aria-label]=\"labels().next\"\r\n    (click)=\"goTo(current() + 1)\"\r\n  >\r\n    <span mfIcon [size]=\"16\" class=\"rtl:-scale-x-100\">chevron_right</span>\r\n  </button>\r\n  @if (showEdges()) {\r\n    <button\r\n      type=\"button\"\r\n      [class]=\"cell()\"\r\n      [disabled]=\"current() === safeCount()\"\r\n      [attr.aria-label]=\"labels().last\"\r\n      (click)=\"goTo(safeCount())\"\r\n    >\r\n      <span mfIcon [size]=\"16\" class=\"rtl:-scale-x-100\">last_page</span>\r\n    </button>\r\n  }\r\n</nav>\r\n", dependencies: [{ kind: "directive", type: Icon, selector: "span[mfIcon]", inputs: ["size", "filled"] }] });
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.7", ngImport: i0, type: Pagination, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.1.7", type: Pagination, isStandalone: true, selector: "mf-pagination", inputs: { page: { classPropertyName: "page", publicName: "page", isSignal: true, isRequired: false, transformFunction: null }, pageCount: { classPropertyName: "pageCount", publicName: "pageCount", isSignal: true, isRequired: true, transformFunction: null }, siblings: { classPropertyName: "siblings", publicName: "siblings", isSignal: true, isRequired: false, transformFunction: null }, showEdges: { classPropertyName: "showEdges", publicName: "showEdges", isSignal: true, isRequired: false, transformFunction: null }, compact: { classPropertyName: "compact", publicName: "compact", isSignal: true, isRequired: false, transformFunction: null }, size: { classPropertyName: "size", publicName: "size", isSignal: true, isRequired: false, transformFunction: null }, ariaLabel: { classPropertyName: "ariaLabel", publicName: "ariaLabel", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { page: "pageChange" }, host: { classAttribute: "block" }, exportAs: ["mfPagination"], ngImport: i0, template: "<nav class=\"flex items-center gap-0.5\" [attr.aria-label]=\"effectiveAriaLabel()\">\r\n  @if (showEdges()) {\r\n    <button\r\n      type=\"button\"\r\n      [class]=\"cell()\"\r\n      [disabled]=\"current() === 1\"\r\n      [attr.aria-label]=\"labels().first\"\r\n      (click)=\"goTo(1)\"\r\n    >\r\n      <span mfIcon [size]=\"16\" class=\"rtl:-scale-x-100\">first_page</span>\r\n    </button>\r\n  }\r\n  <button\r\n    type=\"button\"\r\n    [class]=\"cell()\"\r\n    [disabled]=\"current() === 1\"\r\n    [attr.aria-label]=\"labels().previous\"\r\n    (click)=\"goTo(current() - 1)\"\r\n  >\r\n    <span mfIcon [size]=\"16\" class=\"rtl:-scale-x-100\">chevron_left</span>\r\n  </button>\r\n\r\n  @if (compact()) {\r\n    <span class=\"px-2 text-sm text-fg-muted tabular-nums\" aria-live=\"polite\">\r\n      {{ labels().page }} {{ current() }} / {{ safeCount() }}\r\n    </span>\r\n  } @else {\r\n    @for (item of items(); track item) {\r\n      @if (item === 'ellipsis-start' || item === 'ellipsis-end') {\r\n        <span\r\n          aria-hidden=\"true\"\r\n          class=\"inline-flex min-w-8 items-center justify-center text-sm text-fg-subtle select-none\"\r\n          >\u2026</span\r\n        >\r\n      } @else {\r\n        <button\r\n          type=\"button\"\r\n          [class]=\"cell(item === current())\"\r\n          [attr.aria-current]=\"item === current() ? 'page' : null\"\r\n          [attr.aria-label]=\"labels().page + ' ' + item\"\r\n          (click)=\"goTo(item)\"\r\n        >\r\n          {{ item }}\r\n        </button>\r\n      }\r\n    }\r\n  }\r\n\r\n  <button\r\n    type=\"button\"\r\n    [class]=\"cell()\"\r\n    [disabled]=\"current() === safeCount()\"\r\n    [attr.aria-label]=\"labels().next\"\r\n    (click)=\"goTo(current() + 1)\"\r\n  >\r\n    <span mfIcon [size]=\"16\" class=\"rtl:-scale-x-100\">chevron_right</span>\r\n  </button>\r\n  @if (showEdges()) {\r\n    <button\r\n      type=\"button\"\r\n      [class]=\"cell()\"\r\n      [disabled]=\"current() === safeCount()\"\r\n      [attr.aria-label]=\"labels().last\"\r\n      (click)=\"goTo(safeCount())\"\r\n    >\r\n      <span mfIcon [size]=\"16\" class=\"rtl:-scale-x-100\">last_page</span>\r\n    </button>\r\n  }\r\n</nav>\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: Pagination, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.7", ngImport: i0, type: Pagination, decorators: [{
             type: Component,
             args: [{ selector: 'mf-pagination', exportAs: 'mfPagination', imports: [Icon], host: { class: 'block' }, template: "<nav class=\"flex items-center gap-0.5\" [attr.aria-label]=\"effectiveAriaLabel()\">\r\n  @if (showEdges()) {\r\n    <button\r\n      type=\"button\"\r\n      [class]=\"cell()\"\r\n      [disabled]=\"current() === 1\"\r\n      [attr.aria-label]=\"labels().first\"\r\n      (click)=\"goTo(1)\"\r\n    >\r\n      <span mfIcon [size]=\"16\" class=\"rtl:-scale-x-100\">first_page</span>\r\n    </button>\r\n  }\r\n  <button\r\n    type=\"button\"\r\n    [class]=\"cell()\"\r\n    [disabled]=\"current() === 1\"\r\n    [attr.aria-label]=\"labels().previous\"\r\n    (click)=\"goTo(current() - 1)\"\r\n  >\r\n    <span mfIcon [size]=\"16\" class=\"rtl:-scale-x-100\">chevron_left</span>\r\n  </button>\r\n\r\n  @if (compact()) {\r\n    <span class=\"px-2 text-sm text-fg-muted tabular-nums\" aria-live=\"polite\">\r\n      {{ labels().page }} {{ current() }} / {{ safeCount() }}\r\n    </span>\r\n  } @else {\r\n    @for (item of items(); track item) {\r\n      @if (item === 'ellipsis-start' || item === 'ellipsis-end') {\r\n        <span\r\n          aria-hidden=\"true\"\r\n          class=\"inline-flex min-w-8 items-center justify-center text-sm text-fg-subtle select-none\"\r\n          >\u2026</span\r\n        >\r\n      } @else {\r\n        <button\r\n          type=\"button\"\r\n          [class]=\"cell(item === current())\"\r\n          [attr.aria-current]=\"item === current() ? 'page' : null\"\r\n          [attr.aria-label]=\"labels().page + ' ' + item\"\r\n          (click)=\"goTo(item)\"\r\n        >\r\n          {{ item }}\r\n        </button>\r\n      }\r\n    }\r\n  }\r\n\r\n  <button\r\n    type=\"button\"\r\n    [class]=\"cell()\"\r\n    [disabled]=\"current() === safeCount()\"\r\n    [attr.aria-label]=\"labels().next\"\r\n    (click)=\"goTo(current() + 1)\"\r\n  >\r\n    <span mfIcon [size]=\"16\" class=\"rtl:-scale-x-100\">chevron_right</span>\r\n  </button>\r\n  @if (showEdges()) {\r\n    <button\r\n      type=\"button\"\r\n      [class]=\"cell()\"\r\n      [disabled]=\"current() === safeCount()\"\r\n      [attr.aria-label]=\"labels().last\"\r\n      (click)=\"goTo(safeCount())\"\r\n    >\r\n      <span mfIcon [size]=\"16\" class=\"rtl:-scale-x-100\">last_page</span>\r\n    </button>\r\n  }\r\n</nav>\r\n" }]
         }], propDecorators: { page: [{ type: i0.Input, args: [{ isSignal: true, alias: "page", required: false }] }, { type: i0.Output, args: ["pageChange"] }], pageCount: [{ type: i0.Input, args: [{ isSignal: true, alias: "pageCount", required: true }] }], siblings: [{ type: i0.Input, args: [{ isSignal: true, alias: "siblings", required: false }] }], showEdges: [{ type: i0.Input, args: [{ isSignal: true, alias: "showEdges", required: false }] }], compact: [{ type: i0.Input, args: [{ isSignal: true, alias: "compact", required: false }] }], size: [{ type: i0.Input, args: [{ isSignal: true, alias: "size", required: false }] }], ariaLabel: [{ type: i0.Input, args: [{ isSignal: true, alias: "ariaLabel", required: false }] }] } });

package/fesm2022/mesgflow-ui-kit-password-input.mjs

@@ -1,5 +1,5 @@
 import * as i0 from '@angular/core';
-import { model, input, inject, computed, signal, forwardRef, Component } from '@angular/core';
+import { model, input, booleanAttribute, inject, computed, signal, forwardRef, Component } from '@angular/core';
 import { NG_VALUE_ACCESSOR } from '@angular/forms';
 import { ValueAccessorBase, MF_PASSWORD_INPUT_LABELS } from '@mesgflow/ui-kit/core';
 import { Icon } from '@mesgflow/ui-kit/icon';
@@ -12,36 +12,56 @@ import { Input, InputGroup, InputSuffix } from '@mesgflow/ui-kit/input';
  * kullanma deseni). `type="password"`/`"text"` arasında geçiş SADECE
  * görünürlük içindir — değer her zaman `value` model'inde düz metin olarak
  * tutulur.
+ *
+ * Parola yöneticisi uyumu: `autocomplete` (varsayılan `current-password`) ve
+ * `name` iç `<input>`'a iletilir; `autocapitalize="off"`/`spellcheck="false"`
+ * sabit — parola görünür moda (`type="text"`) geçtiğinde de mobil klavye büyük
+ * 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.
  */
 class PasswordInput extends ValueAccessorBase {
     value = model('', /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "value" }] : /* istanbul ignore next */ []));
     placeholder = input('', /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "placeholder" }] : /* istanbul ignore next */ []));
-    disabled = input(false, /* @ts-ignore */
-    ...(ngDevMode ? [{ debugName: "disabled" }] : /* istanbul ignore next */ []));
-    hasError = input(false, /* @ts-ignore */
-    ...(ngDevMode ? [{ debugName: "hasError" }] : /* istanbul ignore next */ []));
+    disabled = input(false, { ...(ngDevMode ? { debugName: "disabled" } : /* istanbul ignore next */ {}), transform: booleanAttribute });
+    hasError = input(false, { ...(ngDevMode ? { debugName: "hasError" } : /* istanbul ignore next */ {}), transform: booleanAttribute });
     /** İç `<input>`'un id'si — harici bir `<label for>` / `mf-field for` ile ilişkilendirmek için. */
     inputId = input(/* @ts-ignore */
     ...(ngDevMode ? [undefined, { debugName: "inputId" }] : /* istanbul ignore next */ []));
     ariaLabel = input('', /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "ariaLabel" }] : /* istanbul ignore next */ []));
-    fullWidth = input(false, /* @ts-ignore */
-    ...(ngDevMode ? [{ debugName: "fullWidth" }] : /* istanbul ignore next */ []));
+    fullWidth = input(false, { ...(ngDevMode ? { debugName: "fullWidth" } : /* istanbul ignore next */ {}), transform: booleanAttribute });
     showLabel = input(/* @ts-ignore */
     ...(ngDevMode ? [undefined, { debugName: "showLabel" }] : /* istanbul ignore next */ []));
     hideLabel = input(/* @ts-ignore */
     ...(ngDevMode ? [undefined, { debugName: "hideLabel" }] : /* istanbul ignore next */ []));
+    /** Parola yöneticisi ipucu — bkz. `PasswordAutocomplete`. */
+    autocomplete = input('current-password', /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "autocomplete" }] : /* istanbul ignore next */ []));
+    /** İç `<input>`'un `name`'i — form gönderimi ve parola yöneticilerinin alanı tanıması için. */
+    name = input(/* @ts-ignore */
+    ...(ngDevMode ? [undefined, { debugName: "name" }] : /* istanbul ignore next */ []));
+    required = input(false, { ...(ngDevMode ? { debugName: "required" } : /* istanbul ignore next */ {}), transform: booleanAttribute });
+    readonly = input(false, { ...(ngDevMode ? { debugName: "readonly" } : /* istanbul ignore next */ {}), transform: booleanAttribute });
     passwordLabels = inject(MF_PASSWORD_INPUT_LABELS);
     effectiveShowLabel = computed(() => this.showLabel() ?? this.passwordLabels().show, /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "effectiveShowLabel" }] : /* istanbul ignore next */ []));
     effectiveHideLabel = computed(() => this.hideLabel() ?? this.passwordLabels().hide, /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "effectiveHideLabel" }] : /* istanbul ignore next */ []));
+    /** Reactive Forms `control.disable()` — `disabled` girdisiyle VEYA'lanır. */
+    formDisabled = signal(false, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "formDisabled" }] : /* istanbul ignore next */ []));
+    isDisabled = computed(() => this.disabled() || this.formDisabled(), /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "isDisabled" }] : /* istanbul ignore next */ []));
     visible = signal(false, /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "visible" }] : /* istanbul ignore next */ []));
     writeValue(value) {
-        this.value.set(value);
+        this.value.set(value ?? '');
+    }
+    setDisabledState(disabled) {
+        this.formDisabled.set(disabled);
     }
     toggle() {
         this.visible.update((v) => !v);
@@ -50,72 +70,17 @@ class PasswordInput extends ValueAccessorBase {
         this.value.set(raw);
         this.onChange(raw);
     }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.6", ngImport: i0, type: PasswordInput, deps: null, target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "22.1.6", type: PasswordInput, isStandalone: true, selector: "mf-password-input", inputs: { value: { classPropertyName: "value", publicName: "value", isSignal: true, isRequired: false, transformFunction: null }, placeholder: { classPropertyName: "placeholder", publicName: "placeholder", isSignal: true, isRequired: false, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null }, hasError: { classPropertyName: "hasError", publicName: "hasError", isSignal: true, isRequired: false, transformFunction: null }, inputId: { classPropertyName: "inputId", publicName: "inputId", isSignal: true, isRequired: false, transformFunction: null }, ariaLabel: { classPropertyName: "ariaLabel", publicName: "ariaLabel", isSignal: true, isRequired: false, transformFunction: null }, fullWidth: { classPropertyName: "fullWidth", publicName: "fullWidth", isSignal: true, isRequired: false, transformFunction: null }, showLabel: { classPropertyName: "showLabel", publicName: "showLabel", isSignal: true, isRequired: false, transformFunction: null }, hideLabel: { classPropertyName: "hideLabel", publicName: "hideLabel", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { value: "valueChange" }, host: { properties: { "class.w-full": "fullWidth()" }, classAttribute: "inline-flex" }, providers: [
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.7", ngImport: i0, type: PasswordInput, deps: null, target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "22.1.7", type: PasswordInput, isStandalone: true, selector: "mf-password-input", inputs: { value: { classPropertyName: "value", publicName: "value", isSignal: true, isRequired: false, transformFunction: null }, placeholder: { classPropertyName: "placeholder", publicName: "placeholder", isSignal: true, isRequired: false, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null }, hasError: { classPropertyName: "hasError", publicName: "hasError", isSignal: true, isRequired: false, transformFunction: null }, inputId: { classPropertyName: "inputId", publicName: "inputId", isSignal: true, isRequired: false, transformFunction: null }, ariaLabel: { classPropertyName: "ariaLabel", publicName: "ariaLabel", isSignal: true, isRequired: false, transformFunction: null }, fullWidth: { classPropertyName: "fullWidth", publicName: "fullWidth", isSignal: true, isRequired: false, transformFunction: null }, showLabel: { classPropertyName: "showLabel", publicName: "showLabel", isSignal: true, isRequired: false, transformFunction: null }, hideLabel: { classPropertyName: "hideLabel", publicName: "hideLabel", isSignal: true, isRequired: false, transformFunction: null }, autocomplete: { classPropertyName: "autocomplete", publicName: "autocomplete", isSignal: true, isRequired: false, transformFunction: null }, name: { classPropertyName: "name", publicName: "name", isSignal: true, isRequired: false, transformFunction: null }, required: { classPropertyName: "required", publicName: "required", isSignal: true, isRequired: false, transformFunction: null }, readonly: { classPropertyName: "readonly", publicName: "readonly", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { value: "valueChange" }, host: { properties: { "class.w-full": "fullWidth()" }, classAttribute: "inline-flex" }, providers: [
             { provide: NG_VALUE_ACCESSOR, useExisting: forwardRef(() => PasswordInput), multi: true },
-        ], exportAs: ["mfPasswordInput"], usesInheritance: true, ngImport: i0, template: `
-    <mf-input-group [hasError]="hasError()" [disabled]="disabled()">
-      <input
-        mfInput
-        [attr.id]="inputId() || null"
-        [type]="visible() ? 'text' : 'password'"
-        class="border-0 bg-transparent p-0 shadow-none focus-visible:outline-none"
-        [value]="value()"
-        [disabled]="disabled()"
-        [placeholder]="placeholder()"
-        [attr.aria-label]="ariaLabel() || null"
-        (input)="onInput($any($event.target).value)"
-        (blur)="onTouched()"
-      />
-      <button
-        mfInputSuffix
-        type="button"
-        class="appearance-none border-0 bg-transparent p-0 transition-colors duration-fast ease-emphasis hover:text-fg"
-        [attr.aria-label]="visible() ? effectiveHideLabel() : effectiveShowLabel()"
-        (click)="toggle()"
-      >
-        <span mfIcon [size]="16">{{ visible() ? 'visibility_off' : 'visibility' }}</span>
-      </button>
-    </mf-input-group>
-  `, isInline: true, dependencies: [{ kind: "directive", type: Icon, selector: "span[mfIcon]", inputs: ["size", "filled"] }, { kind: "directive", type: Input, selector: "input[mfInput]:not([type=checkbox]):not([type=radio]), textarea[mfInput]", inputs: ["size", "hasError", "autosize", "minRows", "maxRows"] }, { kind: "component", type: InputGroup, selector: "mf-input-group", inputs: ["size", "disabled", "hasError", "padded", "wrap"], exportAs: ["mfInputGroup"] }, { kind: "directive", type: InputSuffix, selector: "[mfInputSuffix]", inputs: ["addon"] }] });
+        ], exportAs: ["mfPasswordInput"], usesInheritance: true, ngImport: i0, template: "<mf-input-group [hasError]=\"hasError()\" [disabled]=\"isDisabled()\">\r\n  <input\r\n    mfInput\r\n    [attr.id]=\"inputId() || null\"\r\n    [attr.name]=\"name() || null\"\r\n    [attr.autocomplete]=\"autocomplete()\"\r\n    autocapitalize=\"off\"\r\n    spellcheck=\"false\"\r\n    [type]=\"visible() ? 'text' : 'password'\"\r\n    class=\"border-0 bg-transparent p-0 shadow-none focus-visible:outline-none\"\r\n    [value]=\"value()\"\r\n    [disabled]=\"isDisabled()\"\r\n    [required]=\"required()\"\r\n    [readOnly]=\"readonly()\"\r\n    [placeholder]=\"placeholder()\"\r\n    [attr.aria-label]=\"ariaLabel() || null\"\r\n    (input)=\"onInput($any($event.target).value)\"\r\n    (blur)=\"onTouched()\"\r\n  />\r\n  <button\r\n    mfInputSuffix\r\n    type=\"button\"\r\n    class=\"appearance-none border-0 bg-transparent p-0 transition-colors duration-fast ease-emphasis hover:text-fg\"\r\n    [disabled]=\"isDisabled()\"\r\n    [attr.aria-label]=\"visible() ? effectiveHideLabel() : effectiveShowLabel()\"\r\n    (click)=\"toggle()\"\r\n  >\r\n    <span mfIcon [size]=\"16\">{{ visible() ? 'visibility_off' : 'visibility' }}</span>\r\n  </button>\r\n</mf-input-group>\r\n", dependencies: [{ kind: "directive", type: Icon, selector: "span[mfIcon]", inputs: ["size", "filled"] }, { kind: "directive", type: Input, selector: "input[mfInput]:not([type=checkbox]):not([type=radio]), textarea[mfInput]", inputs: ["size", "hasError", "autosize", "minRows", "maxRows"] }, { kind: "component", type: InputGroup, selector: "mf-input-group", inputs: ["size", "disabled", "hasError", "padded", "wrap"], exportAs: ["mfInputGroup"] }, { kind: "directive", type: InputSuffix, selector: "[mfInputSuffix]", inputs: ["addon"] }] });
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.6", ngImport: i0, type: PasswordInput, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.7", ngImport: i0, type: PasswordInput, decorators: [{
             type: Component,
-            args: [{
-                    selector: 'mf-password-input',
-                    exportAs: 'mfPasswordInput',
-                    imports: [Icon, Input, InputGroup, InputSuffix],
-                    host: { class: 'inline-flex', '[class.w-full]': 'fullWidth()' },
-                    template: `
-    <mf-input-group [hasError]="hasError()" [disabled]="disabled()">
-      <input
-        mfInput
-        [attr.id]="inputId() || null"
-        [type]="visible() ? 'text' : 'password'"
-        class="border-0 bg-transparent p-0 shadow-none focus-visible:outline-none"
-        [value]="value()"
-        [disabled]="disabled()"
-        [placeholder]="placeholder()"
-        [attr.aria-label]="ariaLabel() || null"
-        (input)="onInput($any($event.target).value)"
-        (blur)="onTouched()"
-      />
-      <button
-        mfInputSuffix
-        type="button"
-        class="appearance-none border-0 bg-transparent p-0 transition-colors duration-fast ease-emphasis hover:text-fg"
-        [attr.aria-label]="visible() ? effectiveHideLabel() : effectiveShowLabel()"
-        (click)="toggle()"
-      >
-        <span mfIcon [size]="16">{{ visible() ? 'visibility_off' : 'visibility' }}</span>
-      </button>
-    </mf-input-group>
-  `,
-                    providers: [
+            args: [{ selector: 'mf-password-input', exportAs: 'mfPasswordInput', imports: [Icon, Input, InputGroup, InputSuffix], host: { class: 'inline-flex', '[class.w-full]': 'fullWidth()' }, providers: [
                         { provide: NG_VALUE_ACCESSOR, useExisting: forwardRef(() => PasswordInput), multi: true },
-                    ],
-                }]
-        }], propDecorators: { value: [{ type: i0.Input, args: [{ isSignal: true, alias: "value", required: false }] }, { type: i0.Output, args: ["valueChange"] }], placeholder: [{ type: i0.Input, args: [{ isSignal: true, alias: "placeholder", required: false }] }], disabled: [{ type: i0.Input, args: [{ isSignal: true, alias: "disabled", required: false }] }], hasError: [{ type: i0.Input, args: [{ isSignal: true, alias: "hasError", required: false }] }], inputId: [{ type: i0.Input, args: [{ isSignal: true, alias: "inputId", required: false }] }], ariaLabel: [{ type: i0.Input, args: [{ isSignal: true, alias: "ariaLabel", required: false }] }], fullWidth: [{ type: i0.Input, args: [{ isSignal: true, alias: "fullWidth", required: false }] }], showLabel: [{ type: i0.Input, args: [{ isSignal: true, alias: "showLabel", required: false }] }], hideLabel: [{ type: i0.Input, args: [{ isSignal: true, alias: "hideLabel", required: false }] }] } });
+                    ], template: "<mf-input-group [hasError]=\"hasError()\" [disabled]=\"isDisabled()\">\r\n  <input\r\n    mfInput\r\n    [attr.id]=\"inputId() || null\"\r\n    [attr.name]=\"name() || null\"\r\n    [attr.autocomplete]=\"autocomplete()\"\r\n    autocapitalize=\"off\"\r\n    spellcheck=\"false\"\r\n    [type]=\"visible() ? 'text' : 'password'\"\r\n    class=\"border-0 bg-transparent p-0 shadow-none focus-visible:outline-none\"\r\n    [value]=\"value()\"\r\n    [disabled]=\"isDisabled()\"\r\n    [required]=\"required()\"\r\n    [readOnly]=\"readonly()\"\r\n    [placeholder]=\"placeholder()\"\r\n    [attr.aria-label]=\"ariaLabel() || null\"\r\n    (input)=\"onInput($any($event.target).value)\"\r\n    (blur)=\"onTouched()\"\r\n  />\r\n  <button\r\n    mfInputSuffix\r\n    type=\"button\"\r\n    class=\"appearance-none border-0 bg-transparent p-0 transition-colors duration-fast ease-emphasis hover:text-fg\"\r\n    [disabled]=\"isDisabled()\"\r\n    [attr.aria-label]=\"visible() ? effectiveHideLabel() : effectiveShowLabel()\"\r\n    (click)=\"toggle()\"\r\n  >\r\n    <span mfIcon [size]=\"16\">{{ visible() ? 'visibility_off' : 'visibility' }}</span>\r\n  </button>\r\n</mf-input-group>\r\n" }]
+        }], propDecorators: { value: [{ type: i0.Input, args: [{ isSignal: true, alias: "value", required: false }] }, { type: i0.Output, args: ["valueChange"] }], placeholder: [{ type: i0.Input, args: [{ isSignal: true, alias: "placeholder", required: false }] }], disabled: [{ type: i0.Input, args: [{ isSignal: true, alias: "disabled", required: false }] }], hasError: [{ type: i0.Input, args: [{ isSignal: true, alias: "hasError", required: false }] }], inputId: [{ type: i0.Input, args: [{ isSignal: true, alias: "inputId", required: false }] }], ariaLabel: [{ type: i0.Input, args: [{ isSignal: true, alias: "ariaLabel", required: false }] }], fullWidth: [{ type: i0.Input, args: [{ isSignal: true, alias: "fullWidth", required: false }] }], showLabel: [{ type: i0.Input, args: [{ isSignal: true, alias: "showLabel", required: false }] }], hideLabel: [{ type: i0.Input, args: [{ isSignal: true, alias: "hideLabel", required: false }] }], autocomplete: [{ type: i0.Input, args: [{ isSignal: true, alias: "autocomplete", required: false }] }], name: [{ type: i0.Input, args: [{ isSignal: true, alias: "name", required: false }] }], required: [{ type: i0.Input, args: [{ isSignal: true, alias: "required", required: false }] }], readonly: [{ type: i0.Input, args: [{ isSignal: true, alias: "readonly", required: false }] }] } });
 
 /**
  * Generated bundle index. Do not edit.

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

@@ -1 +1 @@
-{"version":3,"file":"mesgflow-ui-kit-password-input.mjs","sources":["../../../projects/ui-kit/password-input/password-input.ts","../../../projects/ui-kit/password-input/mesgflow-ui-kit-password-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_PASSWORD_INPUT_LABELS, ValueAccessorBase } from '@mesgflow/ui-kit/core';\r\nimport { Icon } from '@mesgflow/ui-kit/icon';\r\nimport { Input, InputGroup, InputSuffix } from '@mesgflow/ui-kit/input';\r\n\r\n/**\r\n * `<mf-password-input [(value)]=\"password\" />` — `InputGroup` üstüne kompoze\r\n * edilmiş, sağda göster/gizle düğmesi taşıyan parola alanı (emsal:\r\n * `NumberInput`/`DateRangePicker`'ın AYNI `mf-input-group` kabuğunu\r\n * kullanma deseni). `type=\"password\"`/`\"text\"` arasında geçiş SADECE\r\n * görünürlük içindir — değer her zaman `value` model'inde düz metin olarak\r\n * tutulur.\r\n */\r\n@Component({\r\n  selector: 'mf-password-input',\r\n  exportAs: 'mfPasswordInput',\r\n  imports: [Icon, Input, InputGroup, InputSuffix],\r\n  host: { class: 'inline-flex', '[class.w-full]': 'fullWidth()' },\r\n  template: `\r\n    <mf-input-group [hasError]=\"hasError()\" [disabled]=\"disabled()\">\r\n      <input\r\n        mfInput\r\n        [attr.id]=\"inputId() || null\"\r\n        [type]=\"visible() ? 'text' : 'password'\"\r\n        class=\"border-0 bg-transparent p-0 shadow-none focus-visible:outline-none\"\r\n        [value]=\"value()\"\r\n        [disabled]=\"disabled()\"\r\n        [placeholder]=\"placeholder()\"\r\n        [attr.aria-label]=\"ariaLabel() || null\"\r\n        (input)=\"onInput($any($event.target).value)\"\r\n        (blur)=\"onTouched()\"\r\n      />\r\n      <button\r\n        mfInputSuffix\r\n        type=\"button\"\r\n        class=\"appearance-none border-0 bg-transparent p-0 transition-colors duration-fast ease-emphasis hover:text-fg\"\r\n        [attr.aria-label]=\"visible() ? effectiveHideLabel() : effectiveShowLabel()\"\r\n        (click)=\"toggle()\"\r\n      >\r\n        <span mfIcon [size]=\"16\">{{ visible() ? 'visibility_off' : 'visibility' }}</span>\r\n      </button>\r\n    </mf-input-group>\r\n  `,\r\n  providers: [\r\n    { provide: NG_VALUE_ACCESSOR, useExisting: forwardRef(() => PasswordInput), multi: true },\r\n  ],\r\n})\r\nexport class PasswordInput extends ValueAccessorBase<string> implements ControlValueAccessor {\r\n  readonly value = model('');\r\n  readonly placeholder = input('');\r\n  readonly disabled = input(false);\r\n  readonly hasError = input(false);\r\n  /** İç `<input>`'un id'si — harici bir `<label for>` / `mf-field for` ile ilişkilendirmek için. */\r\n  readonly inputId = input<string>();\r\n  readonly ariaLabel = input('');\r\n  readonly fullWidth = input(false);\r\n  readonly showLabel = input<string>();\r\n  readonly hideLabel = input<string>();\r\n\r\n  private readonly passwordLabels = inject(MF_PASSWORD_INPUT_LABELS);\r\n  protected readonly effectiveShowLabel = computed(\r\n    () => this.showLabel() ?? this.passwordLabels().show,\r\n  );\r\n  protected readonly effectiveHideLabel = computed(\r\n    () => this.hideLabel() ?? this.passwordLabels().hide,\r\n  );\r\n\r\n  protected readonly visible = signal(false);\r\n\r\n  writeValue(value: string): void {\r\n    this.value.set(value);\r\n  }\r\n\r\n  protected toggle(): void {\r\n    this.visible.update((v) => !v);\r\n  }\r\n\r\n  protected onInput(raw: string): void {\r\n    this.value.set(raw);\r\n    this.onChange(raw);\r\n  }\r\n}\r\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":[],"mappings":"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"}
+{"version":3,"file":"mesgflow-ui-kit-password-input.mjs","sources":["../../../projects/ui-kit/password-input/password-input.ts","../../../projects/ui-kit/password-input/password-input.html","../../../projects/ui-kit/password-input/mesgflow-ui-kit-password-input.ts"],"sourcesContent":["import {\r\n  Component,\r\n  booleanAttribute,\r\n  computed,\r\n  forwardRef,\r\n  inject,\r\n  input,\r\n  model,\r\n  signal,\r\n} from '@angular/core';\r\nimport { NG_VALUE_ACCESSOR, type ControlValueAccessor } from '@angular/forms';\r\nimport { MF_PASSWORD_INPUT_LABELS, ValueAccessorBase } from '@mesgflow/ui-kit/core';\r\nimport { Icon } from '@mesgflow/ui-kit/icon';\r\nimport { Input, InputGroup, InputSuffix } from '@mesgflow/ui-kit/input';\r\n\r\n/**\r\n * Parola alanının `autocomplete` ipucu — parola yöneticileri/tarayıcı bunu okur:\r\n * - `current-password` (varsayılan): giriş formu — kayıtlı parolayı doldurur.\r\n * - `new-password`: kayıt/parola değiştirme — güçlü parola ÖNERİR, eskisini doldurmaz\r\n *   (hem \"yeni\" hem \"tekrar\" alanında kullanılır).\r\n * - `off`: modern tarayıcılar parola alanlarında çoğunlukla YOK SAYAR — sadece\r\n *   gerçekten tek kullanımlık alanlarda (ör. API anahtarı onayı) kullanın.\r\n * - Diğer geçerli token dizileri de kabul edilir (ör. `section-billing current-password`).\r\n */\r\nexport type PasswordAutocomplete = 'current-password' | 'new-password' | 'off' | (string & {});\r\n\r\n/**\r\n * `<mf-password-input [(value)]=\"password\" />` — `InputGroup` üstüne kompoze\r\n * edilmiş, sağda göster/gizle düğmesi taşıyan parola alanı (emsal:\r\n * `NumberInput`/`DateRangePicker`'ın AYNI `mf-input-group` kabuğunu\r\n * kullanma deseni). `type=\"password\"`/`\"text\"` arasında geçiş SADECE\r\n * görünürlük içindir — değer her zaman `value` model'inde düz metin olarak\r\n * tutulur.\r\n *\r\n * Parola yöneticisi uyumu: `autocomplete` (varsayılan `current-password`) ve\r\n * `name` iç `<input>`'a iletilir; `autocapitalize=\"off\"`/`spellcheck=\"false\"`\r\n * sabit — parola görünür moda (`type=\"text\"`) geçtiğinde de mobil klavye büyük\r\n * harfe çevirmez, yazım denetimi parolayı bir sözlük servisine göndermez.\r\n * Signal Forms `[formField]` bağlandığında `name`/`required`/`readonly`/`disabled`\r\n * alan durumundan OTOMATİK doldurulur.\r\n */\r\n@Component({\r\n  selector: 'mf-password-input',\r\n  exportAs: 'mfPasswordInput',\r\n  imports: [Icon, Input, InputGroup, InputSuffix],\r\n  host: { class: 'inline-flex', '[class.w-full]': 'fullWidth()' },\r\n  templateUrl: './password-input.html',\r\n  providers: [\r\n    { provide: NG_VALUE_ACCESSOR, useExisting: forwardRef(() => PasswordInput), multi: true },\r\n  ],\r\n})\r\nexport class PasswordInput extends ValueAccessorBase<string> implements ControlValueAccessor {\r\n  readonly value = model('');\r\n  readonly placeholder = input('');\r\n  readonly disabled = input(false, { transform: booleanAttribute });\r\n  readonly hasError = input(false, { transform: booleanAttribute });\r\n  /** İç `<input>`'un id'si — harici bir `<label for>` / `mf-field for` ile ilişkilendirmek için. */\r\n  readonly inputId = input<string>();\r\n  readonly ariaLabel = input('');\r\n  readonly fullWidth = input(false, { transform: booleanAttribute });\r\n  readonly showLabel = input<string>();\r\n  readonly hideLabel = input<string>();\r\n  /** Parola yöneticisi ipucu — bkz. `PasswordAutocomplete`. */\r\n  readonly autocomplete = input<PasswordAutocomplete>('current-password');\r\n  /** İç `<input>`'un `name`'i — form gönderimi ve parola yöneticilerinin alanı tanıması için. */\r\n  readonly name = input<string>();\r\n  readonly required = input(false, { transform: booleanAttribute });\r\n  readonly readonly = input(false, { transform: booleanAttribute });\r\n\r\n  private readonly passwordLabels = inject(MF_PASSWORD_INPUT_LABELS);\r\n  protected readonly effectiveShowLabel = computed(\r\n    () => this.showLabel() ?? this.passwordLabels().show,\r\n  );\r\n  protected readonly effectiveHideLabel = computed(\r\n    () => this.hideLabel() ?? this.passwordLabels().hide,\r\n  );\r\n\r\n  /** Reactive Forms `control.disable()` — `disabled` girdisiyle VEYA'lanır. */\r\n  private readonly formDisabled = signal(false);\r\n  protected readonly isDisabled = computed(() => this.disabled() || this.formDisabled());\r\n\r\n  protected readonly visible = signal(false);\r\n\r\n  writeValue(value: string | null): void {\r\n    this.value.set(value ?? '');\r\n  }\r\n\r\n  setDisabledState(disabled: boolean): void {\r\n    this.formDisabled.set(disabled);\r\n  }\r\n\r\n  protected toggle(): void {\r\n    this.visible.update((v) => !v);\r\n  }\r\n\r\n  protected onInput(raw: string): void {\r\n    this.value.set(raw);\r\n    this.onChange(raw);\r\n  }\r\n}\r\n","<mf-input-group [hasError]=\"hasError()\" [disabled]=\"isDisabled()\">\r\n  <input\r\n    mfInput\r\n    [attr.id]=\"inputId() || null\"\r\n    [attr.name]=\"name() || null\"\r\n    [attr.autocomplete]=\"autocomplete()\"\r\n    autocapitalize=\"off\"\r\n    spellcheck=\"false\"\r\n    [type]=\"visible() ? 'text' : 'password'\"\r\n    class=\"border-0 bg-transparent p-0 shadow-none focus-visible:outline-none\"\r\n    [value]=\"value()\"\r\n    [disabled]=\"isDisabled()\"\r\n    [required]=\"required()\"\r\n    [readOnly]=\"readonly()\"\r\n    [placeholder]=\"placeholder()\"\r\n    [attr.aria-label]=\"ariaLabel() || null\"\r\n    (input)=\"onInput($any($event.target).value)\"\r\n    (blur)=\"onTouched()\"\r\n  />\r\n  <button\r\n    mfInputSuffix\r\n    type=\"button\"\r\n    class=\"appearance-none border-0 bg-transparent p-0 transition-colors duration-fast ease-emphasis hover:text-fg\"\r\n    [disabled]=\"isDisabled()\"\r\n    [attr.aria-label]=\"visible() ? effectiveHideLabel() : effectiveShowLabel()\"\r\n    (click)=\"toggle()\"\r\n  >\r\n    <span mfIcon [size]=\"16\">{{ visible() ? 'visibility_off' : 'visibility' }}</span>\r\n  </button>\r\n</mf-input-group>\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-popover.mjs

@@ -103,8 +103,8 @@ class Popover {
         this.open.set(false);
         this.closed.emit();
     }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.6", ngImport: i0, type: Popover, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "22.1.6", type: Popover, isStandalone: true, selector: "mf-popover", inputs: { origin: { classPropertyName: "origin", publicName: "origin", isSignal: true, isRequired: true, transformFunction: null }, open: { classPropertyName: "open", publicName: "open", isSignal: true, isRequired: false, transformFunction: null }, placement: { classPropertyName: "placement", publicName: "placement", isSignal: true, isRequired: false, transformFunction: null }, padding: { classPropertyName: "padding", publicName: "padding", isSignal: true, isRequired: false, transformFunction: null }, hasBackdrop: { classPropertyName: "hasBackdrop", publicName: "hasBackdrop", isSignal: true, isRequired: false, transformFunction: null }, matchTriggerWidth: { classPropertyName: "matchTriggerWidth", publicName: "matchTriggerWidth", isSignal: true, isRequired: false, transformFunction: null }, panelClass: { classPropertyName: "panelClass", publicName: "panelClass", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { open: "openChange", closed: "closed" }, host: { classAttribute: "contents" }, exportAs: ["mfPopover"], ngImport: i0, template: `
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.7", ngImport: i0, type: Popover, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "22.1.7", type: Popover, isStandalone: true, selector: "mf-popover", inputs: { origin: { classPropertyName: "origin", publicName: "origin", isSignal: true, isRequired: true, transformFunction: null }, open: { classPropertyName: "open", publicName: "open", isSignal: true, isRequired: false, transformFunction: null }, placement: { classPropertyName: "placement", publicName: "placement", isSignal: true, isRequired: false, transformFunction: null }, padding: { classPropertyName: "padding", publicName: "padding", isSignal: true, isRequired: false, transformFunction: null }, hasBackdrop: { classPropertyName: "hasBackdrop", publicName: "hasBackdrop", isSignal: true, isRequired: false, transformFunction: null }, matchTriggerWidth: { classPropertyName: "matchTriggerWidth", publicName: "matchTriggerWidth", isSignal: true, isRequired: false, transformFunction: null }, panelClass: { classPropertyName: "panelClass", publicName: "panelClass", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { open: "openChange", closed: "closed" }, host: { classAttribute: "contents" }, exportAs: ["mfPopover"], ngImport: i0, template: `
     <ng-template
       cdkConnectedOverlay
       [cdkConnectedOverlayOrigin]="origin()"
@@ -130,7 +130,7 @@ class Popover {
     </ng-template>
   `, isInline: true, dependencies: [{ kind: "ngmodule", type: OverlayModule }, { kind: "directive", type: i1.CdkConnectedOverlay, selector: "[cdk-connected-overlay], [connected-overlay], [cdkConnectedOverlay]", inputs: ["cdkConnectedOverlayOrigin", "cdkConnectedOverlayPositions", "cdkConnectedOverlayPositionStrategy", "cdkConnectedOverlayOffsetX", "cdkConnectedOverlayOffsetY", "cdkConnectedOverlayWidth", "cdkConnectedOverlayHeight", "cdkConnectedOverlayMinWidth", "cdkConnectedOverlayMinHeight", "cdkConnectedOverlayBackdropClass", "cdkConnectedOverlayPanelClass", "cdkConnectedOverlayViewportMargin", "cdkConnectedOverlayScrollStrategy", "cdkConnectedOverlayOpen", "cdkConnectedOverlayDisableClose", "cdkConnectedOverlayTransformOriginOn", "cdkConnectedOverlayHasBackdrop", "cdkConnectedOverlayLockPosition", "cdkConnectedOverlayFlexibleDimensions", "cdkConnectedOverlayGrowAfterOpen", "cdkConnectedOverlayPush", "cdkConnectedOverlayDisposeOnNavigation", "cdkConnectedOverlayUsePopover", "cdkConnectedOverlayMatchWidth", "cdkConnectedOverlay"], outputs: ["backdropClick", "positionChange", "attach", "detach", "overlayKeydown", "overlayOutsideClick"], exportAs: ["cdkConnectedOverlay"] }] });
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.6", ngImport: i0, type: Popover, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.7", ngImport: i0, type: Popover, decorators: [{
             type: Component,
             args: [{
                     selector: 'mf-popover',

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

@@ -88,8 +88,8 @@ class Progress {
         ? cn('relative inline-flex shrink-0 items-center justify-center')
         : cn(progressTrackVariants({ size: this.size() })), /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "hostClasses" }] : /* istanbul ignore next */ []));
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.6", ngImport: i0, type: Progress, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.1.6", type: Progress, isStandalone: true, selector: "mf-progress", inputs: { value: { classPropertyName: "value", publicName: "value", isSignal: true, isRequired: false, transformFunction: null }, indeterminate: { classPropertyName: "indeterminate", publicName: "indeterminate", isSignal: true, isRequired: false, transformFunction: null }, size: { classPropertyName: "size", publicName: "size", isSignal: true, isRequired: false, transformFunction: null }, variant: { classPropertyName: "variant", publicName: "variant", isSignal: true, isRequired: false, transformFunction: null }, tone: { classPropertyName: "tone", publicName: "tone", isSignal: true, isRequired: false, transformFunction: null }, showValue: { classPropertyName: "showValue", publicName: "showValue", isSignal: true, isRequired: false, transformFunction: null }, ariaLabel: { classPropertyName: "ariaLabel", publicName: "ariaLabel", isSignal: true, isRequired: false, transformFunction: null } }, host: { attributes: { "role": "progressbar" }, properties: { "attr.aria-valuenow": "indeterminate() ? null : clampedValue()", "attr.aria-valuemin": "0", "attr.aria-valuemax": "100", "attr.aria-label": "effectiveAriaLabel()", "class": "hostClasses()" } }, ngImport: i0, template: `
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.7", ngImport: i0, type: Progress, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.1.7", type: Progress, isStandalone: true, selector: "mf-progress", inputs: { value: { classPropertyName: "value", publicName: "value", isSignal: true, isRequired: false, transformFunction: null }, indeterminate: { classPropertyName: "indeterminate", publicName: "indeterminate", isSignal: true, isRequired: false, transformFunction: null }, size: { classPropertyName: "size", publicName: "size", isSignal: true, isRequired: false, transformFunction: null }, variant: { classPropertyName: "variant", publicName: "variant", isSignal: true, isRequired: false, transformFunction: null }, tone: { classPropertyName: "tone", publicName: "tone", isSignal: true, isRequired: false, transformFunction: null }, showValue: { classPropertyName: "showValue", publicName: "showValue", isSignal: true, isRequired: false, transformFunction: null }, ariaLabel: { classPropertyName: "ariaLabel", publicName: "ariaLabel", isSignal: true, isRequired: false, transformFunction: null } }, host: { attributes: { "role": "progressbar" }, properties: { "attr.aria-valuenow": "indeterminate() ? null : clampedValue()", "attr.aria-valuemin": "0", "attr.aria-valuemax": "100", "attr.aria-label": "effectiveAriaLabel()", "class": "hostClasses()" } }, ngImport: i0, template: `
     @if (variant() === 'ring') {
       <svg
         [attr.width]="ring().size"
@@ -145,7 +145,7 @@ class Progress {
     }
   `, isInline: true });
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.6", ngImport: i0, type: Progress, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.7", ngImport: i0, type: Progress, decorators: [{
             type: Component,
             args: [{
                     selector: 'mf-progress',