/**
 * @license
 * Copyright Tyler Technologies, Inc. 
 * License: Apache-2.0
 */
import { __decorate } from "tslib";
import { attachShadowTemplate, coerceBoolean, CustomElement, FoundationProperty } from '@tylertech/forge-core';
import { getFormState, getFormValue, inputType, setDefaultAria } from '../../constants';
import { BaseComponent } from '../../core/base/base-component';
import { WithFocusable } from '../../core/mixins/focus/with-focusable';
import { WithFormAssociation } from '../../core/mixins/form/with-form-associated';
import { WithDefaultAria } from '../../core/mixins/internals/with-default-aria';
import { WithElementInternals } from '../../core/mixins/internals/with-element-internals';
import { WithLabelAwareness } from '../../core/mixins/label/with-label-aware';
import { FocusIndicatorComponent } from '../../focus-indicator';
import { StateLayerComponent } from '../../state-layer';
import { RadioGroupManager } from '../core/radio-group-manager';
import { RadioAdapter } from './radio-adapter';
import { RADIO_CONSTANTS, tryCheck } from './radio-constants';
import { RadioFoundation } from './radio-foundation';
const template = '<template><div id=\"radio\" class=\"forge-radio\" part=\"root\"><div id=\"container\" class=\"container\" aria-hidden=\"true\"><div id=\"background\" class=\"background\" part=\"background\"></div><forge-focus-indicator target=\":host\" part=\"focus-indicator\"></forge-focus-indicator><forge-state-layer exportparts=\"surface:state-layer\"></forge-state-layer></div><span id=\"label\" class=\"label\" for=\"input\" part=\"label\"><slot></slot></span></div></template>';
const styles = ':host{display:inline-block;-webkit-tap-highlight-color:transparent}:host([hidden]){display:none}:host(:focus){outline:0}.forge-radio{--_radio-primary-color:var(--forge-radio-primary-color, var(--forge-theme-tertiary, #3d5afe));--_radio-inactive-color:var(--forge-radio-inactive-color, var(--forge-theme-surface-container-high, #9e9e9e));--_radio-size:var(--forge-radio-size, 20px);--_radio-mark-size:var(--forge-radio-mark-size, 12px);--_radio-state-layer-size:var(--forge-radio-state-layer-size, 40px);--_radio-state-layer-dense-size:var(--forge-radio-state-layer-dense-size, 24px);--_radio-width:var(--forge-radio-width, var(--_radio-size));--_radio-height:var(--forge-radio-height, var(--_radio-size));--_radio-border-width:var(--forge-radio-border-width, var(--forge-border-medium, 2px));--_radio-unchecked-border-color:var(--forge-radio-unchecked-border-color, var(--_radio-inactive-color));--_radio-checked-border-color:var(--forge-radio-checked-border-color, var(--_radio-primary-color));--_radio-background:var(--forge-radio-background, transparent);--_radio-shape:var(--forge-radio-shape, var(--forge-shape-round, 50%));--_radio-mark-width:var(--forge-radio-mark-width, var(--_radio-mark-size));--_radio-mark-height:var(--forge-radio-mark-height, var(--_radio-mark-size));--_radio-mark-unchecked-color:var(--forge-radio-mark-unchecked-color, var(--_radio-inactive-color));--_radio-mark-checked-color:var(--forge-radio-mark-checked-color, var(--_radio-primary-color));--_radio-mark-unchecked-background:var(--forge-radio-mark-unchecked-background, transparent);--_radio-mark-checked-background:var(--forge-radio-mark-checked-background, transparent);--_radio-gap:var(--forge-radio-gap, 0);--_radio-justify:var(--forge-radio-justify, start);--_radio-direction:var(--forge-radio-direction, initial);--_radio-state-layer-width:var(--forge-radio-state-layer-width, var(--_radio-state-layer-size));--_radio-state-layer-height:var(--forge-radio-state-layer-height, var(--_radio-state-layer-size));--_radio-state-layer-unchecked-color:var(--forge-radio-state-layer-unchecked-color, var(--_radio-color));--_radio-state-layer-checked-color:var(--forge-radio-state-layer-checked-color, var(--_radio-primary-color));--_radio-state-layer-shape:var(--forge-radio-state-layer-shape, var(--_radio-shape));--_radio-state-layer-dense-width:var(--forge-radio-state-layer-dense-width, var(--_radio-state-layer-dense-size));--_radio-state-layer-dense-height:var(--forge-radio-state-layer-dense-height, var(--_radio-state-layer-dense-size));--_radio-disabled-opacity:var(--forge-radio-disabled-opacity, 0.38);--_radio-animation-duration:var(--forge-radio-animation-duration, var(--forge-animation-duration-short4, 200ms));--_radio-animation-timing-function:var(--forge-radio-animation-timing-function, var(--forge-animation-easing-decelerate, cubic-bezier(0, 0, 0, 1)));--_radio-animation-delay:var(--forge-radio-animation-delay, 0ms)}.forge-radio{position:relative;-webkit-box-orient:vertical;-webkit-box-direction:normal;flex-direction:var(--_radio-direction);flex-shrink:0;-webkit-box-align:center;align-items:center;-webkit-box-pack:var(--_radio-justify);justify-content:var(--_radio-justify);gap:var(--_radio-gap);display:-webkit-box;display:flex}.forge-radio .container{position:relative;-webkit-box-align:center;align-items:center;-webkit-box-pack:center;justify-content:center;display:-webkit-box;display:flex;border-radius:var(--_radio-shape);inline-size:var(--_radio-state-layer-width);block-size:var(--_radio-state-layer-height);cursor:pointer}.forge-radio .background{position:relative;-webkit-box-align:center;align-items:center;-webkit-box-pack:center;justify-content:center;display:-webkit-box;display:flex;overflow:hidden;-webkit-transition-duration:var(--_radio-animation-duration);transition-duration:var(--_radio-animation-duration);-webkit-transition-delay:var(--_radio-animation-delay);transition-delay:var(--_radio-animation-delay);-webkit-transition-timing-function:var(--_radio-animation-timing-function);transition-timing-function:var(--_radio-animation-timing-function);-webkit-transition-property:border-color;transition-property:border-color;-webkit-box-sizing:border-box;box-sizing:border-box;border-radius:var(--_radio-shape);border-width:var(--_radio-border-width);border-style:solid;border-color:var(--_radio-unchecked-border-color);inline-size:var(--_radio-width);block-size:var(--_radio-height);background:var(--_radio-background)}.forge-radio .background::after{content:\"\";position:absolute;contain:strict;-webkit-transition-duration:var(--_radio-animation-duration);transition-duration:var(--_radio-animation-duration);-webkit-transition-delay:var(--_radio-animation-delay);transition-delay:var(--_radio-animation-delay);-webkit-transition-timing-function:var(--_radio-animation-timing-function);transition-timing-function:var(--_radio-animation-timing-function);-webkit-transition-property:inline-size,block-size,border-color;transition-property:inline-size,block-size,border-color;border-radius:var(--_radio-shape);border-width:calc(var(--_radio-mark-height)/ 2) calc(var(--_radio-mark-width)/ 2);border-color:var(--_radio-mark-unchecked-color);border-style:solid;inline-size:calc(var(--_radio-width) - 2 * var(--_radio-border-width));block-size:calc(var(--_radio-height) - 2 * var(--_radio-border-width));background:var(--_radio-mark-unchecked-background)}.forge-radio .label{-moz-osx-font-smoothing:grayscale;-webkit-font-smoothing:antialiased;font-family:var(--forge-typography-label1-font-family, var(--forge-typography-font-family, \"Roboto\", sans-serif));font-size:var(--forge-typography-label1-font-size, calc(var(--forge-typography-font-size, 1rem) * var(--forge-typography-label-font-size-scale, .75)));font-weight:var(--forge-typography-label1-font-weight,400);line-height:var(--forge-typography-label1-line-height, calc(var(--forge-typography-font-size, 1rem) * var(--forge-typography-label-line-height-scale, 1.25)));letter-spacing:var(--forge-typography-label1-letter-spacing, .0357142857em);text-transform:var(--forge-typography-label1-text-transform,inherit);-webkit-text-decoration:var(--forge-typography-label1-text-decoration,inherit);text-decoration:var(--forge-typography-label1-text-decoration,inherit);cursor:default}.forge-radio .label:empty{display:none}:host([checked]) .forge-radio .background{border-color:var(--_radio-checked-border-color)}:host([checked]) .forge-radio .background::after{border-color:var(--_radio-mark-checked-color);inline-size:0px;block-size:0px;background:var(--_radio-mark-checked-background)}:host([checked]) forge-state-layer{--forge-state-layer-color:var(--_radio-state-layer-checked-color)}:host([dense]) .forge-radio .container{inline-size:var(--_radio-state-layer-dense-width);block-size:var(--_radio-state-layer-dense-height)}:host([disabled]) .forge-radio{opacity:var(--_radio-disabled-opacity)}:host([disabled]) .forge-radio .container{cursor:not-allowed}:host([readonly]) .forge-radio .container{cursor:not-allowed}forge-focus-indicator{--forge-focus-indicator-color:var(--_radio-primary-color);--forge-focus-indicator-outward-offset:0px;--forge-focus-indicator-shape:var(--_radio-state-layer-shape)}forge-state-layer{--forge-state-layer-color:var(--_radio-state-layer-unchecked-color)}';
const BaseRadioClass = WithFormAssociation(WithLabelAwareness(WithFocusable(WithDefaultAria(WithElementInternals(BaseComponent)))));
/**
 * @tag forge-radio
 *
 * @summary The Forge Radio component is used to create a form input where only one out of a set of
 * values should be selected.
 *
 * @property {boolean} checked - Indicates whether the radio button is checked.
 * @property {boolean} defaultChecked - Indicates whether the radio button is checked by default.
 * @property {string} value - The value of the radio button when submitted.
 * @property {boolean} dense - Indicates whether the radio button should be displayed in a dense layout.
 * @property {boolean} disabled - Indicates whether the radio button is disabled.
 * @property {boolean} required - Indicates whether the radio button is required.
 * @property {boolean} readonly - Indicates whether the radio button is read-only.
 * @property {RadioLabelPosition} labelPosition - The position of the radio button's label.
 *
 * @attribute {boolean} checked - Indicates whether the radio button is checked.
 * @attribute {boolean} default-checked - Indicates whether the radio button is checked by default.
 * @attribute {string} value - The value of the radio button when submitted.
 * @attribute {boolean} dense - Indicates whether the radio button should be displayed in a dense layout.
 * @attribute {boolean} disabled - Indicates whether the radio button is disabled.
 * @attribute {boolean} required - Indicates whether the radio button is required.
 * @attribute {boolean} readonly - Indicates whether the radio button is read-only.
 * @attribute {RadioLabelPosition} label-position - The position of the radio button's label.
 *
 * @cssproperty --forge-radio-primary-color - The primary color of the radio button when checked.
 * @cssproperty --forge-radio-inactive-color - The color of the radio button when unchecked.
 * @cssproperty --forge-radio-size - The size of the radio button in the inline and block directions.
 * @cssproperty --forge-radio-width - The width of the radio button.
 * @cssproperty --forge-radio-height - The height of the radio button.
 * @cssproperty --forge-radio-border-width - The width of the radio button's border.
 * @cssproperty --forge-radio-unchecked-border-color - The color of the radio button's border when unchecked.
 * @cssproperty --forge-radio-checked-border-color - The color of the radio button's border when checked.
 * @cssproperty --forge-radio-background - The background of the radio button.
 * @cssproperty --forge-radio-shape - The shape of the radio button.
 * @cssproperty --forge-radio-mark-size - The size of the radio button's mark in the inline and block directions.
 * @cssproperty --forge-radio-mark-width - The width of the radio button's mark.
 * @cssproperty --forge-radio-mark-height - The height of the radio button's mark.
 * @cssproperty --forge-radio-mark-unchecked-color - The color of the radio button's mark when unchecked.
 * @cssproperty --forge-radio-mark-checked-color - The color of the radio button's mark when checked.
 * @cssproperty --forge-radio-mark-unchecked-background - The background of the radio button's mark when unchecked.
 * @cssproperty --forge-radio-mark-checked-background - The background of the radio button's mark when checked.
 * @cssproperty --forge-radio-gap - The gap between the radio button and its label.
 * @cssproperty --forge-radio-justify - The alignment of the radio button and its label in the inline direction.
 * @cssproperty --forge-radio-direction - The direction of the radio button and its label.
 * @cssproperty --forge-radio-state-layer-size - The size of the radio button's state layer in the inline and block directions.
 * @cssproperty --forge-radio-state-layer-width - The width of the radio button's state layer.
 * @cssproperty --forge-radio-state-layer-height - The height of the radio button's state layer.
 * @cssproperty --forge-radio-state-layer-unchecked-color - The color of the radio button's state layer when unchecked.
 * @cssproperty --forge-radio-state-layer-checked-color - The color of the radio button's state layer when checked.
 * @cssproperty --forge-radio-state-layer-shape - The shape of the radio button's state layer.
 * @cssproperty --forge-radio-state-layer-dense-size - The size of the radio button's state layer when dense.
 * @cssproperty --forge-radio-state-layer-dense-width - The width of the radio button's state layer when dense.
 * @cssproperty --forge-radio-state-layer-dense-height - The height of the radio button's state layer when dense.
 * @cssproperty --forge-radio-disabled-opacity - The opacity of the radio button when disabled.
 * @cssproperty --forge-radio-animation-duration - The duration of the radio button's animations.
 * @cssproperty --forge-radio-animation-timing-function - The timing function of the radio button's animations.
 * @cssproperty --forge-radio-animation-delay - The delay of the radio button's animations.
 *
 * @csspart root - Styles the radio's root element.
 * @csspart background - Styles the border and background of the radio.
 * @csspart focus-indicator - Styles the focus indicator of the radio.
 * @csspart state-layer - Styles the state layer of the radio.
 *
 * @slot - This is a default/unnamed slot for the label text.
 */
