import { proxyCustomElement, HTMLElement, h, Host } from '@stencil/core/internal/client';
import { g as genId, a as getHostAttrs } from './index2.js';
import { d as defineCustomElement$2 } from './bs-label2.js';

const bsRadioCss = ".bs-boolean{display:inline-flex;align-items:center;font-size:var(--bs-text-base);font-weight:400;line-height:115%}.bs-boolean:where([data-size=\"sm\"]) input{width:var(--bs-text-xs);height:var(--bs-text-xs)}.bs-boolean label{font-size:var(--bs-text-base);font-weight:400;line-height:1.5;width:auto}.bs-boolean label{padding-inline-end:0.5em}.bs-boolean input+label{padding-inline:0.5em 0}.bs-boolean:where([data-size=\"sm\"]),.bs-boolean:where([data-size=\"sm\"]) label{font-size:var(--bs-text-xs)}:where(input[type=\"checkbox\"],input[type=\"radio\"]){--box-shadow:var(--bs-ink-base);appearance:none;background-color:var(--bg-base);box-shadow:inset 0 0 0 0.125rem var(--box-shadow);cursor:pointer;display:grid;height:1rem;margin:0;place-content:center;position:relative;width:1rem}:where(input[type=\"checkbox\"],input[type=\"radio\"]):focus-visible{box-shadow:inset 0 0 0 0.125rem var(--box-shadow), 0 0 0 2px var(--offset-color, var(--bs-bg-base)), 0 0 0 4px var(--outline-color, var(--bs-blue-base));outline:2px solid transparent}:where(input[type=\"checkbox\"]){border-radius:0.125rem}:where(input[type=\"radio\"]){border-radius:50%}input:where([type=\"checkbox\"])::before{--filled-size:1rem;--check-fill-color:var(--bs-blue-base);content:\"\";border-radius:0.125rem;box-shadow:inset var(--filled-size) var(--filled-size) var(--check-fill-color);height:var(--filled-size);visibility:hidden;width:var(--filled-size)}input:where([type=\"checkbox\"])::after{border:solid var(--bs-white);border-width:0 0.125rem 0.125rem 0;content:\"\";height:0.75em;left:50%;position:absolute;top:50%;transform-origin:center;transform:translate(-50%, -60%) rotate(45deg);visibility:hidden;width:0.375em}input:where([type=\"checkbox\"]):where(:indeterminate)::after{border:none;background-color:var(--bs-white);height:0.125rem;transform:translate(-50%, -0.0625rem) rotate(0deg);width:0.625em}input:where([type=\"radio\"])::before{--filled-size:1rem;--radio-fill-color:var(--bs-blue-base);background-color:var(--radio-fill-color);border-radius:50%;box-sizing:content-box;content:\"\";height:var(--filled-size);visibility:hidden;width:var(--filled-size)}input:where([type=\"radio\"])::after{--inner-size:0.375rem;--inner-fill-color:var(--bs-white);background-color:var(--inner-fill-color);border-radius:50%;box-sizing:content-box;content:\"\";height:var(--inner-size);left:50%;position:absolute;top:50%;transform:translate(-50%, -50%);visibility:hidden;width:var(--inner-size)}input:where([type=\"checkbox\"]:checked,[type=\"checkbox\"]:indeterminate,[type=\"radio\"]:checked)::before,input:where([type=\"checkbox\"]:checked,[type=\"checkbox\"]:indeterminate,[type=\"radio\"]:checked)::after{visibility:visible}.bs-boolean:where([data-size=\"sm\"]) input::before{--filled-size:var(--bs-text-xs)}.bs-boolean:where([data-size=\"sm\"]) input[type=checkbox]::after{height:0.5625rem;width:0.3125rem}.bs-boolean:where([data-size=\"sm\"]) input[type=checkbox]:where(:indeterminate)::after{height:0.125rem;width:0.75em}.bs-boolean:where([data-size=\"sm\"]) input[type=radio]::after{--inner-size:0.25rem}input:where([type=\"checkbox\"],[type=\"radio\"]):disabled{--box-shadow:var(--bs-bg-disabled);background-color:transparent;cursor:default}input:where([type=\"checkbox\"]):checked:disabled::before,input:where([type=\"checkbox\"]):indeterminate:disabled::before{--check-fill-color:var(--bs-bg-disabled)}input:where([type=\"radio\"]):checked:disabled::before{--radio-fill-color:var(--bs-bg-disabled)}input:where([type=\"checkbox\"],[type=\"radio\"])[data-error]{--box-shadow:var(--bs-red-base);--outline-color:var(--bs-red-base)}bs-radio{display:inline-block;}bs-radio :where([data-required]){color:var(--bs-ink-red);font-weight:var(--bs-font-bold, 600)}bs-radio :where([data-disabled],[data-disabled] [data-required]){color:var(--bs-gray-400)}bs-radio :where(.box) :is(input,textarea,select):where(:focus-visible){--offset-color:var(--bs-bg-medium)}bs-radio :where(.box[data-invert]) :is(input,textarea,select):where(:focus-visible){--offset-color:var(--bs-bg-invert-base)}bs-radio :is(input,select,textarea):where([data-error]){--input-border:var(--bs-ink-red)}bs-radio :where(fieldset){border:none;margin-left:0;margin-right:0;padding:0}bs-radio :where(fieldset legend){margin-bottom:0.25rem;padding:0}:where(.box) :where(input,textarea,select):focus{--offset-color:var(--bs-bg-subtle)}:where(.box[data-invert]) :where(input,textarea,select):focus{--offset-color:var(--bs-bg-invert)}";

