@mesgflow/ui-kit 0.7.0 → 0.8.0

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

@@ -86,10 +86,10 @@ class TabScroller {
         this.canScrollStart.set(offset > 1);
         this.canScrollEnd.set(max > 1 && offset < max - 1);
     }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.6", ngImport: i0, type: TabScroller, deps: [], target: i0.ɵɵFactoryTarget.Directive });
-    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "22.1.6", type: TabScroller, isStandalone: true, selector: "[mfTabScroller]", inputs: { orientation: { classPropertyName: "orientation", publicName: "orientation", isSignal: true, isRequired: false, transformFunction: null } }, host: { listeners: { "scroll": "updateEdges()" }, properties: { "class.flex": "orientation() === \"horizontal\"", "class.min-w-0": "orientation() === \"horizontal\"", "class.overflow-x-auto": "orientation() === \"horizontal\"", "class.min-h-0": "orientation() === \"vertical\"", "class.overflow-y-auto": "orientation() === \"vertical\"" }, classAttribute: "[scrollbar-width:none] [&::-webkit-scrollbar]:hidden" }, ngImport: i0 });
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.7", ngImport: i0, type: TabScroller, deps: [], target: i0.ɵɵFactoryTarget.Directive });
+    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "22.1.7", type: TabScroller, isStandalone: true, selector: "[mfTabScroller]", inputs: { orientation: { classPropertyName: "orientation", publicName: "orientation", isSignal: true, isRequired: false, transformFunction: null } }, host: { listeners: { "scroll": "updateEdges()" }, properties: { "class.flex": "orientation() === \"horizontal\"", "class.min-w-0": "orientation() === \"horizontal\"", "class.overflow-x-auto": "orientation() === \"horizontal\"", "class.min-h-0": "orientation() === \"vertical\"", "class.overflow-y-auto": "orientation() === \"vertical\"" }, classAttribute: "[scrollbar-width:none] [&::-webkit-scrollbar]:hidden" }, ngImport: i0 });
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.6", ngImport: i0, type: TabScroller, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.7", ngImport: i0, type: TabScroller, decorators: [{
             type: Directive,
             args: [{
                     selector: '[mfTabScroller]',
@@ -376,10 +376,10 @@ class TabList {
     onPointerLeave() {
         this.hoveredTab.set(null);
     }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.6", ngImport: i0, type: TabList, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.1.6", type: TabList, isStandalone: true, selector: "mf-tab-list", inputs: { variant: { classPropertyName: "variant", publicName: "variant", isSignal: true, isRequired: false, transformFunction: null }, size: { classPropertyName: "size", publicName: "size", isSignal: true, isRequired: false, transformFunction: null }, stretch: { classPropertyName: "stretch", publicName: "stretch", isSignal: true, isRequired: false, transformFunction: null }, align: { classPropertyName: "align", publicName: "align", isSignal: true, isRequired: false, transformFunction: null }, hoverHighlight: { classPropertyName: "hoverHighlight", publicName: "hoverHighlight", isSignal: true, isRequired: false, transformFunction: null }, scrollStartLabel: { classPropertyName: "scrollStartLabel", publicName: "scrollStartLabel", isSignal: true, isRequired: false, transformFunction: null }, scrollEndLabel: { classPropertyName: "scrollEndLabel", publicName: "scrollEndLabel", isSignal: true, isRequired: false, transformFunction: null } }, host: { properties: { "class.shrink-0": "isVertical()" }, classAttribute: "block min-w-0" }, queries: [{ propertyName: "tabs", predicate: Tab$1, descendants: true, isSignal: true }], viewQueries: [{ propertyName: "scroller", first: true, predicate: TabScroller, descendants: true, isSignal: true }, { propertyName: "rowEl", first: true, predicate: ["row"], descendants: true, isSignal: true }], exportAs: ["mfTabList"], hostDirectives: [{ directive: i1.TabList, inputs: ["orientation", "orientation", "wrap", "wrap", "softDisabled", "softDisabled", "focusMode", "focusMode", "selectionMode", "selectionMode", "disabled", "disabled", "selectedTab", "selectedTab"], outputs: ["selectedTabChange", "selectedTabChange"] }], ngImport: i0, template: "<div\r\n  class=\"flex gap-1\"\r\n  [class.flex-col]=\"isVertical()\"\r\n  [class.items-center]=\"!isVertical()\"\r\n  [class.items-stretch]=\"isVertical()\"\r\n>\r\n  @if (showStartArrow()) {\r\n    <button\r\n      mfButton\r\n      tone=\"neutral\"\r\n      appearance=\"text\"\r\n      size=\"icon\"\r\n      shape=\"square\"\r\n      type=\"button\"\r\n      class=\"shrink-0\"\r\n      [attr.aria-label]=\"effectiveScrollStartLabel()\"\r\n      (click)=\"scroller()?.scrollByDir(-1)\"\r\n    >\r\n      <span mfIcon [size]=\"16\" class=\"rtl:-scale-x-100\">{{\r\n        isVertical() ? 'keyboard_arrow_up' : 'chevron_left'\r\n      }}</span>\r\n    </button>\r\n  }\r\n\r\n  <div mfTabScroller [orientation]=\"orientation()\" class=\"grow\">\r\n    <div\r\n      #row\r\n      [class]=\"listClasses()\"\r\n      (pointerover)=\"onPointerOver($event)\"\r\n      (pointerleave)=\"onPointerLeave()\"\r\n    >\r\n      <!-- G\u00F6stergeler i\u00E7erikten \u00D6NCE: `relative` sekmeler onlar\u0131n \u00FCst\u00FCne boyan\u0131r. -->\r\n      @if (drawsHover()) {\r\n        <span\r\n          mfSlidingIndicator\r\n          data-tab-hover\r\n          [axis]=\"axis()\"\r\n          [target]=\"hoveredTab()\"\r\n          [class]=\"hoverClasses()\"\r\n        ></span>\r\n      }\r\n      @if (variant() !== 'card') {\r\n        <span\r\n          mfSlidingIndicator\r\n          data-tab-indicator\r\n          [axis]=\"axis()\"\r\n          [track]=\"ariaTabList.selectedTab()\"\r\n          [class]=\"indicatorClasses()\"\r\n        ></span>\r\n      }\r\n      <ng-content />\r\n    </div>\r\n  </div>\r\n\r\n  @if (showEndArrow()) {\r\n    <button\r\n      mfButton\r\n      tone=\"neutral\"\r\n      appearance=\"text\"\r\n      size=\"icon\"\r\n      shape=\"square\"\r\n      type=\"button\"\r\n      class=\"shrink-0\"\r\n      [attr.aria-label]=\"effectiveScrollEndLabel()\"\r\n      (click)=\"scroller()?.scrollByDir(1)\"\r\n    >\r\n      <span mfIcon [size]=\"16\" class=\"rtl:-scale-x-100\">{{\r\n        isVertical() ? 'keyboard_arrow_down' : 'chevron_right'\r\n      }}</span>\r\n    </button>\r\n  }\r\n</div>\r\n", dependencies: [{ 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: "directive", type: TabScroller, selector: "[mfTabScroller]", inputs: ["orientation"] }, { kind: "directive", type: SlidingIndicator, selector: "[mfSlidingIndicator]", inputs: ["axis", "target", "track", "container"], exportAs: ["mfSlidingIndicator"] }] });
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.7", ngImport: i0, type: TabList, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.1.7", type: TabList, isStandalone: true, selector: "mf-tab-list", inputs: { variant: { classPropertyName: "variant", publicName: "variant", isSignal: true, isRequired: false, transformFunction: null }, size: { classPropertyName: "size", publicName: "size", isSignal: true, isRequired: false, transformFunction: null }, stretch: { classPropertyName: "stretch", publicName: "stretch", isSignal: true, isRequired: false, transformFunction: null }, align: { classPropertyName: "align", publicName: "align", isSignal: true, isRequired: false, transformFunction: null }, hoverHighlight: { classPropertyName: "hoverHighlight", publicName: "hoverHighlight", isSignal: true, isRequired: false, transformFunction: null }, scrollStartLabel: { classPropertyName: "scrollStartLabel", publicName: "scrollStartLabel", isSignal: true, isRequired: false, transformFunction: null }, scrollEndLabel: { classPropertyName: "scrollEndLabel", publicName: "scrollEndLabel", isSignal: true, isRequired: false, transformFunction: null } }, host: { properties: { "class.shrink-0": "isVertical()" }, classAttribute: "block min-w-0" }, queries: [{ propertyName: "tabs", predicate: Tab$1, descendants: true, isSignal: true }], viewQueries: [{ propertyName: "scroller", first: true, predicate: TabScroller, descendants: true, isSignal: true }, { propertyName: "rowEl", first: true, predicate: ["row"], descendants: true, isSignal: true }], exportAs: ["mfTabList"], hostDirectives: [{ directive: i1.TabList, inputs: ["orientation", "orientation", "wrap", "wrap", "softDisabled", "softDisabled", "focusMode", "focusMode", "selectionMode", "selectionMode", "disabled", "disabled", "selectedTab", "selectedTab"], outputs: ["selectedTabChange", "selectedTabChange"] }], ngImport: i0, template: "<div\r\n  class=\"flex gap-1\"\r\n  [class.flex-col]=\"isVertical()\"\r\n  [class.items-center]=\"!isVertical()\"\r\n  [class.items-stretch]=\"isVertical()\"\r\n>\r\n  @if (showStartArrow()) {\r\n    <button\r\n      mfButton\r\n      tone=\"neutral\"\r\n      appearance=\"text\"\r\n      size=\"icon\"\r\n      shape=\"square\"\r\n      type=\"button\"\r\n      class=\"shrink-0\"\r\n      [attr.aria-label]=\"effectiveScrollStartLabel()\"\r\n      (click)=\"scroller()?.scrollByDir(-1)\"\r\n    >\r\n      <span mfIcon [size]=\"16\" class=\"rtl:-scale-x-100\">{{\r\n        isVertical() ? 'keyboard_arrow_up' : 'chevron_left'\r\n      }}</span>\r\n    </button>\r\n  }\r\n\r\n  <div mfTabScroller [orientation]=\"orientation()\" class=\"grow\">\r\n    <div\r\n      #row\r\n      [class]=\"listClasses()\"\r\n      (pointerover)=\"onPointerOver($event)\"\r\n      (pointerleave)=\"onPointerLeave()\"\r\n    >\r\n      <!-- G\u00F6stergeler i\u00E7erikten \u00D6NCE: `relative` sekmeler onlar\u0131n \u00FCst\u00FCne boyan\u0131r. -->\r\n      @if (drawsHover()) {\r\n        <span\r\n          mfSlidingIndicator\r\n          data-tab-hover\r\n          [axis]=\"axis()\"\r\n          [target]=\"hoveredTab()\"\r\n          [class]=\"hoverClasses()\"\r\n        ></span>\r\n      }\r\n      @if (variant() !== 'card') {\r\n        <span\r\n          mfSlidingIndicator\r\n          data-tab-indicator\r\n          [axis]=\"axis()\"\r\n          [track]=\"ariaTabList.selectedTab()\"\r\n          [class]=\"indicatorClasses()\"\r\n        ></span>\r\n      }\r\n      <ng-content />\r\n    </div>\r\n  </div>\r\n\r\n  @if (showEndArrow()) {\r\n    <button\r\n      mfButton\r\n      tone=\"neutral\"\r\n      appearance=\"text\"\r\n      size=\"icon\"\r\n      shape=\"square\"\r\n      type=\"button\"\r\n      class=\"shrink-0\"\r\n      [attr.aria-label]=\"effectiveScrollEndLabel()\"\r\n      (click)=\"scroller()?.scrollByDir(1)\"\r\n    >\r\n      <span mfIcon [size]=\"16\" class=\"rtl:-scale-x-100\">{{\r\n        isVertical() ? 'keyboard_arrow_down' : 'chevron_right'\r\n      }}</span>\r\n    </button>\r\n  }\r\n</div>\r\n", dependencies: [{ 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: "directive", type: TabScroller, selector: "[mfTabScroller]", inputs: ["orientation"] }, { kind: "directive", type: SlidingIndicator, selector: "[mfSlidingIndicator]", inputs: ["axis", "target", "track", "container"], exportAs: ["mfSlidingIndicator"] }] });
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.6", ngImport: i0, type: TabList, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.7", ngImport: i0, type: TabList, decorators: [{
             type: Component,
             args: [{ selector: 'mf-tab-list', exportAs: 'mfTabList', imports: [Button, Icon, TabScroller, SlidingIndicator], hostDirectives: [
                         {
@@ -426,10 +426,10 @@ class Tab {
         }));
     }, /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "classes" }] : /* istanbul ignore next */ []));
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.6", ngImport: i0, type: Tab, deps: [], target: i0.ɵɵFactoryTarget.Directive });
-    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "22.1.6", type: Tab, isStandalone: true, selector: "button[mfTab]", host: { properties: { "attr.type": "'button'", "class": "classes()" } }, exportAs: ["mfTab"], hostDirectives: [{ directive: i1.Tab, inputs: ["value", "value", "disabled", "disabled", "id", "id"] }], ngImport: i0 });
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.7", ngImport: i0, type: Tab, deps: [], target: i0.ɵɵFactoryTarget.Directive });
+    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "22.1.7", type: Tab, isStandalone: true, selector: "button[mfTab]", host: { properties: { "attr.type": "'button'", "class": "classes()" } }, exportAs: ["mfTab"], hostDirectives: [{ directive: i1.Tab, inputs: ["value", "value", "disabled", "disabled", "id", "id"] }], ngImport: i0 });
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.6", ngImport: i0, type: Tab, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.7", ngImport: i0, type: Tab, decorators: [{
             type: Directive,
             args: [{
                     selector: 'button[mfTab]',
@@ -454,10 +454,10 @@ class TabCount {
         variant: this.tabList?.variant() ?? 'underline',
     })), /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "classes" }] : /* istanbul ignore next */ []));
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.6", ngImport: i0, type: TabCount, deps: [], target: i0.ɵɵFactoryTarget.Directive });
-    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "22.1.6", type: TabCount, isStandalone: true, selector: "span[mfTabCount]", host: { properties: { "class": "classes()" } }, exportAs: ["mfTabCount"], ngImport: i0 });
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.7", ngImport: i0, type: TabCount, deps: [], target: i0.ɵɵFactoryTarget.Directive });
+    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "22.1.7", type: TabCount, isStandalone: true, selector: "span[mfTabCount]", host: { properties: { "class": "classes()" } }, exportAs: ["mfTabCount"], ngImport: i0 });
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.6", ngImport: i0, type: TabCount, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.7", ngImport: i0, type: TabCount, decorators: [{
             type: Directive,
             args: [{
                     selector: 'span[mfTabCount]',
@@ -525,10 +525,10 @@ class TabNav {
     onPointerLeave() {
         this.hoveredLink.set(null);
     }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.6", ngImport: i0, type: TabNav, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.1.6", type: TabNav, isStandalone: true, selector: "mf-tab-nav", inputs: { variant: { classPropertyName: "variant", publicName: "variant", isSignal: true, isRequired: false, transformFunction: null }, size: { classPropertyName: "size", publicName: "size", isSignal: true, isRequired: false, transformFunction: null }, stretch: { classPropertyName: "stretch", publicName: "stretch", isSignal: true, isRequired: false, transformFunction: null }, align: { classPropertyName: "align", publicName: "align", isSignal: true, isRequired: false, transformFunction: null }, hoverHighlight: { classPropertyName: "hoverHighlight", publicName: "hoverHighlight", isSignal: true, isRequired: false, transformFunction: null }, ariaLabel: { classPropertyName: "ariaLabel", publicName: "ariaLabel", isSignal: true, isRequired: false, transformFunction: null } }, host: { classAttribute: "block min-w-0" }, queries: [{ propertyName: "links", predicate: i0.forwardRef(() => TabLink), descendants: true, isSignal: true }], exportAs: ["mfTabNav"], ngImport: i0, template: "<nav [attr.aria-label]=\"ariaLabel() || null\">\r\n  <div mfTabScroller>\r\n    <div\r\n      [class]=\"listClasses()\"\r\n      (pointerover)=\"onPointerOver($event)\"\r\n      (pointerleave)=\"onPointerLeave()\"\r\n    >\r\n      @if (drawsHover()) {\r\n        <span\r\n          mfSlidingIndicator\r\n          data-tab-hover\r\n          [target]=\"hoveredLink()\"\r\n          [class]=\"hoverClasses()\"\r\n        ></span>\r\n      }\r\n      @if (variant() !== 'card') {\r\n        <span\r\n          mfSlidingIndicator\r\n          data-tab-indicator\r\n          target='[aria-current=\"page\"]'\r\n          [track]=\"activeIndex()\"\r\n          [class]=\"indicatorClasses()\"\r\n        ></span>\r\n      }\r\n      <ng-content />\r\n    </div>\r\n  </div>\r\n</nav>\r\n", dependencies: [{ kind: "directive", type: SlidingIndicator, selector: "[mfSlidingIndicator]", inputs: ["axis", "target", "track", "container"], exportAs: ["mfSlidingIndicator"] }, { kind: "directive", type: TabScroller, selector: "[mfTabScroller]", inputs: ["orientation"] }] });
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.7", ngImport: i0, type: TabNav, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.1.7", type: TabNav, isStandalone: true, selector: "mf-tab-nav", inputs: { variant: { classPropertyName: "variant", publicName: "variant", isSignal: true, isRequired: false, transformFunction: null }, size: { classPropertyName: "size", publicName: "size", isSignal: true, isRequired: false, transformFunction: null }, stretch: { classPropertyName: "stretch", publicName: "stretch", isSignal: true, isRequired: false, transformFunction: null }, align: { classPropertyName: "align", publicName: "align", isSignal: true, isRequired: false, transformFunction: null }, hoverHighlight: { classPropertyName: "hoverHighlight", publicName: "hoverHighlight", isSignal: true, isRequired: false, transformFunction: null }, ariaLabel: { classPropertyName: "ariaLabel", publicName: "ariaLabel", isSignal: true, isRequired: false, transformFunction: null } }, host: { classAttribute: "block min-w-0" }, queries: [{ propertyName: "links", predicate: i0.forwardRef(() => TabLink), descendants: true, isSignal: true }], exportAs: ["mfTabNav"], ngImport: i0, template: "<nav [attr.aria-label]=\"ariaLabel() || null\">\r\n  <div mfTabScroller>\r\n    <div\r\n      [class]=\"listClasses()\"\r\n      (pointerover)=\"onPointerOver($event)\"\r\n      (pointerleave)=\"onPointerLeave()\"\r\n    >\r\n      @if (drawsHover()) {\r\n        <span\r\n          mfSlidingIndicator\r\n          data-tab-hover\r\n          [target]=\"hoveredLink()\"\r\n          [class]=\"hoverClasses()\"\r\n        ></span>\r\n      }\r\n      @if (variant() !== 'card') {\r\n        <span\r\n          mfSlidingIndicator\r\n          data-tab-indicator\r\n          target='[aria-current=\"page\"]'\r\n          [track]=\"activeIndex()\"\r\n          [class]=\"indicatorClasses()\"\r\n        ></span>\r\n      }\r\n      <ng-content />\r\n    </div>\r\n  </div>\r\n</nav>\r\n", dependencies: [{ kind: "directive", type: SlidingIndicator, selector: "[mfSlidingIndicator]", inputs: ["axis", "target", "track", "container"], exportAs: ["mfSlidingIndicator"] }, { kind: "directive", type: TabScroller, selector: "[mfTabScroller]", inputs: ["orientation"] }] });
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.6", ngImport: i0, type: TabNav, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.7", ngImport: i0, type: TabNav, decorators: [{
             type: Component,
             args: [{ selector: 'mf-tab-nav', exportAs: 'mfTabNav', imports: [SlidingIndicator, TabScroller], host: { class: 'block min-w-0' }, template: "<nav [attr.aria-label]=\"ariaLabel() || null\">\r\n  <div mfTabScroller>\r\n    <div\r\n      [class]=\"listClasses()\"\r\n      (pointerover)=\"onPointerOver($event)\"\r\n      (pointerleave)=\"onPointerLeave()\"\r\n    >\r\n      @if (drawsHover()) {\r\n        <span\r\n          mfSlidingIndicator\r\n          data-tab-hover\r\n          [target]=\"hoveredLink()\"\r\n          [class]=\"hoverClasses()\"\r\n        ></span>\r\n      }\r\n      @if (variant() !== 'card') {\r\n        <span\r\n          mfSlidingIndicator\r\n          data-tab-indicator\r\n          target='[aria-current=\"page\"]'\r\n          [track]=\"activeIndex()\"\r\n          [class]=\"indicatorClasses()\"\r\n        ></span>\r\n      }\r\n      <ng-content />\r\n    </div>\r\n  </div>\r\n</nav>\r\n" }]
         }], propDecorators: { variant: [{ type: i0.Input, args: [{ isSignal: true, alias: "variant", required: false }] }], size: [{ type: i0.Input, args: [{ isSignal: true, alias: "size", required: false }] }], stretch: [{ type: i0.Input, args: [{ isSignal: true, alias: "stretch", required: false }] }], align: [{ type: i0.Input, args: [{ isSignal: true, alias: "align", required: false }] }], hoverHighlight: [{ type: i0.Input, args: [{ isSignal: true, alias: "hoverHighlight", required: false }] }], ariaLabel: [{ type: i0.Input, args: [{ isSignal: true, alias: "ariaLabel", required: false }] }], links: [{ type: i0.ContentChildren, args: [forwardRef(() => TabLink), { ...{ descendants: true }, isSignal: true }] }] } });