let RadioComponent = class RadioComponent extends BaseRadioClass {
    static get observedAttributes() {
        return Object.values(RADIO_CONSTANTS.observedAttributes);
    }
    constructor() {
        super();
        attachShadowTemplate(this, template, styles);
        this[inputType] = 'radio';
        this._foundation = new RadioFoundation(new RadioAdapter(this));
    }
    connectedCallback() {
        super.connectedCallback();
        this[setDefaultAria]({
            role: 'radio',
            ariaChecked: this.checked ? 'true' : 'false',
            ariaDisabled: this.disabled ? 'true' : 'false',
            ariaRequired: this.required ? 'true' : 'false'
        });
        RadioGroupManager.syncRadioFocusableState(this);
        this._foundation.initialize();
        this._rootNode = this.getRootNode();
    }
    disconnectedCallback() {
        RadioGroupManager.syncRadioFocusableState(this, { ignoreSelf: true, rootNode: this._rootNode, form: this._latestAssociatedForm });
    }
    attributeChangedCallback(name, oldValue, newValue) {
        switch (name) {
            case RADIO_CONSTANTS.attributes.CHECKED:
                this._foundation.checked = coerceBoolean(newValue);
                break;
            case RADIO_CONSTANTS.attributes.DEFAULT_CHECKED:
                this._foundation.defaultChecked = coerceBoolean(newValue);
                break;
            case RADIO_CONSTANTS.attributes.VALUE:
                this.value = newValue;
                break;
            case RADIO_CONSTANTS.attributes.DENSE:
                this.dense = coerceBoolean(newValue);
                break;
            case RADIO_CONSTANTS.attributes.DISABLED:
                this.disabled = coerceBoolean(newValue);
                break;
            case RADIO_CONSTANTS.attributes.REQUIRED:
                this.required = coerceBoolean(newValue);
                break;
            case RADIO_CONSTANTS.attributes.READONLY:
                this.readonly = coerceBoolean(newValue);
                break;
            case RADIO_CONSTANTS.attributes.LABEL_POSITION:
                this.labelPosition = newValue;
                break;
        }
        super.attributeChangedCallback(name, oldValue, newValue);
    }
    [getFormValue]() {
        return this.checked ? this.value : null;
    }
    [getFormState]() {
        return this.checked ? 'checked' : 'unchecked';
    }
    formAssociatedCallback(form) {
        if (form) {
            this._latestAssociatedForm = form;
        }
    }
    formResetCallback() {
        RadioGroupManager.requestRadioGroupReset(this);
    }
    formStateRestoreCallback(state) {
        this.checked = state === 'checked';
    }
    labelClickedCallback() {
        this.click();
    }
    labelChangedCallback(value) {
        this[setDefaultAria]({ ariaLabel: value });
    }
    [tryCheck]() {
        return this._foundation.tryCheck();
    }
};
__decorate([
    FoundationProperty()
], RadioComponent.prototype, "checked", void 0);
__decorate([
    FoundationProperty()
], RadioComponent.prototype, "defaultChecked", void 0);
__decorate([
    FoundationProperty()
], RadioComponent.prototype, "value", void 0);
__decorate([
    FoundationProperty()
], RadioComponent.prototype, "dense", void 0);
__decorate([
    FoundationProperty()
], RadioComponent.prototype, "disabled", void 0);
__decorate([
    FoundationProperty()
], RadioComponent.prototype, "required", void 0);
__decorate([
    FoundationProperty()
], RadioComponent.prototype, "readonly", void 0);
__decorate([
    FoundationProperty()
], RadioComponent.prototype, "labelPosition", void 0);
RadioComponent = __decorate([
    CustomElement({
        name: RADIO_CONSTANTS.elementName,
        dependencies: [
            FocusIndicatorComponent,
            StateLayerComponent
        ]
    })
], RadioComponent);
export { RadioComponent };
