@ngstarter-ui/components 1.0.21

package/fesm2022/ngstarter-ui-components-breadcrumbs.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"ngstarter-ui-components-breadcrumbs.mjs","sources":["../../../projects/components/breadcrumbs/src/breadcrumb-item-def.directive.ts","../../../projects/components/breadcrumbs/src/breadcrumb-separator-def.directive.ts","../../../projects/components/breadcrumbs/src/breadcrumb-active-item-def.directive.ts","../../../projects/components/breadcrumbs/src/breadcrumbs/breadcrumbs.ts","../../../projects/components/breadcrumbs/src/breadcrumbs/breadcrumbs.html","../../../projects/components/breadcrumbs/src/breadcrumb-item/breadcrumb-item.ts","../../../projects/components/breadcrumbs/src/breadcrumb-item/breadcrumb-item.html","../../../projects/components/breadcrumbs/src/breadcrumb-separator/breadcrumb-separator.ts","../../../projects/components/breadcrumbs/src/breadcrumb-separator/breadcrumb-separator.html","../../../projects/components/breadcrumbs/src/breadcrumb-title/breadcrumb-title.ts","../../../projects/components/breadcrumbs/src/breadcrumb-title/breadcrumb-title.html","../../../projects/components/breadcrumbs/src/breadcrumbs.store.ts","../../../projects/components/breadcrumbs/src/breadcrumb-item-icon-def.directive.ts","../../../projects/components/breadcrumbs/src/breadcrumb-item-icon.directive.ts","../../../projects/components/breadcrumbs/src/breadcrumb-item-name-def.directive.ts","../../../projects/components/breadcrumbs/src/breadcrumb-item-title-def.directive.ts","../../../projects/components/breadcrumbs/src/breadcrumbs-global/breadcrumbs-global.ts","../../../projects/components/breadcrumbs/src/breadcrumbs-global/breadcrumbs-global.html","../../../projects/components/breadcrumbs/ngstarter-ui-components-breadcrumbs.ts"],"sourcesContent":["import { Directive } from '@angular/core';\n\n@Directive({\n  selector: '[ngsBreadcrumbItemDef]'\n})\nexport class BreadcrumbItemDefDirective {\n\n}\n","import { Directive } from '@angular/core';\n\n@Directive({\n  selector: '[ngsBreadcrumbSeparatorDef]'\n})\nexport class BreadcrumbSeparatorDefDirective {\n\n}\n","import { Directive } from '@angular/core';\n\n@Directive({ selector: '[ngsBreadcrumbActiveItemDef]' })\nexport class BreadcrumbActiveItemDefDirective {\n}\n","import { Component, TemplateRef, input, booleanAttribute, contentChild } from '@angular/core';\nimport { BreadcrumbItemDefDirective } from '../breadcrumb-item-def.directive';\nimport { BreadcrumbSeparatorDefDirective } from '../breadcrumb-separator-def.directive';\nimport { BreadcrumbActiveItemDefDirective } from '../breadcrumb-active-item-def.directive';\nimport { NgTemplateOutlet } from '@angular/common';\n\n@Component({\n  selector: 'ngs-breadcrumbs',\n  exportAs: 'ngsBreadcrumbs',\n  templateUrl: './breadcrumbs.html',\n  styleUrl: './breadcrumbs.scss',\n  host: {\n    'class': 'ngs-breadcrumbs',\n    '[class.last-item-as-link]': 'lastItemAsLink()'\n  },\n  imports: [NgTemplateOutlet]\n})\nexport class Breadcrumbs<T> {\n  itemRef = contentChild.required(BreadcrumbItemDefDirective, {\n    read: TemplateRef\n  });\n  activeItemRef = contentChild.required(BreadcrumbActiveItemDefDirective, {\n    read: TemplateRef\n  });\n  separatorRef = contentChild.required(BreadcrumbSeparatorDefDirective, {\n    read: TemplateRef\n  });\n  dataSource = input<T[]>([]);\n  lastItemAsLink = input(false, {\n    transform: booleanAttribute\n  });\n}\n","@for (breadcrumb of dataSource(); track $index; let last = $last) {\n  @if (!last) {\n    <ng-container *ngTemplateOutlet=\"itemRef(); context: { $implicit: breadcrumb }\"/>\n    <ng-container *ngTemplateOutlet=\"separatorRef()\"/>\n  } @else {\n    <ng-container *ngTemplateOutlet=\"activeItemRef(); context: { $implicit: breadcrumb }\"/>\n  }\n}\n\n<ng-content/>\n","import { Component } from '@angular/core';\n\n@Component({\n  selector: 'ngs-breadcrumb-item,[ngs-breadcrumb-item]',\n  exportAs: 'ngsBreadcrumbItem',\n  templateUrl: './breadcrumb-item.html',\n  styleUrl: './breadcrumb-item.scss',\n  host: {\n    class: 'ngs-breadcrumb-item'\n  }\n})\nexport class BreadcrumbItem {\n}\n","<div class=\"icon\">\n  <ng-content select=\"[ngsBreadcrumbItemIcon]\"/>\n</div>\n<div class=\"content\">\n  <ng-content select=\"ngs-breadcrumb-title\"/>\n  <div class=\"name\">\n    <ng-content/>\n  </div>\n</div>\n","import { Component } from '@angular/core';\n\n@Component({\n  selector: 'ngs-breadcrumb-separator',\n  exportAs: 'ngsBreadcrumbSeparator',\n  templateUrl: './breadcrumb-separator.html',\n  styleUrl: './breadcrumb-separator.scss',\n  host: {\n    class: 'ngs-breadcrumb-separator'\n  }\n})\nexport class BreadcrumbSeparator {\n}\n","<ng-content/>\n","import { Component } from '@angular/core';\n\n@Component({\n  selector: 'ngs-breadcrumb-title',\n  exportAs: 'ngsBreadcrumbTitle',\n  imports: [],\n  templateUrl: './breadcrumb-title.html',\n  styleUrl: './breadcrumb-title.scss',\n  host: {\n    class: 'ngs-breadcrumb-title',\n  }\n})\nexport class BreadcrumbTitle {\n\n}\n","<ng-content/>\n","import { patchState, signalStore, withMethods, withState } from '@ngrx/signals';\nimport { Breadcrumb } from './types';\n\nexport interface BreadcrumbsState {\n  breadcrumbs: Breadcrumb[],\n}\n\nconst initialState: BreadcrumbsState = {\n  breadcrumbs: []\n};\n\nexport const BreadcrumbsStore = signalStore(\n  { providedIn: 'root' },\n  withState(initialState),\n  withMethods((store) => ({\n    setBreadcrumbs(breadcrumbs: Breadcrumb[]): void {\n      patchState(store, {\n        breadcrumbs\n      });\n    }\n  }))\n);\n","import { Directive, inject, TemplateRef } from '@angular/core';\n\n@Directive({\n  selector: '[ngsBreadcrumbItemIconDef]',\n  standalone: true\n})\nexport class BreadcrumbItemIconDefDirective {\n  readonly templateRef = inject(TemplateRef);\n}\n","import { Directive } from '@angular/core';\n\n@Directive({\n  selector: '[ngsBreadcrumbItemIcon]',\n  exportAs: 'ngsBreadcrumbItemIcon',\n  standalone: true,\n  host: {\n    'class': 'ngs-breadcrumb-item-icon'\n  }\n})\nexport class BreadcrumbItemIconDirective {\n}\n","import { Directive, inject, TemplateRef } from '@angular/core';\n\n@Directive({\n  selector: '[ngsBreadcrumbItemNameDef]'\n})\nexport class BreadcrumbItemNameDefDirective {\n  readonly templateRef = inject(TemplateRef);\n}\n","import { Directive, inject, TemplateRef } from '@angular/core';\n\n@Directive({\n  selector: '[ngsBreadcrumbItemTitleDef]'\n})\nexport class BreadcrumbItemTitleDefDirective {\n  readonly templateRef = inject(TemplateRef);\n}\n","import {\n  booleanAttribute,\n  ChangeDetectionStrategy,\n  Component,\n  computed,\n  contentChild,\n  inject,\n  input,\n  TemplateRef\n} from '@angular/core';\nimport { Breadcrumb } from '../types';\nimport { RouterLink } from '@angular/router';\nimport { BreadcrumbItem } from '../breadcrumb-item/breadcrumb-item';\nimport { BreadcrumbSeparator } from '../breadcrumb-separator/breadcrumb-separator';\nimport { BreadcrumbTitle } from '../breadcrumb-title/breadcrumb-title';\nimport { Breadcrumbs } from '../breadcrumbs/breadcrumbs';\nimport { BreadcrumbsStore } from '../breadcrumbs.store';\nimport { BreadcrumbItemIconDefDirective } from '../breadcrumb-item-icon-def.directive';\nimport { BreadcrumbItemIconDirective } from '../breadcrumb-item-icon.directive';\nimport { Icon } from '@ngstarter-ui/components/icon';\nimport { NgTemplateOutlet } from '@angular/common';\nimport {\n  BreadcrumbItemNameDefDirective\n} from '../breadcrumb-item-name-def.directive';\nimport {\n  BreadcrumbItemTitleDefDirective\n} from '../breadcrumb-item-title-def.directive';\n\n@Component({\n  selector: 'ngs-breadcrumbs-global',\n  exportAs: 'ngsBreadcrumbsGlobal',\n  imports: [\n    BreadcrumbItem,\n    BreadcrumbSeparator,\n    BreadcrumbTitle,\n    Breadcrumbs,\n    RouterLink,\n    BreadcrumbItemIconDirective,\n    Icon,\n    NgTemplateOutlet\n  ],\n  templateUrl: './breadcrumbs-global.html',\n  styleUrl: './breadcrumbs-global.scss',\n  changeDetection: ChangeDetectionStrategy.OnPush,\n  host: {\n    'class': 'ngs-breadcrumbs-global',\n    ngSkipHydration: 'true'\n  }\n})\nexport class BreadcrumbsGlobal {\n  private _breadcrumbsStore = inject(BreadcrumbsStore);\n  protected itemIconDef = contentChild(BreadcrumbItemIconDefDirective);\n  protected itemNameDef = contentChild(BreadcrumbItemNameDefDirective);\n  protected itemTitleDef = contentChild(BreadcrumbItemTitleDefDirective);\n\n  breadcrumbs = computed<Breadcrumb[]>(() => {\n    return this._breadcrumbsStore.breadcrumbs();\n  });\n  lastItemAsLink = input(false, {\n    transform: booleanAttribute\n  });\n  separator = input('/');\n\n  get iconTemplateRef(): TemplateRef<any> {\n    return this.itemIconDef()?.templateRef as TemplateRef<any>;\n  }\n\n  get titleTemplateRef(): TemplateRef<any> {\n    return this.itemTitleDef()?.templateRef as TemplateRef<any>;\n  }\n\n  get nameTemplateRef(): TemplateRef<any> {\n    return this.itemNameDef()?.templateRef as TemplateRef<any>;\n  }\n}\n","<ngs-breadcrumbs [lastItemAsLink]=\"lastItemAsLink()\">\n  @for (breadcrumb of breadcrumbs(); track $index; let last = $last) {\n    @switch (breadcrumb.type) {\n      @case ('link') {\n        <a ngs-breadcrumb-item [routerLink]=\"breadcrumb.route\">\n          <ng-container ngsBreadcrumbItemIcon>\n            @if (iconTemplateRef) {\n              <ng-container [ngTemplateOutlet]=\"iconTemplateRef\"\n                            [ngTemplateOutletContext]=\"{ $implicit: breadcrumb }\"/>\n            } @else {\n              @if (breadcrumb.icon) {\n                <ngs-icon name=\"{{ breadcrumb.icon }}\"/>\n              }\n            }\n          </ng-container>\n\n          @if (titleTemplateRef) {\n            <ngs-breadcrumb-title>\n              <ng-container [ngTemplateOutlet]=\"titleTemplateRef\"\n                            [ngTemplateOutletContext]=\"{ $implicit: breadcrumb }\"/>\n            </ngs-breadcrumb-title>\n          } @else {\n            @if (breadcrumb.title) {\n              <ngs-breadcrumb-title>{{ breadcrumb.title }}</ngs-breadcrumb-title>\n            }\n          }\n\n          @if (nameTemplateRef) {\n            <ng-container [ngTemplateOutlet]=\"nameTemplateRef\"\n                          [ngTemplateOutletContext]=\"{ $implicit: breadcrumb }\"/>\n          } @else {\n            @if (breadcrumb.name) {\n              {{ breadcrumb.name }}\n            }\n          }\n        </a>\n      }\n      @default {\n        <ngs-breadcrumb-item>\n          <ng-container ngsBreadcrumbItemIcon>\n            @if (iconTemplateRef) {\n              <ng-container [ngTemplateOutlet]=\"iconTemplateRef\"\n                            [ngTemplateOutletContext]=\"{ $implicit: breadcrumb }\"/>\n            } @else if (breadcrumb.icon) {\n              <ngs-icon name=\"{{ breadcrumb.icon }}\"/>\n            }\n          </ng-container>\n\n          @if (titleTemplateRef) {\n            <ngs-breadcrumb-title>\n              <ng-container [ngTemplateOutlet]=\"titleTemplateRef\"\n                            [ngTemplateOutletContext]=\"{ $implicit: breadcrumb }\"/>\n            </ngs-breadcrumb-title>\n          } @else {\n            @if (breadcrumb.title) {\n              <ngs-breadcrumb-title>{{ breadcrumb.title }}</ngs-breadcrumb-title>\n            }\n          }\n\n          @if (nameTemplateRef) {\n            <ng-container [ngTemplateOutlet]=\"nameTemplateRef\"\n                          [ngTemplateOutletContext]=\"{ $implicit: breadcrumb }\"/>\n          } @else {\n            @if (breadcrumb.name) {\n              {{ breadcrumb.name }}\n            }\n          }\n        </ngs-breadcrumb-item>\n      }\n    }\n\n    @if (!last) {\n      <ngs-breadcrumb-separator>{{ separator() }}</ngs-breadcrumb-separator>\n    }\n  }\n</ngs-breadcrumbs>\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":[],"mappings":"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"}

