@mesgflow/ui-kit 0.6.0 → 0.8.0

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

@@ -57,12 +57,12 @@ class Switch extends ValueAccessorBase {
         this.onChange(checked);
         this.onTouched();
     }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.6", ngImport: i0, type: Switch, deps: null, target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.1.6", type: Switch, isStandalone: true, selector: "mf-switch", inputs: { checked: { classPropertyName: "checked", publicName: "checked", isSignal: true, isRequired: false, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null }, size: { classPropertyName: "size", publicName: "size", isSignal: true, isRequired: false, transformFunction: null }, label: { classPropertyName: "label", publicName: "label", isSignal: true, isRequired: false, transformFunction: null }, ariaLabel: { classPropertyName: "ariaLabel", publicName: "ariaLabel", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { checked: "checkedChange" }, host: { classAttribute: "inline-flex" }, providers: [{ provide: NG_VALUE_ACCESSOR, useExisting: forwardRef(() => Switch), multi: true }], exportAs: ["mfSwitch"], usesInheritance: true, ngImport: i0, template: "<label\r\n  class=\"inline-flex cursor-pointer items-center gap-2\"\r\n  [class.cursor-not-allowed]=\"disabled()\"\r\n  [class.opacity-50]=\"disabled()\"\r\n>\r\n  <span [class]=\"'relative inline-flex shrink-0 items-center ' + sizeClasses().track\">\r\n    <input\r\n      type=\"checkbox\"\r\n      role=\"switch\"\r\n      class=\"peer sr-only\"\r\n      [checked]=\"checked()\"\r\n      [disabled]=\"disabled()\"\r\n      [attr.aria-label]=\"label() ? null : ariaLabel() || null\"\r\n      (change)=\"onToggle($event)\"\r\n    />\r\n    <span\r\n      class=\"pointer-events-none absolute inset-0 rounded-full bg-surface-active transition-colors duration-fast ease-emphasis peer-checked:bg-accent-fill peer-focus-visible:outline peer-focus-visible:outline-2 peer-focus-visible:outline-offset-2 peer-focus-visible:outline-focus-ring\"\r\n    ></span>\r\n    <span\r\n      [class]=\"\r\n        'pointer-events-none absolute rounded-full bg-surface shadow-control transition-transform duration-fast ease-out ' +\r\n        sizeClasses().thumb +\r\n        ' ' +\r\n        sizeClasses().offset +\r\n        ' ' +\r\n        sizeClasses().translate\r\n      \"\r\n    ></span>\r\n  </span>\r\n  @if (label()) {\r\n    <span class=\"text-sm text-fg-muted\">{{ label() }}</span>\r\n  }\r\n</label>\r\n" });
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.7", ngImport: i0, type: Switch, deps: null, target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.1.7", type: Switch, isStandalone: true, selector: "mf-switch", inputs: { checked: { classPropertyName: "checked", publicName: "checked", isSignal: true, isRequired: false, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null }, size: { classPropertyName: "size", publicName: "size", isSignal: true, isRequired: false, transformFunction: null }, label: { classPropertyName: "label", publicName: "label", isSignal: true, isRequired: false, transformFunction: null }, ariaLabel: { classPropertyName: "ariaLabel", publicName: "ariaLabel", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { checked: "checkedChange" }, host: { classAttribute: "inline-flex" }, providers: [{ provide: NG_VALUE_ACCESSOR, useExisting: forwardRef(() => Switch), multi: true }], exportAs: ["mfSwitch"], usesInheritance: true, ngImport: i0, template: "<label\r\n  class=\"group/switch inline-flex cursor-pointer items-center gap-2\"\r\n  [class.cursor-not-allowed]=\"disabled()\"\r\n  [class.opacity-50]=\"disabled()\"\r\n>\r\n  <span [class]=\"'relative inline-flex shrink-0 items-center ' + sizeClasses().track\">\r\n    <input\r\n      type=\"checkbox\"\r\n      role=\"switch\"\r\n      class=\"peer sr-only\"\r\n      [checked]=\"checked()\"\r\n      [disabled]=\"disabled()\"\r\n      [attr.aria-label]=\"label() ? null : ariaLabel() || null\"\r\n      (change)=\"onToggle($event)\"\r\n    />\r\n    <span\r\n      class=\"pointer-events-none absolute inset-0 rounded-full bg-surface-active shadow-[inset_0_1px_2px_rgb(0_0_0/0.12)] transition-colors duration-base ease-emphasis group-hover/switch:bg-border-strong peer-checked:bg-accent-fill peer-checked:group-hover/switch:bg-accent-fill-hover peer-focus-visible:outline peer-focus-visible:outline-2 peer-focus-visible:outline-offset-2 peer-focus-visible:outline-focus-ring\"\r\n    ></span>\r\n    <span\r\n      [class]=\"\r\n        'pointer-events-none absolute rounded-full bg-surface shadow-1 transition-[translate,scale] duration-base ease-spring group-active/switch:scale-x-110 ' +\r\n        'dark:bg-neutral-50 ' +\r\n        sizeClasses().thumb +\r\n        ' ' +\r\n        sizeClasses().offset +\r\n        ' ' +\r\n        sizeClasses().translate\r\n      \"\r\n    ></span>\r\n  </span>\r\n  @if (label()) {\r\n    <span class=\"text-sm text-fg-muted\">{{ label() }}</span>\r\n  }\r\n</label>\r\n" });
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.6", ngImport: i0, type: Switch, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.7", ngImport: i0, type: Switch, decorators: [{
             type: Component,
-            args: [{ selector: 'mf-switch', exportAs: 'mfSwitch', host: { class: 'inline-flex' }, providers: [{ provide: NG_VALUE_ACCESSOR, useExisting: forwardRef(() => Switch), multi: true }], template: "<label\r\n  class=\"inline-flex cursor-pointer items-center gap-2\"\r\n  [class.cursor-not-allowed]=\"disabled()\"\r\n  [class.opacity-50]=\"disabled()\"\r\n>\r\n  <span [class]=\"'relative inline-flex shrink-0 items-center ' + sizeClasses().track\">\r\n    <input\r\n      type=\"checkbox\"\r\n      role=\"switch\"\r\n      class=\"peer sr-only\"\r\n      [checked]=\"checked()\"\r\n      [disabled]=\"disabled()\"\r\n      [attr.aria-label]=\"label() ? null : ariaLabel() || null\"\r\n      (change)=\"onToggle($event)\"\r\n    />\r\n    <span\r\n      class=\"pointer-events-none absolute inset-0 rounded-full bg-surface-active transition-colors duration-fast ease-emphasis peer-checked:bg-accent-fill peer-focus-visible:outline peer-focus-visible:outline-2 peer-focus-visible:outline-offset-2 peer-focus-visible:outline-focus-ring\"\r\n    ></span>\r\n    <span\r\n      [class]=\"\r\n        'pointer-events-none absolute rounded-full bg-surface shadow-control transition-transform duration-fast ease-out ' +\r\n        sizeClasses().thumb +\r\n        ' ' +\r\n        sizeClasses().offset +\r\n        ' ' +\r\n        sizeClasses().translate\r\n      \"\r\n    ></span>\r\n  </span>\r\n  @if (label()) {\r\n    <span class=\"text-sm text-fg-muted\">{{ label() }}</span>\r\n  }\r\n</label>\r\n" }]
+            args: [{ selector: 'mf-switch', exportAs: 'mfSwitch', host: { class: 'inline-flex' }, providers: [{ provide: NG_VALUE_ACCESSOR, useExisting: forwardRef(() => Switch), multi: true }], template: "<label\r\n  class=\"group/switch inline-flex cursor-pointer items-center gap-2\"\r\n  [class.cursor-not-allowed]=\"disabled()\"\r\n  [class.opacity-50]=\"disabled()\"\r\n>\r\n  <span [class]=\"'relative inline-flex shrink-0 items-center ' + sizeClasses().track\">\r\n    <input\r\n      type=\"checkbox\"\r\n      role=\"switch\"\r\n      class=\"peer sr-only\"\r\n      [checked]=\"checked()\"\r\n      [disabled]=\"disabled()\"\r\n      [attr.aria-label]=\"label() ? null : ariaLabel() || null\"\r\n      (change)=\"onToggle($event)\"\r\n    />\r\n    <span\r\n      class=\"pointer-events-none absolute inset-0 rounded-full bg-surface-active shadow-[inset_0_1px_2px_rgb(0_0_0/0.12)] transition-colors duration-base ease-emphasis group-hover/switch:bg-border-strong peer-checked:bg-accent-fill peer-checked:group-hover/switch:bg-accent-fill-hover peer-focus-visible:outline peer-focus-visible:outline-2 peer-focus-visible:outline-offset-2 peer-focus-visible:outline-focus-ring\"\r\n    ></span>\r\n    <span\r\n      [class]=\"\r\n        'pointer-events-none absolute rounded-full bg-surface shadow-1 transition-[translate,scale] duration-base ease-spring group-active/switch:scale-x-110 ' +\r\n        'dark:bg-neutral-50 ' +\r\n        sizeClasses().thumb +\r\n        ' ' +\r\n        sizeClasses().offset +\r\n        ' ' +\r\n        sizeClasses().translate\r\n      \"\r\n    ></span>\r\n  </span>\r\n  @if (label()) {\r\n    <span class=\"text-sm text-fg-muted\">{{ label() }}</span>\r\n  }\r\n</label>\r\n" }]
         }], propDecorators: { checked: [{ type: i0.Input, args: [{ isSignal: true, alias: "checked", required: false }] }, { type: i0.Output, args: ["checkedChange"] }], disabled: [{ type: i0.Input, args: [{ isSignal: true, alias: "disabled", required: false }] }], size: [{ type: i0.Input, args: [{ isSignal: true, alias: "size", required: false }] }], label: [{ type: i0.Input, args: [{ isSignal: true, alias: "label", required: false }] }], ariaLabel: [{ type: i0.Input, args: [{ isSignal: true, alias: "ariaLabel", required: false }] }] } });
 
 /**

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

@@ -1 +1 @@
-{"version":3,"file":"mesgflow-ui-kit-switch.mjs","sources":["../../../projects/ui-kit/switch/switch.ts","../../../projects/ui-kit/switch/switch.html","../../../projects/ui-kit/switch/mesgflow-ui-kit-switch.ts"],"sourcesContent":["import { Component, computed, forwardRef, input, model } from '@angular/core';\r\nimport { NG_VALUE_ACCESSOR, type ControlValueAccessor } from '@angular/forms';\r\nimport { ValueAccessorBase, type MfSize } from '@mesgflow/ui-kit/core';\r\n\r\n/** Track/thumb/offset/kayma ölçüleri — `(track_h - thumb_h) / 2 = offset`, `translate = track_w - thumb_w - 2×offset` formülüyle üretildi (bkz. `md`'nin önceki sabit değerleriyle birebir örtüştüğü doğrulaması). */\r\nconst SIZE_CLASSES: Record<\r\n  MfSize,\r\n  { track: string; thumb: string; offset: string; translate: string }\r\n> = {\r\n  sm: {\r\n    track: 'h-5 w-9',\r\n    thumb: 'h-4 w-4',\r\n    offset: 'start-0.5',\r\n    translate: 'peer-checked:translate-x-4 rtl:peer-checked:-translate-x-4',\r\n  },\r\n  md: {\r\n    track: 'h-6 w-11',\r\n    thumb: 'h-5 w-5',\r\n    offset: 'start-0.5',\r\n    translate: 'peer-checked:translate-x-5 rtl:peer-checked:-translate-x-5',\r\n  },\r\n  lg: {\r\n    track: 'h-7 w-13',\r\n    thumb: 'h-6 w-6',\r\n    offset: 'start-0.5',\r\n    translate: 'peer-checked:translate-x-6 rtl:peer-checked:-translate-x-6',\r\n  },\r\n};\r\n\r\n/**\r\n * `<mf-switch [(checked)]=\"row.active\" (checkedChange)=\"onToggle(row)\" />`\r\n *\r\n * Native `[(ngModel)]` DEĞİL, Angular'ın `model()` iki-yönlü bağlama sinyali\r\n * kullanılıyor (`[(checked)]`) — ControlValueAccessor yazmadan aynı ergonomiyi\r\n * veriyor. Görünür track+thumb, gizli (sr-only) bir native checkbox'ın\r\n * `:checked` durumuna komşu `<span>` üzerinden `peer-checked:` ile tepki\r\n * veriyor — gerçek form kontrolü hâlâ native checkbox (klavye/focus/a11y\r\n * ücretsiz), görsel tamamen bizim.\r\n */\r\n@Component({\r\n  selector: 'mf-switch',\r\n  exportAs: 'mfSwitch',\r\n  host: { class: 'inline-flex' },\r\n  templateUrl: './switch.html',\r\n  providers: [{ provide: NG_VALUE_ACCESSOR, useExisting: forwardRef(() => Switch), multi: true }],\r\n})\r\nexport class Switch extends ValueAccessorBase<boolean> implements ControlValueAccessor {\r\n  readonly checked = model(false);\r\n  readonly disabled = input(false);\r\n  readonly size = input<MfSize>('md');\r\n  readonly label = input<string>('');\r\n  /** `label` boşken (görünür metin yok) native checkbox'a erişilebilir ad sağlamak için — `label` doluysa YOK SAYILIR (çift anons olmasın diye). */\r\n  readonly ariaLabel = input<string>('');\r\n\r\n  protected readonly sizeClasses = computed(() => SIZE_CLASSES[this.size()]);\r\n\r\n  writeValue(value: boolean): void {\r\n    this.checked.set(value);\r\n  }\r\n\r\n  protected onToggle(event: Event): void {\r\n    const checked = (event.target as HTMLInputElement).checked;\r\n    this.checked.set(checked);\r\n    this.onChange(checked);\r\n    this.onTouched();\r\n  }\r\n}\r\n","<label\r\n  class=\"inline-flex cursor-pointer items-center gap-2\"\r\n  [class.cursor-not-allowed]=\"disabled()\"\r\n  [class.opacity-50]=\"disabled()\"\r\n>\r\n  <span [class]=\"'relative inline-flex shrink-0 items-center ' + sizeClasses().track\">\r\n    <input\r\n      type=\"checkbox\"\r\n      role=\"switch\"\r\n      class=\"peer sr-only\"\r\n      [checked]=\"checked()\"\r\n      [disabled]=\"disabled()\"\r\n      [attr.aria-label]=\"label() ? null : ariaLabel() || null\"\r\n      (change)=\"onToggle($event)\"\r\n    />\r\n    <span\r\n      class=\"pointer-events-none absolute inset-0 rounded-full bg-surface-active transition-colors duration-fast ease-emphasis peer-checked:bg-accent-fill peer-focus-visible:outline peer-focus-visible:outline-2 peer-focus-visible:outline-offset-2 peer-focus-visible:outline-focus-ring\"\r\n    ></span>\r\n    <span\r\n      [class]=\"\r\n        'pointer-events-none absolute rounded-full bg-surface shadow-control transition-transform duration-fast ease-out ' +\r\n        sizeClasses().thumb +\r\n        ' ' +\r\n        sizeClasses().offset +\r\n        ' ' +\r\n        sizeClasses().translate\r\n      \"\r\n    ></span>\r\n  </span>\r\n  @if (label()) {\r\n    <span class=\"text-sm text-fg-muted\">{{ label() }}</span>\r\n  }\r\n</label>\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-switch.mjs","sources":["../../../projects/ui-kit/switch/switch.ts","../../../projects/ui-kit/switch/switch.html","../../../projects/ui-kit/switch/mesgflow-ui-kit-switch.ts"],"sourcesContent":["import { Component, computed, forwardRef, input, model } from '@angular/core';\r\nimport { NG_VALUE_ACCESSOR, type ControlValueAccessor } from '@angular/forms';\r\nimport { ValueAccessorBase, type MfSize } from '@mesgflow/ui-kit/core';\r\n\r\n/** Track/thumb/offset/kayma ölçüleri — `(track_h - thumb_h) / 2 = offset`, `translate = track_w - thumb_w - 2×offset` formülüyle üretildi (bkz. `md`'nin önceki sabit değerleriyle birebir örtüştüğü doğrulaması). */\r\nconst SIZE_CLASSES: Record<\r\n  MfSize,\r\n  { track: string; thumb: string; offset: string; translate: string }\r\n> = {\r\n  sm: {\r\n    track: 'h-5 w-9',\r\n    thumb: 'h-4 w-4',\r\n    offset: 'start-0.5',\r\n    translate: 'peer-checked:translate-x-4 rtl:peer-checked:-translate-x-4',\r\n  },\r\n  md: {\r\n    track: 'h-6 w-11',\r\n    thumb: 'h-5 w-5',\r\n    offset: 'start-0.5',\r\n    translate: 'peer-checked:translate-x-5 rtl:peer-checked:-translate-x-5',\r\n  },\r\n  lg: {\r\n    track: 'h-7 w-13',\r\n    thumb: 'h-6 w-6',\r\n    offset: 'start-0.5',\r\n    translate: 'peer-checked:translate-x-6 rtl:peer-checked:-translate-x-6',\r\n  },\r\n};\r\n\r\n/**\r\n * `<mf-switch [(checked)]=\"row.active\" (checkedChange)=\"onToggle(row)\" />`\r\n *\r\n * Native `[(ngModel)]` DEĞİL, Angular'ın `model()` iki-yönlü bağlama sinyali\r\n * kullanılıyor (`[(checked)]`) — ControlValueAccessor yazmadan aynı ergonomiyi\r\n * veriyor. Görünür track+thumb, gizli (sr-only) bir native checkbox'ın\r\n * `:checked` durumuna komşu `<span>` üzerinden `peer-checked:` ile tepki\r\n * veriyor — gerçek form kontrolü hâlâ native checkbox (klavye/focus/a11y\r\n * ücretsiz), görsel tamamen bizim.\r\n */\r\n@Component({\r\n  selector: 'mf-switch',\r\n  exportAs: 'mfSwitch',\r\n  host: { class: 'inline-flex' },\r\n  templateUrl: './switch.html',\r\n  providers: [{ provide: NG_VALUE_ACCESSOR, useExisting: forwardRef(() => Switch), multi: true }],\r\n})\r\nexport class Switch extends ValueAccessorBase<boolean> implements ControlValueAccessor {\r\n  readonly checked = model(false);\r\n  readonly disabled = input(false);\r\n  readonly size = input<MfSize>('md');\r\n  readonly label = input<string>('');\r\n  /** `label` boşken (görünür metin yok) native checkbox'a erişilebilir ad sağlamak için — `label` doluysa YOK SAYILIR (çift anons olmasın diye). */\r\n  readonly ariaLabel = input<string>('');\r\n\r\n  protected readonly sizeClasses = computed(() => SIZE_CLASSES[this.size()]);\r\n\r\n  writeValue(value: boolean): void {\r\n    this.checked.set(value);\r\n  }\r\n\r\n  protected onToggle(event: Event): void {\r\n    const checked = (event.target as HTMLInputElement).checked;\r\n    this.checked.set(checked);\r\n    this.onChange(checked);\r\n    this.onTouched();\r\n  }\r\n}\r\n","<label\r\n  class=\"group/switch inline-flex cursor-pointer items-center gap-2\"\r\n  [class.cursor-not-allowed]=\"disabled()\"\r\n  [class.opacity-50]=\"disabled()\"\r\n>\r\n  <span [class]=\"'relative inline-flex shrink-0 items-center ' + sizeClasses().track\">\r\n    <input\r\n      type=\"checkbox\"\r\n      role=\"switch\"\r\n      class=\"peer sr-only\"\r\n      [checked]=\"checked()\"\r\n      [disabled]=\"disabled()\"\r\n      [attr.aria-label]=\"label() ? null : ariaLabel() || null\"\r\n      (change)=\"onToggle($event)\"\r\n    />\r\n    <span\r\n      class=\"pointer-events-none absolute inset-0 rounded-full bg-surface-active shadow-[inset_0_1px_2px_rgb(0_0_0/0.12)] transition-colors duration-base ease-emphasis group-hover/switch:bg-border-strong peer-checked:bg-accent-fill peer-checked:group-hover/switch:bg-accent-fill-hover peer-focus-visible:outline peer-focus-visible:outline-2 peer-focus-visible:outline-offset-2 peer-focus-visible:outline-focus-ring\"\r\n    ></span>\r\n    <span\r\n      [class]=\"\r\n        'pointer-events-none absolute rounded-full bg-surface shadow-1 transition-[translate,scale] duration-base ease-spring group-active/switch:scale-x-110 ' +\r\n        'dark:bg-neutral-50 ' +\r\n        sizeClasses().thumb +\r\n        ' ' +\r\n        sizeClasses().offset +\r\n        ' ' +\r\n        sizeClasses().translate\r\n      \"\r\n    ></span>\r\n  </span>\r\n  @if (label()) {\r\n    <span class=\"text-sm text-fg-muted\">{{ label() }}</span>\r\n  }\r\n</label>\r\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":[],"mappings":"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"}