'use strict';

Object.defineProperty(exports, '__esModule', { value: true });

const index = require('./index-c18b5a7b.js');
const pdsLabel = require('./pds-label-a3b0188d.js');

const pdsRadioCss = ".sc-pds-radio-h{--background-color:var(--pine-color-base-white);--background-color-hover:var(--pine-color-neutral-grey-100);--background-color-disabled:var(--pine-color-neutral-grey-200);--border:var(--pine-border-interactive);--border-color-hover:var(--pine-border-interactive-hover-color);--border-color-disabled:var(--pine-color-neutral-grey-300);--border-radius:50%;--color:var(--pine-color-neutral-charcoal-200);--color-checked:var(--pine-color-neutral-charcoal-500);--color-disabled:var(--pine-color-neutral-grey-500);--color-focus:var(--pine-color-primary-200);--color-invalid:var(--pine-color-red-300);--color-invalid-focus:var(--pine-color-red-200);--font-size:var(--pine-font-size-body-sm);--input-size:16px;--check-size:6px;-ms-flex-align:center;align-items:center;display:-ms-flexbox;display:flex;-ms-flex-flow:row wrap;flex-flow:row wrap}.is-invalid.sc-pds-radio-h input.sc-pds-radio{border-color:var(--color-invalid)}.is-invalid.sc-pds-radio-h input.sc-pds-radio:checked{background:var(--color-invalid)}.is-invalid.sc-pds-radio-h input.sc-pds-radio:focus-visible{-webkit-box-shadow:0 0 0 4px var(--color-invalid-focus);box-shadow:0 0 0 4px var(--color-invalid-focus);outline:none}.is-invalid.sc-pds-radio-h label.sc-pds-radio,.is-invalid.sc-pds-radio-h .pds-radio__message--error.sc-pds-radio{color:var(--color-invalid)}input.sc-pds-radio{-webkit-appearance:none;-moz-appearance:none;appearance:none;border:var(--border);border-radius:var(--border-radius);height:var(--input-size);margin:0;position:relative;width:var(--input-size)}input.sc-pds-radio:hover{background:var(--background-color-hover);border-color:var(--border-color-hover)}input.sc-pds-radio:checked{background:var(--color-checked);border-color:var(--color-checked)}input.sc-pds-radio:checked::after{background:var(--background-color);border-radius:50%;content:\"\";display:block;height:var(--check-size);left:50%;position:absolute;top:50%;-webkit-transform:translate(-50%, -50%);transform:translate(-50%, -50%);width:var(--check-size)}input.sc-pds-radio:disabled{background:var(--background-color-disabled);border-color:var(--border-color-disabled);cursor:not-allowed}input.sc-pds-radio:disabled:checked{background:var(--color-disabled);border-color:var(--border-color-disabled)}input.sc-pds-radio:disabled:checked::after{border-color:var(--border-color-disabled)}input.sc-pds-radio:disabled+label.sc-pds-radio{color:var(--border-color-hover);cursor:not-allowed}input.sc-pds-radio:disabled~.pds-radio__message.sc-pds-radio{color:var(--color-disabled)}input.sc-pds-radio:focus-visible{-webkit-box-shadow:0 0 0 4px var(--color-focus);box-shadow:0 0 0 4px var(--color-focus);outline:none}label.sc-pds-radio{-webkit-margin-start:10px;margin-inline-start:10px}.pds-radio__message.sc-pds-radio{color:var(--color);font-size:var(--font-size);-webkit-margin-before:var(--check-size);margin-block-start:var(--check-size);-webkit-margin-start:26px;margin-inline-start:26px;width:100%}";
const PdsRadioStyle0 = pdsRadioCss;

const PdsRadio = class {
    constructor(hostRef) {
        index.registerInstance(this, hostRef);
        this.pdsRadioChange = index.createEvent(this, "pdsRadioChange", 7);
        this.handleRadioChange = (e) => {
            if (this.disabled) {
                return;
            }
            const target = e.target;
            const isChecked = target.checked;
            this.pdsRadioChange.emit(isChecked);
        };
        this.checked = false;
        this.disabled = false;
        this.errorMessage = undefined;
        this.invalid = false;
        this.componentId = undefined;
        this.label = undefined;
        this.helperMessage = undefined;
        this.name = undefined;
        this.required = false;
        this.value = undefined;
    }
    classNames() {
        const classNames = [];
        if (this.invalid) {
            classNames.push('is-invalid');
        }
        if (this.disabled) {
            classNames.push('is-disabled');
        }
        return classNames.join('  ');
    }
    render() {
        return (index.h(index.Host, { key: '7aa805bfda81bb1a04093b9733473cddc935ea65', class: this.classNames() }, index.h("input", { key: '907fba6999a8a781133f91c139829f417ffd3f80', "aria-describedby": pdsLabel.assignDescription(this.componentId, this.invalid, this.helperMessage), "aria-invalid": this.invalid ? "true" : undefined, type: "radio", id: this.componentId, name: this.name, value: this.value, checked: this.checked, required: this.required, disabled: this.disabled, onChange: this.handleRadioChange }), index.h(pdsLabel.PdsLabel, { key: '72a62cc41ed4d9a4313442fe457901a6d0a194d3', htmlFor: this.componentId, text: this.label }), this.helperMessage &&
            index.h("div", { class: 'pds-radio__message', id: pdsLabel.messageId(this.componentId, 'helper') }, this.helperMessage), this.errorMessage &&
            index.h("div", { class: `pds-radio__message pds-radio__message--error`, id: pdsLabel.messageId(this.componentId, 'error'), "aria-live": "assertive" }, this.errorMessage)));
    }
};
PdsRadio.style = PdsRadioStyle0;

exports.pds_radio = PdsRadio;

//# sourceMappingURL=pds-radio.cjs.entry.js.map