package/fesm2022/ngstarter-ui-components-button-toggle.mjs

@@ -0,0 +1,175 @@
+import * as i0 from '@angular/core';
+import { contentChildren, forwardRef, input, booleanAttribute, model, output, effect, ChangeDetectionStrategy, Component, inject, ChangeDetectorRef } from '@angular/core';
+import { NG_VALUE_ACCESSOR } from '@angular/forms';
+import { Icon } from '@ngstarter-ui/components/icon';
+
+let nextId = 0;
+class ButtonToggleGroup {
+    _buttonToggles = contentChildren(forwardRef(() => ButtonToggle), { ...(ngDevMode ? { debugName: "_buttonToggles" } : /* istanbul ignore next */ {}), descendants: true });
+    appearance = input('standard', ...(ngDevMode ? [{ debugName: "appearance" }] : /* istanbul ignore next */ []));
+    disabled = input(false, { ...(ngDevMode ? { debugName: "disabled" } : /* istanbul ignore next */ {}), transform: booleanAttribute });
+    multiple = input(false, { ...(ngDevMode ? { debugName: "multiple" } : /* istanbul ignore next */ {}), transform: booleanAttribute });
+    hideSelectionIndicator = input(false, { ...(ngDevMode ? { debugName: "hideSelectionIndicator" } : /* istanbul ignore next */ {}), transform: booleanAttribute });
+    vertical = input(false, { ...(ngDevMode ? { debugName: "vertical" } : /* istanbul ignore next */ {}), transform: booleanAttribute });
+    value = model(undefined, ...(ngDevMode ? [{ debugName: "value" }] : /* istanbul ignore next */ []));
+    change = output();
+    _onChange = () => { };
+    _onTouched = () => { };
+    constructor() {
+        effect(() => {
+            this.value();
+            this._buttonToggles();
+            this._updateSelectedButtonsFromValue();
+        });
+    }
+    ngAfterContentInit() {
+        this._updateSelectedButtonsFromValue();
+    }
+    writeValue(value) {
+        this.value.set(value);
+    }
+    registerOnChange(fn) {
+        this._onChange = fn;
+    }
+    registerOnTouched(fn) {
+        this._onTouched = fn;
+    }
+    setDisabledState(isDisabled) {
+        // Note: If we want to support setDisabledState with input signals,
+        // we might need a separate internal signal or just accept that it won't work well with reactive inputs
+        // but typically CVA's setDisabledState is for the form control to disable the component.
+        // For now, let's use a private signal if we need to combine them.
+    }
+    _emitChangeEvent(value) {
+        this._onChange(value);
+        this.change.emit({ source: this, value });
+    }
+    _updateSelectedButtonsFromValue() {
+        const _buttonToggles = this._buttonToggles();
+        if (_buttonToggles) {
+            _buttonToggles.forEach(toggle => {
+                toggle._setChecked(this._isSelected(toggle.value()));
+            });
+        }
+    }
+    _isSelected(val) {
+        if (this.multiple()) {
+            return Array.isArray(this.value()) && this.value().includes(val);
+        }
+        return this.value() === val;
+    }
+    _onButtonClick(toggle) {
+        if (this.disabled() || toggle.disabled()) {
+            return;
+        }
+        if (this.multiple()) {
+            const currentValue = Array.isArray(this.value()) ? [...this.value()] : [];
+            const index = currentValue.indexOf(toggle.value());
+            if (index !== -1) {
+                currentValue.splice(index, 1);
+            }
+            else {
+                currentValue.push(toggle.value());
+            }
+            this._updateValue(currentValue);
+        }
+        else {
+            this._updateValue(toggle.value());
+        }
+    }
+    _updateValue(newValue) {
+        this.value.set(newValue);
+        this._emitChangeEvent(newValue);
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.4", ngImport: i0, type: ButtonToggleGroup, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.2.0", version: "21.2.4", type: ButtonToggleGroup, isStandalone: true, selector: "ngs-button-toggle-group", inputs: { appearance: { classPropertyName: "appearance", publicName: "appearance", isSignal: true, isRequired: false, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null }, multiple: { classPropertyName: "multiple", publicName: "multiple", isSignal: true, isRequired: false, transformFunction: null }, hideSelectionIndicator: { classPropertyName: "hideSelectionIndicator", publicName: "hideSelectionIndicator", isSignal: true, isRequired: false, transformFunction: null }, vertical: { classPropertyName: "vertical", publicName: "vertical", isSignal: true, isRequired: false, transformFunction: null }, value: { classPropertyName: "value", publicName: "value", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { value: "valueChange", change: "change" }, host: { properties: { "class.ngs-button-toggle-group-vertical": "vertical()", "attr.role": "multiple() ? \"group\" : \"radiogroup\"", "attr.aria-disabled": "disabled()" }, classAttribute: "ngs-button-toggle-group" }, providers: [
+            {
+                provide: NG_VALUE_ACCESSOR,
+                useExisting: forwardRef(() => ButtonToggleGroup),
+                multi: true
+            }
+        ], queries: [{ propertyName: "_buttonToggles", predicate: i0.forwardRef(() => ButtonToggle), descendants: true, isSignal: true }], exportAs: ["ngsButtonToggleGroup"], ngImport: i0, template: "<ng-content />\n", styles: [":host{--ngs-button-toggle-group-border-color: var(--color-surface-container-highest);--ngs-button-toggle-group-bg: var(--color-surface-container);display:inline-flex;flex-direction:row;white-space:nowrap;overflow:hidden;border-radius:var(--ngs-button-toggle-group-border-radius, var(--btn-radius));background:var(--ngs-button-toggle-group-bg);height:var(--btn-height)}:host.ngs-button-toggle-group-vertical{flex-direction:column}:host.ngs-button-toggle-group-vertical ::ng-deep .ngs-button-toggle+.ngs-button-toggle{border-top:1px solid var(--ngs-button-toggle-group-border-color);border-left:none}::ng-deep .ngs-button-toggle+.ngs-button-toggle{border-left:1px solid var(--ngs-button-toggle-group-border-color)}\n/*! tailwindcss v4.2.2 | MIT License | https://tailwindcss.com */\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.4", ngImport: i0, type: ButtonToggleGroup, decorators: [{
+            type: Component,
+            args: [{ selector: 'ngs-button-toggle-group', exportAs: 'ngsButtonToggleGroup', standalone: true, providers: [
+                        {
+                            provide: NG_VALUE_ACCESSOR,
+                            useExisting: forwardRef(() => ButtonToggleGroup),
+                            multi: true
+                        }
+                    ], changeDetection: ChangeDetectionStrategy.OnPush, host: {
+                        'class': 'ngs-button-toggle-group',
+                        '[class.ngs-button-toggle-group-vertical]': 'vertical()',
+                        '[attr.role]': 'multiple() ? "group" : "radiogroup"',
+                        '[attr.aria-disabled]': 'disabled()',
+                    }, template: "<ng-content />\n", styles: [":host{--ngs-button-toggle-group-border-color: var(--color-surface-container-highest);--ngs-button-toggle-group-bg: var(--color-surface-container);display:inline-flex;flex-direction:row;white-space:nowrap;overflow:hidden;border-radius:var(--ngs-button-toggle-group-border-radius, var(--btn-radius));background:var(--ngs-button-toggle-group-bg);height:var(--btn-height)}:host.ngs-button-toggle-group-vertical{flex-direction:column}:host.ngs-button-toggle-group-vertical ::ng-deep .ngs-button-toggle+.ngs-button-toggle{border-top:1px solid var(--ngs-button-toggle-group-border-color);border-left:none}::ng-deep .ngs-button-toggle+.ngs-button-toggle{border-left:1px solid var(--ngs-button-toggle-group-border-color)}\n/*! tailwindcss v4.2.2 | MIT License | https://tailwindcss.com */\n"] }]
+        }], ctorParameters: () => [], propDecorators: { _buttonToggles: [{ type: i0.ContentChildren, args: [forwardRef(() => ButtonToggle), { ...{ descendants: true }, isSignal: true }] }], appearance: [{ type: i0.Input, args: [{ isSignal: true, alias: "appearance", required: false }] }], disabled: [{ type: i0.Input, args: [{ isSignal: true, alias: "disabled", required: false }] }], multiple: [{ type: i0.Input, args: [{ isSignal: true, alias: "multiple", required: false }] }], hideSelectionIndicator: [{ type: i0.Input, args: [{ isSignal: true, alias: "hideSelectionIndicator", required: false }] }], vertical: [{ type: i0.Input, args: [{ isSignal: true, alias: "vertical", required: false }] }], value: [{ type: i0.Input, args: [{ isSignal: true, alias: "value", required: false }] }, { type: i0.Output, args: ["valueChange"] }], change: [{ type: i0.Output, args: ["change"] }] } });
+class ButtonToggle {
+    _id = `ngs-button-toggle-${nextId++}`;
+    id = input(`ngs-button-toggle-${nextId++}`, ...(ngDevMode ? [{ debugName: "id" }] : /* istanbul ignore next */ []));
+    value = input(undefined, ...(ngDevMode ? [{ debugName: "value" }] : /* istanbul ignore next */ []));
+    name = input(undefined, ...(ngDevMode ? [{ debugName: "name" }] : /* istanbul ignore next */ []));
+    checked = input(false, { ...(ngDevMode ? { debugName: "checked" } : /* istanbul ignore next */ {}), transform: booleanAttribute });
+    disabled = input(false, { ...(ngDevMode ? { debugName: "disabled" } : /* istanbul ignore next */ {}), transform: booleanAttribute });
+    _internalChecked = false;
+    get isChecked() {
+        return this.checked() || this._internalChecked;
+    }
+    _setChecked(value) {
+        this._internalChecked = value;
+        this._changeDetectorRef.markForCheck();
+    }
+    change = output();
+    buttonToggleGroup = inject(forwardRef(() => ButtonToggleGroup), { optional: true });
+    _changeDetectorRef = inject(ChangeDetectorRef);
+    get isDisabled() {
+        return this.disabled() || (this.buttonToggleGroup && this.buttonToggleGroup.disabled());
+    }
+    get _shouldShowSelectionIndicator() {
+        if (!this.isChecked) {
+            return false;
+        }
+        if (!this.buttonToggleGroup) {
+            return false;
+        }
+        return !this.buttonToggleGroup.hideSelectionIndicator();
+    }
+    ngOnInit() {
+        if (this.buttonToggleGroup && this.buttonToggleGroup.value() === this.value()) {
+            this._setChecked(true);
+        }
+    }
+    _onButtonClick() {
+        if (this.buttonToggleGroup) {
+            this.buttonToggleGroup._onButtonClick(this);
+        }
+        else {
+            this._setChecked(!this.isChecked);
+            this.change.emit({ source: this, value: this.value() });
+        }
+    }
+    _markForCheck() {
+        this._changeDetectorRef.markForCheck();
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.4", ngImport: i0, type: ButtonToggle, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.4", type: ButtonToggle, isStandalone: true, selector: "ngs-button-toggle", inputs: { id: { classPropertyName: "id", publicName: "id", isSignal: true, isRequired: false, transformFunction: null }, value: { classPropertyName: "value", publicName: "value", isSignal: true, isRequired: false, transformFunction: null }, name: { classPropertyName: "name", publicName: "name", isSignal: true, isRequired: false, transformFunction: null }, checked: { classPropertyName: "checked", publicName: "checked", isSignal: true, isRequired: false, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { change: "change" }, host: { properties: { "class.ngs-button-toggle-checked": "isChecked", "class.ngs-button-toggle-disabled": "isDisabled", "attr.id": "id()" }, classAttribute: "ngs-button-toggle" }, ngImport: i0, template: "<button type=\"button\"\n        class=\"ngs-button-toggle-button\"\n        [attr.id]=\"id() + '-button'\"\n        [disabled]=\"isDisabled\"\n        [attr.name]=\"name()\"\n        [attr.aria-pressed]=\"isChecked\"\n        (click)=\"_onButtonClick()\">\n  @if (_shouldShowSelectionIndicator) {\n    <ngs-icon name=\"fluent:checkmark-24-regular\" class=\"ngs-button-toggle-selection-indicator size-5\"/>\n  }\n  <span class=\"ngs-button-toggle-label-content\">\n    <ng-content />\n  </span>\n</button>\n", styles: [":host{--ngs-button-toggle-text-color: var(--color-on-surface-variant);--ngs-button-toggle-hover-bg-color: var(--color-surface-container-high);--ngs-button-toggle-checked-bg-color: var(--color-surface-container-highest);--ngs-button-toggle-checked-text-color: var(--color-on-surface);--ngs-button-toggle-selection-indicator-color: var(--color-primary);display:inline-block;position:relative;box-sizing:border-box;-webkit-tap-highlight-color:transparent}:host .ngs-button-toggle-button{display:flex;align-items:center;justify-content:center;padding:0 16px;cursor:pointer;transition-property:color,background-color,border-color,text-decoration-color,fill,stroke;transition-timing-function:cubic-bezier(.4,0,.2,1);transition-duration:.2s;font-size:.875rem;line-height:1.25rem;font-weight:500;border:none;background:none;color:var(--ngs-button-toggle-text-color);width:100%;height:100%;outline:none}:host .ngs-button-toggle-button:hover:not(:disabled){background:var(--ngs-button-toggle-hover-bg-color)}:host .ngs-button-toggle-button:disabled{cursor:not-allowed;color:var(--color-on-surface);background:transparent}@supports (color: color-mix(in lab,red,red)){:host .ngs-button-toggle-button:disabled{color:color-mix(in srgb,var(--color-on-surface),transparent 62%)}}:host .ngs-button-toggle-button:disabled .ngs-button-toggle-selection-indicator{color:var(--color-on-surface)}@supports (color: color-mix(in lab,red,red)){:host .ngs-button-toggle-button:disabled .ngs-button-toggle-selection-indicator{color:color-mix(in srgb,var(--color-on-surface),transparent 62%)}}:host .ngs-button-toggle-button .ngs-button-toggle-selection-indicator{display:inline-flex;align-items:center;justify-content:center;font-size:1rem;color:var(--ngs-button-toggle-selection-indicator-color);margin-right:8px;animation:ngs-button-toggle-indicator-fade-in .2s cubic-bezier(0,0,.2,1)}:host.ngs-button-toggle-checked .ngs-button-toggle-button{background:var(--ngs-button-toggle-checked-bg-color);color:var(--ngs-button-toggle-checked-text-color)}:host.ngs-button-toggle-checked .ngs-button-toggle-button:disabled{background:var(--color-on-surface);color:var(--color-on-surface)}@supports (color: color-mix(in lab,red,red)){:host.ngs-button-toggle-checked .ngs-button-toggle-button:disabled{background:color-mix(in srgb,var(--color-on-surface),transparent 88%)}}@supports (color: color-mix(in lab,red,red)){:host.ngs-button-toggle-checked .ngs-button-toggle-button:disabled{color:color-mix(in srgb,var(--color-on-surface),transparent 62%)}}:host .ngs-button-toggle-label-content{line-height:1}@keyframes ngs-button-toggle-indicator-fade-in{0%{opacity:0;transform:scale(.5)}to{opacity:1;transform:scale(1)}}\n/*! tailwindcss v4.2.2 | MIT License | https://tailwindcss.com */\n"], dependencies: [{ kind: "component", type: Icon, selector: "ngs-icon", inputs: ["name"], exportAs: ["ngsIcon"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.4", ngImport: i0, type: ButtonToggle, decorators: [{
+            type: Component,
+            args: [{ selector: 'ngs-button-toggle', host: {
+                        '[class.ngs-button-toggle-checked]': 'isChecked',
+                        '[class.ngs-button-toggle-disabled]': 'isDisabled',
+                        '[attr.id]': 'id()',
+                        'class': 'ngs-button-toggle',
+                    }, standalone: true, imports: [
+                        Icon
+                    ], changeDetection: ChangeDetectionStrategy.OnPush, template: "<button type=\"button\"\n        class=\"ngs-button-toggle-button\"\n        [attr.id]=\"id() + '-button'\"\n        [disabled]=\"isDisabled\"\n        [attr.name]=\"name()\"\n        [attr.aria-pressed]=\"isChecked\"\n        (click)=\"_onButtonClick()\">\n  @if (_shouldShowSelectionIndicator) {\n    <ngs-icon name=\"fluent:checkmark-24-regular\" class=\"ngs-button-toggle-selection-indicator size-5\"/>\n  }\n  <span class=\"ngs-button-toggle-label-content\">\n    <ng-content />\n  </span>\n</button>\n", styles: [":host{--ngs-button-toggle-text-color: var(--color-on-surface-variant);--ngs-button-toggle-hover-bg-color: var(--color-surface-container-high);--ngs-button-toggle-checked-bg-color: var(--color-surface-container-highest);--ngs-button-toggle-checked-text-color: var(--color-on-surface);--ngs-button-toggle-selection-indicator-color: var(--color-primary);display:inline-block;position:relative;box-sizing:border-box;-webkit-tap-highlight-color:transparent}:host .ngs-button-toggle-button{display:flex;align-items:center;justify-content:center;padding:0 16px;cursor:pointer;transition-property:color,background-color,border-color,text-decoration-color,fill,stroke;transition-timing-function:cubic-bezier(.4,0,.2,1);transition-duration:.2s;font-size:.875rem;line-height:1.25rem;font-weight:500;border:none;background:none;color:var(--ngs-button-toggle-text-color);width:100%;height:100%;outline:none}:host .ngs-button-toggle-button:hover:not(:disabled){background:var(--ngs-button-toggle-hover-bg-color)}:host .ngs-button-toggle-button:disabled{cursor:not-allowed;color:var(--color-on-surface);background:transparent}@supports (color: color-mix(in lab,red,red)){:host .ngs-button-toggle-button:disabled{color:color-mix(in srgb,var(--color-on-surface),transparent 62%)}}:host .ngs-button-toggle-button:disabled .ngs-button-toggle-selection-indicator{color:var(--color-on-surface)}@supports (color: color-mix(in lab,red,red)){:host .ngs-button-toggle-button:disabled .ngs-button-toggle-selection-indicator{color:color-mix(in srgb,var(--color-on-surface),transparent 62%)}}:host .ngs-button-toggle-button .ngs-button-toggle-selection-indicator{display:inline-flex;align-items:center;justify-content:center;font-size:1rem;color:var(--ngs-button-toggle-selection-indicator-color);margin-right:8px;animation:ngs-button-toggle-indicator-fade-in .2s cubic-bezier(0,0,.2,1)}:host.ngs-button-toggle-checked .ngs-button-toggle-button{background:var(--ngs-button-toggle-checked-bg-color);color:var(--ngs-button-toggle-checked-text-color)}:host.ngs-button-toggle-checked .ngs-button-toggle-button:disabled{background:var(--color-on-surface);color:var(--color-on-surface)}@supports (color: color-mix(in lab,red,red)){:host.ngs-button-toggle-checked .ngs-button-toggle-button:disabled{background:color-mix(in srgb,var(--color-on-surface),transparent 88%)}}@supports (color: color-mix(in lab,red,red)){:host.ngs-button-toggle-checked .ngs-button-toggle-button:disabled{color:color-mix(in srgb,var(--color-on-surface),transparent 62%)}}:host .ngs-button-toggle-label-content{line-height:1}@keyframes ngs-button-toggle-indicator-fade-in{0%{opacity:0;transform:scale(.5)}to{opacity:1;transform:scale(1)}}\n/*! tailwindcss v4.2.2 | MIT License | https://tailwindcss.com */\n"] }]
+        }], propDecorators: { id: [{ type: i0.Input, args: [{ isSignal: true, alias: "id", required: false }] }], value: [{ type: i0.Input, args: [{ isSignal: true, alias: "value", required: false }] }], name: [{ type: i0.Input, args: [{ isSignal: true, alias: "name", required: false }] }], checked: [{ type: i0.Input, args: [{ isSignal: true, alias: "checked", required: false }] }], disabled: [{ type: i0.Input, args: [{ isSignal: true, alias: "disabled", required: false }] }], change: [{ type: i0.Output, args: ["change"] }] } });
+
+/**
+ * Generated bundle index. Do not edit.
+ */
+
+export { ButtonToggle, ButtonToggleGroup };
+//# sourceMappingURL=ngstarter-ui-components-button-toggle.mjs.map

package/fesm2022/ngstarter-ui-components-button-toggle.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"ngstarter-ui-components-button-toggle.mjs","sources":["../../../projects/components/button-toggle/src/button-toggle/button-toggle.ts","../../../projects/components/button-toggle/src/button-toggle-group/button-toggle-group.html","../../../projects/components/button-toggle/src/button-toggle/button-toggle.html","../../../projects/components/button-toggle/ngstarter-ui-components-button-toggle.ts"],"sourcesContent":["import {\n  AfterContentInit,\n  ChangeDetectionStrategy,\n  ChangeDetectorRef,\n  Component,\n  forwardRef,\n  inject,\n  input,\n  OnInit,\n  booleanAttribute,\n  output,\n  model,\n  contentChildren,\n  effect\n} from '@angular/core';\nimport { ControlValueAccessor, NG_VALUE_ACCESSOR } from '@angular/forms';\nimport { Icon } from '@ngstarter-ui/components/icon';\n\nlet nextId = 0;\n\nexport type ButtonToggleAppearance = 'standard' | 'legacy';\n\n@Component({\n  selector: 'ngs-button-toggle-group',\n  exportAs: 'ngsButtonToggleGroup',\n  templateUrl: '../button-toggle-group/button-toggle-group.html',\n  styleUrl: '../button-toggle-group/button-toggle-group.scss',\n  standalone: true,\n  providers: [\n    {\n      provide: NG_VALUE_ACCESSOR,\n      useExisting: forwardRef(() => ButtonToggleGroup),\n      multi: true\n    }\n  ],\n  changeDetection: ChangeDetectionStrategy.OnPush,\n  host: {\n    'class': 'ngs-button-toggle-group',\n    '[class.ngs-button-toggle-group-vertical]': 'vertical()',\n    '[attr.role]': 'multiple() ? \"group\" : \"radiogroup\"',\n    '[attr.aria-disabled]': 'disabled()',\n  },\n})\nexport class ButtonToggleGroup implements ControlValueAccessor, AfterContentInit {\n  readonly _buttonToggles = contentChildren(forwardRef(() => ButtonToggle), { descendants: true });\n\n  appearance = input<ButtonToggleAppearance>('standard');\n  disabled = input(false, { transform: booleanAttribute });\n  multiple = input(false, { transform: booleanAttribute });\n  hideSelectionIndicator = input(false, { transform: booleanAttribute });\n  vertical = input(false, { transform: booleanAttribute });\n  value = model<any>(undefined);\n\n  readonly change = output<any>();\n\n  _onChange: (value: any) => void = () => {};\n  _onTouched: () => void = () => {};\n\n  constructor() {\n    effect(() => {\n      this.value();\n      this._buttonToggles();\n      this._updateSelectedButtonsFromValue();\n    });\n  }\n\n  ngAfterContentInit() {\n    this._updateSelectedButtonsFromValue();\n  }\n\n  writeValue(value: any): void {\n    this.value.set(value);\n  }\n\n  registerOnChange(fn: any): void {\n    this._onChange = fn;\n  }\n\n  registerOnTouched(fn: any): void {\n    this._onTouched = fn;\n  }\n\n  setDisabledState?(isDisabled: boolean): void {\n    // Note: If we want to support setDisabledState with input signals,\n    // we might need a separate internal signal or just accept that it won't work well with reactive inputs\n    // but typically CVA's setDisabledState is for the form control to disable the component.\n    // For now, let's use a private signal if we need to combine them.\n  }\n\n  _emitChangeEvent(value: any): void {\n    this._onChange(value);\n    this.change.emit({ source: this, value });\n  }\n\n  private _updateSelectedButtonsFromValue() {\n    const _buttonToggles = this._buttonToggles();\n    if (_buttonToggles) {\n      _buttonToggles.forEach(toggle => {\n        toggle._setChecked(this._isSelected(toggle.value()));\n      });\n    }\n  }\n\n  private _isSelected(val: any): boolean {\n    if (this.multiple()) {\n      return Array.isArray(this.value()) && this.value().includes(val);\n    }\n    return this.value() === val;\n  }\n\n  _onButtonClick(toggle: ButtonToggle) {\n    if (this.disabled() || toggle.disabled()) {\n      return;\n    }\n\n    if (this.multiple()) {\n      const currentValue = Array.isArray(this.value()) ? [...this.value()] : [];\n      const index = currentValue.indexOf(toggle.value());\n\n      if (index !== -1) {\n        currentValue.splice(index, 1);\n      } else {\n        currentValue.push(toggle.value());\n      }\n      this._updateValue(currentValue);\n    } else {\n      this._updateValue(toggle.value());\n    }\n  }\n\n  private _updateValue(newValue: any) {\n    this.value.set(newValue);\n    this._emitChangeEvent(newValue);\n  }\n}\n\n@Component({\n  selector: 'ngs-button-toggle',\n  templateUrl: './button-toggle.html',\n  styleUrl: './button-toggle.scss',\n  host: {\n    '[class.ngs-button-toggle-checked]': 'isChecked',\n    '[class.ngs-button-toggle-disabled]': 'isDisabled',\n    '[attr.id]': 'id()',\n    'class': 'ngs-button-toggle',\n  },\n  standalone: true,\n  imports: [\n    Icon\n  ],\n  changeDetection: ChangeDetectionStrategy.OnPush,\n})\nexport class ButtonToggle implements OnInit {\n  private _id = `ngs-button-toggle-${nextId++}`;\n\n  id = input<string>(`ngs-button-toggle-${nextId++}`);\n  value = input<any>(undefined);\n  name = input<string | undefined>(undefined);\n  checked = input(false, { transform: booleanAttribute });\n  disabled = input(false, { transform: booleanAttribute });\n  private _internalChecked = false;\n  get isChecked(): boolean {\n    return this.checked() || this._internalChecked;\n  }\n  _setChecked(value: boolean) {\n    this._internalChecked = value;\n    this._changeDetectorRef.markForCheck();\n  }\n\n  readonly change = output<any>();\n\n  public buttonToggleGroup = inject(forwardRef(() => ButtonToggleGroup), { optional: true });\n  private _changeDetectorRef = inject(ChangeDetectorRef);\n\n  get isDisabled(): boolean {\n    return this.disabled() || (this.buttonToggleGroup && this.buttonToggleGroup.disabled());\n  }\n\n  get _shouldShowSelectionIndicator(): boolean {\n    if (!this.isChecked) {\n      return false;\n    }\n\n    if (!this.buttonToggleGroup) {\n      return false;\n    }\n\n    return !this.buttonToggleGroup.hideSelectionIndicator();\n  }\n\n  ngOnInit() {\n    if (this.buttonToggleGroup && this.buttonToggleGroup.value() === this.value()) {\n      this._setChecked(true);\n    }\n  }\n\n  _onButtonClick() {\n    if (this.buttonToggleGroup) {\n      this.buttonToggleGroup._onButtonClick(this);\n    } else {\n      this._setChecked(!this.isChecked);\n      this.change.emit({ source: this, value: this.value() });\n    }\n  }\n\n  _markForCheck() {\n    this._changeDetectorRef.markForCheck();\n  }\n}\n","<ng-content />\n","<button type=\"button\"\n        class=\"ngs-button-toggle-button\"\n        [attr.id]=\"id() + '-button'\"\n        [disabled]=\"isDisabled\"\n        [attr.name]=\"name()\"\n        [attr.aria-pressed]=\"isChecked\"\n        (click)=\"_onButtonClick()\">\n  @if (_shouldShowSelectionIndicator) {\n    <ngs-icon name=\"fluent:checkmark-24-regular\" class=\"ngs-button-toggle-selection-indicator size-5\"/>\n  }\n  <span class=\"ngs-button-toggle-label-content\">\n    <ng-content />\n  </span>\n</button>\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":[],"mappings":"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"}

package/fesm2022/ngstarter-ui-components-button.mjs

@@ -0,0 +1,70 @@
+import * as i0 from '@angular/core';
+import { inject, ElementRef, input, booleanAttribute, effect, ChangeDetectionStrategy, Component } from '@angular/core';
+import { Ripple } from '@ngstarter-ui/components/core';
+
+class Button {
+    elementRef = inject(ElementRef);
+    _ripple = inject(Ripple, { optional: true });
+    ngsButton = input('text', ...(ngDevMode ? [{ debugName: "ngsButton" }] : /* istanbul ignore next */ []));
+    ngsIconButton = input(undefined, { ...(ngDevMode ? { debugName: "ngsIconButton" } : /* istanbul ignore next */ {}), transform: booleanAttribute });
+    loading = input(false, { ...(ngDevMode ? { debugName: "loading" } : /* istanbul ignore next */ {}), transform: booleanAttribute });
+    disabled = input(false, { ...(ngDevMode ? { debugName: "disabled" } : /* istanbul ignore next */ {}), transform: booleanAttribute });
+    disabledInteractive = input(false, { ...(ngDevMode ? { debugName: "disabledInteractive" } : /* istanbul ignore next */ {}), transform: booleanAttribute });
+    disableRipple = input(false, { ...(ngDevMode ? { debugName: "disableRipple" } : /* istanbul ignore next */ {}), transform: booleanAttribute });
+    reverse = input(false, { ...(ngDevMode ? { debugName: "reverse" } : /* istanbul ignore next */ {}), transform: booleanAttribute });
+    fullWidth = input(false, { ...(ngDevMode ? { debugName: "fullWidth" } : /* istanbul ignore next */ {}), transform: booleanAttribute });
+    hideTextOnMobile = input(false, { ...(ngDevMode ? { debugName: "hideTextOnMobile" } : /* istanbul ignore next */ {}), transform: booleanAttribute });
+    constructor() {
+        effect(() => {
+            if (this._ripple) {
+                this._ripple.disabled.set(this.disabled() || this.loading() || this.disableRipple());
+                this._ripple.trigger.set(this.elementRef.nativeElement);
+                this._ripple.centered.set(this.isIconButton);
+            }
+        });
+    }
+    /** Whether the button is an icon button. */
+    get isIconButton() {
+        return this.ngsIconButton() !== undefined;
+    }
+    _haltDisabledEvents(event) {
+        if (this.disabled() || this.loading()) {
+            event.preventDefault();
+            event.stopImmediatePropagation();
+        }
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.4", ngImport: i0, type: Button, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.4", type: Button, isStandalone: true, selector: "\n    button[ngsButton], button[ngsIconButton],\n    a[ngsButton], a[ngsIconButton]\n  ", inputs: { ngsButton: { classPropertyName: "ngsButton", publicName: "ngsButton", isSignal: true, isRequired: false, transformFunction: null }, ngsIconButton: { classPropertyName: "ngsIconButton", publicName: "ngsIconButton", isSignal: true, isRequired: false, transformFunction: null }, loading: { classPropertyName: "loading", publicName: "loading", isSignal: true, isRequired: false, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null }, disabledInteractive: { classPropertyName: "disabledInteractive", publicName: "disabledInteractive", isSignal: true, isRequired: false, transformFunction: null }, disableRipple: { classPropertyName: "disableRipple", publicName: "disableRipple", isSignal: true, isRequired: false, transformFunction: null }, reverse: { classPropertyName: "reverse", publicName: "reverse", isSignal: true, isRequired: false, transformFunction: null }, fullWidth: { classPropertyName: "fullWidth", publicName: "fullWidth", isSignal: true, isRequired: false, transformFunction: null }, hideTextOnMobile: { classPropertyName: "hideTextOnMobile", publicName: "hideTextOnMobile", isSignal: true, isRequired: false, transformFunction: null } }, host: { listeners: { "click": "_haltDisabledEvents($event)" }, properties: { "attr.disabled": "((disabled() || loading()) && !disabledInteractive()) || null", "class.ngs-button-disabled": "disabled() || loading()", "class.ngs-button-loading": "loading()", "class.ngs-button-primary": "ngsButton() === \"filled\"", "class.ngs-button-outlined": "ngsButton() === \"outlined\"", "class.ngs-button-text": "(ngsButton() === \"text\" || ngsButton() === \"\") && ngsIconButton() !== undefined", "class.ngs-button-tonal": "ngsButton() === \"tonal\"", "class.ngs-icon-button": "ngsIconButton() !== undefined", "class.is-reverse": "reverse()", "class.hide-text-on-mobile": "hideTextOnMobile()", "class.is-full-width": "fullWidth()", "attr.aria-disabled": "(disabled() || loading()).toString()", "attr.tabindex": "(disabled() || loading()) && disabledInteractive() ? 0 : null" }, classAttribute: "ngs-button" }, exportAs: ["ngsButton"], ngImport: i0, template: "<span class=\"ripple\" ngsRipple></span>\n<span class=\"icon\">\n  <ng-content select=\"ngs-icon\"/>\n</span>\n<span class=\"content\"><ng-content/></span>\n@if (loading()) {\n  <svg class=\"ngs-button-loading-spinner\" viewBox=\"0 0 50 50\">\n    <circle class=\"path\" cx=\"25\" cy=\"25\" r=\"20\" fill=\"none\" stroke-width=\"5\"></circle>\n  </svg>\n}\n<!--<div class=\"badge\"><ng-content select=\"ngs-badge\"/></div>-->\n", styles: [":host{--ngs-button-height: calc(var(--spacing, .25rem) * 10);--ngs-button-padding: 0 calc(var(--spacing, .25rem) * 4);--ngs-button-border-radius: calc(var(--spacing, .25rem) * 3);--ngs-button-bg: transparent;--ngs-button-color: var(--color-on-surface);--ngs-button-hover-bg: var(--ngs-button-bg);--ngs-button-content-gap: calc(var(--spacing, .25rem) * .5);position:relative;flex:none;width:max-content;box-sizing:border-box;-webkit-tap-highlight-color:transparent;display:inline-flex;align-items:center;justify-content:center;vertical-align:middle;cursor:pointer;border:none;background:var(--ngs-button-bg);color:var(--ngs-button-color);text-decoration:none;outline:none;font-size:.875rem;font-weight:500;padding:var(--ngs-button-padding);height:var(--ngs-button-height);border-radius:var(--ngs-button-border-radius);transition:background-color .2s cubic-bezier(0,0,.2,1),box-shadow .2s cubic-bezier(0,0,.2,1);gap:var(--ngs-button-content-gap)}@supports (color: color-mix(in lab,red,red)){:host{--ngs-button-hover-bg: color-mix(in srgb, var(--ngs-button-bg), var(--ngs-button-color) 8%)}}:host.is-full-width{width:100%}@media(width<640px){:host.hide-text-on-mobile .content{display:none}:host.hide-text-on-mobile .icon{left:auto;right:auto}:host.hide-text-on-mobile{min-width:var(--ngs-button-height);padding:0}}:host .ripple{position:absolute;inset:0;border-radius:inherit}:host .icon:empty{display:none}:host .icon{line-height:0;position:relative;left:-5px}:host.ngs-icon-button .icon{position:static;left:auto;right:auto}:host .content{line-height:0}:host .content:empty{display:none}:host .ngs-button-loading-spinner{display:none;width:18px;height:18px;margin-left:8px;animation:rotate 2s linear infinite}:host .ngs-button-loading-spinner .path{stroke:currentColor;stroke-linecap:round;animation:dash 1.5s ease-in-out infinite}:host.ngs-button-loading .ngs-button-loading-spinner{display:block}@keyframes rotate{to{transform:rotate(360deg)}}@keyframes dash{0%{stroke-dasharray:1,150;stroke-dashoffset:0}50%{stroke-dasharray:90,150;stroke-dashoffset:-35}to{stroke-dasharray:90,150;stroke-dashoffset:-124}}:host:hover{background:var(--ngs-button-hover-bg)}:host.is-reverse .icon{left:auto;right:-5px}:host.is-reverse{flex-direction:row-reverse}:host.ngs-button-primary{--ngs-button-bg: var(--color-primary);--ngs-button-color: var(--color-on-primary)}:host.ngs-button-tonal{--ngs-button-bg: var(--color-secondary-container);--ngs-button-color: var(--color-on-secondary-container)}:host.ngs-button-outlined{border:1px solid var(--color-emphasis);--ngs-button-color: var(--color-primary)}:host.ngs-icon-button{--ngs-button-padding: 0;--ngs-button-border-radius: 50%;min-width:var(--ngs-button-height);width:var(--ngs-button-height)}:host.ngs-icon-button.ngs-button-loading .icon{display:none}:host.ngs-color-primary{--ngs-button-color: var(--color-primary)}:host.ngs-color-primary.ngs-button-primary{--ngs-button-bg: var(--color-primary);--ngs-button-color: var(--color-on-primary)}:host.ngs-color-primary.ngs-button-tonal{--ngs-button-bg: var(--color-primary-container);--ngs-button-color: var(--color-on-primary-container)}:host.ngs-color-accent{--ngs-button-color: var(--color-secondary)}:host.ngs-color-accent.ngs-button-primary{--ngs-button-bg: var(--color-secondary);--ngs-button-color: var(--color-on-secondary)}:host.ngs-color-accent.ngs-button-tonal{--ngs-button-bg: var(--color-secondary-container);--ngs-button-color: var(--color-on-secondary-container)}:host.ngs-color-warn{--ngs-button-color: var(--color-error)}:host.ngs-color-warn.ngs-button-primary{--ngs-button-bg: var(--color-error);--ngs-button-color: var(--color-on-error)}:host.ngs-color-warn.ngs-button-tonal{--ngs-button-bg: var(--color-error-container);--ngs-button-color: var(--color-on-error-container)}:host.ngs-button-disabled{cursor:default;--ngs-button-bg: var(--color-on-surface) !important;--ngs-button-color: var(--color-on-surface) !important;--ngs-button-hover-bg: var(--color-on-surface) !important}@supports (color: color-mix(in lab,red,red)){:host.ngs-button-disabled{--ngs-button-bg: color-mix(in srgb, var(--color-on-surface), transparent 88%) !important}}@supports (color: color-mix(in lab,red,red)){:host.ngs-button-disabled{--ngs-button-color: color-mix(in srgb, var(--color-on-surface), transparent 62%) !important}}@supports (color: color-mix(in lab,red,red)){:host.ngs-button-disabled{--ngs-button-hover-bg: color-mix(in srgb, var(--color-on-surface), transparent 88%) !important}}:host.ngs-button-disabled.ngs-button-text,:host.ngs-button-disabled.ngs-button-outlined{--ngs-button-bg: transparent !important;--ngs-button-hover-bg: transparent !important;--ngs-button-color: var(--color-on-surface) !important}@supports (color: color-mix(in lab,red,red)){:host.ngs-button-disabled.ngs-button-text,:host.ngs-button-disabled.ngs-button-outlined{--ngs-button-color: color-mix(in srgb, var(--color-on-surface), transparent 62%) !important}}:host.ngs-button-disabled.ngs-button-outlined{border-color:var(--color-on-surface)!important}@supports (color: color-mix(in lab,red,red)){:host.ngs-button-disabled.ngs-button-outlined{border-color:color-mix(in srgb,var(--color-on-surface),transparent 88%)!important}}:host.ngs-button-disabled:hover{background:var(--ngs-button-hover-bg)}:host.ngs-button-disabled[disabled]{pointer-events:none}:host:not([disabled]).ngs-button-disabled{pointer-events:auto;cursor:default}\n/*! tailwindcss v4.2.2 | MIT License | https://tailwindcss.com */\n"], dependencies: [{ kind: "directive", type: Ripple, selector: "[ngsRipple]", inputs: ["ngsRippleColor", "ngsRippleUnbounded", "ngsRippleCentered", "ngsRippleRadius", "ngsRippleAnimation", "ngsRippleDisabled", "ngsRippleTrigger"], outputs: ["ngsRippleCenteredChange", "ngsRippleDisabledChange", "ngsRippleTriggerChange"], exportAs: ["ngsRipple"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.4", ngImport: i0, type: Button, decorators: [{
+            type: Component,
+            args: [{ selector: `
+    button[ngsButton], button[ngsIconButton],
+    a[ngsButton], a[ngsIconButton]
+  `, standalone: true, imports: [
+                        Ripple
+                    ], host: {
+                        'class': 'ngs-button',
+                        '[attr.disabled]': '((disabled() || loading()) && !disabledInteractive()) || null',
+                        '[class.ngs-button-disabled]': 'disabled() || loading()',
+                        '[class.ngs-button-loading]': 'loading()',
+                        '[class.ngs-button-primary]': 'ngsButton() === "filled"',
+                        '[class.ngs-button-outlined]': 'ngsButton() === "outlined"',
+                        '[class.ngs-button-text]': '(ngsButton() === "text" || ngsButton() === "") && ngsIconButton() !== undefined',
+                        '[class.ngs-button-tonal]': 'ngsButton() === "tonal"',
+                        '[class.ngs-icon-button]': 'ngsIconButton() !== undefined',
+                        '[class.is-reverse]': 'reverse()',
+                        '[class.hide-text-on-mobile]': 'hideTextOnMobile()',
+                        '[class.is-full-width]': 'fullWidth()',
+                        '[attr.aria-disabled]': '(disabled() || loading()).toString()',
+                        '(click)': '_haltDisabledEvents($event)',
+                        '[attr.tabindex]': '(disabled() || loading()) && disabledInteractive() ? 0 : null',
+                    }, exportAs: 'ngsButton', changeDetection: ChangeDetectionStrategy.OnPush, template: "<span class=\"ripple\" ngsRipple></span>\n<span class=\"icon\">\n  <ng-content select=\"ngs-icon\"/>\n</span>\n<span class=\"content\"><ng-content/></span>\n@if (loading()) {\n  <svg class=\"ngs-button-loading-spinner\" viewBox=\"0 0 50 50\">\n    <circle class=\"path\" cx=\"25\" cy=\"25\" r=\"20\" fill=\"none\" stroke-width=\"5\"></circle>\n  </svg>\n}\n<!--<div class=\"badge\"><ng-content select=\"ngs-badge\"/></div>-->\n", styles: [":host{--ngs-button-height: calc(var(--spacing, .25rem) * 10);--ngs-button-padding: 0 calc(var(--spacing, .25rem) * 4);--ngs-button-border-radius: calc(var(--spacing, .25rem) * 3);--ngs-button-bg: transparent;--ngs-button-color: var(--color-on-surface);--ngs-button-hover-bg: var(--ngs-button-bg);--ngs-button-content-gap: calc(var(--spacing, .25rem) * .5);position:relative;flex:none;width:max-content;box-sizing:border-box;-webkit-tap-highlight-color:transparent;display:inline-flex;align-items:center;justify-content:center;vertical-align:middle;cursor:pointer;border:none;background:var(--ngs-button-bg);color:var(--ngs-button-color);text-decoration:none;outline:none;font-size:.875rem;font-weight:500;padding:var(--ngs-button-padding);height:var(--ngs-button-height);border-radius:var(--ngs-button-border-radius);transition:background-color .2s cubic-bezier(0,0,.2,1),box-shadow .2s cubic-bezier(0,0,.2,1);gap:var(--ngs-button-content-gap)}@supports (color: color-mix(in lab,red,red)){:host{--ngs-button-hover-bg: color-mix(in srgb, var(--ngs-button-bg), var(--ngs-button-color) 8%)}}:host.is-full-width{width:100%}@media(width<640px){:host.hide-text-on-mobile .content{display:none}:host.hide-text-on-mobile .icon{left:auto;right:auto}:host.hide-text-on-mobile{min-width:var(--ngs-button-height);padding:0}}:host .ripple{position:absolute;inset:0;border-radius:inherit}:host .icon:empty{display:none}:host .icon{line-height:0;position:relative;left:-5px}:host.ngs-icon-button .icon{position:static;left:auto;right:auto}:host .content{line-height:0}:host .content:empty{display:none}:host .ngs-button-loading-spinner{display:none;width:18px;height:18px;margin-left:8px;animation:rotate 2s linear infinite}:host .ngs-button-loading-spinner .path{stroke:currentColor;stroke-linecap:round;animation:dash 1.5s ease-in-out infinite}:host.ngs-button-loading .ngs-button-loading-spinner{display:block}@keyframes rotate{to{transform:rotate(360deg)}}@keyframes dash{0%{stroke-dasharray:1,150;stroke-dashoffset:0}50%{stroke-dasharray:90,150;stroke-dashoffset:-35}to{stroke-dasharray:90,150;stroke-dashoffset:-124}}:host:hover{background:var(--ngs-button-hover-bg)}:host.is-reverse .icon{left:auto;right:-5px}:host.is-reverse{flex-direction:row-reverse}:host.ngs-button-primary{--ngs-button-bg: var(--color-primary);--ngs-button-color: var(--color-on-primary)}:host.ngs-button-tonal{--ngs-button-bg: var(--color-secondary-container);--ngs-button-color: var(--color-on-secondary-container)}:host.ngs-button-outlined{border:1px solid var(--color-emphasis);--ngs-button-color: var(--color-primary)}:host.ngs-icon-button{--ngs-button-padding: 0;--ngs-button-border-radius: 50%;min-width:var(--ngs-button-height);width:var(--ngs-button-height)}:host.ngs-icon-button.ngs-button-loading .icon{display:none}:host.ngs-color-primary{--ngs-button-color: var(--color-primary)}:host.ngs-color-primary.ngs-button-primary{--ngs-button-bg: var(--color-primary);--ngs-button-color: var(--color-on-primary)}:host.ngs-color-primary.ngs-button-tonal{--ngs-button-bg: var(--color-primary-container);--ngs-button-color: var(--color-on-primary-container)}:host.ngs-color-accent{--ngs-button-color: var(--color-secondary)}:host.ngs-color-accent.ngs-button-primary{--ngs-button-bg: var(--color-secondary);--ngs-button-color: var(--color-on-secondary)}:host.ngs-color-accent.ngs-button-tonal{--ngs-button-bg: var(--color-secondary-container);--ngs-button-color: var(--color-on-secondary-container)}:host.ngs-color-warn{--ngs-button-color: var(--color-error)}:host.ngs-color-warn.ngs-button-primary{--ngs-button-bg: var(--color-error);--ngs-button-color: var(--color-on-error)}:host.ngs-color-warn.ngs-button-tonal{--ngs-button-bg: var(--color-error-container);--ngs-button-color: var(--color-on-error-container)}:host.ngs-button-disabled{cursor:default;--ngs-button-bg: var(--color-on-surface) !important;--ngs-button-color: var(--color-on-surface) !important;--ngs-button-hover-bg: var(--color-on-surface) !important}@supports (color: color-mix(in lab,red,red)){:host.ngs-button-disabled{--ngs-button-bg: color-mix(in srgb, var(--color-on-surface), transparent 88%) !important}}@supports (color: color-mix(in lab,red,red)){:host.ngs-button-disabled{--ngs-button-color: color-mix(in srgb, var(--color-on-surface), transparent 62%) !important}}@supports (color: color-mix(in lab,red,red)){:host.ngs-button-disabled{--ngs-button-hover-bg: color-mix(in srgb, var(--color-on-surface), transparent 88%) !important}}:host.ngs-button-disabled.ngs-button-text,:host.ngs-button-disabled.ngs-button-outlined{--ngs-button-bg: transparent !important;--ngs-button-hover-bg: transparent !important;--ngs-button-color: var(--color-on-surface) !important}@supports (color: color-mix(in lab,red,red)){:host.ngs-button-disabled.ngs-button-text,:host.ngs-button-disabled.ngs-button-outlined{--ngs-button-color: color-mix(in srgb, var(--color-on-surface), transparent 62%) !important}}:host.ngs-button-disabled.ngs-button-outlined{border-color:var(--color-on-surface)!important}@supports (color: color-mix(in lab,red,red)){:host.ngs-button-disabled.ngs-button-outlined{border-color:color-mix(in srgb,var(--color-on-surface),transparent 88%)!important}}:host.ngs-button-disabled:hover{background:var(--ngs-button-hover-bg)}:host.ngs-button-disabled[disabled]{pointer-events:none}:host:not([disabled]).ngs-button-disabled{pointer-events:auto;cursor:default}\n/*! tailwindcss v4.2.2 | MIT License | https://tailwindcss.com */\n"] }]
+        }], ctorParameters: () => [], propDecorators: { ngsButton: [{ type: i0.Input, args: [{ isSignal: true, alias: "ngsButton", required: false }] }], ngsIconButton: [{ type: i0.Input, args: [{ isSignal: true, alias: "ngsIconButton", required: false }] }], loading: [{ type: i0.Input, args: [{ isSignal: true, alias: "loading", required: false }] }], disabled: [{ type: i0.Input, args: [{ isSignal: true, alias: "disabled", required: false }] }], disabledInteractive: [{ type: i0.Input, args: [{ isSignal: true, alias: "disabledInteractive", required: false }] }], disableRipple: [{ type: i0.Input, args: [{ isSignal: true, alias: "disableRipple", required: false }] }], reverse: [{ type: i0.Input, args: [{ isSignal: true, alias: "reverse", required: false }] }], fullWidth: [{ type: i0.Input, args: [{ isSignal: true, alias: "fullWidth", required: false }] }], hideTextOnMobile: [{ type: i0.Input, args: [{ isSignal: true, alias: "hideTextOnMobile", required: false }] }] } });
+
+/**
+ * Generated bundle index. Do not edit.
+ */
+
+export { Button };
+//# sourceMappingURL=ngstarter-ui-components-button.mjs.map

package/fesm2022/ngstarter-ui-components-button.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"ngstarter-ui-components-button.mjs","sources":["../../../projects/components/button/src/button/button.ts","../../../projects/components/button/src/button/button.html","../../../projects/components/button/ngstarter-ui-components-button.ts"],"sourcesContent":["import {\n  booleanAttribute,\n  ChangeDetectionStrategy,\n  Component,\n  effect,\n  ElementRef,\n  inject,\n  input,\n} from '@angular/core';\nimport { Ripple } from '@ngstarter-ui/components/core';\n\nexport type ButtonVariant = 'filled' | 'outlined' | 'text' | 'tonal' | '';\n\n@Component({\n  selector: `\n    button[ngsButton], button[ngsIconButton],\n    a[ngsButton], a[ngsIconButton]\n  `,\n  standalone: true,\n  imports: [\n    Ripple\n  ],\n  templateUrl: './button.html',\n  styleUrl: './button.scss',\n  host: {\n    'class': 'ngs-button',\n    '[attr.disabled]': '((disabled() || loading()) && !disabledInteractive()) || null',\n    '[class.ngs-button-disabled]': 'disabled() || loading()',\n    '[class.ngs-button-loading]': 'loading()',\n    '[class.ngs-button-primary]': 'ngsButton() === \"filled\"',\n    '[class.ngs-button-outlined]': 'ngsButton() === \"outlined\"',\n    '[class.ngs-button-text]': '(ngsButton() === \"text\" || ngsButton() === \"\") && ngsIconButton() !== undefined',\n    '[class.ngs-button-tonal]': 'ngsButton() === \"tonal\"',\n    '[class.ngs-icon-button]': 'ngsIconButton() !== undefined',\n    '[class.is-reverse]': 'reverse()',\n    '[class.hide-text-on-mobile]': 'hideTextOnMobile()',\n    '[class.is-full-width]': 'fullWidth()',\n    '[attr.aria-disabled]': '(disabled() || loading()).toString()',\n    '(click)': '_haltDisabledEvents($event)',\n    '[attr.tabindex]': '(disabled() || loading()) && disabledInteractive() ? 0 : null',\n  },\n  exportAs: 'ngsButton',\n  changeDetection: ChangeDetectionStrategy.OnPush,\n})\nexport class Button {\n  readonly elementRef = inject(ElementRef);\n  readonly _ripple = inject(Ripple, { optional: true });\n\n  readonly ngsButton = input<ButtonVariant>('text');\n  readonly ngsIconButton = input(undefined, { transform: booleanAttribute });\n  readonly loading = input(false, { transform: booleanAttribute });\n  readonly disabled = input(false, { transform: booleanAttribute });\n  readonly disabledInteractive = input(false, { transform: booleanAttribute });\n  readonly disableRipple = input(false, { transform: booleanAttribute });\n  readonly reverse = input(false, { transform: booleanAttribute });\n  readonly fullWidth = input(false, { transform: booleanAttribute });\n  readonly hideTextOnMobile = input(false, { transform: booleanAttribute });\n\n  constructor() {\n    effect(() => {\n      if (this._ripple) {\n        this._ripple.disabled.set(this.disabled() || this.loading() || this.disableRipple());\n        this._ripple.trigger.set(this.elementRef.nativeElement);\n        this._ripple.centered.set(this.isIconButton);\n      }\n    });\n  }\n\n  /** Whether the button is an icon button. */\n  get isIconButton(): boolean {\n    return this.ngsIconButton() !== undefined;\n  }\n\n  _haltDisabledEvents(event: Event) {\n    if (this.disabled() || this.loading()) {\n      event.preventDefault();\n      event.stopImmediatePropagation();\n    }\n  }\n}\n","<span class=\"ripple\" ngsRipple></span>\n<span class=\"icon\">\n  <ng-content select=\"ngs-icon\"/>\n</span>\n<span class=\"content\"><ng-content/></span>\n@if (loading()) {\n  <svg class=\"ngs-button-loading-spinner\" viewBox=\"0 0 50 50\">\n    <circle class=\"path\" cx=\"25\" cy=\"25\" r=\"20\" fill=\"none\" stroke-width=\"5\"></circle>\n  </svg>\n}\n<!--<div class=\"badge\"><ng-content select=\"ngs-badge\"/></div>-->\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":[],"mappings":"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"}

package/fesm2022/ngstarter-ui-components-card-overlay.mjs

@@ -0,0 +1,49 @@
+import * as i0 from '@angular/core';
+import { input, booleanAttribute, Component, inject, ElementRef, Renderer2, Directive } from '@angular/core';
+
+class CardOverlay {
+    withTranslate = input(false, { ...(ngDevMode ? { debugName: "withTranslate" } : /* istanbul ignore next */ {}), transform: booleanAttribute });
+    withBlur = input(false, { ...(ngDevMode ? { debugName: "withBlur" } : /* istanbul ignore next */ {}), transform: booleanAttribute });
+    disabled = input(false, { ...(ngDevMode ? { debugName: "disabled" } : /* istanbul ignore next */ {}), transform: booleanAttribute });
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.4", ngImport: i0, type: CardOverlay, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "21.2.4", type: CardOverlay, isStandalone: true, selector: "ngs-card-overlay", inputs: { withTranslate: { classPropertyName: "withTranslate", publicName: "withTranslate", isSignal: true, isRequired: false, transformFunction: null }, withBlur: { classPropertyName: "withBlur", publicName: "withBlur", isSignal: true, isRequired: false, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null } }, host: { properties: { "class.with-translate": "withTranslate()", "class.with-blur": "withBlur()", "class.is-disabled": "disabled()" }, classAttribute: "ngs-card-overlay" }, exportAs: ["ngsCardOverlay"], ngImport: i0, template: "<div class=\"background\"></div>\n<div class=\"content\">\n  <ng-content/>\n</div>\n", styles: [":host{display:flex;align-items:center;justify-content:center;position:absolute;inset:0;z-index:1;border-radius:inherit}:host .background{background:#0000004d;position:absolute;inset:0;z-index:0;opacity:0;transition-property:all;transition-timing-function:cubic-bezier(.4,0,.2,1);transition-duration:.15s;border-radius:inherit}:host .content{z-index:1;opacity:0;border-radius:inherit}:host.with-translate .background{transition:all .15s cubic-bezier(.4,0,.2,1)}:host.with-blur .background{-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px)}:host.is-disabled{z-index:-1}:host-context(.ngs-card-overlay-container:hover):not(.is-disabled) .background,:host-context(.ngs-card-overlay-container:hover):not(.is-disabled) .content{opacity:100%}:host-context(.ngs-card-overlay-container:hover):not(.is-disabled).with-translate .background{transition:all .15s cubic-bezier(.4,0,.2,1)}:host-context(html.dark) .background{background:#fff3}\n/*! tailwindcss v4.2.2 | MIT License | https://tailwindcss.com */\n"] });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.4", ngImport: i0, type: CardOverlay, decorators: [{
+            type: Component,
+            args: [{ selector: 'ngs-card-overlay', exportAs: 'ngsCardOverlay', imports: [], host: {
+                        'class': 'ngs-card-overlay',
+                        '[class.with-translate]': 'withTranslate()',
+                        '[class.with-blur]': 'withBlur()',
+                        '[class.is-disabled]': 'disabled()',
+                    }, template: "<div class=\"background\"></div>\n<div class=\"content\">\n  <ng-content/>\n</div>\n", styles: [":host{display:flex;align-items:center;justify-content:center;position:absolute;inset:0;z-index:1;border-radius:inherit}:host .background{background:#0000004d;position:absolute;inset:0;z-index:0;opacity:0;transition-property:all;transition-timing-function:cubic-bezier(.4,0,.2,1);transition-duration:.15s;border-radius:inherit}:host .content{z-index:1;opacity:0;border-radius:inherit}:host.with-translate .background{transition:all .15s cubic-bezier(.4,0,.2,1)}:host.with-blur .background{-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px)}:host.is-disabled{z-index:-1}:host-context(.ngs-card-overlay-container:hover):not(.is-disabled) .background,:host-context(.ngs-card-overlay-container:hover):not(.is-disabled) .content{opacity:100%}:host-context(.ngs-card-overlay-container:hover):not(.is-disabled).with-translate .background{transition:all .15s cubic-bezier(.4,0,.2,1)}:host-context(html.dark) .background{background:#fff3}\n/*! tailwindcss v4.2.2 | MIT License | https://tailwindcss.com */\n"] }]
+        }], propDecorators: { withTranslate: [{ type: i0.Input, args: [{ isSignal: true, alias: "withTranslate", required: false }] }], withBlur: [{ type: i0.Input, args: [{ isSignal: true, alias: "withBlur", required: false }] }], disabled: [{ type: i0.Input, args: [{ isSignal: true, alias: "disabled", required: false }] }] } });
+
+class CardOverlayContainerDirective {
+    _elementRef = inject(ElementRef);
+    _renderer = inject(Renderer2);
+    ngOnInit() {
+        const nativeElement = this._elementRef.nativeElement;
+        this._renderer.setStyle(nativeElement, 'position', 'relative');
+        this._renderer.setStyle(nativeElement, 'overflow', 'hidden');
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.4", ngImport: i0, type: CardOverlayContainerDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive });
+    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "21.2.4", type: CardOverlayContainerDirective, isStandalone: true, selector: "[ngsCardOverlayContainer]", host: { classAttribute: "ngs-card-overlay-container" }, exportAs: ["ngsCardOverlayContainer"], ngImport: i0 });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.4", ngImport: i0, type: CardOverlayContainerDirective, decorators: [{
+            type: Directive,
+            args: [{
+                    selector: '[ngsCardOverlayContainer]',
+                    exportAs: 'ngsCardOverlayContainer',
+                    standalone: true,
+                    host: {
+                        'class': 'ngs-card-overlay-container',
+                    }
+                }]
+        }] });
+
+/**
+ * Generated bundle index. Do not edit.
+ */
+
+export { CardOverlay, CardOverlayContainerDirective };
+//# sourceMappingURL=ngstarter-ui-components-card-overlay.mjs.map

