import { p as proxyCustomElement, H, h } from './p-AiOs8RvA.js';

const verdocsButtonCss = "@-webkit-keyframes verdocs-field-pulse{0%{background-color:rgba(0, 0, 0, 0.35)}50%{background-color:rgba(0, 0, 0, 0)}100%{background-color:rgba(0, 0, 0, 0.35)}}@keyframes verdocs-field-pulse{0%{background-color:rgba(0, 0, 0, 0.35)}50%{background-color:rgba(0, 0, 0, 0)}100%{background-color:rgba(0, 0, 0, 0.35)}}verdocs-button button{font-family:\"Inter\", -apple-system, \"Segoe UI\", \"Roboto\", \"Helvetica Neue\", sans-serif;text-transform:uppercase;-ms-flex-pack:center;justify-content:center;display:-ms-inline-flexbox;display:inline-flex;-ms-flex-align:center;align-items:center;font-weight:700;cursor:pointer;margin:0}verdocs-button button:disabled{cursor:inherit;pointer-events:none}verdocs-button button .icon{margin:0 12px}verdocs-button button .icon svg{fill:#ffffff;display:block}verdocs-button button .button-label{padding:0 12px}verdocs-button button.xsmall{height:26px;font-size:12px}verdocs-button button.xsmall .icon{margin:0 3px}verdocs-button button.xsmall .icon svg{margin:2px 0 0 0;height:18px}verdocs-button button.xsmall .button-label{padding:0 4px}verdocs-button button.small{height:34px;font-size:13px}verdocs-button button.small .icon{margin:0 4px}verdocs-button button.small .icon svg{margin:2px 0 0 0;height:20px}verdocs-button button.small .button-label{padding:0 4px}verdocs-button button.normal{height:44px;font-size:14px}verdocs-button button.normal .icon.start{margin:0 4px 0 8px}verdocs-button button.normal .icon.end{margin:0 8px 0 4px}verdocs-button button.normal .icon svg{margin:2px 0 0 0;height:22px}verdocs-button button.normal .button-label{padding:0 10px}verdocs-button button.medium{height:52px;font-size:16px}verdocs-button button.medium .icon.start{margin:0 0 0 18px}verdocs-button button.medium .icon.end{margin:0 18px 0 0}verdocs-button button.medium .icon svg{margin:2px 0 0 0;height:26px}verdocs-button button.medium .button-label{padding:0 20px}verdocs-button button.large{height:60px;font-size:20px}verdocs-button button.large .icon.start{margin:0 0 0 24px}verdocs-button button.large .icon.end{margin:0 24px 0 0}verdocs-button button.large .icon svg{margin:2px 0 0 0;height:32px}verdocs-button button.large .button-label{padding:0 34px}verdocs-button button.standard{background:#55bc81;border-radius:4px;outline:none;border:none;color:white}verdocs-button button.standard:disabled{background-color:#999999;cursor:default}verdocs-button button.standard:active:not([disabled]){-webkit-filter:brightness(110%);filter:brightness(110%)}verdocs-button button.text{color:#4c56cb;background:transparent;font-weight:500;padding:0 4px;outline:none;border:none}verdocs-button button.text:disabled{color:#999999}verdocs-button button.text:active:not([disabled]){-webkit-filter:brightness(130%);filter:brightness(130%)}verdocs-button button.text .icon svg{fill:#4c56cb}verdocs-button button.outline{border:1px solid #4c56cb;color:#4c56cb;outline:none;background:transparent;border-radius:4px;padding:0 20px}verdocs-button button.outline:disabled{color:#999999;border:1px solid #999999}verdocs-button button.outline:active{background:#4c56cb;color:white}verdocs-button button.outline .icon svg{fill:#4c56cb}";

const VerdocsButton = /*@__PURE__*/ proxyCustomElement(class VerdocsButton extends H {
    constructor() {
        super();
        this.__registerHost();
        /**
         * If desired, a prefix icon for the button.
         */
        this.startIcon = null;
        /**
         * If desired, a suffix icon for the button.
         */
        this.endIcon = null;
        /**
         * The size (height) of the button.
         */
        this.size = 'normal';
        /**
         * The type of the button.
         */
        this.type = 'button';
        /**
         * The display variant of the button.
         */
        this.variant = 'standard';
        /**
         * Whether the button should be disabled.
         */
        this.disabled = false;
    }
    render() {
        return (h("button", { key: 'f4f06c9658a8d3dc63380bdc973bdfa96c60cca3', disabled: this.disabled, type: this.type, class: `${this.variant} ${this.size} ${this.type}` }, this.startIcon ? h("span", { class: "icon start", innerHTML: this.startIcon }) : null, h("span", { key: '6a46cd55ec51dec6efa13171a067d6fa15925af3', class: "button-label" }, this.label), this.endIcon ? h("span", { class: "icon end", innerHTML: this.endIcon }) : null));
    }
    static get style() { return verdocsButtonCss; }
}, [0, "verdocs-button", {
        "label": [1],
        "startIcon": [1, "start-icon"],
        "endIcon": [1, "end-icon"],
        "size": [1],
        "type": [1],
        "variant": [1],
        "disabled": [4]
    }]);
function defineCustomElement() {
    if (typeof customElements === "undefined") {
        return;
    }
    const components = ["verdocs-button"];
    components.forEach(tagName => { switch (tagName) {
        case "verdocs-button":
            if (!customElements.get(tagName)) {
                customElements.define(tagName, VerdocsButton);
            }
            break;
    } });
}

export { VerdocsButton as V, defineCustomElement as d };
//# sourceMappingURL=p-DMVmShTi.js.map

//# sourceMappingURL=p-DMVmShTi.js.map