@@ -548,10 +548,10 @@ class TabLink {
         }));
     }, /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "classes" }] : /* istanbul ignore next */ []));
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.6", ngImport: i0, type: TabLink, deps: [], target: i0.ɵɵFactoryTarget.Directive });
-    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "22.1.6", type: TabLink, isStandalone: true, selector: "a[mfTabLink]", inputs: { active: { classPropertyName: "active", publicName: "active", isSignal: true, isRequired: false, transformFunction: null } }, host: { properties: { "attr.aria-current": "active() ? 'page' : null", "class": "classes()" } }, exportAs: ["mfTabLink"], ngImport: i0 });
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.7", ngImport: i0, type: TabLink, deps: [], target: i0.ɵɵFactoryTarget.Directive });
+    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "22.1.7", type: TabLink, isStandalone: true, selector: "a[mfTabLink]", inputs: { active: { classPropertyName: "active", publicName: "active", isSignal: true, isRequired: false, transformFunction: null } }, host: { properties: { "attr.aria-current": "active() ? 'page' : null", "class": "classes()" } }, exportAs: ["mfTabLink"], ngImport: i0 });
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.6", ngImport: i0, type: TabLink, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.7", ngImport: i0, type: TabLink, decorators: [{
             type: Directive,
             args: [{
                     selector: 'a[mfTabLink]',
@@ -589,10 +589,10 @@ class Tabs {
     /** `TabPanel` panel genişliği için okur. */
     vertical = computed(() => this.list()?.isVertical() ?? false, /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "vertical" }] : /* istanbul ignore next */ []));
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.6", ngImport: i0, type: Tabs, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.2.0", version: "22.1.6", type: Tabs, isStandalone: true, selector: "mf-tabs", host: { properties: { "class.flex": "vertical()", "class.items-start": "vertical()", "class.gap-6": "vertical()" }, classAttribute: "block" }, queries: [{ propertyName: "list", first: true, predicate: TabList, descendants: true, isSignal: true }], exportAs: ["mfTabs"], hostDirectives: [{ directive: i1.Tabs }], ngImport: i0, template: '<ng-content />', isInline: true });
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.7", ngImport: i0, type: Tabs, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.2.0", version: "22.1.7", type: Tabs, isStandalone: true, selector: "mf-tabs", host: { properties: { "class.flex": "vertical()", "class.items-start": "vertical()", "class.gap-6": "vertical()" }, classAttribute: "block" }, queries: [{ propertyName: "list", first: true, predicate: TabList, descendants: true, isSignal: true }], exportAs: ["mfTabs"], hostDirectives: [{ directive: i1.Tabs }], ngImport: i0, template: '<ng-content />', isInline: true });
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.6", ngImport: i0, type: Tabs, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.7", ngImport: i0, type: Tabs, decorators: [{
             type: Component,
             args: [{
                     selector: 'mf-tabs',
@@ -634,10 +634,10 @@ class TabPanel {
     inVertical() {
         return this.tabs?.vertical() ?? false;
     }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.6", ngImport: i0, type: TabPanel, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "22.1.6", type: TabPanel, isStandalone: true, selector: "mf-tab-panel", inputs: { animate: { classPropertyName: "animate", publicName: "animate", isSignal: true, isRequired: false, transformFunction: null } }, host: { properties: { "class.hidden": "!ariaTabPanel.visible()", "class.animate-panel-in": "animate()", "class.flex-1": "inVertical()", "class.min-w-0": "inVertical()" }, classAttribute: "block focus-visible:outline focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-focus-ring" }, exportAs: ["mfTabPanel"], hostDirectives: [{ directive: i1.TabPanel, inputs: ["value", "value", "id", "id"] }], ngImport: i0, template: '<ng-content />', isInline: true });
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.7", ngImport: i0, type: TabPanel, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "22.1.7", type: TabPanel, isStandalone: true, selector: "mf-tab-panel", inputs: { animate: { classPropertyName: "animate", publicName: "animate", isSignal: true, isRequired: false, transformFunction: null } }, host: { properties: { "class.hidden": "!ariaTabPanel.visible()", "class.animate-panel-in": "animate()", "class.flex-1": "inVertical()", "class.min-w-0": "inVertical()" }, classAttribute: "block focus-visible:outline focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-focus-ring" }, exportAs: ["mfTabPanel"], hostDirectives: [{ directive: i1.TabPanel, inputs: ["value", "value", "id", "id"] }], ngImport: i0, template: '<ng-content />', isInline: true });
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.6", ngImport: i0, type: TabPanel, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.7", ngImport: i0, type: TabPanel, decorators: [{
             type: Component,
             args: [{
                     selector: 'mf-tab-panel',
@@ -794,10 +794,10 @@ class TabStrip {
                 this.scroller()?.scrollIntoViewIfNeeded(btn);
         });
     }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.6", ngImport: i0, type: TabStrip, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.1.6", type: TabStrip, isStandalone: true, selector: "mf-tab-strip", inputs: { items: { classPropertyName: "items", publicName: "items", isSignal: true, isRequired: true, transformFunction: null }, activeKey: { classPropertyName: "activeKey", publicName: "activeKey", isSignal: true, isRequired: true, transformFunction: null }, contentId: { classPropertyName: "contentId", publicName: "contentId", isSignal: true, isRequired: false, transformFunction: null }, scrollStartLabel: { classPropertyName: "scrollStartLabel", publicName: "scrollStartLabel", isSignal: true, isRequired: false, transformFunction: null }, scrollEndLabel: { classPropertyName: "scrollEndLabel", publicName: "scrollEndLabel", isSignal: true, isRequired: false, transformFunction: null }, closeLabel: { classPropertyName: "closeLabel", publicName: "closeLabel", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { activeKey: "activeKeyChange", close: "close", itemContextMenu: "itemContextMenu" }, host: { attributes: { "role": "tablist" }, classAttribute: "block" }, viewQueries: [{ propertyName: "scroller", first: true, predicate: TabScroller, descendants: true, isSignal: true }, { propertyName: "rowEl", first: true, predicate: ["row"], descendants: true, isSignal: true }], exportAs: ["mfTabStrip"], ngImport: i0, template: "<div class=\"flex items-center gap-1\">\r\n  @if (showStartArrow()) {\r\n    <button\r\n      type=\"button\"\r\n      class=\"inline-flex items-center justify-center shrink-0 appearance-none border-0 bg-transparent p-1 text-fg-subtle transition-colors duration-fast ease-emphasis hover:text-fg\"\r\n      [attr.aria-label]=\"effectiveScrollStartLabel()\"\r\n      (click)=\"scroller()?.scrollByDir(-1)\"\r\n    >\r\n      <span mfIcon [size]=\"16\" class=\"rtl:-scale-x-100\">chevron_left</span>\r\n    </button>\r\n  }\r\n\r\n  <!-- Kayd\u0131rma kapsay\u0131c\u0131s\u0131 odaklanabilir de\u011Fil \u2014 ok tu\u015Fu gezinmesi burada delege; ger\u00E7ek odak roving tabindex ile alt sekmelerde. -->\r\n  <!-- eslint-disable-next-line @angular-eslint/template/interactive-supports-focus -->\r\n  <div mfTabScroller (keydown)=\"onKeydown($event)\">\r\n    <div #row class=\"flex items-center gap-1 py-1\">\r\n      @for (item of items(); track item.key) {\r\n        <!-- Enter/Space se\u00E7imi \u00FCstteki kapsay\u0131c\u0131n\u0131n (keydown)'\u0131nda y\u00F6netiliyor (roving tabindex deseni). -->\r\n        <!-- eslint-disable-next-line @angular-eslint/template/click-events-have-key-events -->\r\n        <div\r\n          role=\"tab\"\r\n          [attr.data-tab-key]=\"item.key\"\r\n          [attr.aria-selected]=\"item.key === activeKey()\"\r\n          [attr.aria-controls]=\"item.key === activeKey() ? contentId() : null\"\r\n          [tabindex]=\"tabIndexFor(item)\"\r\n          [class]=\"tabClasses(item)\"\r\n          (click)=\"select(item.key)\"\r\n          (contextmenu)=\"onContextMenu($event, item)\"\r\n        >\r\n          @if (item.icon) {\r\n            <span mfIcon [size]=\"14\">{{ item.icon }}</span>\r\n          }\r\n          <span class=\"truncate\">{{ item.label }}</span>\r\n          @if (item.closable) {\r\n            <button\r\n              type=\"button\"\r\n              tabindex=\"-1\"\r\n              class=\"ms-0.5 inline-flex h-4 w-4 shrink-0 appearance-none items-center justify-center rounded-xs border-0 bg-transparent p-0 text-fg-subtle transition-colors duration-fast ease-emphasis hover:bg-surface-active hover:text-fg\"\r\n              [attr.aria-label]=\"effectiveCloseLabel() + ': ' + item.label\"\r\n              (click)=\"onCloseClick($event, item.key)\"\r\n            >\r\n              <span mfIcon [size]=\"13\">close</span>\r\n            </button>\r\n          }\r\n        </div>\r\n      }\r\n    </div>\r\n  </div>\r\n\r\n  @if (showEndArrow()) {\r\n    <button\r\n      type=\"button\"\r\n      class=\"inline-flex items-center justify-center shrink-0 appearance-none border-0 bg-transparent p-1 text-fg-subtle transition-colors duration-fast ease-emphasis hover:text-fg\"\r\n      [attr.aria-label]=\"effectiveScrollEndLabel()\"\r\n      (click)=\"scroller()?.scrollByDir(1)\"\r\n    >\r\n      <span mfIcon [size]=\"16\" class=\"rtl:-scale-x-100\">chevron_right</span>\r\n    </button>\r\n  }\r\n</div>\r\n", dependencies: [{ kind: "directive", type: Icon, selector: "span[mfIcon]", inputs: ["size", "filled"] }, { kind: "directive", type: TabScroller, selector: "[mfTabScroller]", inputs: ["orientation"] }] });
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.7", ngImport: i0, type: TabStrip, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.1.7", type: TabStrip, isStandalone: true, selector: "mf-tab-strip", inputs: { items: { classPropertyName: "items", publicName: "items", isSignal: true, isRequired: true, transformFunction: null }, activeKey: { classPropertyName: "activeKey", publicName: "activeKey", isSignal: true, isRequired: true, transformFunction: null }, contentId: { classPropertyName: "contentId", publicName: "contentId", isSignal: true, isRequired: false, transformFunction: null }, scrollStartLabel: { classPropertyName: "scrollStartLabel", publicName: "scrollStartLabel", isSignal: true, isRequired: false, transformFunction: null }, scrollEndLabel: { classPropertyName: "scrollEndLabel", publicName: "scrollEndLabel", isSignal: true, isRequired: false, transformFunction: null }, closeLabel: { classPropertyName: "closeLabel", publicName: "closeLabel", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { activeKey: "activeKeyChange", close: "close", itemContextMenu: "itemContextMenu" }, host: { attributes: { "role": "tablist" }, classAttribute: "block" }, viewQueries: [{ propertyName: "scroller", first: true, predicate: TabScroller, descendants: true, isSignal: true }, { propertyName: "rowEl", first: true, predicate: ["row"], descendants: true, isSignal: true }], exportAs: ["mfTabStrip"], ngImport: i0, template: "<div class=\"flex items-center gap-1\">\r\n  @if (showStartArrow()) {\r\n    <button\r\n      type=\"button\"\r\n      class=\"inline-flex items-center justify-center shrink-0 appearance-none border-0 bg-transparent p-1 text-fg-subtle transition-colors duration-fast ease-emphasis hover:text-fg\"\r\n      [attr.aria-label]=\"effectiveScrollStartLabel()\"\r\n      (click)=\"scroller()?.scrollByDir(-1)\"\r\n    >\r\n      <span mfIcon [size]=\"16\" class=\"rtl:-scale-x-100\">chevron_left</span>\r\n    </button>\r\n  }\r\n\r\n  <!-- Kayd\u0131rma kapsay\u0131c\u0131s\u0131 odaklanabilir de\u011Fil \u2014 ok tu\u015Fu gezinmesi burada delege; ger\u00E7ek odak roving tabindex ile alt sekmelerde. -->\r\n  <!-- eslint-disable-next-line @angular-eslint/template/interactive-supports-focus -->\r\n  <div mfTabScroller (keydown)=\"onKeydown($event)\">\r\n    <div #row class=\"flex items-center gap-1 py-1\">\r\n      @for (item of items(); track item.key) {\r\n        <!-- Enter/Space se\u00E7imi \u00FCstteki kapsay\u0131c\u0131n\u0131n (keydown)'\u0131nda y\u00F6netiliyor (roving tabindex deseni). -->\r\n        <!-- eslint-disable-next-line @angular-eslint/template/click-events-have-key-events -->\r\n        <div\r\n          role=\"tab\"\r\n          [attr.data-tab-key]=\"item.key\"\r\n          [attr.aria-selected]=\"item.key === activeKey()\"\r\n          [attr.aria-controls]=\"item.key === activeKey() ? contentId() : null\"\r\n          [tabindex]=\"tabIndexFor(item)\"\r\n          [class]=\"tabClasses(item)\"\r\n          (click)=\"select(item.key)\"\r\n          (contextmenu)=\"onContextMenu($event, item)\"\r\n        >\r\n          @if (item.icon) {\r\n            <span mfIcon [size]=\"14\">{{ item.icon }}</span>\r\n          }\r\n          <span class=\"truncate\">{{ item.label }}</span>\r\n          @if (item.closable) {\r\n            <button\r\n              type=\"button\"\r\n              tabindex=\"-1\"\r\n              class=\"ms-0.5 inline-flex h-4 w-4 shrink-0 appearance-none items-center justify-center rounded-xs border-0 bg-transparent p-0 text-fg-subtle transition-colors duration-fast ease-emphasis hover:bg-surface-active hover:text-fg\"\r\n              [attr.aria-label]=\"effectiveCloseLabel() + ': ' + item.label\"\r\n              (click)=\"onCloseClick($event, item.key)\"\r\n            >\r\n              <span mfIcon [size]=\"13\">close</span>\r\n            </button>\r\n          }\r\n        </div>\r\n      }\r\n    </div>\r\n  </div>\r\n\r\n  @if (showEndArrow()) {\r\n    <button\r\n      type=\"button\"\r\n      class=\"inline-flex items-center justify-center shrink-0 appearance-none border-0 bg-transparent p-1 text-fg-subtle transition-colors duration-fast ease-emphasis hover:text-fg\"\r\n      [attr.aria-label]=\"effectiveScrollEndLabel()\"\r\n      (click)=\"scroller()?.scrollByDir(1)\"\r\n    >\r\n      <span mfIcon [size]=\"16\" class=\"rtl:-scale-x-100\">chevron_right</span>\r\n    </button>\r\n  }\r\n</div>\r\n", dependencies: [{ kind: "directive", type: Icon, selector: "span[mfIcon]", inputs: ["size", "filled"] }, { kind: "directive", type: TabScroller, selector: "[mfTabScroller]", inputs: ["orientation"] }] });
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.6", ngImport: i0, type: TabStrip, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.7", ngImport: i0, type: TabStrip, decorators: [{
             type: Component,
             args: [{ selector: 'mf-tab-strip', exportAs: 'mfTabStrip', imports: [Icon, TabScroller], host: { class: 'block', role: 'tablist' }, template: "<div class=\"flex items-center gap-1\">\r\n  @if (showStartArrow()) {\r\n    <button\r\n      type=\"button\"\r\n      class=\"inline-flex items-center justify-center shrink-0 appearance-none border-0 bg-transparent p-1 text-fg-subtle transition-colors duration-fast ease-emphasis hover:text-fg\"\r\n      [attr.aria-label]=\"effectiveScrollStartLabel()\"\r\n      (click)=\"scroller()?.scrollByDir(-1)\"\r\n    >\r\n      <span mfIcon [size]=\"16\" class=\"rtl:-scale-x-100\">chevron_left</span>\r\n    </button>\r\n  }\r\n\r\n  <!-- Kayd\u0131rma kapsay\u0131c\u0131s\u0131 odaklanabilir de\u011Fil \u2014 ok tu\u015Fu gezinmesi burada delege; ger\u00E7ek odak roving tabindex ile alt sekmelerde. -->\r\n  <!-- eslint-disable-next-line @angular-eslint/template/interactive-supports-focus -->\r\n  <div mfTabScroller (keydown)=\"onKeydown($event)\">\r\n    <div #row class=\"flex items-center gap-1 py-1\">\r\n      @for (item of items(); track item.key) {\r\n        <!-- Enter/Space se\u00E7imi \u00FCstteki kapsay\u0131c\u0131n\u0131n (keydown)'\u0131nda y\u00F6netiliyor (roving tabindex deseni). -->\r\n        <!-- eslint-disable-next-line @angular-eslint/template/click-events-have-key-events -->\r\n        <div\r\n          role=\"tab\"\r\n          [attr.data-tab-key]=\"item.key\"\r\n          [attr.aria-selected]=\"item.key === activeKey()\"\r\n          [attr.aria-controls]=\"item.key === activeKey() ? contentId() : null\"\r\n          [tabindex]=\"tabIndexFor(item)\"\r\n          [class]=\"tabClasses(item)\"\r\n          (click)=\"select(item.key)\"\r\n          (contextmenu)=\"onContextMenu($event, item)\"\r\n        >\r\n          @if (item.icon) {\r\n            <span mfIcon [size]=\"14\">{{ item.icon }}</span>\r\n          }\r\n          <span class=\"truncate\">{{ item.label }}</span>\r\n          @if (item.closable) {\r\n            <button\r\n              type=\"button\"\r\n              tabindex=\"-1\"\r\n              class=\"ms-0.5 inline-flex h-4 w-4 shrink-0 appearance-none items-center justify-center rounded-xs border-0 bg-transparent p-0 text-fg-subtle transition-colors duration-fast ease-emphasis hover:bg-surface-active hover:text-fg\"\r\n              [attr.aria-label]=\"effectiveCloseLabel() + ': ' + item.label\"\r\n              (click)=\"onCloseClick($event, item.key)\"\r\n            >\r\n              <span mfIcon [size]=\"13\">close</span>\r\n            </button>\r\n          }\r\n        </div>\r\n      }\r\n    </div>\r\n  </div>\r\n\r\n  @if (showEndArrow()) {\r\n    <button\r\n      type=\"button\"\r\n      class=\"inline-flex items-center justify-center shrink-0 appearance-none border-0 bg-transparent p-1 text-fg-subtle transition-colors duration-fast ease-emphasis hover:text-fg\"\r\n      [attr.aria-label]=\"effectiveScrollEndLabel()\"\r\n      (click)=\"scroller()?.scrollByDir(1)\"\r\n    >\r\n      <span mfIcon [size]=\"16\" class=\"rtl:-scale-x-100\">chevron_right</span>\r\n    </button>\r\n  }\r\n</div>\r\n" }]
         }], propDecorators: { items: [{ type: i0.Input, args: [{ isSignal: true, alias: "items", required: true }] }], activeKey: [{ type: i0.Input, args: [{ isSignal: true, alias: "activeKey", required: true }] }, { type: i0.Output, args: ["activeKeyChange"] }], contentId: [{ type: i0.Input, args: [{ isSignal: true, alias: "contentId", required: false }] }], scrollStartLabel: [{ type: i0.Input, args: [{ isSignal: true, alias: "scrollStartLabel", required: false }] }], scrollEndLabel: [{ type: i0.Input, args: [{ isSignal: true, alias: "scrollEndLabel", required: false }] }], closeLabel: [{ type: i0.Input, args: [{ isSignal: true, alias: "closeLabel", required: false }] }], close: [{ type: i0.Output, args: ["close"] }], itemContextMenu: [{ type: i0.Output, args: ["itemContextMenu"] }], scroller: [{ type: i0.ViewChild, args: [i0.forwardRef(() => TabScroller), { isSignal: true }] }], rowEl: [{ type: i0.ViewChild, args: ['row', { isSignal: true }] }] } });

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

@@ -72,8 +72,8 @@ class TagInput extends ValueAccessorBase {
         this.onChange(next);
         this.onTouched();
     }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.6", ngImport: i0, type: TagInput, deps: null, target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.1.6", type: TagInput, isStandalone: true, selector: "mf-tag-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 }, removeLabel: { classPropertyName: "removeLabel", publicName: "removeLabel", isSignal: true, isRequired: false, transformFunction: null }, unique: { classPropertyName: "unique", publicName: "unique", 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(() => TagInput), multi: true }], viewQueries: [{ propertyName: "inputEl", first: true, predicate: ["inputEl"], descendants: true, isSignal: true }], exportAs: ["mfTagInput"], usesInheritance: true, ngImport: i0, template: `
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.7", ngImport: i0, type: TagInput, deps: null, target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.1.7", type: TagInput, isStandalone: true, selector: "mf-tag-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 }, removeLabel: { classPropertyName: "removeLabel", publicName: "removeLabel", isSignal: true, isRequired: false, transformFunction: null }, unique: { classPropertyName: "unique", publicName: "unique", 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(() => TagInput), multi: true }], viewQueries: [{ propertyName: "inputEl", first: true, predicate: ["inputEl"], descendants: true, isSignal: true }], exportAs: ["mfTagInput"], usesInheritance: true, ngImport: i0, template: `
     <mf-input-group [wrap]="true" [hasError]="hasError()" [disabled]="disabled()">
       @for (tag of value(); track tag) {
         <mf-chip
@@ -99,7 +99,7 @@ class TagInput extends ValueAccessorBase {
     </mf-input-group>
   `, isInline: true, dependencies: [{ kind: "component", type: Chip, selector: "mf-chip", inputs: ["tone", "size", "selected", "disabled", "removable", "removeLabel"], outputs: ["removed"], exportAs: ["mfChip"] }, { kind: "component", type: InputGroup, selector: "mf-input-group", inputs: ["size", "disabled", "hasError", "padded", "wrap"], exportAs: ["mfInputGroup"] }] });
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.6", ngImport: i0, type: TagInput, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.7", ngImport: i0, type: TagInput, decorators: [{
             type: Component,
             args: [{
                     selector: 'mf-tag-input',

package/fesm2022/mesgflow-ui-kit-theme-switcher.mjs

@@ -37,10 +37,10 @@ class ThemeSwitcher {
         if (mode === 'light' || mode === 'dark' || mode === 'system')
             this.colorMode.setMode(mode);
     }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.6", ngImport: i0, type: ThemeSwitcher, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.1.6", type: ThemeSwitcher, isStandalone: true, selector: "mf-theme-switcher", inputs: { appearance: { classPropertyName: "appearance", publicName: "appearance", isSignal: true, isRequired: false, transformFunction: null }, size: { classPropertyName: "size", publicName: "size", isSignal: true, isRequired: false, transformFunction: null } }, host: { classAttribute: "inline-flex" }, exportAs: ["mfThemeSwitcher"], ngImport: i0, template: "@if (appearance() === 'button') {\r\n  <button\r\n    mfButton\r\n    tone=\"neutral\"\r\n    appearance=\"text\"\r\n    size=\"icon\"\r\n    shape=\"square\"\r\n    type=\"button\"\r\n    [attr.aria-label]=\"cycleLabel()\"\r\n    [mfTooltip]=\"cycleLabel()\"\r\n    (click)=\"colorMode.cycle()\"\r\n  >\r\n    <span mfIcon [size]=\"18\">{{ icons[colorMode.mode()] }}</span>\r\n  </button>\r\n} @else {\r\n  <mf-toggle-group\r\n    type=\"single\"\r\n    appearance=\"outline\"\r\n    [size]=\"size()\"\r\n    [allowEmpty]=\"false\"\r\n    [value]=\"[colorMode.mode()]\"\r\n    (valueChange)=\"select($event)\"\r\n    [ariaLabel]=\"labels().ariaLabel\"\r\n  >\r\n    @for (mode of modes; track mode) {\r\n      <button\r\n        mfToggleGroupItem\r\n        [value]=\"mode\"\r\n        iconOnly\r\n        [attr.aria-label]=\"labels()[mode]\"\r\n        [mfTooltip]=\"labels()[mode]\"\r\n      >\r\n        <span mfIcon [size]=\"16\">{{ icons[mode] }}</span>\r\n      </button>\r\n    }\r\n  </mf-toggle-group>\r\n}\r\n", dependencies: [{ 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: ToggleGroup, selector: "mf-toggle-group", inputs: ["type", "value", "size", "appearance", "orientation", "disabled", "allowEmpty", "ariaLabel"], outputs: ["valueChange"], exportAs: ["mfToggleGroup"] }, { kind: "directive", type: ToggleGroupItem, selector: "button[mfToggleGroupItem]", inputs: ["value", "disabled", "iconOnly"], exportAs: ["mfToggleGroupItem"] }, { kind: "directive", type: Tooltip, selector: "[mfTooltip], [mfTooltipContent]", inputs: ["mfTooltip", "mfTooltipContent", "tooltipPosition"], exportAs: ["mfTooltip"] }] });
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.7", ngImport: i0, type: ThemeSwitcher, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.1.7", type: ThemeSwitcher, isStandalone: true, selector: "mf-theme-switcher", inputs: { appearance: { classPropertyName: "appearance", publicName: "appearance", isSignal: true, isRequired: false, transformFunction: null }, size: { classPropertyName: "size", publicName: "size", isSignal: true, isRequired: false, transformFunction: null } }, host: { classAttribute: "inline-flex" }, exportAs: ["mfThemeSwitcher"], ngImport: i0, template: "@if (appearance() === 'button') {\r\n  <button\r\n    mfButton\r\n    tone=\"neutral\"\r\n    appearance=\"text\"\r\n    size=\"icon\"\r\n    shape=\"square\"\r\n    type=\"button\"\r\n    [attr.aria-label]=\"cycleLabel()\"\r\n    [mfTooltip]=\"cycleLabel()\"\r\n    (click)=\"colorMode.cycle()\"\r\n  >\r\n    <span mfIcon [size]=\"18\">{{ icons[colorMode.mode()] }}</span>\r\n  </button>\r\n} @else {\r\n  <mf-toggle-group\r\n    type=\"single\"\r\n    appearance=\"outline\"\r\n    [size]=\"size()\"\r\n    [allowEmpty]=\"false\"\r\n    [value]=\"[colorMode.mode()]\"\r\n    (valueChange)=\"select($event)\"\r\n    [ariaLabel]=\"labels().ariaLabel\"\r\n  >\r\n    @for (mode of modes; track mode) {\r\n      <button\r\n        mfToggleGroupItem\r\n        [value]=\"mode\"\r\n        iconOnly\r\n        [attr.aria-label]=\"labels()[mode]\"\r\n        [mfTooltip]=\"labels()[mode]\"\r\n      >\r\n        <span mfIcon [size]=\"16\">{{ icons[mode] }}</span>\r\n      </button>\r\n    }\r\n  </mf-toggle-group>\r\n}\r\n", dependencies: [{ 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: ToggleGroup, selector: "mf-toggle-group", inputs: ["type", "value", "size", "appearance", "orientation", "disabled", "allowEmpty", "ariaLabel"], outputs: ["valueChange"], exportAs: ["mfToggleGroup"] }, { kind: "directive", type: ToggleGroupItem, selector: "button[mfToggleGroupItem]", inputs: ["value", "disabled", "iconOnly"], exportAs: ["mfToggleGroupItem"] }, { kind: "directive", type: Tooltip, selector: "[mfTooltip], [mfTooltipContent]", inputs: ["mfTooltip", "mfTooltipContent", "tooltipPosition"], exportAs: ["mfTooltip"] }] });
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.6", ngImport: i0, type: ThemeSwitcher, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.7", ngImport: i0, type: ThemeSwitcher, decorators: [{
             type: Component,
             args: [{ selector: 'mf-theme-switcher', exportAs: 'mfThemeSwitcher', imports: [Button, Icon, ToggleGroup, ToggleGroupItem, Tooltip], host: { class: 'inline-flex' }, template: "@if (appearance() === 'button') {\r\n  <button\r\n    mfButton\r\n    tone=\"neutral\"\r\n    appearance=\"text\"\r\n    size=\"icon\"\r\n    shape=\"square\"\r\n    type=\"button\"\r\n    [attr.aria-label]=\"cycleLabel()\"\r\n    [mfTooltip]=\"cycleLabel()\"\r\n    (click)=\"colorMode.cycle()\"\r\n  >\r\n    <span mfIcon [size]=\"18\">{{ icons[colorMode.mode()] }}</span>\r\n  </button>\r\n} @else {\r\n  <mf-toggle-group\r\n    type=\"single\"\r\n    appearance=\"outline\"\r\n    [size]=\"size()\"\r\n    [allowEmpty]=\"false\"\r\n    [value]=\"[colorMode.mode()]\"\r\n    (valueChange)=\"select($event)\"\r\n    [ariaLabel]=\"labels().ariaLabel\"\r\n  >\r\n    @for (mode of modes; track mode) {\r\n      <button\r\n        mfToggleGroupItem\r\n        [value]=\"mode\"\r\n        iconOnly\r\n        [attr.aria-label]=\"labels()[mode]\"\r\n        [mfTooltip]=\"labels()[mode]\"\r\n      >\r\n        <span mfIcon [size]=\"16\">{{ icons[mode] }}</span>\r\n      </button>\r\n    }\r\n  </mf-toggle-group>\r\n}\r\n" }]
         }], propDecorators: { appearance: [{ type: i0.Input, args: [{ isSignal: true, alias: "appearance", required: false }] }], size: [{ type: i0.Input, args: [{ isSignal: true, alias: "size", required: false }] }] } });

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

@@ -978,10 +978,10 @@ class MfColorModeService {
         }
         return this.config.defaultMode;
     }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.6", ngImport: i0, type: MfColorModeService, deps: [], target: i0.ɵɵFactoryTarget.Service });
-    static ɵprov = i0.ɵɵngDeclareService({ minVersion: "22.0.0", version: "22.1.6", ngImport: i0, type: MfColorModeService });
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.7", ngImport: i0, type: MfColorModeService, deps: [], target: i0.ɵɵFactoryTarget.Service });
+    static ɵprov = i0.ɵɵngDeclareService({ minVersion: "22.0.0", version: "22.1.7", ngImport: i0, type: MfColorModeService });
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.6", ngImport: i0, type: MfColorModeService, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.7", ngImport: i0, type: MfColorModeService, decorators: [{
             type: Service
         }], ctorParameters: () => [] });
 /**

package/fesm2022/mesgflow-ui-kit-time-picker.mjs

@@ -118,12 +118,12 @@ class TimePicker extends ValueAccessorBase {
     optionClasses(selected) {
         return cn('rounded-sm px-3 py-1 text-start text-sm tabular-nums transition-colors duration-fast ease-emphasis hover:bg-state-hover', selected ? 'bg-primary-tint text-primary-tint-fg' : '');
     }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.6", ngImport: i0, type: TimePicker, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.1.6", type: TimePicker, isStandalone: true, selector: "mf-time-picker", inputs: { value: { classPropertyName: "value", publicName: "value", isSignal: true, isRequired: false, transformFunction: null }, minuteStep: { classPropertyName: "minuteStep", publicName: "minuteStep", 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 }, ariaLabel: { classPropertyName: "ariaLabel", publicName: "ariaLabel", isSignal: true, isRequired: false, transformFunction: null }, clearLabel: { classPropertyName: "clearLabel", publicName: "clearLabel", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { value: "valueChange" }, host: { classAttribute: "block" }, providers: [
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.7", ngImport: i0, type: TimePicker, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.1.7", type: TimePicker, isStandalone: true, selector: "mf-time-picker", inputs: { value: { classPropertyName: "value", publicName: "value", isSignal: true, isRequired: false, transformFunction: null }, minuteStep: { classPropertyName: "minuteStep", publicName: "minuteStep", 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 }, ariaLabel: { classPropertyName: "ariaLabel", publicName: "ariaLabel", isSignal: true, isRequired: false, transformFunction: null }, clearLabel: { classPropertyName: "clearLabel", publicName: "clearLabel", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { value: "valueChange" }, host: { classAttribute: "block" }, providers: [
             { provide: NG_VALUE_ACCESSOR, useExisting: forwardRef(() => TimePicker), multi: true },
         ], viewQueries: [{ propertyName: "inputEl", first: true, predicate: ["inputEl"], descendants: true, isSignal: true }], exportAs: ["mfTimePicker"], usesInheritance: true, ngImport: i0, template: "<div class=\"relative w-full\" cdkOverlayOrigin #origin=\"cdkOverlayOrigin\">\n  <mf-input-group [hasError]=\"hasError()\" [disabled]=\"disabled()\">\n    <span mfInputPrefix><span mfIcon [size]=\"18\">schedule</span></span>\n    <input\n      #inputEl\n      type=\"text\"\n      class=\"w-full min-w-0 appearance-none border-0 bg-transparent p-0 text-sm text-fg placeholder:text-fg-subtle focus:outline-none\"\n      [placeholder]=\"effectivePlaceholder()\"\n      [value]=\"draft()\"\n      [disabled]=\"disabled()\"\n      [attr.aria-label]=\"ariaLabel() || null\"\n      (input)=\"onInput($any($event.target).value)\"\n      (focus)=\"open.set(true)\"\n      (keydown.enter)=\"commitDraft()\"\n      (keydown.escape)=\"onEscape()\"\n    />\n    @if (value()) {\n      <button\n        mfInputSuffix\n        type=\"button\"\n        class=\"appearance-none border-0 bg-transparent p-0 transition-colors duration-fast ease-emphasis hover:text-fg\"\n        [attr.aria-label]=\"effectiveClearLabel()\"\n        (click)=\"clear()\"\n      >\n        <span mfIcon [size]=\"16\">close</span>\n      </button>\n    }\n  </mf-input-group>\n\n  <mf-popover\n    [origin]=\"origin\"\n    [open]=\"open()\"\n    placement=\"bottom-start\"\n    padding=\"none\"\n    (closed)=\"onEscape()\"\n  >\n    <div class=\"flex divide-x divide-border\">\n      <mf-scroll-area class=\"max-h-48\">\n        <div class=\"flex flex-col gap-0.5 p-1\">\n          @for (h of hours; track h) {\n            <button\n              type=\"button\"\n              [class]=\"optionClasses(value()?.hour === h)\"\n              (click)=\"pickHour(h)\"\n            >\n              {{ h.toString().padStart(2, '0') }}\n            </button>\n          }\n        </div>\n      </mf-scroll-area>\n      <mf-scroll-area class=\"max-h-48\">\n        <div class=\"flex flex-col gap-0.5 p-1\">\n          @for (m of minutes(); track m) {\n            <button\n              type=\"button\"\n              [class]=\"optionClasses(value()?.minute === m)\"\n              (click)=\"pickMinute(m)\"\n            >\n              {{ m.toString().padStart(2, '0') }}\n            </button>\n          }\n        </div>\n      </mf-scroll-area>\n    </div>\n  </mf-popover>\n</div>\n", dependencies: [{ kind: "ngmodule", type: OverlayModule }, { kind: "directive", type: i1.CdkOverlayOrigin, selector: "[cdk-overlay-origin], [overlay-origin], [cdkOverlayOrigin]", exportAs: ["cdkOverlayOrigin"] }, { kind: "directive", type: Icon, selector: "span[mfIcon]", inputs: ["size", "filled"] }, { 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"] }, { kind: "component", type: Popover, selector: "mf-popover", inputs: ["origin", "open", "placement", "padding", "hasBackdrop", "matchTriggerWidth", "panelClass"], outputs: ["openChange", "closed"], exportAs: ["mfPopover"] }, { kind: "component", type: ScrollArea, selector: "mf-scroll-area", inputs: ["orientation"], exportAs: ["mfScrollArea"] }] });
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.6", ngImport: i0, type: TimePicker, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.7", ngImport: i0, type: TimePicker, decorators: [{
             type: Component,
             args: [{ selector: 'mf-time-picker', exportAs: 'mfTimePicker', imports: [OverlayModule, Icon, InputGroup, InputPrefix, InputSuffix, Popover, ScrollArea], host: { class: 'block' }, providers: [
                         { provide: NG_VALUE_ACCESSOR, useExisting: forwardRef(() => TimePicker), multi: true },

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

@@ -26,8 +26,8 @@ class Timeline {
     dotClasses(tone) {
         return cn('relative z-10 mt-1 h-2.5 w-2.5 shrink-0 rounded-full', DOT_TONE[tone ?? 'neutral']);
     }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.6", ngImport: i0, type: Timeline, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.1.6", type: Timeline, isStandalone: true, selector: "mf-timeline", inputs: { items: { classPropertyName: "items", publicName: "items", isSignal: true, isRequired: true, transformFunction: null } }, host: { attributes: { "role": "list" }, classAttribute: "flex flex-col" }, exportAs: ["mfTimeline"], ngImport: i0, template: `
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.7", ngImport: i0, type: Timeline, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.1.7", type: Timeline, isStandalone: true, selector: "mf-timeline", inputs: { items: { classPropertyName: "items", publicName: "items", isSignal: true, isRequired: true, transformFunction: null } }, host: { attributes: { "role": "list" }, classAttribute: "flex flex-col" }, exportAs: ["mfTimeline"], ngImport: i0, template: `
     @for (item of items(); track item.title; let last = $last) {
       <div role="listitem" class="flex gap-3">
         <div class="flex flex-col items-center">
@@ -51,7 +51,7 @@ class Timeline {
     }
   `, isInline: true });
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.6", ngImport: i0, type: Timeline, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.7", ngImport: i0, type: Timeline, decorators: [{
             type: Component,
             args: [{
                     selector: 'mf-timeline',

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

@@ -167,10 +167,10 @@ class ToastService {
     patch(id, changes) {
         this.items.update((list) => list.map((i) => (i.id === id ? { ...i, ...changes } : i)));
     }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.6", ngImport: i0, type: ToastService, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
-    static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "22.1.6", ngImport: i0, type: ToastService, providedIn: 'root' });
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.7", ngImport: i0, type: ToastService, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
+    static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "22.1.7", ngImport: i0, type: ToastService, providedIn: 'root' });
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.6", ngImport: i0, type: ToastService, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.7", ngImport: i0, type: ToastService, decorators: [{
             type: Injectable,
             args: [{ providedIn: 'root' }]
         }] });
@@ -269,10 +269,10 @@ class ToastHost {
         item.action?.onClick();
         this.toasts.dismiss(item.id);
     }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.6", ngImport: i0, type: ToastHost, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.1.6", type: ToastHost, isStandalone: true, selector: "mf-toast-host", inputs: { dismissLabel: { classPropertyName: "dismissLabel", publicName: "dismissLabel", isSignal: true, isRequired: false, transformFunction: null }, position: { classPropertyName: "position", publicName: "position", isSignal: true, isRequired: false, transformFunction: null }, limit: { classPropertyName: "limit", publicName: "limit", isSignal: true, isRequired: false, transformFunction: null } }, host: { properties: { "class": "hostClasses()" } }, ngImport: i0, template: "@for (item of toasts.items(); track item.id) {\r\n  <!--\r\n    role: hata/uyar\u0131 `alert` (assertive), ba\u015Far\u0131/bilgi `status` (polite) \u2014\r\n    her bildirimin ekran okuyucuyu KESMES\u0130 gereksiz ve rahats\u0131z edici.\r\n    \u00DCzerine gelince / i\u00E7ine odaklan\u0131nca geri say\u0131m durur (WCAG 2.2.1).\r\n  -->\r\n  <div\r\n    data-mf-toast\r\n    [attr.role]=\"item.type === 'danger' || item.type === 'warning' ? 'alert' : 'status'\"\r\n    [attr.aria-busy]=\"item.loading || null\"\r\n    [class]=\"cardClassFor(item)\"\r\n    (mouseenter)=\"toasts.pause(item.id)\"\r\n    (mouseleave)=\"toasts.resume(item.id)\"\r\n    (focusin)=\"toasts.pause(item.id)\"\r\n    (focusout)=\"toasts.resume(item.id)\"\r\n  >\r\n    <div\r\n      [class]=\"\r\n        'flex h-8 w-8 shrink-0 items-center justify-center rounded-md ' + chipBgFor(item.type)\r\n      \"\r\n    >\r\n      @if (item.loading) {\r\n        <span aria-hidden=\"true\" class=\"inline-flex text-fg-muted\">\r\n          <mf-spinner size=\"sm\" />\r\n        </span>\r\n      } @else {\r\n        <span\r\n          mfIcon\r\n          [size]=\"16\"\r\n          [filled]=\"true\"\r\n          class=\"animate-pop\"\r\n          [class.text-success]=\"item.type === 'success'\"\r\n          [class.text-danger]=\"item.type === 'danger'\"\r\n          [class.text-warning]=\"item.type === 'warning'\"\r\n          [class.text-info]=\"item.type === 'info'\"\r\n        >\r\n          {{ iconFor(item.type) }}\r\n        </span>\r\n      }\r\n    </div>\r\n\r\n    <div class=\"min-w-0 flex-1\">\r\n      <p class=\"text-sm font-semibold text-fg\">{{ item.title }}</p>\r\n      @if (item.description) {\r\n        <p class=\"mt-0.5 text-sm whitespace-pre-line text-fg-muted\">{{ item.description }}</p>\r\n      }\r\n      @if (item.action; as action) {\r\n        <button\r\n          mfButton\r\n          appearance=\"text\"\r\n          tone=\"primary\"\r\n          size=\"sm\"\r\n          type=\"button\"\r\n          class=\"-ms-2 mt-1.5\"\r\n          (click)=\"onAction(item)\"\r\n        >\r\n          {{ action.label }}\r\n        </button>\r\n      }\r\n    </div>\r\n\r\n    <button\r\n      mfButton\r\n      appearance=\"ghost\"\r\n      tone=\"neutral\"\r\n      size=\"icon\"\r\n      shape=\"square\"\r\n      type=\"button\"\r\n      class=\"-mt-1.5 -me-1.5\"\r\n      [attr.aria-label]=\"effectiveDismissLabel() + ': ' + item.title\"\r\n      (click)=\"toasts.dismiss(item.id)\"\r\n    >\r\n      <span mfIcon [size]=\"16\">close</span>\r\n    </button>\r\n\r\n    @if (item.duration > 0 && !item.loading && !item.leaving) {\r\n      <span\r\n        aria-hidden=\"true\"\r\n        [class]=\"countdownClassFor(item.type)\"\r\n        [style.--mf-toast-duration.ms]=\"item.duration\"\r\n        [style.animation-play-state]=\"item.paused ? 'paused' : 'running'\"\r\n      ></span>\r\n    }\r\n  </div>\r\n}\r\n", dependencies: [{ kind: "directive", type: Icon, selector: "span[mfIcon]", inputs: ["size", "filled"] }, { kind: "component", type: Button, selector: "button[mfButton], a[mfButton]", inputs: ["tone", "appearance", "size", "shape", "type", "loading", "iconStart", "iconEnd"], exportAs: ["mfButton"] }, { kind: "component", type: Spinner, selector: "mf-spinner", inputs: ["size", "tone", "ariaLabel"], exportAs: ["mfSpinner"] }] });
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.7", ngImport: i0, type: ToastHost, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.1.7", type: ToastHost, isStandalone: true, selector: "mf-toast-host", inputs: { dismissLabel: { classPropertyName: "dismissLabel", publicName: "dismissLabel", isSignal: true, isRequired: false, transformFunction: null }, position: { classPropertyName: "position", publicName: "position", isSignal: true, isRequired: false, transformFunction: null }, limit: { classPropertyName: "limit", publicName: "limit", isSignal: true, isRequired: false, transformFunction: null } }, host: { properties: { "class": "hostClasses()" } }, ngImport: i0, template: "@for (item of toasts.items(); track item.id) {\r\n  <!--\r\n    role: hata/uyar\u0131 `alert` (assertive), ba\u015Far\u0131/bilgi `status` (polite) \u2014\r\n    her bildirimin ekran okuyucuyu KESMES\u0130 gereksiz ve rahats\u0131z edici.\r\n    \u00DCzerine gelince / i\u00E7ine odaklan\u0131nca geri say\u0131m durur (WCAG 2.2.1).\r\n  -->\r\n  <div\r\n    data-mf-toast\r\n    [attr.role]=\"item.type === 'danger' || item.type === 'warning' ? 'alert' : 'status'\"\r\n    [attr.aria-busy]=\"item.loading || null\"\r\n    [class]=\"cardClassFor(item)\"\r\n    (mouseenter)=\"toasts.pause(item.id)\"\r\n    (mouseleave)=\"toasts.resume(item.id)\"\r\n    (focusin)=\"toasts.pause(item.id)\"\r\n    (focusout)=\"toasts.resume(item.id)\"\r\n  >\r\n    <div\r\n      [class]=\"\r\n        'flex h-8 w-8 shrink-0 items-center justify-center rounded-md ' + chipBgFor(item.type)\r\n      \"\r\n    >\r\n      @if (item.loading) {\r\n        <span aria-hidden=\"true\" class=\"inline-flex text-fg-muted\">\r\n          <mf-spinner size=\"sm\" />\r\n        </span>\r\n      } @else {\r\n        <span\r\n          mfIcon\r\n          [size]=\"16\"\r\n          [filled]=\"true\"\r\n          class=\"animate-pop\"\r\n          [class.text-success]=\"item.type === 'success'\"\r\n          [class.text-danger]=\"item.type === 'danger'\"\r\n          [class.text-warning]=\"item.type === 'warning'\"\r\n          [class.text-info]=\"item.type === 'info'\"\r\n        >\r\n          {{ iconFor(item.type) }}\r\n        </span>\r\n      }\r\n    </div>\r\n\r\n    <div class=\"min-w-0 flex-1\">\r\n      <p class=\"text-sm font-semibold text-fg\">{{ item.title }}</p>\r\n      @if (item.description) {\r\n        <p class=\"mt-0.5 text-sm whitespace-pre-line text-fg-muted\">{{ item.description }}</p>\r\n      }\r\n      @if (item.action; as action) {\r\n        <button\r\n          mfButton\r\n          appearance=\"text\"\r\n          tone=\"primary\"\r\n          size=\"sm\"\r\n          type=\"button\"\r\n          class=\"-ms-2 mt-1.5\"\r\n          (click)=\"onAction(item)\"\r\n        >\r\n          {{ action.label }}\r\n        </button>\r\n      }\r\n    </div>\r\n\r\n    <button\r\n      mfButton\r\n      appearance=\"ghost\"\r\n      tone=\"neutral\"\r\n      size=\"icon\"\r\n      shape=\"square\"\r\n      type=\"button\"\r\n      class=\"-mt-1.5 -me-1.5\"\r\n      [attr.aria-label]=\"effectiveDismissLabel() + ': ' + item.title\"\r\n      (click)=\"toasts.dismiss(item.id)\"\r\n    >\r\n      <span mfIcon [size]=\"16\">close</span>\r\n    </button>\r\n\r\n    @if (item.duration > 0 && !item.loading && !item.leaving) {\r\n      <span\r\n        aria-hidden=\"true\"\r\n        [class]=\"countdownClassFor(item.type)\"\r\n        [style.--mf-toast-duration.ms]=\"item.duration\"\r\n        [style.animation-play-state]=\"item.paused ? 'paused' : 'running'\"\r\n      ></span>\r\n    }\r\n  </div>\r\n}\r\n", dependencies: [{ kind: "directive", type: Icon, selector: "span[mfIcon]", inputs: ["size", "filled"] }, { kind: "component", type: Button, selector: "button[mfButton], a[mfButton]", inputs: ["tone", "appearance", "size", "shape", "type", "loading", "iconStart", "iconEnd"], exportAs: ["mfButton"] }, { kind: "component", type: Spinner, selector: "mf-spinner", inputs: ["size", "tone", "ariaLabel"], exportAs: ["mfSpinner"] }] });
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.6", ngImport: i0, type: ToastHost, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.7", ngImport: i0, type: ToastHost, decorators: [{
             type: Component,
             args: [{ selector: 'mf-toast-host', imports: [Icon, Button, Spinner], host: { '[class]': 'hostClasses()' }, template: "@for (item of toasts.items(); track item.id) {\r\n  <!--\r\n    role: hata/uyar\u0131 `alert` (assertive), ba\u015Far\u0131/bilgi `status` (polite) \u2014\r\n    her bildirimin ekran okuyucuyu KESMES\u0130 gereksiz ve rahats\u0131z edici.\r\n    \u00DCzerine gelince / i\u00E7ine odaklan\u0131nca geri say\u0131m durur (WCAG 2.2.1).\r\n  -->\r\n  <div\r\n    data-mf-toast\r\n    [attr.role]=\"item.type === 'danger' || item.type === 'warning' ? 'alert' : 'status'\"\r\n    [attr.aria-busy]=\"item.loading || null\"\r\n    [class]=\"cardClassFor(item)\"\r\n    (mouseenter)=\"toasts.pause(item.id)\"\r\n    (mouseleave)=\"toasts.resume(item.id)\"\r\n    (focusin)=\"toasts.pause(item.id)\"\r\n    (focusout)=\"toasts.resume(item.id)\"\r\n  >\r\n    <div\r\n      [class]=\"\r\n        'flex h-8 w-8 shrink-0 items-center justify-center rounded-md ' + chipBgFor(item.type)\r\n      \"\r\n    >\r\n      @if (item.loading) {\r\n        <span aria-hidden=\"true\" class=\"inline-flex text-fg-muted\">\r\n          <mf-spinner size=\"sm\" />\r\n        </span>\r\n      } @else {\r\n        <span\r\n          mfIcon\r\n          [size]=\"16\"\r\n          [filled]=\"true\"\r\n          class=\"animate-pop\"\r\n          [class.text-success]=\"item.type === 'success'\"\r\n          [class.text-danger]=\"item.type === 'danger'\"\r\n          [class.text-warning]=\"item.type === 'warning'\"\r\n          [class.text-info]=\"item.type === 'info'\"\r\n        >\r\n          {{ iconFor(item.type) }}\r\n        </span>\r\n      }\r\n    </div>\r\n\r\n    <div class=\"min-w-0 flex-1\">\r\n      <p class=\"text-sm font-semibold text-fg\">{{ item.title }}</p>\r\n      @if (item.description) {\r\n        <p class=\"mt-0.5 text-sm whitespace-pre-line text-fg-muted\">{{ item.description }}</p>\r\n      }\r\n      @if (item.action; as action) {\r\n        <button\r\n          mfButton\r\n          appearance=\"text\"\r\n          tone=\"primary\"\r\n          size=\"sm\"\r\n          type=\"button\"\r\n          class=\"-ms-2 mt-1.5\"\r\n          (click)=\"onAction(item)\"\r\n        >\r\n          {{ action.label }}\r\n        </button>\r\n      }\r\n    </div>\r\n\r\n    <button\r\n      mfButton\r\n      appearance=\"ghost\"\r\n      tone=\"neutral\"\r\n      size=\"icon\"\r\n      shape=\"square\"\r\n      type=\"button\"\r\n      class=\"-mt-1.5 -me-1.5\"\r\n      [attr.aria-label]=\"effectiveDismissLabel() + ': ' + item.title\"\r\n      (click)=\"toasts.dismiss(item.id)\"\r\n    >\r\n      <span mfIcon [size]=\"16\">close</span>\r\n    </button>\r\n\r\n    @if (item.duration > 0 && !item.loading && !item.leaving) {\r\n      <span\r\n        aria-hidden=\"true\"\r\n        [class]=\"countdownClassFor(item.type)\"\r\n        [style.--mf-toast-duration.ms]=\"item.duration\"\r\n        [style.animation-play-state]=\"item.paused ? 'paused' : 'running'\"\r\n      ></span>\r\n    }\r\n  </div>\r\n}\r\n" }]
         }], ctorParameters: () => [], propDecorators: { dismissLabel: [{ type: i0.Input, args: [{ isSignal: true, alias: "dismissLabel", required: false }] }], position: [{ type: i0.Input, args: [{ isSignal: true, alias: "position", required: false }] }], limit: [{ type: i0.Input, args: [{ isSignal: true, alias: "limit", required: false }] }] } });

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