package/fesm2022/ngstarter-ui-components-card-overlay.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"ngstarter-ui-components-card-overlay.mjs","sources":["../../../projects/components/card-overlay/src/card-overlay/card-overlay.ts","../../../projects/components/card-overlay/src/card-overlay/card-overlay.html","../../../projects/components/card-overlay/src/card-overlay-container.directive.ts","../../../projects/components/card-overlay/ngstarter-ui-components-card-overlay.ts"],"sourcesContent":["import { booleanAttribute, Component, input } from '@angular/core';\n\n@Component({\n  selector: 'ngs-card-overlay',\n  exportAs: 'ngsCardOverlay',\n  imports: [],\n  templateUrl: './card-overlay.html',\n  styleUrl: './card-overlay.scss',\n  host: {\n    'class': 'ngs-card-overlay',\n    '[class.with-translate]': 'withTranslate()',\n    '[class.with-blur]': 'withBlur()',\n    '[class.is-disabled]': 'disabled()',\n  }\n})\nexport class CardOverlay {\n  withTranslate = input(false, {\n    transform: booleanAttribute\n  });\n  withBlur = input(false, {\n    transform: booleanAttribute\n  });\n  disabled = input(false, {\n    transform: booleanAttribute\n  });\n}\n","<div class=\"background\"></div>\n<div class=\"content\">\n  <ng-content/>\n</div>\n","import { Directive, ElementRef, inject, OnInit, Renderer2 } from '@angular/core';\n\n@Directive({\n  selector: '[ngsCardOverlayContainer]',\n  exportAs: 'ngsCardOverlayContainer',\n  standalone: true,\n  host: {\n    'class': 'ngs-card-overlay-container',\n  }\n})\nexport class CardOverlayContainerDirective implements OnInit {\n  private _elementRef = inject(ElementRef);\n  private _renderer = inject(Renderer2);\n\n  ngOnInit() {\n    const nativeElement = this._elementRef.nativeElement as HTMLElement;\n    this._renderer.setStyle(nativeElement, 'position', 'relative');\n    this._renderer.setStyle(nativeElement, 'overflow', 'hidden');\n  }\n}\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":[],"mappings":";;;MAea,WAAW,CAAA;IACtB,aAAa,GAAG,KAAK,CAAC,KAAK,qFACzB,SAAS,EAAE,gBAAgB,EAAA,CAC3B;IACF,QAAQ,GAAG,KAAK,CAAC,KAAK,gFACpB,SAAS,EAAE,gBAAgB,EAAA,CAC3B;IACF,QAAQ,GAAG,KAAK,CAAC,KAAK,gFACpB,SAAS,EAAE,gBAAgB,EAAA,CAC3B;uGATS,WAAW,EAAA,IAAA,EAAA,EAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,SAAA,EAAA,CAAA;AAAX,IAAA,OAAA,IAAA,GAAA,EAAA,CAAA,oBAAA,CAAA,EAAA,UAAA,EAAA,QAAA,EAAA,OAAA,EAAA,QAAA,EAAA,IAAA,EAAA,WAAW,qrBCfxB,sFAIA,EAAA,MAAA,EAAA,CAAA,g/BAAA,CAAA,EAAA,CAAA;;2FDWa,WAAW,EAAA,UAAA,EAAA,CAAA;kBAbvB,SAAS;AACE,YAAA,IAAA,EAAA,CAAA,EAAA,QAAA,EAAA,kBAAkB,EAAA,QAAA,EAClB,gBAAgB,EAAA,OAAA,EACjB,EAAE,EAAA,IAAA,EAGL;AACJ,wBAAA,OAAO,EAAE,kBAAkB;AAC3B,wBAAA,wBAAwB,EAAE,iBAAiB;AAC3C,wBAAA,mBAAmB,EAAE,YAAY;AACjC,wBAAA,qBAAqB,EAAE,YAAY;AACpC,qBAAA,EAAA,QAAA,EAAA,sFAAA,EAAA,MAAA,EAAA,CAAA,g/BAAA,CAAA,EAAA;;;MEHU,6BAA6B,CAAA;AAChC,IAAA,WAAW,GAAG,MAAM,CAAC,UAAU,CAAC;AAChC,IAAA,SAAS,GAAG,MAAM,CAAC,SAAS,CAAC;IAErC,QAAQ,GAAA;AACN,QAAA,MAAM,aAAa,GAAG,IAAI,CAAC,WAAW,CAAC,aAA4B;QACnE,IAAI,CAAC,SAAS,CAAC,QAAQ,CAAC,aAAa,EAAE,UAAU,EAAE,UAAU,CAAC;QAC9D,IAAI,CAAC,SAAS,CAAC,QAAQ,CAAC,aAAa,EAAE,UAAU,EAAE,QAAQ,CAAC;IAC9D;uGARW,6BAA6B,EAAA,IAAA,EAAA,EAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,SAAA,EAAA,CAAA;2FAA7B,6BAA6B,EAAA,YAAA,EAAA,IAAA,EAAA,QAAA,EAAA,2BAAA,EAAA,IAAA,EAAA,EAAA,cAAA,EAAA,4BAAA,EAAA,EAAA,QAAA,EAAA,CAAA,yBAAA,CAAA,EAAA,QAAA,EAAA,EAAA,EAAA,CAAA;;2FAA7B,6BAA6B,EAAA,UAAA,EAAA,CAAA;kBARzC,SAAS;AAAC,YAAA,IAAA,EAAA,CAAA;AACT,oBAAA,QAAQ,EAAE,2BAA2B;AACrC,oBAAA,QAAQ,EAAE,yBAAyB;AACnC,oBAAA,UAAU,EAAE,IAAI;AAChB,oBAAA,IAAI,EAAE;AACJ,wBAAA,OAAO,EAAE,4BAA4B;AACtC;AACF,iBAAA;;;ACTD;;AAEG;;;;"}