"use strict";
var __webpack_require__ = {};
(()=>{
    __webpack_require__.d = (exports1, definition)=>{
        for(var key in definition)if (__webpack_require__.o(definition, key) && !__webpack_require__.o(exports1, key)) Object.defineProperty(exports1, key, {
            enumerable: true,
            get: definition[key]
        });
    };
})();
(()=>{
    __webpack_require__.o = (obj, prop)=>Object.prototype.hasOwnProperty.call(obj, prop);
})();
(()=>{
    __webpack_require__.r = (exports1)=>{
        if ("u" > typeof Symbol && Symbol.toStringTag) Object.defineProperty(exports1, Symbol.toStringTag, {
            value: 'Module'
        });
        Object.defineProperty(exports1, '__esModule', {
            value: true
        });
    };
})();
var __webpack_exports__ = {};
__webpack_require__.r(__webpack_exports__);
__webpack_require__.d(__webpack_exports__, {
    renderRadioButton: ()=>renderRadioButton
});
const external_lit_namespaceObject = require("lit");
const if_defined_js_namespaceObject = require("lit/directives/if-defined.js");
const ref_js_namespaceObject = require("lit/directives/ref.js");
const multi_class_map_cjs_namespaceObject = require("../../directives/multi-class-map.cjs");
const ripple_utils_cjs_namespaceObject = require("../../utils/ripple-utils.cjs");
const external_button_style_cjs_namespaceObject = require("./button-style.cjs");
const renderRadioButton = ({ props })=>{
    const classNames = {
        'btn-radio': true,
        selected: Boolean(props.checked),
        ...props.class && {
            [props.class]: true
        },
        ...props.style && {
            [(0, external_button_style_cjs_namespaceObject.getClassNameForButtonStyle)(props.style)]: true
        }
    };
    const onMouseDown = async (e)=>{
        if (props.style) {
            const rippleColor = (0, external_button_style_cjs_namespaceObject.getRippleColorForButtonStyle)(props.style);
            await (0, ripple_utils_cjs_namespaceObject.createRipple)(e, {
                color: rippleColor
            });
        }
    };
    const handleKeyDown = async (event)=>{
        if (false !== props.selectWhenFocused) return;
        const { key } = event;
        const radioGroup = event.currentTarget.parentNode;
        if (!radioGroup || !isArrowKey(key)) return;
        event.preventDefault();
        const buttons = getRadioButtons(radioGroup);
        const currentIndex = getCurrentIndex(buttons, event.currentTarget);
        const newIndex = getNewIndex(key, currentIndex, buttons.length);
        if (buttons[newIndex]) if (props.onFocusCallback) await props.onFocusCallback(buttons, buttons[currentIndex], buttons[newIndex]);
        else buttons[newIndex].focus();
    };
    const isArrowKey = (key)=>[
            'ArrowLeft',
            'ArrowRight',
            'ArrowDown',
            'ArrowUp'
        ].includes(key);
    const getRadioButtons = (radioGroup)=>Array.from(radioGroup.querySelectorAll('[type="radio"]'));
    const getCurrentIndex = (buttons, currentButton)=>buttons.indexOf(currentButton);
    const getNewIndex = (key, currentIndex, length)=>{
        switch(key){
            case 'ArrowLeft':
            case 'ArrowUp':
                return (currentIndex - 1 + length) % length;
            case 'ArrowRight':
            case 'ArrowDown':
                return (currentIndex + 1) % length;
            default:
                return currentIndex;
        }
    };
    const onChange = (e)=>{
        const input = e.currentTarget;
        if (input.checked && props.onChecked) props.onChecked();
    };
    const radioButtonRef = props.ref ? (0, ref_js_namespaceObject.ref)(props.ref) : external_lit_namespaceObject.nothing;
    return (0, external_lit_namespaceObject.html)`
    <input
      type="radio"
      name=${props.groupName}
      class=${(0, multi_class_map_cjs_namespaceObject.multiClassMap)(classNames)}
      value=${(0, if_defined_js_namespaceObject.ifDefined)(props.text)}
      part=${(0, if_defined_js_namespaceObject.ifDefined)(props.part)}
      aria-label=${(0, if_defined_js_namespaceObject.ifDefined)(props.ariaLabel ?? props.text)}
      aria-current=${(0, if_defined_js_namespaceObject.ifDefined)(props.ariaCurrent)}
      aria-roledescription=${(0, if_defined_js_namespaceObject.ifDefined)(props.ariaRoleDescription)}
      .checked=${Boolean(props.checked)}
      ?checked=${Boolean(props.checked)}
      .key=${props.key}
      @focus=${props.onFocus}
      @change=${onChange}
      @keydown=${handleKeyDown}
      @mousedown=${onMouseDown}
      ${radioButtonRef}
    />
  `;
};
exports.renderRadioButton = __webpack_exports__.renderRadioButton;
for(var __rspack_i in __webpack_exports__)if (-1 === [
    "renderRadioButton"
].indexOf(__rspack_i)) exports[__rspack_i] = __webpack_exports__[__rspack_i];
Object.defineProperty(exports, '__esModule', {
    value: true
});
