primeng/fesm2022/primeng-button.mjs

PrimeNG is a premium UI library for Angular featuring a rich set of 90+ components, a theme designer, various theme alternatives such as Material, Bootstrap, Tailwind, premium templates and professional support. In addition, it integrates with PrimeBlock,

export * from 'primeng/types/button';
import * as i0 from '@angular/core';
import { Injectable, InjectionToken, input, inject, booleanAttribute, numberAttribute, output, contentChild, computed, ViewEncapsulation, ChangeDetectionStrategy, Component, effect, Directive, NgModule } from '@angular/core';
import { BaseComponent, PARENT_INSTANCE } from 'primeng/basecomponent';
import * as i1 from 'primeng/bind';
import { Bind } from 'primeng/bind';
import { Fluid } from 'primeng/fluid';
import * as i2$1 from 'primeng/ripple';
import { Ripple } from 'primeng/ripple';
import { style } from '@primeuix/styles/button';
import { BaseStyle } from 'primeng/base';
import { NgTemplateOutlet } from '@angular/common';
import { Spinner } from '@primeicons/angular/spinner';
import { AutoFocus } from 'primeng/autofocus';
import * as i2 from 'primeng/badge';
import { BadgeModule } from 'primeng/badge';

const classes = {
    root: ({ instance }) => {
        const hasIcon = instance.hasIcon();
        const label = instance.label();
        const buttonProps = instance.buttonProps();
        const loading = instance.loading();
        const link = instance.link();
        const severity = instance.severity();
        const raised = instance.raised();
        const rounded = instance.rounded();
        const text = instance.text();
        const variant = instance.variant();
        const outlined = instance.outlined();
        const size = instance.size();
        const plain = instance.plain();
        const badge = instance.badge();
        const hasFluid = instance.hasFluid();
        const iconPos = instance.iconPos();
        return [
            'p-button p-component',
            {
                'p-button-icon-only': hasIcon && !label && !buttonProps?.label && !badge,
                'p-button-vertical': (iconPos === 'top' || iconPos === 'bottom') && label,
                'p-button-loading': loading || buttonProps?.loading,
                'p-button-link': link || buttonProps?.link,
                [`p-button-${severity || buttonProps?.severity}`]: severity || buttonProps?.severity,
                'p-button-raised': raised || buttonProps?.raised,
                'p-button-rounded': rounded || buttonProps?.rounded,
                'p-button-text': text || variant === 'text' || buttonProps?.text || buttonProps?.variant === 'text',
                'p-button-outlined': outlined || variant === 'outlined' || buttonProps?.outlined || buttonProps?.variant === 'outlined',
                'p-button-sm': size === 'small' || buttonProps?.size === 'small',
                'p-button-lg': size === 'large' || buttonProps?.size === 'large',
                'p-button-plain': plain || buttonProps?.plain,
                'p-button-fluid': hasFluid
            }
        ];
    },
    loadingIcon: 'p-button-loading-icon',
    icon: ({ instance }) => {
        const iconPos = instance.iconPos();
        const buttonProps = instance.buttonProps();
        const label = instance.label();
        const icon = instance.icon();
        return [
            'p-button-icon',
            {
                [`p-button-icon-${iconPos || buttonProps?.iconPos}`]: label || buttonProps?.label,
                'p-button-icon-left': ((iconPos === 'left' || buttonProps?.iconPos === 'left') && label) || buttonProps?.label,
                'p-button-icon-right': ((iconPos === 'right' || buttonProps?.iconPos === 'right') && label) || buttonProps?.label,
                'p-button-icon-top': ((iconPos === 'top' || buttonProps?.iconPos === 'top') && label) || buttonProps?.label,
                'p-button-icon-bottom': ((iconPos === 'bottom' || buttonProps?.iconPos === 'bottom') && label) || buttonProps?.label
            },
            icon,
            buttonProps?.icon
        ];
    },
    spinnerIcon: ({ instance }) => {
        return Object.entries(instance.cx('icon'))
            .filter(([, value]) => !!value)
            .reduce((acc, [key]) => acc + ` ${key}`, 'p-button-loading-icon');
    },
    label: 'p-button-label'
};
class ButtonStyle extends BaseStyle {
    name = 'button';
    style = style;
    classes = classes;
    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.6", ngImport: i0, type: ButtonStyle, deps: null, target: i0.ɵɵFactoryTarget.Injectable });
    static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "22.0.6", ngImport: i0, type: ButtonStyle });
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.6", ngImport: i0, type: ButtonStyle, decorators: [{
            type: Injectable
        }] });
/**
 *
 * Button is an extension to standard button element with icons and theming.
 *
 * [Live Demo](https://www.primeng.org/button/)
 *
 * @module buttonstyle
 *
 */
var ButtonClasses;
(function (ButtonClasses) {
    /**
     * Class name of the root element
     */
    ButtonClasses["root"] = "p-button";
    /**
     * Class name of the loading icon element
     */
    ButtonClasses["loadingIcon"] = "p-button-loading-icon";
    /**
     * Class name of the icon element
     */
    ButtonClasses["icon"] = "p-button-icon";
    /**
     * Class name of the label element
     */
    ButtonClasses["label"] = "p-button-label";
})(ButtonClasses || (ButtonClasses = {}));

const BUTTON_INSTANCE = new InjectionToken('BUTTON_INSTANCE');
/**
 * @deprecated Use the `[pButton]` directive instead.
 * @group Components
 */
