import { r as registerInstance, h, H as Host, g as getElement } from './index-92f6d7ee.js';
import { a as getHostAttrs } from './index-7c9378a9.js';
import './v4-23648a96.js';

const bsInputCss = ":where(bs-input){display:inline-block;width:100%}bs-input{}bs-input :where(label,legend){--label-color:var(--bs-ink-base);color:var(--label-color);display:inline-block;font-size:var(--bs-text-sm);font-weight:600;line-height:var(--bs-leading-base);width:100%}bs-input :where([data-required]){color:var(--bs-ink-red)}bs-input :where(label[data-disabled],[data-disabled] [data-required],[data-disabled] label){--label-color:var(--bs-ink-disabled)}bs-input :where([data-required]){color:var(--bs-ink-red);font-weight:var(--bs-font-bold, 600)}bs-input :where([data-disabled],[data-disabled] [data-required]){color:var(--bs-gray-400)}bs-input :where(.box) :is(input,textarea,select):where(:focus-visible){--offset-color:var(--bs-bg-medium)}bs-input :where(.box[data-invert]) :is(input,textarea,select):where(:focus-visible){--offset-color:var(--bs-bg-invert-base)}bs-input :is(input,select,textarea):where([data-error]){--input-border:var(--bs-ink-red)}bs-input :where(fieldset){border:none;margin-left:0;margin-right:0;padding:0}bs-input :where(fieldset legend){margin-bottom:0.25rem;padding:0}bs-input :where(label+input,label>input):where(:not([type=\"checkbox\"],[type=\"radio\"])),bs-input :where(label+textarea,label>textarea),bs-input :where(label+select,label>select){margin-top:0.25rem}bs-input input:where(:not([type=\"checkbox\"],[type=\"radio\"],[type=\"file\"],[type=\"range\"])),bs-input textarea,bs-input select{--input-bg:var(--bs-bg-base);--input-border:var(--bs-violet-medium);appearance:none;background-color:var(--input-bg);border-color:var(--input-border);border-radius:0.25rem;border-style:solid;border-width:var(--input-border-width, 1px);caret-color:var(--bs-blue-base);color:var(--bs-ink-base);font-size:var(--bs-text-base);font-weight:400;height:2.5rem;line-height:var(--bs-leading-base);min-height:2.5rem;padding-inline:0.75rem;width:100%}bs-input input:where([type=\"text\"],[type=\"email\"],[type=\"url\"]),bs-input select{text-overflow:ellipsis}bs-input textarea{height:auto;padding-block:0.5rem;resize:vertical}bs-input :is(input,textarea,select)::placeholder{color:var(--bs-violet-lightest)}bs-input :is(input,textarea,select):where(:focus-visible)::placeholder{opacity:0}bs-input :is(input:where(:not([type=\"checkbox\"],[type=\"radio\"])),textarea,select):where(:focus-visible){--input-border:var(--bs-blue-base);outline-width:0px}bs-input :is(input:where(:not([type=\"checkbox\"],[type=\"radio\"])),textarea,select):where(:disabled){--input-border:var(--bs-ink-disabled);--input-bg:var(--bs-bg-disabled);color:var(--bs-ink-disabled)}bs-input :is(input,select,textarea):where([data-error]){--input-border:var(--bs-ink-red)}bs-input :has(>textarea:only-child){display:block;line-height:0}bs-input :where(select:disabled){opacity:1}bs-input :is(input,textarea,select):disabled::placeholder,bs-input :is(input,textarea,select)[disabled]::placeholder{color:var(--bs-ink-disabled);opacity:1}bs-input select{background-image:url(\"data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='none' viewBox='0 0 16 16'%3E%3Cpath fill='%230A0B19' d='M8.048 13.375a.745.745 0 0 1-.526-.217L0 5.686l1.053-1.061 6.995 6.95 6.897-6.85 1.053 1.06-7.423 7.373a.745.745 0 0 1-.527.217Z'/%3E%3C/svg%3E\");background-position:right 0.75rem center;background-repeat:no-repeat;background-size:1em 1em;padding-right:var(--bs-space-9)}bs-input .dark select{background-image:url(\"data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='none' viewBox='0 0 16 16'%3E%3Cpath fill='%23ffffff' d='M8.048 13.375a.745.745 0 0 1-.526-.217L0 5.686l1.053-1.061 6.995 6.95 6.897-6.85 1.053 1.06-7.423 7.373a.745.745 0 0 1-.527.217Z'/%3E%3C/svg%3E\")}bs-input .dark select:disabled{background-image:url(\"data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='none' viewBox='0 0 16 16'%3E%3Cpath fill='%23555775' d='M8.048 13.375a.745.745 0 0 1-.526-.217L0 5.686l1.053-1.061 6.995 6.95 6.897-6.85 1.053 1.06-7.423 7.373a.745.745 0 0 1-.527.217Z'/%3E%3C/svg%3E\")}bs-label+bs-input input:not([type^=checkbox],[type^=radio]){margin-top:0.25rem}:where(.box) bs-input :where(input,textarea,select):focus{--offset-color:var(--bs-bg-subtle)}:where(.box[data-invert]) bs-input :where(input,textarea,select):focus{--offset-color:var(--bs-bg-invert)}";

const BsInput = class {
  constructor(hostRef) {
    registerInstance(this, hostRef);
    /** Native attributes to pass through to the input element. */
    this.attrs = {};
    this.disabled = false;
    this.error = undefined;
    this.inputId = undefined;
    this.passAttrs = '';
    this.placeholder = undefined;
    this.required = undefined;
    this.type = 'text';
    this.value = undefined;
    this.hintId = undefined;
  }
  get aria() {
    return { [this.error ? 'aria-errormessage' : 'aria-describedby']: this.hintId };
  }
  componentWillLoad() {
    this.attrs = getHostAttrs(this.hostEl, [
      'autocomplete',
      'max',
      'min',
      'maxlength',
      'minlength',
      'name',
      ...this.passAttrs.split(',')
    ]);
  }
  render() {
    return (h(Host, null, h("input", Object.assign({ id: this.inputId, disabled: this.disabled, placeholder: this.placeholder, required: this.required, type: this.type, value: this.value, "data-error": this.error }, Object.assign(Object.assign({}, this.attrs), this.aria)))));
  }
  get hostEl() { return getElement(this); }
};
BsInput.style = bsInputCss;

export { BsInput as bs_input };

//# sourceMappingURL=bs-input.entry.js.map