const BsRadio$1 = /*@__PURE__*/ proxyCustomElement(class BsRadio extends HTMLElement {
  constructor() {
    super();
    this.__registerHost();
    /** Native attributes to pass through to the input element. */
    this.attrs = {};
    this.label = undefined;
    this.checked = false;
    this.disabled = false;
    this.error = undefined;
    this.inputId = undefined;
    this.passAttrs = '';
    this.required = undefined;
    this.size = undefined;
    this.value = undefined;
  }
  get inputIdAttr() {
    return this.inputId || this.inputIdGen;
  }
  componentWillLoad() {
    this.inputIdGen = this.inputId || genId();
    this.attrs = getHostAttrs(this.hostEl, [
      'name',
      ...this.passAttrs.split(',')
    ]);
  }
  render() {
    return (h(Host, { class: 'bs-boolean', "data-size": this.size }, h("input", Object.assign({ checked: this.checked, disabled: this.disabled, id: this.inputIdAttr, required: this.required, type: "radio", value: this.value, "data-error": this.error }, this.attrs)), this.label && (h("bs-label", { for: this.inputIdAttr, disabled: this.disabled, required: this.required }, this.label))));
  }
  get hostEl() { return this; }
  static get style() { return bsRadioCss; }
}, [0, "bs-radio", {
    "label": [1],
    "checked": [4],
    "disabled": [4],
    "error": [4],
    "inputId": [1, "input-id"],
    "passAttrs": [1, "pass-attrs"],
    "required": [4],
    "size": [1],
    "value": [1]
  }]);
function defineCustomElement$1() {
  if (typeof customElements === "undefined") {
    return;
  }
  const components = ["bs-radio", "bs-label"];
  components.forEach(tagName => { switch (tagName) {
    case "bs-radio":
      if (!customElements.get(tagName)) {
        customElements.define(tagName, BsRadio$1);
      }
      break;
    case "bs-label":
      if (!customElements.get(tagName)) {
        defineCustomElement$2();
      }
      break;
  } });
}

const BsRadio = BsRadio$1;
const defineCustomElement = defineCustomElement$1;

export { BsRadio, defineCustomElement };

//# sourceMappingURL=bs-radio.js.map