class Button extends BaseComponent {
    componentName = 'Button';
    hostName = input('', /* @ts-ignore */
    ...(ngDevMode ? [{ debugName: "hostName" }] : /* istanbul ignore next */ []));
    $pcButton = inject(BUTTON_INSTANCE, { optional: true, skipSelf: true }) ?? undefined;
    bindDirectiveInstance = inject(Bind, { self: true });
    _componentStyle = inject(ButtonStyle);
    onAfterViewChecked() {
        this.bindDirectiveInstance.setAttrs(this.ptm('host'));
    }
    /**
     * Type of the button.
     * @group Props
     */
    type = input('button', /* @ts-ignore */
    ...(ngDevMode ? [{ debugName: "type" }] : /* istanbul ignore next */ []));
    /**
     * Value of the badge.
     * @group Props
     */
    badge = input(/* @ts-ignore */
    ...(ngDevMode ? [undefined, { debugName: "badge" }] : /* istanbul ignore next */ []));
    /**
     * When present, it specifies that the component should be disabled.
     * @group Props
     */
    disabled = input(false, { ...(ngDevMode ? { debugName: "disabled" } : /* istanbul ignore next */ {}), transform: booleanAttribute });
    /**
     * Add a shadow to indicate elevation.
     * @group Props
     */
    raised = input(false, { ...(ngDevMode ? { debugName: "raised" } : /* istanbul ignore next */ {}), transform: booleanAttribute });
    /**
     * Add a circular border radius to the button.
     * @group Props
     */
    rounded = input(false, { ...(ngDevMode ? { debugName: "rounded" } : /* istanbul ignore next */ {}), transform: booleanAttribute });
    /**
     * Add a textual class to the button without a background initially.
     * @group Props
     */
    text = input(false, { ...(ngDevMode ? { debugName: "text" } : /* istanbul ignore next */ {}), transform: booleanAttribute });
    /**
     * Add a plain textual class to the button without a background initially.
     * @group Props
     */
    plain = input(false, { ...(ngDevMode ? { debugName: "plain" } : /* istanbul ignore next */ {}), transform: booleanAttribute });
    /**
     * Add a border class without a background initially.
     * @group Props
     */
    outlined = input(false, { ...(ngDevMode ? { debugName: "outlined" } : /* istanbul ignore next */ {}), transform: booleanAttribute });
    /**
     * Add a link style to the button.
     * @group Props
     */
    link = input(false, { ...(ngDevMode ? { debugName: "link" } : /* istanbul ignore next */ {}), transform: booleanAttribute });
    /**
     * Add a tabindex to the button.
     * @group Props
     */
    tabindex = input(0, { ...(ngDevMode ? { debugName: "tabindex" } : /* istanbul ignore next */ {}), transform: numberAttribute });
    /**
     * Defines the size of the button.
     * @group Props
     */
    size = input(/* @ts-ignore */
    ...(ngDevMode ? [undefined, { debugName: "size" }] : /* istanbul ignore next */ []));
    /**
     * Specifies the variant of the component.
     * @group Props
     */
    variant = input(/* @ts-ignore */
    ...(ngDevMode ? [undefined, { debugName: "variant" }] : /* istanbul ignore next */ []));
    /**
     * Inline style of the element.
     * @group Props
     */
    style = input(/* @ts-ignore */
    ...(ngDevMode ? [undefined, { debugName: "style" }] : /* istanbul ignore next */ []));
    /**
     * Class of the element.
     * @group Props
     */
    styleClass = input(/* @ts-ignore */
    ...(ngDevMode ? [undefined, { debugName: "styleClass" }] : /* istanbul ignore next */ []));
    /**
     * Severity type of the badge.
     * @group Props
     * @defaultValue secondary
     */
    badgeSeverity = input('secondary', /* @ts-ignore */
    ...(ngDevMode ? [{ debugName: "badgeSeverity" }] : /* istanbul ignore next */ []));
    /**
     * Used to define a string that autocomplete attribute the current element.
     * @group Props
     */
    ariaLabel = input(/* @ts-ignore */
    ...(ngDevMode ? [undefined, { debugName: "ariaLabel" }] : /* istanbul ignore next */ []));
    /**
     * When present, it specifies that the component should automatically get focus on load.
     * @group Props
     */
    autofocus = input(false, { ...(ngDevMode ? { debugName: "autofocus" } : /* istanbul ignore next */ {}), transform: booleanAttribute });
    /**
     * Position of the icon.
     * @group Props
     */
    iconPos = input('left', /* @ts-ignore */
    ...(ngDevMode ? [{ debugName: "iconPos" }] : /* istanbul ignore next */ []));
    /**
     * Name of the icon.
     * @group Props
     */
    icon = input(/* @ts-ignore */
    ...(ngDevMode ? [undefined, { debugName: "icon" }] : /* istanbul ignore next */ []));
    /**
     * Text of the button.
     * @group Props
     */
    label = input(/* @ts-ignore */
    ...(ngDevMode ? [undefined, { debugName: "label" }] : /* istanbul ignore next */ []));
    /**
     * Whether the button is in loading state.
     * @group Props
     */
    loading = input(false, { ...(ngDevMode ? { debugName: "loading" } : /* istanbul ignore next */ {}), transform: booleanAttribute });
    /**
     * Icon to display in loading state.
     * @group Props
     */
    loadingIcon = input(/* @ts-ignore */
    ...(ngDevMode ? [undefined, { debugName: "loadingIcon" }] : /* istanbul ignore next */ []));
    /**
     * Defines the style of the button.
     * @group Props
     */
    severity = input(/* @ts-ignore */
    ...(ngDevMode ? [undefined, { debugName: "severity" }] : /* istanbul ignore next */ []));
    /**
     * Used to pass all properties of the ButtonProps to the Button component.
     * @group Props
     */
    buttonProps = input(/* @ts-ignore */
    ...(ngDevMode ? [undefined, { debugName: "buttonProps" }] : /* istanbul ignore next */ []));
    /**
     * Spans 100% width of the container when enabled.
     * @defaultValue undefined
     * @group Props
     */
    fluid = input(undefined, { ...(ngDevMode ? { debugName: "fluid" } : /* istanbul ignore next */ {}), transform: booleanAttribute });
    /**
     * Forces icon-only styling regardless of content. When unset, icon-only is inferred from the absence of a label/badge.
     * @group Props
     */
    iconOnly = input(false, { ...(ngDevMode ? { debugName: "iconOnly" } : /* istanbul ignore next */ {}), transform: booleanAttribute });
    /**
     * Callback to execute when button is clicked.
     * This event is intended to be used with the <p-button> component. Using a regular <button> element, use (click).
     * @param {MouseEvent} event - Mouse event.
     * @group Emits
     */
    onClick = output();
    /**
     * Callback to execute when button is focused.
     * This event is intended to be used with the <p-button> component. Using a regular <button> element, use (focus).
     * @param {FocusEvent} event - Focus event.
     * @group Emits
     */
    onFocus = output();
    /**
     * Callback to execute when button loses focus.
     * This event is intended to be used with the <p-button> component. Using a regular <button> element, use (blur).
     * @param {FocusEvent} event - Focus event.
     * @group Emits
     */
    onBlur = output();
    /**
     * Custom content template.
     * @group Templates
     **/
    contentTemplate = contentChild('content', { ...(ngDevMode ? { debugName: "contentTemplate" } : /* istanbul ignore next */ {}), descendants: false });
    /**
     * Custom loading icon template.
     * @group Templates
     **/
    loadingIconTemplate = contentChild('loadingicon', { ...(ngDevMode ? { debugName: "loadingIconTemplate" } : /* istanbul ignore next */ {}), descendants: false });
    /**
     * Custom icon template.
     * @group Templates
     **/
    iconTemplate = contentChild('icon', { ...(ngDevMode ? { debugName: "iconTemplate" } : /* istanbul ignore next */ {}), descendants: false });
    pcFluid = inject(Fluid, { optional: true, host: true, skipSelf: true });
    hasFluid = computed(() => this.fluid() ?? !!this.pcFluid, /* @ts-ignore */
    ...(ngDevMode ? [{ debugName: "hasFluid" }] : /* istanbul ignore next */ []));
    $type = computed(() => this.type() || this.buttonProps()?.type, /* @ts-ignore */
    ...(ngDevMode ? [{ debugName: "$type" }] : /* istanbul ignore next */ []));
    $ariaLabel = computed(() => this.ariaLabel() || this.buttonProps()?.ariaLabel, /* @ts-ignore */
    ...(ngDevMode ? [{ debugName: "$ariaLabel" }] : /* istanbul ignore next */ []));
    mergedStyle = computed(() => this.style() || this.buttonProps()?.style, /* @ts-ignore */
    ...(ngDevMode ? [{ debugName: "mergedStyle" }] : /* istanbul ignore next */ []));
    $disabled = computed(() => this.disabled() || this.loading() || this.buttonProps()?.disabled, /* @ts-ignore */
    ...(ngDevMode ? [{ debugName: "$disabled" }] : /* istanbul ignore next */ []));
    $severity = computed(() => this.severity() || this.buttonProps()?.severity, /* @ts-ignore */
    ...(ngDevMode ? [{ debugName: "$severity" }] : /* istanbul ignore next */ []));
    $tabindex = computed(() => this.tabindex() || this.buttonProps()?.tabindex, /* @ts-ignore */
    ...(ngDevMode ? [{ debugName: "$tabindex" }] : /* istanbul ignore next */ []));
    $autofocus = computed(() => this.autofocus() || this.buttonProps()?.autofocus, /* @ts-ignore */
    ...(ngDevMode ? [{ debugName: "$autofocus" }] : /* istanbul ignore next */ []));
    $loading = computed(() => this.loading() || this.buttonProps()?.loading, /* @ts-ignore */
    ...(ngDevMode ? [{ debugName: "$loading" }] : /* istanbul ignore next */ []));
    $icon = computed(() => this.icon() || this.buttonProps()?.icon, /* @ts-ignore */
    ...(ngDevMode ? [{ debugName: "$icon" }] : /* istanbul ignore next */ []));
    $label = computed(() => this.label() || this.buttonProps()?.label, /* @ts-ignore */
    ...(ngDevMode ? [{ debugName: "$label" }] : /* istanbul ignore next */ []));
    $badge = computed(() => this.badge() || this.buttonProps()?.badge, /* @ts-ignore */
    ...(ngDevMode ? [{ debugName: "$badge" }] : /* istanbul ignore next */ []));
    $loadingIcon = computed(() => this.loadingIcon() || this.buttonProps()?.loadingIcon, /* @ts-ignore */
    ...(ngDevMode ? [{ debugName: "$loadingIcon" }] : /* istanbul ignore next */ []));
    $badgeSeverity = computed(() => this.badgeSeverity() || this.buttonProps()?.badgeSeverity, /* @ts-ignore */
    ...(ngDevMode ? [{ debugName: "$badgeSeverity" }] : /* istanbul ignore next */ []));
    showLabel = computed(() => !this.contentTemplate() && this.$label(), /* @ts-ignore */
    ...(ngDevMode ? [{ debugName: "showLabel" }] : /* istanbul ignore next */ []));
    showBadge = computed(() => !this.contentTemplate() && this.$badge(), /* @ts-ignore */
    ...(ngDevMode ? [{ debugName: "showBadge" }] : /* istanbul ignore next */ []));
    getLoadingIconTemplateContext() {
        return { class: this.cx('loadingIcon'), pt: this.ptm('loadingIcon') };
    }
    getIconTemplateContext() {
        return { class: this.cx('icon'), pt: this.ptm('icon') };
    }
    hasIcon = computed(() => this.$icon() || this.iconTemplate() || this.loadingIcon() || this.loadingIconTemplate(), /* @ts-ignore */
    ...(ngDevMode ? [{ debugName: "hasIcon" }] : /* istanbul ignore next */ []));
    $outlined = computed(() => this.outlined() || this.variant() === 'outlined' || this.buttonProps()?.outlined || this.buttonProps()?.variant === 'outlined', /* @ts-ignore */
    ...(ngDevMode ? [{ debugName: "$outlined" }] : /* istanbul ignore next */ []));
    $text = computed(() => this.text() || this.variant() === 'text' || this.buttonProps()?.text || this.buttonProps()?.variant === 'text', /* @ts-ignore */
    ...(ngDevMode ? [{ debugName: "$text" }] : /* istanbul ignore next */ []));
    $iconOnly = computed(() => this.iconOnly() || (this.hasIcon() && !this.$label() && !this.$badge()), /* @ts-ignore */
    ...(ngDevMode ? [{ debugName: "$iconOnly" }] : /* istanbul ignore next */ []));
    dataP = computed(() => this.cn({
        [this.size()]: this.size(),
        'icon-only': this.$iconOnly(),
        loading: this.$loading(),
        fluid: this.hasFluid(),
        rounded: this.rounded(),
        raised: this.raised(),
        outlined: this.$outlined(),
        text: this.$text(),
        link: this.link(),
        vertical: (this.iconPos() === 'top' || this.iconPos() === 'bottom') && this.$label()
    }), /* @ts-ignore */
    ...(ngDevMode ? [{ debugName: "dataP" }] : /* istanbul ignore next */ []));
    dataIconP = computed(() => this.cn({
        [this.iconPos()]: this.iconPos(),
        [this.size()]: this.size()
    }), /* @ts-ignore */
    ...(ngDevMode ? [{ debugName: "dataIconP" }] : /* istanbul ignore next */ []));
    dataLabelP = computed(() => this.cn({
        [this.size()]: this.size(),
        'icon-only': this.$iconOnly()
    }), /* @ts-ignore */
    ...(ngDevMode ? [{ debugName: "dataLabelP" }] : /* istanbul ignore next */ []));
    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.6", ngImport: i0, type: Button, deps: null, target: i0.ɵɵFactoryTarget.Component });
    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.0.6", type: Button, isStandalone: true, selector: "p-button", inputs: { hostName: { classPropertyName: "hostName", publicName: "hostName", isSignal: true, isRequired: false, transformFunction: null }, type: { classPropertyName: "type", publicName: "type", isSignal: true, isRequired: false, transformFunction: null }, badge: { classPropertyName: "badge", publicName: "badge", isSignal: true, isRequired: false, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null }, raised: { classPropertyName: "raised", publicName: "raised", isSignal: true, isRequired: false, transformFunction: null }, rounded: { classPropertyName: "rounded", publicName: "rounded", isSignal: true, isRequired: false, transformFunction: null }, text: { classPropertyName: "text", publicName: "text", isSignal: true, isRequired: false, transformFunction: null }, plain: { classPropertyName: "plain", publicName: "plain", isSignal: true, isRequired: false, transformFunction: null }, outlined: { classPropertyName: "outlined", publicName: "outlined", isSignal: true, isRequired: false, transformFunction: null }, link: { classPropertyName: "link", publicName: "link", isSignal: true, isRequired: false, transformFunction: null }, tabindex: { classPropertyName: "tabindex", publicName: "tabindex", isSignal: true, isRequired: false, transformFunction: null }, size: { classPropertyName: "size", publicName: "size", isSignal: true, isRequired: false, transformFunction: null }, variant: { classPropertyName: "variant", publicName: "variant", isSignal: true, isRequired: false, transformFunction: null }, style: { classPropertyName: "style", publicName: "style", isSignal: true, isRequired: false, transformFunction: null }, styleClass: { classPropertyName: "styleClass", publicName: "styleClass", isSignal: true, isRequired: false, transformFunction: null }, badgeSeverity: { classPropertyName: "badgeSeverity", publicName: "badgeSeverity", isSignal: true, isRequired: false, transformFunction: null }, ariaLabel: { classPropertyName: "ariaLabel", publicName: "ariaLabel", isSignal: true, isRequired: false, transformFunction: null }, autofocus: { classPropertyName: "autofocus", publicName: "autofocus", isSignal: true, isRequired: false, transformFunction: null }, iconPos: { classPropertyName: "iconPos", publicName: "iconPos", isSignal: true, isRequired: false, transformFunction: null }, icon: { classPropertyName: "icon", publicName: "icon", isSignal: true, isRequired: false, transformFunction: null }, label: { classPropertyName: "label", publicName: "label", isSignal: true, isRequired: false, transformFunction: null }, loading: { classPropertyName: "loading", publicName: "loading", isSignal: true, isRequired: false, transformFunction: null }, loadingIcon: { classPropertyName: "loadingIcon", publicName: "loadingIcon", isSignal: true, isRequired: false, transformFunction: null }, severity: { classPropertyName: "severity", publicName: "severity", isSignal: true, isRequired: false, transformFunction: null }, buttonProps: { classPropertyName: "buttonProps", publicName: "buttonProps", isSignal: true, isRequired: false, transformFunction: null }, fluid: { classPropertyName: "fluid", publicName: "fluid", isSignal: true, isRequired: false, transformFunction: null }, iconOnly: { classPropertyName: "iconOnly", publicName: "iconOnly", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { onClick: "onClick", onFocus: "onFocus", onBlur: "onBlur" }, providers: [ButtonStyle, { provide: BUTTON_INSTANCE, useExisting: Button }, { provide: PARENT_INSTANCE, useExisting: Button }], queries: [{ propertyName: "contentTemplate", first: true, predicate: ["content"], isSignal: true }, { propertyName: "loadingIconTemplate", first: true, predicate: ["loadingicon"], isSignal: true }, { propertyName: "iconTemplate", first: true, predicate: ["icon"], isSignal: true }], usesInheritance: true, hostDirectives: [{ directive: i1.Bind }], ngImport: i0, template: `
        <button
            [attr.type]="$type()"
            [attr.aria-label]="$ariaLabel()"
            [style]="mergedStyle()"
            [disabled]="$disabled()"
            [class]="cn(cx('root'), styleClass(), buttonProps()?.styleClass)"
            (click)="onClick.emit($event)"
            (focus)="onFocus.emit($event)"
            (blur)="onBlur.emit($event)"
            pRipple
            [attr.tabindex]="$tabindex()"
            [pAutoFocus]="$autofocus()"
            [pBind]="ptm('root')"
            [attr.data-p]="dataP()"
            [attr.data-p-disabled]="$disabled()"
            [attr.data-p-severity]="$severity()"
        >
            <ng-content />
            <ng-container *ngTemplateOutlet="contentTemplate()" />
            @if ($loading()) {
                @if (!loadingIconTemplate()) {
                    @if ($loadingIcon()) {
                        <span [class]="cn(cx('loadingIcon'), 'pi-spin', $loadingIcon())" [pBind]="ptm('loadingIcon')" [attr.aria-hidden]="true"></span>
                    } @else {
                        <svg data-p-icon="spinner" [class]="cn(cx('loadingIcon'), cx('spinnerIcon'))" [spin]="true" [pBind]="ptm('loadingIcon')" [attr.aria-hidden]="true" />
                    }
                } @else {
                    <ng-container *ngTemplateOutlet="loadingIconTemplate(); context: getLoadingIconTemplateContext()" />
                }
            }
            @if (!$loading()) {
                @if ($icon() && !iconTemplate()) {
                    <span [class]="cn(cx('icon'), $icon())" [pBind]="ptm('icon')" [attr.data-p]="dataIconP()"></span>
                }
                @if (!icon() && iconTemplate()) {
                    <ng-container *ngTemplateOutlet="iconTemplate(); context: getIconTemplateContext()" />
                }
            }
            @if (showLabel()) {
                <span [class]="cx('label')" [attr.aria-hidden]="$icon() && !$label()" [pBind]="ptm('label')" [attr.data-p]="dataLabelP()">{{ $label() }}</span>
            }
            @if (showBadge()) {
                <p-badge [value]="$badge()" [severity]="$badgeSeverity()" [pt]="ptm('pcBadge')" [unstyled]="unstyled()" />
            }
        </button>
    `, isInline: true, dependencies: [{ kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: Ripple, selector: "[pRipple]" }, { kind: "directive", type: AutoFocus, selector: "[pAutoFocus]", inputs: ["pAutoFocus"] }, { kind: "component", type: Spinner, selector: "svg[data-p-icon=\"spinner\"]" }, { kind: "ngmodule", type: BadgeModule }, { kind: "component", type: i2.Badge, selector: "p-badge", inputs: ["badgeSize", "size", "severity", "value", "badgeDisabled"] }, { kind: "directive", type: Bind, selector: "[pBind]", inputs: ["pBind"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.6", ngImport: i0, type: Button, decorators: [{
            type: Component,
            args: [{
                    selector: 'p-button',
                    standalone: true,
                    imports: [NgTemplateOutlet, Ripple, AutoFocus, Spinner, BadgeModule, Bind],
                    template: `
        <button
            [attr.type]="$type()"
            [attr.aria-label]="$ariaLabel()"
            [style]="mergedStyle()"
            [disabled]="$disabled()"
            [class]="cn(cx('root'), styleClass(), buttonProps()?.styleClass)"
            (click)="onClick.emit($event)"
            (focus)="onFocus.emit($event)"
            (blur)="onBlur.emit($event)"
            pRipple
            [attr.tabindex]="$tabindex()"
            [pAutoFocus]="$autofocus()"
            [pBind]="ptm('root')"
            [attr.data-p]="dataP()"
            [attr.data-p-disabled]="$disabled()"
            [attr.data-p-severity]="$severity()"
        >
            <ng-content />
            <ng-container *ngTemplateOutlet="contentTemplate()" />
            @if ($loading()) {
                @if (!loadingIconTemplate()) {
                    @if ($loadingIcon()) {
                        <span [class]="cn(cx('loadingIcon'), 'pi-spin', $loadingIcon())" [pBind]="ptm('loadingIcon')" [attr.aria-hidden]="true"></span>
                    } @else {
                        <svg data-p-icon="spinner" [class]="cn(cx('loadingIcon'), cx('spinnerIcon'))" [spin]="true" [pBind]="ptm('loadingIcon')" [attr.aria-hidden]="true" />
                    }
                } @else {
                    <ng-container *ngTemplateOutlet="loadingIconTemplate(); context: getLoadingIconTemplateContext()" />
                }
            }
            @if (!$loading()) {
                @if ($icon() && !iconTemplate()) {
                    <span [class]="cn(cx('icon'), $icon())" [pBind]="ptm('icon')" [attr.data-p]="dataIconP()"></span>
                }
                @if (!icon() && iconTemplate()) {
                    <ng-container *ngTemplateOutlet="iconTemplate(); context: getIconTemplateContext()" />
                }
            }
            @if (showLabel()) {
                <span [class]="cx('label')" [attr.aria-hidden]="$icon() && !$label()" [pBind]="ptm('label')" [attr.data-p]="dataLabelP()">{{ $label() }}</span>
            }
            @if (showBadge()) {
                <p-badge [value]="$badge()" [severity]="$badgeSeverity()" [pt]="ptm('pcBadge')" [unstyled]="unstyled()" />
            }
        </button>
    `,
                    changeDetection: ChangeDetectionStrategy.OnPush,
                    encapsulation: ViewEncapsulation.None,
                    providers: [ButtonStyle, { provide: BUTTON_INSTANCE, useExisting: Button }, { provide: PARENT_INSTANCE, useExisting: Button }],
                    hostDirectives: [Bind]
                }]
        }], propDecorators: { hostName: [{ type: i0.Input, args: [{ isSignal: true, alias: "hostName", required: false }] }], type: [{ type: i0.Input, args: [{ isSignal: true, alias: "type", required: false }] }], badge: [{ type: i0.Input, args: [{ isSignal: true, alias: "badge", required: false }] }], disabled: [{ type: i0.Input, args: [{ isSignal: true, alias: "disabled", required: false }] }], raised: [{ type: i0.Input, args: [{ isSignal: true, alias: "raised", required: false }] }], rounded: [{ type: i0.Input, args: [{ isSignal: true, alias: "rounded", required: false }] }], text: [{ type: i0.Input, args: [{ isSignal: true, alias: "text", required: false }] }], plain: [{ type: i0.Input, args: [{ isSignal: true, alias: "plain", required: false }] }], outlined: [{ type: i0.Input, args: [{ isSignal: true, alias: "outlined", required: false }] }], link: [{ type: i0.Input, args: [{ isSignal: true, alias: "link", required: false }] }], tabindex: [{ type: i0.Input, args: [{ isSignal: true, alias: "tabindex", required: false }] }], size: [{ type: i0.Input, args: [{ isSignal: true, alias: "size", required: false }] }], variant: [{ type: i0.Input, args: [{ isSignal: true, alias: "variant", required: false }] }], style: [{ type: i0.Input, args: [{ isSignal: true, alias: "style", required: false }] }], styleClass: [{ type: i0.Input, args: [{ isSignal: true, alias: "styleClass", required: false }] }], badgeSeverity: [{ type: i0.Input, args: [{ isSignal: true, alias: "badgeSeverity", required: false }] }], ariaLabel: [{ type: i0.Input, args: [{ isSignal: true, alias: "ariaLabel", required: false }] }], autofocus: [{ type: i0.Input, args: [{ isSignal: true, alias: "autofocus", required: false }] }], iconPos: [{ type: i0.Input, args: [{ isSignal: true, alias: "iconPos", required: false }] }], icon: [{ type: i0.Input, args: [{ isSignal: true, alias: "icon", required: false }] }], label: [{ type: i0.Input, args: [{ isSignal: true, alias: "label", required: false }] }], loading: [{ type: i0.Input, args: [{ isSignal: true, alias: "loading", required: false }] }], loadingIcon: [{ type: i0.Input, args: [{ isSignal: true, alias: "loadingIcon", required: false }] }], severity: [{ type: i0.Input, args: [{ isSignal: true, alias: "severity", required: false }] }], buttonProps: [{ type: i0.Input, args: [{ isSignal: true, alias: "buttonProps", required: false }] }], fluid: [{ type: i0.Input, args: [{ isSignal: true, alias: "fluid", required: false }] }], iconOnly: [{ type: i0.Input, args: [{ isSignal: true, alias: "iconOnly", required: false }] }], onClick: [{ type: i0.Output, args: ["onClick"] }], onFocus: [{ type: i0.Output, args: ["onFocus"] }], onBlur: [{ type: i0.Output, args: ["onBlur"] }], contentTemplate: [{ type: i0.ContentChild, args: ['content', { ...{ descendants: false }, isSignal: true }] }], loadingIconTemplate: [{ type: i0.ContentChild, args: ['loadingicon', { ...{ descendants: false }, isSignal: true }] }], iconTemplate: [{ type: i0.ContentChild, args: ['icon', { ...{ descendants: false }, isSignal: true }] }] } });

const BUTTON_ICON_INSTANCE = new InjectionToken('BUTTON_ICON_INSTANCE');
/**
 * ButtonIcon is a directive to apply icon styling to an element inside a button.
 *
 * @deprecated Since v21. Place the icon (`<svg>`, `<i>`, or any element) directly
 * inside the `[pButton]` host — use the `iconOnly` prop to enable icon-only styling.
 * The `pButtonIcon` directive will be removed in a future major release.
 *
 * @group Directives
 */
class ButtonIcon extends BaseComponent {
    componentName = 'ButtonIcon';
    /**
     * Used to pass attributes to DOM elements inside the pButtonIcon.
     * @defaultValue undefined
     * @group Props
     */
    pButtonIconPT = input(/* @ts-ignore */
    ...(ngDevMode ? [undefined, { debugName: "pButtonIconPT" }] : /* istanbul ignore next */ []));
    /**
     * Indicates whether the component should be rendered without styles.
     * @defaultValue undefined
     * @group Props
     */
    pButtonUnstyled = input(/* @ts-ignore */
    ...(ngDevMode ? [undefined, { debugName: "pButtonUnstyled" }] : /* istanbul ignore next */ []));
    $pcButtonIcon = inject(BUTTON_ICON_INSTANCE, { optional: true, skipSelf: true }) ?? undefined;
    bindDirectiveInstance = inject(Bind, { self: true });
    constructor() {
        super();
        effect(() => {
            const pt = this.pButtonIconPT();
            pt && this.directivePT.set(pt);
        });
        effect(() => {
            this.pButtonUnstyled() && this.directiveUnstyled.set(this.pButtonUnstyled());
        });
    }
    onAfterViewChecked() {
        this.bindDirectiveInstance.setAttrs(this.ptms(['host', 'root']));
    }
    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.6", ngImport: i0, type: ButtonIcon, deps: [], target: i0.ɵɵFactoryTarget.Directive });
    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "22.0.6", type: ButtonIcon, isStandalone: true, selector: "[pButtonIcon]", inputs: { pButtonIconPT: { classPropertyName: "pButtonIconPT", publicName: "pButtonIconPT", isSignal: true, isRequired: false, transformFunction: null }, pButtonUnstyled: { classPropertyName: "pButtonUnstyled", publicName: "pButtonUnstyled", isSignal: true, isRequired: false, transformFunction: null } }, host: { properties: { "class.p-button-icon": "!$unstyled() && true" } }, providers: [ButtonStyle, { provide: BUTTON_ICON_INSTANCE, useExisting: ButtonIcon }, { provide: PARENT_INSTANCE, useExisting: ButtonIcon }], usesInheritance: true, hostDirectives: [{ directive: i1.Bind }], ngImport: i0 });
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.6", ngImport: i0, type: ButtonIcon, decorators: [{
            type: Directive,
            args: [{
                    selector: '[pButtonIcon]',
                    providers: [ButtonStyle, { provide: BUTTON_ICON_INSTANCE, useExisting: ButtonIcon }, { provide: PARENT_INSTANCE, useExisting: ButtonIcon }],
                    standalone: true,
                    host: {
                        '[class.p-button-icon]': '!$unstyled() && true'
                    },
                    hostDirectives: [Bind]
                }]
        }], ctorParameters: () => [], propDecorators: { pButtonIconPT: [{ type: i0.Input, args: [{ isSignal: true, alias: "pButtonIconPT", required: false }] }], pButtonUnstyled: [{ type: i0.Input, args: [{ isSignal: true, alias: "pButtonUnstyled", required: false }] }] } });

const BUTTON_LABEL_INSTANCE = new InjectionToken('BUTTON_LABEL_INSTANCE');
/**
 * ButtonLabel is a directive to apply label styling to an element inside a button.
 *
 * @deprecated Since v21. Place the label text directly inside the `[pButton]` host.
 * The `pButtonLabel` directive will be removed in a future major release.
 *
 * @group Directives
 */
class ButtonLabel extends BaseComponent {
    componentName = 'ButtonLabel';
    /**
     * Used to pass attributes to DOM elements inside the pButtonLabel.
     * @defaultValue undefined
     * @group Props
     */
    pButtonLabelPT = input(/* @ts-ignore */
    ...(ngDevMode ? [undefined, { debugName: "pButtonLabelPT" }] : /* istanbul ignore next */ []));
    /**
     * Indicates whether the component should be rendered without styles.
     * @defaultValue undefined
     * @group Props
     */
    pButtonLabelUnstyled = input(/* @ts-ignore */
    ...(ngDevMode ? [undefined, { debugName: "pButtonLabelUnstyled" }] : /* istanbul ignore next */ []));
    $pcButtonLabel = inject(BUTTON_LABEL_INSTANCE, { optional: true, skipSelf: true }) ?? undefined;
    bindDirectiveInstance = inject(Bind, { self: true });
    constructor() {
        super();
        effect(() => {
            const pt = this.pButtonLabelPT();
            pt && this.directivePT.set(pt);
        });
        effect(() => {
            this.pButtonLabelUnstyled() && this.directiveUnstyled.set(this.pButtonLabelUnstyled());
        });
    }
    onAfterViewChecked() {
        this.bindDirectiveInstance.setAttrs(this.ptms(['host', 'root']));
    }
    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.6", ngImport: i0, type: ButtonLabel, deps: [], target: i0.ɵɵFactoryTarget.Directive });
    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "22.0.6", type: ButtonLabel, isStandalone: true, selector: "[pButtonLabel]", inputs: { pButtonLabelPT: { classPropertyName: "pButtonLabelPT", publicName: "pButtonLabelPT", isSignal: true, isRequired: false, transformFunction: null }, pButtonLabelUnstyled: { classPropertyName: "pButtonLabelUnstyled", publicName: "pButtonLabelUnstyled", isSignal: true, isRequired: false, transformFunction: null } }, host: { properties: { "class.p-button-label": "!$unstyled() && true" } }, providers: [ButtonStyle, { provide: BUTTON_LABEL_INSTANCE, useExisting: ButtonLabel }, { provide: PARENT_INSTANCE, useExisting: ButtonLabel }], usesInheritance: true, hostDirectives: [{ directive: i1.Bind }], ngImport: i0 });
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.6", ngImport: i0, type: ButtonLabel, decorators: [{
            type: Directive,
            args: [{
                    selector: '[pButtonLabel]',
                    providers: [ButtonStyle, { provide: BUTTON_LABEL_INSTANCE, useExisting: ButtonLabel }, { provide: PARENT_INSTANCE, useExisting: ButtonLabel }],
                    standalone: true,
                    host: {
                        '[class.p-button-label]': '!$unstyled() && true'
                    },
                    hostDirectives: [Bind]
                }]
        }], ctorParameters: () => [], propDecorators: { pButtonLabelPT: [{ type: i0.Input, args: [{ isSignal: true, alias: "pButtonLabelPT", required: false }] }], pButtonLabelUnstyled: [{ type: i0.Input, args: [{ isSignal: true, alias: "pButtonLabelUnstyled", required: false }] }] } });

const BUTTON_DIRECTIVE_INSTANCE = new InjectionToken('BUTTON_DIRECTIVE_INSTANCE');
/**
 * Button directive is an extension to button component.
 * @group Directives
 */
class ButtonDirective extends BaseComponent {
    componentName = 'Button';
    /**
     * Bound configuration object. Fields win over the individual styling inputs
     * (`text`, `raised`, `severity`, …); unset fields fall back to those inputs.
     * @group Props
     */
    pButton = input(undefined, { ...(ngDevMode ? { debugName: "pButton" } : /* istanbul ignore next */ {}), alias: 'pButton' });
    /**
     * Used to pass attributes to DOM elements inside the Button component.
     * @group Props
     */
    pButtonPT = input(/* @ts-ignore */
    ...(ngDevMode ? [undefined, { debugName: "pButtonPT" }] : /* istanbul ignore next */ []));
    /**
     * Indicates whether the component should be rendered without styles.
     * @group Props
     */
    pButtonUnstyled = input(/* @ts-ignore */
    ...(ngDevMode ? [undefined, { debugName: "pButtonUnstyled" }] : /* istanbul ignore next */ []));
    /**
     * @group Props
     */
    hostName = input('', /* @ts-ignore */
    ...(ngDevMode ? [{ debugName: "hostName" }] : /* istanbul ignore next */ []));
    /**
     * Add a textual class to the button without a background initially.
     * @group Props
     */
    text = input(false, { ...(ngDevMode ? { debugName: "text" } : /* istanbul ignore next */ {}), transform: booleanAttribute });
    /**
     * Add a plain textual class to the button without a background initially.
     * @group Props
     */
    plain = input(false, { ...(ngDevMode ? { debugName: "plain" } : /* istanbul ignore next */ {}), transform: booleanAttribute });
    /**
     * Add a shadow to indicate elevation.
     * @group Props
     */
    raised = input(false, { ...(ngDevMode ? { debugName: "raised" } : /* istanbul ignore next */ {}), transform: booleanAttribute });
    /**
     * Defines the size of the button.
     * @group Props
     */
    size = input(/* @ts-ignore */
    ...(ngDevMode ? [undefined, { debugName: "size" }] : /* istanbul ignore next */ []));
    /**
     * Add a border class without a background initially.
     * @group Props
     */
    outlined = input(false, { ...(ngDevMode ? { debugName: "outlined" } : /* istanbul ignore next */ {}), transform: booleanAttribute });
    /**
     * Renders the button as a textual link without background or border.
     * @group Props
     */
    link = input(false, { ...(ngDevMode ? { debugName: "link" } : /* istanbul ignore next */ {}), transform: booleanAttribute });
    /**
     * Add a circular border radius to the button.
     * @group Props
     */
    rounded = input(false, { ...(ngDevMode ? { debugName: "rounded" } : /* istanbul ignore next */ {}), transform: booleanAttribute });
    /**
     * Spans 100% width of the container when enabled.
     * @group Props
     */
    fluid = input(undefined, { ...(ngDevMode ? { debugName: "fluid" } : /* istanbul ignore next */ {}), transform: booleanAttribute });
    /**
     * Visual variant of the button. Equivalent to setting `text` or `outlined` individually.
     * @group Props
     */
    variant = input(/* @ts-ignore */
    ...(ngDevMode ? [undefined, { debugName: "variant" }] : /* istanbul ignore next */ []));
    /**
     * Forces icon-only styling regardless of content. Works with any direct icon child
     * (`<svg>`, `<i>`, custom).
     * @group Props
     */
    iconOnly = input(false, { ...(ngDevMode ? { debugName: "iconOnly" } : /* istanbul ignore next */ {}), transform: booleanAttribute });
    /**
     * Whether the button is in loading state.
     * @deprecated Manage loading state with native `disabled` and a child spinner; this input will be removed in a future release.
     * @group Props
     */
    loading = input(false, { ...(ngDevMode ? { debugName: "loading" } : /* istanbul ignore next */ {}), transform: booleanAttribute });
    /**
     * Defines the style of the button.
     * @group Props
     */
    severity = input(/* @ts-ignore */
    ...(ngDevMode ? [undefined, { debugName: "severity" }] : /* istanbul ignore next */ []));
    $pcButtonDirective = inject(BUTTON_DIRECTIVE_INSTANCE, { optional: true, skipSelf: true }) ?? undefined;
    bindDirectiveInstance = inject(Bind, { self: true });
    pcFluid = inject(Fluid, { optional: true, host: true, skipSelf: true });
    _componentStyle = inject(ButtonStyle);
    iconSignal = contentChild(ButtonIcon, { ...(ngDevMode ? { debugName: "iconSignal" } : /* istanbul ignore next */ {}), descendants: false });
    labelSignal = contentChild(ButtonLabel, { ...(ngDevMode ? { debugName: "labelSignal" } : /* istanbul ignore next */ {}), descendants: false });
    /** @deprecated Use the `iconOnly` input instead. */
    isIconOnly = computed(() => !!(!this.labelSignal() && this.iconSignal()), /* @ts-ignore */
    ...(ngDevMode ? [{ debugName: "isIconOnly" }] : /* istanbul ignore next */ []));
    styleClass = computed(() => {
        if (this.$unstyled())
            return '';
        const v = this.pButton();
        const o = typeof v === 'object' && v !== null ? v : {};
        // Options-object fields win over the individual styling inputs; a bare string value is a severity shortcut.
        const stringSeverity = typeof v === 'string' && v !== '' ? v : undefined;
        const severity = o.severity ?? stringSeverity ?? this.severity();
        const size = o.size ?? this.size();
        const variant = o.variant ?? this.variant();
        const base = this.cn('p-button', 'p-component', {
            'p-button-icon-only': this.iconOnly() || o.iconOnly || this.isIconOnly(),
            'p-button-loading': this.loading(),
            'p-disabled': this.loading(),
            'p-button-text': this.text() || variant === 'text' || o.text,
            'p-button-outlined': this.outlined() || variant === 'outlined' || o.outlined,
            'p-button-link': this.link() || variant === 'link' || o.link,
            'p-button-plain': this.plain() || o.plain,
            'p-button-raised': this.raised() || o.raised,
            'p-button-rounded': this.rounded() || o.rounded,
            'p-button-sm': size === 'small',
            'p-button-lg': size === 'large',
            'p-button-fluid': this.fluid() ?? o.fluid ?? !!this.pcFluid,
            [`p-button-${severity}`]: !!severity
        });
        return o.styleClass ? `${base} ${o.styleClass}` : base;
    }, /* @ts-ignore */
    ...(ngDevMode ? [{ debugName: "styleClass" }] : /* istanbul ignore next */ []));
    hostStyle = computed(() => {
        const v = this.pButton();
        const o = typeof v === 'object' && v !== null ? v : {};
        return o.style ?? null;
    }, /* @ts-ignore */
    ...(ngDevMode ? [{ debugName: "hostStyle" }] : /* istanbul ignore next */ []));
    constructor() {
        super();
        effect(() => {
            const pt = this.pButtonPT();
            if (pt)
                this.directivePT.set(pt);
        });
        effect(() => {
            const unstyled = this.pButtonUnstyled();
            if (unstyled !== undefined)
                this.directiveUnstyled.set(unstyled);
        });
    }
    onAfterViewChecked() {
        this.bindDirectiveInstance.setAttrs(this.ptm('root'));
    }
    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.6", ngImport: i0, type: ButtonDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive });
    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.2.0", version: "22.0.6", type: ButtonDirective, isStandalone: true, selector: "[pButton]", inputs: { pButton: { classPropertyName: "pButton", publicName: "pButton", isSignal: true, isRequired: false, transformFunction: null }, pButtonPT: { classPropertyName: "pButtonPT", publicName: "pButtonPT", isSignal: true, isRequired: false, transformFunction: null }, pButtonUnstyled: { classPropertyName: "pButtonUnstyled", publicName: "pButtonUnstyled", isSignal: true, isRequired: false, transformFunction: null }, hostName: { classPropertyName: "hostName", publicName: "hostName", isSignal: true, isRequired: false, transformFunction: null }, text: { classPropertyName: "text", publicName: "text", isSignal: true, isRequired: false, transformFunction: null }, plain: { classPropertyName: "plain", publicName: "plain", isSignal: true, isRequired: false, transformFunction: null }, raised: { classPropertyName: "raised", publicName: "raised", isSignal: true, isRequired: false, transformFunction: null }, size: { classPropertyName: "size", publicName: "size", isSignal: true, isRequired: false, transformFunction: null }, outlined: { classPropertyName: "outlined", publicName: "outlined", isSignal: true, isRequired: false, transformFunction: null }, link: { classPropertyName: "link", publicName: "link", isSignal: true, isRequired: false, transformFunction: null }, rounded: { classPropertyName: "rounded", publicName: "rounded", isSignal: true, isRequired: false, transformFunction: null }, fluid: { classPropertyName: "fluid", publicName: "fluid", isSignal: true, isRequired: false, transformFunction: null }, variant: { classPropertyName: "variant", publicName: "variant", isSignal: true, isRequired: false, transformFunction: null }, iconOnly: { classPropertyName: "iconOnly", publicName: "iconOnly", isSignal: true, isRequired: false, transformFunction: null }, loading: { classPropertyName: "loading", publicName: "loading", isSignal: true, isRequired: false, transformFunction: null }, severity: { classPropertyName: "severity", publicName: "severity", isSignal: true, isRequired: false, transformFunction: null } }, host: { properties: { "class": "styleClass()", "style": "hostStyle()" } }, providers: [ButtonStyle, { provide: BUTTON_DIRECTIVE_INSTANCE, useExisting: ButtonDirective }, { provide: PARENT_INSTANCE, useExisting: ButtonDirective }], queries: [{ propertyName: "iconSignal", first: true, predicate: ButtonIcon, isSignal: true }, { propertyName: "labelSignal", first: true, predicate: ButtonLabel, isSignal: true }], usesInheritance: true, hostDirectives: [{ directive: i1.Bind }, { directive: i2$1.Ripple }], ngImport: i0 });
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.6", ngImport: i0, type: ButtonDirective, decorators: [{
            type: Directive,
            args: [{
                    selector: '[pButton]',
                    standalone: true,
                    providers: [ButtonStyle, { provide: BUTTON_DIRECTIVE_INSTANCE, useExisting: ButtonDirective }, { provide: PARENT_INSTANCE, useExisting: ButtonDirective }],
                    host: {
                        '[class]': 'styleClass()',
                        '[style]': 'hostStyle()'
                    },
                    hostDirectives: [Bind, Ripple]
                }]
        }], ctorParameters: () => [], propDecorators: { pButton: [{ type: i0.Input, args: [{ isSignal: true, alias: "pButton", required: false }] }], pButtonPT: [{ type: i0.Input, args: [{ isSignal: true, alias: "pButtonPT", required: false }] }], pButtonUnstyled: [{ type: i0.Input, args: [{ isSignal: true, alias: "pButtonUnstyled", required: false }] }], hostName: [{ type: i0.Input, args: [{ isSignal: true, alias: "hostName", required: false }] }], text: [{ type: i0.Input, args: [{ isSignal: true, alias: "text", required: false }] }], plain: [{ type: i0.Input, args: [{ isSignal: true, alias: "plain", required: false }] }], raised: [{ type: i0.Input, args: [{ isSignal: true, alias: "raised", required: false }] }], size: [{ t