@@ -53,10 +53,10 @@ class Toggle {
         iconOnly: this.iconOnly(),
     })), /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "classes" }] : /* istanbul ignore next */ []));
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.6", ngImport: i0, type: Toggle, deps: [], target: i0.ɵɵFactoryTarget.Directive });
-    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "22.1.6", type: Toggle, isStandalone: true, selector: "button[mfToggle]", inputs: { pressed: { classPropertyName: "pressed", publicName: "pressed", isSignal: true, isRequired: false, transformFunction: null }, size: { classPropertyName: "size", publicName: "size", isSignal: true, isRequired: false, transformFunction: null }, appearance: { classPropertyName: "appearance", publicName: "appearance", isSignal: true, isRequired: false, transformFunction: null }, iconOnly: { classPropertyName: "iconOnly", publicName: "iconOnly", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { pressed: "pressedChange" }, host: { attributes: { "type": "button" }, listeners: { "click": "pressed.set(!pressed())" }, properties: { "attr.aria-pressed": "pressed()", "class": "classes()" } }, exportAs: ["mfToggle"], ngImport: i0 });
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.7", ngImport: i0, type: Toggle, deps: [], target: i0.ɵɵFactoryTarget.Directive });
+    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "22.1.7", type: Toggle, isStandalone: true, selector: "button[mfToggle]", inputs: { pressed: { classPropertyName: "pressed", publicName: "pressed", isSignal: true, isRequired: false, transformFunction: null }, size: { classPropertyName: "size", publicName: "size", isSignal: true, isRequired: false, transformFunction: null }, appearance: { classPropertyName: "appearance", publicName: "appearance", isSignal: true, isRequired: false, transformFunction: null }, iconOnly: { classPropertyName: "iconOnly", publicName: "iconOnly", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { pressed: "pressedChange" }, host: { attributes: { "type": "button" }, listeners: { "click": "pressed.set(!pressed())" }, properties: { "attr.aria-pressed": "pressed()", "class": "classes()" } }, exportAs: ["mfToggle"], ngImport: i0 });
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.6", ngImport: i0, type: Toggle, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.7", ngImport: i0, type: Toggle, decorators: [{
             type: Directive,
             args: [{
                     selector: 'button[mfToggle]',
@@ -94,10 +94,10 @@ class ToggleGroupItem {
         iconOnly: this.iconOnly(),
     })), /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "classes" }] : /* istanbul ignore next */ []));
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.6", ngImport: i0, type: ToggleGroupItem, deps: [], target: i0.ɵɵFactoryTarget.Directive });
-    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "22.1.6", type: ToggleGroupItem, isStandalone: true, selector: "button[mfToggleGroupItem]", inputs: { value: { classPropertyName: "value", publicName: "value", isSignal: true, isRequired: false, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null }, iconOnly: { classPropertyName: "iconOnly", publicName: "iconOnly", isSignal: true, isRequired: false, transformFunction: null } }, host: { attributes: { "type": "button" }, listeners: { "click": "group.toggle(value())", "keydown": "group.onKeydown($event, this)", "focus": "group.onFocus(this)" }, properties: { "attr.aria-pressed": "pressed()", "attr.tabindex": "group.tabStopValue() === value() ? 0 : -1", "disabled": "isDisabled()", "class": "classes()" } }, exportAs: ["mfToggleGroupItem"], ngImport: i0 });
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.7", ngImport: i0, type: ToggleGroupItem, deps: [], target: i0.ɵɵFactoryTarget.Directive });
+    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "22.1.7", type: ToggleGroupItem, isStandalone: true, selector: "button[mfToggleGroupItem]", inputs: { value: { classPropertyName: "value", publicName: "value", isSignal: true, isRequired: false, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null }, iconOnly: { classPropertyName: "iconOnly", publicName: "iconOnly", isSignal: true, isRequired: false, transformFunction: null } }, host: { attributes: { "type": "button" }, listeners: { "click": "group.toggle(value())", "keydown": "group.onKeydown($event, this)", "focus": "group.onFocus(this)" }, properties: { "attr.aria-pressed": "pressed()", "attr.tabindex": "group.tabStopValue() === value() ? 0 : -1", "disabled": "isDisabled()", "class": "classes()" } }, exportAs: ["mfToggleGroupItem"], ngImport: i0 });
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.6", ngImport: i0, type: ToggleGroupItem, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.7", ngImport: i0, type: ToggleGroupItem, decorators: [{
             type: Directive,
             args: [{
                     selector: 'button[mfToggleGroupItem]',
@@ -217,10 +217,10 @@ class ToggleGroup {
         this.lastFocused.set(target.value());
         target.element.nativeElement.focus();
     }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.6", ngImport: i0, type: ToggleGroup, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.2.0", version: "22.1.6", type: ToggleGroup, isStandalone: true, selector: "mf-toggle-group", inputs: { type: { classPropertyName: "type", publicName: "type", isSignal: true, isRequired: false, transformFunction: null }, value: { classPropertyName: "value", publicName: "value", isSignal: true, isRequired: false, transformFunction: null }, size: { classPropertyName: "size", publicName: "size", isSignal: true, isRequired: false, transformFunction: null }, appearance: { classPropertyName: "appearance", publicName: "appearance", isSignal: true, isRequired: false, transformFunction: null }, orientation: { classPropertyName: "orientation", publicName: "orientation", isSignal: true, isRequired: false, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null }, allowEmpty: { classPropertyName: "allowEmpty", publicName: "allowEmpty", isSignal: true, isRequired: false, transformFunction: null }, ariaLabel: { classPropertyName: "ariaLabel", publicName: "ariaLabel", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { value: "valueChange" }, host: { attributes: { "role": "group" }, properties: { "attr.aria-label": "ariaLabel() || null", "attr.data-orientation": "orientation()", "class": "classes()" } }, providers: [{ provide: MF_TOGGLE_GROUP, useExisting: ToggleGroup }], queries: [{ propertyName: "items", predicate: ToggleGroupItem, descendants: true, isSignal: true }], exportAs: ["mfToggleGroup"], ngImport: i0, template: '<ng-content />', isInline: true });
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.7", ngImport: i0, type: ToggleGroup, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.2.0", version: "22.1.7", type: ToggleGroup, isStandalone: true, selector: "mf-toggle-group", inputs: { type: { classPropertyName: "type", publicName: "type", isSignal: true, isRequired: false, transformFunction: null }, value: { classPropertyName: "value", publicName: "value", isSignal: true, isRequired: false, transformFunction: null }, size: { classPropertyName: "size", publicName: "size", isSignal: true, isRequired: false, transformFunction: null }, appearance: { classPropertyName: "appearance", publicName: "appearance", isSignal: true, isRequired: false, transformFunction: null }, orientation: { classPropertyName: "orientation", publicName: "orientation", isSignal: true, isRequired: false, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null }, allowEmpty: { classPropertyName: "allowEmpty", publicName: "allowEmpty", isSignal: true, isRequired: false, transformFunction: null }, ariaLabel: { classPropertyName: "ariaLabel", publicName: "ariaLabel", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { value: "valueChange" }, host: { attributes: { "role": "group" }, properties: { "attr.aria-label": "ariaLabel() || null", "attr.data-orientation": "orientation()", "class": "classes()" } }, providers: [{ provide: MF_TOGGLE_GROUP, useExisting: ToggleGroup }], queries: [{ propertyName: "items", predicate: ToggleGroupItem, descendants: true, isSignal: true }], exportAs: ["mfToggleGroup"], ngImport: i0, template: '<ng-content />', isInline: true });
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.6", ngImport: i0, type: ToggleGroup, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.7", ngImport: i0, type: ToggleGroup, decorators: [{
             type: Component,
             args: [{
                     selector: 'mf-toggle-group',

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

@@ -19,10 +19,10 @@ import { cva } from 'class-variance-authority';
  * `@angular/aria/toolbar`'ın kendi JSDoc örneği).
  */
 class Toolbar {
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.6", ngImport: i0, type: Toolbar, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "22.1.6", type: Toolbar, isStandalone: true, selector: "mf-toolbar", host: { classAttribute: "flex items-center gap-0.5 rounded-lg border border-hairline bg-surface p-1" }, exportAs: ["mfToolbar"], hostDirectives: [{ directive: i1.Toolbar, inputs: ["orientation", "orientation", "disabled", "disabled", "wrap", "wrap"] }], ngImport: i0, template: '<ng-content />', isInline: true });
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.7", ngImport: i0, type: Toolbar, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "22.1.7", type: Toolbar, isStandalone: true, selector: "mf-toolbar", host: { classAttribute: "flex items-center gap-0.5 rounded-lg border border-hairline bg-surface p-1" }, exportAs: ["mfToolbar"], hostDirectives: [{ directive: i1.Toolbar, inputs: ["orientation", "orientation", "disabled", "disabled", "wrap", "wrap"] }], ngImport: i0, template: '<ng-content />', isInline: true });
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.6", ngImport: i0, type: Toolbar, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.7", ngImport: i0, type: Toolbar, decorators: [{
             type: Component,
             args: [{
                     selector: 'mf-toolbar',
@@ -63,10 +63,10 @@ class ToolbarButton {
     ...(ngDevMode ? [{ debugName: "pressed" }] : /* istanbul ignore next */ []));
     classes = computed(() => cn(toolbarButtonVariants({ active: this.pressed() || this.widget.selected() })), /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "classes" }] : /* istanbul ignore next */ []));
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.6", ngImport: i0, type: ToolbarButton, deps: [], target: i0.ɵɵFactoryTarget.Directive });
-    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "22.1.6", type: ToolbarButton, isStandalone: true, selector: "button[mfToolbarButton]", inputs: { pressed: { classPropertyName: "pressed", publicName: "pressed", isSignal: true, isRequired: false, transformFunction: null } }, host: { properties: { "attr.type": "'button'", "class": "classes()" } }, hostDirectives: [{ directive: i1.ToolbarWidget, inputs: ["value", "value", "disabled", "disabled", "id", "id"] }], ngImport: i0 });
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.7", ngImport: i0, type: ToolbarButton, deps: [], target: i0.ɵɵFactoryTarget.Directive });
+    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "22.1.7", type: ToolbarButton, isStandalone: true, selector: "button[mfToolbarButton]", inputs: { pressed: { classPropertyName: "pressed", publicName: "pressed", isSignal: true, isRequired: false, transformFunction: null } }, host: { properties: { "attr.type": "'button'", "class": "classes()" } }, hostDirectives: [{ directive: i1.ToolbarWidget, inputs: ["value", "value", "disabled", "disabled", "id", "id"] }], ngImport: i0 });
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.6", ngImport: i0, type: ToolbarButton, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.7", ngImport: i0, type: ToolbarButton, decorators: [{
             type: Directive,
             args: [{
                     selector: 'button[mfToolbarButton]',
@@ -77,10 +77,10 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.6", ngImpor
 
 /** `<mf-toolbar-separator />` — `mf-toolbar` içindeki buton gruplarını ayırmak için dikey çizgi. */
 class ToolbarSeparator {
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.6", ngImport: i0, type: ToolbarSeparator, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "22.1.6", type: ToolbarSeparator, isStandalone: true, selector: "mf-toolbar-separator", host: { attributes: { "role": "separator", "aria-orientation": "vertical" }, classAttribute: "mx-1 h-5 w-px shrink-0 self-center bg-border" }, ngImport: i0, template: '', isInline: true });
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.7", ngImport: i0, type: ToolbarSeparator, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "22.1.7", type: ToolbarSeparator, isStandalone: true, selector: "mf-toolbar-separator", host: { attributes: { "role": "separator", "aria-orientation": "vertical" }, classAttribute: "mx-1 h-5 w-px shrink-0 self-center bg-border" }, ngImport: i0, template: '', isInline: true });
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.6", ngImport: i0, type: ToolbarSeparator, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.7", ngImport: i0, type: ToolbarSeparator, decorators: [{
             type: Component,
             args: [{
                     selector: 'mf-toolbar-separator',

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

@@ -156,10 +156,10 @@ class Tooltip {
         else
             host.removeAttribute('aria-describedby');
     }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.6", ngImport: i0, type: Tooltip, deps: [], target: i0.ɵɵFactoryTarget.Directive });
-    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "22.1.6", type: Tooltip, isStandalone: true, selector: "[mfTooltip], [mfTooltipContent]", inputs: { mfTooltip: { classPropertyName: "mfTooltip", publicName: "mfTooltip", isSignal: true, isRequired: false, transformFunction: null }, mfTooltipContent: { classPropertyName: "mfTooltipContent", publicName: "mfTooltipContent", isSignal: true, isRequired: false, transformFunction: null }, tooltipPosition: { classPropertyName: "tooltipPosition", publicName: "tooltipPosition", isSignal: true, isRequired: false, transformFunction: null } }, host: { listeners: { "mouseenter": "scheduleShow()", "mouseleave": "hide()", "focus": "show()", "blur": "hide()", "keydown.escape": "hide()", "click": "hide()" } }, exportAs: ["mfTooltip"], ngImport: i0 });
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.7", ngImport: i0, type: Tooltip, deps: [], target: i0.ɵɵFactoryTarget.Directive });
+    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "22.1.7", type: Tooltip, isStandalone: true, selector: "[mfTooltip], [mfTooltipContent]", inputs: { mfTooltip: { classPropertyName: "mfTooltip", publicName: "mfTooltip", isSignal: true, isRequired: false, transformFunction: null }, mfTooltipContent: { classPropertyName: "mfTooltipContent", publicName: "mfTooltipContent", isSignal: true, isRequired: false, transformFunction: null }, tooltipPosition: { classPropertyName: "tooltipPosition", publicName: "tooltipPosition", isSignal: true, isRequired: false, transformFunction: null } }, host: { listeners: { "mouseenter": "scheduleShow()", "mouseleave": "hide()", "focus": "show()", "blur": "hide()", "keydown.escape": "hide()", "click": "hide()" } }, exportAs: ["mfTooltip"], ngImport: i0 });
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.6", ngImport: i0, type: Tooltip, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.7", ngImport: i0, type: Tooltip, decorators: [{
             type: Directive,
             args: [{
                     selector: '[mfTooltip], [mfTooltipContent]',